@esfaenza/es-table 13.3.2 → 13.4.0

package/fesm2020/esfaenza-es-table.mjs

@@ -1,32 +1,31 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Optional, Inject, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output, Directive, ViewChild, HostListener, Self, ContentChildren, ContentChild, NgModule } from '@angular/core';
+import { InjectionToken, Injectable, Optional, Inject, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output, Directive, Self, ViewChild, HostListener, Pipe, ContentChildren, ContentChild, NgModule } from '@angular/core';
 import * as i2 from '@esfaenza/localizations';
 import { LocalizationService, LocalizationModule } from '@esfaenza/localizations';
 import * as i5 from '@esfaenza/extensions';
 import { UtilityService, ExportService, HashingService, MessageService } from '@esfaenza/extensions';
 import * as i3 from '@angular/material/form-field';
-import * as i11 from '@angular/common';
+import * as i13 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i5$1 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
-import * as i16 from '@angular/cdk/drag-drop';
+import * as i17 from '@angular/cdk/drag-drop';
 import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
 import { Subject } from 'rxjs';
 import * as i2$1 from '@esfaenza/preferences';
-import * as i1$1 from '@angular/platform-browser';
-import * as i9 from '@esfaenza/forms-and-validations';
+import * as i10 from '@esfaenza/forms-and-validations';
 import { FormsAndValidationsModule } from '@esfaenza/forms-and-validations';
-import * as i10 from '@esfaenza/ngx-contextmenu';
+import * as i1$1 from '@angular/material/tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import * as i12 from '@esfaenza/ngx-contextmenu';
 import { ContextMenuModule } from '@esfaenza/ngx-contextmenu';
-import * as i12 from '@ctrl/ngx-csv';
-import { CsvModule } from '@ctrl/ngx-csv';
-import * as i13 from 'ngx-bootstrap/dropdown';
+import * as i14 from 'ngx-bootstrap/dropdown';
 import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
-import * as i14 from '@angular/router';
+import * as i15 from '@angular/router';
 import { RouterModule } from '@angular/router';
-import * as i15 from 'ngx-bootstrap/modal';
+import * as i16 from 'ngx-bootstrap/modal';
 import { ModalModule } from 'ngx-bootstrap/modal';
 import { MatSelectModule } from '@angular/material/select';
 
@@ -49,9 +48,9 @@ class TablePagerLoc extends LocalizationService {
         super.set("en->it", "This might slow down the page and possibly crash the entire application", ["L'operazione potrebbe rallentare la pagina fino al crash dell'applicazione"]);
     }
 }
-TablePagerLoc.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: TablePagerLoc, deps: [{ token: EST_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-TablePagerLoc.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: TablePagerLoc });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: TablePagerLoc, decorators: [{
+TablePagerLoc.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TablePagerLoc, deps: [{ token: EST_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+TablePagerLoc.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TablePagerLoc });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TablePagerLoc, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Optional
@@ -127,11 +126,11 @@ class TablePagerComponent {
         }
     }
 }
-TablePagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: TablePagerComponent, deps: [{ token: i5.MessageService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: EST_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-TablePagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: TablePagerComponent, selector: "app-paging", inputs: { CurrentPageSize: "CurrentPageSize", View: "View", WarnOnAll: "WarnOnAll", AllSearch: "AllSearch", DefaultAll: "DefaultAll", GroupMode: "GroupMode", GroupCount: "GroupCount", CountLabel: "CountLabel", ShowCount: "ShowCount", ShowPaging: "ShowPaging", PagerCount: "PagerCount", Hidden: "Hidden" }, outputs: { pagingSelected: "pagingSelected" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!Hidden\">\r\n  <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}:&nbsp;</span>\r\n  <ng-container *ngIf=\"ShowPaging && Model && (Model == DefaultAll || PagerCount >= Model || PagerCount == -1)\">\r\n    <mat-form-field [appearance]=\"'legacy'\" class=\"mat-paginator-page-size-select est-fs-14 est-ipp-bold\">\r\n      <select matNativeControl [ngModel]=\"Model\" name=\"input\" (ngModelChange)=\"choice($event)\">\r\n        <ng-container *ngFor=\"let pOpt of PagingOptions\">\r\n          <option *ngIf=\"pOpt == DefaultAll || PagerCount >= pOpt || PagerCount == -1\" [value]=\"pOpt\">{{ pOpt == DefaultAll ? ('All' | localize : lc) : pOpt.toString()}}</option>\r\n        </ng-container>\r\n      </select>\r\n    </mat-form-field>\r\n    <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">&nbsp;/&nbsp;</span>\r\n  </ng-container>\r\n  <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">{{PagerCount | number : '0.0-0' : locale}}</span>\r\n</ng-container>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "localize": i2.LocalizePipe, "number": i11.DecimalPipe }, viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: TablePagerComponent, decorators: [{
+TablePagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TablePagerComponent, deps: [{ token: i5.MessageService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: EST_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+TablePagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: TablePagerComponent, selector: "app-paging", inputs: { CurrentPageSize: "CurrentPageSize", View: "View", WarnOnAll: "WarnOnAll", AllSearch: "AllSearch", DefaultAll: "DefaultAll", GroupMode: "GroupMode", GroupCount: "GroupCount", CountLabel: "CountLabel", ShowCount: "ShowCount", ShowPaging: "ShowPaging", PagerCount: "PagerCount", Hidden: "Hidden" }, outputs: { pagingSelected: "pagingSelected" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!Hidden\">\r\n  <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}:&nbsp;</span>\r\n  <ng-container *ngIf=\"ShowPaging && Model && PagerCount > 10\">\r\n    <mat-form-field [appearance]=\"'legacy'\" class=\"mat-paginator-page-size-select est-fs-14 est-ipp-bold\">\r\n      <select matNativeControl [ngModel]=\"Model\" name=\"input\" (ngModelChange)=\"choice($event)\">\r\n        <ng-container *ngFor=\"let pOpt of PagingOptions; let i = index\">\r\n          <option *ngIf=\"pOpt == DefaultAll || PagerCount >= pOpt || PagerCount == -1 || (i > 0 && PagerCount >= PagingOptions[i-1])\" [value]=\"pOpt\">{{ pOpt == DefaultAll ? ('All' | localize : lc) : pOpt.toString()}}</option>\r\n        </ng-container>\r\n      </select>\r\n    </mat-form-field>\r\n    <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">&nbsp;/&nbsp;</span>\r\n  </ng-container>\r\n  <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">{{PagerCount | number : '0.0-0' : locale}}</span>\r\n</ng-container>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"], components: [{ type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "localize": i2.LocalizePipe, "number": i13.DecimalPipe }, viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: TablePagerComponent, decorators: [{
             type: Component,
-            args: [{ selector: "app-paging", viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!Hidden\">\r\n  <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}:&nbsp;</span>\r\n  <ng-container *ngIf=\"ShowPaging && Model && (Model == DefaultAll || PagerCount >= Model || PagerCount == -1)\">\r\n    <mat-form-field [appearance]=\"'legacy'\" class=\"mat-paginator-page-size-select est-fs-14 est-ipp-bold\">\r\n      <select matNativeControl [ngModel]=\"Model\" name=\"input\" (ngModelChange)=\"choice($event)\">\r\n        <ng-container *ngFor=\"let pOpt of PagingOptions\">\r\n          <option *ngIf=\"pOpt == DefaultAll || PagerCount >= pOpt || PagerCount == -1\" [value]=\"pOpt\">{{ pOpt == DefaultAll ? ('All' | localize : lc) : pOpt.toString()}}</option>\r\n        </ng-container>\r\n      </select>\r\n    </mat-form-field>\r\n    <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">&nbsp;/&nbsp;</span>\r\n  </ng-container>\r\n  <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">{{PagerCount | number : '0.0-0' : locale}}</span>\r\n</ng-container>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"] }]
+            args: [{ selector: "app-paging", viewProviders: [{ provide: LocalizationService, useClass: TablePagerLoc }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!Hidden\">\r\n  <span class=\"est-fs-14\"> {{CountLabel && !GroupMode ? CountLabel : ((GroupMode ? 'Shown Groups' : 'Shown Elements') | localize : lc)}}:&nbsp;</span>\r\n  <ng-container *ngIf=\"ShowPaging && Model && PagerCount > 10\">\r\n    <mat-form-field [appearance]=\"'legacy'\" class=\"mat-paginator-page-size-select est-fs-14 est-ipp-bold\">\r\n      <select matNativeControl [ngModel]=\"Model\" name=\"input\" (ngModelChange)=\"choice($event)\">\r\n        <ng-container *ngFor=\"let pOpt of PagingOptions; let i = index\">\r\n          <option *ngIf=\"pOpt == DefaultAll || PagerCount >= pOpt || PagerCount == -1 || (i > 0 && PagerCount >= PagingOptions[i-1])\" [value]=\"pOpt\">{{ pOpt == DefaultAll ? ('All' | localize : lc) : pOpt.toString()}}</option>\r\n        </ng-container>\r\n      </select>\r\n    </mat-form-field>\r\n    <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">&nbsp;/&nbsp;</span>\r\n  </ng-container>\r\n  <span class=\"est-fs-14 est-ipp-bold\" *ngIf=\"ShowCount && PagerCount != -1\">{{PagerCount | number : '0.0-0' : locale}}</span>\r\n</ng-container>", styles: [".est-rg-ipp-sel-all,.est-rg-ipp-sel,.est-ipp-sel-all,.est-ipp-sel{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block;display:inline}.est-ipp-bold{font-weight:700}.mat-paginator-page-size-select{margin:6px 4px 0;width:50px}.mat-paginator-page-size-select .mat-form-field-wrapper{height:52px!important;margin-top:-15px!important;padding:0!important}.mat-form-field-type-mat-native-select .mat-form-field-infix:after{margin-top:-5.5px!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i5.MessageService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
@@ -183,20 +182,54 @@ class AppSearch {
         this.firstsearch = true;
     }
     /**
-     * Permette di resettare questo oggetto ai valori di default
+     * Permette di resettare un AppSearch ai valori di default.
+     * Reso statico perché fra una deserializzazione e l'altra si potrebbe perdere il prototype del costruttore
+     *
+     * @param {AppSearch<any>} aps AppSearch da resettare
      */
-    reset() {
-        this.pages = 1;
-        this.objectcount = 0;
-        this.searchinprogress = false;
-        this.firstsearch = false;
-        this.page = 1;
-        this.itemsperpageoverride = 15;
-        this.items = [];
-        this.orders = [];
-        this.columns = [];
-        this.column_ordering = [];
-        this.savedstate = false;
+    static reset(aps) {
+        aps.pages = 1;
+        aps.objectcount = 0;
+        aps.searchinprogress = false;
+        aps.firstsearch = false;
+        aps.page = 1;
+        aps.itemsperpageoverride = 15;
+        aps.items = [];
+        aps.orders = [];
+        aps.columns = [];
+        aps.column_ordering = [];
+        aps.savedstate = false;
+        aps.selfsearch = false;
+    }
+    /**
+     * Permette di ottenere un nuovo riferimento all'AppSearch passata come parametro.
+     * Internamente utilizza il JSON.parse(JSON.stringify(X)) con la differenza che prima stacca il riferimento agli items per evitare di
+     * reserializzare potenzialmente centinaia di elementi. Il riferimento viene poi ricollegato alla nuova appsearch generata
+     *
+     * @param {AppSearch<any>} aps AppSearch di cui estrarre un nuovo riferimento equivalente
+     */
+    static newref(aps) {
+        var items = aps.items;
+        aps.items = [];
+        var newref = JSON.parse(JSON.stringify(aps));
+        newref.items = items;
+        newref.page = 1;
+        return newref;
+    }
+}
+
+/** Classe che rappresenta le informazioni di paginazione della tabella attuale */
+class PagerInfos {
+    constructor() {
+        this.PagerCount = null;
+        this.ShowCount = true;
+        this.ShowPaging = true;
+        this.ShowButtons = true;
+        this.ShowPagingOptions = true;
+        this.UsesView = true;
+        this.View = null;
+        this.Ready = false;
+        this.Searches = 'items';
     }
 }
 
@@ -237,6 +270,25 @@ class GroupFilter {
     }
 }
 
+/** Classe che rappresenta la modifica ad un singolo oggetto in una singola proprietà */
+class EsTableModelChange {
+    /**
+     * Costruttore
+     * @param {any} item Oggetto modificato
+     * @param {string} header Nome dell'Header che è stato modificato
+     * @param {string} property Nome della proprietà modificata
+     * @param {string} old_value Vecchio valore della proprietà **property** dell'oggetto **item**
+     * @param {string} new_value Nuovo valore della proprietà **property** dell'oggetto **item**
+     */
+    constructor(item, header, property, old_value, new_value) {
+        this.item = item;
+        this.header = header;
+        this.property = property;
+        this.old_value = old_value;
+        this.new_value = new_value;
+    }
+}
+
 /** Direttiva per la dichiarazione snella di un EsTd da emettere per ogni elemento, data una colonna */
 class EsTdDirective {
     /**
@@ -254,21 +306,39 @@ class EsTdDirective {
         this.tdIf = true;
     }
 }
-EsTdDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTdDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-EsTdDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.9", type: EsTdDirective, selector: "[td]", inputs: { tdVisible: "tdVisible", td: "td", tdIf: "tdIf", tdClass: "tdClass", tdPropertyAccessor: "tdPropertyAccessor" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTdDirective, decorators: [{
+EsTdDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTdDirective, deps: [{ token: i0.TemplateRef, self: true }], target: i0.ɵɵFactoryTarget.Directive });
+EsTdDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: EsTdDirective, selector: "[td]", inputs: { tdVisible: "tdVisible", td: "td", tdForProperty: "tdForProperty", tdIf: "tdIf", tdClass: "tdClass", tdPropertyAccessor: "tdPropertyAccessor", tdAlignment: "tdAlignment", tdFormat: "tdFormat", tdIconClass: "tdIconClass", tdConditionField: "tdConditionField", tdConditionValue: "tdConditionValue", tdTitle: "tdTitle", tdContent: "tdContent" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTdDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[td]' }]
-        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; }, propDecorators: { tdVisible: [{
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
+                    type: Self
+                }] }]; }, propDecorators: { tdVisible: [{
                 type: Input
             }], td: [{
                 type: Input
+            }], tdForProperty: [{
+                type: Input
             }], tdIf: [{
                 type: Input
             }], tdClass: [{
                 type: Input
             }], tdPropertyAccessor: [{
                 type: Input
+            }], tdAlignment: [{
+                type: Input
+            }], tdFormat: [{
+                type: Input
+            }], tdIconClass: [{
+                type: Input
+            }], tdConditionField: [{
+                type: Input
+            }], tdConditionValue: [{
+                type: Input
+            }], tdTitle: [{
+                type: Input
+            }], tdContent: [{
+                type: Input
             }] } });
 
 /** Direttiva per la dichiarazione snella di un EsTh da emettere come header */
@@ -316,16 +386,26 @@ class EsThDirective {
         this.thGroup = false;
         /** Indica che bisogna fare una aggregazione su questa colonna, a fronte di almeno un altra con un raggruppamento */
         this.thAggregation = null;
-        /** Impostazioni per la modifica inline di questo campo: la **Property** di riferimento e il **Type** (a scelta fra quelli supportati dal form-adaptive) */
-        this.thUserEdits = null;
+        /** Proprietà JS a cui si riferisce questa cella */
+        this.thProperty = null;
+        /** Tipo della proprietà JS a cui si riferisce questa cella. Se valorizzato l'utente la potrà modificare facendo doppio click */
+        this.thType = null;
+        /** Sorgente dei valori disponibili per questa cella se il **Type** è di tipo 'enum' */
+        this.thSource = null;
+        /** Indica un contenuto statico da mostrare piuttosto che utilizzare il **Template**. Serve in caso questo oggetto venga generato programmaticamente */
+        this.thStaticContent = null;
+        /** Opzioni da applicare all'editor di questa colonna */
+        this.thEditorOptions = {};
     }
 }
-EsThDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsThDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-EsThDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.9", type: EsThDirective, selector: "[th]", inputs: { th: "th", thPinned: "thPinned", thPinnable: "thPinnable", thPinnedWidth: "thPinnedWidth", thVisible: "thVisible", thFixed: "thFixed", thParent: "thParent", thOrder: "thOrder", thOrderable: "thOrderable", thWrap: "thWrap", thResizable: "thResizable", thClass: "thClass", thGroupClass: "thGroupClass", thIf: "thIf", thEmpty: "thEmpty", thGroup: "thGroup", thAggregation: "thAggregation", thUserEdits: "thUserEdits", thMulti: "thMulti", thStaticContent: "thStaticContent", thBackgroundColor: "thBackgroundColor" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsThDirective, decorators: [{
+EsThDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsThDirective, deps: [{ token: i0.TemplateRef, self: true }], target: i0.ɵɵFactoryTarget.Directive });
+EsThDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: EsThDirective, selector: "[th]", inputs: { th: "th", thPinned: "thPinned", thPinnable: "thPinnable", thPinnedWidth: "thPinnedWidth", thVisible: "thVisible", thFixed: "thFixed", thParent: "thParent", thOrder: "thOrder", thOrderable: "thOrderable", thWrap: "thWrap", thResizable: "thResizable", thClass: "thClass", thShrink: "thShrink", thGroupClass: "thGroupClass", thIf: "thIf", thEmpty: "thEmpty", thGroup: "thGroup", thAggregation: "thAggregation", thProperty: "thProperty", thType: "thType", thSource: "thSource", thMulti: "thMulti", thStaticContent: "thStaticContent", thBackgroundColor: "thBackgroundColor", thAlignment: "thAlignment", thFormat: "thFormat", thEditorName: "thEditorName", thEditorOptions: "thEditorOptions", thRendererName: "thRendererName", thRoutePath: "thRoutePath", thRouteParameterProperties: "thRouteParameterProperties" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsThDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[th]' }]
-        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; }, propDecorators: { th: [{
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
+                    type: Self
+                }] }]; }, propDecorators: { th: [{
                 type: Input
             }], thPinned: [{
                 type: Input
@@ -349,6 +429,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Input
             }], thClass: [{
                 type: Input
+            }], thShrink: [{
+                type: Input
             }], thGroupClass: [{
                 type: Input
             }], thIf: [{
@@ -359,7 +441,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Input
             }], thAggregation: [{
                 type: Input
-            }], thUserEdits: [{
+            }], thProperty: [{
+                type: Input
+            }], thType: [{
+                type: Input
+            }], thSource: [{
                 type: Input
             }], thMulti: [{
                 type: Input
@@ -367,6 +453,42 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Input
             }], thBackgroundColor: [{
                 type: Input
+            }], thAlignment: [{
+                type: Input
+            }], thFormat: [{
+                type: Input
+            }], thEditorName: [{
+                type: Input
+            }], thEditorOptions: [{
+                type: Input
+            }], thRendererName: [{
+                type: Input
+            }], thRoutePath: [{
+                type: Input
+            }], thRouteParameterProperties: [{
+                type: Input
+            }] } });
+
+/** Direttiva che rappresenta il template dell'editor di una cella all'interno della tabella */
+class EsTdEditorDirective {
+    /** @ignore */
+    constructor(Template) {
+        this.Template = Template;
+    }
+}
+EsTdEditorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTdEditorDirective, deps: [{ token: i0.TemplateRef, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
+EsTdEditorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.4.0", type: EsTdEditorDirective, selector: "[editor]", inputs: { editor: "editor", editorForProperty: "editorForProperty" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTdEditorDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[editor]' }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
+                    type: Self
+                }, {
+                    type: Optional
+                }] }]; }, propDecorators: { editor: [{
+                type: Input
+            }], editorForProperty: [{
+                type: Input
             }] } });
 
 /** Classe di localizzazione per il componente **EsTableComponent** */
@@ -392,12 +514,14 @@ class EsTableLoc extends LocalizationService {
         super.set("en->it", "Select Everything", ["Seleziona Tutto"]);
         super.set("en->it", "Reset Selection", ["Resetta Selezione"]);
         super.set("en->it", "No operations available", ["Nessuna operazione disponibile"]);
-        super.set("en->it", "Paging options are not available for this report", ["Le opzioni di paginazione non sono disponibili per questo report"]);
+        super.set("en->it", "Values copied in the clipboard", ["Valori copiati nella clipboard"]);
+        super.set("en->it", "Size of copied data is different from the size of the selection", ["La dimensione dei dati copiati differisce dalla dimensione della selezione"]);
+        super.set("en->it", "Data for this table cannot be edited", ["I dati di questa tabella non possono essere modificati"]);
     }
 }
-EsTableLoc.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableLoc, deps: [{ token: EST_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-EsTableLoc.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableLoc });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableLoc, decorators: [{
+EsTableLoc.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableLoc, deps: [{ token: EST_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+EsTableLoc.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableLoc });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableLoc, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Optional
@@ -434,8 +558,7 @@ class ExportHandler {
                 }
                 this.setupExport(data);
                 if (format == "CSV") {
-                    this.est.cdr.detectChanges();
-                    setTimeout(() => { this.est.exportDownloader.nativeElement.click(); });
+                    this.exportCSV();
                 }
                 else if (format == "XLSX") {
                     if (this.ExcelJS != null) {
@@ -454,6 +577,33 @@ class ExportHandler {
                     throw "Formato di esportazione non riconosciuto";
             }, format);
     }
+    /** Effettua l'esportazione in file CSV, va a sostituire quel coso inutile di @ctrl/ngx-csv */
+    exportCSV() {
+        var csvData = this.convertToCSV();
+        var blob = new Blob([csvData], { type: 'text/csv' });
+        var objectUrl = window.URL.createObjectURL(blob);
+        let fn = this.est.ExportFileName;
+        this.utiExts.fileDownload(objectUrl, fn.endsWith('.xlsx') ? fn.replace('.xlsx', '.csv') : fn.endsWith('.csv') ? fn : fn + ".csv");
+    }
+    /** Generazione specifica del CSV */
+    convertToCSV() {
+        let csv = '', row = '', sep = ';';
+        for (let i = 0; i < this.est.headers.length; i++) {
+            let h = this.est.headers[i];
+            row += `${row != '' ? sep : ''}"${h.label}"`;
+        }
+        csv += row + '\r\n';
+        for (let i = 0; i < this.est.data.length; i++) {
+            row = '';
+            let item = this.est.data[i];
+            for (let j = 0; j < this.est.headers.length; j++) {
+                let val = item[this.est.headers[j].key];
+                row += `${row != '' ? sep : ''}"${val}"`;
+            }
+            csv += row + '\r\n';
+        }
+        return csv;
+    }
     /** Effettua l'esportazione del file Excel basandosi sul modulo **ExcelJS**, sugli header **this.est.headers** e sui dati **this.est.data** */
     async exportExcel() {
         let iFix = 1;
@@ -475,17 +625,28 @@ class ExportHandler {
                 let h = this.est.headers[i];
                 let cell = row.getCell(i + 1);
                 let val = item[h.key];
-                if (val == null || val == undefined)
+                if (!val) {
                     cell.value = "";
-                else {
-                    switch (h.type) {
-                        case 'date':
-                            cell.value = this.dateExts.getDateConvertion(val).toDate();
-                        case 'number':
-                            cell.value = parseFloat(val.replace(',', '.'));
-                        default:
-                            cell.value = val;
-                    }
+                    continue;
+                }
+                switch (h.type) {
+                    case 'date':
+                        // ExcelJS va di default in UTC quindi rischierebbe di tirare giù 2 ore ad ogni esportazione
+                        // Bisogna aggiungere l'utc offset alla data attuale
+                        let date = this.dateExts.getDateConvertion(val);
+                        if (date) {
+                            let correctedDate = date.add(date.utcOffset(), 'minute');
+                            cell.value = correctedDate.toDate();
+                            cell.numFmt = val.length > 10 ? 'dd/mm/yyyy h:m:s' : '';
+                        }
+                        break;
+                    case 'number':
+                        let converted = parseFloat(val.replace(',', '.'));
+                        cell.value = isNaN(converted) ? "" : converted;
+                        break;
+                    default:
+                        cell.value = val;
+                        break;
                 }
             }
         }
@@ -502,7 +663,9 @@ class ExportHandler {
      */
     setupExport(items) {
         let drcd = this.est.DynamicRowColumnsDefinition;
-        this.est.headers = drcd && drcd.length > 0 ? this.expExts.setupForGenericExport(items, drcd.map(t => { return { label: t.description, key: t.propertyName, order: t.columnOrder, type: 'string' }; })) : this.expExts.setupForExport(items);
+        this.est.headers = drcd && drcd.length > 0 ?
+            this.expExts.setupForGenericExport(items, drcd.map(t => { return { label: t.Description, key: t.PropertyName, propKey: t.PropertyName, order: t.ColumnOrder, type: 'string' }; })) :
+            this.expExts.setupForExport(items, this.est.ExportOnlyVisibleColumns ? this.est.ColumnsList.filter(t => t.visible).map(t => t.id) : null);
         this.est.data = items;
     }
 }
@@ -532,10 +695,11 @@ class EsTableColumn {
      * @param {string} description Descrizione (Header)
      * @param {boolean} visible Indica se di default mostrarla o meno
      * @param {boolean} fixed Indica se è una colonna fixed
+     * @param {boolean} pinnable Indica se una colonna può essere pinnata
      * @param {boolean} pinned Indica se è una colonna pinnata
      * @param {number} pinnedWidth Indica la dimensione da assegnare a questa colonna quando è pinnata
      * @param {TemplateRef<any>} template Indica il template da usare per mostrare il testo dell'Header
-     * @param {{ tmpl: TemplateRef<any>, content: string }[]} parentTemplates Indica la lista di template padri collegata a questo header, rappresentati come Template o come stringa qualora fosse generato automaticamente (caso **Multi**)
+     * @param {{ id: string, tmpl: TemplateRef<any>, content: string }[]} parentTemplates Indica la lista di template padri collegata a questo header, rappresentati come Template o come stringa qualora fosse generato automaticamente (caso **Multi**)
      * @param {boolean} multi Indica che la colonna deriva da una direttiva **Multi**
      * @param {string} multiContent Indica il contenuto della direttiva **Multi** per questa colonna
      */
@@ -604,6 +768,12 @@ class ColumnMetadataHandler {
                     this.est.arrayOrders = [new AppOrdering(id, order)];
             }
         }
+        //Salvo le preferences di questa view
+        //Di default registro ordinamento e visibilità delle colonne nella vista. Solo le cose di UI
+        if (this.est.SavePreferences) {
+            let castedView = this.est.viewMode ? (this.est.MainGroupView || this.est.View) : null;
+            this.registerViewPreferences(castedView);
+        }
         this.est.onOrderChanged.emit({ id, order });
         if (this.est.viewMode) {
             if (this.est.groupSearchRequestsCache.length > 0)
@@ -614,6 +784,30 @@ class ColumnMetadataHandler {
         else if (this.est.arrayMode)
             this.est.internalWriteValue();
     }
+    /**
+     * Registra le preference relative alla view passata come parametro
+     *
+     * @param {any} castedView View di cui salvare colonne e ordinamento colonne
+     */
+    registerViewPreferences(castedView) {
+        if (!this.est.ngControl.name) {
+            console.error("Non posso utilizzare le preference senza avere un 'name' per la tabella");
+            return false;
+        }
+        if (!this.prefService) {
+            console.error("Non posso utilizzare le preference senza che il pacchetto @esfaenza/preferences sia installato");
+            return false;
+        }
+        let columns = this.est.arrayMode ? this.est.arrayColumns : castedView.columns;
+        let columnsOrderings = this.est.arrayMode ? this.est.arrayColumnOrdering : castedView.column_ordering;
+        let columnOrders = this.est.arrayMode ? [] : castedView.orders;
+        var toStore = {
+            columns: this.utiExts.deepClone(columns),
+            column_ordering: this.utiExts.deepClone(columnsOrderings),
+            orders: this.utiExts.deepClone(columnOrders)
+        };
+        this.prefService.setItem(this.est.ngControl.name, toStore).subscribe();
+    }
     /**
      * Partendo dagli **EsThs** estrappolo la lista di **EsTableColumn** che questa tabella dovrà eventualmente gestire per Visibilità e Ordine
      *
@@ -645,6 +839,7 @@ class ColumnMetadataHandler {
         this.est.ColumnsList = [];
         this.est.TMPColumnsList.forEach(c => { this.est.ColumnsList.push(Object.assign({}, c)); });
     }
+    /** In caso siano configurati dei th "Multi" (vedere la descrizione del campo **thMulti** di **EsThDirective**) questo metodo li "srotola" in tutti i th/td che devono effettivamente diventare */
     expandMultiThsAndTds(ths, tds, items) {
         // Registro le info sui multiprovider
         let multiDefs = {};
@@ -696,6 +891,7 @@ class ColumnMetadataHandler {
                         newtH._multi_content = headerValue;
                         newtH.th = `${prop}_${ii}`;
                         newtH.thClass = refth.thClass;
+                        newtH.thShrink = refth.thShrink;
                         newtH.thIf = refth.thIf;
                         newtH.thVisible = refth.thVisible;
                         newtH.thWrap = refth.thWrap;
@@ -753,7 +949,6 @@ class ColumnMetadataHandler {
      * Prende i th e i td in modalità diretive e li ordina in base a se ci sono colonne fixed o meno
      */
     moveFixedColumnsAtTheBeginning(ths, tds) {
-        let thsCache = {};
         let fixeds = 0, pinneds = 0;
         let columnsCache = {};
         let columnsIndexCache = {};
@@ -778,7 +973,6 @@ class ColumnMetadataHandler {
         // Sposto tutti gli header fixed o pinned all'inizio
         for (let i = 0; i < ths.length; i++) {
             let th = ths[i];
-            thsCache[th.th] = th;
             // Riassegno sempre per ripulire valori di partenza o per aggiornarli in caso di modifiche utente
             th.thPinned = (!columnsCache[th.th] && th.thPinned) || (columnsCache[th.th] && columnsCache[th.th].pinned);
             if (th.thPinned) {
@@ -821,6 +1015,7 @@ class ColumnMetadataHandler {
      * dell'allineamento delle informazioni fra le colonne calcolate internamente e le informazioni sulle colonne che arrivano dall'AppSearch
      *
      * @param {AppSearch<any>} view AppSearch da utilizzare per questa operazione
+     * @param {boolean} useLocalVisibility Indica di utilizzare le impostazioni di visibilità locali senza allinearle alla view
      */
     alignColumnsIfLoadedView(view) {
         let emitChanged = this.est.viewMode && view.savedstate;
@@ -838,10 +1033,10 @@ class ColumnMetadataHandler {
             if (c.visible && columns.length == 0)
                 newColset.push(c.id);
             // Se ho una colonna lato AppSearch e nella ColumnList non è visibile, allineo all'AppSearch
-            else if (exCl.length == 1 && !c.visible)
+            else if (exCl.length == 1 && !c.visible && !this.est.useLocalVisibility)
                 c.visible = true;
             // Allineamento sull'AppSearch per casistiche inverse al di sopra
-            else if (exCl.length == 0 && c.visible)
+            else if (exCl.length == 0 && c.visible && !this.est.useLocalVisibility)
                 c.visible = false;
         });
         // Non ho colonne nella appsearch, vuol dire che sono al primo binding
@@ -870,6 +1065,9 @@ class ColumnMetadataHandler {
         // In ogni caso questo non mi serve più, lo resetto  **
         if (this.est.viewMode)
             view.savedstate = false;
+        // Reset di questa variabile usata one-bind
+        if (this.est.useLocalVisibility)
+            this.est.useLocalVisibility = false;
         if (emitChanged)
             this.est.changed();
     }
@@ -973,22 +1171,22 @@ class ColumnMetadataHandler {
     evaluateHeaderGroups(infos) {
         if (infos.groupingLevel == 0)
             return;
-        // Giro 2.5, creo l'output dei raggruppamenti per header in modo da non dovermi preoccupare di celle non inizializzate
+        /****** STEP 1: Creo l'output dei raggruppamenti per header in modo da non dovermi preoccupare di celle non inizializzate ******/
         let expandedGroups = [];
-        let visibleUnpinnedLeafs = infos.leafs.filter((t) => t.thVisible && !t.thPinned);
+        let visibleUnpinnedLeafs = infos.leafs.filter((t) => t.thVisible && t.thIf && !t.thPinned);
         for (let l = 0; l < infos.groupingLevel; l++) {
             expandedGroups.push([]);
             for (let i = 0; i < visibleUnpinnedLeafs.length; i++)
                 expandedGroups[l].push("");
         }
-        // Ordino le foglie in base agli ordinamenti delle colonne
+        /****** STEP 2: Ordino le foglie in base agli ordinamenti delle colonne ******/
         let orderedLeafs = [];
         for (let i = 0; i < this.est.OrderDirectives.length; i++) {
             let leaf = infos.thsCache[this.est.OrderDirectives[i]];
-            if (leaf.thVisible && !leaf.thPinned)
+            if (leaf.thVisible && leaf.thIf && !leaf.thPinned)
                 orderedLeafs.push(leaf);
         }
-        // Terzo giro per creare l'array group con tutti i riferimenti del caso
+        /****** STEP 3: Creo l'array group con tutti i riferimenti del caso ******/
         let currentParent = "";
         for (let i = 0; i < orderedLeafs.length; i++) {
             let refTh = orderedLeafs[i];
@@ -1009,35 +1207,51 @@ class ColumnMetadataHandler {
                 }
             }
         }
-        // Quarto giro per compattarlo nell'elemento finale su cui bindarmi
+        /****** STEP 4: Compatto nell'elemento finale su cui bindarmi. L'ID assegnato è SOLO per ottimizzare gli ngFor ******/
         currentParent = "";
         let currentSpan = 0;
-        this.est.TMPRowThGroups = [];
+        let finalHeaders = [];
         for (let l = 0; l < expandedGroups.length; l++) {
             let levelArray = [];
-            this.est.TMPRowThGroups.push(levelArray);
+            finalHeaders.push(levelArray);
             if (this.est.Selection || this.est.HasPinnedColumns)
-                levelArray.push({ Span: 1, Template: null, Pinned: this.est.HasPinnedColumns });
+                levelArray.push({ ID: "_base_sel_pinned", Span: 1, Template: null, Pinned: this.est.HasPinnedColumns });
             for (let h = 0; h < expandedGroups[l].length; h++) {
                 let item = expandedGroups[l][h];
                 if (item == currentParent)
                     currentSpan++;
                 else {
                     if (currentSpan > 0)
-                        levelArray.push({ Span: currentSpan, Template: currentParent ? infos.thsCache[currentParent].Template : null, Content: currentParent ? infos.thsCache[currentParent]._multi_content : null, Borders: !!currentParent });
+                        levelArray.push({ ID: `${currentParent ? infos.thsCache[currentParent].th : 'noth'}_${currentSpan}`, Span: currentSpan, Template: currentParent ? infos.thsCache[currentParent].Template : null, Content: currentParent ? infos.thsCache[currentParent]._multi_content : null, Borders: !!currentParent });
                     currentSpan = 1;
                     currentParent = item;
                 }
             }
             // Ultima aggiunta che altrimenti mi rimarrebbe in cache
-            levelArray.push({ Span: currentSpan, Template: currentParent ? infos.thsCache[currentParent].Template : null, Content: currentParent ? infos.thsCache[currentParent]._multi_content : null, Borders: !!currentParent });
+            levelArray.push({ ID: `${currentParent ? infos.thsCache[currentParent].th : 'noth'}_${currentSpan}`, Span: currentSpan, Template: currentParent ? infos.thsCache[currentParent].Template : null, Content: currentParent ? infos.thsCache[currentParent]._multi_content : null, Borders: !!currentParent });
+            // Aggiungo i pezzettini per la rimozione e gli export, se presenti
             if (this.est.Removal)
-                levelArray.push({ Span: 1, Template: null });
+                levelArray.push({ ID: "_base_removal", Span: 1, Template: null });
             if (this.est.Export || this.est.HiddenColumns || this.est.ColumnsOrdering || this.est.CornerMenuOptions)
-                levelArray.push({ Span: 1, Template: null });
+                levelArray.push({ ID: "_base_extra_opts", Span: 1, Template: null });
             currentSpan = 0;
             currentParent = "";
         }
+        /****** STEP 5: Secco le righe in cui non c'è nulla ******/
+        this.est.TMPRowThGroups = [];
+        for (let i = 0; i < finalHeaders.length; i++) {
+            let level = finalHeaders[i];
+            let empty = true;
+            for (let j = 0; j < level.length; j++) {
+                let item = level[j];
+                if (item.Template || item.Content) {
+                    empty = false;
+                    break;
+                }
+            }
+            if (!empty)
+                this.est.TMPRowThGroups.push(level);
+        }
     }
     /**
      * Calcola il numero di salti da un header foglia all'ultimo parent della catena
@@ -1055,9 +1269,9 @@ class ColumnMetadataHandler {
             if (parent) {
                 th = thsCache[parent];
                 if (!th.thEmpty && !th._multi_content)
-                    parentsPrepend.unshift({ tmpl: th.Template });
+                    parentsPrepend.unshift({ id: th.th, tmpl: th.Template });
                 else if (!th.thEmpty && th._multi_content)
-                    parentsPrepend.unshift({ content: th._multi_content });
+                    parentsPrepend.unshift({ id: th.th, content: th._multi_content });
                 jumps++;
             }
         } while (parent);
@@ -1118,7 +1332,9 @@ class ColumnMetadataHandler {
                 let newContext = [];
                 this.est.OrderDirectives.forEach(o => {
                     let contextItem = context.filter(t => t.ID == o)[0];
-                    newContext.push(contextItem);
+                    // potrebbe esser undefined nel caso ci fossero colonne sotto thIf
+                    if (contextItem)
+                        newContext.push(contextItem);
                 });
                 this.est.TMPRowTDs[this.est.RowContexts[i]] = newContext;
             }
@@ -1270,20 +1486,8 @@ class ColumnMetadataHandler {
         this.refreshColumnsVisibility(null, null, castedView);
         //Salvo le preferences di questa view
         //Di default registro ordinamento e visibilità delle colonne nella vista. Solo le cose di UI
-        if (this.est.SavePreferences) {
-            if (!this.est.ngControl.name) {
-                console.error("Non posso utilizzare le preference senza avere un 'name' per la tabella");
-                return false;
-            }
-            if (!this.prefService) {
-                console.error("Non posso utilizzare le preference senza che il pacchetto @esfaenza/preferences sia installato");
-                return false;
-            }
-            let columns = this.est.arrayMode ? this.est.arrayColumns : castedView.columns;
-            let columnsOrderings = this.est.arrayMode ? this.est.arrayColumnOrdering : castedView.column_ordering;
-            var toStore = { columns: JSON.parse(JSON.stringify(columns)), column_ordering: JSON.parse(JSON.stringify(columnsOrderings)) };
-            this.prefService.setItem(this.est.ngControl.name, toStore, 'preference').subscribe();
-        }
+        if (this.est.SavePreferences)
+            this.registerViewPreferences(castedView);
         // Rieseguo l'ultima ricerca bindata alla tabella
         // Mi assicuro di farlo dopo l'espansione del changed o rischio che la ricerca mi ridia colonne che in realtà non esistono
         if (this.est.viewMode)
@@ -1330,29 +1534,46 @@ class EsTableColumnsDefinition {
     /**
      * Costruttore
      *
-     * @param {string} description Descrizione della colonna
-     * @param {string} propertyName Nome della proprietà del modello in cui sono contenuti i dati da visualizzare per questa colonna
-     * @param {string} routePath Route di navigazione. Es. "['/pages/mod/mod_detail', { 'idItem': '{0}', 'idItem2' : '{1}' }]"
-     * @param {string[]} routeParameterProperties Proprietà da bindare a **routePath** per generare la route completa.
+     * @param {string} Description Descrizione della colonna
+     * @param {string} PropertyName Nome della proprietà del modello in cui sono contenuti i dati da visualizzare per questa colonna
+     * @param {string} RoutePath Route di navigazione. Es. "['/pages/mod/mod_detail', { 'idItem': '{0}', 'idItem2' : '{1}' }]"
+     * @param {string[]} RouteParameterProperties Proprietà da bindare a **routePath** per generare la route completa.
      * L'indice scritto in **routePath** è l'indice di accesso a questo array. Es. ["iditem", "iditem2"]
-     * @param {'ASC' | 'DESC' } dataOrder Ordinamento dei dati presentati in questa colonna
-     * @param {number} columnOrder Ordinamento di questa colonna
-     * @param {boolean} visible Visibilità o meno della colonna
-     * @param {string} clss Classe da applicare sia ai TD che ai TH relativi a questa colonna
-     * @param {boolean} orderable Indica se la colonna è ordinabile o no (nel senso ASC / DESC / NONE)
-     * @param {boolean} headerWraps Indica se il testo dell'header dev'essere wrappato all'interno del th. Di default no.
+     * @param {'ASC' | 'DESC' } DataOrder Ordinamento dei dati presentati in questa colonna
+     * @param {number} ColumnOrder Ordinamento di questa colonna
+     * @param {boolean} Visible Visibilità o meno della colonna
+     * @param {string} Clss Classe da applicare sia ai TD che ai TH relativi a questa colonna
+     * @param {boolean} Orderable Indica se la colonna è ordinabile o no (nel senso ASC / DESC / NONE)
+     * @param {boolean} HeaderWraps Indica se il testo dell'header dev'essere wrappato all'interno del th. Di default no.
+     * @param {InputType | string} PropertyType Indica il tipo della proprietà identificata da **propertyName**.
+     * @param {{id: string, description: string}[]} PropertySource Sorgente dati su cui autocompletare/scegliere il valore per la proprietà **propertyName**, ha senso solo per **propType** enum o autocomplete.
+     * @param {string} EditorName Nome dell'editor da utilizzare per la modifica di questo campo
+     * @param {string} RendererName Nome del renderer da utilizzare per visualizzare questo campo
      */
-    constructor(description, propertyName, routePath = null, routeParameterProperties = null, dataOrder = null, columnOrder = null, visible = true, clss = null, orderable = true, headerWraps = false) {
-        this.description = description;
-        this.propertyName = propertyName;
-        this.routePath = routePath;
-        this.routeParameterProperties = routeParameterProperties;
-        this.dataOrder = dataOrder;
-        this.columnOrder = columnOrder;
-        this.visible = visible;
-        this.clss = clss;
-        this.orderable = orderable;
-        this.headerWraps = headerWraps;
+    constructor(Description, PropertyName, RoutePath = null, RouteParameterProperties = null, DataOrder = null, ColumnOrder = null, Visible = true, Clss = null, Orderable = true, HeaderWraps = false, PropertyType = null, PropertySource = [], EditorName = "", RendererName = "", EditorOptions = {}, Pinned = false, PinnedWidth = 150, Pinnable = true, Grouping = "", Shrink = false) {
+        this.Description = Description;
+        this.PropertyName = PropertyName;
+        this.RoutePath = RoutePath;
+        this.RouteParameterProperties = RouteParameterProperties;
+        this.DataOrder = DataOrder;
+        this.ColumnOrder = ColumnOrder;
+        this.Visible = Visible;
+        this.Clss = Clss;
+        this.Orderable = Orderable;
+        this.HeaderWraps = HeaderWraps;
+        this.PropertyType = PropertyType;
+        this.PropertySource = PropertySource;
+        this.EditorName = EditorName;
+        this.RendererName = RendererName;
+        this.EditorOptions = EditorOptions;
+        this.Pinned = Pinned;
+        this.PinnedWidth = PinnedWidth;
+        this.Pinnable = Pinnable;
+        this.Grouping = Grouping;
+        this.Shrink = Shrink;
+    }
+    static build(parsObj) {
+        return new EsTableColumnsDefinition(parsObj.Description, parsObj.PropertyName, parsObj.RoutePath, parsObj.RouteParameterProperties, parsObj.DataOrder, parsObj.ColumnOrder, parsObj.Visible || true, parsObj.Clss, parsObj.Orderable || true, parsObj.HeaderWraps, parsObj.PropertyType, parsObj.PropertySource, parsObj.EditorName, parsObj.RendererName, parsObj.Pinned, parsObj.Grouping, parsObj.Shrink);
     }
 }
 
@@ -1362,42 +1583,6 @@ class DynamicModeHandler {
     constructor(est) {
         this.est = est;
     }
-    /**
-     * Metodo di supporto alla creazione di un router link parametrizzato all'oggetto corrente utilizzato nella modalità dinamica
-     *
-     * @param {string} path Path su cui navigare con eventuali parametri riferiti all'oggetto cotnestuale come {0}, {1}, ecc...
-     * @param {string[]} parameterProps Lista posizionale delle proprietà a cui bindare i riferimenti del parametro **path**
-     * Es. Il valore dela proprietà all'indice 0 di questo array verrà sostituita al valore {0} del parametro **path**
-     * @param {GenericItem} item Oggetto generico collegato a questo contesto
-     *
-     * @returns {any} Router link generato in base al parametri
-     */
-    generateRouterLink(path, parameterProps, item) {
-        if (this.est.DynamicTableRouterLinkCache[item._hash + path]) {
-            return this.est.DynamicTableRouterLinkCache[item._hash + path];
-        }
-        else {
-            let link = this.getRouterLink(path, parameterProps, item);
-            this.est.DynamicTableRouterLinkCache[item._hash + path] = link;
-            return link;
-        }
-    }
-    /**
-     * Crea un router link
-     *
-     * @param {string} path Path su cui navigare con eventuali parametri riferiti all'oggetto cotnestuale come {0}, {1}, ecc...
-     * @param {string[]} pars Lista posizionale delle proprietà a cui bindare i riferimenti del parametro **path**
-     * Es. Il valore dela proprietà all'indice 0 di questo array verrà sostituita al valore {0} del parametro **path**
-     * @param {GenericItem} item Oggetto generico collegato a questo contesto
-     *
-     * @returns {any} Router link generato in base al parametri
-     */
-    getRouterLink(path, pars, item) {
-        for (let i = 0; i < pars.length; i++)
-            path = path.replace('{' + i + '}', item.properties[pars[i]]);
-        path = path.replace(/'/g, '"').replace(/ /g, '');
-        return JSON.parse(path);
-    }
     /** Se non ho l'Input **DynamicRowColumnsDefinition** in modalità dinamica lo riempio con il default nome della colonna = testo della colonna */
     eventuallyReviewDynamicColumns() {
         // Senza oggetti esco
@@ -1416,6 +1601,82 @@ class DynamicModeHandler {
         else
             this.est.UserDefinedDynamicCols = true;
     }
+    /** Genera partendo dalle **DynamicRowColumnsDefinition** la lista di **EsThDirective** e **EsTdDirective** che servono per la tabella */
+    emitThsAndTdsBasedOnDynamicDefinition() {
+        // Senza dynamic columns esco
+        if (!this.est.DynamicRowColumnsDefinition || this.est.DynamicRowColumnsDefinition.length == 0)
+            return null;
+        let ths = [];
+        let tds = [];
+        for (let i = 0; i < this.est.DynamicOperations.length; i++) {
+            let op = this.est.DynamicOperations[i];
+            ths.push(this.getThFromOperation(op));
+            tds.push(this.getTdFromOperation(op));
+        }
+        for (let i = 0; i < this.est.DynamicRowColumnsDefinition.length; i++) {
+            let col = this.est.DynamicRowColumnsDefinition[i];
+            ths.push(this.getThFromColumnDef(col));
+            tds.push(this.getTdFromColumnDef(col));
+        }
+        return { ths, tds };
+    }
+    /** @ignore Helper */
+    getThFromOperation(op) {
+        let th = new EsThDirective(null);
+        th.th = op.id;
+        th.thStaticContent = "";
+        return th;
+    }
+    getTdFromOperation(op) {
+        let td = new EsTdDirective(null);
+        td.td = op.id;
+        td.tdIconClass = op.iconClass;
+        td.tdConditionField = op.conditionField;
+        td.tdConditionValue = op.conditionValue;
+        td.tdTitle = op.title;
+        td.tdContent = op.text;
+        return td;
+    }
+    getThFromColumnDef(col) {
+        var ret = new EsThDirective(null);
+        ret.th = col.PropertyName;
+        ret.thPinned = col.Pinned;
+        ret.thPinnable = col.Pinnable;
+        ret.thPinnedWidth = col.PinnedWidth;
+        ret.thVisible = col.Visible;
+        ret.thOrder = col.DataOrder;
+        ret.thOrderable = col.Orderable;
+        ret.thWrap = col.HeaderWraps;
+        ret.thClass = col.Clss;
+        ret.thProperty = col.PropertyName;
+        ret.thType = col.PropertyType;
+        ret.thSource = col.PropertySource;
+        ret.thEditorName = col.EditorName;
+        ret.thEditorOptions = col.EditorOptions;
+        ret.thRendererName = col.RendererName;
+        ret.thRoutePath = col.RoutePath;
+        ret.thRouteParameterProperties = col.RouteParameterProperties;
+        //ret.thFixed = col.Fixed;
+        //ret.thResizable = col.Resizable;
+        //ret.thGroupClass = col.GroupClass;
+        //ret.thGroup = col.Group;
+        //ret.thAggregation = col.Aggregation;
+        //ret.thMulti = col.Multi;
+        //ret.thStaticContent = col.StaticContent;
+        //ret.thBackgroundColor = col.BackgroundColor;
+        //ret.thAlignment = col.Alignment;
+        //ret.thFormat = col.Format;
+        return ret;
+    }
+    /** @ignore Helper */
+    getTdFromColumnDef(col) {
+        var ret = new EsTdDirective(null);
+        ret.td = col.PropertyName;
+        ret.tdClass = col.Clss;
+        //ret.tdAlignment = col.Alignment;
+        //ret.tdFormat = col.Format;
+        return ret;
+    }
 }
 
 /** Classe contenente la gestione della modalità gerarchica */
@@ -1650,17 +1911,25 @@ class ItemsHandler {
             this.est.arrayPulsanti = this.utilities.getPagesArray(6, this.est.arraymodePage, this.est.arraymodePages);
         else
             return this.est.View;
+        // Applico eventuali oridnamenti lato Array prima di tirare fuori la pagina selezionata
+        let items = this.est.View;
+        if (this.est)
+            items = this.arrayModeReviewOrderings(items);
         // Poi per tutti i valori dopo compresi fra la pagina - 1 e la pagina
         for (let i = ((this.est.arraymodePage - 1) * this.est.ArraymodeItemsPerPage); i < this.est.arraymodePage * this.est.ArraymodeItemsPerPage; i++) {
-            if (i <= this.est.View.length - 1)
-                tmpItems.push(this.est.View[i]);
+            if (i <= items.length - 1)
+                tmpItems.push(items[i]);
         }
         return tmpItems;
     }
     /** Se in modalità array applica gli ordinamenti ASC-DESC delle colonne */
-    arrayModeReviewOrderings() {
+    arrayModeReviewOrderings(items) {
+        let tmp = items;
         if (this.est.arrayOrders.length > 0)
-            this.est.arrayOrders.forEach(t => { this.est.boundSource = this.est.boundSource.sort((a, b) => (a[t.id] > b[t.id] ? 1 : -1) * (t.order == 'DESC' ? -1 : 1)); });
+            this.est.arrayOrders.forEach(t => {
+                tmp = tmp.sort((a, b) => (a[t.id] > b[t.id] ? 1 : -1) * (t.order == 'DESC' ? -1 : 1));
+            });
+        return tmp;
     }
 }
 
@@ -1689,6 +1958,15 @@ class ReportModeHandler {
         this.est.View.pages = Math.ceil(count / ipp);
         this.est.arrayPulsanti = this.utilities.getPagesArray(6, this.est.View.page, this.est.View.pages);
     }
+    /**
+     * Data una AppSearch questo metodo genera la lista di th e td che si possono collegare al giro standard.
+     * Se non ci fosse questo passaggio intermedio la gestione della modalità report sarebbe 100% custom,
+     * come poi lo era prima che la facessi passare dal giro che fanno tutte le altre modalità
+     *
+     * @param {AppSearch<any>} view View in modalità report contenente le informazioni sulle colonne
+     *
+     * @returns {{ ths: EsThDirective[], tds: EsTdDirective[] }} Lista di direttive per gli header e per il body
+     */
     generateThsAndTdsFromView(view) {
         var ret = { ths: [], tds: [] };
         // Ordinamento per ora commentato... non vorrebbe mi fuckappasse tutto
@@ -1697,11 +1975,15 @@ class ReportModeHandler {
             let clm = view.report_columns[i];
             var th = new EsThDirective(null);
             th.th = clm.id;
-            th.thStaticContent = clm.description;
+            th.thStaticContent = clm.description || null;
             th.thBackgroundColor = clm.color;
+            th.thAlignment = clm.alignment;
+            th.thFormat = clm.format;
             var td = new EsTdDirective(null);
             td.td = clm.id;
             td.tdPropertyAccessor = i.toString();
+            td.tdAlignment = clm.alignment;
+            td.tdFormat = clm.format;
             ret.ths.push(th);
             ret.tds.push(td);
         }
@@ -1763,8 +2045,9 @@ class GroupPager {
     /**
      * Costruttore
      *
-     * @param {number} groupLevel Livello del gruppo a cui questo separatore fa riferimento
-     * @param {string} parentKey Chiave del gruppo parent se esiste
+     * @param {number} _grouplevel Livello del gruppo a cui questo separatore fa riferimento
+     * @param {string} _thisRoute Route che identifica la gerarchia del gruppo e chi sono i parent
+     * @param {string} _parent Chiave del gruppo parent se esiste
      * @param {AppSearch<any>} view Vista di ricerca collegata a questo elemento
      * @param {'groups' | 'items'} searches Indica che cosa cerca questo separatore, se sottogruppi o oggetti
      */
@@ -2333,6 +2616,120 @@ class SelectionHandler {
             return;
         this.handleSelectionEvaluation(items, selectionItem);
     }
+    /**
+     * Precompila le informazioni sullo stato di selezione tutto a false per le celle della tabella
+     *
+     * @param {any[]} items Oggetti attualmente bindati sulla tabella
+     * @param {EsThDirective[]} ths Colonne su cui gli oggetti sono bindati
+     */
+    evaluateSingleCellSelection(items, ths, dyn) {
+        for (let i = 0; i < items.length; i++) {
+            // items[i]._ordinal dovrebbe essere uguale a "i" ma dato che lato HTML il ciclo è esterno e non ho l'indice per convenzione mi baso sull'_ordinal
+            this.est.selectionStatus[items[i]._ordinal] = {};
+            if (dyn && dyn.length > 0)
+                this.fillSelectionStatusByDynamicColumns(items[i], dyn);
+            else
+                this.fillSelectionStatusByEsThs(items[i], ths);
+        }
+    }
+    /** @ignore */
+    fillSelectionStatusByDynamicColumns(item, dyn) {
+        for (let k = 0; k < dyn.length; k++) {
+            let th = dyn[k];
+            let iper = { selected: false, value: th.PropertyName ? item.properties[th.PropertyName] : "Undefined Property", type: th.PropertyType, property: th.PropertyName, header: th.PropertyName, item: item };
+            this.est.selectionStatus[item._ordinal][k] = iper;
+            // Funzione assegnata dopo in modo da poterle fare anche aggiornare il valore del riferimento all'oggetto di selezione
+            iper.val_setter = (value) => {
+                if (!th.PropertyName) {
+                    item[th.PropertyName] = value;
+                    iper.value = value;
+                    return value;
+                }
+                let valToApply = "";
+                switch (th.PropertyType) {
+                    case "string":
+                        if (value.startsWith && value.startsWith('"') && value.endsWith && value.endsWith('"'))
+                            valToApply = value.substring(1, value.length - 1);
+                        else
+                            valToApply = value;
+                        break;
+                    case "number":
+                    case "int":
+                    case "boolean":
+                    case "enum":
+                    case "autocomplete":
+                    case "float":
+                    case "currency":
+                        valToApply = value;
+                        break;
+                    case "date":
+                    case "datetime":
+                        valToApply = this.est.dateExts.getDateConvertion(value);
+                        break;
+                    case "time":
+                        let mydate = this.est.dateExts.getDateConvertion(value);
+                        valToApply = `${mydate.hour()}:${mydate.minute()}:${mydate.second()}`;
+                        break;
+                    // Per evitare di sbiancare senza senso
+                    default:
+                        valToApply = value;
+                        break;
+                }
+                item.properties[th.PropertyName] = valToApply;
+                iper.value = valToApply;
+                return valToApply;
+            };
+        }
+    }
+    /** @ignore */
+    fillSelectionStatusByEsThs(item, ths) {
+        for (let k = 0; k < ths.length; k++) {
+            let th = ths[k];
+            let iper = { selected: false, value: th.thProperty ? item[th.thProperty] : "Undefined Property", type: th.thType, property: th.thProperty, header: th.th, item: item };
+            this.est.selectionStatus[item._ordinal][k] = iper;
+            // Funzione assegnata dopo in modo da poterle fare anche aggiornare il valore del riferimento all'oggetto di selezione
+            iper.val_setter = (value) => {
+                if (!th.thProperty) {
+                    item[th.thProperty] = value;
+                    iper.value = value;
+                    return value;
+                }
+                let valToApply = "";
+                switch (th.thType) {
+                    case "string":
+                        if (value.startsWith('"') && value.endsWith('"'))
+                            valToApply = value.substring(1, value.length - 1);
+                        else
+                            valToApply = value;
+                        break;
+                    case "number":
+                    case "int":
+                    case "boolean":
+                    case "enum":
+                    case "autocomplete":
+                    case "float":
+                    case "currency":
+                        valToApply = value;
+                        break;
+                    case "date":
+                    case "datetime":
+                        valToApply = this.est.dateExts.getDateConvertion(value);
+                        break;
+                    case "time":
+                        let mydate = this.est.dateExts.getDateConvertion(value);
+                        valToApply = `${mydate.hour()}:${mydate.minute()}:${mydate.second()}`;
+                        break;
+                    // Per evitare di sbiancare senza senso
+                    default:
+                        valToApply = value;
+                        break;
+                }
+                item[th.thProperty] = valToApply;
+                iper.value = valToApply;
+                return valToApply;
+            };
+        }
+    }
     /**
      * Implementazione agnostica della valutazione delle selezioni degli oggetti. Richiede gli oggetti della vista attuale e l'itemSelector
      *
@@ -2809,6 +3206,158 @@ class SelectionHandler {
         // Dopo aver resettato direttamente il solo oggetto this.View.selection devo anche riallineare a tutti gli oggetti bindati
         this.evaluateSelection(this.est.boundSource, selectionItem);
     }
+    /**
+     * @TODO Spostare in SelectionHandler
+     *
+     * Registra la selezione singola su una cella sulla combo di comandi "CTRL + Click".
+     * Se viene premuto anche il tasto Shift viene creato un range di selezione il cui status di "selezionato" viene salvato nella
+     * matrice virtuale **selectionStatus**
+     *
+     * @param {any} event Evento Javascript di Click
+     * @param {number} row Indice della riga. Non è l'indice vero e proprio ma è l'ordinale (.ordinal) dell'oggetto bindato su quella riga
+     * @param {number} column Indice della colonna preso banalmente dall'ngIf sui thElement
+     * @param {{ row: number, column: number }} firstSelectionOverride Permette di overridare il primo elemento selezionato
+     */
+    singleCellSelection(event, row, column, firstSelectionOverride) {
+        // Recupero la selezione precedente se presente come punto di partenza
+        var first = firstSelectionOverride || this.lastSingleSelection;
+        //Il punto di arrivo, che diventerà il prossimo punto di partenza, è la selezione corrente
+        this.lastSingleSelection = { row, column };
+        this.clearTextSelection(event);
+        this.clearSelectionStatusExcluding(this.lastSingleSelection);
+        this.setSelectionStatusBorders(event.range && first ? first : this.lastSingleSelection, this.lastSingleSelection);
+        // Ora che non è attaccato direttamente all'html devo fare un markforcheck finite le operazioni sui grouping
+        this.est.cdr.markForCheck();
+    }
+    setSelectionStatusBorders(from, to) {
+        let rowAddition = to.row < from.row ? -1 : +1;
+        let columnAddition = to.column < from.column ? -1 : +1;
+        let singleItem = from == to;
+        for (let ir = from.row; ir != to.row + rowAddition; ir += rowAddition) {
+            let firstRow = ir == from.row;
+            let lastRow = ir == to.row;
+            for (let ic = from.column; ic != to.column + columnAddition; ic += columnAddition) {
+                let firstCol = ic == from.column;
+                let lastCol = ic == to.column;
+                let current = this.est.selectionStatus[ir][ic];
+                let prevColumn = ic > 0 ? this.est.selectionStatus[ir][ic - 1] : null;
+                let nextcolumn = this.est.selectionStatus[ir][ic + 1];
+                let prevRow = ir > 0 ? this.est.selectionStatus[ir - 1][ic] : null;
+                let nextRow = this.est.selectionStatus[ir + 1] ? this.est.selectionStatus[ir + 1][ic] : null;
+                current.selected = singleItem ? !current.selected : true;
+                current.lborder = !current.selected ? false : columnAddition > 0 ? firstCol : lastCol;
+                current.tborder = !current.selected ? false : rowAddition > 0 ? firstRow : lastRow;
+                current.rborder = !current.selected ? false : columnAddition > 0 ? lastCol : firstCol;
+                current.bborder = !current.selected ? false : rowAddition > 0 ? lastRow : firstRow;
+                if (prevRow)
+                    prevRow.boverlaps = current.tborder;
+                if (nextRow)
+                    nextRow.toverlaps = current.bborder;
+                if (prevColumn)
+                    prevColumn.roverlaps = current.lborder;
+                if (nextcolumn)
+                    nextcolumn.loverlaps = current.rborder;
+            }
+        }
+    }
+    /**
+     * Helper per ripulire lo stato di selezione delle singole celle della tabella, ad esclusione di una singola coordinata
+     *
+     * @param {{row: number, column: number}} exclusion Coordinata da escludere nella pulizia
+     */
+    clearSelectionStatusExcluding(exclusion) {
+        for (let row in this.est.selectionStatus) {
+            for (let column in this.est.selectionStatus[row]) {
+                // Se è l'elemento che ho escluso dal cleanup, skippo
+                if (exclusion && row == exclusion.row.toString() && column == exclusion.column.toString())
+                    continue;
+                // Altrimenti pulisco
+                let curr = this.est.selectionStatus[row][column];
+                curr.selected = curr.lborder = curr.rborder = curr.tborder = curr.bborder = curr.loverlaps = curr.roverlaps = curr.toverlaps = curr.boverlaps = false;
+            }
+        }
+    }
+    /**
+     * Helper che esamina la matrice **selectionStatus** e ne estrappola gli elementi selezionati in una comoda matrice
+     *
+     * @returns {{ value: string, type: InputType, val_setter: Function }[][]} Matrice di elementi selezionati con la loro informazione sul tipo
+     */
+    getSelectionStatusSelection() {
+        let selection = [];
+        for (let row in this.est.selectionStatus) {
+            let rowValues = [];
+            for (let column in this.est.selectionStatus[row]) {
+                let ssItem = this.est.selectionStatus[row][column];
+                if (ssItem.selected)
+                    rowValues.push(ssItem);
+            }
+            if (rowValues.length > 0)
+                selection.push(rowValues);
+        }
+        return selection;
+    }
+    /**
+     * Helper per ripulire la selezione lato HTML
+     *
+     * @param {any} event Evento nativo Javascript
+     */
+    clearTextSelection(event) {
+        // Seleziono del testo ma non ho shift premuto -> ignoro la selezione
+        if ((event.view.getSelection().type == 'Range' || event.view.getSelection().toString().length > 0) && !event.range)
+            return false;
+        // Seleziono del testo e ho shift premuto -> annullo la selezione del testo
+        if ((event.view.getSelection().type == 'Range' || event.view.getSelection().toString().length > 0) && event.range)
+            this.est.utiExts.clearTextSelection();
+    }
+    /**
+     * Data la matrice di selezione generata dal metodo **getSelectionStatusSelection** genera la strigna vera e propria da copiare nella Clipboard
+     *
+     * @param {{ value: string, type: InputType }[][]} sel Matrice di selezione con valori e tipi dei dati selezionati
+     *
+     * @returns {string} Stringa da copiare nella clipboard, le stringhe vengono wrappate fra doppi apici e fra un valore e l'altro viene messo un tab
+     * in modo che siano compatibili anche con la copia su Excel
+     */
+    getClipbardTextFromSelection(sel) {
+        var ret = "";
+        for (let r = 0; r < sel.length; r++) {
+            let row = sel[r];
+            if (r > 0)
+                ret += "\n";
+            for (let c = 0; c < row.length; c++) {
+                let col = row[c];
+                ret += this.getValueByType(col) + (c < row.length - 1 ? "\t" : "");
+            }
+        }
+        return ret;
+    }
+    /**
+     * Ottiene la rappresentazione stringa di un valore dato un tipo
+     *
+     * @param {{ value: string, type: InputType }} valType Oggetto Valore - Tipo da cui estrapolare la rappresentazione del dato in stringa
+     *
+     * @returns {string} Valore convertito in stringa in base al tipo
+     */
+    getValueByType(valType) {
+        switch (valType.type) {
+            case 'string':
+                return '"' + valType.value + '"';
+            case 'number':
+            case 'int':
+            case 'boolean':
+            case 'enum':
+            case 'autocomplete':
+                return valType.value;
+            case 'float':
+            case 'currency':
+                return parseFloat(valType.value).toLocaleString(this.est.locale);
+            case 'date':
+                return dayjs(valType.value).format(this.est.lc.token("getSmallDateDisplayFormat"));
+            case 'datetime':
+                return dayjs(valType.value).format(this.est.lc.token("getFullDateDisplayFormat"));
+            case 'time':
+                return dayjs(valType.value).format("HH:mm:ss");
+        }
+    }
 }
 
 // Angular
@@ -2903,10 +3452,7 @@ class UtilitiesHandler {
             for (let i = min; i <= max; i++)
                 if (i !== 1)
                     result.push({ val: i, cssClass: (i === page ? 'btn-main app-white-text' : 'app-white-button') });
-            result.push({
-                val: lastPage,
-                cssClass: (lastPage === page ? 'btn-main app-white-text' : 'app-white-button')
-            });
+            result.push({ val: lastPage, cssClass: (lastPage === page ? 'btn-main app-white-text' : 'app-white-button') });
         }
         return result;
     }
@@ -2927,9 +3473,11 @@ class UtilitiesHandler {
             delete tmp._selected;
             delete tmp._visible;
             delete tmp._hash;
+            delete tmp._ordinal;
             let hash = this.hashExts.hashObject(tmp);
             usedHashesCache[hash] = usedHashesCache[hash] ? usedHashesCache[hash] + 1 : 1;
             item._hash = hash + (usedHashesCache[hash] > 1 ? "_" + usedHashesCache[hash] : "");
+            item._ordinal = i;
         }
     }
     /**
@@ -2953,13 +3501,61 @@ class UtilitiesHandler {
         return null;
     }
 }
-UtilitiesHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: UtilitiesHandler, deps: [{ token: i5.HashingService }], target: i0.ɵɵFactoryTarget.Injectable });
-UtilitiesHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: UtilitiesHandler, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: UtilitiesHandler, decorators: [{
+UtilitiesHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: UtilitiesHandler, deps: [{ token: i5.HashingService }], target: i0.ɵɵFactoryTarget.Injectable });
+UtilitiesHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: UtilitiesHandler, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: UtilitiesHandler, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return [{ type: i5.HashingService }]; } });
 
+/** Classe che fornisce dei metodi di estensione in grado di riconoscere e dispatchare l'evento copia e incolla lanciato su una pagina web */
+class CopyPasteDetector {
+    /** @ignore */
+    constructor() {
+        /** Dispatcher del Copia */
+        this.OnCopy = new Subject();
+        /** Dispatcher dell' Incolla */
+        this.OnPaste = new Subject();
+        /** Riferimento all'estable attiva per evitare di spammare copia incolla dove non servono */
+        this.ActiveEstReference = null;
+        document.addEventListener("keydown", (event) => {
+            if (event.key === "c" && event.ctrlKey)
+                this.OnCopy.next();
+            if (event.key === "v" && event.ctrlKey)
+                this.OnPaste.next();
+        });
+    }
+}
+CopyPasteDetector.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CopyPasteDetector, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+CopyPasteDetector.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CopyPasteDetector, providedIn: "root" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CopyPasteDetector, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }], ctorParameters: function () { return []; } });
+
+/** Classe che fornisce dei metodi di estensione in grado di riconoscere e dispatchare l'evento copia e incolla lanciato su una pagina web */
+class Logger {
+    /** @ignore */
+    constructor(debugMode) {
+        this.debugMode = debugMode;
+    }
+    log(text) {
+        if (this.debugMode)
+            console.log("[@esfaenza/es-table @ " + (new Date()).toISOString() + "] " + text);
+    }
+}
+Logger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: Logger, deps: [{ token: EST_DEBUG, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+Logger.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: Logger, providedIn: "root" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: Logger, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [EST_DEBUG]
+                }] }]; } });
+
 //Angular
 /** Componente rappresentante una Colonna della tabella */
 class EsTh {
@@ -3088,11 +3684,11 @@ class EsTh {
         $event.preventDefault();
     }
 }
-EsTh.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTh, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-EsTh.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: EsTh, selector: "[es-th]", inputs: { ID: ["es-th", "ID"], Order: "Order", Orderable: "Orderable", Display: "Display", Resizable: "Resizable", Pinned: "Pinned", SearchInProgress: "SearchInProgress", OrderBy: "OrderBy", Wrap: "Wrap", Fixed: "Fixed", Template: "Template", Visible: "Visible" }, outputs: { onOrderChange: "onOrderChange", onUnpinning: "onUnpinning" }, host: { listeners: { "window:mouseup.out-zone": "onMouseUp()", "window:mousemove.out-zone": "onMouseMove($event)" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<span (click)=\"setupNextOrderAndNotify()\" [class.app-no-selection]=\"!!ID && Orderable\" [class.app-pointer]=\"!!ID && Orderable\">\r\n    <span #content>\r\n        <ng-container *ngIf=\"Template\">\r\n            <ng-container *ngTemplateOutlet=\"Template\"></ng-container>\r\n        </ng-container>\r\n        <ng-content *ngIf=\"!Template\"></ng-content>\r\n    </span>&nbsp;\r\n    <span class=\"fa\" [class.fa-chevron-down]=\"Order == 'DESC'\" [class.fa-chevron-up]=\"Order == 'ASC'\"></span>\r\n</span>\r\n<span *ngIf=\"Pinned && !Fixed\" class=\"app-pointer fa fa-thumb-tack est-quick-unpin\" (click)=\"unpin()\"></span>\r\n<div [hidden]=\"!Resizable || Fixed || Pinned\" class=\"est-head-resizer\" (mousedown)=\"onResizeStart($event)\">\r\n    <div class=\"est-head-resizer-internal\"></div>\r\n</div>", directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTh, decorators: [{
+EsTh.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTh, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+EsTh.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: EsTh, selector: "[es-th]", inputs: { ID: ["es-th", "ID"], Order: "Order", Orderable: "Orderable", Display: "Display", Resizable: "Resizable", Pinned: "Pinned", SearchInProgress: "SearchInProgress", OrderBy: "OrderBy", Wrap: "Wrap", Fixed: "Fixed", Template: "Template", Visible: "Visible" }, outputs: { onOrderChange: "onOrderChange", onUnpinning: "onUnpinning" }, host: { listeners: { "window:mouseup.out-zone": "onMouseUp()", "window:mousemove.out-zone": "onMouseMove($event)" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: "<span (click)=\"setupNextOrderAndNotify()\" [class.app-no-selection]=\"!!ID && Orderable\" [class.app-pointer]=\"!!ID && Orderable\">\r\n    <span #content>\r\n        <ng-container *ngIf=\"!!Template\">\r\n            <ng-container *ngTemplateOutlet=\"Template\"></ng-container>\r\n        </ng-container>\r\n        <ng-content *ngIf=\"!Template\"></ng-content>\r\n    </span>&nbsp;\r\n    <span class=\"fa\" [class.fa-chevron-down]=\"Order == 'DESC'\" [class.fa-chevron-up]=\"Order == 'ASC'\"></span>\r\n</span>\r\n<span *ngIf=\"Pinned && !Fixed\" class=\"app-pointer fa fa-thumb-tack est-quick-unpin\" (click)=\"unpin()\"></span>\r\n<div [hidden]=\"!Resizable || Fixed || Pinned\" class=\"est-head-resizer\" (mousedown)=\"onResizeStart($event)\">\r\n    <div class=\"est-head-resizer-internal\"></div>\r\n</div>", directives: [{ type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTh, decorators: [{
             type: Component,
-            args: [{ selector: "[es-th]", changeDetection: ChangeDetectionStrategy.OnPush, template: "<span (click)=\"setupNextOrderAndNotify()\" [class.app-no-selection]=\"!!ID && Orderable\" [class.app-pointer]=\"!!ID && Orderable\">\r\n    <span #content>\r\n        <ng-container *ngIf=\"Template\">\r\n            <ng-container *ngTemplateOutlet=\"Template\"></ng-container>\r\n        </ng-container>\r\n        <ng-content *ngIf=\"!Template\"></ng-content>\r\n    </span>&nbsp;\r\n    <span class=\"fa\" [class.fa-chevron-down]=\"Order == 'DESC'\" [class.fa-chevron-up]=\"Order == 'ASC'\"></span>\r\n</span>\r\n<span *ngIf=\"Pinned && !Fixed\" class=\"app-pointer fa fa-thumb-tack est-quick-unpin\" (click)=\"unpin()\"></span>\r\n<div [hidden]=\"!Resizable || Fixed || Pinned\" class=\"est-head-resizer\" (mousedown)=\"onResizeStart($event)\">\r\n    <div class=\"est-head-resizer-internal\"></div>\r\n</div>" }]
+            args: [{ selector: "[es-th]", changeDetection: ChangeDetectionStrategy.OnPush, template: "<span (click)=\"setupNextOrderAndNotify()\" [class.app-no-selection]=\"!!ID && Orderable\" [class.app-pointer]=\"!!ID && Orderable\">\r\n    <span #content>\r\n        <ng-container *ngIf=\"!!Template\">\r\n            <ng-container *ngTemplateOutlet=\"Template\"></ng-container>\r\n        </ng-container>\r\n        <ng-content *ngIf=\"!Template\"></ng-content>\r\n    </span>&nbsp;\r\n    <span class=\"fa\" [class.fa-chevron-down]=\"Order == 'DESC'\" [class.fa-chevron-up]=\"Order == 'ASC'\"></span>\r\n</span>\r\n<span *ngIf=\"Pinned && !Fixed\" class=\"app-pointer fa fa-thumb-tack est-quick-unpin\" (click)=\"unpin()\"></span>\r\n<div [hidden]=\"!Resizable || Fixed || Pinned\" class=\"est-head-resizer\" (mousedown)=\"onResizeStart($event)\">\r\n    <div class=\"est-head-resizer-internal\"></div>\r\n</div>" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { ID: [{
                 type: Input,
                 args: ['es-th']
@@ -3133,75 +3729,206 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 args: ['window:mousemove.out-zone', ['$event']]
             }] } });
 
-//Angular
+// Angular
 /** Componente rappresentante una singola cella del body della tabella */
 class EsTd {
     /** @ignore */
-    constructor(myself, renderer, _viewContainer, sanitizer) {
-        this.myself = myself;
-        this.renderer = renderer;
-        this._viewContainer = _viewContainer;
-        this.sanitizer = sanitizer;
+    constructor(cdr) {
+        this.cdr = cdr;
         /** Id della cella, dev'essere lo stesso della colonna **EsTh** relativa */
         this.ID = "";
-        /** Valore da mostrare all'interno della cella. Se omesso verrà proiettato il contenuto dal template in cui è stata usata */
-        this.Display = null;
-        /** Template Angular da istanziare per questo TD */
-        this.Template = null;
-    }
-    /**
-     * Imposta la visibilità o meno della cella, si traduce nell'applicazione o rimozione della classe **app-display-none**
-     *
-     * @param {boolean} expression Indicazione della visibilità
-     */
-    set Visible(expression) {
-        this._Visible = expression;
-        if (expression)
-            this.renderer.removeClass(this.myself.nativeElement, "app-display-none");
-        else
-            this.renderer.addClass(this.myself.nativeElement, "app-display-none");
-    }
-    /**
-     * Restituisce lo stato di Visibilità della cella in oggetto
-     *
-     * @returns {boolean} **true** se visibile, **false** altrimenti
-     */
-    get Visible() {
-        if (this._Visible == undefined)
-            this._Visible = true;
-        return this._Visible;
+        /** Quando questa cella viene generata questo evento permette di dire "ehi, sono nato!"  */
+        this.onCellGeneration = new EventEmitter();
+        /** Errore attualmente presente sulla cella */
+        this.ValidationError = "";
     }
     /** @ignore */
     ngAfterViewInit() {
-        // Se è Internal significa che è gestita internamente da ES-TABLE quindi evito di fare sti due passaggi di lettura del DOM
-        if (this.Internal)
-            return;
-        this.Content = this.Display === null || this.Display === "" ? this.sanitizer.bypassSecurityTrustHtml(this.myself.nativeElement.innerHTML) : this.sanitizer.bypassSecurityTrustHtml(this.Display);
-        this.Class = this.myself.nativeElement.className.replace("app-display-none", "");
+        this.onCellGeneration.emit({ id: this.ID, hash: this.Context, self: this });
+    }
+    /** Api per impostare un "errore" su questa cella in maniera programmatica */
+    validationError(error) {
+        this.ValidationError = error;
+        this.cdr.markForCheck();
     }
 }
-EsTd.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTd, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-EsTd.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: EsTd, selector: "[es-td]", inputs: { ID: ["es-td", "ID"], Internal: "Internal", RouterLink: "RouterLink", Display: "Display", Template: "Template", Context: "Context", Visible: "Visible" }, ngImport: i0, template: "<span>\r\n    <ng-content></ng-content>\r\n</span>", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTd, decorators: [{
+EsTd.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTd, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+EsTd.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: EsTd, selector: "[es-td]", inputs: { ID: ["es-td", "ID"], Context: "Context" }, outputs: { onCellGeneration: "onCellGeneration" }, ngImport: i0, template: "<div class=\"td-content\" [class.td-error]=\"!!ValidationError\" [matTooltip]=\"ValidationError\">\r\n    <ng-content></ng-content>\r\n</div>", styles: [".td-error{background-color:#f003;box-shadow:inset 0 0 0 1px red}.td-content{padding:.3rem;margin:-.3rem;box-sizing:border-box!important}\n"], directives: [{ type: i1$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTd, decorators: [{
             type: Component,
-            args: [{ selector: "[es-td]", changeDetection: ChangeDetectionStrategy.OnPush, template: "<span>\r\n    <ng-content></ng-content>\r\n</span>" }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i1$1.DomSanitizer }]; }, propDecorators: { ID: [{
+            args: [{ selector: "[es-td]", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"td-content\" [class.td-error]=\"!!ValidationError\" [matTooltip]=\"ValidationError\">\r\n    <ng-content></ng-content>\r\n</div>", styles: [".td-error{background-color:#f003;box-shadow:inset 0 0 0 1px red}.td-content{padding:.3rem;margin:-.3rem;box-sizing:border-box!important}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { ID: [{
                 type: Input,
                 args: ['es-td']
-            }], Internal: [{
-                type: Input
-            }], RouterLink: [{
-                type: Input
-            }], Display: [{
-                type: Input
-            }], Template: [{
-                type: Input
             }], Context: [{
                 type: Input
-            }], Visible: [{
-                type: Input
+            }], onCellGeneration: [{
+                type: Output
             }] } });
 
+// Angular
+class EstLookupPipe {
+    transform(value, source) {
+        for (let i = 0; i < source.length; i++) {
+            if (source[i].id == value)
+                return source[i];
+        }
+        return { id: "", description: "" };
+    }
+}
+EstLookupPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstLookupPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+EstLookupPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstLookupPipe, name: "est_lookup" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstLookupPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'est_lookup' }]
+        }] });
+
+class EstRouterLinkPipe {
+    constructor() {
+        /** Cache per i routerLink generati nelle tabelle dinamiche */
+        this.routerLinksCache = {};
+    }
+    transform(item, path, parameters) {
+        if (this.routerLinksCache[item._hash + path]) {
+            return this.routerLinksCache[item._hash + path];
+        }
+        else {
+            let link = this.getRouterLink(path, parameters, item);
+            this.routerLinksCache[item._hash + path] = link;
+            return link;
+        }
+    }
+    /**
+     * Crea un router link
+     *
+     * @param {string} path Path su cui navigare con eventuali parametri riferiti all'oggetto cotnestuale come {0}, {1}, ecc...
+     * @param {string[]} pars Lista posizionale delle proprietà a cui bindare i riferimenti del parametro **path**
+     * Es. Il valore dela proprietà all'indice 0 di questo array verrà sostituita al valore {0} del parametro **path**
+     * @param {any} item Oggetto collegato a questo contesto. Può essere un oggetto generico (con "properties") o un oggetto ben definito
+     *
+     * @returns {any} Router link generato in base al parametri
+     */
+    getRouterLink(path, pars, item) {
+        for (let i = 0; i < pars.length; i++)
+            path = path.replace('{' + i + '}', item.properties ? item.properties[pars[i]] : item[pars[i]]);
+        path = path.replace(/'/g, '"').replace(/ /g, '');
+        return JSON.parse(path);
+    }
+}
+EstRouterLinkPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstRouterLinkPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+EstRouterLinkPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstRouterLinkPipe, name: "est_routerlink" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstRouterLinkPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'est_routerlink' }]
+        }] });
+
+// Angular
+class EstFormatPipe {
+    constructor(dates) {
+        this.dates = dates;
+    }
+    transform(value, format) {
+        if (!format) {
+            // Se è un formato data mi assicuro di non stampare mai una data 00:00:00 altrimenti in esportazione viene uno schifo
+            return value ? this.dates.trimSeconds(value.toString()) : "";
+        }
+        else {
+            // Caso formato numerico
+            if (format.startsWith("F")) {
+                if (!value)
+                    return "";
+                if (format.length != 2)
+                    return value.toString().replace(/,/, "").replace(".", ",");
+                else {
+                    let tmp = parseFloat(value);
+                    let cifre = parseInt(format[1]);
+                    if (isNaN(tmp) || isNaN(cifre))
+                        return "";
+                    return (Math.trunc(tmp * Math.pow(10, cifre)) / Math.pow(10, cifre)).toString();
+                }
+            }
+            else {
+                // Se ho un formato data trasformo in dayjs, formatto ed esporto
+                // Per la trasformazione in dayjs provo prima a passargli la stringa di netto, sperando la riconosca
+                // Se non funziona provo a definirgli la formattazione standard del metering per quel linguaggio
+                return this.dates.getFormatted(value, format.length <= 10, format.length > 16);
+            }
+        }
+    }
+}
+EstFormatPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstFormatPipe, deps: [{ token: i5.DateService }], target: i0.ɵɵFactoryTarget.Pipe });
+EstFormatPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstFormatPipe, name: "est_format" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstFormatPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'est_format' }]
+        }], ctorParameters: function () { return [{ type: i5.DateService }]; } });
+
+// Angular
+class EstRendererPipe {
+    constructor(logger) {
+        this.logger = logger;
+    }
+    transform(propName, params) {
+        var EsTd = null;
+        // Perf. Version di `params.src.find((item) => params.name ? item.td === params.name : item.tdForProperty === propName);`
+        for (let i = 0; i < params.src.length; i++) {
+            let item = params.src.get(i);
+            if (params.name && item.td === params.name ||
+                !params.name && item.tdForProperty === propName) {
+                EsTd = item;
+                break;
+            }
+        }
+        // Name non trovato, fallback al nome della colonna
+        if (propName && params.name && !EsTd) {
+            this.logger.log(`Renderer retrieved in a non performant way`);
+            EsTd = params.src.find((item) => item.tdForProperty === propName);
+        }
+        this.logger.log(`Renderer ${EsTd ? 'found' : 'NOT found'} for '${propName}${params.name ? '/' + params.name : ''}'${!EsTd ? '. Using fallback renderer' : ''}`);
+        var ret = EsTd ? EsTd.Template : params.fallback;
+        return ret;
+    }
+}
+EstRendererPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstRendererPipe, deps: [{ token: Logger }], target: i0.ɵɵFactoryTarget.Pipe });
+EstRendererPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstRendererPipe, name: "est_renderer" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstRendererPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'est_renderer' }]
+        }], ctorParameters: function () { return [{ type: Logger }]; } });
+
+// Angular
+class EstEditorPipe {
+    constructor(logger) {
+        this.logger = logger;
+    }
+    transform(propName, params) {
+        var Editor = null;
+        // Perf. Version di `params.src.find((item) => params.name ? item.editor === params.name : item.editorForProperty === propName);`
+        for (let i = 0; i < params.src.length; i++) {
+            let item = params.src.get(i);
+            if (params.name && item.editor === params.name ||
+                !params.name && item.editorForProperty === propName) {
+                Editor = item;
+                break;
+            }
+        }
+        // Name non trovato, fallback al nome della colonna
+        if (propName && params.name && !Editor) {
+            this.logger.log(`Editor retrieved in a non performant way`);
+            Editor = params.src.find((item) => item.editorForProperty === propName);
+        }
+        this.logger.log(`Editor ${Editor ? 'found' : 'NOT found'} for '${propName}${params.name ? '/' + params.name : ''}'${!Editor ? '. Using fallback editor' : ''}`);
+        var ret = Editor ? Editor.Template : params.fallback;
+        return ret;
+    }
+}
+EstEditorPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstEditorPipe, deps: [{ token: Logger }], target: i0.ɵɵFactoryTarget.Pipe });
+EstEditorPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstEditorPipe, name: "est_editor" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EstEditorPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'est_editor' }]
+        }], ctorParameters: function () { return [{ type: Logger }]; } });
+
 /** Raccolta di tutti gli Input dell'EsTable a cui può essere logicamente sensato assegnare default per progetto */
 class EsTableDefaultable {
 }
@@ -3210,7 +3937,7 @@ class EsTableDefaultable {
 /** Componente che permette di rappresentare una griglia di valori */
 class EsTableComponent {
     /** @ignore */
-    constructor(ngControl, prefService, deafults, locale, lc, cdr, utilities_H, utiExts, expExts, dateExts, msgExts) {
+    constructor(ngControl, prefService, deafults, locale, lc, cdr, utilities_H, utiExts, expExts, dateExts, msgExts, copyPasteDetector, clipboardService, logger) {
         this.ngControl = ngControl;
         this.prefService = prefService;
         this.deafults = deafults;
@@ -3222,11 +3949,14 @@ class EsTableComponent {
         this.expExts = expExts;
         this.dateExts = dateExts;
         this.msgExts = msgExts;
+        this.copyPasteDetector = copyPasteDetector;
+        this.clipboardService = clipboardService;
+        this.logger = logger;
         /** Subject utilizzato internamente lato EsTable per causare il Focus lato componente di Input */
         this.FocusSubject = new Subject();
         /** Se vengono effettuati 2 click a distanza inferiore a questi Millisecondi viene considerato un doppio click */
         this.doubleClickBufferMs = 200;
-        /** View finale su cui bindarsi lato Frontend, il tipo può essere IAppSearch<any> (per la **viewMode**), any[] (per l'**arrayMode**) e ReportDefinition per la **reportMode** */
+        /** View finale su cui bindarsi lato Frontend, il tipo può essere IAppSearch<any> (per la **viewMode**), any[] (per l'**arrayMode**) */
         this.View = null;
         /** Indica se l'es-table deve mostrare il check globale nell'header per fare il "seleziona tutto" */
         this.globalCheck = false;
@@ -3247,9 +3977,9 @@ class EsTableComponent {
         this.boundSource = [];
         /** Stessa cosa della **boundSource**, utilizzata come appoggio temporaneo interno */
         this.TMPBoundSource = [];
-        /** "Fetta" di oggetti utilizzata nell'endless scroll, ogni elemento di questo array è un blocchetto di 100 elementi */
+        /** @deprecated "Fetta" di oggetti utilizzata nell'endless scroll, ogni elemento di questo array è un blocchetto di 100 elementi */
         this.boundSubSources = [];
-        /** Questa funge da indicatore per gli slice inseriti, la lunghezza dovrebbe essere corrispondente a **boundSubSources** */
+        /** @deprecated Questa funge da indicatore per gli slice inseriti, la lunghezza dovrebbe essere corrispondente a **boundSubSources** */
         this.addedSlices = [];
         /** Variabile che identifica il valore del "seleziona Tutto" nella paginazione */
         this.defaultAllPageOverride = 999999;
@@ -3259,20 +3989,20 @@ class EsTableComponent {
         this.seconds = '10';
         /** Impostata a true ogni volta che viene avviata una ricerca, e a false ogni volta che un nuovo valore viene ricevuto */
         this.researchInProgress = false;
-        /** Modello rappresentante un dizionario di righe della tabella, con chiave l'hash e valore la lista di celle */
-        this.RowTDs = null;
         /** Modello di appoggio temporaneo per i **RowTDs** */
         this.TMPRowTDs = null;
-        /** Modello rappresentante un singolo th della tabella, generato in base alle configurazioni e agli oggetti ricevuti */
-        this.RowTHs = null;
+        /** Modello rappresentante un dizionario di righe della tabella, con chiave l'hash e valore la lista di celle */
+        this.RowTDs = null;
+        /** Indica se **RowTDs** è un oggetto vuoto o meno */
+        this.EmptyRowTds = true;
         /** Modello di appoggio temporaneo per i **RowTHs** */
         this.TMPRowTHs = null;
+        /** Modello rappresentante un singolo th della tabella, generato in base alle configurazioni e agli oggetti ricevuti */
+        this.RowTHs = null;
         /** Modello di appoggio temporaneo per i **RowThGroups** */
         this.TMPRowThGroups = null;
         /** Modello rappresentante un singolo header group della tabella. Questa lista è già ordinata e pronta per essere utilizzata in ngFor */
         this.RowThGroups = null;
-        /** Cache per i routerLink generati nelle tabelle dinamiche */
-        this.DynamicTableRouterLinkCache = {};
         /**
          * Lista dei contesti. Un contesto non è altro che un hash particolare calcolato su un oggetto che identifica univocamente tale oggetto.
          *
@@ -3283,6 +4013,19 @@ class EsTableComponent {
         this.OrderDirectives = [];
         /** Codice dell'ultimo oggetto solezionato */
         this.lastSelectedItemID = null;
+        /**
+         * Decide se utilizzare o meno le CustomCells. Impostandolo a **true** l'es-table diventa in grado di gestire nativamente:
+         *
+         * 1) Ordinamento e visibilità delle colonne
+         *
+         * 2) Ordinamento dei dati
+         *
+         * 3) Modalità Gerarchica
+         *
+         * ecc...
+         * viene dedotto dal sistema in automatico
+         */
+        this.UseCustomCells = null;
         /**
          * Indica se oltre alle colonne dinamiche specifiche di un tipo di oggetto ci sono anche colonne dinamiche aggiunte dall'utente
          *
@@ -3305,18 +4048,12 @@ class EsTableComponent {
         this.ColumnsPinnable = null;
         /** Indica se dev'essere disponibile il sistema di aggiornamento automatico */
         this.AutoUpdate = null;
-        /**
-         * Decide se utilizzare o meno le CustomCells. Impostandolo a **true** l'es-table diventa in grado di gestire nativamente:
-         *
-         * 1) Ordinamento e visibilità delle colonne
-         *
-         * 2) Ordinamento dei dati
-         *
-         * 3) Modalità Gerarchica
-         *
-         * ecc...
-         */
-        this.UseCustomCells = null;
+        /** Indica l'altezza cablata che deve assumere la tabella. Es: "100px" | "100%" ...  */
+        this.Height = null;
+        /** Indica il colore di sfondo dello spazio vuoto (non ricoperto da dati). Particolarmente utile da impostare in caso di **Height** diverso da null  */
+        this.EmptySpaceBackgroundColor = null;
+        /** Indica se dev'essere l'estable a gestire la ricerca, anche la prima.  **/
+        this.EsTableHandledSearch = false;
         /** Permette di impostare l'altezza massima della tabella. Se null la dimensione si adatta al numero di elementi attualmente in visualizzazione */
         this.MaxHeight = null;
         /** Classi da applicare al contenitore della tabella */
@@ -3359,9 +4096,11 @@ class EsTableComponent {
         this.ExportFileName = 'Export.csv';
         /** Classe (HTML) di default della tabella */
         this.TableClass = null;
-        /** Indica la presenza di raggruppamenti a livello di header */
+        /** Indica di esportare solo le colonne attualmente visibili della view */
+        this.ExportOnlyVisibleColumns = false;
+        /** @deprecated Indica la presenza di raggruppamenti a livello di header */
         this.HasHeaderGroup = null;
-        /** Indica la presenza di raggruppamenti a livello del raggruppamento precedentemente esistente, chiaramente è insensata senza **HasHeaderGroup** */
+        /** @deprecated Indica la presenza di raggruppamenti a livello del raggruppamento precedentemente esistente, chiaramente è insensata senza **HasHeaderGroup** */
         this.HasSecondaryHeaderGroup = null;
         /** Indica se nascondere gli Header della tabella */
         this.HeaderHidden = null;
@@ -3387,7 +4126,7 @@ class EsTableComponent {
         this.HiddenColumns = null;
         /** Permette di riordinare le colonne in base alle impostazioni effettuate dal Menù contestuale in alto a destra */
         this.ColumnsOrdering = null;
-        /** Eventuale supporto alle ricerche applicate alla modalità Array */
+        /** @deprecated Eventuale supporto alle ricerche applicate alla modalità Array */
         this.SearchView = null;
         /** Abilita o disabilita il sistema che permette di selezionare tutti gli elementi nella vista */
         this.SelectAll = null;
@@ -3407,6 +4146,8 @@ class EsTableComponent {
         this.StartsExpanded = true;
         /** Indica se effettuare il salvataggio delle preferenze di ricerca */
         this.SavePreferences = null;
+        /** Allineamento di default per celle e headers */
+        this.DefaultAlignment = null;
         /** Indica dove visualizzare le informazioni di paginazione, se sopra, sotto o in entrambi */
         this.PagingStyle = null;
         /** Indica dove visualizzare le informazioni di paginazione, se sopra, sotto o in entrambi */
@@ -3418,7 +4159,11 @@ class EsTableComponent {
         /** Permette di decidere se, in modalità raggruppamento, mostrare o meno il valore delle colonne di gruppo negli oggetti finali. Di default sono nascosti */
         this.ShowItemGroupsColumns = null;
         /** Indica che tutti i campi che definiscono le modalità di modifica campo possono essere modificati in base alle impostazioni */
-        this.UserEdits = false;
+        this.Editable = false;
+        /** Indica se è possibile effettuare selezioni a range per poi farci eventualmente copia incolla */
+        this.RangeSelection = false;
+        /** Indica il numero di millisecondi per cui debouncare il writeValue per la modalità **EsTableHandledSearch** */
+        this.SearchThrottle = 50;
         /** Evento che viene richiamato al cambio di oridnamento di una colonna */
         this.onOrderChanged = new EventEmitter();
         /**
@@ -3437,6 +4182,10 @@ class EsTableComponent {
         this.onRemoval = new EventEmitter();
         /** Evento richiamato all'annullamento di un'eliminazione */
         this.onAbortRemoval = new EventEmitter();
+        /** Evento richiamato alla modifica dei modelli bindati */
+        this.onModelChange = new EventEmitter();
+        /** Evento richiamato all'apertura del menù contestuale */
+        this.onOpenContextMenu = new EventEmitter();
         /** Evento richiamato quando si clicca su un opzione definita nelle **CornerMenuOptions** */
         this.onCornerAction = new EventEmitter();
         /** Evento richiamato quando si clicca su un opzione definita nelle **DynamicOperations** */
@@ -3487,12 +4236,47 @@ class EsTableComponent {
         this.ArrayGrouping = false;
         /** Indica che l'es-table è basata sulle direttive (nuova modalità) */
         this.DirectivesBased = false;
+        /** Indica lo stato di selezione per singola cella */
+        this.selectionStatus = {};
+        /** Chiamata reale al writeValue dopo il passaggio di **SearchThrottle** millisecondi. Solo modalità EsTableHandledSearch */
+        this.callTimeout = null;
+        /** Cache dei th piuttosto che ricalcolarseli di continuo */
+        this.thsCache = {};
+        /** Indica quando la cache dei th è stata fillata almeno la prima volta */
+        this.thsCacheSet = false;
+        /**
+         * Flag che, se **true**, per un giro di binding mantiene la visibilità impostata localmente, piuttosto che allineare alla View bindata.
+         * Usata per modificare in maniera programmatica la visibilità delle colonne dal metodo **setHeaderVisibility**,
+         *
+         * Disclaimer: **NON MODIFICARE**
+         **/
+        this.useLocalVisibility = false;
         /** Opzioni di paginazione */
-        this.PagerOptions = { PagerCount: null, ShowCount: true, ShowPaging: true, ShowButtons: true, ShowPagingOptions: true, UsesView: true, View: null, Ready: false, Searches: 'items' };
+        this.PagerOptions = new PagerInfos();
         /** @ignore */
         this.propagateChange = (_) => { };
         /** Funzione di trackby per il body che dovrebbe evitare il 90% delle change detection */
-        this.bodyTrackBy = (index, item) => item._hash;
+        this.bodyTrackBy = (_, item) => item._hash;
+        /** Funzione di trackby generica per tutti gli oggetti che hanno il campo id */
+        this.idTrackBy = (_, item) => item.id;
+        /** Funzione di trackby generica per tutti gli oggetti che hanno il campo PropertyName */
+        this.PropertyNameTrackBy = (_, item) => item.PropertyName;
+        /** Funzione di trackby generica per tutti gli oggetti che hanno il campo ID */
+        this.IDTrackBy = (_, item) => item.ID;
+        /** Funzione di trackby generica per tutti gli oggetti che hanno il campo ID */
+        this.valTrackBy = (_, item) => item.val;
+        // Range selection Experimentals
+        this.mouseIsDown = false;
+        this.rangeSelected = false;
+        this.rangeStartWasIgnored = false;
+        this.firstCoordinates = null;
+        //* Piango
+        this.EsTdsCache = {};
+        // Copia e incolla si effettuano solo se la tabella attuale è univocamente selezionata
+        this.copySubscription = this.copyPasteDetector.OnCopy.subscribe(() => { if (this.copyPasteDetector.ActiveEstReference == this)
+            this.handleCopy(); });
+        this.pasteSubscription = this.copyPasteDetector.OnPaste.subscribe(() => { if (this.copyPasteDetector.ActiveEstReference == this)
+            this.handlePaste(); });
         this.export_H = new ExportHandler(this, this.expExts, this.msgExts, this.utiExts, this.dateExts);
         this.rowGrouping_H = new RowGroupingHandler(this, this.utilities_H, this.dateExts);
         this.columnMetadata_H = new ColumnMetadataHandler(this, this.utilities_H, this.utiExts, this.prefService, this.rowGrouping_H);
@@ -3521,6 +4305,7 @@ class EsTableComponent {
         this.ShowItemGroupsColumns = this.utilities_H.InputOrDefault(this.ShowItemGroupsColumns, this.deafults?.ShowItemGroupsColumns, false);
         this.ArraymodeItemsPerPage = this.utilities_H.InputOrDefault(this.ArraymodeItemsPerPage, this.deafults?.ArraymodeItemsPerPage, 15);
         this.ColumnsPinnable = this.utilities_H.InputOrDefault(this.ColumnsPinnable, this.deafults?.ColumnsPinnable, true);
+        this.DefaultAlignment = this.utilities_H.InputOrDefault(this.DefaultAlignment, this.deafults?.DefaultAlignment, 'Left');
     }
     /** @ignore */
     ngOnInit() {
@@ -3531,6 +4316,7 @@ class EsTableComponent {
                 return;
             let shouldEmit = !t.item._selected;
             t.item._selected = true;
+            this.selection_H.clearSelectionStatusExcluding(null);
             var itemSelection = this.selection_H.handleItemsSelection([t.item]);
             this.changed();
             if (shouldEmit)
@@ -3541,7 +4327,9 @@ class EsTableComponent {
     ngAfterViewInit() {
         // Se utilizzo la new spicy mode deduco tutti i parametri di lavoro possibili al caricamento della tabella
         // Vengono sovrascritte solo le proprietà non impostate dall'utente
-        let usesThsAndTdsDirectives = this.EsTdsDirective && this.EsTdsDirective.length > 0 && this.EsThsDirective && this.EsThsDirective.length > 0;
+        let tdsD = this.EsTdsDirective.length == 0 ? this.EsTableTemplate?.Template?.EsTdsDirective?.length > 0 ? this.EsTableTemplate?.Template?.EsTdsDirective : this.EsTdsDirective : this.EsTdsDirective;
+        let thsD = this.EsThsDirective.length == 0 ? this.EsTableTemplate?.Template?.EsThsDirective?.length > 0 ? this.EsTableTemplate?.Template?.EsThsDirective : this.EsThsDirective : this.EsThsDirective;
+        let usesThsAndTdsDirectives = tdsD && tdsD.length > 0 && thsD && thsD.length > 0;
         let hasNoContentProjection = !this.bodyRef && !this.headerRef && !this.headerGroupRef && !this.secondaryHeaderGroupRef;
         if (usesThsAndTdsDirectives || hasNoContentProjection) {
             if (this.UseCustomCells == null)
@@ -3565,24 +4353,40 @@ class EsTableComponent {
     }
     /** @ignore */
     ngOnDestroy() {
+        if (this.copySubscription)
+            this.copySubscription.unsubscribe();
+        if (this.pasteSubscription)
+            this.pasteSubscription.unsubscribe();
         if (this.ctxMenuSubscription)
             this.ctxMenuSubscription.unsubscribe();
+        if (this.copyPasteDetector.ActiveEstReference == this)
+            this.copyPasteDetector.ActiveEstReference = null;
     }
     /** @ignore */
     async ngOnChanges(changes) {
         let newSearchView = changes['SearchView'];
         if (newSearchView && this.SearchView)
-            this.arrayPulsanti = this.utilities_H.getPagesArray(6, this.SearchView.page, this.SearchView.pages || 1, this.SearchView.items.length, this.SearchView.itemsperpageoverride);
+            this.arrayPulsanti = this.utilities_H.getPagesArray(6, this.SearchView.page, this.SearchView.pages || 1, this.SearchView.objectcount, this.SearchView.itemsperpageoverride);
     }
     /** @ignore */
     registerOnChange(fn) { this.propagateChange = fn; }
     /** @ignore */
     registerOnTouched(fn) { }
     /** @ignore */
-    changed() { this.propagateChange(this.View); }
+    changed(clearItems = false) {
+        if (clearItems && this.viewMode)
+            this.View.items = [];
+        this.propagateChange(this.View);
+    }
     /** @ignore */
-    async writeValue(obj) {
+    async writeValue(obj, throttle = true) {
         this.View = obj ? obj : null;
+        if (this.EsTableHandledSearch && throttle) {
+            if (this.callTimeout)
+                clearTimeout(this.callTimeout);
+            this.callTimeout = setTimeout(() => { this.writeValue(obj, false); }, this.SearchThrottle);
+            return;
+        }
         // Mi è arrivata l'AppSearch quindi di sicuro non ho una ricerca in progress
         this.researchInProgress = false;
         if (!this.View && !this.SearchView) {
@@ -3636,16 +4440,29 @@ class EsTableComponent {
                         }
                         // In modalità report devo controllare che tutte le colonne salvate facciano parte della vista
                         // In modalità normale invece se le preferenze fanno riferimento a delle colonne che io non ho nella View attuale significa che
-                        // sto facendo riferimento a una versione vecchia dell'es-table, quindi non foccio operazioni
+                        // sto facendo riferimento a una versione vecchia dell'es-table, quindi non faccio operazioni
                         for (let i = 0; i < source.length; i++) {
                             if (repository.indexOf(source[i]) == -1) {
                                 updatedPrefs = false;
                                 break;
                             }
                         }
+                        // Se mi baso su direttive ma nelle preference è presente anche solo una colonna non presente nelle direttive 
+                        // vuol dire che l'es-table è cambiata quindi non imposto preference
+                        if (this.EsThsDirective?.length > 0) {
+                            for (let i = 0; i < repository.length; i++) {
+                                if (this.thsCacheSet && !this.thsCache[repository[i]]) {
+                                    updatedPrefs = false;
+                                    break;
+                                }
+                            }
+                        }
                         if (updatedPrefs) {
                             this.View.columns = prefs?.columns || [];
                             this.View.column_ordering = prefs?.column_ordering || [];
+                            // Se le pref sono nulle non sovrascrivo gli ordini dato che potrebbe servire mettere degli ordinamenti di default lato ts
+                            if (prefs)
+                                this.View.orders = prefs?.orders || [];
                         }
                     }
                 }
@@ -3681,7 +4498,10 @@ class EsTableComponent {
                         repository = cols;
                         source = this.View.columns;
                     }
-                    // In modalità report devo controllare che tutte le colonne salvate facciano parte della vista
+                    // In modalità report aggiorno le preferenze solo se c'è almeno una colonna, altrimenti vuol dire che si parte da vuoti
+                    // con tutte le colonne disponibili
+                    if (this.View.report_columns && (source?.length || 0) == 0)
+                        updatedPrefs = false;
                     // In modalità normale invece se le preferenze fanno riferimento a delle colonne che io non ho nella View attuale significa che
                     // sto facendo riferimento a una versione vecchia dell'es-table, quindi non foccio operazioni
                     for (let i = 0; i < source.length; i++) {
@@ -3693,6 +4513,9 @@ class EsTableComponent {
                     if (updatedPrefs) {
                         this.View.columns = prefs?.columns || [];
                         this.View.column_ordering = prefs?.column_ordering || [];
+                        // Se le pref sono nulle non sovrascrivo gli ordini dato che potrebbe servire mettere degli ordinamenti di default lato ts
+                        if (prefs)
+                            this.View.orders = prefs?.orders || [];
                     }
                 }
             }
@@ -3701,6 +4524,15 @@ class EsTableComponent {
         }
         this.finalizeContext();
         this.postBoundSourceCalculation();
+        if (this.View && !this.View.selfsearch && this.EsTableHandledSearch) {
+            this.View.selfsearch = true;
+            this.changed(true);
+            this.onSearchRequest.emit(false);
+        }
+        else if (this.View && this.View.selfsearch && this.EsTableHandledSearch) {
+            this.View.selfsearch = false;
+            this.changed();
+        }
     }
     /**
      * Successivamente al bind del nuovo input questa funzione si occupa di finalizzare tutti i parametri di funzionamento dell'es-table
@@ -3708,7 +4540,7 @@ class EsTableComponent {
      */
     finalizeContext() {
         let viewCasted = this.View;
-        let hasRowGroups = (viewCasted.groupings && viewCasted.groupings.filter(t => !t.aggregation).length > 0) || (this.arrayMode && this.EsThsDirective.some(t => t.thGroup));
+        let hasRowGroups = viewCasted && (viewCasted.groupings && viewCasted.groupings.filter(t => !t.aggregation).length > 0) || (this.arrayMode && this.EsThsDirective.some(t => t.thGroup));
         // Se ho dei gruppi in modalità array devo sistemare un po' di variabili che diventano insensate
         if (this.arrayMode && hasRowGroups)
             this.UseArrayModePaging = false;
@@ -3752,7 +4584,7 @@ class EsTableComponent {
                 this.PagerOptions.PagerCount = this.View.length || 0;
             this.PagerOptions.ShowButtons = this.PagerOptions.ShowButtons && (this.View.length > 10 || (this.SearchView?.objectcount || 0) > 10);
             this.PagerOptions.ShowCount = this.PagerOptions.ShowCount || (this.View && this.View.length) || (this.SearchView && this.SearchView.objectcount && this.SearchView.objectcount != -1);
-            this.PagerOptions.ShowPaging = this.PagerOptions.ShowButtons || this.PagerOptions.ShowCount;
+            this.PagerOptions.ShowPaging = this.PagerOptions.ShowPaging && (this.PagerOptions.ShowButtons || this.PagerOptions.ShowCount);
             this.PagerOptions.ShowPagingOptions = this.PagerOptions.ShowButtons;
         }
         else if (this.viewMode) {
@@ -3780,10 +4612,13 @@ class EsTableComponent {
     /** Per poter distinguere le chiamate a questo metodo: Dopo il setTimeout se uso gli EsTd/EsTh vecchi, senza il setTimeout se uso le nuove direttive */
     internalPostBoundSource() {
         let View = this.View;
-        let ths = this.EsThsDirective && this.EsThsDirective.length > 0 ? this.EsThsDirective.toArray() : [];
-        let tds = this.EsTdsDirective && this.EsTdsDirective.length > 0 ? this.EsTdsDirective.toArray() : [];
+        let tdsD = this.EsTdsDirective.length == 0 ? this.EsTableTemplate?.Template?.EsTdsDirective?.length > 0 ? this.EsTableTemplate?.Template?.EsTdsDirective : this.EsTdsDirective : this.EsTdsDirective;
+        let thsD = this.EsThsDirective.length == 0 ? this.EsTableTemplate?.Template?.EsThsDirective?.length > 0 ? this.EsTableTemplate?.Template?.EsThsDirective : this.EsThsDirective : this.EsThsDirective;
+        let ths = thsD && thsD.length > 0 ? thsD.toArray() : [];
+        let tds = tdsD && tdsD.length > 0 ? tdsD.toArray() : [];
         // Se non ho colonne dinamiche ma sono in modalità dinamica (lo capisco perché c'è una view piena di genericitem) metto il default delle colonne
         this.dynamicMode_H.eventuallyReviewDynamicColumns();
+        // Gestisce la richiesta per gruppi o per singoli oggetti
         this.bindDisplayToLoadedItemsOrGroups(View);
         // Questo dev'essere per forza lanciato dopo **bindDisplayToLoadedItemsOrGroups** dato che è lì che alcune cose vengono valorizzate
         this.setupPagingInformations();
@@ -3794,22 +4629,34 @@ class EsTableComponent {
             let si = this.viewMode ? view.selection : this.arraymodeSelection;
             // N.B: Rispettare l'ordine di queste 3 macrocategorie è VITALE
             // *************************************        Sistemazioni di TH, TD, e visibilità varie      *************************************
-            // Espando i th e i td multipli duplicandoli
-            let ret = this.columnMetadata_H.expandMultiThsAndTds(ths, tds, itemsAndGroups);
-            ths = ret.expThs;
-            tds = ret.expTds;
+            // Se ho definizioni dinamiche, prima di qualsiasi altra cosa devo trasformarle in th/td in modo che poi il codice qui sotto faccia le sue magie
+            if (this.DynamicRowColumnsDefinition?.length > 0) {
+                this.logger.log("Generating ths and tds from Dynamic definition");
+                let ret = this.dynamicMode_H.emitThsAndTdsBasedOnDynamicDefinition();
+                ths = ret.ths;
+                tds = ret.tds;
+            }
             // Gestione delle view in modalità report, i th e i td vengono rigenerati dalle configurazioni della view
             if (!this.arrayMode && view.report_columns) {
+                this.logger.log("Generating ths and tds from report results");
                 let ret = this.reportMode_H.generateThsAndTdsFromView(view);
                 ths = ret.ths;
                 tds = ret.tds;
             }
+            // Espando i th e i td multipli duplicandoli
+            let ret = this.columnMetadata_H.expandMultiThsAndTds(ths, tds, itemsAndGroups);
+            ths = ret.expThs;
+            tds = ret.expTds;
+            // Genero la cache dei th da usare da qui in poi, dopo avergli lasciato fare le sue cose in caso ci siano dei multi o dei report
+            for (let i = 0; i < ths.length; i++) {
+                let th = ths[i];
+                this.thsCache[th.th] = th;
+            }
+            this.thsCacheSet = true;
             // Prepassaggio per tirare fuori tutte le info utili sugli headers in modo da non ricacolarseli sempre dopo
             let hI = this.columnMetadata_H.evaluateHeadersGroupingInfos(ths);
-            if (this.arrayMode) { // In modalità array non ho un backend...
-                this.items_H.arrayModeReviewOrderings(); // ... quindi gli ordinamenti li devo fare lato client, e ...
+            if (this.arrayMode) // In modalità array non ho un backend...
                 this.rowGrouping_H.arrayModeReviewGroupings(hI.leafs); // ... i raggruppamenti li devo fare lato client
-            }
             this.columnMetadata_H.reviewColumnsList(hI.leafs); // Aggiorna la lista delle colonne da mostrare nella dialog per ordinamento ecc
             this.columnMetadata_H.alignColumnsIfLoadedView(view); // Se sto caricando una View da hotpotato (quindi con savedstate = true) riallineo la visibilità delle colonne e il loro ordine.
             this.columnMetadata_H.moveFixedColumnsAtTheBeginning(hI.leafs, tds); // Sposto tutte le cose fixed all'inizio in modo che la creazione di th e td sia più snella (Utilizza le ColumnsList, quindi dev'essere richiamata PIRMA di reviewColumnsList)
@@ -3825,6 +4672,8 @@ class EsTableComponent {
             this.columnMetadata_H.applyOrdering(view, true); // Applico l'ordinamento sulle colonne (non ASC DESC, ma "prima questa o quella colonna")
             this.MoveTemporaryVariablesToRealOnes(); // Collego TH e TD aggiustati fino ad ora alle variabili di Binding HTML
             this.selection_H.evaluateSelection(itemsAndGroups, si); // Riallineo le info di selezione degli elementi della View
+            // Valuta lo stato iniziale di selezione a range
+            this.selection_H.evaluateSingleCellSelection(itemsAndGroups, hI.leafs, this.DynamicRowColumnsDefinition);
             if (this.ResearchNeeded) {
                 this.changed();
                 this.emitSearchRequest(false);
@@ -3896,6 +4745,10 @@ class EsTableComponent {
      */
     setSelectionStatus(items, all, select) {
         if (all) {
+            if (!this.SelectAll) {
+                console.error("Impossibile impostare la selezione con l'all selection quando l'Input SelectAll è false");
+                return;
+            }
             let si = this.View?.selection || this.arraymodeSelection;
             //se deseleziono con attuale selezione ad all o se seleziono con attuale selezione manuale devo richiamare la **selectAllOrResetSelection**
             if ((si.all && !select) || (!si.all && select))
@@ -3937,7 +4790,13 @@ class EsTableComponent {
             viewOverride.internalsearchrequest = true;
         }
         this.researchInProgress = true;
-        this.onSearchRequest.emit(viewOverride ? viewOverride : resetsPage);
+        if (this.View && !this.View.selfsearch && this.EsTableHandledSearch) {
+            this.View.selfsearch = true;
+            this.changed(true);
+            this.onSearchRequest.emit(false);
+        }
+        else
+            this.onSearchRequest.emit(viewOverride ? viewOverride : resetsPage);
     }
     /**
      * Partendo dagli **EsTds** bindati genera, all'interno del dizionario **TMPRowTDs** tutti i contesti dei vari oggetti.
@@ -3952,16 +4811,11 @@ class EsTableComponent {
     evaluateRowTds(ths, tds) {
         if (tds.length == 0)
             return;
-        let thsCache = {};
         let columnsCache = {};
         for (let coli = 0; coli < this.ColumnsList.length; coli++) {
             let col = this.ColumnsList[coli];
             columnsCache[col.id] = col;
         }
-        for (let i = 0; i < ths.length; i++) {
-            let th = ths[i];
-            thsCache[th.th] = th;
-        }
         this.TMPRowTDs = {};
         // Variabile d'appoggio per permettermi di inserire tutte le colonne "Fixed" davanti
         let contextFixeds = {};
@@ -3971,22 +4825,54 @@ class EsTableComponent {
                 let item = this.boundSource[i];
                 let ctx = item._hash;
                 let key = td.td;
-                let th = thsCache[td.td];
-                let drcd = this.DynamicRowColumnsDefinition;
+                let th = this.thsCache[td.td];
                 if (!!th)
                     th._referenced = true;
-                else if (!drcd || !drcd.find(t => t.propertyName == td.td)) {
-                    let subject = drcd && drcd.length > 0 ? "le colonne dinamiche specificate" : "gli ID dicharati negli EsTh";
-                    console.error(`ID dell'oggeto EsTd non compatibile con ${subject} ${td.td}`);
-                    return;
-                }
                 // Skippare senza th (casistica tabella dinamica)
-                if (th && (td.tdIf || th.thGroup)) {
+                if (th && th.thIf && (td.tdIf || th.thGroup)) {
                     let thCasted = th;
                     let isFixed = th.thFixed || th.thGroup || th.thPinned;
                     let itemToAdd = item._item ?
-                        { LeftBorder: thCasted._lbord, RightBorder: thCasted._rbord, ID: key, Pinned: columnsCache[td.td].pinned, PinnedWidth: thCasted.thPinnedWidth, GroupHeader: false, GroupAggregation: false, Visible: columnsCache[td.td].visible, Wraps: false, Class: td.tdClass, Template: thCasted.thGroup && !this.ShowItemGroupsColumns ? null : td.Template, Multi: td._multi, MultiProp: td._multi ? td.td.split('_')[0] : null, MultiIndex: td._multi ? td.td.split('_')[1] : null, UserEdits: th.thUserEdits, PropAccessor: td.tdPropertyAccessor } :
-                        { LeftBorder: thCasted._lbord, RightBorder: thCasted._rbord, ID: key, Pinned: columnsCache[td.td].pinned, PinnedWidth: thCasted.thPinnedWidth, GroupHeader: thCasted.thGroup, GroupAggregation: !!thCasted.thAggregation, Visible: columnsCache[td.td].visible, Wraps: false, Class: thCasted.thGroupClass || '', Content: this.rowGrouping_H.getGroupCellDisplay(item, key, th) };
+                        {
+                            LeftBorder: thCasted._lbord,
+                            RightBorder: thCasted._rbord,
+                            ID: key,
+                            Pinned: columnsCache[td.td].pinned,
+                            PinnedWidth: thCasted.thPinnedWidth,
+                            GroupHeader: false,
+                            GroupAggregation: false,
+                            Visible: columnsCache[td.td].visible,
+                            Wraps: false,
+                            Class: td.tdClass,
+                            IconClass: td.tdIconClass,
+                            ConditionField: td.tdConditionField,
+                            ConditionValue: td.tdConditionValue,
+                            Title: td.tdTitle,
+                            Content: td.tdContent,
+                            Template: thCasted.thGroup && !this.ShowItemGroupsColumns ? null : td.Template,
+                            Multi: td._multi,
+                            MultiProp: td._multi ? td.td.split('_')[0] : null,
+                            MultiIndex: td._multi ? td.td.split('_')[1] : null,
+                            Alignment: (td.tdAlignment || th.thAlignment || this.DefaultAlignment).toLowerCase(),
+                            Format: td.tdFormat || th.thFormat,
+                            PropertyName: th.thProperty,
+                            PropertyType: th.thType,
+                            PropertySource: th.thSource,
+                            PropAccessor: td.tdPropertyAccessor
+                        } :
+                        {
+                            LeftBorder: thCasted._lbord,
+                            RightBorder: thCasted._rbord,
+                            ID: key,
+                            Pinned: columnsCache[td.td].pinned,
+                            PinnedWidth: thCasted.thPinnedWidth,
+                            GroupHeader: thCasted.thGroup,
+                            GroupAggregation: !!thCasted.thAggregation,
+                            Visible: columnsCache[td.td].visible,
+                            Wraps: false,
+                            Class: thCasted.thGroupClass || '',
+                            Content: this.rowGrouping_H.getGroupCellDisplay(item, key, th)
+                        };
                     if (this.TMPRowTDs[ctx]) {
                         this.TMPRowTDs[ctx].push(itemToAdd);
                     }
@@ -4036,8 +4922,26 @@ class EsTableComponent {
             let th = ths[i];
             let toAdd;
             if (th.thIf || th.thGroup) {
-                let thClass = (th.thClass || '') + (th.thGroup ? " est-col-min" : "");
-                toAdd = { Pinned: columnsListCache[th.th].pinned, Fixed: th.thFixed, PinnedWidth: th.thPinnedWidth, ID: th.th, Visible: th.thVisible, Class: thClass, Order: th.thOrder, Orderable: th.thOrderable, Template: th.Template, Content: th.thStaticContent, Wrap: th.thWrap, LeftBorder: th._lbord, RightBorder: th._rbord, Multi: th._multi, MultiContent: th._multi_content };
+                let thClass = (th.thClass || "") + (th.thShrink ? " app-col-min" : "") + (th.thGroup ? " est-col-min" : "");
+                toAdd = {
+                    Pinned: columnsListCache[th.th].pinned,
+                    Fixed: th.thFixed,
+                    PinnedWidth: th.thPinnedWidth,
+                    ID: th.th,
+                    Visible: th.thVisible,
+                    Class: thClass,
+                    Order: th.thOrder,
+                    Orderable: th.thOrderable,
+                    Template: th.Template,
+                    Alignment: (th.thAlignment || this.DefaultAlignment).toLowerCase(),
+                    // Se non è nessun contenuto né nessun template mostro semplicemente l'ID dell'header
+                    Content: th.thStaticContent != null ? th.thStaticContent : th.Template ? '' : th.th,
+                    Wrap: th.thWrap,
+                    LeftBorder: th._lbord,
+                    RightBorder: th._rbord,
+                    Multi: th._multi,
+                    MultiContent: th._multi_content
+                };
                 this.TMPRowTHs.push(toAdd);
                 // Se ho un modello che deve funzionare a rowgrouping ma non è ancora stata effettuata nessuna ricerca sui gruppi principali (groupingsUndefined)
                 // li genero e mando la prima ricerca che dev'essere spedita al backend per il primo caricamento dei gruppi
@@ -4076,6 +4980,8 @@ class EsTableComponent {
         this.emitSearchRequest(false, appSearchElement);
     }
     /**
+     * @TODO Spostare in SelectionHandler
+     *
      * Gestisce i click sulla tabella solo per le righe a gruppo.
      * O rimuove gli elementi attualmente presenti o carica il contenuto del gruppo
      *
@@ -4132,6 +5038,7 @@ class EsTableComponent {
      * @param {boolean} forcedVal Valore forzato di check da assegnare agli oggetti
      */
     globalCheckChanged(forcedVal = null) {
+        this.selection_H.clearSelectionStatusExcluding(null);
         // Prendo tutti gli elementi presenti in questa vista. Se ho gruppi prendo solo i gruppi a livello 0, altrimenti prendo tutti gli oggetti per selezionarli
         let items = this.boundSource.find(t => t._group) ? this.boundSource.filter(t => t._group && !t._parent) : this.boundSource;
         var itemSelection = this.selection_H.handleItemsSelection(items, forcedVal, this.globalCheck);
@@ -4139,6 +5046,8 @@ class EsTableComponent {
         this.onSelectionChanged.emit(itemSelection);
     }
     /**
+     * @TODO Spostare in SelectionHandler
+     *
      * Gestisce i click sulla tabella, gestendo eventualmente anche gli Shift + Click per selezionare un range di oggetti
      *
      * @param {any} event Evento nativo HTML del click
@@ -4147,12 +5056,8 @@ class EsTableComponent {
      * @returns {boolean} **true** se l'operaizone è andata a buon fine, **false** altrimenti
      */
     handleClick(event, item) {
-        // Seleziono del testo ma non ho shift premuto -> ignoro la selezione
-        if ((event.view.getSelection().type == 'Range' || event.view.getSelection().toString().length > 0) && !event.shiftKey)
-            return false;
-        // Seleziono del testo e ho shift premuto -> annullo la selezione del testo
-        if ((event.view.getSelection().type == 'Range' || event.view.getSelection().toString().length > 0) && event.shiftKey)
-            this.utiExts.clearTextSelection();
+        this.selection_H.clearTextSelection(event);
+        this.selection_H.clearSelectionStatusExcluding(null);
         let selecteditems = [];
         if (event.shiftKey && this.ShiftClick && !this.SingleSelection) {
             let startSelecting = false;
@@ -4255,13 +5160,32 @@ class EsTableComponent {
      * Ottiene il contenuto dell'EsTd da utilizzare per la colonna specificata
      *
      * @param {string} column Colonna per cui cercare la cella
+     * @param {string} name Nome diretto per cercare il TD con l'ID. Questa variabile ha priorità rispetto a **column**
      *
      * @returns {TemplateRef<any>} Template da usare per la colonna
      */
-    findEsTd(column) {
-        var EsTd = this.EsTdsDirective.find((item) => item.td === column);
+    findEsTd(column, name = null) {
+        var EsTd = this.EsTdsDirective.find((item) => name ? item.td === name : item.tdForProperty === column);
+        // Name non trovato, fallback al nome della colonna
+        if (name && column && !EsTd)
+            EsTd = this.EsTdsDirective.find((item) => item.tdForProperty === column);
         return EsTd ? EsTd.Template : null;
     }
+    /**
+     * Ottiene il contenuto dell'editor EsTd da utilizzare per la colonna specificata
+     *
+     * @param {string} column Colonna per cui cercare l'editor
+     * @param {string} name Nome diretto per cercare l'Editor con l'ID. Questa variabile ha priorità rispetto a **column**
+     *
+     * @returns {TemplateRef<any>} Template da usare per la colonna
+     */
+    findEditor(column, name = null) {
+        var Editor = this.EsTdEditorDirectives.find((item) => name ? item.editor === name : item.editorForProperty === column);
+        // Name non trovato, fallback al nome della colonna
+        if (name && column && !Editor)
+            Editor = this.EsTdEditorDirectives.find((item) => item.editorForProperty === column);
+        return Editor ? Editor.Template : null;
+    }
     /**
      * Equivalente del metodo **addToPage** riadattato per la modalità array
      *
@@ -4309,7 +5233,7 @@ class EsTableComponent {
         this.internalWriteCall = false;
     }
     /** Metodo eventualmente richiamabile anche dal componente esterno che permette di forzare un refresh della tabella */
-    forceRefresh() {
+    forceRefresh(relaunchSearch = true) {
         // Se sono in modalità View viene mantenuto in automatico il numero di pagina, ma per la modalità array devo prendere le info di paginazione prima e riapplicarle dopo
         let arrayPage;
         let arrayIpp;
@@ -4317,6 +5241,8 @@ class EsTableComponent {
             arrayPage = this.arraymodePage;
             arrayIpp = this.ArraymodeItemsPerPage;
         }
+        if (!relaunchSearch && this.viewMode)
+            this.View.selfsearch = true;
         this.writeValue(this.View);
         this.cdr.detectChanges();
         if (this.arrayMode) {
@@ -4324,6 +5250,28 @@ class EsTableComponent {
             this.arrayGoToPage(arrayPage);
         }
     }
+    /**
+     * Imposta la visibilità di un header e di eventuali header collegati se questo header è un gruppo, dopodiché aggiorna l'es-table
+     *
+     * @param {string} groupOrHeader Header di cui settare la visibilità
+     * @param {boolean} visibility Visibilità da impostare
+     **/
+    setHeaderVisibility(groupOrHeader, visibility, refresh = true, relaunchSearch = true) {
+        let groupOrHead = this.thsCache[groupOrHeader];
+        if (!groupOrHead)
+            return;
+        groupOrHead.thVisible = visibility;
+        let thsArr = this.EsThsDirective.toArray();
+        for (let i = 0; i < thsArr.length; i++) {
+            let th = thsArr[i];
+            if (th.thParent == groupOrHeader)
+                this.setHeaderVisibility(th.th, visibility, false);
+        }
+        if (refresh) {
+            this.useLocalVisibility = true;
+            this.forceRefresh(relaunchSearch);
+        }
+    }
     /**
      * Funzione che in base ai click su una cella capisce se sto effettuando un'operazione di selezione o se sto entrando nell'edit di una cella con un doppio click
      *
@@ -4332,30 +5280,107 @@ class EsTableComponent {
      * @param {any} item Item che rappresenta il contesto su cui è stato effettuato un click
      */
     dbClickEditOrSingleClickRowSelection($event, rowItem, item) {
+        // Prima cosa da fare è controllare se ci sono dei range lasciati da operazioni precedenti (se applicabile) e ripulirli
+        if (this.rangeSelected && !$event.ctrlKey && this.Selection) {
+            this.logger.log("clearing previously selected range");
+            this.selection_H.clearSelectionStatusExcluding(null);
+            this.rangeSelected = false;
+            return;
+        }
+        // Modalità Editable, gestisco i doppi click senza però rallentare la modalità di selezione a range
+        if (this.Editable) {
+            // Secondo click: se il timer non è scaduto è un doppio click ed eseguo il resto
+            if (this.cellDbClickTimer) {
+                this.logger.log("handling doubleclick on editable cell: " + (rowItem.PropertyName ? 'edit mode for property ' + rowItem.PropertyName : 'no property set, fallback to simple click'));
+                if (rowItem.PropertyName)
+                    this.setupUserEdit(rowItem, item);
+                else
+                    this.handleRowClick($event, item, this.Selection, true);
+                this.clearCellClickTimer();
+                return;
+            }
+            // Primo click: non fa niente e se il tempo per il secondo click scade resetta tutto
+            this.cellDbClickTimer = setTimeout(() => {
+                this.clearCellClickTimer();
+                if (!this.RangeSelection || !this.mouseIsDown) {
+                    this.logger.log("time's up for second click, handling single click");
+                    this.handleRowClick($event, item, this.Selection, true);
+                }
+            }, this.doubleClickBufferMs);
+        }
+        // In modalità a range la creazione del range è gestita dai mousedown, move ed up...
+        // La selezione delle righe invece è gestita dalle caselline a sinistra
+        if (this.RangeSelection)
+            return;
+        // Se ho fatto click col control attaccato esco subito dato che deve solo permettere la navigazione dei link
+        if ($event.ctrlKey)
+            return;
         // Tutti i click su una cella già in edit non devono effettuare la selezione della riga
         if (rowItem._editing)
             return;
         // Per evitare di rallentare a prescindere
-        if (!this.UserEdits) {
-            this.handleRowClick($event, item, this.Selection);
+        if (!this.Editable) {
+            this.handleRowClick($event, item, this.Selection, true);
             return;
         }
-        // Secondo click: se il timer non è scaduto è un doppio click ed eseguo il resto
-        if (this.cellDbClickTimer) {
-            if (this.UserEdits && rowItem.UserEdits)
-                this.setupUserEdit(rowItem);
-            this.clearCellClickTimer();
+    }
+    /** Evento che gestisce il comando "Copia" buttando i valori selezionati nella clipboard in base al loro tipo */
+    handleCopy() {
+        if (!this.RangeSelection)
             return;
+        let sel = this.selection_H.getSelectionStatusSelection();
+        if (sel.length > 0 && sel[0].length > 0) {
+            var selectionText = this.selection_H.getClipbardTextFromSelection(sel);
+            this.clipboardService.copyTextToClipboard(selectionText);
+            this.msgExts.simpleInfo(this.lc.loc("Values copied in the clipboard"), "toastr", 1000);
         }
-        // Primo click: non fa niente e se il tempo per il secondo click scade resetta tutto
-        this.cellDbClickTimer = setTimeout(() => {
-            this.clearCellClickTimer();
-            this.handleRowClick($event, item, this.Selection);
-        }, this.doubleClickBufferMs);
     }
-    /**
-     * Ripulisce il timer utilizzato per capire se è stato effettuato un doppio click o meno
-     */
+    /** Evento che gestisce il comando "Incolla" prendendo i dati della clipboard e applicandoli al range di selezione attuale in base al tipo delle celle sotto */
+    handlePaste() {
+        if (!this.RangeSelection)
+            return;
+        let sel = this.selection_H.getSelectionStatusSelection();
+        if (sel.length > 0 && sel[0].length > 0) {
+            this.clipboardService.getClipboard("matrix", (values) => {
+                // Fix clipboard service che pare un po' stronza, rimuovo l'ultimo array se mi accorgo che è un singolo array con un solo elemento vuoto
+                if (values.length > 0 && values[values.length - 1].length == 1 && values[values.length - 1][0] == '')
+                    values.splice(values.length - 1, 1);
+                if (values.length > 0 && values[0].length > 0) {
+                    // Check se la modifica è abilitata
+                    if (!this.Editable) {
+                        this.msgExts.simpleWarning(this.lc.loc("Data for this table cannot be edited"));
+                        return;
+                    }
+                    // Controllo che quello che sto copiando sia della stessa dimensione della selezione sull'es-table, tranne nel caso ho un singolo valore da copiare
+                    if ((sel.length != values.length || sel[0].length != values[0].length) && (values.length != 1 || values[0].length != 1)) {
+                        this.msgExts.simpleWarning(this.lc.loc("Size of copied data is different from the size of the selection"));
+                        return;
+                    }
+                    // Se le dimensioni coincidono copio da una parte all'altra
+                    let changes = [];
+                    for (let r = 0; r < sel.length; r++) {
+                        var row = sel[r];
+                        for (let c = 0; c < row.length; c++) {
+                            let cell = row[c];
+                            // Se ho un singolo valore lo applico a tutta la selezione
+                            let value = values.length == 1 && values[0].length == 1 ? values[0][0] : values[r][c];
+                            let old = cell.value;
+                            let niu = cell.val_setter(value);
+                            let olddate = this.dateExts.getDateConvertion(old);
+                            let niudate = this.dateExts.getDateConvertion(niu);
+                            if ((olddate && niudate && olddate.isSame && olddate.isSame(niudate)) || old === niu)
+                                continue;
+                            changes.push(new EsTableModelChange(cell.item, cell.header, cell.property, old, niu));
+                        }
+                    }
+                    this.cdr.markForCheck();
+                    if (changes.length > 0)
+                        this.onModelChange.emit(changes);
+                }
+            });
+        }
+    }
+    /** Ripulisce il timer utilizzato per capire se è stato effettuato un doppio click o meno */
     clearCellClickTimer() {
         clearTimeout(this.cellDbClickTimer);
         this.cellDbClickTimer = null;
@@ -4366,9 +5391,15 @@ class EsTableComponent {
      * @param {any} $event Evento nativo javascript
      * @param {any} item Item che rappresenta il contesto su cui è stato effettuato un click
      * @param {boolean} selection Indica se la selezione è attiva
-     *
+     * @param {boolean} internalCall Indica se la chiamata a questa funzione è interna: permette di skippare i check sulle CustomCells
      */
-    handleRowClick($event, item, selection) {
+    handleRowClick($event, item, selection, internalCall = false) {
+        // Se ho un ctrl premuto esco con true in modo da fare bubbling dell'evento e lasciarlo gestire al browser (link ecc...)
+        // Stessa cosa se ho custom cell dato che la gestione dei click viene affidata ai singoli TD
+        if ($event.ctrlKey || (this.UseCustomCells && !internalCall))
+            return true;
+        if (selection)
+            this.selection_H.clearSelectionStatusExcluding(null);
         if (selection && !item.locked && !item._sep && !item._group)
             this.handleClick($event, item);
         else if (item._group)
@@ -4376,34 +5407,127 @@ class EsTableComponent {
         // Ora che non è attaccato direttamente all'html devo fare un markforcheck finite le operazioni sui grouping
         this.cdr.markForCheck();
     }
+    /**
+     * Gestione del click destro sull'es-table
+     */
+    onRightClick() {
+        if (this.Selection)
+            this.onOpenContextMenu.emit();
+    }
     /**
      * La modifica dell'utente è iniziata. Si imposta la variabile relativa a "true" in modo da mostrare l'input di testo
      *
      * Dopo che l'input è apparso, dopo un ciclo di Change Detection viene attivato il Subject collegato all'input che servirà a effettuare il focus
      *
      * @param {TdElement} rowItem Elemento di riga su cui è stata attivata la modifica
+     * @param {any} item Oggetto sopra il quale è stata attivata la modifica
      */
-    setupUserEdit(rowItem) {
-        if (this.UserEdits && rowItem.UserEdits)
+    setupUserEdit(rowItem, item) {
+        this.selection_H.clearSelectionStatusExcluding(null);
+        if (this.Editable && rowItem.PropertyName) {
+            let dynMode = this.DynamicRowColumnsDefinition?.length > 0;
             rowItem._editing = true;
+            rowItem.old_value = dynMode ? item.properties[rowItem.PropertyName] : item[rowItem.PropertyName];
+        }
         this.cdr.detectChanges();
         setTimeout(() => { this.FocusSubject.next(); });
     }
     /**
-     * La modifica dell'utente è terminata. Si reimposta la variabile relativa a "false" in modo da nascondere l'input di testo
+     * La modifica dell'utente è terminata. Si reimposta la variabile relativa a "false" in modo da nascondere l'input di testo e si emette la modifica del valore
      *
      * @param {TdElement} rowItem Elemento di riga su cui è stata attivata la modifica
      * @param {any} item Oggetto sopra il quale è stata attivata la modifica
+     * @param {number} columnIndex Indice della colonna su cui è avvenuta la modifica
      */
-    finalizeUserEdit(rowItem, item) {
-        rowItem._editing = false;
+    finalizeUserEdit(rowItem, item, columnIndex) {
+        let dynMode = this.DynamicRowColumnsDefinition?.length > 0;
+        let rowItm = rowItem;
+        rowItm._editing = false;
+        let old = rowItm.old_value;
+        let niu = dynMode ? item.properties[rowItem.PropertyName] : item[rowItem.PropertyName];
+        let olddate = this.dateExts.getDateConvertion(old);
+        let niudate = this.dateExts.getDateConvertion(niu);
+        if ((olddate && niudate && olddate.isSame && olddate.isSame(niudate)) || old === niu)
+            return;
+        this.onModelChange.emit([new EsTableModelChange(item, rowItem.ID, rowItem.PropertyName, old, niu)]);
+        this.selectionStatus[item._ordinal][columnIndex].val_setter(niu);
+    }
+    mousedown(event, rowItem, _) {
+        // Tasto diverso dal click sinistro -> ciao è stato bello e intenso
+        if (event.buttons != 1 || !this.RangeSelection)
+            return;
+        // Sto lavorando su QUESTA es-table
+        this.copyPasteDetector.ActiveEstReference = this;
+        // Tutti i click su una cella già in edit non devono effettuare la selezione della riga
+        if (rowItem._editing)
+            return;
+        this.mouseIsDown = true;
+        let coords = event.currentTarget.id.split('_');
+        let row = parseInt(coords[coords.length - 2]);
+        let column = parseInt(coords[coords.length - 1]);
+        this.firstCoordinates = { row, column };
+        // Se ho già un range di selezione ignoro temporanemaente questa selezione in modo da capire bene cosa devo fare dopo (click sulla riga / altra selezione)
+        // e gestire la grafica in maniera un po' più precisa
+        if (!this.rangeSelected || (event.ctrlKey || !this.Selection))
+            this.selection_H.singleCellSelection({ view: event.view, range: false }, row, column);
+        else
+            this.rangeStartWasIgnored = true;
+        this.logger.log(`mouse down on ${row}:${column}`);
+    }
+    mouseenter(event) {
+        if (!this.RangeSelection)
+            return;
+        if (event.buttons == 0)
+            this.mouseIsDown = false;
+        if (this.mouseIsDown && this.firstCoordinates) {
+            let id = event.currentTarget.id;
+            let coords = id.split('_');
+            let row = parseInt(coords[coords.length - 2]);
+            let column = parseInt(coords[coords.length - 1]);
+            // Se ho ignorato l'inizio della selezione nel mousedown lo recupero qui
+            if (this.rangeStartWasIgnored) {
+                this.selection_H.singleCellSelection({ view: event.view, range: false }, this.firstCoordinates.row, this.firstCoordinates.column);
+                this.rangeStartWasIgnored = false;
+            }
+            this.selection_H.singleCellSelection({ view: event.view, range: true }, row, column, this.firstCoordinates);
+            this.logger.log(`mouse move over ${row}:${column}`);
+            this.rangeSelected = true;
+        }
+    }
+    mouseup(event) {
+        if (!this.RangeSelection)
+            return;
+        let id = event.currentTarget.id;
+        let coords = id.split('_');
+        let row = parseInt(coords[coords.length - 2]);
+        let column = parseInt(coords[coords.length - 1]);
+        // Se il mouseup viene effettuato sulla stessa cella del primo mousedown e siamo in modalità di selezione deseleziono la cella perché è un semplice click
+        if (this.mouseIsDown && this.firstCoordinates) {
+            if (this.firstCoordinates.row == row && this.firstCoordinates.column == column && !event.ctrlKey && !this.rangeStartWasIgnored && this.Selection)
+                this.selection_H.singleCellSelection({ view: event.view, range: false }, row, column);
+            else if (event.ctrlKey || !this.Selection)
+                this.rangeSelected = true;
+        }
+        this.mouseIsDown = false;
+        this.logger.log(`mouse lifted up`);
+    }
+    getCellReference(object, column) {
+        let fkThisShitImOut = this.utiExts.deepClone(object);
+        this.utilities_H.calculateHash([fkThisShitImOut]);
+        let prop = column;
+        let hash = fkThisShitImOut._hash;
+        let toRet = this.EsTdsCache[`${prop}_${hash}`];
+        return toRet;
+    }
+    registerCell(event) {
+        this.EsTdsCache[`${event.id}_${event.hash}`] = event.self;
     }
 }
-EsTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableComponent, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: i2$1.PreferencesService, optional: true }, { token: EST_DEFAULTS, optional: true }, { token: EST_LOCALE, optional: true }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: UtilitiesHandler }, { token: i5.UtilityService }, { token: i5.ExportService }, { token: i5.DateService }, { token: i5.MessageService }], target: i0.ɵɵFactoryTarget.Component });
-EsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: EsTableComponent, selector: "es-table", inputs: { CornerMenuOptions: "CornerMenuOptions", ColumnsResizable: "ColumnsResizable", ColumnsPinnable: "ColumnsPinnable", AutoUpdate: "AutoUpdate", UseCustomCells: "UseCustomCells", MaxHeight: "MaxHeight", ContainerClass: "ContainerClass", XLSXExport: "XLSXExport", CSVExport: "CSVExport", AllSearch: "AllSearch", HighCellDensity: "HighCellDensity", Selection: "Selection", ShowLoadingOnBootstrap: "ShowLoadingOnBootstrap", Removal: "Removal", RemovalCondition: "RemovalCondition", Export: "Export", ShiftClick: "ShiftClick", CountLabel: "CountLabel", HidePaging: "HidePaging", HidePagingCount: "HidePagingCount", HidePagingButtons: "HidePagingButtons", ContextMenu: "ContextMenu", ExportFileName: "ExportFileName", TableClass: "TableClass", ExportFunction: "ExportFunction", HasHeaderGroup: "HasHeaderGroup", HasSecondaryHeaderGroup: "HasSecondaryHeaderGroup", HeaderHidden: "HeaderHidden", BodyHidden: "BodyHidden", SelectionDisabled: "SelectionDisabled", SingleSelection: "SingleSelection", RowClassAssigner: "RowClassAssigner", OrderByColumn: "OrderByColumn", MultipleOrderingDirectives: "MultipleOrderingDirectives", HiddenColumns: "HiddenColumns", ColumnsOrdering: "ColumnsOrdering", SearchView: "SearchView", SelectAll: "SelectAll", UseArrayModePaging: "UseArrayModePaging", DynamicRowColumnsDefinition: "DynamicRowColumnsDefinition", DynamicOperations: "DynamicOperations", Hierarchy: "Hierarchy", ParentKey: "ParentKey", OwnKey: "OwnKey", StartsExpanded: "StartsExpanded", SavePreferences: "SavePreferences", PagingStyle: "PagingStyle", RowGroupingPagingStyle: "RowGroupingPagingStyle", ItemSourceProperty: "ItemSourceProperty", UseSelectionCache: "UseSelectionCache", ShowItemGroupsColumns: "ShowItemGroupsColumns", UserEdits: "UserEdits", ArraymodeItemsPerPage: "ArraymodeItemsPerPage" }, outputs: { onOrderChanged: "onOrderChanged", onSearchRequest: "onSearchRequest", onSelectionChanged: "onSelectionChanged", onRemoval: "onRemoval", onAbortRemoval: "onAbortRemoval", onCornerAction: "onCornerAction", onDynamicOperation: "onDynamicOperation" }, queries: [{ propertyName: "bodyRef", first: true, predicate: ["body"], descendants: true }, { propertyName: "headerRef", first: true, predicate: ["header"], descendants: true }, { propertyName: "headerGroupRef", first: true, predicate: ["headerGroup"], descendants: true }, { propertyName: "secondaryHeaderGroupRef", first: true, predicate: ["secondaryHeaderGroup"], descendants: true }, { propertyName: "EsTdsDirective", predicate: EsTdDirective }, { propertyName: "EsThsDirective", predicate: EsThDirective }], viewQueries: [{ propertyName: "inputField", first: true, predicate: ["input"], descendants: true }, { propertyName: "exportDownloader", first: true, predicate: ["exportDownloader"], descendants: true }, { propertyName: "tableEmptyMenu", first: true, predicate: ["emptyMenu"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (View?.selection || arraymodeSelection)?.all\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10 est\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"(SelectAll && !SingleSelection) || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && !(View?.selection || arraymodeSelection)?.all && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups\">\r\n                        <th *ngFor=\"let cell of level\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned;\">\r\n                                <div class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"!cell.Pinned && cell.Content; Else: cell.Template\">\r\n                                {{cell.Content}}\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"arrayMode || viewMode\">\r\n\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition\">\r\n                                <ng-container *ngIf=\"rowHeader.visible\">\r\n                                    <th *ngIf=\"OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.propertyName, $event)\">{{rowHeader.description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs && RowTHs.length > 0\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" [style.width.px]=\"rowHeader.PinnedWidth\" es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" [Fixed]=\"rowHeader.Fixed\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null } \"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" es-th=\"{{rowHeader.ID}}\" class=\"{{rowHeader.Class || ''}}\" [class.est-ltab-border]=\"rowHeader.LeftBorder\" [class.est-rtab-border]=\"rowHeader.RightBorder\" [class.est-nowrap]=\"!rowHeader.Wrap\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null }\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Link nascosto che serve a scaricare il file -->\r\n                        <a *ngIf=\"headers\" hidden #exportDownloader csvLink [data]=\"data\" [headers]=\"headers\" [delimiter]=\"';'\" [filename]=\"ExportFileName.endsWith('.xlsx') ? ExportFileName.replace('.xlsx', '.csv') : ExportFileName.endsWith('.csv') ? ExportFileName : ExportFileName + '.csv'\"></a>\r\n\r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" >\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"View?.pagingavailable || viewMode\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n            <div *ngIf=\"!PagerOptions.ShowPaging\"><em>{{'Paging options are not available for this report' | localize: lc}}</em></div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, true)\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even;\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, false)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\"><div class=\"est-pinned-border est-cell-group-padding\"></div></td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || EmptyRowTds) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle definite in maniera dinamica dal modello -->\r\n<ng-template #dynamicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || EmptyRowTds) && DynamicRowColumnsDefinition\">\r\n        <ng-container *ngFor=\"let operation of DynamicOperations; let first = first; let last = last;\">\r\n            <ng-container *ngIf=\"!operation.conditionField || (item.properties[operation.conditionField] == operation.conditionValue)\">\r\n                <td [class.est-no-right-padding]=\"last\" [class.est-no-left-padding]=\"!first\" class=\"est-col-min\"><span title=\"{{operation.title}}\" class=\"{{operation.iconClass}} est-pointer\" (click)=\"dynamicOperation(item, operation.id)\">{{operation.text}}</span></td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"operation.conditionField && (item.properties[operation.conditionField] != operation.conditionValue)\">\r\n                <td class=\"est-col-min est-no-side-padding\"></td>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let rowItem of DynamicRowColumnsDefinition\">\r\n            <ng-container *ngIf=\"rowItem.routePath && rowItem.visible\">\r\n                <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n                    <a [routerLink]=\"dynamicMode_H.generateRouterLink(rowItem.routePath, rowItem.routeParameterProperties, item)\" class=\"est-link\" [innerHTML]=\"item.properties[rowItem.propertyName]\"></a>\r\n                </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!rowItem.routePath && rowItem.visible\">\r\n                <ng-container *ngTemplateOutlet=\"findEsTd(rowItem.propertyName) || defaultEsTd; context: { $implicit: item.properties[rowItem.propertyName], rowItem : rowItem, item : item }\"> </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-value let-rowItem='rowItem' let-item='item'>\r\n    <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n        {{value}}\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale delle celle custom se configurate -->\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && !EmptyRowTds\">\r\n\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n                    <td *ngIf=\"rowItem && rowItem.Pinned\" [style.width.px]=\"rowItem.PinnedWidth\" es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-no-selection]=\"!!rowItem.UserEdits\" [class.est-no-border]=\"true\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" [class.est-pre]=\"!(Hierarchy && i == 0)\">\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <ng-container *ngIf=\"!rowItem.Template && !rowItem.Multi\">\r\n                                <span *ngIf=\"rowItem.Content && !rowItem.PropAccessor\">{{rowItem.Content}}</span>\r\n                                <span *ngIf=\"!rowItem.Content && rowItem.PropAccessor\">{{item.values? item.values[rowItem.PropAccessor] : item[rowItem.PropAccessor]}}</span>\r\n                            </ng-container>\r\n                        </div>\r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\">\r\n                            <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" [Source]=\"rowItem.UserEdits.Source\" (inputChange)=\"finalizeUserEdit(rowItem, item)\" (inputFocus)=\"$event.stopPropagation();\" ></form-adaptive>\r\n                        </div>\r\n                    </td>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n            <ng-container *ngIf=\"rowItem && !rowItem.Pinned\">\r\n\r\n                <!-- Casistica senza bodyRef, quindi con direttive per i td -->\r\n                <ng-container *ngIf=\"!bodyRef && rowItem.Visible\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-ltab-border]=\"rowItem.LeftBorder\" [class.est-rtab-border]=\"rowItem.RightBorder\" [class.est-no-selection]=\"!!rowItem.UserEdits\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" [class.est-pre]=\"!(Hierarchy && i == 0)\" >\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <ng-container *ngIf=\"!rowItem.Template && !rowItem.Multi\">\r\n                                <span *ngIf=\"rowItem.Content && !rowItem.PropAccessor\">{{rowItem.Content}}</span>\r\n                                <span *ngIf=\"!rowItem.Content && rowItem.PropAccessor\">{{item.values? item.values[rowItem.PropAccessor] : item[rowItem.PropAccessor]}}</span>\r\n                            </ng-container>\r\n                        </div>\r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\">\r\n                            <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" [Source]=\"rowItem.UserEdits.Source\" (inputFinalized)=\"finalizeUserEdit(rowItem, item)\"></form-adaptive>\r\n                        </div>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <a [routerLink]='rowItem.RouterLink' class=\"est-link\" [innerHTML]=\"rowItem.Content\"></a>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (NON RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"!rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\">\r\n                            <ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\" [innerHTML]=\"rowItem.Content\"></span>\r\n                    </td>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Questo template contiene i pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem>\r\n        <span>\r\n            <em>{{'No operations available' | localize : lc}}...</em>\r\n        </span>\r\n    </ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last\">\r\n                                                <ng-container *ngIf=\"parent.tmpl\"><ng-container *ngTemplateOutlet=\"parent.tmpl\"></ng-container></ng-container>\r\n                                                <ng-container *ngIf=\"parent.content\">{{parent.content}}</ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template; context: { $implicit: item.multi ? item.multiContent : null }\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@charset \"UTF-8\";.est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-edit-hidden{visibility:hidden;height:1px!important}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:2px solid #bbb}.est-rtab-border{border-right:2px solid #bbb}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.est-pre{white-space:pre}.est val-datetime .mat-form-field-appearance-outline .mat-form-field-infix input{margin-bottom:3px!important;min-width:130px!important}.est .mat-form-field-flex{height:29px!important;padding:0!important}.est .mat-form-field-flex .mat-form-field-outline{color:#00f}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-start{border-left:none;border-top:none;border-radius:0}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-end{border-top:none;border-radius:0;border-right:none}.est .mat-form-field-wrapper{height:20px;min-height:20px!important;margin-top:0!important}.est .mat-form-field-infix{width:100%!important;min-width:50px!important}.est .mat-form-field-infix select.mat-input-element{margin-top:-5px!important}.est .mat-datepicker-input{margin-bottom:3px!important}.est input{height:20px;padding-top:0!important}\n"], components: [{ type: EsTh, selector: "[es-th]", inputs: ["es-th", "Order", "Orderable", "Display", "Resizable", "Pinned", "SearchInProgress", "OrderBy", "Wrap", "Fixed", "Template", "Visible"], outputs: ["onOrderChange", "onUnpinning"] }, { type: TablePagerComponent, selector: "app-paging", inputs: ["CurrentPageSize", "View", "WarnOnAll", "AllSearch", "DefaultAll", "GroupMode", "GroupCount", "CountLabel", "ShowCount", "ShowPaging", "PagerCount", "Hidden"], outputs: ["pagingSelected"] }, { type: EsTd, selector: "[es-td]", inputs: ["es-td", "Internal", "RouterLink", "Display", "Template", "Context", "Visible"] }, { type: i9.FormAdaptiveComponent, selector: "form-adaptive", inputs: ["Type", "TypeMissingMessage", "Pattern", "AllowDownload", "Precision", "Alignment", "SearchFunction", "MinChars", "CaseSensitive"] }, { type: i10.ContextMenuComponent, selector: "context-menu", inputs: ["menuClass", "autoFocus", "useBootstrap4", "disabled"], outputs: ["close", "open"] }], directives: [{ type: i11.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i11.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i11.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i12.CsvDirective, selector: "[csvLink]", inputs: ["data", "headers", "delimiter", "filename", "uFEFF", "target"] }, { type: i13.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { type: i13.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i13.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i10.ContextMenuAttachDirective, selector: "[contextMenu]", inputs: ["contextMenuSubject", "contextMenu"] }, { type: i14.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i10.ContextMenuItemDirective, selector: "[contextMenuItem]", inputs: ["subMenu", "divider", "enabled", "passive", "visible"], outputs: ["execute"] }, { type: i15.ModalDirective, selector: "[bsModal]", inputs: ["config", "closeInterceptor"], outputs: ["onShow", "onShown", "onHide", "onHidden"], exportAs: ["bs-modal"] }, { type: i16.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i16.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i16.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }], pipes: { "localize": i2.LocalizePipe, "number": i11.DecimalPipe }, viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableComponent, decorators: [{
+EsTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableComponent, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: i2$1.PreferencesService, optional: true }, { token: EST_DEFAULTS, optional: true }, { token: EST_LOCALE, optional: true }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: UtilitiesHandler }, { token: i5.UtilityService }, { token: i5.ExportService }, { token: i5.DateService }, { token: i5.MessageService }, { token: CopyPasteDetector }, { token: i5.ClipboardService }, { token: Logger }], target: i0.ɵɵFactoryTarget.Component });
+EsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: EsTableComponent, selector: "es-table", inputs: { EsTableTemplate: "EsTableTemplate", CornerMenuOptions: "CornerMenuOptions", ColumnsResizable: "ColumnsResizable", ColumnsPinnable: "ColumnsPinnable", AutoUpdate: "AutoUpdate", Height: "Height", EmptySpaceBackgroundColor: "EmptySpaceBackgroundColor", EsTableHandledSearch: "EsTableHandledSearch", MaxHeight: "MaxHeight", ContainerClass: "ContainerClass", XLSXExport: "XLSXExport", CSVExport: "CSVExport", AllSearch: "AllSearch", HighCellDensity: "HighCellDensity", Selection: "Selection", ShowLoadingOnBootstrap: "ShowLoadingOnBootstrap", Removal: "Removal", RemovalCondition: "RemovalCondition", Export: "Export", ShiftClick: "ShiftClick", CountLabel: "CountLabel", HidePaging: "HidePaging", HidePagingCount: "HidePagingCount", HidePagingButtons: "HidePagingButtons", ContextMenu: "ContextMenu", ExportFileName: "ExportFileName", TableClass: "TableClass", ExportFunction: "ExportFunction", ExportOnlyVisibleColumns: "ExportOnlyVisibleColumns", HasHeaderGroup: "HasHeaderGroup", HasSecondaryHeaderGroup: "HasSecondaryHeaderGroup", HeaderHidden: "HeaderHidden", BodyHidden: "BodyHidden", SelectionDisabled: "SelectionDisabled", SingleSelection: "SingleSelection", RowClassAssigner: "RowClassAssigner", OrderByColumn: "OrderByColumn", MultipleOrderingDirectives: "MultipleOrderingDirectives", HiddenColumns: "HiddenColumns", ColumnsOrdering: "ColumnsOrdering", SearchView: "SearchView", SelectAll: "SelectAll", UseArrayModePaging: "UseArrayModePaging", DynamicRowColumnsDefinition: "DynamicRowColumnsDefinition", DynamicOperations: "DynamicOperations", Hierarchy: "Hierarchy", ParentKey: "ParentKey", OwnKey: "OwnKey", StartsExpanded: "StartsExpanded", SavePreferences: "SavePreferences", DefaultAlignment: "DefaultAlignment", PagingStyle: "PagingStyle", RowGroupingPagingStyle: "RowGroupingPagingStyle", ItemSourceProperty: "ItemSourceProperty", UseSelectionCache: "UseSelectionCache", ShowItemGroupsColumns: "ShowItemGroupsColumns", Editable: "Editable", RangeSelection: "RangeSelection", SearchThrottle: "SearchThrottle", ArraymodeItemsPerPage: "ArraymodeItemsPerPage" }, outputs: { onOrderChanged: "onOrderChanged", onSearchRequest: "onSearchRequest", onSelectionChanged: "onSelectionChanged", onRemoval: "onRemoval", onAbortRemoval: "onAbortRemoval", onModelChange: "onModelChange", onOpenContextMenu: "onOpenContextMenu", onCornerAction: "onCornerAction", onDynamicOperation: "onDynamicOperation" }, queries: [{ propertyName: "bodyRef", first: true, predicate: ["body"], descendants: true }, { propertyName: "headerRef", first: true, predicate: ["header"], descendants: true }, { propertyName: "headerGroupRef", first: true, predicate: ["headerGroup"], descendants: true }, { propertyName: "secondaryHeaderGroupRef", first: true, predicate: ["secondaryHeaderGroup"], descendants: true }, { propertyName: "EsTdEditorDirectives", predicate: EsTdEditorDirective }, { propertyName: "EsTdsDirective", predicate: EsTdDirective }, { propertyName: "EsThsDirective", predicate: EsThDirective }], viewQueries: [{ propertyName: "inputField", first: true, predicate: ["input"], descendants: true }, { propertyName: "exportDownloader", first: true, predicate: ["exportDownloader"], descendants: true }, { propertyName: "tableEmptyMenu", first: true, predicate: ["emptyMenu"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" [ngModelOptions]=\"{'standalone': true}\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\" [style.height]=\"Height\" [style.background-color]=\"EmptySpaceBackgroundColor\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (View?.selection || arraymodeSelection)?.all\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable est-full-height {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10 est\" style=\"background-color: white;\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"(SelectAll && !SingleSelection) || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && !(View?.selection || arraymodeSelection)?.all && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups; trackBy: IDTrackBy\">\r\n                        <th *ngFor=\"let cell of level; trackBy: IDTrackBy\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned;\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"!cell.Pinned && cell.Content; Else: cell.Template\">\r\n                                {{cell.Content}}\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"arrayMode || viewMode\">\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations; trackBy: idTrackBy\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition; trackBy: PropertyNameTrackBy\">\r\n                                <ng-container *ngIf=\"rowHeader.Visible\">\r\n                                    <th *ngIf=\"OrderByColumn\"  id=\"esth_{{rowHeader.PropertyName}}\" es-th=\"{{rowHeader.PropertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.Clss || '') + (rowHeader.HeaderWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.DataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.PropertyName, $event)\">{{rowHeader.Description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" id=\"esth_{{rowHeader.PropertyName}}\" es-th=\"{{rowHeader.PropertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.Clss || '') + (rowHeader.HeaderWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.DataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.Description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs?.length > 0\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs; trackBy: IDTrackBy\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" \r\n                                            [style.width.px]=\"rowHeader.PinnedWidth\" \r\n                                            es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" \r\n                                            [Fixed]=\"rowHeader.Fixed\" \r\n                                            [Order]=\"rowHeader.Order\" \r\n                                            [Resizable]=\"ColumnsResizable\"\r\n                                            [Orderable]=\"rowHeader.Orderable\" \r\n                                            [OrderBy]=\"OrderByColumn\" \r\n                                            [SearchInProgress]=\"!!researchInProgress\" \r\n                                            (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" \r\n                                            (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n                                            \r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null } \"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs; trackBy: IDTrackBy\">\r\n\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" \r\n                                    es-th=\"{{rowHeader.ID}}\" \r\n                                    class=\"{{rowHeader.Class || ''}}\" \r\n                                    [style.text-align]=\" rowHeader.Alignment || null\"\r\n                                    [class.est-ltab-border]=\"rowHeader.LeftBorder\" \r\n                                    [class.est-rtab-border]=\"rowHeader.RightBorder\" \r\n                                    [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                    [Order]=\"rowHeader.Order\" \r\n                                    [Resizable]=\"ColumnsResizable\" \r\n                                    [Orderable]=\"rowHeader.Orderable\" \r\n                                    [OrderBy]=\"OrderByColumn\" \r\n                                    [SearchInProgress]=\"!!researchInProgress\" \r\n                                    (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null }\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions; trackBy: idTrackBy\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" [class.est-no-selection]=\"RangeSelection\">\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"PagerOptions.View?.pagingavailable || viewMode\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array; trackBy: valTrackBy\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"!RangeSelection && handleRowClick($event, item, true)\"\r\n            (contextmenu)=\"onRightClick();\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item, index: i }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, index: i, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item, index: i }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let i = index, let even = even; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"handleRowClick($event, item, false)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item, index: i }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, index: i }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item, index: i }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\">\r\n        <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-cell-group-padding\"></div>\r\n    </td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item let-index=\"index\">\r\n    <ng-container *ngIf=\"(!UseCustomCells || EmptyRowTds) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item, index: index}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEditor let-ctx>\r\n    <!-- Un po' triste ma questo \u00E8 il metodo pi\u00F9 semplice per gestire il cambio di modello -->\r\n    <ng-container *ngIf=\"ctx.item.properties\">\r\n        <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [Options]=\"ctx.definition.EditorOptions\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"ctx.item.properties[ctx.definition.PropertyName]\" name=\"{{ ctx.definition.PropertyName + '_' + ctx.item._hash }}\" [Type]=\"ctx.definition.PropertyType\" [Source]=\"ctx.definition.PropertySource\" (inputFinalized)=\"ctx.finalizer()\"></form-adaptive>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"!ctx.item.properties\">\r\n        <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [Options]=\"ctx.definition.EditorOptions\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"ctx.item[ctx.definition.PropertyName]\" name=\"{{ ctx.definition.PropertyName + '_' + ctx.item._hash }}\" [Type]=\"ctx.definition.PropertyType\" [Source]=\"ctx.definition.PropertySource\" (inputFinalized)=\"ctx.finalizer()\"></form-adaptive>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-ctx>\r\n    <!-- TODO: Formattare il valore in base a valType.type -->\r\n    <ng-container *ngIf=\"ctx.type == 'enum'\">\r\n        {{ (ctx.value | est_lookup : ctx.definition.PropertySource).description }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"ctx.type != 'enum'\">\r\n        {{ctx.value}}\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && !EmptyRowTds\">\r\n        <!-- Cella che aggrega tutte le colonne che devono essere pinnate -->\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let cell of RowTDs[item._hash]; let index = index; trackBy: IDTrackBy\">\r\n                    <ng-container *ngIf=\"cell.Pinned; let pinned = true\">\r\n                        <ng-container *ngTemplateOutlet=\"customTd; context: { $implicit: item, index: index, cell: cell, pinned: pinned };;\"></ng-container>\r\n                    </ng-container>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <!-- Body effettivo della riga -->\r\n        <ng-container *ngFor=\"let cell of RowTDs[item._hash]; let index = index; trackBy: IDTrackBy\">\r\n            <ng-container *ngIf=\"!cell.Pinned; let pinned = false\">\r\n                <ng-container *ngTemplateOutlet=\"customTd; context: { $implicit: item, index: index, cell: cell, pinned: pinned };\"></ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Cella customizzata, elemento grafico base per la tabella -->\r\n<ng-template #customTd let-item let-cell=\"cell\" let-index=\"index\" let-pinned=\"pinned\">\r\n\r\n    <!-- Customizzazione per celle con icona (sono essenzialmente operazioni semplici e basta) -->\r\n    <ng-container *ngIf=\"cell.IconClass && cell.Visible\">\r\n        <ng-container *ngIf=\"!cell.ConditionField || ((item.properties || item)[cell.ConditionField] == cell.ConditionValue)\">\r\n            <td [class.est-no-right-padding]=\"index != DynamicOperations.length -1\" [class.est-no-left-padding]=\"index != 0\" class=\"est-col-min\"><span title=\"{{cell.Title}}\" class=\"{{cell.IconClass}} est-pointer\" (click)=\"dynamicOperation(item, cell.ID)\">{{cell.Content}}</span></td>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"cell.ConditionField && ((item.properties || item)[cell.ConditionField] != cell.ConditionValue)\">\r\n            <td class=\"est-col-min est-no-side-padding\"></td>\r\n        </ng-container>\r\n    </ng-container>\r\n\r\n    <!-----------------------------------------------------------------------------------------------------------------------\r\n    -   ATTENZIONE: Gli spazi fra le propriet\u00E0 di questo mega td sono significativi e dividono la dichiarazione in sezioni: -\r\n    -   . Generiche                                                                                                         -\r\n    -   . Gestione allineamento e colori per la modalit\u00E0 report                                                             -\r\n    -   . Gestioni grafiche particolari per il Pinned                                                                       -\r\n    -   . Gestione della selezione a singola cella in assenza di pinned                                                     -\r\n    -   . Gestione click classico                                                                                           -\r\n    ------------------------------------------------------------------------------------------------------------------------->\r\n\r\n    <td *ngIf=\"!cell.IconClass && cell.Visible\" \r\n        es-td=\"{{cell.Property || cell.ID}}\"\r\n        id=\"estd_{{cell.Property || cell.ID}}_{{item._ordinal}}_{{index}}\" \r\n        class=\"{{ cell.Class }} est-default-row-height\" \r\n        [Context]=\"item._hash\" \r\n        [class.est-no-selection]=\"Editable && cell.PropertyName\" \r\n        [class.est-rg-hdr]=\"cell.GroupHeader\" \r\n        [class.est-rg-agg]=\"cell.GroupAggregation\"\r\n        [class.est-nowrap]=\"Hierarchy || !cell.Wraps\"\r\n        \r\n        [style.text-align]=\" (!pinned && cell.Alignment) ? cell.Alignment : null\"\r\n        [style.color]=\"(!pinned && item.forecolors && cell.PropAccessor) ? item.forecolors[cell.PropAccessor] : null\"\r\n        [style.background-color]=\"(!pinned && item.backcolors && cell.PropAccessor) ? item.backcolors[cell.PropAccessor] : null\"\r\n\r\n        [style.width.px]=\"pinned ? cell.PinnedWidth : null\"\r\n        [class.est-no-border]=\"pinned\"\r\n\r\n        [class.est-ltab-border]=\"cell.LeftBorder && !selectionStatus[item._ordinal][index]?.lborder\" \r\n        [class.est-rtab-border]=\"cell.RightBorder && !selectionStatus[item._ordinal][index]?.rborder\" \r\n\r\n        [class.est-selected-cell]=\"selectionStatus[item._ordinal][index]?.selected\"\r\n        [class.est-cell-lborder]=\"selectionStatus[item._ordinal][index]?.lborder\"\r\n        [class.est-cell-rborder]=\"selectionStatus[item._ordinal][index]?.rborder\"\r\n        [class.est-cell-tborder]=\"selectionStatus[item._ordinal][index]?.tborder\"\r\n        [class.est-cell-bborder]=\"selectionStatus[item._ordinal][index]?.bborder\"\r\n\r\n        [class.est-cell-lborder-tmp]=\"!cell.LeftBorder && !selectionStatus[item._ordinal][index]?.lborder && !selectionStatus[item._ordinal][index]?.loverlaps\"\r\n        [class.est-cell-rborder-tmp]=\"!cell.RightBorder && !selectionStatus[item._ordinal][index]?.rborder && !selectionStatus[item._ordinal][index]?.roverlaps\"\r\n        [class.est-cell-tborder-tmp]=\"!selectionStatus[item._ordinal][index]?.tborder && !selectionStatus[item._ordinal][index]?.toverlaps\"\r\n        [class.est-cell-bborder-tmp]=\"!selectionStatus[item._ordinal][index]?.bborder && !selectionStatus[item._ordinal][index]?.boverlaps\"\r\n\r\n        (mousedown)=\"mousedown($event, cell, item)\" \r\n        (mouseenter)=\"mouseenter($event)\" \r\n        (mouseup)=\"mouseup($event)\"\r\n        (onCellGeneration)=\"registerCell($event)\"\r\n        \r\n        (click)=\"dbClickEditOrSingleClickRowSelection($event, cell, item)\">\r\n\r\n        <div [class.est-edit-hidden]=\"cell._editing\" [class.est-pre]=\"!(Hierarchy && index == 0)\">\r\n\r\n            <ng-container #DEBUG>\r\n                <!-- Debug box in caso la roba che viene scritta nelle celle non torni. Scirvere qui i propri binding per controllare cose -->\r\n            </ng-container>\r\n\r\n            <!-- 90% Template disponibile, quindi derivante da *td, controllo giusto che non sia un field particolare multi -->\r\n            <ng-container *ngIf=\"cell.Template\">\r\n                <ng-container *ngIf=\"!cell.Multi\"><ng-container *ngTemplateOutlet=\"cell.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                <span *ngIf=\"cell.Multi\"><ng-container *ngTemplateOutlet=\"cell.Template; context: { $implicit: (item[cell.MultiProp] ? item[cell.MultiProp][cell.MultiIndex] : {}) }\"></ng-container></span>\r\n            </ng-container>\r\n            \r\n            <!-- 8%\r\n                Template non disponibile, pu\u00F2 venire da \r\n                RoutePath in caso sia un link di una tabella dinamica\r\n                PropAccessor in caso di ReportRow (quindi oggetti con \"values\"  dentro), \r\n                o Renderer se modalit\u00E0 dinamica/standard (in qual caso il renderer \u00E8 il default)\r\n            -->\r\n            <ng-container *ngIf=\"!cell.Template && !cell.Multi && !cell.Content\">\r\n                <a *ngIf=\"cell.RoutePath\" [routerLink]=\"item | est_routerlink : cell.RoutePath : cell.RouteParameterProperties\" class=\"est-link\" [innerHTML]=\"item.properties ? item.properties[cell.PropertyName] : item[cell.PropertyName]\"></a>\r\n                \r\n                <span *ngIf=\"cell.PropAccessor\">\r\n                    {{(item.values? item.values[cell.PropAccessor] : item[cell.PropAccessor]) | est_format: cell.Format }}\r\n                </span>\r\n\r\n                <ng-container *ngIf=\"!cell.PropAccessor && !cell.RoutePath\">\r\n                    <ng-container *ngTemplateOutlet=\"cell.PropertyName | est_renderer: { name: cell.RendererName, src: EsTdsDirective, fallback: defaultEsTd }; context: { $implicit: { definition: cell, value: item.properties ? item.properties[cell.PropertyName] : item[cell.PropertyName], type: cell.PropertyType} }\"></ng-container>\r\n                </ng-container>\r\n            </ng-container>\r\n\r\n            <!-- 1% Se in modalit\u00E0 gerarchica metto il td per navigare la gerarchia -->\r\n            <ng-container *ngIf=\"Hierarchy && index == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <!-- 1% Content programmatico per le casistiche di Row Grouping ecc... -->\r\n            <ng-container *ngIf=\"cell.Content\">\r\n                {{cell.Content}}\r\n            </ng-container>\r\n        </div>\r\n\r\n        <div *ngIf=\"cell._editing\" class=\"est-mt-min-5\">\r\n            <ng-container *ngTemplateOutlet=\"cell.PropertyName | est_editor: { name: cell.EditorName, src: EsTdEditorDirectives, fallback: defaultEditor}; context: { $implicit: { definition: cell, columnIndex: index, item: item, finalizer: finalizeUserEdit.bind(this, cell, item, index) } }\"></ng-container>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Navigatore della gerarchia di una view gerarchica, con tasto per espandere e collassare -->\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem><span><em>{{'No operations available' | localize : lc}}...</em></span></ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last; trackBy: idTrackBy\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last; trackBy: idTrackBy\">\r\n                                                <ng-container *ngIf=\"parent.tmpl\"><ng-container *ngTemplateOutlet=\"parent.tmpl\"></ng-container></ng-container>\r\n                                                <ng-container *ngIf=\"parent.content\">{{parent.content}}</ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template; context: { $implicit: item.multi ? item.multiContent : null }\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@charset \"UTF-8\";.est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-default-row-height{height:31px}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-edit-hidden{visibility:hidden;height:1px!important}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-full-height{height:100%}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:1px solid #bbb!important}.est-rtab-border{border-right:1px solid #bbb!important}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-selected-cell{background-color:#2196f333}.est-cell-lborder{border-left:1.02px solid #2196f3!important}.est-cell-tborder{border-top:1.02px solid #2196f3!important}.est-cell-rborder{border-right:1.02px solid #2196f3!important}.est-cell-bborder{border-bottom:1.02px solid #2196f3!important}.est-cell-lborder-tmp{border-left:1.02px solid transparent!important}.est-cell-tborder-tmp{border-top:1.02px solid transparent!important}.est-cell-rborder-tmp{border-right:1.02px solid transparent!important}.est-cell-bborder-tmp{border-bottom:1.02px solid transparent!important}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.est-pre{white-space:pre}.est val-datetime .mat-form-field-appearance-outline .mat-form-field-infix input{margin-bottom:3px!important;min-width:130px!important}.est .mat-form-field-flex{height:29px!important;padding:0!important}.est .mat-form-field-flex .mat-form-field-outline{color:#00f}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-start{border-left:none;border-top:none;border-radius:0}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-end{border-top:none;border-radius:0;border-right:none}.est .mat-form-field-wrapper{height:20px;min-height:20px!important;margin-top:0!important}.est .mat-form-field-infix{width:100%!important;min-width:50px!important}.est .mat-form-field-infix select.mat-input-element{margin-top:-5px!important}.est .mat-datepicker-input{margin-bottom:3px!important}.est input{height:20px;padding-top:0!important}\n"], components: [{ type: EsTh, selector: "[es-th]", inputs: ["es-th", "Order", "Orderable", "Display", "Resizable", "Pinned", "SearchInProgress", "OrderBy", "Wrap", "Fixed", "Template", "Visible"], outputs: ["onOrderChange", "onUnpinning"] }, { type: TablePagerComponent, selector: "app-paging", inputs: ["CurrentPageSize", "View", "WarnOnAll", "AllSearch", "DefaultAll", "GroupMode", "GroupCount", "CountLabel", "ShowCount", "ShowPaging", "PagerCount", "Hidden"], outputs: ["pagingSelected"] }, { type: i10.FormAdaptiveComponent, selector: "form-adaptive", inputs: ["Type", "TypeMissingMessage", "Pattern", "AdjustNumber", "AllowDownload", "Precision", "Alignment", "SearchFunction", "MinChars", "CaseSensitive", "Options"] }, { type: EsTd, selector: "[es-td]", inputs: ["es-td", "Context"], outputs: ["onCellGeneration"] }, { type: i12.ContextMenuComponent, selector: "context-menu", inputs: ["menuClass", "autoFocus", "useBootstrap4", "disabled"], outputs: ["close", "open"] }], directives: [{ type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i13.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i14.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { type: i14.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i14.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i12.ContextMenuAttachDirective, selector: "[contextMenu]", inputs: ["contextMenuSubject", "contextMenu"] }, { type: i15.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i12.ContextMenuItemDirective, selector: "[contextMenuItem]", inputs: ["subMenu", "divider", "enabled", "passive", "visible"], outputs: ["execute"] }, { type: i16.ModalDirective, selector: "[bsModal]", inputs: ["config", "closeInterceptor"], outputs: ["onShow", "onShown", "onHide", "onHidden"], exportAs: ["bs-modal"] }, { type: i17.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i17.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i17.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }], pipes: { "localize": i2.LocalizePipe, "number": i13.DecimalPipe, "est_lookup": EstLookupPipe, "est_routerlink": EstRouterLinkPipe, "est_format": EstFormatPipe, "est_renderer": EstRendererPipe, "est_editor": EstEditorPipe }, viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'es-table', viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (View?.selection || arraymodeSelection)?.all\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10 est\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"(SelectAll && !SingleSelection) || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && !(View?.selection || arraymodeSelection)?.all && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups\">\r\n                        <th *ngFor=\"let cell of level\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned;\">\r\n                                <div class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"!cell.Pinned && cell.Content; Else: cell.Template\">\r\n                                {{cell.Content}}\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"arrayMode || viewMode\">\r\n\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition\">\r\n                                <ng-container *ngIf=\"rowHeader.visible\">\r\n                                    <th *ngIf=\"OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.propertyName, $event)\">{{rowHeader.description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" es-th=\"{{rowHeader.propertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.clss || '') + (rowHeader.headerWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.dataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs && RowTHs.length > 0\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" [style.width.px]=\"rowHeader.PinnedWidth\" es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" [Fixed]=\"rowHeader.Fixed\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null } \"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs\">\r\n\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" es-th=\"{{rowHeader.ID}}\" class=\"{{rowHeader.Class || ''}}\" [class.est-ltab-border]=\"rowHeader.LeftBorder\" [class.est-rtab-border]=\"rowHeader.RightBorder\" [class.est-nowrap]=\"!rowHeader.Wrap\" [Order]=\"rowHeader.Order\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null }\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Link nascosto che serve a scaricare il file -->\r\n                        <a *ngIf=\"headers\" hidden #exportDownloader csvLink [data]=\"data\" [headers]=\"headers\" [delimiter]=\"';'\" [filename]=\"ExportFileName.endsWith('.xlsx') ? ExportFileName.replace('.xlsx', '.csv') : ExportFileName.endsWith('.csv') ? ExportFileName : ExportFileName + '.csv'\"></a>\r\n\r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" >\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"View?.pagingavailable || viewMode\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n            <div *ngIf=\"!PagerOptions.ShowPaging\"><em>{{'Paging options are not available for this report' | localize: lc}}</em></div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, true)\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even;\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"!UseCustomCells && handleRowClick($event, item, false)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"dynamicColumns; context: { $implicit: item }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\"><div class=\"est-pinned-border est-cell-group-padding\"></div></td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || EmptyRowTds) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle definite in maniera dinamica dal modello -->\r\n<ng-template #dynamicColumns let-item>\r\n    <ng-container *ngIf=\"(!UseCustomCells || EmptyRowTds) && DynamicRowColumnsDefinition\">\r\n        <ng-container *ngFor=\"let operation of DynamicOperations; let first = first; let last = last;\">\r\n            <ng-container *ngIf=\"!operation.conditionField || (item.properties[operation.conditionField] == operation.conditionValue)\">\r\n                <td [class.est-no-right-padding]=\"last\" [class.est-no-left-padding]=\"!first\" class=\"est-col-min\"><span title=\"{{operation.title}}\" class=\"{{operation.iconClass}} est-pointer\" (click)=\"dynamicOperation(item, operation.id)\">{{operation.text}}</span></td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"operation.conditionField && (item.properties[operation.conditionField] != operation.conditionValue)\">\r\n                <td class=\"est-col-min est-no-side-padding\"></td>\r\n            </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let rowItem of DynamicRowColumnsDefinition\">\r\n            <ng-container *ngIf=\"rowItem.routePath && rowItem.visible\">\r\n                <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n                    <a [routerLink]=\"dynamicMode_H.generateRouterLink(rowItem.routePath, rowItem.routeParameterProperties, item)\" class=\"est-link\" [innerHTML]=\"item.properties[rowItem.propertyName]\"></a>\r\n                </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"!rowItem.routePath && rowItem.visible\">\r\n                <ng-container *ngTemplateOutlet=\"findEsTd(rowItem.propertyName) || defaultEsTd; context: { $implicit: item.properties[rowItem.propertyName], rowItem : rowItem, item : item }\"> </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-value let-rowItem='rowItem' let-item='item'>\r\n    <td es-td=\"{{rowItem.propertyName}}\" class=\"{{UserDefinedDynamicCols ? rowItem.clss : 'est-nowrap'}}\" [Internal]=\"false\" [Context]=\"item._hash\">\r\n        {{value}}\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale delle celle custom se configurate -->\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && !EmptyRowTds\">\r\n\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n                    <td *ngIf=\"rowItem && rowItem.Pinned\" [style.width.px]=\"rowItem.PinnedWidth\" es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-no-selection]=\"!!rowItem.UserEdits\" [class.est-no-border]=\"true\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" [class.est-pre]=\"!(Hierarchy && i == 0)\">\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: rowItem.Multi ? (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) : item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <ng-container *ngIf=\"!rowItem.Template && !rowItem.Multi\">\r\n                                <span *ngIf=\"rowItem.Content && !rowItem.PropAccessor\">{{rowItem.Content}}</span>\r\n                                <span *ngIf=\"!rowItem.Content && rowItem.PropAccessor\">{{item.values? item.values[rowItem.PropAccessor] : item[rowItem.PropAccessor]}}</span>\r\n                            </ng-container>\r\n                        </div>\r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\">\r\n                            <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" [Source]=\"rowItem.UserEdits.Source\" (inputChange)=\"finalizeUserEdit(rowItem, item)\" (inputFocus)=\"$event.stopPropagation();\" ></form-adaptive>\r\n                        </div>\r\n                    </td>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <ng-container *ngFor=\"let rowItem of RowTDs[item._hash]; let i = index\">\r\n            <ng-container *ngIf=\"rowItem && !rowItem.Pinned\">\r\n\r\n                <!-- Casistica senza bodyRef, quindi con direttive per i td -->\r\n                <ng-container *ngIf=\"!bodyRef && rowItem.Visible\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-ltab-border]=\"rowItem.LeftBorder\" [class.est-rtab-border]=\"rowItem.RightBorder\" [class.est-no-selection]=\"!!rowItem.UserEdits\" [class.est-rg-hdr]=\"rowItem.GroupHeader\" [class.est-rg-agg]=\"rowItem.GroupAggregation\" \r\n                        [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\" (click)=\"dbClickEditOrSingleClickRowSelection($event, rowItem, item)\">\r\n\r\n                        <div [class.est-edit-hidden]=\"rowItem._editing\" [class.est-pre]=\"!(Hierarchy && i == 0)\" >\r\n                            <ng-container *ngIf=\"Hierarchy && i == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <ng-container *ngIf=\"!rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                            <span *ngIf=\"rowItem.Multi && rowItem.Template\"><ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: (item[rowItem.MultiProp] ? item[rowItem.MultiProp][rowItem.MultiIndex] : {}) }\"></ng-container></span>\r\n                            <ng-container *ngIf=\"!rowItem.Template && !rowItem.Multi\">\r\n                                <span *ngIf=\"rowItem.Content && !rowItem.PropAccessor\">{{rowItem.Content}}</span>\r\n                                <span *ngIf=\"!rowItem.Content && rowItem.PropAccessor\">{{item.values? item.values[rowItem.PropAccessor] : item[rowItem.PropAccessor]}}</span>\r\n                            </ng-container>\r\n                        </div>\r\n                        <div *ngIf=\"rowItem._editing\" class=\"est-mt-min-5\">\r\n                            <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"item[rowItem.UserEdits.Property]\" name=\"{{ rowItem.UserEdits.Property + '_' + item._hash }}\" [Type]=\"rowItem.UserEdits.Type\" [Source]=\"rowItem.UserEdits.Source\" (inputFinalized)=\"finalizeUserEdit(rowItem, item)\"></form-adaptive>\r\n                        </div>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <a [routerLink]='rowItem.RouterLink' class=\"est-link\" [innerHTML]=\"rowItem.Content\"></a>\r\n                    </td>\r\n                </ng-container>\r\n\r\n                <!-- Casistica bodyRef, quindi con componenti per i td (NON RouterLink) DEPRECATO -->\r\n                <ng-container *ngIf=\"!rowItem.RouterLink && rowItem.Visible && bodyRef\">\r\n                    <td es-td=\"{{rowItem.ID}}\" class=\"{{rowItem.Class}}\" [class.est-nowrap]=\"Hierarchy || !rowItem.Wraps\" [Internal]=\"true\">\r\n                        <ng-container *ngIf=\"Hierarchy && i == 0\">\r\n                            <ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"rowItem.Template\">\r\n                            <ng-container *ngTemplateOutlet=\"rowItem.Template; context: { $implicit: item }\"></ng-container>\r\n                        </ng-container>\r\n                        <span *ngIf=\"!rowItem.Template\" [innerHTML]=\"rowItem.Content\"></span>\r\n                    </td>\r\n                </ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Questo template contiene i pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem>\r\n        <span>\r\n            <em>{{'No operations available' | localize : lc}}...</em>\r\n        </span>\r\n    </ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last\">\r\n                                                <ng-container *ngIf=\"parent.tmpl\"><ng-container *ngTemplateOutlet=\"parent.tmpl\"></ng-container></ng-container>\r\n                                                <ng-container *ngIf=\"parent.content\">{{parent.content}}</ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template; context: { $implicit: item.multi ? item.multiContent : null }\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@charset \"UTF-8\";.est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-edit-hidden{visibility:hidden;height:1px!important}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:2px solid #bbb}.est-rtab-border{border-right:2px solid #bbb}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.est-pre{white-space:pre}.est val-datetime .mat-form-field-appearance-outline .mat-form-field-infix input{margin-bottom:3px!important;min-width:130px!important}.est .mat-form-field-flex{height:29px!important;padding:0!important}.est .mat-form-field-flex .mat-form-field-outline{color:#00f}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-start{border-left:none;border-top:none;border-radius:0}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-end{border-top:none;border-radius:0;border-right:none}.est .mat-form-field-wrapper{height:20px;min-height:20px!important;margin-top:0!important}.est .mat-form-field-infix{width:100%!important;min-width:50px!important}.est .mat-form-field-infix select.mat-input-element{margin-top:-5px!important}.est .mat-datepicker-input{margin-bottom:3px!important}.est input{height:20px;padding-top:0!important}\n"] }]
+            args: [{ selector: 'es-table', viewProviders: [{ provide: LocalizationService, useClass: EsTableLoc }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!-- Patacchino di autoaggiornamento -->\r\n<div class=\"w-100\" *ngIf=\"AutoUpdate\">\r\n    <div class=\"pull-right\">\r\n        {{'Update every' | localize : lc}}&nbsp;<input [readonly]=\"autoUpdate\" maxlength=\"3\" class=\"form-control est-custom-input\" type=\"text\" [(ngModel)]=\"seconds\" [ngModelOptions]=\"{'standalone': true}\" />&nbsp;{{'second/s' | localize : lc}}\r\n    </div>\r\n    <div class=\"pull-right m-t-2\">\r\n        <label class=\"est-switch\">\r\n            <input type=\"checkbox\" [(ngModel)]=\"autoUpdate\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"autoUpdateChanged();\" />\r\n            <div class=\"est-slider round\"></div>\r\n        </label>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n\r\n<div *ngIf=\"View\" class=\"est-relative\" [style.height]=\"Height\" [style.background-color]=\"EmptySpaceBackgroundColor\">\r\n    <div *ngIf=\"FirstBind && ShowLoadingOnBootstrap\" class=\"est-loading-box\">\r\n        <div class=\"est-loading-content\">\r\n            <span class=\"fa fa-spinner fa-spin\"></span>&nbsp;{{'Performing Table bootstrap' | localize: lc}}...\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"est-top-pager\" *ngIf=\"PagingStyle == 'both' || PagingStyle == 'top'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n\r\n    <div class=\"est-top-allselect\" *ngIf=\"canSelectAll || (View?.selection || arraymodeSelection)?.all\">\r\n        <span>{{ (selectedObjects == -1 ? ('All the' | localize : lc) : ((selectedObjects || 0) | number : '0.0-0' : locale)) + ' ' + ((selectedObjects == 1 ? 'Object Selected' : 'Objects Selected') | localize : lc) }}</span>&nbsp;\r\n        <span class=\"est-link est-inline\" (click)=\"selection_H.selectAllOrResetSelection()\">{{ (View?.selection || arraymodeSelection)?.all ? ('Reset Selection' | localize : lc) : ('Select Everything' | localize : lc)}}</span>\r\n    </div>\r\n\r\n    <div class=\"table-responsive datatable est-full-height {{ContainerClass}}\" [style.max-height.px]=\"MaxHeight\">\r\n        <table class=\"{{ TableClass }} est-margin-bottom-10 est\" style=\"background-color: white;\"  [class.est-high-density]=\"HighCellDensity\">\r\n            <thead [hidden]=\"HeaderHidden || FirstBind\">\r\n                <!-- Aggiungo il pezzo che gestisce la selezione di tutto se attivo da config -->\r\n                <tr *ngIf=\"(SelectAll && !SingleSelection) || PagingStyle != 'bottom'\">\r\n                    <th class=\"est-no-selection\" [attr.colspan]=\"Columns.Global\" [class.est-hidden-view]=\"!canSelectAll && !(View?.selection || arraymodeSelection)?.all && PagingStyle == 'bottom'\">\r\n                        <p class=\"est-hidden-view app-margin-bottom-0\">\u00A7</p>\r\n                    </th>\r\n                </tr>\r\n\r\n                <!-- Blocco header group -->\r\n                <ng-container *ngIf=\"RowThGroups\">\r\n                    <tr *ngFor=\"let level of RowThGroups; trackBy: IDTrackBy\">\r\n                        <th *ngFor=\"let cell of level; trackBy: IDTrackBy\" [attr.colspan]=\"cell.Span\" \r\n                            [class.est-pinned-header]=\"cell.Pinned\" [class.est-col-min]=\"cell.Pinned\"\r\n                            [class.est-ltab-border]=\"cell.Borders\" [class.est-rtab-border]=\"cell.Borders\"\r\n                            class=\"est-text-center\">\r\n                            <ng-container *ngIf=\"cell.Pinned;\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-cell-group-padding\"></div>\r\n                            </ng-container>\r\n                            <ng-container *ngIf=\"!cell.Pinned && cell.Content; Else: cell.Template\">\r\n                                {{cell.Content}}\r\n                            </ng-container>\r\n                        </th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <ng-container *ngIf=\"!RowThGroups\">\r\n                    <tr *ngIf=\"HasHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"headerGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n    \r\n                    <!-- Blocco header group secondario -->\r\n                    <tr *ngIf=\"HasSecondaryHeaderGroup\">\r\n                        <ng-container *ngTemplateOutlet=\"secondaryHeaderGroupRef\"></ng-container>\r\n                        <th *ngIf=\"Export\"></th>\r\n                    </tr>\r\n                </ng-container>\r\n\r\n                <!-- Blocco effettivo degli header -->\r\n                <tr>\r\n                    <!-- Aggiungo una checkbox se la selezione \u00E8 attiva -->\r\n                    <th class=\"est-col-min\" *ngIf=\"Selection && !HasPinnedColumns\">\r\n                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                    </th>\r\n\r\n                    <!-- Header che valgono per view mode e array mode -->\r\n                    <ng-container *ngIf=\"arrayMode || viewMode\">\r\n                        <!-- In una tabella base prendo semplicemente i th scritti dall'utente nell'HTML -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && !DynamicRowColumnsDefinition\">\r\n                            <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se ho un modello dinamico dell'oggetto creo le colonne in base alle propriet\u00E0 -->\r\n                        <ng-container *ngIf=\"(!UseCustomCells || !RowTHs || RowTHs.length == 0) && DynamicRowColumnsDefinition\">\r\n                            <th *ngFor=\"let operation of DynamicOperations; trackBy: idTrackBy\" class=\"est-col-min est-no-side-padding\"></th>\r\n                            \r\n                            <ng-container *ngFor=\"let rowHeader of DynamicRowColumnsDefinition; trackBy: PropertyNameTrackBy\">\r\n                                <ng-container *ngIf=\"rowHeader.Visible\">\r\n                                    <th *ngIf=\"OrderByColumn\"  id=\"esth_{{rowHeader.PropertyName}}\" es-th=\"{{rowHeader.PropertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.Clss || '') + (rowHeader.HeaderWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.DataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\" [SearchInProgress]=\"!!researchInProgress\" (onOrderChange)=\"thOrderChanged(rowHeader.PropertyName, $event)\">{{rowHeader.Description}}</th>\r\n                                    <th *ngIf=\"!OrderByColumn\" id=\"esth_{{rowHeader.PropertyName}}\" es-th=\"{{rowHeader.PropertyName}}\" class=\"{{UserDefinedDynamicCols ? ((rowHeader.Clss || '') + (rowHeader.HeaderWraps ? '' : ' est-nowrap')) : ' est-nowrap'}}\" [Order]=\"rowHeader.DataOrder\" [Resizable]=\"ColumnsResizable\" [Orderable]=\"rowHeader.Orderable\" [OrderBy]=\"OrderByColumn\">{{rowHeader.Description}}</th>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                        </ng-container>\r\n\r\n                        <!-- Se non ho un modello dinamico ma invece delle celle custom, genero gli header in base ai row th -->\r\n                        <ng-container *ngIf=\"UseCustomCells && RowTHs?.length > 0\">\r\n                            <th *ngIf=\"HasPinnedColumns\" class=\"est-pinned-header est-col-min\">\r\n                                <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-simple-border-bottom\">\r\n                                    <th class=\"est-col-min est-no-border\" *ngIf=\"Selection\" [style.width.px]=\"20\">\r\n                                        <input *ngIf=\"!SingleSelection\" class=\"est-pointer\" type=\"checkbox\" [disabled]=\"SelectionDisabled\" [(ngModel)]=\"globalCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"globalCheckChanged();\">\r\n                                    </th>\r\n                                    <ng-container *ngFor=\"let rowHeader of RowTHs; trackBy: IDTrackBy\">\r\n                                        <th *ngIf=\"rowHeader && rowHeader.Visible && rowHeader.Pinned\" \r\n                                            [style.width.px]=\"rowHeader.PinnedWidth\" \r\n                                            es-th=\"{{rowHeader.ID}}\" \r\n                                            class=\"{{rowHeader.Class || ''}}\" \r\n                                            [class.est-pinned-internal-header]=\"true\" \r\n                                            [class.est-no-border]=\"true\" \r\n                                            [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                            [Pinned]=\"true\" \r\n                                            [Fixed]=\"rowHeader.Fixed\" \r\n                                            [Order]=\"rowHeader.Order\" \r\n                                            [Resizable]=\"ColumnsResizable\"\r\n                                            [Orderable]=\"rowHeader.Orderable\" \r\n                                            [OrderBy]=\"OrderByColumn\" \r\n                                            [SearchInProgress]=\"!!researchInProgress\" \r\n                                            (onUnpinning)=\"columnMetadata_H.unpinColumn($event)\" \r\n                                            (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n                                            \r\n                                            <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null } \"></ng-container></ng-container>\r\n                                            <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                        </th>\r\n                                    </ng-container>\r\n                                </div>\r\n                            </th>\r\n                            <ng-container *ngFor=\"let rowHeader of RowTHs; trackBy: IDTrackBy\">\r\n\r\n                                <th *ngIf=\"rowHeader && rowHeader.Visible && !rowHeader.Pinned\" \r\n                                    es-th=\"{{rowHeader.ID}}\" \r\n                                    class=\"{{rowHeader.Class || ''}}\" \r\n                                    [style.text-align]=\" rowHeader.Alignment || null\"\r\n                                    [class.est-ltab-border]=\"rowHeader.LeftBorder\" \r\n                                    [class.est-rtab-border]=\"rowHeader.RightBorder\" \r\n                                    [class.est-nowrap]=\"!rowHeader.Wrap\" \r\n                                    [Order]=\"rowHeader.Order\" \r\n                                    [Resizable]=\"ColumnsResizable\" \r\n                                    [Orderable]=\"rowHeader.Orderable\" \r\n                                    [OrderBy]=\"OrderByColumn\" \r\n                                    [SearchInProgress]=\"!!researchInProgress\" \r\n                                    (onOrderChange)=\"thOrderChanged(rowHeader.ID, $event)\">\r\n\r\n                                    <ng-container *ngIf=\"rowHeader.Template\"><ng-container *ngTemplateOutlet=\"rowHeader.Template; context: { $implicit: rowHeader.Multi ? rowHeader.MultiContent : null }\"></ng-container></ng-container>\r\n                                    <span *ngIf=\"!rowHeader.Template\">{{rowHeader.Content}}</span>\r\n                                </th>\r\n                            </ng-container>\r\n                        </ng-container>\r\n                    </ng-container>\r\n\r\n                    <!--Per l'eliminazione mi serve un header aggiuntivo-->\r\n                    <th *ngIf=\"Removal\" [class.est-right-9]=\"Export || HiddenColumns\" class=\"est-col-min est-sticky-last-column\"><span class=\"fa fa-trash\"></span></th>\r\n\r\n                    <!--Per l'esportazione mi serve l'header extra da cui faccio uscire i 3 pallocchi-->\r\n                    <th *ngIf=\"Export || HiddenColumns || ColumnsOrdering || CornerMenuOptions\" class=\"est-table-dotted-menu est-sticky-last-column est-col-min text-sm-center\">\r\n                        \r\n                        <!-- Blocco con i 3 pallocchi che tira fuori il context menu delle operazioni -->\r\n                        <div class=\"btn-group\" container=\"body\" placement=\"bottom right\" dropdown #dropdown=\"bs-dropdown\" [autoClose]=\"true\">\r\n                            <span dropdownToggle class=\"fa fa-ellipsis-v est-fs-18 est-pointer est-padding-3\"></span>\r\n\r\n                            <div *dropdownMenu class=\"dropdown-menu dropdown-menu-right est-bring-to-front-strong\">\r\n                                <div class=\"est-pointer\">\r\n                                    <a class=\"dropdown-item\" *ngIf=\"HiddenColumns || ColumnsOrdering\" (click)=\"columnMetadata_H.resetColumnVisSelection(); changeColumnVisibilityModal.show();\">\r\n                                        <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                                            {{'Columns Visibility' | localize : lc}}\r\n                                        </ng-container>\r\n                                        <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                                            {{'Columns Visibility and Order' | localize : lc}}\r\n                                        </ng-container>\r\n                                    </a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && CSVExport\" (click)=\"export_H.tryExport('CSV')\">{{'Export View' | localize : lc}} (CSV)</a>\r\n                                    <a class=\"dropdown-item\" *ngIf=\"Export && XLSXExport\" (click)=\"export_H.tryExport('XLSX')\">{{'Export View' | localize : lc}} (XLSX)</a>\r\n                                    <a class=\"dropdown-item\" *ngFor=\"let option of CornerMenuOptions; trackBy: idTrackBy\" (click)=\"cornerActionClicked(option.id)\">{{option.description}}</a>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </th>\r\n                </tr>\r\n            </thead>\r\n\r\n            <tbody [hidden]=\"BodyHidden || FirstBind\" [class.est-no-selection]=\"RangeSelection\">\r\n                <!--Con selection attiva richiamo il template che gestisce il context menu-->\r\n                <ng-container *ngIf=\"Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBodySelection; context: { $implicit: { selDisabled: arrayMode ? false : SelectionDisabled, sel: Selection }}\"></ng-container>\r\n                </ng-container>\r\n\r\n                <!--Senza selection richiamo il template che NON gestisce il context menu-->\r\n                <ng-container *ngIf=\"!Selection\">\r\n                    <ng-container *ngTemplateOutlet=\"TBody\"></ng-container>\r\n                </ng-container>\r\n            </tbody>\r\n        </table>\r\n    </div>\r\n\r\n    <div *ngIf=\"PagingStyle == 'both' || PagingStyle == 'bottom'\">\r\n        <ng-container *ngTemplateOutlet=\"pagingElement\"></ng-container>\r\n    </div>\r\n</div>\r\n\r\n<!-- Template che contiene tutte le info di paginazione in modo da poterlo replicare anche sopra -->\r\n<ng-template #pagingElement>\r\n    <ng-container *ngIf=\"!FirstBind\">\r\n        <!-- Pulsanti avanti-indietro di paginazione -->\r\n        <div *ngIf=\"PagerOptions.ShowPaging && PagerOptions.ShowButtons && (PagerOptions.PagerCount > 10 || PagerOptions.PagerCount == -1)\" class=\"pull-right btn-toolbar\">\r\n            <ng-container *ngIf=\"PagerOptions.View?.pagingavailable || viewMode\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: addToPage.bind(this), GTP: goToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"arrayMode && UseArrayModePaging && !SearchView\">\r\n                <ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { Margin: true, ATP: arrayAddToPage.bind(this), GTP: arrayGoToPage.bind(this), Array: arrayPulsanti }}\"></ng-container>\r\n            </ng-container>\r\n        </div>\r\n        <!-- Paginatore dove appare la count e le opzioni di paginazione -->\r\n        <div class=\"pull-right\" *ngIf=\"PagerOptions.ShowCount || PagerOptions.ShowPagingOptions\">\r\n            <div class=\"est-mt-min-5\" *ngIf=\"PagerOptions.ShowPaging\">\r\n                <app-paging *ngIf=\"!PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [WarnOnAll]=\"false\" [CurrentPageSize]=\"ArraymodeItemsPerPage\" (pagingSelected)=\"items_H.refreshPaging($event)\"></app-paging>\r\n                <app-paging *ngIf=\"PagerOptions.UsesView\" [CountLabel]=\"CountLabel\" [ShowPaging]=\"PagerOptions.ShowPagingOptions\" [ShowCount]=\"PagerOptions.ShowCount\" [PagerCount]=\"PagerOptions.PagerCount\" [GroupMode]=\"PagerOptions.Searches == 'groups'\" [AllSearch]=\"AllSearch\" [View]=\"PagerOptions.View\" (pagingSelected)=\"onItemsPerPageChanged($event);\"></app-paging>\r\n            </div>\r\n        </div>\r\n        <div class=\"clearfix\"></div>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Template che contiene i pulsanti per cambiare pagina -->\r\n<ng-template #pagingButtons let-options>\r\n    <div class=\"est-flex\" [class.est-margin-left-50]=\"options.Margin\">\r\n        <a class=\"btn\" class=\"est-page-prev app-pointer\" (click)=\"options.ATP(-1, options.separator)\"><span class=\"fa fa-chevron-left\"></span></a>\r\n        <div *ngIf=\"options.Array\" class=\"est-inline\"><a *ngFor=\"let p of options.Array; trackBy: valTrackBy\" class=\"btn est-page-sel {{p.cssClass}}\" (click)=\"options.GTP(p.val, options.separator)\">{{p.val}}</a></div>\r\n        <a class=\"btn\" class=\"est-page-next app-pointer\" (click)=\"options.ATP(1, options.separator)\"><span class=\"fa fa-chevron-right\"></span></a>\r\n    </div>\r\n</ng-template>\r\n\r\n<!-- Questi due template rappresentano effettivamente il body della tabella. essendo il tr l'unica cosa che davvero cambia, il resto \u00E8 templatizzato -->\r\n<ng-template #TBodySelection let-templateOptions>\r\n    <ng-container *ngFor=\"let item of boundSource; let even = even; let i=index; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || (!Hierarchy && !ArrayGrouping)\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\" \r\n            [class.est-pointer]=\"!item.locked\" \r\n            [class.est-white-selected]=\"item._selected && !item.locked\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            [contextMenu]=\"!item.locked ? (ContextMenu || emptyMenu) : emptyMenu\" [contextMenuSubject]=\"item\"\r\n            (click)=\"!RangeSelection && handleRowClick($event, item, true)\"\r\n            (contextmenu)=\"onRightClick();\">\r\n\r\n            <td *ngIf=\"!item.locked && !item._sep && !HasPinnedColumns\">\r\n                <input  type=\"checkbox\" \r\n                        [disabled]=\"templateOptions.selDisabled\" \r\n                        [class.est-pointer]=\"!item.locked\"\r\n                        [(ngModel)]=\"item._selected\" name=\"check{{i}}\" \r\n                        (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n            </td>\r\n            <td *ngIf=\"(item.locked || item._sep) && !HasPinnedColumns\"></td>\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container> </ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item, index: i }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, index: i, templateOptions: templateOptions }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item, index: i }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #TBody>\r\n    <ng-container *ngFor=\"let item of boundSource; let i = index, let even = even; trackBy: bodyTrackBy\">\r\n        <tr *ngIf=\"item._visible || !Hierarchy\" \r\n            [class]=\"item._rowClass ? item._rowClass : ''\" \r\n            [class.est-line-through]=\"item.removed || item.deleted\"\r\n            [class.est-rg]=\"item._group\"\r\n            [class.est-rg-sep]=\"item._sep\"\r\n            (click)=\"handleRowClick($event, item, false)\">\r\n\r\n            <ng-container *ngIf=\"item._sep\"><ng-container *ngTemplateOutlet=\"groupPager; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <ng-container *ngIf=\"!item._sep\">\r\n                <ng-container *ngTemplateOutlet=\"basicColumns; context: { $implicit: item, index: i }\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"customCells; context: { $implicit: item, index: i }\"></ng-container>\r\n            </ng-container>\r\n            <ng-container *ngTemplateOutlet=\"bodyDeleteAndExport; context: { $implicit: { even: even, item: item, index: i }}\"></ng-container>\r\n        </tr>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #groupPager let-item>\r\n    <td class=\"est-pinned-body \" *ngIf=\"HasPinnedColumns\">\r\n        <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border est-cell-group-padding\"></div>\r\n    </td>\r\n    <td *ngIf=\"item._grouplevel > 1\" [attr.colspan]=\"item._grouplevel-1\"></td>\r\n    <td [attr.colspan]=\"Columns.VisibleUnpinned - (item._grouplevel > 0 ? item._grouplevel - 1 : 0)\">\r\n        <div class=\"est-rg-sep-flex-right\" *ngIf=\"RowGroupingPagingStyle == 'right'\">\r\n            <div class=\"est-rg-page\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n            <div class=\"est-rg-ipp\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><app-paging [CountLabel]=\"CountLabel\" [AllSearch]=\"AllSearch\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n        </div>\r\n\r\n        <div class=\"est-rg-sep-flex-left\" *ngIf=\"RowGroupingPagingStyle == 'left'\">\r\n            <div class=\"est-rg-ipp\"><app-paging [AllSearch]=\"AllSearch\" [CountLabel]=\"CountLabel\" [GroupMode]=\"item.searches == 'groups'\" [PagerCount]=\"item.searches == 'groups' ? item.view.groupcount : item.view.objectcount\" [View]=\"item.view\" (pagingSelected)=\"onGroupItemsPerPageChanged(item, $event);\"></app-paging></div>\r\n            <div class=\"est-rg-page\" *ngIf=\"(item.searches == 'groups' ? item.view.groupcount : item.view.objectcount) > 10\"><ng-container *ngTemplateOutlet=\"pagingButtons; context: { $implicit: { separator: item, ATP: addToPageGroup.bind(this), GTP: goToPageGroup.bind(this), Array: item.buttons }}\"></ng-container></div>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Questo template contiene la print condizionale su tabelle semplici, con header e body scritti a manazza -->\r\n<ng-template #basicColumns let-item let-index=\"index\">\r\n    <ng-container *ngIf=\"(!UseCustomCells || EmptyRowTds) && !DynamicRowColumnsDefinition\">\r\n        <ng-container *ngTemplateOutlet=\"bodyRef; context : {$implicit: item, index: index}\"></ng-container>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEditor let-ctx>\r\n    <!-- Un po' triste ma questo \u00E8 il metodo pi\u00F9 semplice per gestire il cambio di modello -->\r\n    <ng-container *ngIf=\"ctx.item.properties\">\r\n        <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [Options]=\"ctx.definition.EditorOptions\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"ctx.item.properties[ctx.definition.PropertyName]\" name=\"{{ ctx.definition.PropertyName + '_' + ctx.item._hash }}\" [Type]=\"ctx.definition.PropertyType\" [Source]=\"ctx.definition.PropertySource\" (inputFinalized)=\"ctx.finalizer()\"></form-adaptive>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"!ctx.item.properties\">\r\n        <form-adaptive [FormLayout]=\"false\" [Validation]=\"false\" [Options]=\"ctx.definition.EditorOptions\" [FocusSubject]=\"FocusSubject\" [(ngModel)]=\"ctx.item[ctx.definition.PropertyName]\" name=\"{{ ctx.definition.PropertyName + '_' + ctx.item._hash }}\" [Type]=\"ctx.definition.PropertyType\" [Source]=\"ctx.definition.PropertySource\" (inputFinalized)=\"ctx.finalizer()\"></form-adaptive>\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #defaultEsTd let-ctx>\r\n    <!-- TODO: Formattare il valore in base a valType.type -->\r\n    <ng-container *ngIf=\"ctx.type == 'enum'\">\r\n        {{ (ctx.value | est_lookup : ctx.definition.PropertySource).description }}\r\n    </ng-container>\r\n    <ng-container *ngIf=\"ctx.type != 'enum'\">\r\n        {{ctx.value}}\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #customCells let-item let-opt=\"templateOptions\">\r\n    <ng-container *ngIf=\"UseCustomCells && !EmptyRowTds\">\r\n        <!-- Cella che aggrega tutte le colonne che devono essere pinnate -->\r\n        <td *ngIf=\"HasPinnedColumns\" class=\"est-pinned-body est-col-min\" [class.est-white-selected]=\"item._selected\">\r\n            <div [style.width.px]=\"PinnedContainerWidth\" class=\"est-pinned-border\">\r\n                <td *ngIf=\"!item.locked && !item._sep && Selection\" class=\"est-no-border est-col-min\" [style.width.px]=\"20\">\r\n                    <input type=\"checkbox\" [disabled]=\"opt.selDisabled\" [class.est-pointer]=\"!item.locked\" [(ngModel)]=\"item._selected\" name=\"check{{item._hash}}\" (click)=\"$event.stopPropagation(); handleClick($event, item);\">\r\n                </td>\r\n                <td class=\"est-no-border est-col-min\" *ngIf=\"(item.locked || item._sep) && Selection\" [style.width.px]=\"20\"></td>\r\n\r\n                <ng-container *ngFor=\"let cell of RowTDs[item._hash]; let index = index; trackBy: IDTrackBy\">\r\n                    <ng-container *ngIf=\"cell.Pinned; let pinned = true\">\r\n                        <ng-container *ngTemplateOutlet=\"customTd; context: { $implicit: item, index: index, cell: cell, pinned: pinned };;\"></ng-container>\r\n                    </ng-container>\r\n                </ng-container>\r\n            </div>\r\n        </td>\r\n\r\n        <!-- Body effettivo della riga -->\r\n        <ng-container *ngFor=\"let cell of RowTDs[item._hash]; let index = index; trackBy: IDTrackBy\">\r\n            <ng-container *ngIf=\"!cell.Pinned; let pinned = false\">\r\n                <ng-container *ngTemplateOutlet=\"customTd; context: { $implicit: item, index: index, cell: cell, pinned: pinned };\"></ng-container>\r\n            </ng-container>\r\n        </ng-container>\r\n\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<!-- Cella customizzata, elemento grafico base per la tabella -->\r\n<ng-template #customTd let-item let-cell=\"cell\" let-index=\"index\" let-pinned=\"pinned\">\r\n\r\n    <!-- Customizzazione per celle con icona (sono essenzialmente operazioni semplici e basta) -->\r\n    <ng-container *ngIf=\"cell.IconClass && cell.Visible\">\r\n        <ng-container *ngIf=\"!cell.ConditionField || ((item.properties || item)[cell.ConditionField] == cell.ConditionValue)\">\r\n            <td [class.est-no-right-padding]=\"index != DynamicOperations.length -1\" [class.est-no-left-padding]=\"index != 0\" class=\"est-col-min\"><span title=\"{{cell.Title}}\" class=\"{{cell.IconClass}} est-pointer\" (click)=\"dynamicOperation(item, cell.ID)\">{{cell.Content}}</span></td>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"cell.ConditionField && ((item.properties || item)[cell.ConditionField] != cell.ConditionValue)\">\r\n            <td class=\"est-col-min est-no-side-padding\"></td>\r\n        </ng-container>\r\n    </ng-container>\r\n\r\n    <!-----------------------------------------------------------------------------------------------------------------------\r\n    -   ATTENZIONE: Gli spazi fra le propriet\u00E0 di questo mega td sono significativi e dividono la dichiarazione in sezioni: -\r\n    -   . Generiche                                                                                                         -\r\n    -   . Gestione allineamento e colori per la modalit\u00E0 report                                                             -\r\n    -   . Gestioni grafiche particolari per il Pinned                                                                       -\r\n    -   . Gestione della selezione a singola cella in assenza di pinned                                                     -\r\n    -   . Gestione click classico                                                                                           -\r\n    ------------------------------------------------------------------------------------------------------------------------->\r\n\r\n    <td *ngIf=\"!cell.IconClass && cell.Visible\" \r\n        es-td=\"{{cell.Property || cell.ID}}\"\r\n        id=\"estd_{{cell.Property || cell.ID}}_{{item._ordinal}}_{{index}}\" \r\n        class=\"{{ cell.Class }} est-default-row-height\" \r\n        [Context]=\"item._hash\" \r\n        [class.est-no-selection]=\"Editable && cell.PropertyName\" \r\n        [class.est-rg-hdr]=\"cell.GroupHeader\" \r\n        [class.est-rg-agg]=\"cell.GroupAggregation\"\r\n        [class.est-nowrap]=\"Hierarchy || !cell.Wraps\"\r\n        \r\n        [style.text-align]=\" (!pinned && cell.Alignment) ? cell.Alignment : null\"\r\n        [style.color]=\"(!pinned && item.forecolors && cell.PropAccessor) ? item.forecolors[cell.PropAccessor] : null\"\r\n        [style.background-color]=\"(!pinned && item.backcolors && cell.PropAccessor) ? item.backcolors[cell.PropAccessor] : null\"\r\n\r\n        [style.width.px]=\"pinned ? cell.PinnedWidth : null\"\r\n        [class.est-no-border]=\"pinned\"\r\n\r\n        [class.est-ltab-border]=\"cell.LeftBorder && !selectionStatus[item._ordinal][index]?.lborder\" \r\n        [class.est-rtab-border]=\"cell.RightBorder && !selectionStatus[item._ordinal][index]?.rborder\" \r\n\r\n        [class.est-selected-cell]=\"selectionStatus[item._ordinal][index]?.selected\"\r\n        [class.est-cell-lborder]=\"selectionStatus[item._ordinal][index]?.lborder\"\r\n        [class.est-cell-rborder]=\"selectionStatus[item._ordinal][index]?.rborder\"\r\n        [class.est-cell-tborder]=\"selectionStatus[item._ordinal][index]?.tborder\"\r\n        [class.est-cell-bborder]=\"selectionStatus[item._ordinal][index]?.bborder\"\r\n\r\n        [class.est-cell-lborder-tmp]=\"!cell.LeftBorder && !selectionStatus[item._ordinal][index]?.lborder && !selectionStatus[item._ordinal][index]?.loverlaps\"\r\n        [class.est-cell-rborder-tmp]=\"!cell.RightBorder && !selectionStatus[item._ordinal][index]?.rborder && !selectionStatus[item._ordinal][index]?.roverlaps\"\r\n        [class.est-cell-tborder-tmp]=\"!selectionStatus[item._ordinal][index]?.tborder && !selectionStatus[item._ordinal][index]?.toverlaps\"\r\n        [class.est-cell-bborder-tmp]=\"!selectionStatus[item._ordinal][index]?.bborder && !selectionStatus[item._ordinal][index]?.boverlaps\"\r\n\r\n        (mousedown)=\"mousedown($event, cell, item)\" \r\n        (mouseenter)=\"mouseenter($event)\" \r\n        (mouseup)=\"mouseup($event)\"\r\n        (onCellGeneration)=\"registerCell($event)\"\r\n        \r\n        (click)=\"dbClickEditOrSingleClickRowSelection($event, cell, item)\">\r\n\r\n        <div [class.est-edit-hidden]=\"cell._editing\" [class.est-pre]=\"!(Hierarchy && index == 0)\">\r\n\r\n            <ng-container #DEBUG>\r\n                <!-- Debug box in caso la roba che viene scritta nelle celle non torni. Scirvere qui i propri binding per controllare cose -->\r\n            </ng-container>\r\n\r\n            <!-- 90% Template disponibile, quindi derivante da *td, controllo giusto che non sia un field particolare multi -->\r\n            <ng-container *ngIf=\"cell.Template\">\r\n                <ng-container *ngIf=\"!cell.Multi\"><ng-container *ngTemplateOutlet=\"cell.Template; context: { $implicit: item }\"></ng-container></ng-container>\r\n                <span *ngIf=\"cell.Multi\"><ng-container *ngTemplateOutlet=\"cell.Template; context: { $implicit: (item[cell.MultiProp] ? item[cell.MultiProp][cell.MultiIndex] : {}) }\"></ng-container></span>\r\n            </ng-container>\r\n            \r\n            <!-- 8%\r\n                Template non disponibile, pu\u00F2 venire da \r\n                RoutePath in caso sia un link di una tabella dinamica\r\n                PropAccessor in caso di ReportRow (quindi oggetti con \"values\"  dentro), \r\n                o Renderer se modalit\u00E0 dinamica/standard (in qual caso il renderer \u00E8 il default)\r\n            -->\r\n            <ng-container *ngIf=\"!cell.Template && !cell.Multi && !cell.Content\">\r\n                <a *ngIf=\"cell.RoutePath\" [routerLink]=\"item | est_routerlink : cell.RoutePath : cell.RouteParameterProperties\" class=\"est-link\" [innerHTML]=\"item.properties ? item.properties[cell.PropertyName] : item[cell.PropertyName]\"></a>\r\n                \r\n                <span *ngIf=\"cell.PropAccessor\">\r\n                    {{(item.values? item.values[cell.PropAccessor] : item[cell.PropAccessor]) | est_format: cell.Format }}\r\n                </span>\r\n\r\n                <ng-container *ngIf=\"!cell.PropAccessor && !cell.RoutePath\">\r\n                    <ng-container *ngTemplateOutlet=\"cell.PropertyName | est_renderer: { name: cell.RendererName, src: EsTdsDirective, fallback: defaultEsTd }; context: { $implicit: { definition: cell, value: item.properties ? item.properties[cell.PropertyName] : item[cell.PropertyName], type: cell.PropertyType} }\"></ng-container>\r\n                </ng-container>\r\n            </ng-container>\r\n\r\n            <!-- 1% Se in modalit\u00E0 gerarchica metto il td per navigare la gerarchia -->\r\n            <ng-container *ngIf=\"Hierarchy && index == 0\"><ng-container *ngTemplateOutlet=\"HierarchyNavigator; context: { $implicit: item }\"></ng-container></ng-container>\r\n\r\n            <!-- 1% Content programmatico per le casistiche di Row Grouping ecc... -->\r\n            <ng-container *ngIf=\"cell.Content\">\r\n                {{cell.Content}}\r\n            </ng-container>\r\n        </div>\r\n\r\n        <div *ngIf=\"cell._editing\" class=\"est-mt-min-5\">\r\n            <ng-container *ngTemplateOutlet=\"cell.PropertyName | est_editor: { name: cell.EditorName, src: EsTdEditorDirectives, fallback: defaultEditor}; context: { $implicit: { definition: cell, columnIndex: index, item: item, finalizer: finalizeUserEdit.bind(this, cell, item, index) } }\"></ng-container>\r\n        </div>\r\n    </td>\r\n</ng-template>\r\n\r\n<!-- Navigatore della gerarchia di una view gerarchica, con tasto per espandere e collassare -->\r\n<ng-template #HierarchyNavigator let-item>\r\n    <span *ngIf=\"!item.parent\" class=\"fa fa-chevron-down\" style=\"visibility:hidden\"></span>\r\n    <span *ngIf=\"item.parent && item._expanded\" class=\"fa fa-chevron-down est-pointer est-no-selection\" (click)=\"hierarchyMode_H.collapseParent(item[this.OwnKey])\"></span>\r\n    <span *ngIf=\"item.parent && !item._expanded\" class=\"fa fa-chevron-up est-pointer est-no-selection\" (click)=\"hierarchyMode_H.expandParent(item[this.OwnKey])\"></span>\r\n    &nbsp;\r\n</ng-template>\r\n\r\n<!-- Pulsanti di eliminazione/undo eliminazione ed esportazione che vanno in fondo ad un record edlla tabella -->\r\n<ng-template #bodyDeleteAndExport let-options>\r\n    <ng-container *ngIf=\"Removal && !RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted)\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted)\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"Removal && RemovalCondition\">\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-remove est-pointer text-danger\" [hidden]=\"options.item.removable != undefined && !options.item.removable\" (click)=\"onRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"(options.item.removed || options.item.deleted) && options.item[RemovalCondition]\"><span class=\"fa fa-undo  text-warning est-pointer\" (click)=\"onAbortRemoval.emit(options.item)\"></span></td>\r\n        <td class=\"est-sticky-last-column{{options.even? '-alt' : ''}} {{Export || HiddenColumns || CornerMenuOptions ? 'est-right-9' : ''}}\" *ngIf=\"!options.item[RemovalCondition]\"><span class=\"fa fa-remove est-hidden-view\"></span></td>\r\n    </ng-container>\r\n    <td *ngIf=\"Export || HiddenColumns || CornerMenuOptions\" class=\"est-sticky-last-column{{options.even && !Hierarchy ? '-alt' : ''}}\"></td>\r\n</ng-template>\r\n\r\n<!-- Context menu vuoto default per tutte le tabella che non ce l'hanno, in modo che al click destro appaia \"nessuna op disponibile\" -->\r\n<context-menu #emptyMenu>\r\n    <ng-template contextMenuItem><span><em>{{'No operations available' | localize : lc}}...</em></span></ng-template>\r\n</context-menu>\r\n\r\n<!-- Modal per cambiare posizione e visibilit\u00E0 delle colonne dell'es-table -->\r\n<div bsModal #changeColumnVisibilityModal=\"bs-modal\" class=\"modal fade\" role=\"dialog\" aria-hidden=\"true\">\r\n    <div class=\"modal-dialog modal-lg\" cdkDrag>\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header est-pointer\" cdkDragHandle>\r\n                <h5 class=\"modal-title pull-left\">\r\n                    <ng-container *ngIf=\"!HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Order' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && !ColumnsOrdering\">\r\n                        {{'Columns Visibility' | localize : lc}}\r\n                    </ng-container>\r\n                    <ng-container *ngIf=\"HiddenColumns && ColumnsOrdering\">\r\n                        {{'Columns Visibility and Order' | localize : lc}}\r\n                    </ng-container>\r\n                </h5>\r\n                <button type=\"button\" class=\"close pull-right\" (click)=\"changeColumnVisibilityModal.hide();\" aria-label=\"Close\">\r\n                    <span aria-hidden=\"true\">&times;</span>\r\n                </button>\r\n            </div>\r\n            <div class=\"modal-body\">\r\n                <div *ngIf=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"card card-info est-padding-10 est-margin-bottom-0\">\r\n                    {{'There are no columns configured to be hidden/shown in this view' | localize : lc}}\r\n                </div>\r\n                <div *ngIf=\"TMPColumnsList && TMPColumnsList.length > 0\" style=\"max-height:500px; overflow-y:auto\">\r\n                    <!--Aaaaaaah la tristezza... qui mi servirebbe l'es-table per facilitare la selezione multipla ecc... peccato che se la linko qui entro in un loop impressionante-->\r\n                    <table class=\"table table-striped table-sm est-margin-bottom-0\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th class=\"est-col-min\" *ngIf=\"HiddenColumns\">\r\n                                    <input class=\"est-pointer\" type=\"checkbox\" [(ngModel)]=\"globalColVisCheck\" [ngModelOptions]=\"{'standalone': true}\" (ngModelChange)=\"columnMetadata_H.globalColVisCheckChanged();\">\r\n                                </th>\r\n                                <!-- <th class=\"est-col-min\" *ngIf=\"ColumnsOrdering\"></th> -->\r\n                                <th class=\"est-col-min est-nowrap\">{{'Column Name' | localize : lc}}</th>\r\n                                <!--Filler-->\r\n                                <th></th>\r\n                                <!-- Pinner -->\r\n                                <th *ngIf=\"DirectivesBased\" class=\"est-col-min\"></th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody \r\n                            cdkDropList \r\n                            [cdkDropListData]=\"TMPColumnsList\" \r\n                            (cdkDropListDropped)=\"columnMetadata_H.columnReordered($event)\" \r\n                            [cdkDropListSortPredicate]=\"columnMetadata_H.sortPredicate.bind(this.columnMetadata_H)\"\r\n                            class=\"est-dropbox\">\r\n\r\n                            <tr *ngFor=\"let item of TMPColumnsList; let i = index; let last = last; trackBy: idTrackBy\" \r\n                                class=\"est-pointer est-droplist\" \r\n                                [class.est-white-selected]=\"lastSelectedItemID == item.id\" \r\n                                [class.est-no-selection]=\"!item.visible\"\r\n                                cdkDrag\r\n                                [cdkDragData]=\"item\"\r\n                                [cdkDragDisabled]=\"!ColumnsOrdering || item.fixed || item.pinned\">\r\n\r\n                                <td *ngIf=\"HiddenColumns\">\r\n                                    <input type=\"checkbox\" [class.est-hidden-view]=\"item.fixed\" class=\"est-pointer\" [(ngModel)]=\"item.visible\" name=\"visible{{i}}\" (ngModelChange)=\"columnMetadata_H.updateGlobalColVisCheck();\" />\r\n                                </td>\r\n                                <td class=\"est-nowrap drag-visible\" (click)=\"columnMetadata_H.columnClicked(item);\">\r\n                                    <ng-container *ngIf=\"item.template\">\r\n                                        <!-- Padri -->\r\n                                        <span *ngIf=\"item.parentTemplates && item.parentTemplates.length > 0\" class=\"est-fw-bold est-fs-13\">\r\n                                            (&nbsp;\r\n                                            <ng-container *ngFor=\"let parent of item.parentTemplates; let last=last; trackBy: idTrackBy\">\r\n                                                <ng-container *ngIf=\"parent.tmpl\"><ng-container *ngTemplateOutlet=\"parent.tmpl\"></ng-container></ng-container>\r\n                                                <ng-container *ngIf=\"parent.content\">{{parent.content}}</ng-container>\r\n                                                <span *ngIf=\"!last\">&nbsp;-&nbsp;</span>\r\n                                            </ng-container>\r\n                                            &nbsp;)\r\n                                        </span>\r\n                                        <!-- Template header originale -->\r\n                                        <ng-container *ngTemplateOutlet=\"item.template; context: { $implicit: item.multi ? item.multiContent : null }\"></ng-container>\r\n                                    </ng-container>\r\n                                    <ng-container *ngIf=\"!item.template\">{{item.description}}</ng-container>\r\n                                </td>\r\n                                <!--Filler-->\r\n                                <td (click)=\"columnMetadata_H.columnClicked(item);\"></td>\r\n                                <!-- Pinner -->\r\n                                <td *ngIf=\"DirectivesBased && ColumnsPinnable\"><span *ngIf=\"!item.fixed && item.pinnable\" class=\"fa fa-thumb-tack\" [class.text-success]=\"item.pinned\" (click)=\"columnMetadata_H.pinOrUnpinColumn(item)\"></span></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </div>\r\n            </div>\r\n            <div class=\"modal-footer\">\r\n                <button type=\"button\" class=\"btn btn-secondary est-margin-right-10\" (click)=\"lastSelectedItemID = null; changeColumnVisibilityModal.hide();\">{{'Close' | localize : lc}}</button>\r\n                <button type=\"button\" [disabled]=\"!TMPColumnsList || TMPColumnsList.length == 0\" class=\"btn btn-primary\" (click)=\"columnMetadata_H.confirmColumnVisibilitySelection() && changeColumnVisibilityModal.hide()\">{{'Confirm' | localize : lc}}</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@charset \"UTF-8\";.est-loading-box{height:200px;text-align:center;position:relative;background:#ccc}.est-loading-content{margin:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:35px}.est-scrollable{max-height:600px;overflow:auto}.est-head-resizer{top:0;right:0;bottom:0;width:7px;position:absolute;cursor:col-resize}.est-head-resizer-internal{top:0;right:0px;left:6px;bottom:0;width:1px;position:absolute;background-color:#ccc;height:100%}.est-pointer{cursor:pointer}.est-high-density th,.est-high-density td{padding:0;padding-left:.2rem;padding-right:.2rem}.est-default-row-height{height:31px}.est-no-selection{-webkit-user-select:none;-moz-user-select:none;-khtml-user-select:none;-ms-user-select:none}.est-edit-hidden{visibility:hidden;height:1px!important}.est-hidden-view{visibility:hidden}.est-no-border{border:none!important}.est-nowrap{white-space:nowrap}.est-mt-min-5{margin-top:-5px}.est-white-selected{background-color:#ddd!important}.est-line-through{text-decoration:line-through}.est-no-side-padding{padding-left:0;padding-right:0}.est-no-left-padding,.est-no-right-padding{padding-left:0}.est-col-min{width:1px}.est-margin-bottom-0{margin-bottom:0!important}.est-margin-right-10{margin-right:10px!important}.est-right-9{right:9px!important}.est-table-dotted-menu{padding:0 0 2px!important;color:#999}.est-fs-18{font-size:18px}.est-fs-14,.est-fs-13{font-size:14px}.est-fw-bold{font-weight:700}.est-padding-3{padding:3px!important}.est-page-container{position:relative}.est-bring-to-front-strong{z-index:99999999!important}.est-switch{position:relative;display:inline-block;width:30px;height:17px;margin-bottom:0;margin-right:5px;margin-left:5px}.est-switch input{display:none}.est-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.est-slider:before{position:absolute;content:\"\";height:13px;width:13px;left:3px;bottom:2px;background-color:#fff;transition:.4s}input:checked+.est-slider{background-color:#2196f3}input:focus+.est-slider{box-shadow:0 0 1px #2196f3}input:checked+.est-slider:before{transform:translate(11px)}.est-slider.round{border-radius:10px}.est-slider.round:before{border-radius:50%}.est-custom-input{width:30px;display:inline;padding:1px;height:20px}.est-row-lvl-1 td:first-child{padding-left:5px}.est-row-lvl-2 td:first-child{padding-left:20px}.est-row-lvl-3 td:first-child{padding-left:35px}.est-row-lvl-4 td:first-child{padding-left:50px}.est-row-lvl-5 td:first-child{padding-left:65px}.est-row-lvl-6 td:first-child{padding-left:80px}.est-row-lvl-7 td:first-child{padding-left:95px}.est-row-lvl-8 td:first-child{padding-left:110px}.est-row-lvl-9 td:first-child{padding-left:125px}.est-row-lvl-10 td:first-child{padding-left:140px}.est-row-lvl-11 td:first-child{padding-left:155px}.est-row-lvl-12 td:first-child{padding-left:170px}.est-row-lvl-13 td:first-child{padding-left:185px}.est-row-lvl-14 td:first-child{padding-left:200px}.est-row-lvl-15 td:first-child{padding-left:215px}.est-row-lvl-16 td:first-child{padding-left:230px}.est-row-lvl-17 td:first-child{padding-left:245px}.est-row-lvl-18 td:first-child{padding-left:260px}.est-row-lvl-19 td:first-child{padding-left:275px}.est-row-lvl-20 td:first-child{padding-left:290px}.est-row-lvl-21 td:first-child{padding-left:305px}.est-row-lvl-22 td:first-child{padding-left:320px}.est-row-lvl-23 td:first-child{padding-left:335px}.est-row-lvl-24 td:first-child{padding-left:350px}.est-row-lvl-25 td:first-child{padding-left:365px}.est-row-lvl-26 td:first-child{padding-left:380px}.est-row-lvl-27 td:first-child{padding-left:395px}.est-row-lvl-28 td:first-child{padding-left:410px}.est-row-lvl-29 td:first-child{padding-left:425px}.est-row-lvl-30 td:first-child{padding-left:440px}.est-row-lvl-31 td:first-child{padding-left:455px}.est-row-lvl-32 td:first-child{padding-left:470px}.est-row-lvl-33 td:first-child{padding-left:485px}.est-row-lvl-34 td:first-child{padding-left:500px}.est-row-lvl-35 td:first-child{padding-left:515px}.est-row-lvl-36 td:first-child{padding-left:530px}.est-row-lvl-37 td:first-child{padding-left:545px}.est-row-lvl-38 td:first-child{padding-left:560px}.est-row-lvl-39 td:first-child{padding-left:575px}.est-row-lvl-40 td:first-child{padding-left:590px}.est-row-lvl-41 td:first-child{padding-left:605px}.est-row-lvl-42 td:first-child{padding-left:620px}.est-row-lvl-43 td:first-child{padding-left:635px}.est-row-lvl-44 td:first-child{padding-left:650px}.est-row-lvl-45 td:first-child{padding-left:665px}.est-row-lvl-46 td:first-child{padding-left:680px}.est-row-lvl-47 td:first-child{padding-left:695px}.est-row-lvl-48 td:first-child{padding-left:710px}.est-row-lvl-49 td:first-child{padding-left:725px}.est-row-lvl-50 td:first-child{padding-left:740px}.est-row-lvl-51 td:first-child{padding-left:755px}.est-row-lvl-52 td:first-child{padding-left:770px}.est-row-lvl-53 td:first-child{padding-left:785px}.est-row-lvl-54 td:first-child{padding-left:800px}.est-row-lvl-55 td:first-child{padding-left:815px}.est-row-lvl-56 td:first-child{padding-left:830px}.est-row-lvl-57 td:first-child{padding-left:845px}.est-row-lvl-58 td:first-child{padding-left:860px}.est-row-lvl-59 td:first-child{padding-left:875px}.est-row-lvl-60 td:first-child{padding-left:890px}.est-row-lvl-61 td:first-child{padding-left:905px}.est-row-lvl-62 td:first-child{padding-left:920px}.est-row-lvl-63 td:first-child{padding-left:935px}.est-row-lvl-64 td:first-child{padding-left:950px}.est-row-lvl-65 td:first-child{padding-left:965px}.est-row-lvl-66 td:first-child{padding-left:980px}.est-row-lvl-67 td:first-child{padding-left:995px}.est-row-lvl-68 td:first-child{padding-left:1010px}.est-row-lvl-69 td:first-child{padding-left:1025px}.est-row-lvl-70 td:first-child{padding-left:1040px}.est-row-lvl-71 td:first-child{padding-left:1055px}.est-row-lvl-72 td:first-child{padding-left:1070px}.est-row-lvl-73 td:first-child{padding-left:1085px}.est-row-lvl-74 td:first-child{padding-left:1100px}.est-row-lvl-75 td:first-child{padding-left:1115px}.est-row-lvl-76 td:first-child{padding-left:1130px}.est-row-lvl-77 td:first-child{padding-left:1145px}.est-row-lvl-78 td:first-child{padding-left:1160px}.est-row-lvl-79 td:first-child{padding-left:1175px}.est-row-lvl-80 td:first-child{padding-left:1190px}.est-row-lvl-81 td:first-child{padding-left:1205px}.est-row-lvl-82 td:first-child{padding-left:1220px}.est-row-lvl-83 td:first-child{padding-left:1235px}.est-row-lvl-84 td:first-child{padding-left:1250px}.est-row-lvl-85 td:first-child{padding-left:1265px}.est-row-lvl-86 td:first-child{padding-left:1280px}.est-row-lvl-87 td:first-child{padding-left:1295px}.est-row-lvl-88 td:first-child{padding-left:1310px}.est-row-lvl-89 td:first-child{padding-left:1325px}.est-row-lvl-90 td:first-child{padding-left:1340px}.est-row-lvl-91 td:first-child{padding-left:1355px}.est-row-lvl-92 td:first-child{padding-left:1370px}.est-row-lvl-93 td:first-child{padding-left:1385px}.est-row-lvl-94 td:first-child{padding-left:1400px}.est-row-lvl-95 td:first-child{padding-left:1415px}.est-row-lvl-96 td:first-child{padding-left:1430px}.est-row-lvl-97 td:first-child{padding-left:1445px}.est-row-lvl-98 td:first-child{padding-left:1460px}.est-row-lvl-99 td:first-child{padding-left:1475px}.est-relative{position:relative}.est-top-pager{position:absolute;right:0;top:5px}.est-top-allselect{position:absolute;left:0;top:5px;font-weight:700}.est-padding-10{padding:10px!important}.est-margin-right-50{margin-right:50px}.est-margin-left-50{margin-left:50px}.est-quick-unpin{color:#000;margin-left:8px;font-size:14px;transform:rotate(45deg)}.est-full-height{height:100%}.est-page-sel{color:#000;margin-left:3px;margin-right:3px;padding:0 5px;font-size:inherit;border:none;border-radius:15px}.est-page-prev,.est-page-next{color:#000;padding:2px 0 0;font-size:inherit}.est-pinned-header{background-color:#fff;left:0;top:0;position:sticky;z-index:1;border-bottom:1px solid #dee2e6!important;padding:0!important}.est-simple-border-bottom{border-bottom:1px solid #dee2e6}.est-pinned-internal-header{border-top:0;border-bottom:0px solid #dee2e6}.est-pinned-border{border-right:2px solid #dee2e6!important}.est-cell-padding{padding:.3rem}.est-pinned-body{background-color:#fff;left:0;position:sticky;z-index:1;border-top:1px solid #dee2e6!important;padding:0!important}.est-inline{display:inline!important}.est-inline-block{display:inline-block!important}.est-link{color:#0275d8!important;cursor:pointer;text-decoration:none;display:block}.est-link:hover{color:#23527c!important;cursor:pointer;text-decoration:underline!important}.est-sticky-last-column{right:-1px;position:sticky;z-index:0;background-color:#fff}.est-sticky-last-column-alt{right:-1px;position:sticky;z-index:0;background-color:#f2f2f2}.est-ltab-border{border-left:1px solid #bbb!important}.est-rtab-border{border-right:1px solid #bbb!important}.est-cell-group-padding{padding:calc(.3rem + 1px);position:absolute;top:0;left:0;height:100%;width:100%}.est-selected-cell{background-color:#2196f333}.est-cell-lborder{border-left:1.02px solid #2196f3!important}.est-cell-tborder{border-top:1.02px solid #2196f3!important}.est-cell-rborder{border-right:1.02px solid #2196f3!important}.est-cell-bborder{border-bottom:1.02px solid #2196f3!important}.est-cell-lborder-tmp{border-left:1.02px solid transparent!important}.est-cell-tborder-tmp{border-top:1.02px solid transparent!important}.est-cell-rborder-tmp{border-right:1.02px solid transparent!important}.est-cell-bborder-tmp{border-bottom:1.02px solid transparent!important}.est-margin-bottom-10{margin-bottom:10px}.est-text-center{text-align:center}.est-flex{display:flex}.est-rg-sep-flex-right{display:flex;flex-direction:row-reverse;width:100%;margin:-5px}.est-rg-sep-flex-left{display:flex;flex-direction:row;width:100%;margin:-5px}.est-rg-hdr{font-weight:700}.est-rg-agg{font-style:italic}.est-rg{background-color:#7777!important}.est-rg-sep{font-size:12px;padding-right:20px!important;background-color:#bbbb!important}.est-rg-ipp{text-align:left;display:inline-flex;margin-right:25px}.est-rg-page{text-align:right;display:inline-flex;font-size:inherit;padding-top:5px}.est-droplist.cdk-drag-placeholder{opacity:0}.est-droplist.cdk-drag-preview{z-index:999999999!important;opacity:1;box-sizing:border-box;border-radius:4px;background-color:#fff;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.est-droplist.cdk-drag-preview td:not(.drag-visible){visibility:hidden}.est-droplist.cdk-drag-preview td.drag-visible{padding-top:3px}.est-droplist.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.est-droplist.cdk-drop-list-dragging .est-dropbox:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.est-pre{white-space:pre}.est val-datetime .mat-form-field-appearance-outline .mat-form-field-infix input{margin-bottom:3px!important;min-width:130px!important}.est .mat-form-field-flex{height:29px!important;padding:0!important}.est .mat-form-field-flex .mat-form-field-outline{color:#00f}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-start{border-left:none;border-top:none;border-radius:0}.est .mat-form-field-flex .mat-form-field-outline .mat-form-field-outline-end{border-top:none;border-radius:0;border-right:none}.est .mat-form-field-wrapper{height:20px;min-height:20px!important;margin-top:0!important}.est .mat-form-field-infix{width:100%!important;min-width:50px!important}.est .mat-form-field-infix select.mat-input-element{margin-top:-5px!important}.est .mat-datepicker-input{margin-bottom:3px!important}.est input{height:20px;padding-top:0!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.NgControl, decorators: [{
                     type: Self
                 }, {
@@ -4420,12 +5544,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 }, {
                     type: Inject,
                     args: [EST_LOCALE]
-                }] }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: UtilitiesHandler }, { type: i5.UtilityService }, { type: i5.ExportService }, { type: i5.DateService }, { type: i5.MessageService }]; }, propDecorators: { EsTdsDirective: [{
+                }] }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: UtilitiesHandler }, { type: i5.UtilityService }, { type: i5.ExportService }, { type: i5.DateService }, { type: i5.MessageService }, { type: CopyPasteDetector }, { type: i5.ClipboardService }, { type: Logger }]; }, propDecorators: { EsTdEditorDirectives: [{
+                type: ContentChildren,
+                args: [EsTdEditorDirective]
+            }], EsTdsDirective: [{
                 type: ContentChildren,
                 args: [EsTdDirective]
             }], EsThsDirective: [{
                 type: ContentChildren,
                 args: [EsThDirective]
+            }], EsTableTemplate: [{
+                type: Input
             }], bodyRef: [{
                 type: ContentChild,
                 args: ['body', { static: false }]
@@ -4449,7 +5578,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Input
             }], AutoUpdate: [{
                 type: Input
-            }], UseCustomCells: [{
+            }], Height: [{
+                type: Input
+            }], EmptySpaceBackgroundColor: [{
+                type: Input
+            }], EsTableHandledSearch: [{
                 type: Input
             }], MaxHeight: [{
                 type: Input
@@ -4491,6 +5624,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Input
             }], ExportFunction: [{
                 type: Input
+            }], ExportOnlyVisibleColumns: [{
+                type: Input
             }], HasHeaderGroup: [{
                 type: Input
             }], HasSecondaryHeaderGroup: [{
@@ -4533,6 +5668,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Input
             }], SavePreferences: [{
                 type: Input
+            }], DefaultAlignment: [{
+                type: Input
             }], PagingStyle: [{
                 type: Input
             }], RowGroupingPagingStyle: [{
@@ -4543,7 +5680,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Input
             }], ShowItemGroupsColumns: [{
                 type: Input
-            }], UserEdits: [{
+            }], Editable: [{
+                type: Input
+            }], RangeSelection: [{
+                type: Input
+            }], SearchThrottle: [{
                 type: Input
             }], onOrderChanged: [{
                 type: Output
@@ -4555,6 +5696,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 type: Output
             }], onAbortRemoval: [{
                 type: Output
+            }], onModelChange: [{
+                type: Output
+            }], onOpenContextMenu: [{
+                type: Output
             }], onCornerAction: [{
                 type: Output
             }], onDynamicOperation: [{
@@ -4567,12 +5712,66 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
                 args: ['emptyMenu', { static: true }]
             }], ArraymodeItemsPerPage: [{
                 type: Input
+            }] } });
+class EsTdReference {
+}
+
+//Angular
+/** Componente rappresentante un template di th coi loro relativi td da poter riutilizzare quandomminchia si vuole */
+class EsTableTemplate {
+}
+EsTableTemplate.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableTemplate, deps: [], target: i0.ɵɵFactoryTarget.Component });
+EsTableTemplate.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: EsTableTemplate, selector: "es-table-template", queries: [{ propertyName: "EsTdsDirective", predicate: EsTdDirective }, { propertyName: "EsThsDirective", predicate: EsThDirective }], ngImport: i0, template: "", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableTemplate, decorators: [{
+            type: Component,
+            args: [{ selector: "es-table-template", changeDetection: ChangeDetectionStrategy.OnPush, template: "" }]
+        }], propDecorators: { EsTdsDirective: [{
+                type: ContentChildren,
+                args: [EsTdDirective]
+            }], EsThsDirective: [{
+                type: ContentChildren,
+                args: [EsThDirective]
             }] } });
 
 /** Modello di configurazione per L'EsTable */
 class EsTableModuleConfig {
 }
 
+const MODULES = [
+    CommonModule,
+    FormsModule,
+    RouterModule,
+    LocalizationModule,
+    ModalModule,
+    BsDropdownModule,
+    ContextMenuModule,
+    MatSelectModule,
+    MatInputModule,
+    MatTooltipModule,
+    DragDropModule,
+    FormsAndValidationsModule
+];
+const PUBLIC_ELEMENTS = [
+    // Direttive
+    EsTdDirective,
+    EsThDirective,
+    EsTdEditorDirective,
+    // Componenti
+    EsTableComponent,
+    TablePagerComponent,
+    EsTableTemplate
+];
+const PRIVATE_ELEMENTS = [
+    // Componenti
+    EsTh,
+    EsTd,
+    // Pipes
+    EstFormatPipe,
+    EstLookupPipe,
+    EstRouterLinkPipe,
+    EstRendererPipe,
+    EstEditorPipe
+];
 class EsTableModule {
     static forRoot(config) {
         return {
@@ -4585,53 +5784,52 @@ class EsTableModule {
         };
     }
 }
-EsTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-EsTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableModule, declarations: [EsTh, EsTd, EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent], imports: [CommonModule,
+EsTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+EsTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableModule, declarations: [
+        // Direttive
+        EsTdDirective,
+        EsThDirective,
+        EsTdEditorDirective,
+        // Componenti
+        EsTableComponent,
+        TablePagerComponent,
+        EsTableTemplate, 
+        // Componenti
+        EsTh,
+        EsTd,
+        // Pipes
+        EstFormatPipe,
+        EstLookupPipe,
+        EstRouterLinkPipe,
+        EstRendererPipe,
+        EstEditorPipe], imports: [CommonModule,
         FormsModule,
         RouterModule,
         LocalizationModule,
         ModalModule,
         BsDropdownModule,
-        CsvModule,
         ContextMenuModule,
         MatSelectModule,
         MatInputModule,
+        MatTooltipModule,
         DragDropModule,
-        FormsAndValidationsModule], exports: [EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent] });
-EsTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableModule, providers: [UtilityService, ExportService, HashingService, MessageService], imports: [[
-            CommonModule,
-            FormsModule,
-            RouterModule,
-            LocalizationModule,
-            ModalModule,
-            BsDropdownModule,
-            CsvModule,
-            ContextMenuModule,
-            MatSelectModule,
-            MatInputModule,
-            DragDropModule,
-            FormsAndValidationsModule
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: EsTableModule, decorators: [{
+        FormsAndValidationsModule], exports: [
+        // Direttive
+        EsTdDirective,
+        EsThDirective,
+        EsTdEditorDirective,
+        // Componenti
+        EsTableComponent,
+        TablePagerComponent,
+        EsTableTemplate] });
+EsTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableModule, providers: [UtilityService, ExportService, HashingService, MessageService], imports: [[MODULES]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: EsTableModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        RouterModule,
-                        LocalizationModule,
-                        ModalModule,
-                        BsDropdownModule,
-                        CsvModule,
-                        ContextMenuModule,
-                        MatSelectModule,
-                        MatInputModule,
-                        DragDropModule,
-                        FormsAndValidationsModule
-                    ],
-                    declarations: [EsTh, EsTd, EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent],
+                    imports: [MODULES],
+                    declarations: [...PUBLIC_ELEMENTS, ...PRIVATE_ELEMENTS],
                     providers: [UtilityService, ExportService, HashingService, MessageService],
-                    exports: [EsTableComponent, EsTdDirective, EsThDirective, TablePagerComponent]
+                    exports: [...PUBLIC_ELEMENTS]
                 }]
         }] });
 
@@ -4709,9 +5907,13 @@ class ReportParam {
 class ReportRow {
 }
 
+/** Classe che rappresenta il riferimento ad una proprietà di un oggetto bindato sulla tabella */
+class ItemPropEditableReference {
+}
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AppOrdering, AppSearch, CornerMenuOption, EsTableColumnsDefinition, EsTableComponent, EsTableDefaultable, EsTableModule, EsTableModuleConfig, EsTableMultiValue, EsTableOperationDefinition, EsTdDirective, EsThDirective, GenericItem, Group, GroupAggregation, GroupFilter, GroupOrAggregation, ItemsSelection, ReportColumn, ReportParam, ReportRow, TablePagerComponent };
+export { AppOrdering, AppSearch, CornerMenuOption, EsTableColumnsDefinition, EsTableComponent, EsTableDefaultable, EsTableModelChange, EsTableModule, EsTableModuleConfig, EsTableMultiValue, EsTableOperationDefinition, EsTableTemplate, EsTdDirective, EsTdEditorDirective, EsTdReference, EsThDirective, GenericItem, Group, GroupAggregation, GroupFilter, GroupOrAggregation, ItemPropEditableReference, ItemsSelection, ReportColumn, ReportParam, ReportRow, TablePagerComponent };
 //# sourceMappingURL=esfaenza-es-table.mjs.map