@esfaenza/es-table 11.2.150 → 11.2.152

package/bundles/esfaenza-es-table.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@esfaenza/localizations'), require('@esfaenza/extensions'), require('@angular/forms'), require('@esfaenza/preferences'), require('@angular/cdk/drag-drop'), require('rxjs'), require('@angular/common'), require('@angular/router'), require('@angular/material/select'), require('@angular/material/input'), require('@angular/material/tooltip'), require('@esfaenza/forms-and-validations'), require('ngx-bootstrap/modal'), require('ngx-bootstrap/dropdown'), require('@esfaenza/ngx-contextmenu')) :
-    typeof define === 'function' && define.amd ? define('@esfaenza/es-table', ['exports', '@angular/core', '@esfaenza/localizations', '@esfaenza/extensions', '@angular/forms', '@esfaenza/preferences', '@angular/cdk/drag-drop', 'rxjs', '@angular/common', '@angular/router', '@angular/material/select', '@angular/material/input', '@angular/material/tooltip', '@esfaenza/forms-and-validations', 'ngx-bootstrap/modal', 'ngx-bootstrap/dropdown', '@esfaenza/ngx-contextmenu'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.esfaenza = global.esfaenza || {}, global.esfaenza['es-table'] = {}), global.ng.core, global.localizations, global.i1, global.ng.forms, global.preferences, global.ng.cdk.dragDrop, global.rxjs, global.ng.common, global.ng.router, global.ng.material.select, global.ng.material.input, global.ng.material.tooltip, global.formsAndValidations, global.modal, global.dropdown, global.ngxContextmenu));
-}(this, (function (exports, i0, localizations, i1, forms, preferences, dragDrop, rxjs, common, router, select, input, tooltip, formsAndValidations, modal, dropdown, ngxContextmenu) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@esfaenza/localizations'), require('@esfaenza/extensions'), require('@angular/forms'), require('@esfaenza/preferences'), require('rxjs'), require('@angular/cdk/drag-drop'), require('@angular/common'), require('@angular/router'), require('@angular/material/select'), require('@angular/material/input'), require('@angular/material/tooltip'), require('@esfaenza/forms-and-validations'), require('ngx-bootstrap/modal'), require('ngx-bootstrap/dropdown'), require('@esfaenza/ngx-contextmenu')) :
+    typeof define === 'function' && define.amd ? define('@esfaenza/es-table', ['exports', '@angular/core', '@esfaenza/localizations', '@esfaenza/extensions', '@angular/forms', '@esfaenza/preferences', 'rxjs', '@angular/cdk/drag-drop', '@angular/common', '@angular/router', '@angular/material/select', '@angular/material/input', '@angular/material/tooltip', '@esfaenza/forms-and-validations', 'ngx-bootstrap/modal', 'ngx-bootstrap/dropdown', '@esfaenza/ngx-contextmenu'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.esfaenza = global.esfaenza || {}, global.esfaenza['es-table'] = {}), global.ng.core, global.localizations, global.i1, global.ng.forms, global.preferences, global.rxjs, global.ng.cdk.dragDrop, global.ng.common, global.ng.router, global.ng.material.select, global.ng.material.input, global.ng.material.tooltip, global.formsAndValidations, global.modal, global.dropdown, global.ngxContextmenu));
+}(this, (function (exports, i0, localizations, i1, forms, preferences, rxjs, dragDrop, common, router, select, input, tooltip, formsAndValidations, modal, dropdown, ngxContextmenu) { 'use strict';
 
     /******************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -757,7 +757,15 @@
 
     var ThTdProvider = /** @class */ (function () {
         function ThTdProvider() {
+            this.LoadedSignal = new rxjs.Subject();
         }
+        ThTdProvider.prototype.setLoaded = function () {
+            var _this = this;
+            requestAnimationFrame(function () {
+                _this.LoadedSignal.next();
+                _this.LoadedSignal.complete();
+            });
+        };
         return ThTdProvider;
     }());
     ThTdProvider.decorators = [
@@ -4403,35 +4411,48 @@
         /** @ignore */
         EsTableComponent.prototype.ngAfterViewInit = function () {
             var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
-            // 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
-            this.EsTds = (this.EsTdsDirective.length == 0 ? ((_c = (_b = (_a = this.EsTableTemplate) === null || _a === void 0 ? void 0 : _a.Template) === null || _b === void 0 ? void 0 : _b.EsTdsDirective) === null || _c === void 0 ? void 0 : _c.length) > 0 ? (_e = (_d = this.EsTableTemplate) === null || _d === void 0 ? void 0 : _d.Template) === null || _e === void 0 ? void 0 : _e.EsTdsDirective : this.EsTdsDirective : this.EsTdsDirective).toArray();
-            this.EsThs = (this.EsThsDirective.length == 0 ? ((_h = (_g = (_f = this.EsTableTemplate) === null || _f === void 0 ? void 0 : _f.Template) === null || _g === void 0 ? void 0 : _g.EsThsDirective) === null || _h === void 0 ? void 0 : _h.length) > 0 ? (_k = (_j = this.EsTableTemplate) === null || _j === void 0 ? void 0 : _j.Template) === null || _k === void 0 ? void 0 : _k.EsThsDirective : this.EsThsDirective : this.EsThsDirective).toArray();
-            if (((_l = this.ThTdProvider) === null || _l === void 0 ? void 0 : _l.length) > 0) {
-                this.EsTds = __spread(this.EsTds, this.ThTdProvider.map(function (t) { return t.EsTdsDirective.toArray(); }).flat());
-                this.EsThs = __spread(this.EsThs, this.ThTdProvider.map(function (t) { return t.EsThsDirective.toArray(); }).flat());
-            }
-            var usesThsAndTdsDirectives = ((_m = this.EsTds) === null || _m === void 0 ? void 0 : _m.length) > 0 && ((_o = this.EsThs) === null || _o === void 0 ? void 0 : _o.length) > 0;
-            var hasNoContentProjection = !this.bodyRef && !this.headerRef && !this.headerGroupRef && !this.secondaryHeaderGroupRef;
-            if (usesThsAndTdsDirectives || hasNoContentProjection) {
-                if (this.UseCustomCells == null)
-                    this.UseCustomCells = true;
-                if (this.HiddenColumns == null && this.UseCustomCells)
-                    this.HiddenColumns = true;
-                if (this.ColumnsOrdering == null && this.UseCustomCells)
-                    this.ColumnsOrdering = true;
-                if (this.OrderByColumn == null && this.UseCustomCells)
-                    this.OrderByColumn = true;
-                if (this.SelectAll == null && this.Selection)
-                    this.SelectAll = true;
-                if (this.ShiftClick == null && this.Selection)
-                    this.ShiftClick = true;
-                this.DirectivesBased = true;
-            }
-            //Per poter cambiare il layout in base al livello gerarchico il componente deva avere il pieno controllo di ogni cella,
-            //che con solo la proiezione (senza celle cusotm) non è disponibile
-            if (this.Hierarchy && !this.UseCustomCells)
-                throw "Es-table error: Per poter utilizzare l'es-table con [Hierarchy]=\"true\" è richiesto anche [UseCustomCells]=\"true\"";
+            return __awaiter(this, void 0, void 0, function () {
+                var usesThsAndTdsDirectives, hasNoContentProjection;
+                return __generator(this, function (_u) {
+                    switch (_u.label) {
+                        case 0:
+                            // 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
+                            this.EsTds = (this.EsTdsDirective.length == 0 ? ((_c = (_b = (_a = this.EsTableTemplate) === null || _a === void 0 ? void 0 : _a.Template) === null || _b === void 0 ? void 0 : _b.EsTdsDirective) === null || _c === void 0 ? void 0 : _c.length) > 0 ? (_e = (_d = this.EsTableTemplate) === null || _d === void 0 ? void 0 : _d.Template) === null || _e === void 0 ? void 0 : _e.EsTdsDirective : this.EsTdsDirective : this.EsTdsDirective).toArray();
+                            this.EsThs = (this.EsThsDirective.length == 0 ? ((_h = (_g = (_f = this.EsTableTemplate) === null || _f === void 0 ? void 0 : _f.Template) === null || _g === void 0 ? void 0 : _g.EsThsDirective) === null || _h === void 0 ? void 0 : _h.length) > 0 ? (_k = (_j = this.EsTableTemplate) === null || _j === void 0 ? void 0 : _j.Template) === null || _k === void 0 ? void 0 : _k.EsThsDirective : this.EsThsDirective : this.EsThsDirective).toArray();
+                            if (!(((_l = this.ThTdProvider) === null || _l === void 0 ? void 0 : _l.length) > 0)) return [3 /*break*/, 2];
+                            return [4 /*yield*/, rxjs.forkJoin(this.ThTdProvider.map(function (t) { return t.LoadedSignal; })).toPromise()];
+                        case 1:
+                            _u.sent();
+                            this.EsTds = __spread(this.EsTds, this.ThTdProvider.map(function (t) { return t.EsTdsDirective.toArray(); }).flat());
+                            this.EsThs = __spread(this.EsThs, this.ThTdProvider.map(function (t) { return t.EsThsDirective.toArray(); }).flat());
+                            _u.label = 2;
+                        case 2:
+                            usesThsAndTdsDirectives = ((_m = this.EsTds) === null || _m === void 0 ? void 0 : _m.length) > 0 && ((_o = this.EsThs) === null || _o === void 0 ? void 0 : _o.length) > 0;
+                            hasNoContentProjection = !this.bodyRef && !this.headerRef && !this.headerGroupRef && !this.secondaryHeaderGroupRef;
+                            if (usesThsAndTdsDirectives || hasNoContentProjection) {
+                                if (this.UseCustomCells == null)
+                                    this.UseCustomCells = true;
+                                if (this.HiddenColumns == null && this.UseCustomCells)
+                                    this.HiddenColumns = true;
+                                if (this.ColumnsOrdering == null && this.UseCustomCells)
+                                    this.ColumnsOrdering = true;
+                                if (this.OrderByColumn == null && this.UseCustomCells)
+                                    this.OrderByColumn = true;
+                                if (this.SelectAll == null && this.Selection)
+                                    this.SelectAll = true;
+                                if (this.ShiftClick == null && this.Selection)
+                                    this.ShiftClick = true;
+                                this.DirectivesBased = true;
+                            }
+                            //Per poter cambiare il layout in base al livello gerarchico il componente deva avere il pieno controllo di ogni cella,
+                            //che con solo la proiezione (senza celle cusotm) non è disponibile
+                            if (this.Hierarchy && !this.UseCustomCells)
+                                throw "Es-table error: Per poter utilizzare l'es-table con [Hierarchy]=\"true\" è richiesto anche [UseCustomCells]=\"true\"";
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
         /** @ignore */
         EsTableComponent.prototype.ngOnDestroy = function () {
@@ -4714,81 +4735,93 @@
         };
         /** 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 */
         EsTableComponent.prototype.internalPostBoundSource = function () {
-            var _a;
-            var View = this.View;
-            // 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();
-            // Molte cose sono ovviamente disponibili solo in modalità View
-            if ((this.viewMode || this.arrayMode) && this.UseCustomCells) {
-                var view = this.viewMode ? View : null;
-                var itemsAndGroups = this.viewMode ? __spread((view.items || []), (view.groups || [])) : View;
-                var si = this.viewMode ? view.selection : this.arraymodeSelection;
-                // N.B: Rispettare l'ordine di queste 3 macrocategorie è VITALE
-                // *************************************        Sistemazioni di TH, TD, e visibilità varie      *************************************
-                // 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 (((_a = this.DynamicRowColumnsDefinition) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-                    this.logger.log("Generating ths and tds from Dynamic definition");
-                    var ret_1 = this.dynamicMode_H.emitThsAndTdsBasedOnDynamicDefinition();
-                    this.EsThs = ret_1.ths;
-                    this.EsTds = ret_1.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");
-                    var ret_2 = this.reportMode_H.generateThsAndTdsFromView(view);
-                    this.EsThs = ret_2.ths;
-                    this.EsTds = ret_2.tds;
-                }
-                // Espando i th e i td multipli duplicandoli
-                var ret = this.columnMetadata_H.expandMultiThsAndTds(this.EsThs, this.EsTds, itemsAndGroups);
-                this.EsThs = ret.expThs;
-                this.EsTds = 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 (var i = 0; i < this.EsThs.length; i++) {
-                    var th = this.EsThs[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
-                var hI = this.columnMetadata_H.evaluateHeadersGroupingInfos(this.EsThs);
-                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, this.EsTds); // 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)
-                this.columnMetadata_H.alignHeadersOrdering(hI.leafs, view); // Allineo gli ordinamenti agli header
-                this.columnMetadata_H.refreshColumnsVisibility(hI.leafs, this.EsTds, view); // Lavoro sui TH ed eventualmente modifico la visibilità anche dei TD.
-                this.columnMetadata_H.evaluatePinnedColumnsWidth(); // Se sono presenti colonne pinnate valuta la dimensione del contenitore
-                this.columnMetadata_H.generateDefaultOrder(hI.leafs, view); // Genero le direttive di ordinamento, che siano default o derivanti dalla AppSearch
-                this.columnMetadata_H.evaluateHeaderGroups(hI); // Valuto i raggruppamenti degli header se presenti
-                // *************************************        Generazione binding per righe e colonne         *************************************
-                this.evaluateRowThs(hI.leafs); // Raccolgo i TH
-                this.evaluateRowTds(hI.leafs, this.EsTds); // Raccolgo i TD in contesti separati, un contesto per ogni item o gruppo
-                // *************************************        Ultimi aggiustmaenti dei binding                *************************************
-                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);
-                    this.ResearchNeeded = false;
-                }
-            }
-            else if ((this.viewMode || this.arrayMode) && !this.UseCustomCells) {
-                // Riallineo le info di selezione degli elementi della View
-                var items = this.viewMode ? View.items : View;
-                var si = this.viewMode ? View.selection : this.arraymodeSelection;
-                this.selection_H.evaluateSelection(items, si);
-            }
-            // Per essere sicuro che dopo un bind di oggetti la es-table aggiorni la grafica
-            this.cdr.markForCheck();
-            this.FirstBind = false;
+            var _a, _b;
+            return __awaiter(this, void 0, void 0, function () {
+                var View, view, itemsAndGroups, si, ret_1, ret_2, ret, i, th, hI, items, si;
+                return __generator(this, function (_u) {
+                    switch (_u.label) {
+                        case 0:
+                            View = this.View;
+                            if (!(((_a = this.ThTdProvider) === null || _a === void 0 ? void 0 : _a.length) > 0)) return [3 /*break*/, 2];
+                            return [4 /*yield*/, rxjs.forkJoin(this.ThTdProvider.map(function (t) { return t.LoadedSignal; })).toPromise()];
+                        case 1:
+                            _u.sent();
+                            _u.label = 2;
+                        case 2:
+                            // 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();
+                            // Molte cose sono ovviamente disponibili solo in modalità View
+                            if ((this.viewMode || this.arrayMode) && this.UseCustomCells) {
+                                view = this.viewMode ? View : null;
+                                itemsAndGroups = this.viewMode ? __spread((view.items || []), (view.groups || [])) : View;
+                                si = this.viewMode ? view.selection : this.arraymodeSelection;
+                                // N.B: Rispettare l'ordine di queste 3 macrocategorie è VITALE
+                                // *************************************        Sistemazioni di TH, TD, e visibilità varie      *************************************
+                                // 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 (((_b = this.DynamicRowColumnsDefinition) === null || _b === void 0 ? void 0 : _b.length) > 0) {
+                                    this.logger.log("Generating ths and tds from Dynamic definition");
+                                    ret_1 = this.dynamicMode_H.emitThsAndTdsBasedOnDynamicDefinition();
+                                    this.EsThs = ret_1.ths;
+                                    this.EsTds = ret_1.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");
+                                    ret_2 = this.reportMode_H.generateThsAndTdsFromView(view);
+                                    this.EsThs = ret_2.ths;
+                                    this.EsTds = ret_2.tds;
+                                }
+                                ret = this.columnMetadata_H.expandMultiThsAndTds(this.EsThs, this.EsTds, itemsAndGroups);
+                                this.EsThs = ret.expThs;
+                                this.EsTds = 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 (i = 0; i < this.EsThs.length; i++) {
+                                    th = this.EsThs[i];
+                                    this.thsCache[th.th] = th;
+                                }
+                                this.thsCacheSet = true;
+                                hI = this.columnMetadata_H.evaluateHeadersGroupingInfos(this.EsThs);
+                                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, this.EsTds); // 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)
+                                this.columnMetadata_H.alignHeadersOrdering(hI.leafs, view); // Allineo gli ordinamenti agli header
+                                this.columnMetadata_H.refreshColumnsVisibility(hI.leafs, this.EsTds, view); // Lavoro sui TH ed eventualmente modifico la visibilità anche dei TD.
+                                this.columnMetadata_H.evaluatePinnedColumnsWidth(); // Se sono presenti colonne pinnate valuta la dimensione del contenitore
+                                this.columnMetadata_H.generateDefaultOrder(hI.leafs, view); // Genero le direttive di ordinamento, che siano default o derivanti dalla AppSearch
+                                this.columnMetadata_H.evaluateHeaderGroups(hI); // Valuto i raggruppamenti degli header se presenti
+                                // *************************************        Generazione binding per righe e colonne         *************************************
+                                this.evaluateRowThs(hI.leafs); // Raccolgo i TH
+                                this.evaluateRowTds(hI.leafs, this.EsTds); // Raccolgo i TD in contesti separati, un contesto per ogni item o gruppo
+                                // *************************************        Ultimi aggiustmaenti dei binding                *************************************
+                                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);
+                                    this.ResearchNeeded = false;
+                                }
+                            }
+                            else if ((this.viewMode || this.arrayMode) && !this.UseCustomCells) {
+                                items = this.viewMode ? View.items : View;
+                                si = this.viewMode ? View.selection : this.arraymodeSelection;
+                                this.selection_H.evaluateSelection(items, si);
+                            }
+                            // Per essere sicuro che dopo un bind di oggetti la es-table aggiorni la grafica
+                            this.cdr.markForCheck();
+                            this.FirstBind = false;
+                            return [2 /*return*/];
+                    }
+                });
+            });
         };
         /**
          * Effettua il binding degli oggetti pervenuti da questa chiamata con gli oggetti effettivamente da graficare