ngx-st-tables 1.1.13 → 1.1.14

package/fesm2020/ngx-st-tables.mjs

@@ -32,501 +32,502 @@ import * as i7 from '@angular/material/core';
 import * as i16 from 'ngx-st-date-format';
 import { StDateFormatModule } from 'ngx-st-date-format';
 
-class LocalTableService {
-    constructor() {
-        this.localStorageName = '';
-    }
-    getConfigs() {
-        if (this.checkLocalStorageName()) {
-            return JSON.parse(localStorage.getItem(this.localStorageName) || '[]');
-        }
-        return [];
-    }
-    saveConfigs(configs) {
-        if (this.checkLocalStorageName()) {
-            localStorage.setItem(this.localStorageName, JSON.stringify(configs));
-        }
-    }
-    checkLocalStorageName() {
-        if (this.localStorageName) {
-            return true;
-        }
-        else {
-            console.warn('Yiu have to add configurationsSettings');
-            return false;
-        }
-    }
-}
-LocalTableService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-LocalTableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
+class LocalTableService {
+    constructor() {
+        this.localStorageName = '';
+    }
+    getConfigs() {
+        if (this.checkLocalStorageName()) {
+            return JSON.parse(localStorage.getItem(this.localStorageName) || '[]');
+        }
+        return [];
+    }
+    saveConfigs(configs) {
+        if (this.checkLocalStorageName()) {
+            localStorage.setItem(this.localStorageName, JSON.stringify(configs));
+        }
+    }
+    checkLocalStorageName() {
+        if (this.localStorageName) {
+            return true;
+        }
+        else {
+            console.warn('Yiu have to add configurationsSettings');
+            return false;
+        }
+    }
+}
+LocalTableService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+LocalTableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
         }], ctorParameters: function () { return []; } });
 
-class ConfigurationsComponent {
-    constructor() {
-        this.createNewConfig = new EventEmitter();
-        this.removeConfig = new EventEmitter();
-        this.changeConfig = new EventEmitter();
-        this.creatingConfiguration = false;
-        this.createConfigurationName = '';
-        this.removingConfiguration = false;
-    }
-    set initSelectedConfig(config) {
-        this.selectedConfig = config;
-    }
-    ngOnInit() { }
-    showCreateConfiguration() {
-        this.creatingConfiguration = true;
-        this.createConfigurationName = '';
-    }
-    hideCreateConfiguration() {
-        this.creatingConfiguration = false;
-        this.createConfigurationName = '';
-    }
-    saveCreateConfiguration() {
-        this.creatingConfiguration = false;
-        this.selectedConfig = null;
-        this.createNewConfig.emit(this.createConfigurationName);
-    }
-    deleteConfiguration() {
-        this.removingConfiguration = true;
-    }
-    acceptDeleteConfiguration() {
-        this.removingConfiguration = false;
-        this.selectedConfig = null;
-        this.removeConfig.emit(this.selectedConfig.configId);
-    }
-    declineDeleteConfiguration() {
-        this.removingConfiguration = false;
-    }
-    selectedConfigChanged() {
-        this.changeConfig.emit(this.selectedConfig?.configId || null);
-    }
-}
-ConfigurationsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfigurationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ConfigurationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfigurationsComponent, selector: "st-configurations[configurationsSettings]", inputs: { configurationsSettings: "configurationsSettings", configurations: "configurations", initSelectedConfig: "initSelectedConfig" }, outputs: { createNewConfig: "createNewConfig", removeConfig: "removeConfig", changeConfig: "changeConfig" }, ngImport: i0, template: "<div class=\"col-auto row align-items-center\" style=\"padding: 0\">\n  <ng-container *ngIf=\"!creatingConfiguration && !removingConfiguration\">\n    <mat-form-field class=\"col-auto\" style=\"padding-right: 0\">\n      <mat-label>{{ configurationsSettings.selectLabel }}</mat-label>\n      <mat-select\n        [(ngModel)]=\"selectedConfig\"\n        (ngModelChange)=\"selectedConfigChanged()\"\n      >\n        <mat-option [value]=\"null\"></mat-option>\n        <mat-option *ngFor=\"let config of configurations\" [value]=\"config\">{{\n          config.configName\n        }}</mat-option>\n      </mat-select>\n    </mat-form-field>\n    <button\n      mat-icon-button\n      class=\"col-auto green-icon\"\n      (click)=\"showCreateConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> add </span>\n    </button>\n    <button\n      mat-icon-button\n      class=\"col-auto red-icon\"\n      [disabled]=\"!selectedConfig\"\n      (click)=\"deleteConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> delete </span>\n    </button>\n  </ng-container>\n\n  <ng-container *ngIf=\"creatingConfiguration\">\n    <mat-form-field class=\"col-auto\">\n      <mat-label>{{ configurationsSettings.createLabel }}</mat-label>\n      <input matInput [(ngModel)]=\"createConfigurationName\" />\n    </mat-form-field>\n    <button\n      mat-icon-button\n      class=\"col-auto green-icon\"\n      (click)=\"saveCreateConfiguration()\"\n      [disabled]=\"!createConfigurationName\"\n    >\n      <span class=\"material-icons-outlined\"> done </span>\n    </button>\n    <button\n      mat-icon-button\n      class=\"col-auto red-icon\"\n      (click)=\"hideCreateConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> close </span>\n    </button>\n  </ng-container>\n\n  <ng-container *ngIf=\"removingConfiguration\">\n    <p class=\"col-auto\" style=\"margin: 0; font-weight: bold; font-size: 16px\">\n      {{ configurationsSettings.deleteWarningTitle }}\n    </p>\n    <button\n      mat-icon-button\n      class=\"col-auto green-icon\"\n      (click)=\"acceptDeleteConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> done </span>\n    </button>\n    <button\n      mat-icon-button\n      class=\"col-auto red-icon\"\n      (click)=\"declineDeleteConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> close </span>\n    </button>\n  </ng-container>\n</div>\n", styles: [".green-icon span{color:#2e7d32}.red-icon span{color:#c62828}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.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: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", exportAs: ["matOption"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfigurationsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'st-configurations[configurationsSettings]', template: "<div class=\"col-auto row align-items-center\" style=\"padding: 0\">\n  <ng-container *ngIf=\"!creatingConfiguration && !removingConfiguration\">\n    <mat-form-field class=\"col-auto\" style=\"padding-right: 0\">\n      <mat-label>{{ configurationsSettings.selectLabel }}</mat-label>\n      <mat-select\n        [(ngModel)]=\"selectedConfig\"\n        (ngModelChange)=\"selectedConfigChanged()\"\n      >\n        <mat-option [value]=\"null\"></mat-option>\n        <mat-option *ngFor=\"let config of configurations\" [value]=\"config\">{{\n          config.configName\n        }}</mat-option>\n      </mat-select>\n    </mat-form-field>\n    <button\n      mat-icon-button\n      class=\"col-auto green-icon\"\n      (click)=\"showCreateConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> add </span>\n    </button>\n    <button\n      mat-icon-button\n      class=\"col-auto red-icon\"\n      [disabled]=\"!selectedConfig\"\n      (click)=\"deleteConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> delete </span>\n    </button>\n  </ng-container>\n\n  <ng-container *ngIf=\"creatingConfiguration\">\n    <mat-form-field class=\"col-auto\">\n      <mat-label>{{ configurationsSettings.createLabel }}</mat-label>\n      <input matInput [(ngModel)]=\"createConfigurationName\" />\n    </mat-form-field>\n    <button\n      mat-icon-button\n      class=\"col-auto green-icon\"\n      (click)=\"saveCreateConfiguration()\"\n      [disabled]=\"!createConfigurationName\"\n    >\n      <span class=\"material-icons-outlined\"> done </span>\n    </button>\n    <button\n      mat-icon-button\n      class=\"col-auto red-icon\"\n      (click)=\"hideCreateConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> close </span>\n    </button>\n  </ng-container>\n\n  <ng-container *ngIf=\"removingConfiguration\">\n    <p class=\"col-auto\" style=\"margin: 0; font-weight: bold; font-size: 16px\">\n      {{ configurationsSettings.deleteWarningTitle }}\n    </p>\n    <button\n      mat-icon-button\n      class=\"col-auto green-icon\"\n      (click)=\"acceptDeleteConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> done </span>\n    </button>\n    <button\n      mat-icon-button\n      class=\"col-auto red-icon\"\n      (click)=\"declineDeleteConfiguration()\"\n    >\n      <span class=\"material-icons-outlined\"> close </span>\n    </button>\n  </ng-container>\n</div>\n", styles: [".green-icon span{color:#2e7d32}.red-icon span{color:#c62828}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { configurationsSettings: [{
-                type: Input
-            }], configurations: [{
-                type: Input
-            }], initSelectedConfig: [{
-                type: Input
-            }], createNewConfig: [{
-                type: Output
-            }], removeConfig: [{
-                type: Output
-            }], changeConfig: [{
-                type: Output
+class ConfigurationsComponent {
+    constructor() {
+        this.createNewConfig = new EventEmitter();
+        this.removeConfig = new EventEmitter();
+        this.changeConfig = new EventEmitter();
+        this.creatingConfiguration = false;
+        this.createConfigurationName = '';
+        this.removingConfiguration = false;
+    }
+    set initSelectedConfig(config) {
+        this.selectedConfig = config;
+    }
+    ngOnInit() { }
+    showCreateConfiguration() {
+        this.creatingConfiguration = true;
+        this.createConfigurationName = '';
+    }
+    hideCreateConfiguration() {
+        this.creatingConfiguration = false;
+        this.createConfigurationName = '';
+    }
+    saveCreateConfiguration() {
+        this.creatingConfiguration = false;
+        this.selectedConfig = null;
+        this.createNewConfig.emit(this.createConfigurationName);
+    }
+    deleteConfiguration() {
+        this.removingConfiguration = true;
+    }
+    acceptDeleteConfiguration() {
+        this.removingConfiguration = false;
+        this.selectedConfig = null;
+        this.removeConfig.emit(this.selectedConfig.configId);
+    }
+    declineDeleteConfiguration() {
+        this.removingConfiguration = false;
+    }
+    selectedConfigChanged() {
+        this.changeConfig.emit(this.selectedConfig?.configId || null);
+    }
+}
+ConfigurationsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfigurationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ConfigurationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfigurationsComponent, selector: "st-configurations[configurationsSettings]", inputs: { configurationsSettings: "configurationsSettings", configurations: "configurations", initSelectedConfig: "initSelectedConfig" }, outputs: { createNewConfig: "createNewConfig", removeConfig: "removeConfig", changeConfig: "changeConfig" }, ngImport: i0, template: "<div class=\"col-auto row align-items-center\" style=\"padding: 0\">\r\n  <ng-container *ngIf=\"!creatingConfiguration && !removingConfiguration\">\r\n    <mat-form-field class=\"col-auto\" style=\"padding-right: 0\">\r\n      <mat-label>{{ configurationsSettings.selectLabel }}</mat-label>\r\n      <mat-select\r\n        [(ngModel)]=\"selectedConfig\"\r\n        (ngModelChange)=\"selectedConfigChanged()\"\r\n      >\r\n        <mat-option [value]=\"null\"></mat-option>\r\n        <mat-option *ngFor=\"let config of configurations\" [value]=\"config\">{{\r\n          config.configName\r\n        }}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto green-icon\"\r\n      (click)=\"showCreateConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> add </span>\r\n    </button>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto red-icon\"\r\n      [disabled]=\"!selectedConfig\"\r\n      (click)=\"deleteConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> delete </span>\r\n    </button>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"creatingConfiguration\">\r\n    <mat-form-field class=\"col-auto\">\r\n      <mat-label>{{ configurationsSettings.createLabel }}</mat-label>\r\n      <input matInput [(ngModel)]=\"createConfigurationName\" />\r\n    </mat-form-field>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto green-icon\"\r\n      (click)=\"saveCreateConfiguration()\"\r\n      [disabled]=\"!createConfigurationName\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> done </span>\r\n    </button>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto red-icon\"\r\n      (click)=\"hideCreateConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> close </span>\r\n    </button>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"removingConfiguration\">\r\n    <p class=\"col-auto\" style=\"margin: 0; font-weight: bold; font-size: 16px\">\r\n      {{ configurationsSettings.deleteWarningTitle }}\r\n    </p>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto green-icon\"\r\n      (click)=\"acceptDeleteConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> done </span>\r\n    </button>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto red-icon\"\r\n      (click)=\"declineDeleteConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> close </span>\r\n    </button>\r\n  </ng-container>\r\n</div>\r\n", styles: [".green-icon span{color:#2e7d32}.red-icon span{color:#c62828}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.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: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfigurationsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'st-configurations[configurationsSettings]', template: "<div class=\"col-auto row align-items-center\" style=\"padding: 0\">\r\n  <ng-container *ngIf=\"!creatingConfiguration && !removingConfiguration\">\r\n    <mat-form-field class=\"col-auto\" style=\"padding-right: 0\">\r\n      <mat-label>{{ configurationsSettings.selectLabel }}</mat-label>\r\n      <mat-select\r\n        [(ngModel)]=\"selectedConfig\"\r\n        (ngModelChange)=\"selectedConfigChanged()\"\r\n      >\r\n        <mat-option [value]=\"null\"></mat-option>\r\n        <mat-option *ngFor=\"let config of configurations\" [value]=\"config\">{{\r\n          config.configName\r\n        }}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto green-icon\"\r\n      (click)=\"showCreateConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> add </span>\r\n    </button>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto red-icon\"\r\n      [disabled]=\"!selectedConfig\"\r\n      (click)=\"deleteConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> delete </span>\r\n    </button>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"creatingConfiguration\">\r\n    <mat-form-field class=\"col-auto\">\r\n      <mat-label>{{ configurationsSettings.createLabel }}</mat-label>\r\n      <input matInput [(ngModel)]=\"createConfigurationName\" />\r\n    </mat-form-field>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto green-icon\"\r\n      (click)=\"saveCreateConfiguration()\"\r\n      [disabled]=\"!createConfigurationName\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> done </span>\r\n    </button>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto red-icon\"\r\n      (click)=\"hideCreateConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> close </span>\r\n    </button>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"removingConfiguration\">\r\n    <p class=\"col-auto\" style=\"margin: 0; font-weight: bold; font-size: 16px\">\r\n      {{ configurationsSettings.deleteWarningTitle }}\r\n    </p>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto green-icon\"\r\n      (click)=\"acceptDeleteConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> done </span>\r\n    </button>\r\n    <button\r\n      mat-icon-button\r\n      class=\"col-auto red-icon\"\r\n      (click)=\"declineDeleteConfiguration()\"\r\n    >\r\n      <span class=\"material-icons-outlined\"> close </span>\r\n    </button>\r\n  </ng-container>\r\n</div>\r\n", styles: [".green-icon span{color:#2e7d32}.red-icon span{color:#c62828}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { configurationsSettings: [{
+                type: Input
+            }], configurations: [{
+                type: Input
+            }], initSelectedConfig: [{
+                type: Input
+            }], createNewConfig: [{
+                type: Output
+            }], removeConfig: [{
+                type: Output
+            }], changeConfig: [{
+                type: Output
             }] } });
 
-class LocalTableComponent {
-    constructor(localTableService, changeDetectorRef, router, activatedRoute) {
-        this.localTableService = localTableService;
-        this.changeDetectorRef = changeDetectorRef;
-        this.router = router;
-        this.activatedRoute = activatedRoute;
-        this.pageSize = 10;
-        this.allowPickColumns = false;
-        this.localStorageName = '';
-        this.bindSearchToUrl = false;
-        this._columns = {};
-        this._data = [];
-        this.searchModel = '';
-        this.displayedColumns = [];
-        this.configurations = [];
-        this.initConfig = null;
-        this.activeConfig = null;
-        this.pageIndex = 0;
-    }
-    set columns(columns) {
-        this._columns = columns;
-        this.columnsArray = this.getColumnsArray();
-        this.setDisplayedColumns();
-    }
-    get columns() {
-        return this._columns;
-    }
-    set data(data) {
-        this._data = data || [];
-        this.setTableSource();
-    }
-    get data() {
-        return this._data;
-    }
-    ngOnInit() {
-        if (this.localStorageName) {
-            const pageSize = localStorage.getItem(this.localStorageName);
-            if (pageSize) {
-                this.pageSize = parseInt(pageSize);
-            }
-        }
-        if (this.configurationsSettings) {
-            this.localTableService.localStorageName =
-                this.configurationsSettings?.localStorageName || '';
-            this.loadConfigs();
-        }
-    }
-    ngAfterViewInit() {
-        if (this.configurationsSettings) {
-            this.paginator.page.subscribe(res => {
-                if (this.activeConfig) {
-                    this.activeConfig.pageSize = res.pageSize;
-                    this.updateConfigsToLocalStorage();
-                }
-            });
-            this.sort.sortChange.subscribe(res => {
-                if (this.activeConfig) {
-                    this.activeConfig.sortFieldName = res.active;
-                    this.activeConfig.sortDirection = res.direction;
-                    this.updateConfigsToLocalStorage();
-                }
-            });
-        }
-        if (this.bindSearchToUrl) {
-            const params = new URLSearchParams(location.search);
-            this.sort.sortChange.subscribe(res => {
-                this.updateSearchToUrl();
-            });
-            if (params.get('stLocalTablePageIndex')) {
-                this.pageIndex = parseInt(params.get('stLocalTablePageIndex') || '');
-            }
-            if (params.get('stLocalTablePageSize')) {
-                this.pageSize = parseInt(params.get('stLocalTablePageSize') || '');
-            }
-            if (params.get('stLocalTableSortFieldName') &&
-                params.get('stLocalTableSortDirection')) {
-                this.sort.sort({
-                    id: params.get('stLocalTableSortFieldName') || '',
-                    start: params.get('stLocalTableSortDirection') || 'asc',
-                    disableClear: false,
-                });
-            }
-            this.searchModel = params.get('stLocalTableSearch') || '';
-            if (this.searchModel) {
-                this.tableSource.filter = this.searchModel.trim().toLowerCase();
-            }
-        }
-        this.paginator.pageSize = this.pageSize;
-    }
-    applySearch() {
-        this.tableSource.filter = this.searchModel.trim().toLowerCase();
-        this.pageIndex = 0;
-        this.updateSearchToUrl();
-    }
-    clearSearch() {
-        this.searchModel = '';
-        this.tableSource.filter = this.searchModel;
-        this.pageIndex = 0;
-        this.updateSearchToUrl();
-    }
-    checkIfActionVisible(row, action) {
-        if (action.show) {
-            return action.show(row);
-        }
-        else {
-            return true;
-        }
-    }
-    columnVisibleChanged(column) {
-        this.setDisplayedColumns();
-        this.updateConfigsToLocalStorage();
-    }
-    newConfigCreated(name) {
-        const newConfig = this.generateNewConfig(name);
-        this.configurations.push(newConfig);
-        this.updateConfigsToLocalStorage();
-        this.initConfig = newConfig;
-    }
-    configRemoved(configId) {
-        this.configurations = this.configurations.filter(config => config.configId !== configId);
-        this.updateConfigsToLocalStorage();
-    }
-    configChanged(configId) {
-        this.activeConfig = configId
-            ? this.configurations.find(config => config.configId === configId)
-            : null;
-        if (this.activeConfig) {
-            this.setTableConfig(this.activeConfig.pageSize, this.activeConfig.columnsDisabled, this.activeConfig.sortFieldName, this.activeConfig.sortDirection);
-        }
-        else {
-            this.setTableConfig(this.pageSize, [], null, null);
-            this.clearSearch();
-        }
-    }
-    pageChanged(event) {
-        this.pageIndex = event.pageIndex;
-        this.updateSearchToUrl();
-    }
-    updateSearchToUrl() {
-        if (this.bindSearchToUrl) {
-            let queryParams = {
-                stLocalTableSearch: this.searchModel,
-                stLocalTablePageIndex: this.pageIndex,
-                stLocalTablePageSize: this.paginator.pageSize,
-                stLocalTableSortFieldName: '',
-                stLocalTableSortDirection: '',
-            };
-            if (this.sort.direction && this.sort.active) {
-                queryParams = {
-                    ...queryParams,
-                    stLocalTableSortFieldName: this.sort.active,
-                    stLocalTableSortDirection: this.sort.direction,
-                };
-            }
-            this.router.navigate(['./'], {
-                queryParams: queryParams,
-                relativeTo: this.activatedRoute,
-            });
-        }
-    }
-    updateConfigsToLocalStorage() {
-        this.localTableService.saveConfigs(this.configurations);
-    }
-    setTableSource() {
-        this.tableSource = new MatTableDataSource(this._data);
-        this.tableSource.paginator = this.paginator;
-        this.tableSource.sort = this.sort;
-        this.tableSource.filter = this.searchModel;
-        this.changeDetectorRef.markForCheck();
-    }
-    setDisplayedColumns() {
-        this.displayedColumns = Object.keys(this.columns).filter(column => {
-            return this._columns[column].visible;
-        });
-    }
-    getColumnsArray() {
-        return Object.keys(this._columns).map(column => this._columns[column]);
-    }
-    loadConfigs() {
-        this.configurations = this.localTableService.getConfigs();
-    }
-    generateNewConfig(configName) {
-        return {
-            configId: Date.now().toString(),
-            configName: configName,
-            columnsDisabled: this.columnsArray
-                .filter(column => !column.visible)
-                .map(column => column.translateColumnName),
-            pageSize: this.paginator.pageSize,
-            sortFieldName: this.sort.direction && this.sort.active ? this.sort.active : null,
-            sortDirection: this.sort.direction || null,
-        };
-    }
-    setTableConfig(pageSize, disabledColumns, sortFieldName, sortDirection) {
-        this.paginator.pageSize = pageSize;
-        this.sort.sort({
-            id: sortFieldName || '',
-            start: sortDirection || 'asc',
-            disableClear: false,
-        });
-        this.columnsArray.forEach(column => {
-            column.visible =
-                disabledColumns.indexOf(column.translateColumnName) === -1;
-        });
-        this.setDisplayedColumns();
-    }
-}
-LocalTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableComponent, deps: [{ token: LocalTableService }, { token: i0.ChangeDetectorRef }, { token: i2$1.Router }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
-LocalTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LocalTableComponent, selector: "ngx-st-local-table", inputs: { tableSettings: "tableSettings", globalSearchSettings: "globalSearchSettings", pageSize: "pageSize", allowPickColumns: "allowPickColumns", configurationsSettings: "configurationsSettings", localStorageName: "localStorageName", bindSearchToUrl: "bindSearchToUrl", columns: "columns", data: "data" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"local-table\">\n  <div class=\"row align-items-center\">\n    <div\n      class=\"col row align-items-center\"\n      style=\"padding: 0\"\n      *ngIf=\"configurationsSettings || allowPickColumns\"\n    >\n      <div class=\"col-auto\" style=\"padding: 0\" *ngIf=\"allowPickColumns\">\n        <button\n          mat-icon-button\n          class=\"col-auto\"\n          [matMenuTriggerFor]=\"columnsMenu\"\n        >\n          <span class=\"material-icons-outlined\"> view_week </span>\n        </button>\n        <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\n          <ng-container *ngFor=\"let column of columnsArray\">\n            <div mat-menu-item *ngIf=\"!column.notShowInColumnPick\">\n              <mat-checkbox\n                [(ngModel)]=\"column.visible\"\n                (ngModelChange)=\"columnVisibleChanged(column)\"\n                style=\"margin-top: 5px\"\n                (click)=\"$event.stopPropagation()\"\n              >\n                {{ column.translateColumnName }}\n              </mat-checkbox>\n            </div>\n          </ng-container>\n        </mat-menu>\n      </div>\n\n      <st-configurations\n        *ngIf=\"configurationsSettings\"\n        [configurationsSettings]=\"configurationsSettings\"\n        [configurations]=\"configurations\"\n        [initSelectedConfig]=\"initConfig\"\n        (createNewConfig)=\"newConfigCreated($event)\"\n        (removeConfig)=\"configRemoved($event)\"\n        (changeConfig)=\"configChanged($event)\"\n      ></st-configurations>\n    </div>\n\n    <div class=\"col\" style=\"padding: 0\" *ngIf=\"globalSearchSettings?.show\">\n      <mat-form-field class=\"col\">\n        <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\n        <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\n        <button\n          matSuffix\n          mat-icon-button\n          aria-label=\"Clear\"\n          (click)=\"clearSearch()\"\n        >\n          <mat-icon style=\"font-size: 22px\">close</mat-icon>\n        </button>\n      </mat-form-field>\n    </div>\n  </div>\n\n  <table\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\n    mat-table\n    [dataSource]=\"tableSource\"\n    matSort\n  >\n    <ng-container\n      [matColumnDef]=\"column\"\n      *ngFor=\"let column of displayedColumns\"\n    >\n      <th\n        mat-header-cell\n        *matHeaderCellDef\n        style=\"{{\n          columns[column].width ? 'width:' + columns[column].width : ''\n        }}\"\n        mat-sort-header\n        [disabled]=\"!columns[column].sort\"\n      >\n        {{ columns[column].translateColumnName }}\n        <span\n          class=\"material-icons search-icon\"\n          [matMenuTriggerFor]=\"menu\"\n          (click)=\"$event.stopPropagation()\"\n          *ngIf=\"columns[column].search\"\n        >\n          search\n        </span>\n        <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n          <mat-form-field class=\"col\">\n            <mat-label>{{ columns[column].searchLabel || 'Search' }}</mat-label>\n            <input\n              matInput\n              (keyup)=\"applySearch()\"\n              [(ngModel)]=\"searchModel\"\n              (click)=\"$event.stopPropagation()\"\n            />\n            <button\n              matSuffix\n              mat-icon-button\n              aria-label=\"Clear\"\n              (click)=\"searchModel = ''\"\n            >\n              <mat-icon>close</mat-icon>\n            </button>\n          </mat-form-field>\n        </mat-menu>\n      </th>\n      <td\n        mat-cell\n        *matCellDef=\"let element\"\n        style=\"{{\n          columns[column].width ? 'width:' + columns[column].width : ''\n        }}\"\n      >\n        <div\n          class=\"actions-container\"\n          [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\n          *ngIf=\"columns[column].actions && columns[column].actions!.length > 0\"\n        >\n          <ng-container *ngFor=\"let action of columns[column].actions\">\n            <ng-container *ngIf=\"checkIfActionVisible(element, action)\">\n              <button\n                class=\"col-auto\"\n                mat-icon-button\n                type=\"button\"\n                *ngIf=\"!action.url && action.action\"\n                matTooltip=\"{{ action.tooltipName || '' }}\"\n                [matTooltipDisabled]=\"!!!action.tooltipName\"\n                (click)=\"action.action(element)\"\n              >\n                <span class=\"material-icons\">{{ action.iconName }}</span>\n              </button>\n\n              <a *ngIf=\"action.url\" [routerLink]=\"action.url\">\n                <button\n                  class=\"col-auto\"\n                  mat-icon-button\n                  type=\"button\"\n                  matTooltip=\"{{ action.tooltipName || '' }}\"\n                  [matTooltipDisabled]=\"!!!action.tooltipName\"\n                >\n                  <span class=\"material-icons\">{{ action.iconName }}</span>\n                </button>\n              </a>\n            </ng-container>\n          </ng-container>\n        </div>\n\n        <ng-container *ngIf=\"!columns[column].actions\">\n          <ng-container *ngIf=\"columns[column].translateValue\">\n            <p style=\"margin: 0; padding: 0\">\n              {{ columns[column].translateValue![element[column]] || '' }}\n            </p>\n          </ng-container>\n\n          <ng-container *ngIf=\"!columns[column].translateValue\">\n            <ng-container\n              *ngIf=\"!columns[column].type || columns[column].type === 'string'\"\n            >\n              <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\n            </ng-container>\n\n            <ng-container *ngIf=\"columns[column].type === 'date'\">\n              <p style=\"margin: 0; padding: 0\">\n                {{ element[column] | stDateTimeFormatPipe }}\n              </p>\n            </ng-container>\n          </ng-container>\n        </ng-container>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: displayedColumns\"\n      (click)=\"\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\n      \"\n    ></tr>\n  </table>\n  <mat-paginator\n    [pageIndex]=\"pageIndex\"\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\n    (page)=\"pageChanged($event)\"\n    [showFirstLastButtons]=\"true\"\n  ></mat-paginator>\n</div>\n", styles: ["", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i6$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4.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: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i12.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i12.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i13.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i13.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i13.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i14.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: ConfigurationsComponent, selector: "st-configurations[configurationsSettings]", inputs: ["configurationsSettings", "configurations", "initSelectedConfig"], outputs: ["createNewConfig", "removeConfig", "changeConfig"] }, { kind: "pipe", type: i16.DateTimeFormatPipe, name: "stDateTimeFormatPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ngx-st-local-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"local-table\">\n  <div class=\"row align-items-center\">\n    <div\n      class=\"col row align-items-center\"\n      style=\"padding: 0\"\n      *ngIf=\"configurationsSettings || allowPickColumns\"\n    >\n      <div class=\"col-auto\" style=\"padding: 0\" *ngIf=\"allowPickColumns\">\n        <button\n          mat-icon-button\n          class=\"col-auto\"\n          [matMenuTriggerFor]=\"columnsMenu\"\n        >\n          <span class=\"material-icons-outlined\"> view_week </span>\n        </button>\n        <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\n          <ng-container *ngFor=\"let column of columnsArray\">\n            <div mat-menu-item *ngIf=\"!column.notShowInColumnPick\">\n              <mat-checkbox\n                [(ngModel)]=\"column.visible\"\n                (ngModelChange)=\"columnVisibleChanged(column)\"\n                style=\"margin-top: 5px\"\n                (click)=\"$event.stopPropagation()\"\n              >\n                {{ column.translateColumnName }}\n              </mat-checkbox>\n            </div>\n          </ng-container>\n        </mat-menu>\n      </div>\n\n      <st-configurations\n        *ngIf=\"configurationsSettings\"\n        [configurationsSettings]=\"configurationsSettings\"\n        [configurations]=\"configurations\"\n        [initSelectedConfig]=\"initConfig\"\n        (createNewConfig)=\"newConfigCreated($event)\"\n        (removeConfig)=\"configRemoved($event)\"\n        (changeConfig)=\"configChanged($event)\"\n      ></st-configurations>\n    </div>\n\n    <div class=\"col\" style=\"padding: 0\" *ngIf=\"globalSearchSettings?.show\">\n      <mat-form-field class=\"col\">\n        <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\n        <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\n        <button\n          matSuffix\n          mat-icon-button\n          aria-label=\"Clear\"\n          (click)=\"clearSearch()\"\n        >\n          <mat-icon style=\"font-size: 22px\">close</mat-icon>\n        </button>\n      </mat-form-field>\n    </div>\n  </div>\n\n  <table\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\n    mat-table\n    [dataSource]=\"tableSource\"\n    matSort\n  >\n    <ng-container\n      [matColumnDef]=\"column\"\n      *ngFor=\"let column of displayedColumns\"\n    >\n      <th\n        mat-header-cell\n        *matHeaderCellDef\n        style=\"{{\n          columns[column].width ? 'width:' + columns[column].width : ''\n        }}\"\n        mat-sort-header\n        [disabled]=\"!columns[column].sort\"\n      >\n        {{ columns[column].translateColumnName }}\n        <span\n          class=\"material-icons search-icon\"\n          [matMenuTriggerFor]=\"menu\"\n          (click)=\"$event.stopPropagation()\"\n          *ngIf=\"columns[column].search\"\n        >\n          search\n        </span>\n        <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n          <mat-form-field class=\"col\">\n            <mat-label>{{ columns[column].searchLabel || 'Search' }}</mat-label>\n            <input\n              matInput\n              (keyup)=\"applySearch()\"\n              [(ngModel)]=\"searchModel\"\n              (click)=\"$event.stopPropagation()\"\n            />\n            <button\n              matSuffix\n              mat-icon-button\n              aria-label=\"Clear\"\n              (click)=\"searchModel = ''\"\n            >\n              <mat-icon>close</mat-icon>\n            </button>\n          </mat-form-field>\n        </mat-menu>\n      </th>\n      <td\n        mat-cell\n        *matCellDef=\"let element\"\n        style=\"{{\n          columns[column].width ? 'width:' + columns[column].width : ''\n        }}\"\n      >\n        <div\n          class=\"actions-container\"\n          [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\n          *ngIf=\"columns[column].actions && columns[column].actions!.length > 0\"\n        >\n          <ng-container *ngFor=\"let action of columns[column].actions\">\n            <ng-container *ngIf=\"checkIfActionVisible(element, action)\">\n              <button\n                class=\"col-auto\"\n                mat-icon-button\n                type=\"button\"\n                *ngIf=\"!action.url && action.action\"\n                matTooltip=\"{{ action.tooltipName || '' }}\"\n                [matTooltipDisabled]=\"!!!action.tooltipName\"\n                (click)=\"action.action(element)\"\n              >\n                <span class=\"material-icons\">{{ action.iconName }}</span>\n              </button>\n\n              <a *ngIf=\"action.url\" [routerLink]=\"action.url\">\n                <button\n                  class=\"col-auto\"\n                  mat-icon-button\n                  type=\"button\"\n                  matTooltip=\"{{ action.tooltipName || '' }}\"\n                  [matTooltipDisabled]=\"!!!action.tooltipName\"\n                >\n                  <span class=\"material-icons\">{{ action.iconName }}</span>\n                </button>\n              </a>\n            </ng-container>\n          </ng-container>\n        </div>\n\n        <ng-container *ngIf=\"!columns[column].actions\">\n          <ng-container *ngIf=\"columns[column].translateValue\">\n            <p style=\"margin: 0; padding: 0\">\n              {{ columns[column].translateValue![element[column]] || '' }}\n            </p>\n          </ng-container>\n\n          <ng-container *ngIf=\"!columns[column].translateValue\">\n            <ng-container\n              *ngIf=\"!columns[column].type || columns[column].type === 'string'\"\n            >\n              <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\n            </ng-container>\n\n            <ng-container *ngIf=\"columns[column].type === 'date'\">\n              <p style=\"margin: 0; padding: 0\">\n                {{ element[column] | stDateTimeFormatPipe }}\n              </p>\n            </ng-container>\n          </ng-container>\n        </ng-container>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: displayedColumns\"\n      (click)=\"\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\n      \"\n    ></tr>\n  </table>\n  <mat-paginator\n    [pageIndex]=\"pageIndex\"\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\n    (page)=\"pageChanged($event)\"\n    [showFirstLastButtons]=\"true\"\n  ></mat-paginator>\n</div>\n", styles: [".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"] }]
-        }], ctorParameters: function () { return [{ type: LocalTableService }, { type: i0.ChangeDetectorRef }, { type: i2$1.Router }, { type: i2$1.ActivatedRoute }]; }, propDecorators: { paginator: [{
-                type: ViewChild,
-                args: [MatPaginator]
-            }], sort: [{
-                type: ViewChild,
-                args: [MatSort]
-            }], tableSettings: [{
-                type: Input
-            }], globalSearchSettings: [{
-                type: Input
-            }], pageSize: [{
-                type: Input
-            }], allowPickColumns: [{
-                type: Input
-            }], configurationsSettings: [{
-                type: Input
-            }], localStorageName: [{
-                type: Input
-            }], bindSearchToUrl: [{
-                type: Input
-            }], columns: [{
-                type: Input
-            }], data: [{
-                type: Input
+class LocalTableComponent {
+    constructor(localTableService, changeDetectorRef, router, activatedRoute) {
+        this.localTableService = localTableService;
+        this.changeDetectorRef = changeDetectorRef;
+        this.router = router;
+        this.activatedRoute = activatedRoute;
+        this.pageSize = 10;
+        this.allowPickColumns = false;
+        this.localStorageName = '';
+        this.bindSearchToUrl = false;
+        this._columns = {};
+        this._data = [];
+        this.searchModel = '';
+        this.displayedColumns = [];
+        this.configurations = [];
+        this.initConfig = null;
+        this.activeConfig = null;
+        this.pageIndex = 0;
+    }
+    set columns(columns) {
+        this._columns = columns;
+        this.columnsArray = this.getColumnsArray();
+        this.setDisplayedColumns();
+    }
+    get columns() {
+        return this._columns;
+    }
+    set data(data) {
+        this._data = data || [];
+        this.setTableSource();
+    }
+    get data() {
+        return this._data;
+    }
+    ngOnInit() {
+        if (this.localStorageName) {
+            const pageSize = localStorage.getItem(this.localStorageName);
+            if (pageSize) {
+                this.pageSize = parseInt(pageSize);
+            }
+        }
+        if (this.configurationsSettings) {
+            this.localTableService.localStorageName =
+                this.configurationsSettings?.localStorageName || '';
+            this.loadConfigs();
+        }
+    }
+    ngAfterViewInit() {
+        if (this.configurationsSettings) {
+            this.paginator.page.subscribe(res => {
+                if (this.activeConfig) {
+                    this.activeConfig.pageSize = res.pageSize;
+                    this.updateConfigsToLocalStorage();
+                }
+            });
+            this.sort.sortChange.subscribe(res => {
+                if (this.activeConfig) {
+                    this.activeConfig.sortFieldName = res.active;
+                    this.activeConfig.sortDirection = res.direction;
+                    this.updateConfigsToLocalStorage();
+                }
+            });
+        }
+        if (this.bindSearchToUrl) {
+            const params = new URLSearchParams(location.search);
+            this.sort.sortChange.subscribe(res => {
+                this.updateSearchToUrl();
+            });
+            if (params.get('stLocalTablePageIndex')) {
+                this.pageIndex = parseInt(params.get('stLocalTablePageIndex') || '');
+            }
+            if (params.get('stLocalTablePageSize')) {
+                this.pageSize = parseInt(params.get('stLocalTablePageSize') || '');
+            }
+            if (params.get('stLocalTableSortFieldName') &&
+                params.get('stLocalTableSortDirection')) {
+                this.sort.sort({
+                    id: params.get('stLocalTableSortFieldName') || '',
+                    start: params.get('stLocalTableSortDirection') || 'asc',
+                    disableClear: false,
+                });
+            }
+            this.searchModel = params.get('stLocalTableSearch') || '';
+            if (this.searchModel) {
+                this.tableSource.filter = this.searchModel.trim().toLowerCase();
+            }
+        }
+        this.paginator.pageSize = this.pageSize;
+    }
+    applySearch() {
+        this.tableSource.filter = this.searchModel.trim().toLowerCase();
+        this.pageIndex = 0;
+        this.updateSearchToUrl();
+    }
+    clearSearch() {
+        this.searchModel = '';
+        this.tableSource.filter = this.searchModel;
+        this.pageIndex = 0;
+        this.updateSearchToUrl();
+    }
+    checkIfActionVisible(row, action) {
+        if (action.show) {
+            return action.show(row);
+        }
+        else {
+            return true;
+        }
+    }
+    columnVisibleChanged(column) {
+        this.setDisplayedColumns();
+        this.updateConfigsToLocalStorage();
+    }
+    newConfigCreated(name) {
+        const newConfig = this.generateNewConfig(name);
+        this.configurations.push(newConfig);
+        this.updateConfigsToLocalStorage();
+        this.initConfig = newConfig;
+    }
+    configRemoved(configId) {
+        this.configurations = this.configurations.filter(config => config.configId !== configId);
+        this.updateConfigsToLocalStorage();
+    }
+    configChanged(configId) {
+        this.activeConfig = configId
+            ? this.configurations.find(config => config.configId === configId)
+            : null;
+        if (this.activeConfig) {
+            this.setTableConfig(this.activeConfig.pageSize, this.activeConfig.columnsDisabled, this.activeConfig.sortFieldName, this.activeConfig.sortDirection);
+        }
+        else {
+            this.setTableConfig(this.pageSize, [], null, null);
+            this.clearSearch();
+        }
+    }
+    pageChanged(event) {
+        this.pageIndex = event.pageIndex;
+        this.updateSearchToUrl();
+    }
+    updateSearchToUrl() {
+        if (this.bindSearchToUrl) {
+            let queryParams = {
+                stLocalTableSearch: this.searchModel,
+                stLocalTablePageIndex: this.pageIndex,
+                stLocalTablePageSize: this.paginator.pageSize,
+                stLocalTableSortFieldName: '',
+                stLocalTableSortDirection: '',
+            };
+            if (this.sort.direction && this.sort.active) {
+                queryParams = {
+                    ...queryParams,
+                    stLocalTableSortFieldName: this.sort.active,
+                    stLocalTableSortDirection: this.sort.direction,
+                };
+            }
+            this.router.navigate(['./'], {
+                queryParams: queryParams,
+                relativeTo: this.activatedRoute,
+            });
+        }
+    }
+    updateConfigsToLocalStorage() {
+        this.localTableService.saveConfigs(this.configurations);
+    }
+    setTableSource() {
+        this.tableSource = new MatTableDataSource(this._data);
+        this.tableSource.paginator = this.paginator;
+        this.tableSource.sort = this.sort;
+        this.tableSource.filter = this.searchModel;
+        this.changeDetectorRef.markForCheck();
+    }
+    setDisplayedColumns() {
+        this.displayedColumns = Object.keys(this.columns).filter(column => {
+            return this._columns[column].visible;
+        });
+    }
+    getColumnsArray() {
+        return Object.keys(this._columns).map(column => this._columns[column]);
+    }
+    loadConfigs() {
+        this.configurations = this.localTableService.getConfigs();
+    }
+    generateNewConfig(configName) {
+        return {
+            configId: Date.now().toString(),
+            configName: configName,
+            columnsDisabled: this.columnsArray
+                .filter(column => !column.visible)
+                .map(column => column.translateColumnName),
+            pageSize: this.paginator.pageSize,
+            sortFieldName: this.sort.direction && this.sort.active ? this.sort.active : null,
+            sortDirection: this.sort.direction || null,
+        };
+    }
+    setTableConfig(pageSize, disabledColumns, sortFieldName, sortDirection) {
+        this.paginator.pageSize = pageSize;
+        this.sort.sort({
+            id: sortFieldName || '',
+            start: sortDirection || 'asc',
+            disableClear: false,
+        });
+        this.columnsArray.forEach(column => {
+            column.visible =
+                disabledColumns.indexOf(column.translateColumnName) === -1;
+        });
+        this.setDisplayedColumns();
+    }
+}
+LocalTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableComponent, deps: [{ token: LocalTableService }, { token: i0.ChangeDetectorRef }, { token: i2$1.Router }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
+LocalTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LocalTableComponent, selector: "ngx-st-local-table", inputs: { tableSettings: "tableSettings", globalSearchSettings: "globalSearchSettings", pageSize: "pageSize", allowPickColumns: "allowPickColumns", configurationsSettings: "configurationsSettings", localStorageName: "localStorageName", bindSearchToUrl: "bindSearchToUrl", columns: "columns", data: "data" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<div class=\"local-table\">\r\n  <div class=\"row align-items-center\">\r\n    <div\r\n      class=\"col row align-items-center\"\r\n      style=\"padding: 0\"\r\n      *ngIf=\"configurationsSettings || allowPickColumns\"\r\n    >\r\n      <div class=\"col-auto\" style=\"padding: 0\" *ngIf=\"allowPickColumns\">\r\n        <button\r\n          mat-icon-button\r\n          class=\"col-auto\"\r\n          [matMenuTriggerFor]=\"columnsMenu\"\r\n        >\r\n          <span class=\"material-icons-outlined\"> view_week </span>\r\n        </button>\r\n        <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\r\n          <ng-container *ngFor=\"let column of columnsArray\">\r\n            <div mat-menu-item *ngIf=\"!column.notShowInColumnPick\">\r\n              <mat-checkbox\r\n                [(ngModel)]=\"column.visible\"\r\n                (ngModelChange)=\"columnVisibleChanged(column)\"\r\n                style=\"margin-top: 5px\"\r\n                (click)=\"$event.stopPropagation()\"\r\n              >\r\n                {{ column.translateColumnName }}\r\n              </mat-checkbox>\r\n            </div>\r\n          </ng-container>\r\n        </mat-menu>\r\n      </div>\r\n\r\n      <st-configurations\r\n        *ngIf=\"configurationsSettings\"\r\n        [configurationsSettings]=\"configurationsSettings\"\r\n        [configurations]=\"configurations\"\r\n        [initSelectedConfig]=\"initConfig\"\r\n        (createNewConfig)=\"newConfigCreated($event)\"\r\n        (removeConfig)=\"configRemoved($event)\"\r\n        (changeConfig)=\"configChanged($event)\"\r\n      ></st-configurations>\r\n    </div>\r\n\r\n    <div class=\"col\" style=\"padding: 0\" *ngIf=\"globalSearchSettings?.show\">\r\n      <mat-form-field class=\"col\">\r\n        <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\r\n        <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\r\n        <button\r\n          matSuffix\r\n          mat-icon-button\r\n          aria-label=\"Clear\"\r\n          (click)=\"clearSearch()\"\r\n        >\r\n          <mat-icon style=\"font-size: 22px\">close</mat-icon>\r\n        </button>\r\n      </mat-form-field>\r\n    </div>\r\n  </div>\r\n\r\n  <table\r\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\r\n    mat-table\r\n    [dataSource]=\"tableSource\"\r\n    matSort\r\n  >\r\n    <ng-container\r\n      [matColumnDef]=\"column\"\r\n      *ngFor=\"let column of displayedColumns\"\r\n    >\r\n      <th\r\n        mat-header-cell\r\n        *matHeaderCellDef\r\n        style=\"{{\r\n          columns[column].width ? 'width:' + columns[column].width : ''\r\n        }}\"\r\n        mat-sort-header\r\n        [disabled]=\"!columns[column].sort\"\r\n      >\r\n        {{ columns[column].translateColumnName }}\r\n        <span\r\n          class=\"material-icons search-icon\"\r\n          [matMenuTriggerFor]=\"menu\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          *ngIf=\"columns[column].search\"\r\n        >\r\n          search\r\n        </span>\r\n        <mat-menu #menu=\"matMenu\" xPosition=\"before\">\r\n          <mat-form-field class=\"col\">\r\n            <mat-label>{{ columns[column].searchLabel || 'Search' }}</mat-label>\r\n            <input\r\n              matInput\r\n              (keyup)=\"applySearch()\"\r\n              [(ngModel)]=\"searchModel\"\r\n              (click)=\"$event.stopPropagation()\"\r\n            />\r\n            <button\r\n              matSuffix\r\n              mat-icon-button\r\n              aria-label=\"Clear\"\r\n              (click)=\"searchModel = ''\"\r\n            >\r\n              <mat-icon>close</mat-icon>\r\n            </button>\r\n          </mat-form-field>\r\n        </mat-menu>\r\n      </th>\r\n      <td\r\n        mat-cell\r\n        *matCellDef=\"let element\"\r\n        style=\"{{\r\n          columns[column].width ? 'width:' + columns[column].width : ''\r\n        }}\"\r\n      >\r\n        <div\r\n          class=\"actions-container\"\r\n          [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\r\n          *ngIf=\"columns[column].actions && columns[column].actions!.length > 0\"\r\n        >\r\n          <ng-container *ngFor=\"let action of columns[column].actions\">\r\n            <ng-container *ngIf=\"checkIfActionVisible(element, action)\">\r\n              <button\r\n                class=\"col-auto\"\r\n                mat-icon-button\r\n                type=\"button\"\r\n                *ngIf=\"!action.url && action.action\"\r\n                matTooltip=\"{{ action.tooltipName || '' }}\"\r\n                [matTooltipDisabled]=\"!!!action.tooltipName\"\r\n                (click)=\"action.action(element)\"\r\n              >\r\n                <span class=\"material-icons\">{{ action.iconName }}</span>\r\n              </button>\r\n\r\n              <a *ngIf=\"action.url\" [routerLink]=\"action.url\">\r\n                <button\r\n                  class=\"col-auto\"\r\n                  mat-icon-button\r\n                  type=\"button\"\r\n                  matTooltip=\"{{ action.tooltipName || '' }}\"\r\n                  [matTooltipDisabled]=\"!!!action.tooltipName\"\r\n                >\r\n                  <span class=\"material-icons\">{{ action.iconName }}</span>\r\n                </button>\r\n              </a>\r\n            </ng-container>\r\n          </ng-container>\r\n        </div>\r\n\r\n        <ng-container *ngIf=\"!columns[column].actions\">\r\n          <ng-container *ngIf=\"columns[column].translateValue\">\r\n            <p style=\"margin: 0; padding: 0\">\r\n              {{ columns[column].translateValue![element[column]] || '' }}\r\n            </p>\r\n          </ng-container>\r\n\r\n          <ng-container *ngIf=\"!columns[column].translateValue\">\r\n            <ng-container\r\n              *ngIf=\"!columns[column].type || columns[column].type === 'string'\"\r\n            >\r\n              <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"columns[column].type === 'date'\">\r\n              <p style=\"margin: 0; padding: 0\">\r\n                {{ element[column] | stDateTimeFormatPipe }}\r\n              </p>\r\n            </ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n      </td>\r\n    </ng-container>\r\n\r\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n    <tr\r\n      mat-row\r\n      *matRowDef=\"let row; columns: displayedColumns\"\r\n      (click)=\"\r\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\r\n      \"\r\n    ></tr>\r\n  </table>\r\n  <mat-paginator\r\n    [pageIndex]=\"pageIndex\"\r\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\r\n    (page)=\"pageChanged($event)\"\r\n    [showFirstLastButtons]=\"true\"\r\n  ></mat-paginator>\r\n</div>\r\n", styles: ["", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i6$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4.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: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i12.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i12.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i13.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i13.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i13.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i14.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: ConfigurationsComponent, selector: "st-configurations[configurationsSettings]", inputs: ["configurationsSettings", "configurations", "initSelectedConfig"], outputs: ["createNewConfig", "removeConfig", "changeConfig"] }, { kind: "pipe", type: i16.DateTimeFormatPipe, name: "stDateTimeFormatPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LocalTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngx-st-local-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"local-table\">\r\n  <div class=\"row align-items-center\">\r\n    <div\r\n      class=\"col row align-items-center\"\r\n      style=\"padding: 0\"\r\n      *ngIf=\"configurationsSettings || allowPickColumns\"\r\n    >\r\n      <div class=\"col-auto\" style=\"padding: 0\" *ngIf=\"allowPickColumns\">\r\n        <button\r\n          mat-icon-button\r\n          class=\"col-auto\"\r\n          [matMenuTriggerFor]=\"columnsMenu\"\r\n        >\r\n          <span class=\"material-icons-outlined\"> view_week </span>\r\n        </button>\r\n        <mat-menu #columnsMenu=\"matMenu\" xPosition=\"after\">\r\n          <ng-container *ngFor=\"let column of columnsArray\">\r\n            <div mat-menu-item *ngIf=\"!column.notShowInColumnPick\">\r\n              <mat-checkbox\r\n                [(ngModel)]=\"column.visible\"\r\n                (ngModelChange)=\"columnVisibleChanged(column)\"\r\n                style=\"margin-top: 5px\"\r\n                (click)=\"$event.stopPropagation()\"\r\n              >\r\n                {{ column.translateColumnName }}\r\n              </mat-checkbox>\r\n            </div>\r\n          </ng-container>\r\n        </mat-menu>\r\n      </div>\r\n\r\n      <st-configurations\r\n        *ngIf=\"configurationsSettings\"\r\n        [configurationsSettings]=\"configurationsSettings\"\r\n        [configurations]=\"configurations\"\r\n        [initSelectedConfig]=\"initConfig\"\r\n        (createNewConfig)=\"newConfigCreated($event)\"\r\n        (removeConfig)=\"configRemoved($event)\"\r\n        (changeConfig)=\"configChanged($event)\"\r\n      ></st-configurations>\r\n    </div>\r\n\r\n    <div class=\"col\" style=\"padding: 0\" *ngIf=\"globalSearchSettings?.show\">\r\n      <mat-form-field class=\"col\">\r\n        <mat-label>{{ globalSearchSettings?.label || 'Search' }}</mat-label>\r\n        <input matInput (keyup)=\"applySearch()\" [(ngModel)]=\"searchModel\" />\r\n        <button\r\n          matSuffix\r\n          mat-icon-button\r\n          aria-label=\"Clear\"\r\n          (click)=\"clearSearch()\"\r\n        >\r\n          <mat-icon style=\"font-size: 22px\">close</mat-icon>\r\n        </button>\r\n      </mat-form-field>\r\n    </div>\r\n  </div>\r\n\r\n  <table\r\n    [ngClass]=\"{ 'no-hover': !tableSettings?.rowClickAction }\"\r\n    mat-table\r\n    [dataSource]=\"tableSource\"\r\n    matSort\r\n  >\r\n    <ng-container\r\n      [matColumnDef]=\"column\"\r\n      *ngFor=\"let column of displayedColumns\"\r\n    >\r\n      <th\r\n        mat-header-cell\r\n        *matHeaderCellDef\r\n        style=\"{{\r\n          columns[column].width ? 'width:' + columns[column].width : ''\r\n        }}\"\r\n        mat-sort-header\r\n        [disabled]=\"!columns[column].sort\"\r\n      >\r\n        {{ columns[column].translateColumnName }}\r\n        <span\r\n          class=\"material-icons search-icon\"\r\n          [matMenuTriggerFor]=\"menu\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          *ngIf=\"columns[column].search\"\r\n        >\r\n          search\r\n        </span>\r\n        <mat-menu #menu=\"matMenu\" xPosition=\"before\">\r\n          <mat-form-field class=\"col\">\r\n            <mat-label>{{ columns[column].searchLabel || 'Search' }}</mat-label>\r\n            <input\r\n              matInput\r\n              (keyup)=\"applySearch()\"\r\n              [(ngModel)]=\"searchModel\"\r\n              (click)=\"$event.stopPropagation()\"\r\n            />\r\n            <button\r\n              matSuffix\r\n              mat-icon-button\r\n              aria-label=\"Clear\"\r\n              (click)=\"searchModel = ''\"\r\n            >\r\n              <mat-icon>close</mat-icon>\r\n            </button>\r\n          </mat-form-field>\r\n        </mat-menu>\r\n      </th>\r\n      <td\r\n        mat-cell\r\n        *matCellDef=\"let element\"\r\n        style=\"{{\r\n          columns[column].width ? 'width:' + columns[column].width : ''\r\n        }}\"\r\n      >\r\n        <div\r\n          class=\"actions-container\"\r\n          [ngClass]=\"{ 'justify-content-end': columns[column].flexRight }\"\r\n          *ngIf=\"columns[column].actions && columns[column].actions!.length > 0\"\r\n        >\r\n          <ng-container *ngFor=\"let action of columns[column].actions\">\r\n            <ng-container *ngIf=\"checkIfActionVisible(element, action)\">\r\n              <button\r\n                class=\"col-auto\"\r\n                mat-icon-button\r\n                type=\"button\"\r\n                *ngIf=\"!action.url && action.action\"\r\n                matTooltip=\"{{ action.tooltipName || '' }}\"\r\n                [matTooltipDisabled]=\"!!!action.tooltipName\"\r\n                (click)=\"action.action(element)\"\r\n              >\r\n                <span class=\"material-icons\">{{ action.iconName }}</span>\r\n              </button>\r\n\r\n              <a *ngIf=\"action.url\" [routerLink]=\"action.url\">\r\n                <button\r\n                  class=\"col-auto\"\r\n                  mat-icon-button\r\n                  type=\"button\"\r\n                  matTooltip=\"{{ action.tooltipName || '' }}\"\r\n                  [matTooltipDisabled]=\"!!!action.tooltipName\"\r\n                >\r\n                  <span class=\"material-icons\">{{ action.iconName }}</span>\r\n                </button>\r\n              </a>\r\n            </ng-container>\r\n          </ng-container>\r\n        </div>\r\n\r\n        <ng-container *ngIf=\"!columns[column].actions\">\r\n          <ng-container *ngIf=\"columns[column].translateValue\">\r\n            <p style=\"margin: 0; padding: 0\">\r\n              {{ columns[column].translateValue![element[column]] || '' }}\r\n            </p>\r\n          </ng-container>\r\n\r\n          <ng-container *ngIf=\"!columns[column].translateValue\">\r\n            <ng-container\r\n              *ngIf=\"!columns[column].type || columns[column].type === 'string'\"\r\n            >\r\n              <p style=\"margin: 0; padding: 0\">{{ element[column] }}</p>\r\n            </ng-container>\r\n\r\n            <ng-container *ngIf=\"columns[column].type === 'date'\">\r\n              <p style=\"margin: 0; padding: 0\">\r\n                {{ element[column] | stDateTimeFormatPipe }}\r\n              </p>\r\n            </ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n      </td>\r\n    </ng-container>\r\n\r\n    <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n    <tr\r\n      mat-row\r\n      *matRowDef=\"let row; columns: displayedColumns\"\r\n      (click)=\"\r\n        tableSettings?.rowClickAction ? tableSettings.rowClickAction(row) : null\r\n      \"\r\n    ></tr>\r\n  </table>\r\n  <mat-paginator\r\n    [pageIndex]=\"pageIndex\"\r\n    [pageSizeOptions]=\"[5, 10, 15, 20, 25]\"\r\n    (page)=\"pageChanged($event)\"\r\n    [showFirstLastButtons]=\"true\"\r\n  ></mat-paginator>\r\n</div>\r\n", styles: [".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"] }]
+        }], ctorParameters: function () { return [{ type: LocalTableService }, { type: i0.ChangeDetectorRef }, { type: i2$1.Router }, { type: i2$1.ActivatedRoute }]; }, propDecorators: { paginator: [{
+                type: ViewChild,
+                args: [MatPaginator]
+            }], sort: [{
+                type: ViewChild,
+                args: [MatSort]
+            }], tableSettings: [{
+                type: Input
+            }], globalSearchSettings: [{
+                type: Input
+            }], pageSize: [{
+                type: Input
+            }], allowPickColumns: [{
+                type: Input
+            }], configurationsSettings: [{
+                type: Input
+            }], localStorageName: [{
+                type: Input
+            }], bindSearchToUrl: [{
+                type: Input
+            }], columns: [{
+                type: Input
+            }], data: [{
+                type: Input
             }] } });
 
-class SelectTableComponent {
-    constructor() {
-        this.required = false;
-        this.multiple = false;
-        this.searchLabel = 'Search';
-        this.selectedLabel = 'Selected';
-        this._validError = false;
-        this.search = new UntypedFormControl('');
-        this.rowSelected = [];
-    }
-    set setInitColumns(col) {
-        this.columns = ['active', ...Object.keys(col)];
-        this.initColumns = col;
-    }
-    set tableData(data) {
-        this.tableSource = new MatTableDataSource(data);
-        this.tableSource.paginator = this.paginator;
-    }
-    set validError(error) {
-        this._validError = error;
-    }
-    get validError() {
-        return this._validError;
-    }
-    ngOnInit() {
-        this.search.valueChanges.subscribe(res => {
-            this.tableSource.filter = res.trim().toLowerCase();
-        });
-        setTimeout(() => {
-            if (this.initSearchVal) {
-                this.search.setValue(this.initSearchVal);
-                this.rowClick(this.initSelected);
-            }
-        }, 1000);
-    }
-    clearSearch() {
-        this.search.setValue('');
-    }
-    rowClick(row) {
-        const found = this.rowSelected.find(tmpRow => tmpRow === row);
-        if (found) {
-            this.rowSelected = this.rowSelected.filter(tmpRow => tmpRow !== row);
-        }
-        else {
-            if (this.multiple) {
-                this.rowSelected.push(row);
-            }
-            else {
-                this.rowSelected = [row];
-            }
-        }
-        this.returnRowSelected.emit(this.rowSelected);
-    }
-    checkActiveRow(row) {
-        return !!this.rowSelected.find(activeRow => activeRow === row);
-    }
-}
-SelectTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectTableComponent, selector: "ngx-st-select-table", inputs: { title: "title", required: "required", multiple: "multiple", initSelected: "initSelected", initSearchVal: "initSearchVal", searchLabel: "searchLabel", selectedLabel: "selectedLabel", setInitColumns: "setInitColumns", tableData: "tableData", validError: "validError" }, outputs: { returnRowSelected: "returnRowSelected" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], ngImport: i0, template: "<div class=\"shared-table-selector\">\n  <p class=\"title\" [ngClass]=\"{ 'error-text': validError }\">\n    {{ title }} {{ required ? '*' : '' }}\n  </p>\n\n  <div class=\"search-form row align-items-center\">\n    <div class=\"col-sm-12 col-md row align-items-center\">\n      <mat-form-field class=\"col\">\n        <input\n          matInput\n          placeholder=\"{{ searchLabel }}\"\n          [formControl]=\"search\"\n        />\n      </mat-form-field>\n      <div class=\"clear col-auto\">\n        <i class=\"material-icons\" (click)=\"clearSearch()\">clear</i>\n      </div>\n    </div>\n  </div>\n\n  <table mat-table [dataSource]=\"tableSource\">\n    <ng-container *ngFor=\"let col of columns\" [matColumnDef]=\"col\">\n      <th mat-header-cell *matHeaderCellDef>\n        {{ col === 'active' ? selectedLabel : initColumns[col] }}\n      </th>\n      <td mat-cell *matCellDef=\"let element\">\n        <ng-container *ngIf=\"col === 'active'\">\n          <i *ngIf=\"checkActiveRow(element)\" class=\"material-icons active-row\"\n            >done</i\n          >\n        </ng-container>\n\n        <ng-container *ngIf=\"col !== 'active'\">\n          {{ element[col] }}\n        </ng-container>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"columns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: columns\"\n      (click)=\"rowClick(row)\"\n      [ngClass]=\"{ active: checkActiveRow(row) }\"\n    ></tr>\n  </table>\n  <mat-paginator [pageSizeOptions]=\"[5]\"></mat-paginator>\n</div>\n", styles: [".title{margin-bottom:0;margin-top:1rem;font-weight:500}.title.error-text{color:#ef5350}\n", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i6$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.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: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectTableComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ngx-st-select-table', template: "<div class=\"shared-table-selector\">\n  <p class=\"title\" [ngClass]=\"{ 'error-text': validError }\">\n    {{ title }} {{ required ? '*' : '' }}\n  </p>\n\n  <div class=\"search-form row align-items-center\">\n    <div class=\"col-sm-12 col-md row align-items-center\">\n      <mat-form-field class=\"col\">\n        <input\n          matInput\n          placeholder=\"{{ searchLabel }}\"\n          [formControl]=\"search\"\n        />\n      </mat-form-field>\n      <div class=\"clear col-auto\">\n        <i class=\"material-icons\" (click)=\"clearSearch()\">clear</i>\n      </div>\n    </div>\n  </div>\n\n  <table mat-table [dataSource]=\"tableSource\">\n    <ng-container *ngFor=\"let col of columns\" [matColumnDef]=\"col\">\n      <th mat-header-cell *matHeaderCellDef>\n        {{ col === 'active' ? selectedLabel : initColumns[col] }}\n      </th>\n      <td mat-cell *matCellDef=\"let element\">\n        <ng-container *ngIf=\"col === 'active'\">\n          <i *ngIf=\"checkActiveRow(element)\" class=\"material-icons active-row\"\n            >done</i\n          >\n        </ng-container>\n\n        <ng-container *ngIf=\"col !== 'active'\">\n          {{ element[col] }}\n        </ng-container>\n      </td>\n    </ng-container>\n\n    <tr mat-header-row *matHeaderRowDef=\"columns\"></tr>\n    <tr\n      mat-row\n      *matRowDef=\"let row; columns: columns\"\n      (click)=\"rowClick(row)\"\n      [ngClass]=\"{ active: checkActiveRow(row) }\"\n    ></tr>\n  </table>\n  <mat-paginator [pageSizeOptions]=\"[5]\"></mat-paginator>\n</div>\n", styles: [".title{margin-bottom:0;margin-top:1rem;font-weight:500}.title.error-text{color:#ef5350}\n", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { paginator: [{
-                type: ViewChild,
-                args: [MatPaginator]
-            }], title: [{
-                type: Input
-            }], required: [{
-                type: Input
-            }], multiple: [{
-                type: Input
-            }], initSelected: [{
-                type: Input
-            }], initSearchVal: [{
-                type: Input
-            }], searchLabel: [{
-                type: Input
-            }], selectedLabel: [{
-                type: Input
-            }], setInitColumns: [{
-                type: Input
-            }], tableData: [{
-                type: Input
-            }], validError: [{
-                type: Input
-            }], returnRowSelected: [{
-                type: Output
+class SelectTableComponent {
+    constructor() {
+        this.required = false;
+        this.multiple = false;
+        this.searchLabel = 'Search';
+        this.selectedLabel = 'Selected';
+        this._validError = false;
+        this.returnRowSelected = new EventEmitter();
+        this.search = new UntypedFormControl('');
+        this.rowSelected = [];
+    }
+    set setInitColumns(col) {
+        this.columns = ['active', ...Object.keys(col)];
+        this.initColumns = col;
+    }
+    set tableData(data) {
+        this.tableSource = new MatTableDataSource(data);
+        this.tableSource.paginator = this.paginator;
+    }
+    set validError(error) {
+        this._validError = error;
+    }
+    get validError() {
+        return this._validError;
+    }
+    ngOnInit() {
+        this.search.valueChanges.subscribe(res => {
+            this.tableSource.filter = res.trim().toLowerCase();
+        });
+        setTimeout(() => {
+            if (this.initSearchVal) {
+                this.search.setValue(this.initSearchVal);
+                this.rowClick(this.initSelected);
+            }
+        }, 1000);
+    }
+    clearSearch() {
+        this.search.setValue('');
+    }
+    rowClick(row) {
+        const found = this.rowSelected.find(tmpRow => tmpRow === row);
+        if (found) {
+            this.rowSelected = this.rowSelected.filter(tmpRow => tmpRow !== row);
+        }
+        else {
+            if (this.multiple) {
+                this.rowSelected.push(row);
+            }
+            else {
+                this.rowSelected = [row];
+            }
+        }
+        this.returnRowSelected.emit(this.rowSelected);
+    }
+    checkActiveRow(row) {
+        return !!this.rowSelected.find(activeRow => activeRow === row);
+    }
+}
+SelectTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SelectTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectTableComponent, selector: "ngx-st-select-table", inputs: { title: "title", required: "required", multiple: "multiple", initSelected: "initSelected", initSearchVal: "initSearchVal", searchLabel: "searchLabel", selectedLabel: "selectedLabel", setInitColumns: "setInitColumns", tableData: "tableData", validError: "validError" }, outputs: { returnRowSelected: "returnRowSelected" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }], ngImport: i0, template: "<div class=\"shared-table-selector\">\r\n  <p class=\"title\" [ngClass]=\"{ 'error-text': validError }\">\r\n    {{ title }} {{ required ? '*' : '' }}\r\n  </p>\r\n\r\n  <div class=\"search-form row align-items-center\">\r\n    <div class=\"col-sm-12 col-md row align-items-center\">\r\n      <mat-form-field class=\"col\">\r\n        <input\r\n          matInput\r\n          placeholder=\"{{ searchLabel }}\"\r\n          [formControl]=\"search\"\r\n        />\r\n      </mat-form-field>\r\n      <div class=\"clear col-auto\">\r\n        <i class=\"material-icons\" (click)=\"clearSearch()\">clear</i>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <table mat-table [dataSource]=\"tableSource\">\r\n    <ng-container *ngFor=\"let col of columns\" [matColumnDef]=\"col\">\r\n      <th mat-header-cell *matHeaderCellDef>\r\n        {{ col === 'active' ? selectedLabel : initColumns[col] }}\r\n      </th>\r\n      <td mat-cell *matCellDef=\"let element\">\r\n        <ng-container *ngIf=\"col === 'active'\">\r\n          <i *ngIf=\"checkActiveRow(element)\" class=\"material-icons active-row\"\r\n            >done</i\r\n          >\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"col !== 'active'\">\r\n          {{ element[col] }}\r\n        </ng-container>\r\n      </td>\r\n    </ng-container>\r\n\r\n    <tr mat-header-row *matHeaderRowDef=\"columns\"></tr>\r\n    <tr\r\n      mat-row\r\n      *matRowDef=\"let row; columns: columns\"\r\n      (click)=\"rowClick(row)\"\r\n      [ngClass]=\"{ active: checkActiveRow(row) }\"\r\n    ></tr>\r\n  </table>\r\n  <mat-paginator [pageSizeOptions]=\"[5]\"></mat-paginator>\r\n</div>\r\n", styles: [".title{margin-bottom:0;margin-top:1rem;font-weight:500}.title.error-text{color:#ef5350}\n", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i6$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i7$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.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: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectTableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngx-st-select-table', template: "<div class=\"shared-table-selector\">\r\n  <p class=\"title\" [ngClass]=\"{ 'error-text': validError }\">\r\n    {{ title }} {{ required ? '*' : '' }}\r\n  </p>\r\n\r\n  <div class=\"search-form row align-items-center\">\r\n    <div class=\"col-sm-12 col-md row align-items-center\">\r\n      <mat-form-field class=\"col\">\r\n        <input\r\n          matInput\r\n          placeholder=\"{{ searchLabel }}\"\r\n          [formControl]=\"search\"\r\n        />\r\n      </mat-form-field>\r\n      <div class=\"clear col-auto\">\r\n        <i class=\"material-icons\" (click)=\"clearSearch()\">clear</i>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <table mat-table [dataSource]=\"tableSource\">\r\n    <ng-container *ngFor=\"let col of columns\" [matColumnDef]=\"col\">\r\n      <th mat-header-cell *matHeaderCellDef>\r\n        {{ col === 'active' ? selectedLabel : initColumns[col] }}\r\n      </th>\r\n      <td mat-cell *matCellDef=\"let element\">\r\n        <ng-container *ngIf=\"col === 'active'\">\r\n          <i *ngIf=\"checkActiveRow(element)\" class=\"material-icons active-row\"\r\n            >done</i\r\n          >\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"col !== 'active'\">\r\n          {{ element[col] }}\r\n        </ng-container>\r\n      </td>\r\n    </ng-container>\r\n\r\n    <tr mat-header-row *matHeaderRowDef=\"columns\"></tr>\r\n    <tr\r\n      mat-row\r\n      *matRowDef=\"let row; columns: columns\"\r\n      (click)=\"rowClick(row)\"\r\n      [ngClass]=\"{ active: checkActiveRow(row) }\"\r\n    ></tr>\r\n  </table>\r\n  <mat-paginator [pageSizeOptions]=\"[5]\"></mat-paginator>\r\n</div>\r\n", styles: [".title{margin-bottom:0;margin-top:1rem;font-weight:500}.title.error-text{color:#ef5350}\n", ".search-form button{height:40px}.search-form mat-form-field:first-child{padding-left:0}.search-form mat-form-field:last-child{padding-right:0}.search-form .clear{padding:0}.search-form .clear i{height:20px;width:20px;font-size:20px;cursor:pointer}table{width:100%;box-shadow:none}table th.mat-header-cell:first-of-type,table td.mat-cell:first-of-type,table td.mat-footer-cell:first-of-type{padding-left:12px}table th.mat-header-cell:last-of-type,table td.mat-cell:last-of-type,table td.mat-footer-cell:last-of-type{padding-right:12px}table::ng-deep thead tr{background-color:#fff9c4}table::ng-deep thead tr th{border-color:#fdd835}table::ng-deep tbody>tr{cursor:pointer}table::ng-deep tbody>tr.active{background-color:#a5d6a7}table::ng-deep tbody>tr:hover{background-color:#a5d6a7}table::ng-deep tbody>tr.disabled{cursor:not-allowed}table::ng-deep tbody>tr.disabled:hover{background-color:inherit}table::ng-deep tbody>tr.detail-row{height:0;cursor:default}table::ng-deep tbody>tr.detail-row:hover{background-color:transparent}table::ng-deep tbody>tr.detail-row .element-detail{overflow:hidden;display:flex}table::ng-deep tbody>tr.detail-row .element-detail p{padding:20px 0;margin-bottom:0;white-space:pre-wrap}table::ng-deep tbody>tr td i.active-row{color:#1b5e20;font-weight:700;font-size:25px;height:25px;width:25px;margin-top:2px}table::ng-deep tbody>tr td>div{max-height:200px;overflow:hidden;overflow-y:auto}table::ng-deep tbody>tr td a button{color:#000}table::ng-deep tbody>tr td a i{color:#333}table::ng-deep .mat-column-active{width:48px}table.no-hover::ng-deep tbody tr{cursor:default}table.no-hover::ng-deep tbody tr.active{background-color:transparent}table.no-hover::ng-deep tbody tr:hover{background-color:transparent}table.admin-table::ng-deep .actions-cell{width:100px}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { paginator: [{
+                type: ViewChild,
+                args: [MatPaginator]
+            }], title: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], multiple: [{
+                type: Input
+            }], initSelected: [{
+                type: Input
+            }], initSearchVal: [{
+                type: Input
+            }], searchLabel: [{
+                type: Input
+            }], selectedLabel: [{
+                type: Input
+            }], setInitColumns: [{
+                type: Input
+            }], tableData: [{
+                type: Input
+            }], validError: [{
+                type: Input
+            }], returnRowSelected: [{
+                type: Output
             }] } });
 
-class StTablesModule {
-}
-StTablesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-StTablesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, declarations: [LocalTableComponent,
-        SelectTableComponent,
-        ConfigurationsComponent], imports: [CommonModule,
-        MatButtonModule,
-        MatIconModule,
-        MatTableModule,
-        MatPaginatorModule,
-        MatFormFieldModule,
-        MatInputModule,
-        MatTooltipModule,
-        FormsModule,
-        ReactiveFormsModule,
-        RouterModule,
-        StDateFormatModule,
-        MatSortModule,
-        MatMenuModule,
-        MatSelectModule,
-        MatCheckboxModule], exports: [LocalTableComponent, SelectTableComponent] });
-StTablesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, providers: [LocalTableService], imports: [CommonModule,
-        MatButtonModule,
-        MatIconModule,
-        MatTableModule,
-        MatPaginatorModule,
-        MatFormFieldModule,
-        MatInputModule,
-        MatTooltipModule,
-        FormsModule,
-        ReactiveFormsModule,
-        RouterModule,
-        StDateFormatModule,
-        MatSortModule,
-        MatMenuModule,
-        MatSelectModule,
-        MatCheckboxModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        LocalTableComponent,
-                        SelectTableComponent,
-                        ConfigurationsComponent,
-                    ],
-                    imports: [
-                        CommonModule,
-                        MatButtonModule,
-                        MatIconModule,
-                        MatTableModule,
-                        MatPaginatorModule,
-                        MatFormFieldModule,
-                        MatInputModule,
-                        MatTooltipModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        RouterModule,
-                        StDateFormatModule,
-                        MatSortModule,
-                        MatMenuModule,
-                        MatSelectModule,
-                        MatCheckboxModule,
-                    ],
-                    exports: [LocalTableComponent, SelectTableComponent],
-                    providers: [LocalTableService],
-                }]
+class StTablesModule {
+}
+StTablesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+StTablesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, declarations: [LocalTableComponent,
+        SelectTableComponent,
+        ConfigurationsComponent], imports: [CommonModule,
+        MatButtonModule,
+        MatIconModule,
+        MatTableModule,
+        MatPaginatorModule,
+        MatFormFieldModule,
+        MatInputModule,
+        MatTooltipModule,
+        FormsModule,
+        ReactiveFormsModule,
+        RouterModule,
+        StDateFormatModule,
+        MatSortModule,
+        MatMenuModule,
+        MatSelectModule,
+        MatCheckboxModule], exports: [LocalTableComponent, SelectTableComponent] });
+StTablesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, providers: [LocalTableService], imports: [CommonModule,
+        MatButtonModule,
+        MatIconModule,
+        MatTableModule,
+        MatPaginatorModule,
+        MatFormFieldModule,
+        MatInputModule,
+        MatTooltipModule,
+        FormsModule,
+        ReactiveFormsModule,
+        RouterModule,
+        StDateFormatModule,
+        MatSortModule,
+        MatMenuModule,
+        MatSelectModule,
+        MatCheckboxModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StTablesModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        LocalTableComponent,
+                        SelectTableComponent,
+                        ConfigurationsComponent,
+                    ],
+                    imports: [
+                        CommonModule,
+                        MatButtonModule,
+                        MatIconModule,
+                        MatTableModule,
+                        MatPaginatorModule,
+                        MatFormFieldModule,
+                        MatInputModule,
+                        MatTooltipModule,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        RouterModule,
+                        StDateFormatModule,
+                        MatSortModule,
+                        MatMenuModule,
+                        MatSelectModule,
+                        MatCheckboxModule,
+                    ],
+                    exports: [LocalTableComponent, SelectTableComponent],
+                    providers: [LocalTableService],
+                }]
         }] });
 
-/*
- * Public API Surface of ngx-st-tables
+/*
+ * Public API Surface of ngx-st-tables
  */
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { ConfigurationsComponent, LocalTableComponent, LocalTableService, SelectTableComponent, StTablesModule };