ontimize-web-ngx 15.6.1 → 15.7.0

package/fesm2020/ontimize-web-ngx.mjs

@@ -86,7 +86,7 @@ import { MatSliderModule } from '@angular/material/slider';
 import * as i1$6 from '@angular/material/sort';
 import { MatSortModule, MatSort, MatSortHeader, matSortAnimations, MAT_SORT_HEADER_INTL_PROVIDER } from '@angular/material/sort';
 import * as i14 from '@angular/material/table';
-import { MatTableModule, MatRow } from '@angular/material/table';
+import { MatTableModule, MatTable, MatRow } from '@angular/material/table';
 import * as i6$1 from '@angular/material/tabs';
 import { MatTabsModule, MatTabGroup, MatTab } from '@angular/material/tabs';
 import { MatMomentDateModule, MomentDateAdapter } from '@angular/material-moment-adapter';
@@ -109,7 +109,7 @@ import * as i5$4 from '@angular/cdk/table';
 import { CdkTableModule } from '@angular/cdk/table';
 import * as i3$7 from '@angular/cdk/a11y';
 import { FlatTreeControl, CdkTreeModule } from '@angular/cdk/tree';
-import * as i10$1 from '@angular/material/tree';
+import * as i11$2 from '@angular/material/tree';
 import { MatTreeModule } from '@angular/material/tree';
 
 class Base64 {
@@ -1340,6 +1340,8 @@ const MAP = {
         'TABLE.FILTER_BY_COLUMN.LABEL_DATA': 'Filter values',
         'TABLE.FILTER_BY_COLUMN.CURRENT_PAGE': 'Current page',
         'TABLE.FILTER_BY_COLUMN.ALL_PAGE': 'All pages',
+        'TABLE.FILTER_BY_COLUMN.DEFAULT_LOCKED_MESSAGE': 'Filtering is not available for this column',
+        'TABLE.FILTER_LOCKED': 'Filter locked',
         'TABLE.FILTER': 'Filter',
         'TABLE.FILTER.CASE_SENSITIVE': 'Match uppercase and lowercase',
         'TABLE.EMPTY': 'No results found',
@@ -1518,7 +1520,8 @@ const MAP = {
         'EXPORT.DIALOG.FILE_NAME': 'File name',
         'EXPORT.DIALOG.EXPORT_BUTTON': "Export",
         'EXPORT.DIALOG.ADVANCED_OPTIONS': " Advanced options",
-        'EXPORT.DIALOG.FILE_NAME.PLACEHOLDER': "You can indicate a file name"
+        'EXPORT.DIALOG.FILE_NAME.PLACEHOLDER': "You can indicate a file name",
+        'O_TREE.LOAD_MORE': 'Load more ...'
     },
     es: {
         'LANGUAGE': 'Idioma',
@@ -1650,6 +1653,8 @@ const MAP = {
         'TABLE.FILTER_BY_COLUMN.LABEL_DATA': 'Filtrar valores sobre',
         'TABLE.FILTER_BY_COLUMN.CURRENT_PAGE': 'Página actual',
         'TABLE.FILTER_BY_COLUMN.ALL_PAGE': 'Todos los datos',
+        'TABLE.FILTER_BY_COLUMN.DEFAULT_LOCKED_MESSAGE': 'No está disponible el filtrado para esta columna',
+        'TABLE.FILTER_LOCKED': 'Filtro bloqueado',
         'TABLE.FILTER': 'Filtrar',
         'TABLE.FILTER.CASE_SENSITIVE': 'Coincidir mayúsculas y minúsculas',
         'TABLE.EMPTY': 'No se han obtenido resultados',
@@ -1820,7 +1825,8 @@ const MAP = {
         'EXPORT.DIALOG.ADVANCED_OPTIONS': " Opciones Avanzadas",
         'EXPORT.DIALOG.FILE_NAME.PLACEHOLDER': "Puede indicar un nombre para el fichero",
         'DATERANGE.PLACEHOLDER_STARTDATE': 'Fecha inicio',
-        'DATERANGE.PLACEHOLDER_ENDDATE': 'Fecha fin'
+        'DATERANGE.PLACEHOLDER_ENDDATE': 'Fecha fin',
+        'O_TREE.LOAD_MORE': 'Ver más ...'
     },
     pt: {
         'LANGUAGE': 'Idioma',
@@ -1951,6 +1957,8 @@ const MAP = {
         'TABLE.FILTER_BY_COLUMN.LABEL_DATA': 'Filtrar valores ativados',
         'TABLE.FILTER_BY_COLUMN.CURRENT_PAGE': 'Página atual',
         'TABLE.FILTER_BY_COLUMN.ALL_PAGE': 'Todos os dados',
+        'TABLE.FILTER_BY_COLUMN.DEFAULT_LOCKED_MESSAGE': 'A filtragem não está disponível para esta coluna',
+        'TABLE.FILTER_LOCKED': 'Filtro bloqueado',
         'TABLE.FILTER': 'Filtrar',
         'TABLE.FILTER.CASE_SENSITIVE': 'Coincidir maiúsculas e minúsculas',
         'TABLE.EMPTY': 'Nenhum resultado encontrado.',
@@ -2101,7 +2109,8 @@ const MAP = {
         'REPORT.COLUMN.TRUEVALUE': 'Sim',
         'REPORT.COLUMN.FALSEVALUE': 'Não',
         'DATERANGE.PLACEHOLDER_STARTDATE': 'Data de início',
-        'DATERANGE.PLACEHOLDER_ENDDATE': 'Data de término'
+        'DATERANGE.PLACEHOLDER_ENDDATE': 'Data de término',
+        'O_TREE.LOAD_MORE': 'Carregar mais ...'
     }
 };
 
@@ -14250,6 +14259,95 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             type: Injectable
         }] });
 
+class OTreeComponentStateClass extends DefaultServiceComponentStateClass {
+}
+
+class OTreeComponentStateService extends AbstractComponentStateService {
+    initialize(component) {
+        this.state = new OTreeComponentStateClass();
+        super.initialize(component);
+    }
+    initializeState(state) {
+        super.initializeState(state);
+    }
+    getDataToStore() {
+        const dataToStore = {};
+        const propertiesKeys = [
+            'quick-filter',
+            'page',
+            'selection'
+        ];
+        Object.assign(dataToStore, this.getTreePropertiesToStore(propertiesKeys));
+        return dataToStore;
+    }
+    getTreePropertiesToStore(properties) {
+        const result = {};
+        properties.forEach(prop => {
+            Object.assign(result, this.getTreePropertyToStore(prop));
+        });
+        return result;
+    }
+    getTreePropertyToStore(property) {
+        let result = {};
+        switch (property) {
+            case 'quick-filter':
+                result = this.getQuickFilterState();
+                break;
+            case 'page':
+                result = this.getPageState();
+                break;
+            case 'selection':
+                result['selection'] = this.getSelectionState();
+                break;
+        }
+        return result;
+    }
+    getQuickFilterState() {
+        return {
+            'filter': this.component.quickFilterComponent ? this.component.quickFilterComponent.getValue() : ''
+        };
+    }
+    getPageState() {
+        const result = {};
+        if (this.component.matpaginator) {
+            result['query-rows'] = this.component.matpaginator.pageSize;
+        }
+        else if (this.component.state.queryRows) {
+            result['query-rows'] = this.component.state.queryRows;
+        }
+        else {
+            result['query-rows'] = this.component.originalQueryRows;
+        }
+        if (this.component.currentPage > 0) {
+            result.currentPage = this.component.currentPage;
+        }
+        if (this.component.pageable) {
+            result.totalQueryRecordsNumber = this.component.state.totalQueryRecordsNumber;
+            result.queryRecordOffset = Math.max((this.component.state.queryRecordOffset - this.component.dataSource.data.length), (this.component.state.queryRecordOffset - this.component.queryRows));
+        }
+        return result;
+    }
+    getSelectionState() {
+        const selection = [];
+        if (this.component) {
+            const tableKeys = this.component.getKeys();
+            this.component.getSelectedItems().forEach(item => {
+                const data = {};
+                tableKeys.forEach(key => {
+                    data[key] = item[key];
+                });
+                selection.push(data);
+            });
+        }
+        return selection;
+    }
+}
+OTreeComponentStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTreeComponentStateService, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+OTreeComponentStateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTreeComponentStateService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTreeComponentStateService, decorators: [{
+            type: Injectable
+        }] });
+
 class OTranslateHttpLoader extends TranslateHttpLoader {
     constructor(httpClient, prefix = OTranslateService.ASSETS_PATH, suffix = OTranslateService.ASSETS_EXTENSION, injector) {
         super(httpClient, prefix, suffix);
@@ -17670,6 +17768,15 @@ class AbstractOServiceBaseComponent {
         const context = this.getContextComponent();
         return this.getParentKeysFromContext(this._pKeysEquiv, context);
     }
+    getForm() {
+        return this.form;
+    }
+    getParentKeysEquivalence() {
+        return this._pKeysEquiv;
+    }
+    getDataService() {
+        return this.dataService;
+    }
     updateStateStorage() {
         if (this.localStorageService && this.storeState && !this.alreadyStored) {
             this.alreadyStored = true;
@@ -27754,10 +27861,24 @@ class OListComponent extends AbstractOServiceComponent {
     }
     ngOnInit() {
         this.initialize();
+        this.loadPermissions();
+        this.setupDeleteButtonSubscription();
+    }
+    loadPermissions() {
         this.permissions = this.permissionsService.getListPermissions(this.oattr, this.actRoute);
         this.actionsPermissions = this.getActionsPermissions(this.permissions);
         this.setButtonPermissions(this.actionsPermissions);
     }
+    setupDeleteButtonSubscription() {
+        const deletePermission = this.getPermissionByAttr('delete', this.actionsPermissions);
+        const shouldSubscribe = !Util.isDefined(deletePermission) || (deletePermission.visible && deletePermission.enabled);
+        if (shouldSubscribe) {
+            const subscription = this.selection.changed.subscribe(() => {
+                this.enabledDeleteButton = !this.selection.isEmpty();
+            });
+            this.subscription.add(subscription);
+        }
+    }
     ngAfterViewInit() {
         super.afterViewInit();
         this.filterCaseSensitive = Util.isDefined(this.state.filterCaseSensitive) ?
@@ -28819,19 +28940,26 @@ class OTableGroupedRow {
     }
 }
 
-class OTableBase {
-}
-
 class OTableFilterByColumnService {
     constructor() { }
-    getColumnDataUsingRenderer(column, tableData) {
+    getColumnDataUsingRenderer(column, tableData, visibleColumns, separator) {
+        const useCustomRender = Array.isArray(visibleColumns) && visibleColumns.length > 0;
         return tableData.map(row => {
-            return column.renderer?.getCellData?.(row[column.attr], row) ?? row[column.attr];
+            if (useCustomRender) {
+                return visibleColumns.map(attr => row[attr] ?? '').join(separator);
+            }
+            else {
+                const rawValue = row[column.attr];
+                return column.renderer?.getCellData?.(rawValue, row) ?? rawValue;
+            }
         });
     }
-    parseListData(filter, column, tableData, isPageable, sourceData) {
+    parseListData(filter, column, tableData, isPageable, filterColumnDefinition) {
         const columnData = [];
-        const colRenderedValues = this.getColumnDataUsingRenderer(column, tableData);
+        const visibleColumns = filterColumnDefinition.visibleColumns;
+        const separator = filterColumnDefinition.separator;
+        const sourceData = filterColumnDefinition.filterValuesInData;
+        const colRenderedValues = this.getColumnDataUsingRenderer(column, tableData, visibleColumns, separator);
         const valueColumn = column.valueColumn ?? column.attr;
         const colValues = tableData.map((elem) => Util.getValueFromPath(elem, valueColumn));
         if (Util.isDefined(filter?.availableValues)) {
@@ -28854,16 +28982,70 @@ class OTableFilterByColumnService {
         });
         return columnData;
     }
-    applySelectedValuesToFilter(column, tableData, filter, selectedValues, sourceData, isPageable, getComponentFilterFn) {
+    applySelectedValuesToFilter(column, tableData, filter, selectedValues, filterByColumnDefinition, isPageable, getComponentFilterFn) {
         filter.operator = ColumnValueFilterOperator.IN;
         filter.values = selectedValues.map(item => item.value);
-        if (sourceData === 'current-page') {
-            filter.availableValues = this.parseListData(filter, column, filter.availableValues ?? tableData, isPageable, sourceData);
+        const sourceData = filterByColumnDefinition.filterValuesInData;
+        const effectiveSourceData = sourceData ?? 'current-page';
+        if (effectiveSourceData) {
+            filter.availableValues = this.parseListData(filter, column, filter.availableValues ?? tableData, isPageable, filterByColumnDefinition);
         }
         else {
             filter.filterExpresion = filter.filterExpresion || getComponentFilterFn();
         }
     }
+    getDataForColumnFilter(injector, table, column, filterColumnDefinition) {
+        if (filterColumnDefinition.filterValuesInData === 'current-page') {
+            return of(table.getValue());
+        }
+        if (table.pageable) {
+            const previousFilter = table.dataSource.getColumnValueFilterByAttr(column.attr);
+            const kv = previousFilter?.filterExpresion || table.getComponentFilter();
+            const av = [column.attr];
+            const sqlTypes = Util.isDefined(kv) && !Util.isObjectEmpty(kv)
+                ? table.getSqlTypes()
+                : {};
+            const entity = filterColumnDefinition.entity ?? table.entity;
+            const columnQueryArgs = [kv, av, entity, sqlTypes];
+            const service = this.configureService(injector, filterColumnDefinition, table);
+            const queryMethodName = filterColumnDefinition.queryMethod ?? table.queryMethod;
+            if (service && queryMethodName && typeof service[queryMethodName] === 'function') {
+                const result$ = service[queryMethodName](...columnQueryArgs);
+                return new Observable(observer => {
+                    result$.subscribe({
+                        next: res => observer.next(res?.isSuccessful() ? res.data : []),
+                        error: err => {
+                            console.error('[FilterService] Error al consultar datos del filtro:', err);
+                            observer.next([]);
+                        },
+                        complete: () => observer.complete()
+                    });
+                });
+            }
+            return of([]);
+        }
+        return of(table.getAllValues());
+    }
+    configureService(injector, filterColumnDefinition, tableEntity) {
+        const service = filterColumnDefinition.service;
+        const serviceType = filterColumnDefinition.serviceType;
+        const entity = filterColumnDefinition.entity ?? tableEntity.entity;
+        if ((service || serviceType)) {
+            let configureServiceArgs = { injector: injector, baseService: OntimizeService, entity: entity, service: service, serviceType: serviceType };
+            return FactoryUtil.configureService(configureServiceArgs);
+        }
+        else {
+            return tableEntity.getDataService();
+        }
+    }
+    initializeColumnFilterData(filter, column, tableData, isPageable, filterColumnDefinition) {
+        const columnData = this.parseListData(filter, column, tableData, isPageable, filterColumnDefinition);
+        const selectedValues = filter?.values ?? [];
+        for (const item of columnData) {
+            item.selected = selectedValues.includes(item.value);
+        }
+        return columnData;
+    }
 }
 OTableFilterByColumnService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableFilterByColumnService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
 OTableFilterByColumnService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableFilterByColumnService });
@@ -28871,6 +29053,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             type: Injectable
         }], ctorParameters: function () { return []; } });
 
+class OTableBase {
+}
+
 const DEFAULT_TABLE_CONTEXT_MENU_INPUTS = [
     'contextMenu: context-menu',
     'showInsert: insert',
@@ -29049,15 +29234,21 @@ class OTableContextMenuComponent {
     filterByValue() {
         const filterService = this.injector.get(OTableFilterByColumnService);
         const columnAttr = this.column.attr;
-        const sourceDataType = this.table.getSourceDataByFilterColumn(this.column);
-        const tableData = this.table.getValue();
-        const selectedValue = this.row[columnAttr];
-        const filter = this.table.dataSource.getColumnValueFilterByAttr(this.column.attr) ??
-            this.createColumnValueFilter(columnAttr, selectedValue, sourceDataType);
-        let columnData = filterService.parseListData(filter, this.column, tableData, this.table.pageable, sourceDataType);
-        const selectedValues = this.getSelectedValues(columnData, selectedValue);
-        filterService.applySelectedValuesToFilter(this.column, tableData, filter, selectedValues, sourceDataType, this.table.pageable, () => this.table.getComponentFilter());
-        this.table.filterByColumn(filter);
+        const filterByColumnDefinition = this.table.getFilterColumnByAttr(this.column.attr);
+        const sourceDataType = filterByColumnDefinition.filterValuesInData;
+        const visibleColumns = filterByColumnDefinition.visibleColumns;
+        filterService.getDataForColumnFilter(this.injector, this.table, this.column, filterByColumnDefinition).subscribe(tableData => {
+            let selectedValue = this.row[columnAttr];
+            if (sourceDataType !== 'current-page' && visibleColumns?.length > 0) {
+                selectedValue = tableData.filter(registro => visibleColumns.some(prop => registro[prop] === selectedValue));
+            }
+            const filter = this.table.dataSource.getColumnValueFilterByAttr(this.column.attr) ??
+                this.createColumnValueFilter(columnAttr, selectedValue, sourceDataType);
+            let columnData = filterService.parseListData(filter, this.column, tableData, this.table.pageable, filterByColumnDefinition);
+            const selectedValues = this.getSelectedValues(columnData, selectedValue);
+            filterService.applySelectedValuesToFilter(this.column, tableData, filter, selectedValues, filterByColumnDefinition, this.table.pageable, () => this.table.getComponentFilter());
+            this.table.filterByColumn(filter);
+        });
     }
     createColumnValueFilter(attr, value, sourceData) {
         return {
@@ -30164,9 +30355,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                     args: [MAT_DIALOG_DATA]
                 }] }]; } });
 
-const CUSTOM_FILTERS_OPERATORS = [ColumnValueFilterOperator.LESS_EQUAL, ColumnValueFilterOperator.MORE_EQUAL, ColumnValueFilterOperator.BETWEEN, ColumnValueFilterOperator.EQUAL];
+const CUSTOM_FILTERS_OPERATORS = new Set([ColumnValueFilterOperator.LESS_EQUAL, ColumnValueFilterOperator.MORE_EQUAL, ColumnValueFilterOperator.BETWEEN, ColumnValueFilterOperator.EQUAL]);
 class OTableFilterByColumnDataDialogComponent {
-    constructor(dialogRef, filterService, data) {
+    constructor(injector, dialogRef, filterService, data) {
+        this.injector = injector;
         this.dialogRef = dialogRef;
         this.filterService = filterService;
         this.acceptAction = TableFilterByColumnDialogResult.ACCEPT;
@@ -30186,41 +30378,43 @@ class OTableFilterByColumnDataDialogComponent {
         this.listDataSubject = new BehaviorSubject([]);
         this._listData = this.listDataSubject.asObservable();
         this.selection = new SelectionModel(true, [], true, this.compareOptions());
-        if (data.column) {
-            this.column = data.column;
-        }
+        this.initFromData(data);
+    }
+    initFromData(data) {
+        this.column = data.column;
         this.table = data.table;
         this.initialize();
+        this.getData();
     }
     initialize() {
-        this.showFilterValuesOption = this.table.paginationControls;
-        this.sourceData = this.table.getSourceDataByFilterColumn(this.column);
-        this.mode = this.table.oTableColumnsFilterComponent ? this.table.oTableColumnsFilterComponent.mode : 'default';
-        this.isDefaultFilterSubject.next(this.mode === 'default');
-        this.isCustomFilterSubject.next(this.mode === 'custom');
-        this.previousFilter = this.table.dataSource.getColumnValueFilterByAttr(this.column.attr) || {
-            attr: undefined,
+        const { paginationControls, oTableColumnsFilterComponent, dataSource } = this.table;
+        this.showFilterValuesOption = paginationControls;
+        this.filterColumnDefinition = this.table.getFilterColumnByAttr(this.column.attr);
+        const { filterValuesInData, separator, visibleColumns } = this.filterColumnDefinition;
+        this.sourceData = filterValuesInData;
+        this.separator = separator;
+        this.visibleColumnsArray = visibleColumns;
+        this.mode = oTableColumnsFilterComponent?.mode ?? 'default';
+        this.preloadValues = oTableColumnsFilterComponent?.preloadValues ?? true;
+        this.activeSortDirection = this.table.getSortFilterColumn(this.column) ?? '';
+        this.startView = this.table.getStartViewFilterColumn(this.column) ?? 'month';
+        this.previousFilter = dataSource.getColumnValueFilterByAttr(this.column.attr) ?? this.createEmptyFilter();
+        const isCustom = CUSTOM_FILTERS_OPERATORS.has(this.previousFilter.operator);
+        this.isCustomFilterSubject.next(isCustom);
+        this.isDefaultFilterSubject.next(!isCustom);
+    }
+    createEmptyFilter() {
+        return {
+            attr: this.column.attr,
             operator: undefined,
             values: undefined,
             availableValues: undefined,
             filterExpresion: undefined,
             filterValuesInData: this.sourceData
         };
-        if (Util.isDefined(this.previousFilter.operator)) {
-            this.isCustomFilterSubject.next(CUSTOM_FILTERS_OPERATORS.indexOf(this.previousFilter.operator) !== -1);
-        }
-        this.preloadValues = this.table.oTableColumnsFilterComponent ? this.table.oTableColumnsFilterComponent.preloadValues : true;
-        this.activeSortDirection = this.table.getSortFilterColumn(this.column) || '';
-        this.startView = this.table.getStartViewFilterColumn(this.column) || 'month';
-        const queryMethod = this.table.oTableColumnsFilterComponent?.getQueryMethodOfFilterColumn(this.column.attr);
-        if (Util.isDefined(queryMethod)) {
-            this.queryMethodName = queryMethod;
-            this.sourceData = 'all-data';
-        }
-        this.getData(this.sourceData);
     }
     parseDataAndInitializeDataList(previousFilter) {
-        this.columnData = this.filterService.parseListData(previousFilter, this.column, this.tableData, this.table.pageable, this.sourceData);
+        this.columnData = this.filterService.initializeColumnFilterData(this.previousFilter, this.column, this.tableData, this.table.pageable, this.filterColumnDefinition);
         if (previousFilter.values && previousFilter.values.length > 0) {
             this.selection.select(...this.columnData.filter(item => previousFilter.values.indexOf(item.value) !== -1));
         }
@@ -30331,7 +30525,7 @@ class OTableFilterByColumnDataDialogComponent {
         if (!this.isCustomFilterSubject.getValue()) {
             const selectedValues = this.selection.selected;
             if (selectedValues.length) {
-                this.filterService.applySelectedValuesToFilter(this.column, this.tableData, filter, selectedValues, this.sourceData, this.table.pageable, () => this.table.getComponentFilter());
+                this.filterService.applySelectedValuesToFilter(this.column, this.tableData, filter, selectedValues, this.filterColumnDefinition, this.table.pageable, () => this.table.getComponentFilter());
             }
         }
         else {
@@ -30450,56 +30644,30 @@ class OTableFilterByColumnDataDialogComponent {
         this.getData(event.value);
     }
     getData(sourceData) {
-        if (sourceData === 'current-page') {
-            this.tableData = this.table.getValue();
-            this.parseDataAndInitializeDataList(this.previousFilter);
+        if (sourceData) {
+            this.filterColumnDefinition.filterValuesInData = sourceData;
         }
-        else if (this.table.pageable) {
-            this.queryByFilterColumnSubscription = this.queryByFilterColumn(this.column.attr).subscribe((res) => {
-                let data = [];
-                if (res.isSuccessful()) {
-                    data = res.data;
-                }
-                this.tableData = data;
-                this.parseDataAndInitializeDataList(this.previousFilter);
-            });
-        }
-        else {
-            this.tableData = this.table.getAllValues();
+        this.filterService.getDataForColumnFilter(this.injector, this.table, this.column, this.filterColumnDefinition).subscribe(data => {
+            this.tableData = data;
             this.parseDataAndInitializeDataList(this.previousFilter);
-        }
+        });
     }
     isSelected(item) {
         return item.selected;
     }
-    queryByFilterColumn(attr) {
-        const kv = this.previousFilter.filterExpresion || this.table.getComponentFilter();
-        const av = [attr];
-        let sqlTypes = {};
-        if (Util.isDefined(kv) && !Util.isObjectEmpty(kv)) {
-            sqlTypes = this.table.getSqlTypes();
-        }
-        const columnQueryArgs = [kv, av, this.table.entity, sqlTypes, undefined, undefined, undefined];
-        const queryMethodName = this.queryMethodName || Codes.QUERY_METHOD;
-        const service = this.table.getService();
-        if (service && (queryMethodName in service) && this.table.entity) {
-            return service[queryMethodName](...columnQueryArgs);
-        }
-        return of({});
-    }
     compareOptions() {
         return (o1, o2) => o1?.value === o2?.value;
     }
     ;
 }
-OTableFilterByColumnDataDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableFilterByColumnDataDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: OTableFilterByColumnService }, { 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 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=\"1 1 100%\" *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        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n            <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n          </button>\n          <button type=\"button\" mat-icon-button [matMenuTriggerFor]=\"menu\" *ngIf=\"showFilterValuesOption\">\n            <mat-icon>more_vert</mat-icon>\n          </button>\n          <mat-menu #menu=\"matMenu\">\n            <div fxLayout=\"column\" class=\"filtervalues-container\">\n              <div mat-subheader>\n                {{'TABLE.FILTER_BY_COLUMN.LABEL_DATA' | oTranslate}}\n              </div>\n              <mat-divider></mat-divider>\n              <mat-radio-group aria-label=\"Data\" fxLayout=\"column\" fxLayoutGap=\"12px\" [(ngModel)]=\"sourceData\" (change)=\"onChangeDataSource($event)\">\n                <mat-radio-button value=\"current-page\">{{'TABLE.FILTER_BY_COLUMN.CURRENT_PAGE' | oTranslate}}</mat-radio-button>\n                <mat-radio-button value=\"all-data\">{{'TABLE.FILTER_BY_COLUMN.ALL_PAGE' | oTranslate}}</mat-radio-button>\n              </mat-radio-group>\n            </div>\n          </mat-menu>\n        </div>\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      <cdk-virtual-scroll-viewport itemSize=\"30\" fxFlex>\n        <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList class=\"select-values-list\" (selectionChange)=\"onSelect($event)\">\n          <ng-container *cdkVirtualFor=\"let record of (listData | async); let i = index;templateCacheSize: 0\">\n            <mat-list-option checkboxPosition=\"before\" [selected]=\"selection.isSelected(record)\" [value]=\"record\">\n              <ng-container *ngIf=\"record.value | isEmptyValue; else showValue\">\n                {{ 'TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate }}\n              </ng-container>\n              <ng-template #showValue>\n                <ng-container *ngIf=\"!column.renderer\">\n                  {{ record.value }}\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              </ng-template>\n            </mat-list-option>\n          </ng-container>\n        </mat-selection-list>\n      </cdk-virtual-scroll-viewport>\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: [".filtervalues-container{padding:12px}.filtervalues-container .mat-divider{margin:8px}.filtervalues-container .mdc-list-group__subheader{font-weight:400;margin-top:0;margin-bottom:0}.filtervalues-container mat-radio-group.mat-mdc-radio-group{margin:12px 12px 0}.o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px;padding-left:14px}.o-filter-by-column-dialog .content-wrapper{padding-top: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-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.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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.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: i3.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: i8$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i8$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i8$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i8$1.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: "directive", type: i5$1.MatListSubheaderCssMatStyler, selector: "[mat-subheader], [matSubheader]" }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i7$5.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i7$5.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: i7$4.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i7$4.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i7$4.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }, { kind: "pipe", type: IsEmptyValuePipe, name: "isEmptyValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+OTableFilterByColumnDataDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableFilterByColumnDataDialogComponent, deps: [{ token: i0.Injector }, { token: i1$1.MatDialogRef }, { token: OTableFilterByColumnService }, { 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 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=\"1 1 100%\" *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        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n            <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n          </button>\n          <button type=\"button\" mat-icon-button [matMenuTriggerFor]=\"menu\" *ngIf=\"showFilterValuesOption\">\n            <mat-icon>more_vert</mat-icon>\n          </button>\n          <mat-menu #menu=\"matMenu\">\n            <div fxLayout=\"column\" class=\"filtervalues-container\">\n              <div mat-subheader>\n                {{'TABLE.FILTER_BY_COLUMN.LABEL_DATA' | oTranslate}}\n              </div>\n              <mat-divider></mat-divider>\n              <mat-radio-group aria-label=\"Data\" fxLayout=\"column\" fxLayoutGap=\"12px\" [(ngModel)]=\"sourceData\" (change)=\"onChangeDataSource($event)\">\n                <mat-radio-button value=\"current-page\">{{'TABLE.FILTER_BY_COLUMN.CURRENT_PAGE' | oTranslate}}</mat-radio-button>\n                <mat-radio-button value=\"all-data\">{{'TABLE.FILTER_BY_COLUMN.ALL_PAGE' | oTranslate}}</mat-radio-button>\n              </mat-radio-group>\n            </div>\n          </mat-menu>\n        </div>\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      <cdk-virtual-scroll-viewport itemSize=\"30\" fxFlex>\n        <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList class=\"select-values-list\" (selectionChange)=\"onSelect($event)\">\n          <ng-container *cdkVirtualFor=\"let record of (listData | async); let i = index;templateCacheSize: 0\">\n            <mat-list-option checkboxPosition=\"before\" [selected]=\"selection.isSelected(record)\" [value]=\"record\">\n              <ng-container *ngIf=\"record.value | isEmptyValue; else showValue\">\n                {{ 'TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate }}\n              </ng-container>\n              <ng-template #showValue>\n                <!--  if there are visible columns, show rendererValue -->\n                <ng-container *ngIf=\"visibleColumnsArray?.length > 0; else noVisibleColumns\">\n                  {{ record.renderedValue }}\n                </ng-container>\n\n                <!-- If there are no visible columns, use the previous behavior -->\n                <ng-template #noVisibleColumns>\n                  <!-- If there is no column renderer, show the raw value -->\n                  <ng-container *ngIf=\"!column.renderer; else withRenderer\">\n                    {{ record.value }}\n                  </ng-container>\n\n                  <!-- If there is a renderer, use its template reference -->\n                  <ng-template #withRenderer>\n                    <ng-template [ngTemplateOutlet]=\"column.renderer.templateref\" [ngTemplateOutletContext]=\"{\n                        cellvalue: record.value,\n                        rowvalue: record.rowValue\n                      }\"></ng-template>\n                  </ng-template>\n                </ng-template>\n              </ng-template>\n            </mat-list-option>\n          </ng-container>\n        </mat-selection-list>\n      </cdk-virtual-scroll-viewport>\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: [".filtervalues-container{padding:12px}.filtervalues-container .mat-divider{margin:8px}.filtervalues-container .mdc-list-group__subheader{font-weight:400;margin-top:0;margin-bottom:0}.filtervalues-container mat-radio-group.mat-mdc-radio-group{margin:12px 12px 0}.o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px;padding-left:14px}.o-filter-by-column-dialog .content-wrapper{padding-top: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-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.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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.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: i3.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: i8$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i8$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i8$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i8$1.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: "directive", type: i5$1.MatListSubheaderCssMatStyler, selector: "[mat-subheader], [matSubheader]" }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i7$5.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i7$5.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "component", type: i6$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: i7$4.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i7$4.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i7$4.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }, { kind: "pipe", type: IsEmptyValuePipe, name: "isEmptyValue" }], 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 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=\"1 1 100%\" *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        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n            <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n          </button>\n          <button type=\"button\" mat-icon-button [matMenuTriggerFor]=\"menu\" *ngIf=\"showFilterValuesOption\">\n            <mat-icon>more_vert</mat-icon>\n          </button>\n          <mat-menu #menu=\"matMenu\">\n            <div fxLayout=\"column\" class=\"filtervalues-container\">\n              <div mat-subheader>\n                {{'TABLE.FILTER_BY_COLUMN.LABEL_DATA' | oTranslate}}\n              </div>\n              <mat-divider></mat-divider>\n              <mat-radio-group aria-label=\"Data\" fxLayout=\"column\" fxLayoutGap=\"12px\" [(ngModel)]=\"sourceData\" (change)=\"onChangeDataSource($event)\">\n                <mat-radio-button value=\"current-page\">{{'TABLE.FILTER_BY_COLUMN.CURRENT_PAGE' | oTranslate}}</mat-radio-button>\n                <mat-radio-button value=\"all-data\">{{'TABLE.FILTER_BY_COLUMN.ALL_PAGE' | oTranslate}}</mat-radio-button>\n              </mat-radio-group>\n            </div>\n          </mat-menu>\n        </div>\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      <cdk-virtual-scroll-viewport itemSize=\"30\" fxFlex>\n        <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList class=\"select-values-list\" (selectionChange)=\"onSelect($event)\">\n          <ng-container *cdkVirtualFor=\"let record of (listData | async); let i = index;templateCacheSize: 0\">\n            <mat-list-option checkboxPosition=\"before\" [selected]=\"selection.isSelected(record)\" [value]=\"record\">\n              <ng-container *ngIf=\"record.value | isEmptyValue; else showValue\">\n                {{ 'TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate }}\n              </ng-container>\n              <ng-template #showValue>\n                <ng-container *ngIf=\"!column.renderer\">\n                  {{ record.value }}\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              </ng-template>\n            </mat-list-option>\n          </ng-container>\n        </mat-selection-list>\n      </cdk-virtual-scroll-viewport>\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: [".filtervalues-container{padding:12px}.filtervalues-container .mat-divider{margin:8px}.filtervalues-container .mdc-list-group__subheader{font-weight:400;margin-top:0;margin-bottom:0}.filtervalues-container mat-radio-group.mat-mdc-radio-group{margin:12px 12px 0}.o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px;padding-left:14px}.o-filter-by-column-dialog .content-wrapper{padding-top: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-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: OTableFilterByColumnService }, { type: undefined, decorators: [{
+                    }, 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 fxFlex=\"1 1 100%\" *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        <div fxLayout=\"row\" fxLayoutAlign=\"start start\">\n          <button type=\"button\" mat-icon-button (click)=\"onClickSortValues()\">\n            <mat-icon [svgIcon]=\"getSortByAlphaIcon()\"></mat-icon>\n          </button>\n          <button type=\"button\" mat-icon-button [matMenuTriggerFor]=\"menu\" *ngIf=\"showFilterValuesOption\">\n            <mat-icon>more_vert</mat-icon>\n          </button>\n          <mat-menu #menu=\"matMenu\">\n            <div fxLayout=\"column\" class=\"filtervalues-container\">\n              <div mat-subheader>\n                {{'TABLE.FILTER_BY_COLUMN.LABEL_DATA' | oTranslate}}\n              </div>\n              <mat-divider></mat-divider>\n              <mat-radio-group aria-label=\"Data\" fxLayout=\"column\" fxLayoutGap=\"12px\" [(ngModel)]=\"sourceData\" (change)=\"onChangeDataSource($event)\">\n                <mat-radio-button value=\"current-page\">{{'TABLE.FILTER_BY_COLUMN.CURRENT_PAGE' | oTranslate}}</mat-radio-button>\n                <mat-radio-button value=\"all-data\">{{'TABLE.FILTER_BY_COLUMN.ALL_PAGE' | oTranslate}}</mat-radio-button>\n              </mat-radio-group>\n            </div>\n          </mat-menu>\n        </div>\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      <cdk-virtual-scroll-viewport itemSize=\"30\" fxFlex>\n        <mat-selection-list *ngIf=\"preloadValues || listData\" #filterValueList class=\"select-values-list\" (selectionChange)=\"onSelect($event)\">\n          <ng-container *cdkVirtualFor=\"let record of (listData | async); let i = index;templateCacheSize: 0\">\n            <mat-list-option checkboxPosition=\"before\" [selected]=\"selection.isSelected(record)\" [value]=\"record\">\n              <ng-container *ngIf=\"record.value | isEmptyValue; else showValue\">\n                {{ 'TABLE.FILTER_BY_COLUMN.EMPTY_VALUE' | oTranslate }}\n              </ng-container>\n              <ng-template #showValue>\n                <!--  if there are visible columns, show rendererValue -->\n                <ng-container *ngIf=\"visibleColumnsArray?.length > 0; else noVisibleColumns\">\n                  {{ record.renderedValue }}\n                </ng-container>\n\n                <!-- If there are no visible columns, use the previous behavior -->\n                <ng-template #noVisibleColumns>\n                  <!-- If there is no column renderer, show the raw value -->\n                  <ng-container *ngIf=\"!column.renderer; else withRenderer\">\n                    {{ record.value }}\n                  </ng-container>\n\n                  <!-- If there is a renderer, use its template reference -->\n                  <ng-template #withRenderer>\n                    <ng-template [ngTemplateOutlet]=\"column.renderer.templateref\" [ngTemplateOutletContext]=\"{\n                        cellvalue: record.value,\n                        rowvalue: record.rowValue\n                      }\"></ng-template>\n                  </ng-template>\n                </ng-template>\n              </ng-template>\n            </mat-list-option>\n          </ng-container>\n        </mat-selection-list>\n      </cdk-virtual-scroll-viewport>\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: [".filtervalues-container{padding:12px}.filtervalues-container .mat-divider{margin:8px}.filtervalues-container .mdc-list-group__subheader{font-weight:400;margin-top:0;margin-bottom:0}.filtervalues-container mat-radio-group.mat-mdc-radio-group{margin:12px 12px 0}.o-filter-by-column-dialog .mat-mdc-slide-toggle{padding-bottom:24px;padding-left:14px}.o-filter-by-column-dialog .content-wrapper{padding-top: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-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: i0.Injector }, { type: i1$1.MatDialogRef }, { type: OTableFilterByColumnService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }]; }, propDecorators: { filter: [{
@@ -30680,12 +30848,12 @@ class OTableVisibleColumnsDialogComponent {
     }
 }
 OTableVisibleColumnsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableVisibleColumnsDialogComponent, deps: [{ token: i0.Injector }, { token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-OTableVisibleColumnsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableVisibleColumnsDialogComponent, selector: "o-table-visible-columns-dialog", host: { properties: { "class.o-table-visible-columns-dialog": "true" } }, ngImport: i0, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.COLVIS' | oTranslate }}</span>\n\n\n<mat-dialog-content>\n  <div mat-subheader>{{'TABLE.VISIBLE_COLUMNS.DESCRIPTION' | oTranslate}}</div>\n\n  <div [ngClass]=\"rowHeight\">\n    <mat-list cdkDropList (cdkDropListDropped)=\"drop($event)\">\n      <mat-list-item *ngFor=\"let column of columns\" cdkDrag (click)=\"onClickColumn(column)\" [ngClass]=\"{'column-hidden':!column.visible}\"\n        class=\"o-drag-list-item-box\">\n        <div fxLayout=\"row\" fxFlex fxLayoutAlign=\"stretch center\">\n          <mat-icon matListItemIcon svgIcon=\"ontimize:drag_handle\"></mat-icon>\n          <span matListItemLine fxFlex>{{ (column.title || column.attr) | oTranslate }}</span>\n          <mat-icon *ngIf=\"column.visible\" svgIcon=\"ontimize:visibility\" color=\"primary\"></mat-icon>\n          <mat-icon *ngIf=\"!column.visible\" svgIcon=\"ontimize:visibility_off\"></mat-icon>\n        </div>\n        <mat-divider></mat-divider>\n      </mat-list-item>\n    </mat-list>\n  </div>\n</mat-dialog-content>\n\n<mat-dialog-actions fxLayoutAlign=\"end center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"null\" class=\"o-button-default cancel\" cancel>{{ 'CANCEL' | oTranslate }}</button>\n  <button type=\"button\" mat-stroked-button (click)=\"closeDialog()\" class=\"o-button-primary\">{{ 'ACCEPT' | oTranslate }}</button>\n</mat-dialog-actions>\n", styles: [".o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content{overflow:auto;padding-top:0;margin-top:24px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-subheader{display:block}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .title_list{font-weight:600;margin-bottom:6px;margin-top:12px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .cdk-drop-list{padding:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item{padding-left:0;flex-direction:column;cursor:pointer;height:auto}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item.column-hidden{opacity:.4}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content{padding:0;cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__secondary-text,.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__primary-text{padding:0 8px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__start{margin-top:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mat-mdc-list-item-icon{display:flex}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:drag_handle\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list-item{cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility_off\"]{width:32px}\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: 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: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { 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: "component", type: i5$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i5$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i5$1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i5$1.MatListSubheaderCssMatStyler, selector: "[mat-subheader], [matSubheader]" }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i5$1.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i7$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i7$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+OTableVisibleColumnsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableVisibleColumnsDialogComponent, selector: "o-table-visible-columns-dialog", host: { properties: { "class.o-table-visible-columns-dialog": "true" } }, ngImport: i0, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.COLVIS' | oTranslate }}</span>\n\n\n<mat-dialog-content>\n  <div mat-subheader>{{'TABLE.VISIBLE_COLUMNS.DESCRIPTION' | oTranslate}}</div>\n\n  <div [ngClass]=\"rowHeight\">\n    <mat-list cdkDropList (cdkDropListDropped)=\"drop($event)\">\n      <mat-list-item *ngFor=\"let column of columns\" cdkDrag (click)=\"onClickColumn(column)\" [ngClass]=\"{'column-hidden':!column.visible}\"\n        class=\"o-drag-list-item-box\">\n        <div fxLayout=\"row\" fxFlex fxLayoutAlign=\"stretch center\">\n          <mat-icon matListItemIcon svgIcon=\"ontimize:drag_handle\"></mat-icon>\n          <span matListItemLine fxFlex>{{ (column.title || column.attr) | oTranslate }}</span>\n          <mat-icon *ngIf=\"column.visible\" svgIcon=\"ontimize:visibility\" color=\"primary\"></mat-icon>\n          <mat-icon *ngIf=\"!column.visible\" svgIcon=\"ontimize:visibility_off\"></mat-icon>\n        </div>\n        <mat-divider></mat-divider>\n      </mat-list-item>\n    </mat-list>\n  </div>\n</mat-dialog-content>\n\n<mat-dialog-actions fxLayoutAlign=\"end center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"null\" class=\"o-button-default cancel\" cancel>{{ 'CANCEL' | oTranslate }}</button>\n  <button type=\"button\" mat-stroked-button (click)=\"closeDialog()\" class=\"o-button-primary\">{{ 'ACCEPT' | oTranslate }}</button>\n</mat-dialog-actions>\n", styles: [".o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content{padding-top:0;margin-top:24px;overflow:hidden}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-subheader{display:block}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .title_list{font-weight:600;margin-bottom:6px;margin-top:12px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .cdk-drop-list{padding:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list{max-height:calc(80vh - 150px);overflow-y:auto}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item{padding-left:0;flex-direction:column;cursor:pointer;height:auto}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item.column-hidden{opacity:.4}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content{padding:0;cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__secondary-text,.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__primary-text{padding:0 8px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__start{margin-top:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mat-mdc-list-item-icon{display:flex}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:drag_handle\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list-item{cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility_off\"]{width:32px}\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: 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: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { 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: "component", type: i5$1.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i5$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i5$1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i5$1.MatListSubheaderCssMatStyler, selector: "[mat-subheader], [matSubheader]" }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i5$1.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i7$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i7$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { 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: OTableVisibleColumnsDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'o-table-visible-columns-dialog', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.o-table-visible-columns-dialog]': 'true'
-                    }, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.COLVIS' | oTranslate }}</span>\n\n\n<mat-dialog-content>\n  <div mat-subheader>{{'TABLE.VISIBLE_COLUMNS.DESCRIPTION' | oTranslate}}</div>\n\n  <div [ngClass]=\"rowHeight\">\n    <mat-list cdkDropList (cdkDropListDropped)=\"drop($event)\">\n      <mat-list-item *ngFor=\"let column of columns\" cdkDrag (click)=\"onClickColumn(column)\" [ngClass]=\"{'column-hidden':!column.visible}\"\n        class=\"o-drag-list-item-box\">\n        <div fxLayout=\"row\" fxFlex fxLayoutAlign=\"stretch center\">\n          <mat-icon matListItemIcon svgIcon=\"ontimize:drag_handle\"></mat-icon>\n          <span matListItemLine fxFlex>{{ (column.title || column.attr) | oTranslate }}</span>\n          <mat-icon *ngIf=\"column.visible\" svgIcon=\"ontimize:visibility\" color=\"primary\"></mat-icon>\n          <mat-icon *ngIf=\"!column.visible\" svgIcon=\"ontimize:visibility_off\"></mat-icon>\n        </div>\n        <mat-divider></mat-divider>\n      </mat-list-item>\n    </mat-list>\n  </div>\n</mat-dialog-content>\n\n<mat-dialog-actions fxLayoutAlign=\"end center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"null\" class=\"o-button-default cancel\" cancel>{{ 'CANCEL' | oTranslate }}</button>\n  <button type=\"button\" mat-stroked-button (click)=\"closeDialog()\" class=\"o-button-primary\">{{ 'ACCEPT' | oTranslate }}</button>\n</mat-dialog-actions>\n", styles: [".o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content{overflow:auto;padding-top:0;margin-top:24px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-subheader{display:block}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .title_list{font-weight:600;margin-bottom:6px;margin-top:12px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .cdk-drop-list{padding:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item{padding-left:0;flex-direction:column;cursor:pointer;height:auto}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item.column-hidden{opacity:.4}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content{padding:0;cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__secondary-text,.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__primary-text{padding:0 8px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__start{margin-top:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mat-mdc-list-item-icon{display:flex}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:drag_handle\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list-item{cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility_off\"]{width:32px}\n"] }]
+                    }, template: "<span mat-dialog-title>{{ 'TABLE.BUTTONS.COLVIS' | oTranslate }}</span>\n\n\n<mat-dialog-content>\n  <div mat-subheader>{{'TABLE.VISIBLE_COLUMNS.DESCRIPTION' | oTranslate}}</div>\n\n  <div [ngClass]=\"rowHeight\">\n    <mat-list cdkDropList (cdkDropListDropped)=\"drop($event)\">\n      <mat-list-item *ngFor=\"let column of columns\" cdkDrag (click)=\"onClickColumn(column)\" [ngClass]=\"{'column-hidden':!column.visible}\"\n        class=\"o-drag-list-item-box\">\n        <div fxLayout=\"row\" fxFlex fxLayoutAlign=\"stretch center\">\n          <mat-icon matListItemIcon svgIcon=\"ontimize:drag_handle\"></mat-icon>\n          <span matListItemLine fxFlex>{{ (column.title || column.attr) | oTranslate }}</span>\n          <mat-icon *ngIf=\"column.visible\" svgIcon=\"ontimize:visibility\" color=\"primary\"></mat-icon>\n          <mat-icon *ngIf=\"!column.visible\" svgIcon=\"ontimize:visibility_off\"></mat-icon>\n        </div>\n        <mat-divider></mat-divider>\n      </mat-list-item>\n    </mat-list>\n  </div>\n</mat-dialog-content>\n\n<mat-dialog-actions fxLayoutAlign=\"end center\">\n  <button type=\"button\" mat-stroked-button [mat-dialog-close]=\"null\" class=\"o-button-default cancel\" cancel>{{ 'CANCEL' | oTranslate }}</button>\n  <button type=\"button\" mat-stroked-button (click)=\"closeDialog()\" class=\"o-button-primary\">{{ 'ACCEPT' | oTranslate }}</button>\n</mat-dialog-actions>\n", styles: [".o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content{padding-top:0;margin-top:24px;overflow:hidden}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-subheader{display:block}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .title_list{font-weight:600;margin-bottom:6px;margin-top:12px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .cdk-drop-list{padding:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list{max-height:calc(80vh - 150px);overflow-y:auto}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item{padding-left:0;flex-direction:column;cursor:pointer;height:auto}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item.column-hidden{opacity:.4}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content{padding:0;cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__secondary-text,.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__primary-text{padding:0 8px}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mdc-list-item__start{margin-top:0}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list .mat-mdc-list-item .mdc-list-item__content .mat-mdc-list-item-icon{display:flex}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:drag_handle\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-mdc-list-item{cursor:move}.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility\"],.o-table-visible-columns-dialog .mat-mdc-dialog-content.mat-mdc-dialog-content .mat-icon[svgicon=\"ontimize:visibility_off\"]{width:32px}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -31476,17 +31644,31 @@ const DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER_COLUMN = [
     'sort',
     'startView:start-view',
     'queryMethod:query-method',
-    'filterValuesInData: filter-values-in-data'
+    'filterValuesInData: filter-values-in-data',
+    'filterLocked:filter-locked',
+    'filterLockedMessage:filter-locked-message',
+    'service',
+    'serviceType:service-type',
+    'entity',
+    'visibleColumns: visible-columns',
+    'separator'
 ];
 class OTableColumnsFilterColumnComponent {
     constructor() {
         this.attr = '';
         this.sort = '';
         this.startView = 'month';
+        this.filterLocked = false;
+        this.filterLockedMessage = 'O_TABLE_COLUMN_FILTER_COLUMN.DEFAULT_LOCKED_MESSAGE';
+        this.separator = Codes.SPACE_SEPARATOR;
+    }
+    ngOnInit() {
+        this.visibleColsArray = Util.parseArray(this.visibleColumns, true);
+        this.filterValuesInData = this.filterValuesInData ?? (this.queryMethod ? 'all-data' : 'current-page');
     }
 }
 OTableColumnsFilterColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnsFilterColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-OTableColumnsFilterColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableColumnsFilterColumnComponent, selector: "o-table-columns-filter-column", inputs: { attr: "attr", sort: "sort", startView: ["start-view", "startView"], queryMethod: ["query-method", "queryMethod"], filterValuesInData: ["filter-values-in-data", "filterValuesInData"] }, ngImport: i0, template: ' ', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+OTableColumnsFilterColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableColumnsFilterColumnComponent, selector: "o-table-columns-filter-column", inputs: { attr: "attr", sort: "sort", startView: ["start-view", "startView"], queryMethod: ["query-method", "queryMethod"], filterValuesInData: ["filter-values-in-data", "filterValuesInData"], filterLocked: ["filter-locked", "filterLocked"], filterLockedMessage: ["filter-locked-message", "filterLockedMessage"], service: "service", serviceType: ["service-type", "serviceType"], entity: "entity", visibleColumns: ["visible-columns", "visibleColumns"], separator: "separator" }, ngImport: i0, template: ' ', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnsFilterColumnComponent, decorators: [{
             type: Component,
             args: [{
@@ -31505,18 +31687,6 @@ const DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER = [
 ];
 const DEFAULT_OUTPUTS_O_TABLE_COLUMN_FILTER = [];
 class OTableColumnsFilterComponent {
-    get mode() {
-        return this._mode;
-    }
-    set mode(val) {
-        const m = OTableColumnsFilterComponent.OTableColumnsFilterModes.find(e => e === val);
-        if (Util.isDefined(m)) {
-            this._mode = m;
-        }
-        else {
-            console.error('Invalid `o-table-columns-filter` mode (' + val + ')');
-        }
-    }
     constructor(injector, table) {
         this.injector = injector;
         this.table = table;
@@ -31529,7 +31699,6 @@ class OTableColumnsFilterComponent {
         if (this.columnsArray.length === 0) {
             this.columnsArray = this.table.oTableOptions.visibleColumns;
         }
-        const self = this;
         let columns = Util.parseArray(this._columns, true);
         columns.forEach((colData, i, arr) => {
             const colDef = colData.split(Codes.TYPE_SEPARATOR);
@@ -31539,29 +31708,56 @@ class OTableColumnsFilterComponent {
                 compType = OTableColumnsFilterComponent.DEFAULT_COMPARISON_TYPE;
             }
             arr[i] = colName;
-            self.columnsComparisonProperty[colName] = compType;
+            this.columnsComparisonProperty[colName] = compType;
         });
         this.table.setOTableColumnsFilter(this);
         this.filterValuesInData = this.filterValuesInData ?? this.getFilterValuesInDataByDefault();
     }
-    getFilterValuesInDataByDefault() {
-        return this.table.pageable ? 'current-page' : 'all-data';
-    }
     ngAfterContentInit() {
-        if (Util.isDefined(this.filterColumns)) {
-            const newColumns = this.parseFilterColumns(this.filterColumns);
-            const mergedMap = new Map();
-            this.columnsArray.forEach(col => {
-                mergedMap.set(col.attr, col);
-            });
-            newColumns.forEach(col => {
-                mergedMap.set(col.attr, col);
-            });
-            this.columnsArray = Array.from(mergedMap.values());
+        if (!Util.isDefined(this.filterColumns))
+            return;
+        const newColumns = this.parseFilterColumns(this.filterColumns);
+        const mergedMap = new Map();
+        for (const col of this.columnsArray) {
+            mergedMap.set(col.attr, col);
         }
+        ;
+        for (const col of newColumns) {
+            mergedMap.set(col.attr, col);
+        }
+        this.columnsArray = Array.from(mergedMap.values());
+    }
+    get mode() {
+        return this._mode;
+    }
+    set mode(val) {
+        const m = OTableColumnsFilterComponent.OTableColumnsFilterModes.find(e => e === val);
+        if (Util.isDefined(m)) {
+            this._mode = m;
+        }
+        else {
+            console.error('Invalid `o-table-columns-filter` mode (' + val + ')');
+        }
+    }
+    set columns(arg) {
+        this._columns = arg;
+        this._columnsArray = this.parseColumns(this._columns);
+    }
+    set columnsArray(arg) {
+        this._columnsArray = arg;
+    }
+    get columnsArray() {
+        return this._columnsArray;
+    }
+    getFilterColumnByAttr(attr) {
+        return this.filterColumns.find(filterColumn => filterColumn.attr === attr);
+    }
+    getFilterValuesInDataByDefault() {
+        return this.table.pageable ? 'current-page' : 'all-data';
     }
     isColumnFilterable(attr) {
-        return Util.isDefined(this.columnsArray.find(x => x.attr === attr));
+        const filterColumnDefinition = this.columnsArray.find(x => x.attr === attr);
+        return Util.isDefined(filterColumnDefinition) && (filterColumnDefinition.filterLocked ?? true);
     }
     getSortValueOfFilterColumn(attr) {
         let sortValue = '';
@@ -31598,12 +31794,13 @@ class OTableColumnsFilterComponent {
     }
     getFilterValuesInData(attr) {
         let filterValuesInData = this.filterValuesInData;
-        if (Util.isDefined(this.columnsArray)) {
-            this.columnsArray.forEach(column => {
-                if (column.attr == attr && (column.filterValuesInData === 'current-page' || column.filterValuesInData === 'all-data')) {
+        if (Util.isDefined(this.filterColumns)) {
+            for (const column of this.filterColumns) {
+                if (column.attr === attr && (column.filterValuesInData === 'current-page' || column.filterValuesInData === 'all-data')) {
                     filterValuesInData = column.filterValuesInData;
+                    break;
                 }
-            });
+            }
         }
         return filterValuesInData;
     }
@@ -31615,16 +31812,6 @@ class OTableColumnsFilterComponent {
             return column.renderer ? column.renderer.getCellData(val) : val;
         }
     }
-    set columns(arg) {
-        this._columns = arg;
-        this._columnsArray = this.parseColumns(this._columns);
-    }
-    set columnsArray(arg) {
-        this._columnsArray = arg;
-    }
-    get columnsArray() {
-        return this._columnsArray;
-    }
     parseColumns(columns) {
         return columns.split(';')
             .map(x => {
@@ -31643,6 +31830,18 @@ class OTableColumnsFilterComponent {
             obj.sort = x.sort;
             obj.startView = x.startView;
             obj.queryMethod = x.queryMethod;
+            if (x.service) {
+                obj.service = x.service;
+            }
+            if (x.serviceType) {
+                obj.serviceType = x.serviceType;
+            }
+            if (x.separator) {
+                obj.separator = x.separator;
+            }
+            if (x.visibleColumns) {
+                obj.visibleColumns = Util.parseArray(x.visibleColumns, true);
+            }
             obj.filterValuesInData = (x.filterValuesInData || this.filterValuesInData) ?? this.getFilterValuesInDataByDefault();
             return obj;
         });
@@ -31651,7 +31850,7 @@ class OTableColumnsFilterComponent {
 OTableColumnsFilterComponent.DEFAULT_COMPARISON_TYPE = 'VIEW';
 OTableColumnsFilterComponent.MODEL_COMPARISON_TYPE = 'MODEL';
 OTableColumnsFilterComponent.OTableColumnsFilterModes = ['default', 'selection', 'custom'];
-OTableColumnsFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnsFilterComponent, deps: [{ token: i0.Injector }, { token: forwardRef(() => OTableComponent) }], target: i0.ɵɵFactoryTarget.Component });
+OTableColumnsFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableColumnsFilterComponent, deps: [{ token: i0.Injector }, { token: forwardRef(() => OTableBase) }], target: i0.ɵɵFactoryTarget.Component });
 OTableColumnsFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableColumnsFilterComponent, selector: "o-table-columns-filter", inputs: { columns: "columns", preloadValues: ["preload-values", "preloadValues"], mode: "mode", filterValuesInData: ["filter-values-in-data", "filterValuesInData"] }, queries: [{ propertyName: "filterColumns", predicate: OTableColumnsFilterColumnComponent, descendants: true }], ngImport: i0, template: ' ', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 __decorate([
     BooleanInputConverter(),
@@ -31666,14 +31865,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                     inputs: DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER,
                     outputs: DEFAULT_OUTPUTS_O_TABLE_COLUMN_FILTER
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: OTableComponent, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: OTableBase, decorators: [{
                     type: Inject,
-                    args: [forwardRef(() => OTableComponent)]
-                }] }]; }, propDecorators: { preloadValues: [], mode: [{
-                type: Input
-            }], filterColumns: [{
+                    args: [forwardRef(() => OTableBase)]
+                }] }]; }, propDecorators: { preloadValues: [], filterColumns: [{
                 type: ContentChildren,
                 args: [OTableColumnsFilterColumnComponent, { descendants: true }]
+            }], mode: [{
+                type: Input
             }] } });
 
 const DEFAULT_INPUTS_O_TABLE_INSERTABLE_ROW = [
@@ -32699,8 +32898,11 @@ const DEFAULT_INPUTS_O_TABLE_COLUMN_FILTER_ICON = [
     'column'
 ];
 class OTableHeaderColumnFilterIconComponent {
-    constructor(table) {
+    constructor(table, dialog, dialogService, translateService) {
         this.table = table;
+        this.dialog = dialog;
+        this.dialogService = dialogService;
+        this.translateService = translateService;
         this.isColumnFilterActive = new BehaviorSubject(false);
         this.filterIconHintVisible = new BehaviorSubject(false);
         this.indicatorNumber = new BehaviorSubject('');
@@ -32726,7 +32928,13 @@ class OTableHeaderColumnFilterIconComponent {
         return columnValueFilters.find(item => item.attr === this.column.attr);
     }
     openColumnFilterDialog(event) {
-        this.table.openColumnFilterDialog(this.column, event);
+        const filterByColumnComponent = this.table.oTableColumnsFilterComponent?.getFilterColumnByAttr(this.column.attr);
+        if (filterByColumnComponent?.filterLocked) {
+            this.dialogService.alert(this.translateService.get('TABLE.FILTER_LOCKED'), this.translateService.get(filterByColumnComponent.filterLockedMessage));
+        }
+        else {
+            this.table.openColumnFilterDialog(this.column, event);
+        }
     }
     getFilterIndicatorNumbered() {
         let result = '';
@@ -32750,7 +32958,7 @@ class OTableHeaderColumnFilterIconComponent {
         this.subscription.unsubscribe();
     }
 }
-OTableHeaderColumnFilterIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableHeaderColumnFilterIconComponent, deps: [{ token: forwardRef(() => OTableBase) }], target: i0.ɵɵFactoryTarget.Component });
+OTableHeaderColumnFilterIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTableHeaderColumnFilterIconComponent, deps: [{ token: forwardRef(() => OTableBase) }, { token: i1$1.MatDialog }, { token: DialogService }, { token: OTranslateService }], target: i0.ɵɵFactoryTarget.Component });
 OTableHeaderColumnFilterIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTableHeaderColumnFilterIconComponent, selector: "o-table-header-column-filter-icon", inputs: { column: "column" }, host: { properties: { "class.o-table-column-filter-icon": "true" } }, ngImport: i0, template: "<mat-icon class=\"column-filter-icon\" [ngClass]=\"{'column-filter-icon-active':isColumnFilterActive | async}\"\n  (click)=\"openColumnFilterDialog($event)\" [@iconState]=\"filterIconStateView | async\">\n  filter_alt\n</mat-icon>\n<span class=\"o-table-header-indicator-numbered\">\n  {{ indicatorNumber | async }}\n</span>", styles: [".o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:has(.o-table-column-filter-icon){padding-left:0}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:has(.mat-sort-header-arrow){padding-right:6px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell:has(.o-table-column-resizer){padding-right:0}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .o-table-column-filter-icon{position:relative;display:flex;margin-right:6px}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .o-table-column-filter-icon .mat-icon{align-self:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-header-cell .o-table-column-filter-icon .o-table-header-indicator-numbered{right:-5px;bottom:-6px}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], animations: [
         trigger('iconState', [
             state('ACTIVE, HINT', style({ opacity: 1 })),
@@ -32772,7 +32980,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
         }], ctorParameters: function () { return [{ type: OTableBase, decorators: [{
                     type: Inject,
                     args: [forwardRef(() => OTableBase)]
-                }] }]; } });
+                }] }, { type: i1$1.MatDialog }, { type: DialogService }, { type: OTranslateService }]; } });
 
 const DEFAULT_INPUTS_O_TABLE_HEADER = [
     'column'
@@ -33008,8 +33216,11 @@ class OTableDao {
         return this.dataService[this.methods.query](this.dataService.requestArgumentAdapter.parseQueryParameters(queryArgs));
     }
     removeQuery(filters, sqlTypes) {
-        const id = this.dataService.requestArgumentAdapter.getIdFromFilter(filters);
-        return merge(...filters.map((kv => this.dataService[this.methods.delete](id, this.entity, sqlTypes))));
+        const deleteRequests = filters.map((kv => {
+            const id = this.dataService.requestArgumentAdapter.getIdFromFilter(kv);
+            return this.dataService[this.methods.delete](id, this.entity, sqlTypes);
+        }));
+        return merge(...deleteRequests);
     }
     insertQuery(av, sqlTypes) {
         if (this.usingStaticData) {
@@ -33920,9 +34131,35 @@ class OTableComponent extends AbstractOServiceComponent {
         this.destroy();
         this.initialize();
         this.state.reset(this.pageable);
+        if (options?.data) {
+            this.setData(options.data.data, options.data?.sqlTypes);
+            this.updatePaginationInfo(options.data.data);
+            this.currentPage = 0;
+        }
+        if (options?.paginationData) {
+            this.reinitializePaginationInfo(options.paginationData);
+        }
         this.initTableAfterViewInit();
         this.onReinitialize.emit(null);
     }
+    reinitializePaginationInfo(paginationData) {
+        this.currentPage = paginationData.pageNumber;
+        this.queryRows = paginationData.pageSize;
+        if (this.pageable) {
+            if (paginationData.startRecordIndex !== undefined) {
+                const resultEndIndex = paginationData.startRecordIndex + (this.getDataArray() ? this.getDataArray().length : 0);
+                this.state.queryRecordOffset = resultEndIndex;
+            }
+            if (paginationData.totalQueryRecordsNumber !== undefined) {
+                this.state.totalQueryRecordsNumber = paginationData.totalQueryRecordsNumber;
+            }
+            const pageNumber = this.state.queryRecordOffset == 0 ? 0 : this.dataService?.getPaginationContext().pageNumber;
+            super.updatePaginationContext({ pageNumber: pageNumber, offset: this.state.queryRecordOffset, totalSize: this.state.totalQueryRecordsNumber, pageSize: this.state.queryRows });
+        }
+        else {
+            this.updatePaginationContext({ totalSize: this.getDataArray().length });
+        }
+    }
     initTableAfterViewInit() {
         this.parseVisibleColumns();
         this.parseSearcheableColumns();
@@ -35961,10 +36198,33 @@ class OTableComponent extends AbstractOServiceComponent {
     getSnackService() {
         return this.snackBarService;
     }
-    getSourceDataByFilterColumn(column) {
-        return (this.oTableColumnsFilterComponent?.getFilterValuesInData(column.attr) ||
-            (this.oTableColumnsFilterComponent?.filterValuesInData ||
-                'current-page'));
+    getFilterColumnByAttr(attr) {
+        if (this.oTableColumnsFilterComponent?.columnsArray?.length) {
+            return this.oTableColumnsFilterComponent?.columnsArray.find(filterColumn => filterColumn.attr === attr);
+        }
+        const visibleColumn = this.oTableOptions.columns?.find(col => col.attr === attr && col.visible);
+        if (visibleColumn) {
+            return {
+                attr: visibleColumn.attr,
+                title: visibleColumn.title,
+                filterValuesInData: 'current-page',
+                sort: '',
+                startView: ''
+            };
+        }
+        return undefined;
+    }
+    updateColumnTitles(columns) {
+        if (!this.matTable || !this.oTableOptions?.columns)
+            return;
+        for (const col of this.oTableOptions.columns) {
+            const updated = columns.find(c => c.attr === col.attr);
+            if (updated) {
+                col.title = this.translateService.get(updated.title);
+            }
+        }
+        ;
+        this.matTable?.removeHeaderRowDef(null);
     }
 }
 OTableComponent.DEFAULT_BASE_SIZE_SPINNER = 100;
@@ -35981,7 +36241,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 }, { propertyName: "exportOptsTemplate", predicate: OTableExportButtonComponent }], viewQueries: [{ propertyName: "oMatSort", 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: "rows", predicate: MatRow, descendants: true }, { propertyName: "tooltip", predicate: MatTooltip, 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-container>\n  </o-data-toolbar>\n\n  <div #tableBody class=\"o-table-body o-scroll\" [class.horizontal-scroll]=\"horizontalScroll\" [class.scrolled]=\"horizontalScrolled\"\n        [ngStyle]=\"{'visibility': spinnerContainer ? 'hidden' : 'visible'}\">\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     [ngStyle]=\"{'visibility': spinnerContainer ? 'hidden' : 'visible'}\">\n  </mat-paginator>\n\n  <!--LOADING-->\n  <div #spinnerContainer *ngIf=\"showLoading | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" [ngStyle]=\"{'top.px': toolBarHeight}\"\n    class=\"spinner-container\" [class.spinner-container-scrollable]=\"loadingScroll | async\">\n    <o-table-skeleton></o-table-skeleton>\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) === false\" [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\" *ngIf=\"isSelectionModeMultiple()\">\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\"\n        (click)=\"toggleRowExpandable(row, $event)\"\n        (keydown)=\"toggleRowExpandable(row, $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, getCellAlignClass(column)]\">\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, getCellAlignClass(column)]\">\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-footer-cell{padding:0 12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-footer-cell.o-start{text-align:start}.o-table .o-table-container .mat-mdc-table .mat-mdc-footer-cell.o-center{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-footer-cell.o-end{text-align:end}.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.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:30px}.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: i3.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: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i14.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i14.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i14.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i14.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i14.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i14.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i14.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i14.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i14.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i14.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i14.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i14.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i14.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i14.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$4.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: OContextMenuDirective, selector: "[oContextMenu]", inputs: ["oContextMenu", "oContextMenuData"] }, { kind: "directive", type: i18.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: "component", type: OTableSkeletonComponent, selector: "o-table-skeleton" }, { 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 }, { propertyName: "exportOptsTemplate", predicate: OTableExportButtonComponent }], viewQueries: [{ propertyName: "oMatSort", 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: "matTable", first: true, predicate: MatTable, descendants: true }, { propertyName: "oTableMenu", first: true, predicate: ["tableMenu"], descendants: true }, { propertyName: "rows", predicate: MatRow, descendants: true }, { propertyName: "tooltip", predicate: MatTooltip, 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-container>\n  </o-data-toolbar>\n\n  <div #tableBody class=\"o-table-body o-scroll\" [class.horizontal-scroll]=\"horizontalScroll\" [class.scrolled]=\"horizontalScrolled\"\n        [ngStyle]=\"{'visibility': spinnerContainer ? 'hidden' : 'visible'}\">\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     [ngStyle]=\"{'visibility': spinnerContainer ? 'hidden' : 'visible'}\">\n  </mat-paginator>\n\n  <!--LOADING-->\n  <div #spinnerContainer *ngIf=\"showLoading | async\" fxLayout=\"column\" fxLayoutAlign=\"center center\" [ngStyle]=\"{'top.px': toolBarHeight}\"\n    class=\"spinner-container\" [class.spinner-container-scrollable]=\"loadingScroll | async\">\n    <o-table-skeleton></o-table-skeleton>\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) === false\" [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\" *ngIf=\"isSelectionModeMultiple()\">\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\"\n        (click)=\"toggleRowExpandable(row, $event)\"\n        (keydown)=\"toggleRowExpandable(row, $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, getCellAlignClass(column)]\">\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, getCellAlignClass(column)]\">\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-footer-cell{padding:0 12px}.o-table .o-table-container .mat-mdc-table .mat-mdc-footer-cell.o-start{text-align:start}.o-table .o-table-container .mat-mdc-table .mat-mdc-footer-cell.o-center{text-align:center}.o-table .o-table-container .mat-mdc-table .mat-mdc-footer-cell.o-end{text-align:end}.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.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:30px}.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: i3.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: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i14.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i14.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i14.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i14.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i14.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i14.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i14.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i14.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i14.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i14.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i14.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i14.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i14.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i14.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$4.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: OContextMenuDirective, selector: "[oContextMenu]", inputs: ["oContextMenu", "oContextMenuData"] }, { kind: "directive", type: i18.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: "component", type: OTableSkeletonComponent, selector: "o-table-skeleton" }, { 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: '*' })),
@@ -36166,6 +36426,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             }], rows: [{
                 type: ViewChildren,
                 args: [MatRow]
+            }], matTable: [{
+                type: ViewChild,
+                args: [MatTable]
             }], oTableMenu: [{
                 type: ViewChild,
                 args: ['tableMenu']
@@ -38894,6 +39157,35 @@ class OTreeDao {
             clearTimeout(this.loadingTimer);
         }
     }
+    queryNodeChildren(flatNode, recursive) {
+        const component = recursive ? flatNode.node : flatNode.childNode;
+        const queryMethodName = component.pageable
+            ? component.paginatedQueryMethod
+            : component.queryMethod;
+        const entity = component.entity;
+        const service = component.getDataService();
+        if (!service || !(queryMethodName in service) || !entity) {
+            return of({ data: [] });
+        }
+        let filter;
+        if (component.recursive) {
+            const parentItem = ServiceUtils.getParentKeysFromForm(component.getParentKeysEquivalence(), component.getForm());
+            filter = parentItem ?? {};
+            filter[component.parentColumn] = flatNode.data[component.getKeys()[0]];
+        }
+        else {
+            filter = ServiceUtils.getFilterUsingParentKeys(flatNode.data, flatNode.childNode.getParentKeysEquivalence());
+        }
+        const queryArgs = [
+            filter,
+            Util.parseArray(component.columns, true),
+            component.entity,
+            null,
+            flatNode.offset ?? 0,
+            component.recursive ? component.queryRows : flatNode.childNode.queryRows
+        ];
+        return service[queryMethodName](...queryArgs);
+    }
 }
 OTreeDao.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTreeDao, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
 OTreeDao.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTreeDao });
@@ -38914,8 +39206,15 @@ class OTreeDataSource {
         this._treeControl = _treeControl;
         this.injector = injector;
         this.dataChange = new BehaviorSubject([]);
+        this.resultsLength = 0;
         this.translateService = this.injector.get(OTranslateService);
         this._database = this.oTree.daoTree;
+        if (this._database) {
+            this.resultsLength = this._database.data.length;
+        }
+        if (oTree.matpaginator) {
+            this._paginator = oTree.matpaginator;
+        }
     }
     connect(collectionViewer) {
         this._treeControl.expansionModel.changed.subscribe(change => {
@@ -38925,6 +39224,11 @@ class OTreeDataSource {
             }
         });
         return merge(collectionViewer.viewChange, this.dataChange).pipe(map$1(() => {
+            let data = Object.assign([], this.data);
+            if (this.oTree.pageable) {
+                const totalRecordsNumber = this.oTree.getTotalRecordsNumber();
+                this.resultsLength = totalRecordsNumber ?? data.length;
+            }
             return this.data;
         }));
     }
@@ -38946,25 +39250,26 @@ class OTreeDataSource {
         return 'level' in value && 'label' in value;
     }
     updateTree(parentNode, children, expand) {
-        const treeNode = parentNode.treeNode ? parentNode.treeNode : this.oTree;
         const index = this.data.findIndex(node => node.id === parentNode.id);
         if (!children || index < 0) {
+            parentNode.isLoading = false;
             return;
         }
+        const level = parentNode.level + 1;
+        const treeNode = parentNode.childNode ? parentNode.childNode : this.oTree;
+        const newNodes = children.map(child => this.isTreeFlatNode(child) ? child : treeNode.transformer(child, level, parentNode));
         if (expand) {
-            let level = parentNode.level + 1;
-            let nodes;
-            nodes = children.map(child => {
-                if (this.isTreeFlatNode(child)) {
-                    return child;
-                }
-                else {
-                    return treeNode.transformer(child, level, parentNode);
-                }
-            });
-            this.data.splice(index + 1, 0, ...nodes);
+            let insertIndex = index + 1;
+            while (insertIndex < this.data.length &&
+                this.data[insertIndex].level > parentNode.level) {
+                insertIndex++;
+            }
+            this.data.splice(insertIndex, 0, ...newNodes);
+            if (!this._treeControl.isExpanded(parentNode)) {
+                this._treeControl.expand(parentNode);
+            }
             if (this.oTree.selection.isSelected(parentNode)) {
-                this.oTree.selection.select(...nodes);
+                this.oTree.selection.select(...newNodes);
             }
         }
         else {
@@ -38973,6 +39278,7 @@ class OTreeDataSource {
                 ;
             this.data.splice(index + 1, count);
         }
+        this._treeControl.dataNodes = this.data;
         this.dataChange.next(this.data);
         parentNode.isLoading = false;
     }
@@ -39037,16 +39343,16 @@ class OTreeComponent extends AbstractOServiceComponent {
         if (node.level === 0 && Util.isDefined(this.rootTitle)) {
             return this.rootNodes;
         }
-        else if (node.treeNode) {
-            if (Util.isDefined(node.treeNode.rootTitle) && !Util.isDefined(node.rootNode)) {
+        else if (node.childNode) {
+            if (Util.isDefined(node.childNode.rootTitle) && !Util.isDefined(node.rootNode)) {
                 let rootNode = {
-                    id: this.dataSource.data.length + 1, rootNode: true, label: this.translateService.get(node.treeNode.rootTitle), level: node.level + 1, expandable: true, data: node.data, isLoading: false, treeNode: node.treeNode
+                    id: this.dataSource.data.length + 1, rootNode: true, label: this.translateService.get(node.childNode.rootTitle), level: node.level + 1, expandable: true, data: node.data, isLoading: false, node: node.childNode, childNode: node.childNode
                 };
                 this.daoTree.flatNodeMap.set(rootNode, node);
                 return [rootNode];
             }
             else {
-                return node.treeNode.childQueryData(node);
+                return this.childQueryData(node);
             }
         }
         else {
@@ -39058,7 +39364,7 @@ class OTreeComponent extends AbstractOServiceComponent {
             return this.rootNodes;
         }
         else {
-            return node.treeNode.childQueryData(node);
+            return this.childQueryData(node);
         }
     }
     getComponentFilter(existingFilter = {}) {
@@ -39072,6 +39378,39 @@ class OTreeComponent extends AbstractOServiceComponent {
         }
         return super.getComponentFilter(filter);
     }
+    onLoadMore(event, node) {
+        event.stopPropagation();
+        event.preventDefault();
+        const parentNode = this.getParentNode(node);
+        if (!parentNode || parentNode.isLoading)
+            return;
+        parentNode.isLoading = true;
+        parentNode.offset = Math.min((parentNode.offset ?? 0) + parentNode.childNode.queryRows, parentNode.totalQueryRecordsNumber);
+        parentNode.hasMore = parentNode.offset + parentNode.childNode.queryRows < parentNode.totalQueryRecordsNumber;
+        this.getChildren(parentNode).subscribe({
+            next: (res) => {
+                if (res.isSuccessful()) {
+                    const newData = res.data || [];
+                    this.dataSource.updateTree(parentNode, newData, true);
+                }
+            },
+            error: (err) => {
+                this.dialogService.error('ERROR', 'MESSAGES.ERROR_QUERY');
+                parentNode.isLoading = false;
+            }
+        });
+    }
+    isLastChildAndHasMore(node) {
+        let parent = this.daoTree.flatNodeMap.get(node);
+        if (!parent?.hasMore)
+            return false;
+        const siblings = this.treeControl.getDescendants(parent)
+            .filter(child => child.level === node.level);
+        if (!siblings || siblings.length === 0)
+            return false;
+        const lastSibling = siblings[siblings.length - 1];
+        return node.id === lastSibling.id;
+    }
     set nodeTemplate(value) {
         if (value != null) {
             this.leafNodeTemplate = value;
@@ -39097,6 +39436,7 @@ class OTreeComponent extends AbstractOServiceComponent {
         };
         this.hasChild = (_, _nodeData) => _nodeData.expandable;
         this.hasNoContent = (_, _nodeData) => _nodeData.label === '';
+        this.hasLoadMore = (node) => this.getLogicalLevel(node) > 0 && this.treeControl.isExpanded(node) && node.node.pageable;
         this.refreshButton = true;
         this.deleteButton = false;
         this.showButtonsText = false;
@@ -39125,11 +39465,12 @@ class OTreeComponent extends AbstractOServiceComponent {
                 'label': this.getItemText(node),
                 'level': level,
                 'node': this,
-                treeNode: this.treeNode,
+                childNode: this.treeNode,
                 'expandable': Util.isDefined(this.treeNode) || !!nodeChildren?.length || this.recursive,
                 'data': node,
                 'isLoading': false,
-                'route': this.route
+                'route': this.route,
+                'offset': this.parentComponent?.queryRows ?? 0
             };
             this.daoTree.flatNodeMap.set(flatNode, parentNode);
             nodeChildren.forEach(node => this.transformer(node, level + 1));
@@ -39164,15 +39505,24 @@ class OTreeComponent extends AbstractOServiceComponent {
         if (!this.visibleColumns) {
             this.visibleColumns = this.columns;
         }
+        if (this.state) {
+            this.state.queryRecordOffset = 0;
+            this.currentPage = this.state.currentPage ?? 0;
+        }
         if (!Util.isDefined(this.quickFilterColumns)) {
             this.quickFilterColumns = this.visibleColumns;
         }
+        this.parseSortColumn();
+    }
+    get state() {
+        return this.componentStateService.state;
     }
     ngAfterViewInit() {
         this.visibleColumnsArray = Util.parseArray(this.visibleColumns, true);
         this.quickFilterColArray = Util.parseArray(this.quickFilterColumns, true);
         this.setDatasource();
         this.afterViewInit();
+        this.registerQuickFilter(this.searchInputComponent);
         if (this.queryOnInit) {
             this.queryData();
         }
@@ -39229,16 +39579,24 @@ class OTreeComponent extends AbstractOServiceComponent {
             this.dataSource.updateTree(node, [], expand);
         }
     }
-    updateAsyncTree(children, node, expand) {
+    updateAsyncTree(children, flatNode, expand) {
         children.subscribe((res) => {
             let data;
             if (res.isSuccessful()) {
                 const arrData = (res.data !== undefined) ? res.data : [];
                 data = Util.isArray(arrData) ? arrData : [];
             }
-            this.dataSource.updateTree(node, data, expand);
+            const node = this.recursive ? flatNode.node : flatNode.childNode;
+            flatNode.hasMore = false;
+            flatNode.totalQueryRecordsNumber = node.pageable ? res.totalQueryRecordsNumber : data.length;
+            const canLoadMore = this.hasLoadMore(flatNode);
+            flatNode.hasMore = false;
+            if (canLoadMore) {
+                flatNode.hasMore = Util.isDefined(res.startRecordIndex) ? (node.queryRows + res.startRecordIndex < res.totalQueryRecordsNumber) : (this.queryRows < data.length);
+            }
+            this.dataSource.updateTree(flatNode, data, expand);
         }, err => {
-            node.isLoading = false;
+            flatNode.isLoading = false;
             if (Util.isDefined(this.queryFallbackFunction)) {
                 this.queryFallbackFunction(err);
             }
@@ -39319,6 +39677,15 @@ class OTreeComponent extends AbstractOServiceComponent {
         }
     }
     filterData(value, loadMore) {
+        if (this.pageable) {
+            const queryArgs = {
+                offset: 0,
+                length: this.queryRows,
+                replace: true
+            };
+            this.queryData(void 0, queryArgs);
+            return;
+        }
         let filteredTreeData = [];
         if (value) {
             for (let [nestedNode] of this.daoTree.flatNodeMap) {
@@ -39476,6 +39843,18 @@ class OTreeComponent extends AbstractOServiceComponent {
         }
         return rootNodes;
     }
+    parseSortColumn() {
+        this.sortColumnArray = ServiceUtils.parseSortColumns(this.sortColumn) || [];
+    }
+    getQueryArguments(filter, ovrrArgs) {
+        const queryArguments = super.getQueryArguments(filter, ovrrArgs);
+        if (this.pageable) {
+            if (Util.isDefined(this.sortColumnArray)) {
+                queryArguments[6] = this.sortColumnArray;
+            }
+        }
+        return queryArguments;
+    }
     shouldBeRoot(parent, selectedKeys) {
         const grandParent = this.daoTree.flatNodeMap.get(parent);
         if (!grandParent)
@@ -39526,12 +39905,51 @@ class OTreeComponent extends AbstractOServiceComponent {
     getSelectedFlatNodes() {
         return this.selection.selected;
     }
+    getParentNode(node) {
+        const currentLevel = this.getLevel(node);
+        if (currentLevel < 1) {
+            return null;
+        }
+        const startIndex = this.treeControl.dataNodes.indexOf(node) - 1;
+        for (let i = startIndex; i >= 0; i--) {
+            const currentNode = this.treeControl.dataNodes[i];
+            if (this.getLevel(currentNode) === currentLevel - 1) {
+                return currentNode;
+            }
+        }
+        return null;
+    }
+    reloadData(clearSelectedItems = true) {
+        if (clearSelectedItems) {
+            this.clearSelection();
+        }
+        let queryArgs;
+        if (this.pageable) {
+            queryArgs = {
+                offset: this.currentPage * this.queryRows,
+                length: this.queryRows
+            };
+        }
+        this.queryData(void 0, queryArgs);
+    }
+    getLogicalLevel(node) {
+        const hasFakeRoot = this.hasFakeRoot();
+        return hasFakeRoot ? node.level - 1 : node.level;
+    }
+    hasFakeRoot() {
+        return !!this.rootTitle;
+    }
+    childQueryData(flatNode) {
+        return this.daoTree.queryNodeChildren(flatNode, this.recursive);
+    }
 }
 OTreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTreeComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: forwardRef(() => OFormComponent), optional: true }], target: i0.ɵɵFactoryTarget.Component });
 OTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: OTreeComponent, selector: "o-tree", inputs: { oattr: ["attr", "oattr"], service: "service", entity: "entity", columns: "columns", keys: "keys", parentKeys: ["parent-keys", "parentKeys"], queryMethod: ["query-method", "queryMethod"], insertButton: ["insert-button", "insertButton"], refreshButton: ["refresh-button", "refreshButton"], deleteButton: ["delete-button", "deleteButton"], visibleColumns: ["visible-columns", "visibleColumns"], selectAllCheckbox: ["select-all-checkbox", "selectAllCheckbox"], separator: "separator", parentColumn: ["parent-column", "parentColumn"], sortColumn: ["sort-column", "sortColumn"], selectAllCheckboxVisible: ["select-all-checkbox-visible", "selectAllCheckboxVisible"], filterCaseSensitive: ["filter-case-sensitive", "filterCaseSensitive"], quickFilter: ["quick-filter", "quickFilter"], quickFilterPlaceholder: ["quick-filter-placeholder", "quickFilterPlaceholder"], quickFilterColumns: ["quick-filter-columns", "quickFilterColumns"], detailMode: ["detail-mode", "detailMode"], detailFormRoute: ["detail-form-route", "detailFormRoute"], showButtonsText: ["show-buttons-text", "showButtonsText"], rootTitle: ["root-title", "rootTitle"], recursive: "recursive", route: "route" }, outputs: { onNodeSelected: "onNodeSelected", onNodeExpanded: "onNodeExpanded", onNodeCollapsed: "onNodeCollapsed", onLoadNextLevel: "onLoadNextLevel", onDataLoaded: "onDataLoaded", onNodeClick: "onNodeClick" }, host: { properties: { "class.o-tree": "true" } }, providers: [
         OTreeDao,
-        OntimizeServiceProvider
-    ], queries: [{ propertyName: "leafNodeTemplate", first: true, predicate: ["leafNodeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "parentNodeTemplate", first: true, predicate: ["parentNodeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "nodeTemplate", first: true, predicate: ["nodeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "treeNode", first: true, predicate: i0.forwardRef(function () { return OTreeNodeComponent; }) }], usesInheritance: true, ngImport: i0, template: "<div fxLayout=\"column\" fxFlex>\n\n  <div *ngIf=\"hasControls()\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n\n    <div class=\"buttons\">\n      <ng-container *ngIf=\"showButtonsText;else showButtonsWithoutText\">\n\n        <button *ngIf=\"insertButton\" type=\"button\" mat-stroked-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n          <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n          <span>{{ 'INSERT' | oTranslate }}</span>\n        </button>\n\n        <button *ngIf=\"refreshButton\" type=\"button\" mat-stroked-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\" (click)=\"reloadData()\">\n          <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n          <span>{{ 'REFRESH' | oTranslate }}</span>\n        </button>\n\n        <button *ngIf=\"deleteButton\" type=\"button\" mat-stroked-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n          [class.disabled]=\"!enabledDeleteButton\">\n          <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n          <span>{{ 'DELETE' | oTranslate }}</span>\n        </button>\n\n      </ng-container>\n\n      <ng-template #showButtonsWithoutText>\n        <button *ngIf=\"insertButton\" type=\"button\" mat-icon-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n          <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n        </button>\n\n        <button *ngIf=\"refreshButton\" type=\"button\" mat-icon-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\" (click)=\"reloadData()\">\n          <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n        </button>\n\n        <button *ngIf=\"deleteButton\" type=\"button\" mat-icon-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n          [class.disabled]=\"!enabledDeleteButton\">\n          <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n        </button>\n      </ng-template>\n\n      <ng-content select=\"[o-tree-button]\"></ng-content>\n    </div>\n    <div fxFlex>\n      <span fxLayoutAlign=\"center center\" class=\"title\">{{ title | oTranslate }}</span>\n    </div>\n    <o-search-input *ngIf=\"quickFilter\" [filter-case-sensitive]=\"filterCaseSensitive\" [show-case-sensitive-checkbox]=\"showCaseSensitiveCheckbox()\"\n      [columns]=\"quickFilterColumns\" [placeholder]=\"quickFilterPlaceholder\" appearance=\"outline\" float-label=\"never\" show-menu=\"no\">\n    </o-search-input>\n    <button type=\"button\" *ngIf=\"showTreeMenuButton\" mat-icon-button class=\"o-tree-menu-button\" [matMenuTriggerFor]=\"treeMenu.matMenu\"\n      (click)=\"$event.stopPropagation()\">\n      <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n    </button>\n    <o-tree-menu #treeMenu [select-all-checkbox]=\"selectAllCheckbox\" [select-all-checkbox-visible]=\"selectAllCheckboxVisible\"\n      (onSelectCheckboxChange)=\"onSelectCheckboxChange($event)\"></o-tree-menu>\n\n  </div>\n\n  <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n\n    <!-- This is the tree node template for leaf nodes -->\n    <mat-tree-node *matTreeNodeDef=\"let node\" (click)=\"leafNodeClicked($event, node)\" (keydown)=\"leafNodeClicked($event, node)\" matTreeNodeToggle\n      matTreeNodePadding [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n      <!-- use a disabled button to provide padding for tree leaf -->\n      <button mat-icon-button disabled></button>\n\n      <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\">\n        <div class=\"node-wrapper\">\n          <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\" [checked]=\"selection.isSelected(node)\"\n            (click)=\"checkboxClicked($event)\" (change)=\"todoLeafItemSelectionToggle(node)\" (keyDown)=\"checkboxClicked($event)\">\n          </mat-checkbox>\n          <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n          </ng-container>\n        </div>\n      </ng-container>\n      <ng-template #simpleLeafNodeTpl>\n        <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n        </ng-container>\n      </ng-template>\n\n    </mat-tree-node>\n    <!-- This is the tree node template for expandable nodes -->\n    <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" (click)=\"parentNodeClicked($event, node)\" (keydown)=\"parentNodeClicked($event, node)\"\n      matTreeNodePadding [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n      <button mat-icon-button [attr.aria-label]=\"'toggle ' + node.label\" matTreeNodeToggle (click)=\"onClickToggleButton($event, node)\">\n        <mat-icon class=\"mat-icon-rtl-mirror\">\n          {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}\n        </mat-icon>\n      </button>\n\n      <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\">\n        <div class=\"node-wrapper\">\n          <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\" (click)=\"checkboxClicked($event)\"\n            (change)=\"todoItemSelectionToggle(node)\" [checked]=\"descendantsAllSelected(node)\" [indeterminate]=\"descendantsPartiallySelected(node)\">\n          </mat-checkbox>\n          <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n          </ng-container>\n        </div>\n      </ng-container>\n\n      <ng-template #simpleParentNodeTpl>\n        <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n        </ng-container>\n      </ng-template>\n    </mat-tree-node>\n  </mat-tree>\n</div>\n\n<ng-template let-node #leafNodeFulltemplate>\n  <ng-container *ngIf=\"leafNodeTemplate; else defaultLeafNodeTpl\" [ngTemplateOutlet]=\"leafNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultLeafNodeTpl>\n    {{node.label}}\n  </ng-template>\n</ng-template>\n\n<ng-template let-node #parentNodeFulltemplate>\n  <ng-container *ngIf=\"parentNodeTemplate; else defaultParentNodeTpl\" [ngTemplateOutlet]=\"parentNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultParentNodeTpl>\n    <span>{{node.label}}</span>\n    <mat-progress-bar *ngIf=\"node.isLoading\" mode=\"indeterminate\" fxFlex></mat-progress-bar>\n  </ng-template>\n</ng-template>\n", styles: [".o-tree .mat-mdc-progress-bar{margin-left:30px}.o-tree .node-wrapper{align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: OSearchInputComponent, selector: "o-search-input", inputs: ["placeholder", "label", "width", "float-label", "appearance", "columns", "filter-case-sensitive", "show-case-sensitive-checkbox", "show-menu"], outputs: ["onSearch"] }, { 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: "component", type: i3.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: i3.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: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: i10$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i10$1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i10$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i10$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i10$1.MatTreeNode, selector: "mat-tree-node", inputs: ["role", "disabled", "tabIndex"], exportAs: ["matTreeNode"] }, { kind: "component", type: OTreeMenuComponent, selector: "o-tree-menu", inputs: ["select-all-checkbox", "select-all-checkbox-visible"], outputs: ["onSelectCheckboxChange"] }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], encapsulation: i0.ViewEncapsulation.None });
+        OntimizeServiceProvider,
+        ComponentStateServiceProvider,
+        { provide: O_COMPONENT_STATE_SERVICE, useClass: OTreeComponentStateService },
+    ], queries: [{ propertyName: "leafNodeTemplate", first: true, predicate: ["leafNodeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "parentNodeTemplate", first: true, predicate: ["parentNodeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "nodeTemplate", first: true, predicate: ["nodeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "treeNode", first: true, predicate: i0.forwardRef(function () { return OTreeNodeComponent; }) }], viewQueries: [{ propertyName: "matpaginator", first: true, predicate: MatPaginator, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div fxLayout=\"column\" fxFlexFill>\n  <div fxFlex>\n    <div *ngIf=\"hasControls()\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n\n      <div class=\"buttons\">\n        <ng-container *ngIf=\"showButtonsText;else showButtonsWithoutText\">\n\n          <button *ngIf=\"insertButton\" type=\"button\" mat-stroked-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n            <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n            <span>{{ 'INSERT' | oTranslate }}</span>\n          </button>\n\n          <button *ngIf=\"refreshButton\" type=\"button\" mat-stroked-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\"\n            (click)=\"reloadData()\">\n            <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n            <span>{{ 'REFRESH' | oTranslate }}</span>\n          </button>\n\n          <button *ngIf=\"deleteButton\" type=\"button\" mat-stroked-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n            [class.disabled]=\"!enabledDeleteButton\">\n            <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n            <span>{{ 'DELETE' | oTranslate }}</span>\n          </button>\n\n        </ng-container>\n\n        <ng-template #showButtonsWithoutText>\n          <button *ngIf=\"insertButton\" type=\"button\" mat-icon-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n            <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n          </button>\n\n          <button *ngIf=\"refreshButton\" type=\"button\" mat-icon-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\" (click)=\"reloadData()\">\n            <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n          </button>\n\n          <button *ngIf=\"deleteButton\" type=\"button\" mat-icon-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n            [class.disabled]=\"!enabledDeleteButton\">\n            <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n          </button>\n        </ng-template>\n\n        <ng-content select=\"[o-tree-button]\"></ng-content>\n      </div>\n      <div fxFlex>\n        <span fxLayoutAlign=\"center center\" class=\"title\">{{ title | oTranslate }}</span>\n      </div>\n      <o-search-input *ngIf=\"quickFilter\" [filter-case-sensitive]=\"filterCaseSensitive\" [show-case-sensitive-checkbox]=\"showCaseSensitiveCheckbox()\"\n        [columns]=\"quickFilterColumns\" [placeholder]=\"quickFilterPlaceholder\" appearance=\"outline\" float-label=\"never\" show-menu=\"no\">\n      </o-search-input>\n      <button type=\"button\" *ngIf=\"showTreeMenuButton\" mat-icon-button class=\"o-tree-menu-button\" [matMenuTriggerFor]=\"treeMenu.matMenu\"\n        (click)=\"$event.stopPropagation()\">\n        <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n      </button>\n      <o-tree-menu #treeMenu [select-all-checkbox]=\"selectAllCheckbox\" [select-all-checkbox-visible]=\"selectAllCheckboxVisible\"\n        (onSelectCheckboxChange)=\"onSelectCheckboxChange($event)\"></o-tree-menu>\n\n    </div>\n\n    <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n\n      <!-- This is the tree node template for leaf nodes -->\n      <mat-tree-node *matTreeNodeDef=\"let node\" (click)=\"leafNodeClicked($event, node)\" matTreeNodeToggle matTreeNodePadding\n        [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n        <!-- use a disabled button to provide padding for tree leaf -->\n        <div fxLayout=\"column\">\n          <div fxLayout=\"row\">\n            <button mat-icon-button disabled></button>\n\n            <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\">\n              <div class=\"node-wrapper\">\n                <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\" [checked]=\"selection.isSelected(node)\"\n                  (click)=\"checkboxClicked($event)\" (change)=\"todoLeafItemSelectionToggle(node)\" (keyDown)=\"checkboxClicked($event)\">\n                </mat-checkbox>\n                <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n                </ng-container>\n              </div>\n            </ng-container>\n            <ng-template #simpleLeafNodeTpl>\n              <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n              </ng-container>\n            </ng-template>\n          </div>\n          <div *ngIf=\"isLastChildAndHasMore(node)\">\n            <button #buttonLoadMore mat-button color=\"primary\" (click)=\"onLoadMore($event, node)\">\n              {{ 'O_TREE.LOAD_MORE' | oTranslate}}\n            </button>\n          </div>\n        </div>\n\n      </mat-tree-node>\n      <!-- This is the tree node template for expandable nodes -->\n      <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" (click)=\"parentNodeClicked($event, node)\" matTreeNodePadding\n        [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n        <button mat-icon-button [attr.aria-label]=\"'toggle ' + node.label\" matTreeNodeToggle (click)=\"onClickToggleButton($event, node)\">\n          <mat-icon class=\"mat-icon-rtl-mirror\">\n            {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}\n          </mat-icon>\n        </button>\n\n        <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\">\n          <div class=\"node-wrapper\">\n            <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\" (click)=\"checkboxClicked($event)\"\n              (change)=\"todoItemSelectionToggle(node)\" [checked]=\"descendantsAllSelected(node)\" [indeterminate]=\"descendantsPartiallySelected(node)\">\n            </mat-checkbox>\n            <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n            </ng-container>\n          </div>\n        </ng-container>\n\n        <ng-template #simpleParentNodeTpl>\n          <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n          </ng-container>\n        </ng-template>\n      </mat-tree-node>\n\n\n    </mat-tree>\n  </div>\n\n  <!-- mat pagination-->\n  <mat-paginator *ngIf=\"paginationControls && pageable\" #matpaginator [length]=\"dataSource?.resultsLength\" [pageSize]=\"queryRows\"\n    [pageSizeOptions]=\"pageSizeOptions\" [pageIndex]=\"currentPage\" [showFirstLastButtons]=\"true\" (page)=\"onChangePage($event)\"\n    [ngStyle]=\"{'visibility': (loading | async) === false ? 'visible':'hidden'}\"></mat-paginator>\n\n\n</div>\n\n<ng-template let-node #leafNodeFulltemplate>\n  <ng-container *ngIf=\"leafNodeTemplate; else defaultLeafNodeTpl\" [ngTemplateOutlet]=\"leafNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultLeafNodeTpl>\n    {{node.label}}\n  </ng-template>\n</ng-template>\n\n<ng-template let-node #parentNodeFulltemplate>\n  <ng-container *ngIf=\"parentNodeTemplate; else defaultParentNodeTpl\" [ngTemplateOutlet]=\"parentNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultParentNodeTpl>\n    <span>{{node.label}}</span>\n    <mat-progress-bar *ngIf=\"node.isLoading\" mode=\"indeterminate\" fxFlex></mat-progress-bar>\n  </ng-template>\n</ng-template>\n", styles: [".o-tree .mat-mdc-progress-bar{margin-left:30px}.o-tree .node-wrapper{align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: OSearchInputComponent, selector: "o-search-input", inputs: ["placeholder", "label", "width", "float-label", "appearance", "columns", "filter-case-sensitive", "show-case-sensitive-checkbox", "show-menu"], outputs: ["onSearch"] }, { 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: "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: "component", type: i3.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: i3.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: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i11$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i11$2.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i11$2.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i11$2.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i11$2.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i11$2.MatTreeNode, selector: "mat-tree-node", inputs: ["role", "disabled", "tabIndex"], exportAs: ["matTreeNode"] }, { kind: "component", type: OTreeMenuComponent, selector: "o-tree-menu", inputs: ["select-all-checkbox", "select-all-checkbox-visible"], outputs: ["onSelectCheckboxChange"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: OTranslatePipe, name: "oTranslate" }], encapsulation: i0.ViewEncapsulation.None });
 __decorate([
     BooleanInputConverter(),
     __metadata("design:type", Boolean)
@@ -39562,8 +39980,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                         '[class.o-tree]': 'true'
                     }, providers: [
                         OTreeDao,
-                        OntimizeServiceProvider
-                    ], template: "<div fxLayout=\"column\" fxFlex>\n\n  <div *ngIf=\"hasControls()\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n\n    <div class=\"buttons\">\n      <ng-container *ngIf=\"showButtonsText;else showButtonsWithoutText\">\n\n        <button *ngIf=\"insertButton\" type=\"button\" mat-stroked-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n          <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n          <span>{{ 'INSERT' | oTranslate }}</span>\n        </button>\n\n        <button *ngIf=\"refreshButton\" type=\"button\" mat-stroked-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\" (click)=\"reloadData()\">\n          <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n          <span>{{ 'REFRESH' | oTranslate }}</span>\n        </button>\n\n        <button *ngIf=\"deleteButton\" type=\"button\" mat-stroked-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n          [class.disabled]=\"!enabledDeleteButton\">\n          <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n          <span>{{ 'DELETE' | oTranslate }}</span>\n        </button>\n\n      </ng-container>\n\n      <ng-template #showButtonsWithoutText>\n        <button *ngIf=\"insertButton\" type=\"button\" mat-icon-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n          <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n        </button>\n\n        <button *ngIf=\"refreshButton\" type=\"button\" mat-icon-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\" (click)=\"reloadData()\">\n          <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n        </button>\n\n        <button *ngIf=\"deleteButton\" type=\"button\" mat-icon-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n          [class.disabled]=\"!enabledDeleteButton\">\n          <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n        </button>\n      </ng-template>\n\n      <ng-content select=\"[o-tree-button]\"></ng-content>\n    </div>\n    <div fxFlex>\n      <span fxLayoutAlign=\"center center\" class=\"title\">{{ title | oTranslate }}</span>\n    </div>\n    <o-search-input *ngIf=\"quickFilter\" [filter-case-sensitive]=\"filterCaseSensitive\" [show-case-sensitive-checkbox]=\"showCaseSensitiveCheckbox()\"\n      [columns]=\"quickFilterColumns\" [placeholder]=\"quickFilterPlaceholder\" appearance=\"outline\" float-label=\"never\" show-menu=\"no\">\n    </o-search-input>\n    <button type=\"button\" *ngIf=\"showTreeMenuButton\" mat-icon-button class=\"o-tree-menu-button\" [matMenuTriggerFor]=\"treeMenu.matMenu\"\n      (click)=\"$event.stopPropagation()\">\n      <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n    </button>\n    <o-tree-menu #treeMenu [select-all-checkbox]=\"selectAllCheckbox\" [select-all-checkbox-visible]=\"selectAllCheckboxVisible\"\n      (onSelectCheckboxChange)=\"onSelectCheckboxChange($event)\"></o-tree-menu>\n\n  </div>\n\n  <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n\n    <!-- This is the tree node template for leaf nodes -->\n    <mat-tree-node *matTreeNodeDef=\"let node\" (click)=\"leafNodeClicked($event, node)\" (keydown)=\"leafNodeClicked($event, node)\" matTreeNodeToggle\n      matTreeNodePadding [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n      <!-- use a disabled button to provide padding for tree leaf -->\n      <button mat-icon-button disabled></button>\n\n      <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\">\n        <div class=\"node-wrapper\">\n          <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\" [checked]=\"selection.isSelected(node)\"\n            (click)=\"checkboxClicked($event)\" (change)=\"todoLeafItemSelectionToggle(node)\" (keyDown)=\"checkboxClicked($event)\">\n          </mat-checkbox>\n          <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n          </ng-container>\n        </div>\n      </ng-container>\n      <ng-template #simpleLeafNodeTpl>\n        <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n        </ng-container>\n      </ng-template>\n\n    </mat-tree-node>\n    <!-- This is the tree node template for expandable nodes -->\n    <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" (click)=\"parentNodeClicked($event, node)\" (keydown)=\"parentNodeClicked($event, node)\"\n      matTreeNodePadding [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n      <button mat-icon-button [attr.aria-label]=\"'toggle ' + node.label\" matTreeNodeToggle (click)=\"onClickToggleButton($event, node)\">\n        <mat-icon class=\"mat-icon-rtl-mirror\">\n          {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}\n        </mat-icon>\n      </button>\n\n      <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\">\n        <div class=\"node-wrapper\">\n          <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\" (click)=\"checkboxClicked($event)\"\n            (change)=\"todoItemSelectionToggle(node)\" [checked]=\"descendantsAllSelected(node)\" [indeterminate]=\"descendantsPartiallySelected(node)\">\n          </mat-checkbox>\n          <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n          </ng-container>\n        </div>\n      </ng-container>\n\n      <ng-template #simpleParentNodeTpl>\n        <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n        </ng-container>\n      </ng-template>\n    </mat-tree-node>\n  </mat-tree>\n</div>\n\n<ng-template let-node #leafNodeFulltemplate>\n  <ng-container *ngIf=\"leafNodeTemplate; else defaultLeafNodeTpl\" [ngTemplateOutlet]=\"leafNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultLeafNodeTpl>\n    {{node.label}}\n  </ng-template>\n</ng-template>\n\n<ng-template let-node #parentNodeFulltemplate>\n  <ng-container *ngIf=\"parentNodeTemplate; else defaultParentNodeTpl\" [ngTemplateOutlet]=\"parentNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultParentNodeTpl>\n    <span>{{node.label}}</span>\n    <mat-progress-bar *ngIf=\"node.isLoading\" mode=\"indeterminate\" fxFlex></mat-progress-bar>\n  </ng-template>\n</ng-template>\n", styles: [".o-tree .mat-mdc-progress-bar{margin-left:30px}.o-tree .node-wrapper{align-items:center}\n"] }]
+                        OntimizeServiceProvider,
+                        ComponentStateServiceProvider,
+                        { provide: O_COMPONENT_STATE_SERVICE, useClass: OTreeComponentStateService },
+                    ], template: "<div fxLayout=\"column\" fxFlexFill>\n  <div fxFlex>\n    <div *ngIf=\"hasControls()\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n\n      <div class=\"buttons\">\n        <ng-container *ngIf=\"showButtonsText;else showButtonsWithoutText\">\n\n          <button *ngIf=\"insertButton\" type=\"button\" mat-stroked-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n            <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n            <span>{{ 'INSERT' | oTranslate }}</span>\n          </button>\n\n          <button *ngIf=\"refreshButton\" type=\"button\" mat-stroked-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\"\n            (click)=\"reloadData()\">\n            <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n            <span>{{ 'REFRESH' | oTranslate }}</span>\n          </button>\n\n          <button *ngIf=\"deleteButton\" type=\"button\" mat-stroked-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n            [class.disabled]=\"!enabledDeleteButton\">\n            <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n            <span>{{ 'DELETE' | oTranslate }}</span>\n          </button>\n\n        </ng-container>\n\n        <ng-template #showButtonsWithoutText>\n          <button *ngIf=\"insertButton\" type=\"button\" mat-icon-button aria-label=\"Insert\" [disabled]=\"!enabledInsertButton\" (click)=\"add($event)\">\n            <mat-icon svgIcon=\"ontimize:add\"></mat-icon>\n          </button>\n\n          <button *ngIf=\"refreshButton\" type=\"button\" mat-icon-button aria-label=\"Refresh\" [disabled]=\"!enabledRefreshButton\" (click)=\"reloadData()\">\n            <mat-icon svgIcon=\"ontimize:autorenew\"></mat-icon>\n          </button>\n\n          <button *ngIf=\"deleteButton\" type=\"button\" mat-icon-button aria-label=\"Delete\" [disabled]=\"!enabledDeleteButton\"\n            [class.disabled]=\"!enabledDeleteButton\">\n            <mat-icon svgIcon=\"ontimize:delete\"></mat-icon>\n          </button>\n        </ng-template>\n\n        <ng-content select=\"[o-tree-button]\"></ng-content>\n      </div>\n      <div fxFlex>\n        <span fxLayoutAlign=\"center center\" class=\"title\">{{ title | oTranslate }}</span>\n      </div>\n      <o-search-input *ngIf=\"quickFilter\" [filter-case-sensitive]=\"filterCaseSensitive\" [show-case-sensitive-checkbox]=\"showCaseSensitiveCheckbox()\"\n        [columns]=\"quickFilterColumns\" [placeholder]=\"quickFilterPlaceholder\" appearance=\"outline\" float-label=\"never\" show-menu=\"no\">\n      </o-search-input>\n      <button type=\"button\" *ngIf=\"showTreeMenuButton\" mat-icon-button class=\"o-tree-menu-button\" [matMenuTriggerFor]=\"treeMenu.matMenu\"\n        (click)=\"$event.stopPropagation()\">\n        <mat-icon svgIcon=\"ontimize:more_vert\"></mat-icon>\n      </button>\n      <o-tree-menu #treeMenu [select-all-checkbox]=\"selectAllCheckbox\" [select-all-checkbox-visible]=\"selectAllCheckboxVisible\"\n        (onSelectCheckboxChange)=\"onSelectCheckboxChange($event)\"></o-tree-menu>\n\n    </div>\n\n    <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n\n      <!-- This is the tree node template for leaf nodes -->\n      <mat-tree-node *matTreeNodeDef=\"let node\" (click)=\"leafNodeClicked($event, node)\" matTreeNodeToggle matTreeNodePadding\n        [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n        <!-- use a disabled button to provide padding for tree leaf -->\n        <div fxLayout=\"column\">\n          <div fxLayout=\"row\">\n            <button mat-icon-button disabled></button>\n\n            <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\">\n              <div class=\"node-wrapper\">\n                <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleLeafNodeTpl\" [checked]=\"selection.isSelected(node)\"\n                  (click)=\"checkboxClicked($event)\" (change)=\"todoLeafItemSelectionToggle(node)\" (keyDown)=\"checkboxClicked($event)\">\n                </mat-checkbox>\n                <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n                </ng-container>\n              </div>\n            </ng-container>\n            <ng-template #simpleLeafNodeTpl>\n              <ng-container [ngTemplateOutlet]=\"leafNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n              </ng-container>\n            </ng-template>\n          </div>\n          <div *ngIf=\"isLastChildAndHasMore(node)\">\n            <button #buttonLoadMore mat-button color=\"primary\" (click)=\"onLoadMore($event, node)\">\n              {{ 'O_TREE.LOAD_MORE' | oTranslate}}\n            </button>\n          </div>\n        </div>\n\n      </mat-tree-node>\n      <!-- This is the tree node template for expandable nodes -->\n      <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" (click)=\"parentNodeClicked($event, node)\" matTreeNodePadding\n        [ngClass]=\"{'selected-node': isSelectedNode(node)}\">\n        <button mat-icon-button [attr.aria-label]=\"'toggle ' + node.label\" matTreeNodeToggle (click)=\"onClickToggleButton($event, node)\">\n          <mat-icon class=\"mat-icon-rtl-mirror\">\n            {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}\n          </mat-icon>\n        </button>\n\n        <ng-container *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\">\n          <div class=\"node-wrapper\">\n            <mat-checkbox *ngIf=\"selectAllCheckboxVisible; else simpleParentNodeTpl\" (click)=\"checkboxClicked($event)\"\n              (change)=\"todoItemSelectionToggle(node)\" [checked]=\"descendantsAllSelected(node)\" [indeterminate]=\"descendantsPartiallySelected(node)\">\n            </mat-checkbox>\n            <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n            </ng-container>\n          </div>\n        </ng-container>\n\n        <ng-template #simpleParentNodeTpl>\n          <ng-container [ngTemplateOutlet]=\"parentNodeFulltemplate\" [ngTemplateOutletContext]=\"{$implicit:node}\">\n          </ng-container>\n        </ng-template>\n      </mat-tree-node>\n\n\n    </mat-tree>\n  </div>\n\n  <!-- mat pagination-->\n  <mat-paginator *ngIf=\"paginationControls && pageable\" #matpaginator [length]=\"dataSource?.resultsLength\" [pageSize]=\"queryRows\"\n    [pageSizeOptions]=\"pageSizeOptions\" [pageIndex]=\"currentPage\" [showFirstLastButtons]=\"true\" (page)=\"onChangePage($event)\"\n    [ngStyle]=\"{'visibility': (loading | async) === false ? 'visible':'hidden'}\"></mat-paginator>\n\n\n</div>\n\n<ng-template let-node #leafNodeFulltemplate>\n  <ng-container *ngIf=\"leafNodeTemplate; else defaultLeafNodeTpl\" [ngTemplateOutlet]=\"leafNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultLeafNodeTpl>\n    {{node.label}}\n  </ng-template>\n</ng-template>\n\n<ng-template let-node #parentNodeFulltemplate>\n  <ng-container *ngIf=\"parentNodeTemplate; else defaultParentNodeTpl\" [ngTemplateOutlet]=\"parentNodeTemplate\"\n    [ngTemplateOutletContext]=\"{$implicit:node.data}\">\n  </ng-container>\n\n  <ng-template #defaultParentNodeTpl>\n    <span>{{node.label}}</span>\n    <mat-progress-bar *ngIf=\"node.isLoading\" mode=\"indeterminate\" fxFlex></mat-progress-bar>\n  </ng-template>\n</ng-template>\n", styles: [".o-tree .mat-mdc-progress-bar{margin-left:30px}.o-tree .node-wrapper{align-items:center}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ElementRef }, { type: OFormComponent, decorators: [{
                     type: Optional
                 }, {
@@ -39575,6 +39995,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
             }], parentNodeTemplate: [{
                 type: ContentChild,
                 args: ['parentNodeTemplate', { read: TemplateRef, static: false }]
+            }], matpaginator: [{
+                type: ViewChild,
+                args: [MatPaginator]
             }], nodeTemplate: [{
                 type: ContentChild,
                 args: ['nodeTemplate', { read: TemplateRef, static: false }]
@@ -39599,23 +40022,7 @@ class OTreeNodeComponent extends OTreeComponent {
     ngAfterViewInit() {
         this.visibleColumnsArray = Util.parseArray(this.visibleColumns, true);
         this.quickFilterColArray = Util.parseArray(this.quickFilterColumns, true);
-    }
-    childQueryData(node) {
-        let queryMethodName = this.queryMethod;
-        if (!this.dataService || !(queryMethodName in this.dataService) || !this.entity) {
-            return of({ data: [] });
-        }
-        const parentItem = ServiceUtils.getParentKeysFromForm(this._pKeysEquiv, this.form);
-        let filter;
-        if (this.recursive) {
-            filter = parentItem ?? {};
-            filter[this.parentColumn] = node.data[this.keysArray[0]];
-        }
-        else {
-            filter = ServiceUtils.getFilterUsingParentKeys(node.data, node.treeNode._pKeysEquiv);
-        }
-        let queryArguments = [filter, this.colArray, this.entity];
-        return this.dataService[queryMethodName](...queryArguments);
+        this.setDatasource();
     }
 }
 OTreeNodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: OTreeNodeComponent, deps: [{ token: i0.Injector }, { token: i0.ElementRef }, { token: forwardRef(() => OFormComponent), optional: true }, { token: forwardRef(() => OTreeComponent), optional: true }, { token: OTreeNodeComponent, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component });
@@ -41890,5 +42297,5 @@ function ontimizePostBootstrap(ngModuleRef) {
 
 ;
 
-export { APP_CONFIG, AbstractComponentStateClass, AbstractComponentStateService, AbstractOServiceBaseComponent, AbstractOServiceComponent, AbstractServiceComponentStateClass, AppConfig, AppConfigFactory, AppMenuService, AppearanceService, AuthGuardService, AuthService, Base64, BaseDataService, BaseRequestArgument, BaseService, BaseServiceResponse, BooleanConverter, BooleanInputConverter, CKEditorComponent, CKEditorModule, CanActivateFormLayoutChildGuard, CanDeactivateFormGuard, Codes, ColumnValueFilterOperator, ColumnsFilterPipe, ComponentStateServiceProvider, CurrencyService, CurrencyUtil, 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_DATERANGE_LEGACY_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_TREE, 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_DATERANGE_LEGACY_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_TREE, 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, FactoryUtil, FilterExpressionUtils, IconService, InputRegulateDirective, IsEmptyValuePipe, JSONAPIPreferencesService, JSONAPIRequestArgumentsAdapter, JSONAPIService, JSONAPIServiceResponse, JSONAPIServiceResponseAdapter, ListItem, LocalStorageService, LoginStorageService, MomentService, NameConvention, NameConventionLower, NameConventionProvider, NameConventionUpper, NavigationService, NumberConverter, NumberInputConverter, NumberService, OAppHeaderBase, OAppHeaderComponent, OAppHeaderModule, OAppLayoutBase, OAppLayoutComponent, OAppLayoutHeaderComponent, OAppLayoutModule, OAppLayoutSidenavComponent, OAppSidenavBase, OAppSidenavComponent, OAppSidenavImageComponent, OAppSidenavMenuGroupComponent, OAppSidenavMenuItemComponent, OAppSidenavModule, OBarMenuBase, 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, ODateRangeLegacyInputComponent, ODateRangeLegacyInputModule, ODaterangepickerDirective, ODialogBase, ODialogComponent, ODialogConfig, ODualListSelectorComponent, ODualListSelectorDateItemComponent, ODualListSelectorModule, OEmailInputComponent, OEmailInputModule, OErrorComponent, OErrorDialogManager, OExpandableContainerComponent, OExpandableContainerModule, OFileDragAndDropDirective, OFileInputComponent, OFileInputModule, OFileItem, OFileUploader, OFilterBuilderBase, OFilterBuilderClearDirective, OFilterBuilderComponent, OFilterBuilderMenuComponent, OFilterBuilderModule, OFilterBuilderQueryDirective, OFormBase, OFormCacheClass, OFormComponent, OFormContainerComponent, OFormContainerModule, OFormControl, OFormDataComponent, OFormLayoutDialogComponent, OFormLayoutDialogOptionsDirective, OFormLayoutManagerBase, OFormLayoutManagerComponent, OFormLayoutManagerComponentStateClass, OFormLayoutManagerComponentStateService, OFormLayoutManagerContentDirective, OFormLayoutManagerModule, OFormLayoutManagerService, OFormLayoutSplitPaneComponent, OFormLayoutSplitPaneOptionsDirective, OFormLayoutTabGroupComponent, OFormLayoutTabGroupOptionsDirective, OFormMessageService, OFormModule, OFormNavigationClass, OFormNavigationComponent, OFormServiceComponent, OFormToolbarBase, OFormToolbarComponent, OFormToolbarModule, OFormValue, OFullScreenDialogComponent, OGridComponent, OGridComponentStateClass, OGridComponentStateService, OGridItemComponent, OGridItemDirective, OGridModule, OGridSkeletonComponent, 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, OListSkeletonComponent, 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, OPreferenceMappingUtils, OPreferenceResponseAdapter, ORadioComponent, ORadioModule, ORealInputComponent, ORealInputModule, ORealPipe, ORemoteConfigurationService, ORepeatableSkeletonComponent, ORowCollapsibleComponent, ORowCollapsibleModule, ORowComponent, ORowModule, OSafePipe, OSearchInputComponent, OSearchInputModule, OServiceBaseComponent, OServiceComponent, OSharedModule, OSkeletonComponent, OSlideToggleComponent, OSlideToggleModule, OSliderComponent, OSliderModule, OSnackBarBase, 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, OTableSkeletonComponent, OTableStoreConfigurationDialogComponent, OTableVirtualScrollStrategy, OTableVisibleColumnsDialogComponent, OTextInputComponent, OTextInputModule, OTextareaInputComponent, OTextareaInputModule, OTimeInputComponent, OTimeInputModule, OTranslateHttpLoader, OTranslateModule, OTranslateParser, OTranslatePipe, OTranslateService, OTreeComponent, OTreeMenuComponent, OTreeModule, OTreeNodeComponent, OUserInfoBase, 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_GLOBAL_CONFIG, O_FORM_MESSAGE_SERVICE, O_GLOBAL_CONFIG, O_INPUTS_OPTIONS, O_JSON_API_CONFIG, O_LOCALSTORAGE_SERVICE, O_MAT_ERROR_OPTIONS, O_PERMISSION_SERVICE, O_REPORT_SERVICE, O_REQUEST_ADAPTER, O_RESPONSE_ADAPTER, 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, OntimizeLocalStorageServiceProvider, OntimizeMatDateFormats, OntimizeMatIconRegistry, OntimizeMomentDateAdapter, OntimizePermissionsService, OntimizePreferencesService, OntimizeRequestArgumentsAdapter, OntimizeService, OntimizeServiceProvider, OntimizeServiceResponse, OntimizeServiceResponseAdapter, OntimizeServiceResponseParser, OntimizeWebModule, OntimizeWebTranslateModule, OrderByPipe, PaginationContextService, PermissionsGuardService, PermissionsService, PermissionsUtils, SQLTypes, ServiceRequestAdapter, ServiceResponseAdapter, ServiceUtils, ShareCanActivateChildService, SideEnum, SnackBarService, StringConverter, TWELVE_HOUR_FORMAT_PATTERN, TWENTY_FOUR_HOUR_FORMAT_PATTERN, TableFilterByColumnDialogResult, Util, _getInjectionTokenValue, appConfigFactory, authServiceFactory, componentStateFactory, createServiceInstance, dataServiceFactory, dateFormatFactory, editorsMapping, exportDataFactory, exportServiceFactory, fileServiceFactory, getPermissionsServiceProvider, localStorageServiceFactory, nameConventionServiceFactory, noop, ontimizePostBootstrap, permissionsServiceFactory, preferencesServiceFactory, renderersMapping, serviceRequestAdapterFactory, serviceResponseAdapterFactory, translateServiceFactory };
+export { APP_CONFIG, AbstractComponentStateClass, AbstractComponentStateService, AbstractOServiceBaseComponent, AbstractOServiceComponent, AbstractServiceComponentStateClass, AppConfig, AppConfigFactory, AppMenuService, AppearanceService, AuthGuardService, AuthService, Base64, BaseDataService, BaseRequestArgument, BaseService, BaseServiceResponse, BooleanConverter, BooleanInputConverter, CKEditorComponent, CKEditorModule, CanActivateFormLayoutChildGuard, CanDeactivateFormGuard, Codes, ColumnValueFilterOperator, ColumnsFilterPipe, ComponentStateServiceProvider, CurrencyService, CurrencyUtil, 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_DATERANGE_LEGACY_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_TREE, 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_DATERANGE_LEGACY_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_TREE, 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, FactoryUtil, FilterExpressionUtils, IconService, InputRegulateDirective, IsEmptyValuePipe, JSONAPIPreferencesService, JSONAPIRequestArgumentsAdapter, JSONAPIService, JSONAPIServiceResponse, JSONAPIServiceResponseAdapter, ListItem, LocalStorageService, LoginStorageService, MomentService, NameConvention, NameConventionLower, NameConventionProvider, NameConventionUpper, NavigationService, NumberConverter, NumberInputConverter, NumberService, OAppHeaderBase, OAppHeaderComponent, OAppHeaderModule, OAppLayoutBase, OAppLayoutComponent, OAppLayoutHeaderComponent, OAppLayoutModule, OAppLayoutSidenavComponent, OAppSidenavBase, OAppSidenavComponent, OAppSidenavImageComponent, OAppSidenavMenuGroupComponent, OAppSidenavMenuItemComponent, OAppSidenavModule, OBarMenuBase, 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, ODateRangeLegacyInputComponent, ODateRangeLegacyInputModule, ODaterangepickerDirective, ODialogBase, ODialogComponent, ODialogConfig, ODualListSelectorComponent, ODualListSelectorDateItemComponent, ODualListSelectorModule, OEmailInputComponent, OEmailInputModule, OErrorComponent, OErrorDialogManager, OExpandableContainerComponent, OExpandableContainerModule, OFileDragAndDropDirective, OFileInputComponent, OFileInputModule, OFileItem, OFileUploader, OFilterBuilderBase, OFilterBuilderClearDirective, OFilterBuilderComponent, OFilterBuilderMenuComponent, OFilterBuilderModule, OFilterBuilderQueryDirective, OFormBase, OFormCacheClass, OFormComponent, OFormContainerComponent, OFormContainerModule, OFormControl, OFormDataComponent, OFormLayoutDialogComponent, OFormLayoutDialogOptionsDirective, OFormLayoutManagerBase, OFormLayoutManagerComponent, OFormLayoutManagerComponentStateClass, OFormLayoutManagerComponentStateService, OFormLayoutManagerContentDirective, OFormLayoutManagerModule, OFormLayoutManagerService, OFormLayoutSplitPaneComponent, OFormLayoutSplitPaneOptionsDirective, OFormLayoutTabGroupComponent, OFormLayoutTabGroupOptionsDirective, OFormMessageService, OFormModule, OFormNavigationClass, OFormNavigationComponent, OFormServiceComponent, OFormToolbarBase, OFormToolbarComponent, OFormToolbarModule, OFormValue, OFullScreenDialogComponent, OGridComponent, OGridComponentStateClass, OGridComponentStateService, OGridItemComponent, OGridItemDirective, OGridModule, OGridSkeletonComponent, 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, OListSkeletonComponent, 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, OPreferenceMappingUtils, OPreferenceResponseAdapter, ORadioComponent, ORadioModule, ORealInputComponent, ORealInputModule, ORealPipe, ORemoteConfigurationService, ORepeatableSkeletonComponent, ORowCollapsibleComponent, ORowCollapsibleModule, ORowComponent, ORowModule, OSafePipe, OSearchInputComponent, OSearchInputModule, OServiceBaseComponent, OServiceComponent, OSharedModule, OSkeletonComponent, OSlideToggleComponent, OSlideToggleModule, OSliderComponent, OSliderModule, OSnackBarBase, 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, OTableSkeletonComponent, OTableStoreConfigurationDialogComponent, OTableVirtualScrollStrategy, OTableVisibleColumnsDialogComponent, OTextInputComponent, OTextInputModule, OTextareaInputComponent, OTextareaInputModule, OTimeInputComponent, OTimeInputModule, OTranslateHttpLoader, OTranslateModule, OTranslateParser, OTranslatePipe, OTranslateService, OTreeComponent, OTreeComponentStateClass, OTreeComponentStateService, OTreeMenuComponent, OTreeModule, OTreeNodeComponent, OUserInfoBase, 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_GLOBAL_CONFIG, O_FORM_MESSAGE_SERVICE, O_GLOBAL_CONFIG, O_INPUTS_OPTIONS, O_JSON_API_CONFIG, O_LOCALSTORAGE_SERVICE, O_MAT_ERROR_OPTIONS, O_PERMISSION_SERVICE, O_REPORT_SERVICE, O_REQUEST_ADAPTER, O_RESPONSE_ADAPTER, 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, OntimizeLocalStorageServiceProvider, OntimizeMatDateFormats, OntimizeMatIconRegistry, OntimizeMomentDateAdapter, OntimizePermissionsService, OntimizePreferencesService, OntimizeRequestArgumentsAdapter, OntimizeService, OntimizeServiceProvider, OntimizeServiceResponse, OntimizeServiceResponseAdapter, OntimizeServiceResponseParser, OntimizeWebModule, OntimizeWebTranslateModule, OrderByPipe, PaginationContextService, PermissionsGuardService, PermissionsService, PermissionsUtils, SQLTypes, ServiceRequestAdapter, ServiceResponseAdapter, ServiceUtils, ShareCanActivateChildService, SideEnum, SnackBarService, StringConverter, TWELVE_HOUR_FORMAT_PATTERN, TWENTY_FOUR_HOUR_FORMAT_PATTERN, TableFilterByColumnDialogResult, Util, _getInjectionTokenValue, appConfigFactory, authServiceFactory, componentStateFactory, createServiceInstance, dataServiceFactory, dateFormatFactory, editorsMapping, exportDataFactory, exportServiceFactory, fileServiceFactory, getPermissionsServiceProvider, localStorageServiceFactory, nameConventionServiceFactory, noop, ontimizePostBootstrap, permissionsServiceFactory, preferencesServiceFactory, renderersMapping, serviceRequestAdapterFactory, serviceResponseAdapterFactory, translateServiceFactory };
 //# sourceMappingURL=ontimize-web-ngx.mjs.map