@esfaenza/es-table 20.3.23 → 20.3.24

package/fesm2022/esfaenza-es-table.mjs

@@ -6856,6 +6856,13 @@ class EsTable2Component {
         }
     }
     get denseClass() { return this.HighCellDensity(); }
+    /**
+     * Larghezza FISSA (px) di una colonna pinnata. Una colonna sticky è per contratto a
+     * larghezza fissa: la usiamo sia per il calcolo degli offset che per vincolare la
+     * cella (min/max-width) così il contenuto lungo viene troncato invece di sbordare
+     * sulla colonna successiva. Default = `PINNED_DEFAULT_W` (coerente con gli offset).
+     */
+    pinnedWidthPx(col) { return col.pinnedWidth || this.PINNED_DEFAULT_W; }
     /** Offset `left` (px) di una colonna sticky all'indice `ci` in visibleColumns */
     pinnedLeftPx(ci) { return this.pinnedOffsets()[ci] ?? 0; }
     constructor(ngControl, cdr, hostEl, prefService, injector, defaults, debugMode, exportGlobalAcl) {
@@ -6920,7 +6927,9 @@ class EsTable2Component {
         this.ContainerClass = linkedSignal(() => this.io(this._ContainerClass(), this.defaults?.ContainerClass, ''), ...(ngDevMode ? [{ debugName: "ContainerClass" }] : []));
         this.EsTableHandledSearch = input(false, ...(ngDevMode ? [{ debugName: "EsTableHandledSearch" }] : []));
         this.SearchThrottle = input(50, ...(ngDevMode ? [{ debugName: "SearchThrottle" }] : []));
-        /** @deprecated NO-OP di parità v1 (ridimensionamento colonne): dichiarato per il drop-in, non implementato */
+        /** Abilita il ridimensionamento via handle sul bordo destro dell'header delle colonne PINNATE
+         *  (la nuova larghezza è persistita nelle preferenze). Il resize delle colonne non pinnate
+         *  non è ancora portato. */
         this._ColumnsResizable = input(null, ...(ngDevMode ? [{ debugName: "_ColumnsResizable", alias: 'ColumnsResizable' }] : [{ alias: 'ColumnsResizable' }]));
         this.ColumnsResizable = linkedSignal(() => this.io(this._ColumnsResizable(), this.defaults?.ColumnsResizable, false), ...(ngDevMode ? [{ debugName: "ColumnsResizable" }] : []));
         this._ColumnsPinnable = input(null, ...(ngDevMode ? [{ debugName: "_ColumnsPinnable", alias: 'ColumnsPinnable' }] : [{ alias: 'ColumnsPinnable' }]));
@@ -6970,8 +6979,9 @@ class EsTable2Component {
         //  · HasHeaderGroup/HasSecondaryHeaderGroup — header-group manuali via `#headerGroup`
         //    (superati dall'approccio automatico `Parent:`/`Multi`).
         //  · SearchView — drill-down gruppi server-side (intenzionalmente non portato).
-        //  · UseSelectionCache (175), ColumnsResizable (224), RowGroupingPagingStyle (260)
-        //    — vedi le rispettive dichiarazioni. Rimuoverli romperebbe il drop-in.
+        //  · UseSelectionCache (175), RowGroupingPagingStyle (260) — vedi le rispettive
+        //    dichiarazioni. Rimuoverli romperebbe il drop-in.
+        //  (ColumnsResizable (224) NON è più un no-op: ridimensiona le colonne pinnate.)
         /** @deprecated NO-OP di parità v1 (header-group manuali, superati da `Parent:`/`Multi`) */
         this.HasHeaderGroup = input(false, ...(ngDevMode ? [{ debugName: "HasHeaderGroup" }] : []));
         /** @deprecated NO-OP di parità v1 (seconda riga header-group manuale) */
@@ -7057,6 +7067,8 @@ class EsTable2Component {
         this.hasPinned = computed(() => this.pinnedCount() > 0, ...(ngDevMode ? [{ debugName: "hasPinned" }] : []));
         /** Larghezza (px) della colonna di selezione quando sticky */
         this.SEL_STICKY_W = 44;
+        /** Larghezza (px) di default di una colonna pinnata senza `PinnedWidth` esplicito */
+        this.PINNED_DEFAULT_W = 120;
         /**
          * Offset `left` (px) cumulativi delle colonne sticky, memoizzati: ricalcolati solo
          * quando cambiano `visibleColumns`/`Selection`. Prima `pinnedLeftPx` era O(n) per
@@ -7066,7 +7078,7 @@ class EsTable2Component {
             const cols = this.visibleColumns();
             let left = this.Selection() ? this.SEL_STICKY_W : 0;
             return cols.map(c => { const at = left; if (c.pinned)
-                left += (c.pinnedWidth || 120); return at; });
+                left += this.pinnedWidthPx(c); return at; });
         }, ...(ngDevMode ? [{ debugName: "pinnedOffsets" }] : []));
         /** true se la tabella renderizza colonne strutturate (direttive/dinamica/report), non template semplici */
         this.usesColumns = computed(() => this.columns().length > 0, ...(ngDevMode ? [{ debugName: "usesColumns" }] : []));
@@ -7163,7 +7175,7 @@ class EsTable2Component {
         // ===========================================================================
         //  Fase 6 — Colonne (visibilità/ordine), preferenze, export
         // ===========================================================================
-        /** Preferenze colonne in memoria (ordine + nascoste). Persistite se `SavePreferences`. */
+        /** Preferenze colonne in memoria (ordine + nascoste + pin + larghezze). Persistite se `SavePreferences`. */
         this.columnPrefs = null;
         /** true una volta caricate le preferenze dal server (evita retrieve multipli) */
         this.prefsLoaded = false;
@@ -7171,9 +7183,19 @@ class EsTable2Component {
         this.columnsDialogOpen = signal(false, ...(ngDevMode ? [{ debugName: "columnsDialogOpen" }] : []));
         /** Lista di lavoro della dialog (copia, per poter annullare) */
         this.dialogCols = signal([], ...(ngDevMode ? [{ debugName: "dialogCols" }] : []));
+        // --- Riordino via drag-drop (gated da ColumnsOrdering) ---------------------
+        /** Indice della riga trascinata (o null) */
+        this.dragIndex = signal(null, ...(ngDevMode ? [{ debugName: "dragIndex" }] : []));
+        /** Indice della riga sotto il cursore durante il drag (per l'indicatore) */
+        this.dragOverIndex = signal(null, ...(ngDevMode ? [{ debugName: "dragOverIndex" }] : []));
         // --- Export (CSV self-contained / XLSX via SheetJS opzionale) --------------
         this.exportMenuOpen = signal(false, ...(ngDevMode ? [{ debugName: "exportMenuOpen" }] : []));
         this.cornerMenuOpen = signal(false, ...(ngDevMode ? [{ debugName: "cornerMenuOpen" }] : []));
+        // --- Ridimensionamento colonne pinnate (gated da [ColumnsResizable]) --------
+        /** Larghezza minima (px) di una colonna pinnata durante il resize */
+        this.PINNED_MIN_W = 48;
+        /** Stato del resize in corso (colonna + coordinate iniziali) */
+        this.resizing = null;
         this.trackRow = (i, item) => item?._hash ?? item?.id ?? item;
         this.trackCol = (_, col) => col.id;
         if (ngControl)
@@ -8414,7 +8436,7 @@ class EsTable2Component {
     }
     removeItem(item) { this.onRemoval.emit(item); }
     abortRemoval(item) { this.onAbortRemoval.emit(item); }
-    /** Applica ordine + visibilità + pin delle preferenze a una lista di colonne appena costruita */
+    /** Applica ordine + visibilità + pin + larghezze delle preferenze a una lista di colonne appena costruita */
     setColumns(cols) {
         const p = this.columnPrefs;
         if (!p) {
@@ -8439,6 +8461,9 @@ class EsTable2Component {
             // il pin salvato sovrascrive il default della direttiva (solo se presente nelle prefs)
             if (p.pinned)
                 c.pinned = p.pinned.includes(c.id);
+            // larghezza pinnata salvata (resize) → sovrascrive il PinnedWidth della direttiva
+            if (p.widths && p.widths[c.id] != null)
+                c.pinnedWidth = p.widths[c.id];
         }
         this.columns.set(ordered);
         this.ensurePrefsLoaded();
@@ -8508,7 +8533,15 @@ class EsTable2Component {
         // "perdono" le colonne aggiunte a una tabella con preferenze già memorizzate.
         const knownToPrefs = new Set([...order, ...visible]);
         const hidden = [...currentIds].filter(id => knownToPrefs.has(id) && !visible.includes(id));
-        this.columnPrefs = { order, hidden, pinned };
+        // `widths` (resize colonne pinnate): estensione retro-compatibile, filtrata sulle colonne presenti
+        let widths;
+        if (prefs.widths && typeof prefs.widths === 'object') {
+            widths = {};
+            for (const id of Object.keys(prefs.widths))
+                if (currentIds.has(id))
+                    widths[id] = prefs.widths[id];
+        }
+        this.columnPrefs = { order, hidden, pinned, widths };
         this.setColumns(this.columns());
         if (prefs.orders?.length) {
             this.orders.set([...prefs.orders]);
@@ -8530,12 +8563,18 @@ class EsTable2Component {
         // Includo anche le sotto-colonne Multi (id stabili `prop_index`): il
         // caricamento è gated finché non esistono, quindi il guard non le rifiuta.
         const cols = this.columns();
+        // larghezze personalizzate delle colonne pinnate (resize) → { id: px }
+        const widths = {};
+        for (const c of cols)
+            if (c.pinned && c.pinnedWidth)
+                widths[c.id] = c.pinnedWidth;
         const payload = {
             columns: cols.filter(c => c.visible).map(c => c.id),
             column_ordering: cols.map(c => c.id),
             orders: this.orders(),
-            // estensione es-table2 (retro-compatibile: l'originale ignora i campi extra)
-            pinned: cols.filter(c => c.pinned).map(c => c.id)
+            // estensioni es-table2 (retro-compatibili: l'originale ignora i campi extra)
+            pinned: cols.filter(c => c.pinned).map(c => c.id),
+            widths
         };
         // allineo anche i campi wire dell'AppSearch (parità col server-side)
         if (this.viewMode() && this.view()) {
@@ -8663,6 +8702,62 @@ class EsTable2Component {
             : [...list.slice(0, bStart), ...list.slice(aStart, aEnd + 1), ...list.slice(bStart, bEnd + 1), ...list.slice(aEnd + 1)];
         this.dialogCols.set(newList);
     }
+    dialogDragStart(i, ev) {
+        this.dragIndex.set(i);
+        if (ev.dataTransfer) {
+            ev.dataTransfer.effectAllowed = 'move';
+            try {
+                ev.dataTransfer.setData('text/plain', String(i));
+            }
+            catch { /* alcuni browser */ }
+        }
+        this.cdr.markForCheck();
+    }
+    dialogDragOver(i, ev) {
+        if (this.dragIndex() == null)
+            return;
+        ev.preventDefault(); // consente il drop
+        if (ev.dataTransfer)
+            ev.dataTransfer.dropEffect = 'move';
+        if (this.dragOverIndex() !== i) {
+            this.dragOverIndex.set(i);
+            this.cdr.markForCheck();
+        }
+    }
+    dialogDrop(i, ev) {
+        ev.preventDefault();
+        const from = this.dragIndex();
+        if (from != null && from !== i)
+            this.dialogReorder(from, i);
+        this.dialogDragEnd();
+    }
+    dialogDragEnd() {
+        this.dragIndex.set(null);
+        this.dragOverIndex.set(null);
+        this.cdr.markForCheck();
+    }
+    /**
+     * Sposta la riga `from` alla posizione `to`, poi RIPARA la contiguità dei gruppi
+     * in tempo reale (come `dialogMove`): un drag che porterebbe una colonna fuori dal
+     * suo gruppo la fa "scattare" nella posizione contigua più vicina, così la dialog
+     * non mostra mai gruppi spezzati durante l'editing.
+     */
+    dialogReorder(from, to) {
+        const list = [...this.dialogCols()];
+        if (from < 0 || to < 0 || from >= list.length || to >= list.length)
+            return;
+        const [moved] = list.splice(from, 1);
+        list.splice(to, 0, moved);
+        if (this.hgParentIds().size > 0) {
+            const orderIds = this.enforceGroupContiguity(list.map(c => c.id));
+            const byId = new Map(list.map(c => [c.id, c]));
+            this.dialogCols.set(orderIds.map(id => byId.get(id)));
+        }
+        else {
+            this.dialogCols.set(list);
+        }
+        this.cdr.markForCheck();
+    }
     applyColumnsDialog() {
         // Riparo l'ordine mantenendo CONTIGUI i membri di ogni gruppo: spostare una
         // colonna fuori dal suo gruppo non deve produrre header-group spezzati.
@@ -8775,12 +8870,73 @@ class EsTable2Component {
         const arr = item?.[col.multiProp];
         return (Array.isArray(arr) ? arr[col.multiIndex] : null) ?? {};
     }
+    /**
+     * Tooltip "smart" al passaggio del mouse: mostra il testo REALMENTE renderizzato
+     * della cella (qualunque sia il `*td`) SOLO se è troncato. Legge `el.textContent`
+     * anziché `cellDisplayText`, che conosce solo `property`/`id` e non il contenuto di
+     * un template custom (era il bug del tooltip che mostrava sempre l'id colonna).
+     */
+    onCellHover(ev) {
+        const el = ev.currentTarget;
+        if (!el)
+            return;
+        if (el.scrollWidth > el.clientWidth + 1) {
+            const txt = (el.textContent || '').trim();
+            if (txt)
+                el.setAttribute('title', txt);
+            else
+                el.removeAttribute('title');
+        }
+        else {
+            el.removeAttribute('title');
+        }
+    }
+    /** mousedown sull'handle: avvia il ridimensionamento della colonna pinnata */
+    startColumnResize(col, ev) {
+        ev.preventDefault();
+        ev.stopPropagation(); // non deve innescare l'ordinamento sull'header
+        this.resizing = { col, startX: ev.clientX, startW: this.pinnedWidthPx(col) };
+        document.body.style.userSelect = 'none';
+        document.body.style.cursor = 'col-resize';
+    }
+    onResizeMove(ev) {
+        if (!this.resizing)
+            return;
+        const w = Math.max(this.PINNED_MIN_W, Math.round(this.resizing.startW + (ev.clientX - this.resizing.startX)));
+        this.resizing.col.pinnedWidth = w;
+        this.columns.set([...this.columns()]); // forza il ricalcolo di pinnedOffsets/visibleColumns
+        this.cdr.markForCheck();
+    }
+    onResizeEnd() {
+        if (!this.resizing)
+            return;
+        this.resizing = null;
+        document.body.style.userSelect = '';
+        document.body.style.cursor = '';
+        // persisto la nuova larghezza nelle preferenze (colonna → px)
+        this.persistColumnWidths();
+    }
+    /** Aggiorna `columnPrefs.widths` dalle larghezze correnti delle colonne pinnate e salva */
+    persistColumnWidths() {
+        const cols = this.columns();
+        const widths = {};
+        for (const c of cols)
+            if (c.pinned && c.pinnedWidth)
+                widths[c.id] = c.pinnedWidth;
+        this.columnPrefs = {
+            order: cols.map(c => c.id),
+            hidden: cols.filter(c => !c.visible).map(c => c.id),
+            pinned: cols.filter(c => c.pinned).map(c => c.id),
+            widths
+        };
+        this.saveColumnPrefs();
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: EsTable2Component, deps: [{ token: i1.NgControl, optional: true, self: true }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i2$1.PreferencesService, optional: true }, { token: i0.Injector }, { token: EST2_DEFAULTS, optional: true }, { token: EST2_DEBUG, optional: true }, { token: EST2_EXPORT_GLOBAL_ACL, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: EsTable2Component, isStandalone: false, selector: "es-table2", inputs: { ContextMenu: { classPropertyName: "ContextMenu", publicName: "ContextMenu", isSignal: false, isRequired: false, transformFunction: null }, _Selection: { classPropertyName: "_Selection", publicName: "Selection", isSignal: true, isRequired: false, transformFunction: null }, SingleSelection: { classPropertyName: "SingleSelection", publicName: "SingleSelection", isSignal: true, isRequired: false, transformFunction: null }, SelectionDisabled: { classPropertyName: "SelectionDisabled", publicName: "SelectionDisabled", isSignal: true, isRequired: false, transformFunction: null }, _SelectAll: { classPropertyName: "_SelectAll", publicName: "SelectAll", isSignal: true, isRequired: false, transformFunction: null }, _UseSelectionCache: { classPropertyName: "_UseSelectionCache", publicName: "UseSelectionCache", isSignal: true, isRequired: false, transformFunction: null }, _ShiftClick: { classPropertyName: "_ShiftClick", publicName: "ShiftClick", isSignal: true, isRequired: false, transformFunction: null }, _OrderByColumn: { classPropertyName: "_OrderByColumn", publicName: "OrderByColumn", isSignal: true, isRequired: false, transformFunction: null }, MultipleOrderingDirectives: { classPropertyName: "MultipleOrderingDirectives", publicName: "MultipleOrderingDirectives", isSignal: true, isRequired: false, transformFunction: null }, Removal: { classPropertyName: "Removal", publicName: "Removal", isSignal: true, isRequired: false, transformFunction: null }, RemovalCondition: { classPropertyName: "RemovalCondition", publicName: "RemovalCondition", isSignal: true, isRequired: false, transformFunction: null }, RowClassAssigner: { classPropertyName: "RowClassAssigner", publicName: "RowClassAssigner", isSignal: false, isRequired: false, transformFunction: null }, _HidePaging: { classPropertyName: "_HidePaging", publicName: "HidePaging", isSignal: true, isRequired: false, transformFunction: null }, _HidePagingCount: { classPropertyName: "_HidePagingCount", publicName: "HidePagingCount", isSignal: true, isRequired: false, transformFunction: null }, _HidePagingButtons: { classPropertyName: "_HidePagingButtons", publicName: "HidePagingButtons", isSignal: true, isRequired: false, transformFunction: null }, _AllSearch: { classPropertyName: "_AllSearch", publicName: "AllSearch", isSignal: true, isRequired: false, transformFunction: null }, _PagingStyle: { classPropertyName: "_PagingStyle", publicName: "PagingStyle", isSignal: true, isRequired: false, transformFunction: null }, _ArraymodeItemsPerPage: { classPropertyName: "_ArraymodeItemsPerPage", publicName: "ArraymodeItemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, _UseArrayModePaging: { classPropertyName: "_UseArrayModePaging", publicName: "UseArrayModePaging", isSignal: true, isRequired: false, transformFunction: null }, CountLabel: { classPropertyName: "CountLabel", publicName: "CountLabel", isSignal: true, isRequired: false, transformFunction: null }, Height: { classPropertyName: "Height", publicName: "Height", isSignal: true, isRequired: false, transformFunction: null }, MaxHeight: { classPropertyName: "MaxHeight", publicName: "MaxHeight", isSignal: true, isRequired: false, transformFunction: null }, EmptySpaceBackgroundColor: { classPropertyName: "EmptySpaceBackgroundColor", publicName: "EmptySpaceBackgroundColor", isSignal: true, isRequired: false, transformFunction: null }, HighCellDensity: { classPropertyName: "HighCellDensity", publicName: "HighCellDensity", isSignal: true, isRequired: false, transformFunction: null }, HeaderHidden: { classPropertyName: "HeaderHidden", publicName: "HeaderHidden", isSignal: true, isRequired: false, transformFunction: null }, BodyHidden: { classPropertyName: "BodyHidden", publicName: "BodyHidden", isSignal: true, isRequired: false, transformFunction: null }, ShowLoadingOnBootstrap: { classPropertyName: "ShowLoadingOnBootstrap", publicName: "ShowLoadingOnBootstrap", isSignal: true, isRequired: false, transformFunction: null }, _DefaultAlignment: { classPropertyName: "_DefaultAlignment", publicName: "DefaultAlignment", isSignal: true, isRequired: false, transformFunction: null }, _TableClass: { classPropertyName: "_TableClass", publicName: "TableClass", isSignal: true, isRequired: false, transformFunction: null }, _ContainerClass: { classPropertyName: "_ContainerClass", publicName: "ContainerClass", isSignal: true, isRequired: false, transformFunction: null }, EsTableHandledSearch: { classPropertyName: "EsTableHandledSearch", publicName: "EsTableHandledSearch", isSignal: true, isRequired: false, transformFunction: null }, SearchThrottle: { classPropertyName: "SearchThrottle", publicName: "SearchThrottle", isSignal: true, isRequired: false, transformFunction: null }, _ColumnsResizable: { classPropertyName: "_ColumnsResizable", publicName: "ColumnsResizable", isSignal: true, isRequired: false, transformFunction: null }, _ColumnsPinnable: { classPropertyName: "_ColumnsPinnable", publicName: "ColumnsPinnable", isSignal: true, isRequired: false, transformFunction: null }, _HiddenColumns: { classPropertyName: "_HiddenColumns", publicName: "HiddenColumns", isSignal: true, isRequired: false, transformFunction: null }, _ColumnsOrdering: { classPropertyName: "_ColumnsOrdering", publicName: "ColumnsOrdering", isSignal: true, isRequired: false, transformFunction: null }, _Export: { classPropertyName: "_Export", publicName: "Export", isSignal: true, isRequired: false, transformFunction: null }, XLSXExport: { classPropertyName: "XLSXExport", publicName: "XLSXExport", isSignal: true, isRequired: false, transformFunction: null }, CSVExport: { classPropertyName: "CSVExport", publicName: "CSVExport", isSignal: true, isRequired: false, transformFunction: null }, ExportFileName: { classPropertyName: "ExportFileName", publicName: "ExportFileName", isSignal: true, isRequired: false, transformFunction: null }, ExportOnlyVisibleColumns: { classPropertyName: "ExportOnlyVisibleColumns", publicName: "ExportOnlyVisibleColumns", isSignal: true, isRequired: false, transformFunction: null }, ExportFunction: { classPropertyName: "ExportFunction", publicName: "ExportFunction", isSignal: false, isRequired: false, transformFunction: null }, CornerMenuOptions: { classPropertyName: "CornerMenuOptions", publicName: "CornerMenuOptions", isSignal: true, isRequired: false, transformFunction: null }, DynamicOperations: { classPropertyName: "DynamicOperations", publicName: "DynamicOperations", isSignal: true, isRequired: false, transformFunction: null }, _DynamicRowColumnsDefinition: { classPropertyName: "_DynamicRowColumnsDefinition", publicName: "DynamicRowColumnsDefinition", isSignal: true, isRequired: false, transformFunction: null }, Hierarchy: { classPropertyName: "Hierarchy", publicName: "Hierarchy", isSignal: true, isRequired: false, transformFunction: null }, _ParentKey: { classPropertyName: "_ParentKey", publicName: "ParentKey", isSignal: true, isRequired: false, transformFunction: null }, _OwnKey: { classPropertyName: "_OwnKey", publicName: "OwnKey", isSignal: true, isRequired: false, transformFunction: null }, _AutoSortHierarchy: { classPropertyName: "_AutoSortHierarchy", publicName: "AutoSortHierarchy", isSignal: true, isRequired: false, transformFunction: null }, StartsExpanded: { classPropertyName: "StartsExpanded", publicName: "StartsExpanded", isSignal: true, isRequired: false, transformFunction: null }, CascadeSelection: { classPropertyName: "CascadeSelection", publicName: "CascadeSelection", isSignal: true, isRequired: false, transformFunction: null }, _SavePreferences: { classPropertyName: "_SavePreferences", publicName: "SavePreferences", isSignal: true, isRequired: false, transformFunction: null }, Name: { classPropertyName: "Name", publicName: "Name", isSignal: true, isRequired: false, transformFunction: null }, _RowGroupingPagingStyle: { classPropertyName: "_RowGroupingPagingStyle", publicName: "RowGroupingPagingStyle", isSignal: true, isRequired: false, transformFunction: null }, _ShowItemGroupsColumns: { classPropertyName: "_ShowItemGroupsColumns", publicName: "ShowItemGroupsColumns", isSignal: true, isRequired: false, transformFunction: null }, Editable: { classPropertyName: "Editable", publicName: "Editable", isSignal: true, isRequired: false, transformFunction: null }, RangeSelection: { classPropertyName: "RangeSelection", publicName: "RangeSelection", isSignal: true, isRequired: false, transformFunction: null }, ItemSourceProperty: { classPropertyName: "ItemSourceProperty", publicName: "ItemSourceProperty", isSignal: true, isRequired: false, transformFunction: null }, HasHeaderGroup: { classPropertyName: "HasHeaderGroup", publicName: "HasHeaderGroup", isSignal: true, isRequired: false, transformFunction: null }, HasSecondaryHeaderGroup: { classPropertyName: "HasSecondaryHeaderGroup", publicName: "HasSecondaryHeaderGroup", isSignal: true, isRequired: false, transformFunction: null }, SearchView: { classPropertyName: "SearchView", publicName: "SearchView", isSignal: true, isRequired: false, transformFunction: null }, _AutoUpdate: { classPropertyName: "_AutoUpdate", publicName: "AutoUpdate", isSignal: true, isRequired: false, transformFunction: null }, EsThTdProvider: { classPropertyName: "EsThTdProvider", publicName: "EsThTdProvider", isSignal: false, isRequired: false, transformFunction: null }, globalCheck: { classPropertyName: "globalCheck", publicName: "globalCheck", isSignal: true, isRequired: false, transformFunction: null }, autoUpdate: { classPropertyName: "autoUpdate", publicName: "autoUpdate", isSignal: true, isRequired: false, transformFunction: null }, seconds: { classPropertyName: "seconds", publicName: "seconds", isSignal: true, isRequired: false, transformFunction: null }, researchInProgress: { classPropertyName: "researchInProgress", publicName: "researchInProgress", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onOrderChanged: "onOrderChanged", onSearchRequest: "onSearchRequest", onSelectionChanged: "onSelectionChanged", onRemoval: "onRemoval", onAbortRemoval: "onAbortRemoval", onModelChange: "onModelChange", onOpenContextMenu: "onOpenContextMenu", onCornerAction: "onCornerAction", onDynamicOperation: "onDynamicOperation", globalCheck: "globalCheckChange", autoUpdate: "autoUpdateChange", seconds: "secondsChange", researchInProgress: "researchInProgressChange" }, host: { listeners: { "document:mouseup": "onDocMouseUp()", "document:copy": "onDocCopy($event)", "document:paste": "onDocPaste($event)", "document:click": "onDocClick()" }, properties: { "class.est2": "this.hostClass", "class.est2--dense": "this.denseClass" } }, queries: [{ propertyName: "headerRef", first: true, predicate: ["header"], descendants: true }, { propertyName: "bodyRef", first: true, predicate: ["body"], descendants: true }, { propertyName: "thDirectives", predicate: EsThDirective }, { propertyName: "tdDirectives", predicate: EsTdDirective }, { propertyName: "editorDirectives", predicate: EsTdEditorDirective }, { propertyName: "thTdProviders", predicate: ThTdProvider }], viewQueries: [{ propertyName: "tableEmptyMenu", first: true, predicate: ["emptyMenu"], descendants: true, static: true }, { propertyName: "theadRef", first: true, predicate: ["theadRef"], descendants: true }], ngImport: i0, template: "@if (view()) {\n  <div class=\"est2-wrap {{ ContainerClass() }}\"\n       [style.height]=\"Height()\"\n       [style.background-color]=\"EmptySpaceBackgroundColor() || null\">\n\n    <!-- Auto-aggiornamento: toggle + intervallo (in alto a destra) -->\n    @if (AutoUpdate()) {\n      <div class=\"est2-autoupdate\">\n        <label class=\"est2-autoupdate__label\">\n          Aggiorna ogni\n          <input type=\"text\" maxlength=\"3\" class=\"est2-autoupdate__secs\"\n                 [ngModel]=\"seconds()\" (ngModelChange)=\"seconds.set($event)\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (change)=\"autoUpdateChanged()\" />\n          secondi\n        </label>\n        <label class=\"est2-switch\" title=\"Attiva/disattiva auto-aggiornamento\">\n          <input type=\"checkbox\" [ngModel]=\"autoUpdate()\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (ngModelChange)=\"autoUpdate.set($event); autoUpdateChanged()\" />\n          <span class=\"est2-switch__slider\"></span>\n        </label>\n      </div>\n    }\n\n    <!-- Pager superiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'top') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Barra \"seleziona tutto\" (visibile solo con selezione multipla attiva e righe presenti) -->\n    @if (Selection() && !SingleSelection() && hasSelection) {\n      <div class=\"est2-selectbar\" [style.height.px]=\"selbarHeight() ? selbarHeight() + 1 : null\">\n        @if (allSelected) {\n          <span>Tutti i <strong>{{ selectedCount }}</strong> elementi sono selezionati</span>\n        } @else {\n          <span><strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'elemento selezionato' : 'elementi selezionati' }}</span>\n          @if (canSelectEverything) {\n            <span class=\"est2-link\" (click)=\"selectEverything()\">Seleziona tutti i {{ totalCount() }} elementi</span>\n          }\n        }\n        <span class=\"est2-selectbar__spacer\"></span>\n        <span class=\"est2-link\" (click)=\"clearSelection()\">Azzera selezione</span>\n      </div>\n    }\n\n    <div class=\"est2-scroll\" [style.max-height.px]=\"MaxHeight()\">\n      <table class=\"est2-table {{ TableClass() }}\"\n             [class.est2-table--range]=\"rangeActive()\"\n             [class.est2-table--dragging]=\"rangeDragging()\"\n             (mousedown)=\"onGridMouseDown($event)\"\n             (mouseover)=\"onGridMouseOver($event)\">\n\n        <!-- ================= HEADER ================= -->\n        @if (!HeaderHidden()) {\n          <thead #theadRef>\n            <!-- Righe di header-group multi-livello (dall'alto verso il basso) -->\n            @if (hasHeaderGroups()) {\n              @for (grow of headerGroupRows(); track $index) {\n                <tr class=\"est2-hgroup-row\">\n                  @if (Selection()) { <th class=\"est2-col-min est2-selcol\" [class.est2-pinned]=\"hasPinned()\" [style.left.px]=\"hasPinned() ? 0 : null\"></th> }\n                  @for (op of DynamicOperations(); track op.id) { <th class=\"est2-col-min\"></th> }\n                  @for (cell of grow; track cell.id; let gi = $index) {\n                    <th [attr.colspan]=\"cell.span\"\n                        [attr.data-groupid]=\"cell.isGroup ? cell.id : null\"\n                        [class.est2-hgroup]=\"cell.isGroup\"\n                        [class.est2-pinned]=\"gi < pinnedCount()\"\n                        [style.left.px]=\"gi < pinnedCount() ? pinnedLeftPx(gi) : null\"\n                        class=\"est2-hgroup-cell\">\n                      @if (cell.isGroup) {\n                        @if (cell.template) {\n                          <ng-container *ngTemplateOutlet=\"cell.template\"></ng-container>\n                        } @else {\n                          {{ cell.label }}\n                        }\n                      }\n                    </th>\n                  }\n                  @if (Removal()) { <th class=\"est2-col-min\"></th> }\n                  @if (hasChrome()) { <th class=\"est2-col-min\"></th> }\n                </tr>\n              }\n            }\n            <tr>\n              <!-- Colonna di selezione -->\n              @if (Selection()) {\n                <th class=\"est2-col-min est2-selcol\"\n                    [class.est2-pinned]=\"hasPinned()\"\n                    [style.left.px]=\"hasPinned() ? 0 : null\">\n                  @if (!SingleSelection()) {\n                    <input type=\"checkbox\" class=\"est2-check\"\n                           [checked]=\"globalCheck()\"\n                           [indeterminate]=\"selectionIndeterminate\"\n                           [disabled]=\"SelectionDisabled()\"\n                           (change)=\"toggleAll()\"\n                           aria-label=\"Seleziona tutto\" />\n                  }\n                </th>\n              }\n\n              <!-- Header da colonne (direttive / dinamica / report) -->\n              @if (usesColumns()) {\n                <!-- intestazioni vuote per le operazioni dinamiche -->\n                @for (op of DynamicOperations(); track op.id) {\n                  <th class=\"est2-col-min\"></th>\n                }\n                @for (col of visibleColumns(); track trackCol($index, col); let ci = $index) {\n                  <th [attr.data-colid]=\"col.id\"\n                      [class]=\"col.headerClass\"\n                      [class.est2-th--orderable]=\"OrderByColumn() && col.orderable\"\n                      [class.est2-col-min]=\"col.header?.thShrink\"\n                      [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                      [class.est2-pinned]=\"col.pinned\"\n                      [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                      [style.min-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                      [style.max-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                      [style.text-align]=\"col.alignment\"\n                      [style.background-color]=\"col.headerBg || null\"\n                      (click)=\"toggleSort(col)\">\n                    <span class=\"est2-th__inner\">\n                      @if (col.header?.Template) {\n                        <ng-container *ngTemplateOutlet=\"col.header!.Template!; context: col.multiProp != null ? { $implicit: col.headerText } : null\"></ng-container>\n                      } @else {\n                        {{ col.headerText }}\n                      }\n                      @if (OrderByColumn() && col.orderable && orderOf(col.id)) {\n                        <span class=\"est2-sort est2-sort--active\"\n                              [class.est2-sort--desc]=\"orderOf(col.id) === 'DESC'\">\n                          <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 15l6-6 6 6\"/></svg>\n                        </span>\n                        @if (orderIndex(col.id) > 0 && MultipleOrderingDirectives()) {\n                          <span class=\"est2-sort__badge\">{{ orderIndex(col.id) }}</span>\n                        }\n                      }\n                      <!-- Indicatore/toggle di pin (visibile se pinnata o all'hover) -->\n                      @if (ColumnsPinnable() && col.multiProp == null) {\n                        <button type=\"button\" class=\"est2-pinbtn\"\n                                [class.est2-pinbtn--on]=\"col.pinned\"\n                                [title]=\"col.pinned ? 'Sblocca colonna' : 'Blocca colonna a sinistra'\"\n                                (click)=\"togglePin(col, $event)\">\n                          <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                        </button>\n                      }\n                    </span>\n                  </th>\n                }\n              }\n              <!-- Header da template semplice -->\n              @else if (headerRef) {\n                <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\n              }\n\n              <!-- Colonna rimozione -->\n              @if (Removal()) { <th class=\"est2-col-min\"></th> }\n              <!-- Colonna chrome (export / gestione colonne / menu) -->\n              @if (hasChrome()) {\n                <th class=\"est2-col-min est2-chrome-th\">\n                  <div class=\"est2-chrome\">\n                    @if (Export()) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Esporta\" (click)=\"$event.stopPropagation(); toggleExportMenu()\">\n                          <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><path d=\"M7 10l5 5 5-5\"/><path d=\"M12 15V3\"/></svg>\n                        </button>\n                        @if (exportMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @if (CSVExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                            @if (XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('XLSX')\">Esporta Excel (XLSX)</button> }\n                            @if (!CSVExport() && !XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                          </div>\n                        }\n                      </div>\n                    }\n                    @if (HiddenColumns() || ColumnsOrdering()) {\n                      <button type=\"button\" class=\"est2-chrome-btn\" title=\"Colonne\" (click)=\"$event.stopPropagation(); openColumnsDialog()\">\n                        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"1\"/><path d=\"M9 3v18\"/><path d=\"M15 3v18\"/></svg>\n                      </button>\n                    }\n                    @if (CornerMenuOptions().length > 0) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Opzioni\" (click)=\"$event.stopPropagation(); toggleCornerMenu()\">\u22EE</button>\n                        @if (cornerMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @for (opt of CornerMenuOptions(); track opt.id) {\n                              <button type=\"button\" class=\"est2-menu-item\" (click)=\"cornerAction(opt.id); cornerMenuOpen.set(false)\">{{ opt.description }}</button>\n                            }\n                          </div>\n                        }\n                      </div>\n                    }\n                  </div>\n                </th>\n              }\n            </tr>\n          </thead>\n        }\n\n        <!-- ================= BODY ================= -->\n        @if (!BodyHidden()) {\n          <tbody>\n            @for (item of boundSource(); track trackRow($index, item); let ri = $index) {\n              @if ((!grouped() && !Hierarchy()) || item._visible) {\n              <tr [class]=\"rowClass(item)\"\n                  [class.est2-row--selected]=\"item._selected\"\n                  [class.est2-row--removed]=\"item.removed || item.deleted\"\n                  [class.est2-row--group]=\"item._group\"\n                  [class.est2-row--clickable]=\"Selection() || item._group\"\n                  [contextMenu]=\"ContextMenu || emptyMenu\"\n                  [contextMenuSubject]=\"item\"\n                  (click)=\"handleRowClick(item, $event)\">\n\n                <!-- Cella di selezione -->\n                @if (Selection()) {\n                  <td class=\"est2-col-min est2-selcol\"\n                      [class.est2-pinned]=\"hasPinned()\"\n                      [style.left.px]=\"hasPinned() ? 0 : null\">\n                    @if (item._group) {\n                      @if (!SingleSelection()) {\n                        <input type=\"checkbox\" class=\"est2-check\"\n                               [checked]=\"groupSelectionState(item) === 'all'\"\n                               [indeterminate]=\"groupSelectionState(item) === 'some'\"\n                               [disabled]=\"SelectionDisabled()\"\n                               (click)=\"$event.stopPropagation()\"\n                               (change)=\"toggleGroupSelection(item)\"\n                               aria-label=\"Seleziona gruppo\" />\n                      }\n                    } @else {\n                      <input type=\"checkbox\" class=\"est2-check\"\n                             [checked]=\"item._selected\"\n                             [indeterminate]=\"hierarchyIndeterminate(item)\"\n                             [disabled]=\"SelectionDisabled()\"\n                             (click)=\"$event.stopPropagation()\"\n                             (change)=\"toggleRow(item)\"\n                             aria-label=\"Seleziona riga\" />\n                    }\n                  </td>\n                }\n\n                <!-- Celle da colonne (direttive / dinamica / report) -->\n                @if (usesColumns()) {\n                  <!-- Operazioni dinamiche (icone a sinistra) -->\n                  @for (op of DynamicOperations(); track op.id) {\n                    <td class=\"est2-col-min est2-op-cell\">\n                      @if (!item._group && operationVisible(op, item)) {\n                        <span class=\"est2-op\" [class]=\"op.iconClass || ''\" [title]=\"op.title\"\n                              (click)=\"$event.stopPropagation(); dynamicOperation(item, op.id)\">{{ op.text }}</span>\n                      }\n                    </td>\n                  }\n                  @for (col of visibleColumns(); track trackCol($index, col); let first = $first, ci = $index) {\n                    <td [class]=\"col.cssClass\"\n                        [style.text-align]=\"col.alignment\"\n                        [style.color]=\"cellColor(item, col, 'fore')\"\n                        [style.background-color]=\"cellColor(item, col, 'back')\"\n                        [class.est2-nowrap]=\"!col.wrap\"\n                        [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                        [class.est2-pinned]=\"col.pinned\"\n                        [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                        [style.min-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                        [style.max-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                        [class.est2-td--group-key]=\"item._group && item.column === col.id\"\n                        [attr.data-r]=\"rangeActive() && !item._group ? ri : null\"\n                        [attr.data-c]=\"rangeActive() && !item._group ? ci : null\"\n                        [class.est2-cell-sel]=\"rangeActive() && inRange(ri, ci)\"\n                        [class.est2-cell-sel-t]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.top\"\n                        [class.est2-cell-sel-b]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.bottom\"\n                        [class.est2-cell-sel-l]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.left\"\n                        [class.est2-cell-sel-r]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.right\"\n                        [class.est2-cell-editing]=\"isEditing(ri, ci)\"\n                        (dblclick)=\"onCellDblClick(item, col, ri, ci)\">\n                      @if (isEditing(ri, ci)) {\n                        @if (editorFor(col); as edTpl) {\n                          <ng-container *ngTemplateOutlet=\"edTpl; context: editorContext(item, col)\"></ng-container>\n                        } @else {\n                          <ng-container *ngTemplateOutlet=\"defaultEditor; context: { $implicit: item, col: col }\"></ng-container>\n                        }\n                      } @else if (item._group) {\n                        @if (item.column === col.id) {\n                          <span class=\"est2-group-key\" [style.padding-left.px]=\"groupIndent(item)\">\n                            <span class=\"est2-group-chevron\" [class.est2-group-chevron--open]=\"item._expanded\">\n                              <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                            </span>\n                            {{ groupCellDisplay(item, col) }}\n                          </span>\n                        } @else {\n                          {{ groupCellDisplay(item, col) }}\n                        }\n                      } @else {\n                        <!-- Navigatore albero nella prima colonna -->\n                        @if (Hierarchy() && first) {\n                          <span class=\"est2-hier-lead\" [style.padding-left.px]=\"hierarchyIndent(item)\">\n                            @if (item.parent) {\n                              <span class=\"est2-group-chevron est2-hier-toggle\" [class.est2-group-chevron--open]=\"item._expanded\"\n                                    (click)=\"$event.stopPropagation(); toggleHierarchyNode(item)\">\n                                <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                              </span>\n                            } @else {\n                              <span class=\"est2-hier-toggle\"></span>\n                            }\n                          </span>\n                        }\n                        @if (itemCellHidden(col)) {\n                          <!-- colonna di gruppo nascosta sulla riga-oggetto -->\n                        } @else if (col.multiProp != null) {\n                          @if (col.cell?.Template) {\n                            <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: multiCell(item, col) }\"></ng-container>\n                          } @else {\n                            {{ multiCell(item, col)?.value }}\n                          }\n                        } @else if (col.cell?.Template) {\n                          <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: item }\"></ng-container>\n                        } @else if (col.routePath) {\n                          <a class=\"est2-link\" [routerLink]=\"routerLinkFor(item, col)\">{{ cellValue(item, col) }}</a>\n                        } @else if (col.propAccessor != null) {\n                          {{ reportCellDisplay(item, col) }}\n                        } @else if (col.type === 'enum') {\n                          {{ (cellValue(item, col) | est2_lookup : col.source).description }}\n                        } @else {\n                          {{ cellValue(item, col) | est2_format : col.type : col.format : locale }}\n                        }\n                      }\n                    </td>\n                  }\n                }\n                <!-- Celle da template semplice -->\n                @else if (bodyRef) {\n                  <ng-container *ngTemplateOutlet=\"bodyRef; context: { $implicit: item }\"></ng-container>\n                }\n\n                <!-- Rimozione (non sulle righe-gruppo) -->\n                @if (Removal()) {\n                  <td class=\"est2-col-min\">\n                    @if (!item._group && canRemove(item)) {\n                      @if (item.removed || item.deleted) {\n                        <button type=\"button\" class=\"est2-rowaction\" title=\"Ripristina\" (click)=\"abortRemoval(item)\">\u21BA</button>\n                      } @else {\n                        <button type=\"button\" class=\"est2-rowaction est2-rowaction--danger\" title=\"Rimuovi\" (click)=\"removeItem(item)\">\u2715</button>\n                      }\n                    }\n                  </td>\n                }\n                <!-- Chrome -->\n                @if (hasChrome()) { <td class=\"est2-col-min\"></td> }\n              </tr>\n              }\n            } @empty {\n              <tr>\n                <td class=\"est2-empty\" [attr.colspan]=\"totalColspan()\">Nessun elemento da visualizzare</td>\n              </tr>\n            }\n          </tbody>\n        }\n      </table>\n\n      <!-- Overlay di caricamento -->\n      @if (researchInProgress() || (firstBind() && ShowLoadingOnBootstrap())) {\n        <div class=\"est2-loading\">\n          <span class=\"est2-spinner\"></span>\n          <span>Caricamento\u2026</span>\n        </div>\n      }\n    </div>\n\n    <!-- Pager inferiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'bottom') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Avviso transitorio (es. incolla con dimensioni incompatibili) -->\n    @if (notice()) {\n      <div class=\"est2-toast\" role=\"alert\">\n        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 9v4\"/><path d=\"M12 17h.01\"/><path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\"/></svg>\n        <span>{{ notice() }}</span>\n      </div>\n    }\n\n    <!-- Dialog visibilit\u00E0 / ordine colonne -->\n    @if (columnsDialogOpen()) {\n      <div class=\"est2-dialog-backdrop\" (click)=\"closeColumnsDialog()\">\n        <div class=\"est2-dialog\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-modal=\"true\">\n          <div class=\"est2-dialog__head\">\n            <span>\n              @if (HiddenColumns() && ColumnsOrdering()) { Visibilit\u00E0 e ordine colonne }\n              @else if (HiddenColumns()) { Visibilit\u00E0 colonne }\n              @else { Ordine colonne }\n            </span>\n            <button type=\"button\" class=\"est2-dialog__close\" (click)=\"closeColumnsDialog()\" aria-label=\"Chiudi\">\u2715</button>\n          </div>\n\n          @if (HiddenColumns()) {\n            <div class=\"est2-dialog__tools\">\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(true)\">Mostra tutte</button>\n              <span class=\"est2-dialog__sep\">\u00B7</span>\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(false)\">Nascondi tutte</button>\n            </div>\n          }\n\n          <ul class=\"est2-collist\">\n            @for (c of dialogCols(); track c.id; let i = $index) {\n              <li class=\"est2-collist__row\">\n                @if (HiddenColumns()) {\n                  <label class=\"est2-collist__vis\">\n                    <input type=\"checkbox\" class=\"est2-check\" [checked]=\"c.visible\" (change)=\"dialogToggle(i)\" />\n                  </label>\n                }\n                <span class=\"est2-collist__label\">{{ c.label }}</span>\n                @if (ColumnsPinnable()) {\n                  <button type=\"button\" class=\"est2-iconbtn est2-collist__pin\" [class.est2-collist__pin--on]=\"c.pinned\"\n                          [disabled]=\"c.grouped\"\n                          [title]=\"c.grouped ? 'Le colonne di un gruppo non sono bloccabili' : (c.pinned ? 'Sblocca' : 'Blocca a sinistra')\"\n                          (click)=\"dialogTogglePin(i)\">\n                    <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                  </button>\n                }\n                @if (ColumnsOrdering()) {\n                  <span class=\"est2-collist__ord\">\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === 0\" title=\"Su\" (click)=\"dialogMove(i, -1)\">\u2191</button>\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === dialogCols().length - 1\" title=\"Gi\u00F9\" (click)=\"dialogMove(i, 1)\">\u2193</button>\n                  </span>\n                }\n              </li>\n            }\n          </ul>\n\n          <div class=\"est2-dialog__foot\">\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"resetColumnsDialog()\">Ripristina</button>\n            <span class=\"est2-dialog__spacer\"></span>\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"closeColumnsDialog()\">Annulla</button>\n            <button type=\"button\" class=\"est2-btn est2-btn--primary\" (click)=\"applyColumnsDialog()\">Applica</button>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n<!-- Template pager riutilizzabile sopra/sotto -->\n<ng-template #pager>\n  @if (!HidePaging() && !grouped()) {\n    <es-table2-pager\n      [page]=\"currentPage()\"\n      [pages]=\"totalPages()\"\n      [total]=\"totalCount()\"\n      [itemsPerPage]=\"viewMode() ? (view()?.itemsperpageoverride ?? 15) : ArraymodeItemsPerPage()\"\n      [countLabel]=\"CountLabel()\"\n      [showCount]=\"!HidePagingCount()\"\n      [showButtons]=\"!HidePagingButtons()\"\n      [showPagingOptions]=\"!HidePagingButtons()\"\n      [allowAll]=\"AllSearch()\"\n      (pageChange)=\"goToPage($event)\"\n      (itemsPerPageChange)=\"changeItemsPerPage($event)\">\n    </es-table2-pager>\n  }\n</ng-template>\n\n<!-- Editor di cella di default (usato quando il consumer non fornisce un `*editor`) -->\n<ng-template #defaultEditor let-item let-col=\"col\">\n  @switch (col.type) {\n    @case ('enum') {\n      <select class=\"est2-editor-input\"\n              [value]=\"editDraft\"\n              (change)=\"editDraft = $any($event.target).value\"\n              (keydown.enter)=\"commitEdit(item, col)\"\n              (keydown.escape)=\"cancelEdit()\"\n              (blur)=\"commitEdit(item, col)\">\n        @for (o of col.source || []; track o.id) {\n          <option [value]=\"o.id\" [selected]=\"o.id == editDraft\">{{ o.description }}</option>\n        }\n      </select>\n    }\n    @case ('boolean') {\n      <input type=\"checkbox\" class=\"est2-editor-input est2-check\"\n             [checked]=\"editDraft === true || editDraft === 'true'\"\n             (change)=\"editDraft = $any($event.target).checked; commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\" />\n    }\n    @default {\n      <input class=\"est2-editor-input\"\n             [type]=\"editorInputType(col.type)\"\n             [value]=\"editDraft\"\n             (input)=\"editDraft = $any($event.target).value\"\n             (keydown.enter)=\"commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\"\n             (blur)=\"commitEdit(item, col)\" />\n    }\n  }\n</ng-template>\n\n<!-- Menu di default (nessuna operazione) usato quando il consumer non passa [ContextMenu] -->\n<context-menu #emptyMenu>\n  <ng-template contextMenuItem [passive]=\"true\"><em>Nessuna operazione disponibile\u2026</em></ng-template>\n</context-menu>\n", styles: [".est2{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent);--est-radius: 10px;--est-radius-sm: 6px;--est-radius-pill: 999px;--est-gap: 8px;--est-cell-py: 6px;--est-cell-px: 12px;--est-row-h: 33px;--est-font: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--est-fs: 13px;--est-fs-sm: 12px;--est-fw-head: 700;--est-transition: .14s cubic-bezier(.4, 0, .2, 1);--est-bg-zebra: color-mix(in srgb, var(--est-fg) 3.5%, var(--est-bg));font-family:var(--est-font);font-size:var(--est-fs);color:var(--est-fg);position:relative;display:block}@media(prefers-color-scheme:dark){.est2{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}}.est2.est2--dark{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}.est2.est2--light{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent)}.est2.est2--dense{--est-cell-py: 3px;--est-cell-px: 9px;--est-row-h: 27px;--est-fs: 12.5px}.est2 *,.est2 *:before,.est2 *:after{box-sizing:border-box}.est2 .est2-scroll{position:relative;width:100%;overflow:auto;border:1px solid var(--est-border);border-radius:var(--est-radius);background:var(--est-bg);-webkit-overflow-scrolling:touch}.est2 table.est2-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--est-bg)}.est2 thead th{position:sticky;top:0;z-index:3;background:var(--est-bg-subtle);color:var(--est-fg);font-weight:var(--est-fw-head);font-size:var(--est-fs);text-align:left;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);box-shadow:var(--est-shadow-sticky);-webkit-user-select:none;user-select:none}.est2 thead tr.est2-hgroup-row th{font-size:var(--est-fs-sm);font-weight:700;color:var(--est-fg-muted);text-align:center;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);background:var(--est-bg-subtle);border-bottom:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th.est2-hgroup{color:var(--est-fg);border-left:1px solid var(--est-border);border-right:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th:not(.est2-hgroup){background:var(--est-bg-subtle);border-bottom-color:transparent}.est2 thead tr:last-child th.est2-col-groupstart,.est2 tbody td.est2-col-groupstart{border-left:1px solid var(--est-border)}.est2 tbody td{padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);color:var(--est-fg);vertical-align:middle;background:transparent}.est2 tbody tr:nth-child(2n) td{background:var(--est-bg-zebra)}.est2 tbody tr:nth-child(2n) td.est2-pinned{background:var(--est-bg-zebra)}.est2 th.est2-pinned,.est2 td.est2-pinned{position:sticky;background:var(--est-bg);box-shadow:1px 0 0 var(--est-border)}.est2 .est2-selcol{width:44px;min-width:44px;max-width:44px}.est2 td.est2-pinned{z-index:3}.est2 thead th.est2-pinned,.est2 thead tr.est2-hgroup-row th.est2-pinned{z-index:6;background:var(--est-bg-subtle)}.est2 tbody tr:hover td.est2-pinned{background:color-mix(in srgb,var(--est-fg) 5%,var(--est-bg))}.est2 tbody tr.est2-row--selected td.est2-pinned{background:color-mix(in srgb,var(--est-accent) 12%,var(--est-bg))}.est2 tbody tr.est2-row--group td.est2-pinned{background:var(--est-bg-subtle)}.est2 .est2-pinbtn{display:inline-flex;align-items:center;justify-content:center;margin-left:4px;padding:2px;border:none;background:transparent;color:var(--est-fg-faint);border-radius:var(--est-radius-sm);cursor:pointer;opacity:0;transition:opacity var(--est-transition),color var(--est-transition),background var(--est-transition)}.est2 thead th:hover .est2-pinbtn{opacity:.7}.est2 .est2-pinbtn:hover{background:var(--est-bg-hover);color:var(--est-fg);opacity:1}.est2 .est2-pinbtn--on{opacity:1;color:var(--est-accent);transform:rotate(0)}.est2 thead th:hover .est2-pinbtn--on{opacity:1}.est2 .est2-collist__pin.est2-collist__pin--on{color:var(--est-accent);border-color:var(--est-accent)}.est2 tbody tr{height:var(--est-row-h);transition:background var(--est-transition)}.est2 tbody tr:last-child td{border-bottom:none}.est2 tbody tr:hover td{background:var(--est-bg-hover)}.est2 tbody tr.est2-row--selected td{background:var(--est-bg-selected)}.est2 tbody tr.est2-row--clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--removed td{text-decoration:line-through;color:var(--est-fg-faint)}.est2 .est2-table--range tbody td[data-r]{cursor:cell}.est2 .est2-table--dragging,.est2 .est2-table--dragging tbody td{-webkit-user-select:none;user-select:none}.est2 tbody td.est2-cell-sel{background:color-mix(in srgb,var(--est-accent) 14%,transparent)}.est2 tbody td.est2-cell-sel-t{box-shadow:inset 0 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b{box-shadow:inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l{box-shadow:inset 2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-r{box-shadow:inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b{box-shadow:inset 0 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 0 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px -2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-editing{padding:2px 6px}.est2 .est2-editor-input{width:100%;box-sizing:border-box;height:calc(var(--est-row-h) - 8px);padding:2px 6px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1.5px solid var(--est-accent);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-editor-input:focus-visible{box-shadow:var(--est-ring)}.est2 input.est2-editor-input[type=checkbox]{width:16px;height:16px}.est2 .est2-autoupdate{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:4px 2px 8px;font-size:var(--est-fs-sm);color:var(--est-fg-muted)}.est2 .est2-autoupdate__label{display:inline-flex;align-items:center;gap:6px}.est2 .est2-autoupdate__secs{width:44px;text-align:center;padding:3px 4px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-autoupdate__secs:focus-visible{box-shadow:var(--est-ring);border-color:var(--est-accent)}.est2 .est2-switch{position:relative;display:inline-flex;width:38px;height:20px;cursor:pointer}.est2 .est2-switch input{position:absolute;opacity:0;width:0;height:0}.est2 .est2-switch__slider{flex:1;border-radius:var(--est-radius-pill);background:var(--est-border-strong);transition:background var(--est-transition)}.est2 .est2-switch__slider:before{content:\"\";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #00000040;transition:transform var(--est-transition)}.est2 .est2-switch input:checked+.est2-switch__slider{background:var(--est-accent)}.est2 .est2-switch input:checked+.est2-switch__slider:before{transform:translate(18px)}.est2 .est2-switch input:focus-visible+.est2-switch__slider{box-shadow:var(--est-ring)}.est2 .est2-toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%);z-index:20;display:inline-flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:8px 14px;font-size:13px;font-weight:500;color:#fff;background:#b91c1c;border-radius:var(--est-radius);box-shadow:0 6px 20px #00000040;animation:est2-toast-in .16s ease-out}.est2 .est2-toast svg{flex:0 0 auto}@keyframes est2-toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(prefers-reduced-motion:reduce){.est2 .est2-toast{animation:none}}.est2 tbody tr.est2-row--group{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--group td{background:var(--est-bg-subtle);font-weight:600;color:var(--est-fg);border-bottom:1px solid var(--est-border)}.est2 tbody tr.est2-row--group:hover td{background:var(--est-bg-hover)}.est2 .est2-td--group-key{color:var(--est-fg)}.est2 .est2-group-key{display:inline-flex;align-items:center;gap:6px}.est2 .est2-group-chevron{display:inline-flex;color:var(--est-fg-muted);transition:transform var(--est-transition)}.est2 .est2-group-chevron--open{transform:rotate(90deg)}.est2 .est2-hier-lead{display:inline-flex;align-items:center;vertical-align:middle;margin-right:4px}.est2 .est2-hier-toggle{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:none}.est2 .est2-group-chevron.est2-hier-toggle{cursor:pointer;border-radius:var(--est-radius-sm);transition:transform var(--est-transition),background var(--est-transition),color var(--est-transition)}.est2 .est2-group-chevron.est2-hier-toggle:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 th.est2-th--orderable{cursor:pointer;transition:color var(--est-transition)}.est2 th.est2-th--orderable:hover{color:var(--est-fg)}.est2 .est2-th__inner{display:inline-flex;align-items:center;gap:6px}.est2 .est2-sort{display:inline-flex;width:14px;height:14px;opacity:.35;transition:opacity var(--est-transition),transform var(--est-transition)}.est2 .est2-sort--active{opacity:1;color:var(--est-accent)}.est2 .est2-sort--desc{transform:rotate(180deg)}.est2 .est2-sort__badge{font-size:9px;font-weight:700;color:var(--est-accent);margin-left:2px}.est2 .est2-check{appearance:none;width:16px;height:16px;border:1.5px solid var(--est-border-strong);border-radius:var(--est-radius-sm);background:var(--est-bg);cursor:pointer;position:relative;transition:border-color var(--est-transition),background var(--est-transition);vertical-align:middle;flex:none}.est2 .est2-check:hover{border-color:var(--est-accent)}.est2 .est2-check:checked{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:checked:after{content:\"\";position:absolute;left:4.5px;top:1.5px;width:4px;height:8px;border:solid var(--est-accent-fg);border-width:0 2px 2px 0;transform:rotate(45deg)}.est2 .est2-check:focus-visible{outline:none;box-shadow:var(--est-ring)}.est2 .est2-check:indeterminate{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:indeterminate:after{content:\"\";position:absolute;left:3px;top:6px;width:8px;height:2px;background:var(--est-accent-fg);transform:none;border:none}.est2 th.est2-col-min,.est2 td.est2-col-min{width:1%;white-space:nowrap}.est2 .est2-wrap{position:relative}.est2 .est2-selectbar{position:absolute;top:0;left:0;right:0;z-index:15;display:flex;align-items:center;gap:12px;padding:9px 14px;font-size:var(--est-fs-sm);color:var(--est-fg);background:var(--est-bg-subtle);border:none;border-radius:var(--est-radius) var(--est-radius) 0 0;box-shadow:inset 3px 0 0 var(--est-accent)}.est2 .est2-selectbar strong{color:var(--est-fg);font-weight:700}.est2 .est2-selectbar__spacer{flex:1 1 auto}.est2 .est2-link{color:var(--est-accent);cursor:pointer;font-weight:600}.est2 .est2-link:hover{text-decoration:underline}.est2 .est2-rowaction{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);border:none;background:transparent;color:var(--est-fg-faint);cursor:pointer;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-rowaction:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-rowaction--danger:hover{color:var(--est-danger)}.est2 .est2-op-cell{text-align:center}.est2 .est2-op{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding:0 6px;border-radius:var(--est-radius-sm);color:var(--est-accent);cursor:pointer;font-size:var(--est-fs-sm);transition:background var(--est-transition)}.est2 .est2-op:hover{background:var(--est-accent-weak)}.est2 .est2-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:color-mix(in srgb,var(--est-bg) 70%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:5;color:var(--est-fg-muted);font-size:var(--est-fs-sm)}.est2 .est2-spinner{width:16px;height:16px;border:2px solid var(--est-border-strong);border-top-color:var(--est-accent);border-radius:50%;animation:est2-spin .7s linear infinite}@keyframes est2-spin{to{transform:rotate(360deg)}}.est2 .est2-nowrap{white-space:nowrap}.est2 .est2-cornermenu{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);cursor:pointer;color:var(--est-fg-muted);transition:background var(--est-transition)}.est2 .est2-cornermenu:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-chrome-th{position:relative}.est2 .est2-chrome{display:inline-flex;align-items:center;gap:2px}.est2 .est2-chrome-wrap{position:relative;display:inline-flex}.est2 .est2-chrome-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;background:transparent;border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer;font-size:16px;line-height:1;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-chrome-btn:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-menu{position:absolute;top:calc(100% + 4px);right:0;z-index:30;min-width:180px;padding:4px;background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 8px 24px #0000002e;display:flex;flex-direction:column}.est2 .est2-menu-item{display:block;width:100%;padding:8px 10px;border:none;background:transparent;text-align:left;font:inherit;color:var(--est-fg);border-radius:var(--est-radius-sm);cursor:pointer}.est2 .est2-menu-item:hover{background:var(--est-bg-hover)}.est2 .est2-dialog-backdrop{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:16px;background:color-mix(in srgb,#000 32%,transparent)}.est2 .est2-dialog{width:380px;max-width:100%;max-height:100%;display:flex;flex-direction:column;background:var(--est-bg);color:var(--est-fg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 16px 48px #0000004d;overflow:hidden}.est2 .est2-dialog__head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;font-weight:700;border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__close{border:none;background:transparent;cursor:pointer;color:var(--est-fg-muted);font-size:15px;line-height:1;padding:4px;border-radius:var(--est-radius-sm)}.est2 .est2-dialog__close:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-dialog__tools{padding:8px 14px;font-size:var(--est-fs-sm);border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__tools .est2-link{border:none;background:none;padding:0;font:inherit;font-weight:600}.est2 .est2-dialog__sep{margin:0 6px;color:var(--est-fg-faint)}.est2 .est2-collist{list-style:none;margin:0;padding:6px;overflow-y:auto}.est2 .est2-collist__row{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--est-radius-sm)}.est2 .est2-collist__row:hover{background:var(--est-bg-hover)}.est2 .est2-collist__vis{display:inline-flex}.est2 .est2-collist__label{flex:1 1 auto}.est2 .est2-collist__ord{display:inline-flex;gap:4px}.est2 .est2-iconbtn{width:26px;height:26px;border:1px solid var(--est-border);background:var(--est-bg);border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer}.est2 .est2-iconbtn:hover:not(:disabled){background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-iconbtn:disabled{opacity:.4;cursor:default}.est2 .est2-dialog__foot{display:flex;align-items:center;gap:8px;padding:12px 14px;border-top:1px solid var(--est-border)}.est2 .est2-dialog__spacer{flex:1 1 auto}.est2 .est2-btn{padding:7px 14px;border-radius:var(--est-radius-sm);font:inherit;font-weight:600;cursor:pointer;border:1px solid transparent}.est2 .est2-btn--ghost{background:transparent;color:var(--est-fg);border-color:var(--est-border)}.est2 .est2-btn--ghost:hover{background:var(--est-bg-hover)}.est2 .est2-btn--primary{background:var(--est-accent);color:var(--est-accent-fg)}.est2 .est2-btn--primary:hover{filter:brightness(1.05)}.est2 .est2-empty{padding:48px 16px;text-align:center;color:var(--est-fg-faint);font-size:var(--est-fs-sm)}.ngx-contextmenu{--ctx-bg: #ffffff;--ctx-fg: #1a1d24;--ctx-muted: #626b7a;--ctx-border: #e6e9ef;--ctx-hover: #f2f4f7;--ctx-accent: #4f46e5;--ctx-shadow: 0 10px 28px -8px rgba(16, 24, 40, .22), 0 2px 8px -3px rgba(16, 24, 40, .14);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.ngx-contextmenu .dropdown-menu{display:block;min-width:200px;margin:0;padding:6px;list-style:none;background:var(--ctx-bg);border:1px solid var(--ctx-border);border-radius:12px;box-shadow:var(--ctx-shadow);animation:est2-ctx-in .12s cubic-bezier(.16,1,.3,1)}.ngx-contextmenu li{list-style:none;margin:0}.ngx-contextmenu li>a{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:7px;color:var(--ctx-fg);font-size:13.5px;line-height:1.2;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .12s ease,color .12s ease}.ngx-contextmenu li>a:hover,.ngx-contextmenu li>a:focus{background:var(--ctx-hover);color:var(--ctx-fg);text-decoration:none;outline:none}.ngx-contextmenu li.divider,.ngx-contextmenu li[role=separator]{height:1px;margin:6px 8px;padding:0;background:var(--ctx-border)}.ngx-contextmenu li.disabled>a,.ngx-contextmenu li[aria-disabled=true]>a{color:var(--ctx-muted);opacity:.55;pointer-events:none}@media(prefers-color-scheme:dark){.ngx-contextmenu{--ctx-bg: #1e222b;--ctx-fg: #e7eaf0;--ctx-muted: #9aa3b2;--ctx-border: #2a2f3a;--ctx-hover: #232733;--ctx-accent: #7c74ff;--ctx-shadow: 0 12px 30px -8px rgba(0, 0, 0, .6), 0 2px 8px -3px rgba(0, 0, 0, .5)}}@keyframes est2-ctx-in{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.ngx-contextmenu .dropdown-menu{animation:none}}\n"], dependencies: [{ kind: "directive", type: i8.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", 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]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i9.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i12.ContextMenuAttachDirective, selector: "[contextMenu]", inputs: ["contextMenuSubject", "contextMenu"] }, { kind: "component", type: i12.ContextMenuComponent, selector: "context-menu", inputs: ["menuClass", "autoFocus", "useBootstrap4", "disabled"], outputs: ["close", "open"] }, { kind: "directive", type: i12.ContextMenuItemDirective, selector: "[contextMenuItem]", inputs: ["subMenu", "divider", "enabled", "passive", "visible"], outputs: ["execute"] }, { kind: "component", type: EsTable2PagerComponent, selector: "es-table2-pager", inputs: ["page", "pages", "total", "itemsPerPage", "countLabel", "showCount", "showButtons", "showPagingOptions", "allowAll"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "pipe", type: Est2FormatPipe, name: "est2_format" }, { kind: "pipe", type: Est2LookupPipe, name: "est2_lookup" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: EsTable2Component, isStandalone: false, selector: "es-table2", inputs: { ContextMenu: { classPropertyName: "ContextMenu", publicName: "ContextMenu", isSignal: false, isRequired: false, transformFunction: null }, _Selection: { classPropertyName: "_Selection", publicName: "Selection", isSignal: true, isRequired: false, transformFunction: null }, SingleSelection: { classPropertyName: "SingleSelection", publicName: "SingleSelection", isSignal: true, isRequired: false, transformFunction: null }, SelectionDisabled: { classPropertyName: "SelectionDisabled", publicName: "SelectionDisabled", isSignal: true, isRequired: false, transformFunction: null }, _SelectAll: { classPropertyName: "_SelectAll", publicName: "SelectAll", isSignal: true, isRequired: false, transformFunction: null }, _UseSelectionCache: { classPropertyName: "_UseSelectionCache", publicName: "UseSelectionCache", isSignal: true, isRequired: false, transformFunction: null }, _ShiftClick: { classPropertyName: "_ShiftClick", publicName: "ShiftClick", isSignal: true, isRequired: false, transformFunction: null }, _OrderByColumn: { classPropertyName: "_OrderByColumn", publicName: "OrderByColumn", isSignal: true, isRequired: false, transformFunction: null }, MultipleOrderingDirectives: { classPropertyName: "MultipleOrderingDirectives", publicName: "MultipleOrderingDirectives", isSignal: true, isRequired: false, transformFunction: null }, Removal: { classPropertyName: "Removal", publicName: "Removal", isSignal: true, isRequired: false, transformFunction: null }, RemovalCondition: { classPropertyName: "RemovalCondition", publicName: "RemovalCondition", isSignal: true, isRequired: false, transformFunction: null }, RowClassAssigner: { classPropertyName: "RowClassAssigner", publicName: "RowClassAssigner", isSignal: false, isRequired: false, transformFunction: null }, _HidePaging: { classPropertyName: "_HidePaging", publicName: "HidePaging", isSignal: true, isRequired: false, transformFunction: null }, _HidePagingCount: { classPropertyName: "_HidePagingCount", publicName: "HidePagingCount", isSignal: true, isRequired: false, transformFunction: null }, _HidePagingButtons: { classPropertyName: "_HidePagingButtons", publicName: "HidePagingButtons", isSignal: true, isRequired: false, transformFunction: null }, _AllSearch: { classPropertyName: "_AllSearch", publicName: "AllSearch", isSignal: true, isRequired: false, transformFunction: null }, _PagingStyle: { classPropertyName: "_PagingStyle", publicName: "PagingStyle", isSignal: true, isRequired: false, transformFunction: null }, _ArraymodeItemsPerPage: { classPropertyName: "_ArraymodeItemsPerPage", publicName: "ArraymodeItemsPerPage", isSignal: true, isRequired: false, transformFunction: null }, _UseArrayModePaging: { classPropertyName: "_UseArrayModePaging", publicName: "UseArrayModePaging", isSignal: true, isRequired: false, transformFunction: null }, CountLabel: { classPropertyName: "CountLabel", publicName: "CountLabel", isSignal: true, isRequired: false, transformFunction: null }, Height: { classPropertyName: "Height", publicName: "Height", isSignal: true, isRequired: false, transformFunction: null }, MaxHeight: { classPropertyName: "MaxHeight", publicName: "MaxHeight", isSignal: true, isRequired: false, transformFunction: null }, EmptySpaceBackgroundColor: { classPropertyName: "EmptySpaceBackgroundColor", publicName: "EmptySpaceBackgroundColor", isSignal: true, isRequired: false, transformFunction: null }, HighCellDensity: { classPropertyName: "HighCellDensity", publicName: "HighCellDensity", isSignal: true, isRequired: false, transformFunction: null }, HeaderHidden: { classPropertyName: "HeaderHidden", publicName: "HeaderHidden", isSignal: true, isRequired: false, transformFunction: null }, BodyHidden: { classPropertyName: "BodyHidden", publicName: "BodyHidden", isSignal: true, isRequired: false, transformFunction: null }, ShowLoadingOnBootstrap: { classPropertyName: "ShowLoadingOnBootstrap", publicName: "ShowLoadingOnBootstrap", isSignal: true, isRequired: false, transformFunction: null }, _DefaultAlignment: { classPropertyName: "_DefaultAlignment", publicName: "DefaultAlignment", isSignal: true, isRequired: false, transformFunction: null }, _TableClass: { classPropertyName: "_TableClass", publicName: "TableClass", isSignal: true, isRequired: false, transformFunction: null }, _ContainerClass: { classPropertyName: "_ContainerClass", publicName: "ContainerClass", isSignal: true, isRequired: false, transformFunction: null }, EsTableHandledSearch: { classPropertyName: "EsTableHandledSearch", publicName: "EsTableHandledSearch", isSignal: true, isRequired: false, transformFunction: null }, SearchThrottle: { classPropertyName: "SearchThrottle", publicName: "SearchThrottle", isSignal: true, isRequired: false, transformFunction: null }, _ColumnsResizable: { classPropertyName: "_ColumnsResizable", publicName: "ColumnsResizable", isSignal: true, isRequired: false, transformFunction: null }, _ColumnsPinnable: { classPropertyName: "_ColumnsPinnable", publicName: "ColumnsPinnable", isSignal: true, isRequired: false, transformFunction: null }, _HiddenColumns: { classPropertyName: "_HiddenColumns", publicName: "HiddenColumns", isSignal: true, isRequired: false, transformFunction: null }, _ColumnsOrdering: { classPropertyName: "_ColumnsOrdering", publicName: "ColumnsOrdering", isSignal: true, isRequired: false, transformFunction: null }, _Export: { classPropertyName: "_Export", publicName: "Export", isSignal: true, isRequired: false, transformFunction: null }, XLSXExport: { classPropertyName: "XLSXExport", publicName: "XLSXExport", isSignal: true, isRequired: false, transformFunction: null }, CSVExport: { classPropertyName: "CSVExport", publicName: "CSVExport", isSignal: true, isRequired: false, transformFunction: null }, ExportFileName: { classPropertyName: "ExportFileName", publicName: "ExportFileName", isSignal: true, isRequired: false, transformFunction: null }, ExportOnlyVisibleColumns: { classPropertyName: "ExportOnlyVisibleColumns", publicName: "ExportOnlyVisibleColumns", isSignal: true, isRequired: false, transformFunction: null }, ExportFunction: { classPropertyName: "ExportFunction", publicName: "ExportFunction", isSignal: false, isRequired: false, transformFunction: null }, CornerMenuOptions: { classPropertyName: "CornerMenuOptions", publicName: "CornerMenuOptions", isSignal: true, isRequired: false, transformFunction: null }, DynamicOperations: { classPropertyName: "DynamicOperations", publicName: "DynamicOperations", isSignal: true, isRequired: false, transformFunction: null }, _DynamicRowColumnsDefinition: { classPropertyName: "_DynamicRowColumnsDefinition", publicName: "DynamicRowColumnsDefinition", isSignal: true, isRequired: false, transformFunction: null }, Hierarchy: { classPropertyName: "Hierarchy", publicName: "Hierarchy", isSignal: true, isRequired: false, transformFunction: null }, _ParentKey: { classPropertyName: "_ParentKey", publicName: "ParentKey", isSignal: true, isRequired: false, transformFunction: null }, _OwnKey: { classPropertyName: "_OwnKey", publicName: "OwnKey", isSignal: true, isRequired: false, transformFunction: null }, _AutoSortHierarchy: { classPropertyName: "_AutoSortHierarchy", publicName: "AutoSortHierarchy", isSignal: true, isRequired: false, transformFunction: null }, StartsExpanded: { classPropertyName: "StartsExpanded", publicName: "StartsExpanded", isSignal: true, isRequired: false, transformFunction: null }, CascadeSelection: { classPropertyName: "CascadeSelection", publicName: "CascadeSelection", isSignal: true, isRequired: false, transformFunction: null }, _SavePreferences: { classPropertyName: "_SavePreferences", publicName: "SavePreferences", isSignal: true, isRequired: false, transformFunction: null }, Name: { classPropertyName: "Name", publicName: "Name", isSignal: true, isRequired: false, transformFunction: null }, _RowGroupingPagingStyle: { classPropertyName: "_RowGroupingPagingStyle", publicName: "RowGroupingPagingStyle", isSignal: true, isRequired: false, transformFunction: null }, _ShowItemGroupsColumns: { classPropertyName: "_ShowItemGroupsColumns", publicName: "ShowItemGroupsColumns", isSignal: true, isRequired: false, transformFunction: null }, Editable: { classPropertyName: "Editable", publicName: "Editable", isSignal: true, isRequired: false, transformFunction: null }, RangeSelection: { classPropertyName: "RangeSelection", publicName: "RangeSelection", isSignal: true, isRequired: false, transformFunction: null }, ItemSourceProperty: { classPropertyName: "ItemSourceProperty", publicName: "ItemSourceProperty", isSignal: true, isRequired: false, transformFunction: null }, HasHeaderGroup: { classPropertyName: "HasHeaderGroup", publicName: "HasHeaderGroup", isSignal: true, isRequired: false, transformFunction: null }, HasSecondaryHeaderGroup: { classPropertyName: "HasSecondaryHeaderGroup", publicName: "HasSecondaryHeaderGroup", isSignal: true, isRequired: false, transformFunction: null }, SearchView: { classPropertyName: "SearchView", publicName: "SearchView", isSignal: true, isRequired: false, transformFunction: null }, _AutoUpdate: { classPropertyName: "_AutoUpdate", publicName: "AutoUpdate", isSignal: true, isRequired: false, transformFunction: null }, EsThTdProvider: { classPropertyName: "EsThTdProvider", publicName: "EsThTdProvider", isSignal: false, isRequired: false, transformFunction: null }, globalCheck: { classPropertyName: "globalCheck", publicName: "globalCheck", isSignal: true, isRequired: false, transformFunction: null }, autoUpdate: { classPropertyName: "autoUpdate", publicName: "autoUpdate", isSignal: true, isRequired: false, transformFunction: null }, seconds: { classPropertyName: "seconds", publicName: "seconds", isSignal: true, isRequired: false, transformFunction: null }, researchInProgress: { classPropertyName: "researchInProgress", publicName: "researchInProgress", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onOrderChanged: "onOrderChanged", onSearchRequest: "onSearchRequest", onSelectionChanged: "onSelectionChanged", onRemoval: "onRemoval", onAbortRemoval: "onAbortRemoval", onModelChange: "onModelChange", onOpenContextMenu: "onOpenContextMenu", onCornerAction: "onCornerAction", onDynamicOperation: "onDynamicOperation", globalCheck: "globalCheckChange", autoUpdate: "autoUpdateChange", seconds: "secondsChange", researchInProgress: "researchInProgressChange" }, host: { listeners: { "document:mouseup": "onResizeEnd()", "document:copy": "onDocCopy($event)", "document:paste": "onDocPaste($event)", "document:click": "onDocClick()", "document:mousemove": "onResizeMove($event)" }, properties: { "class.est2": "this.hostClass", "class.est2--dense": "this.denseClass" } }, queries: [{ propertyName: "headerRef", first: true, predicate: ["header"], descendants: true }, { propertyName: "bodyRef", first: true, predicate: ["body"], descendants: true }, { propertyName: "thDirectives", predicate: EsThDirective }, { propertyName: "tdDirectives", predicate: EsTdDirective }, { propertyName: "editorDirectives", predicate: EsTdEditorDirective }, { propertyName: "thTdProviders", predicate: ThTdProvider }], viewQueries: [{ propertyName: "tableEmptyMenu", first: true, predicate: ["emptyMenu"], descendants: true, static: true }, { propertyName: "theadRef", first: true, predicate: ["theadRef"], descendants: true }], ngImport: i0, template: "@if (view()) {\n  <div class=\"est2-wrap {{ ContainerClass() }}\"\n       [style.height]=\"Height()\"\n       [style.background-color]=\"EmptySpaceBackgroundColor() || null\">\n\n    <!-- Auto-aggiornamento: toggle + intervallo (in alto a destra) -->\n    @if (AutoUpdate()) {\n      <div class=\"est2-autoupdate\">\n        <label class=\"est2-autoupdate__label\">\n          Aggiorna ogni\n          <input type=\"text\" maxlength=\"3\" class=\"est2-autoupdate__secs\"\n                 [ngModel]=\"seconds()\" (ngModelChange)=\"seconds.set($event)\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (change)=\"autoUpdateChanged()\" />\n          secondi\n        </label>\n        <label class=\"est2-switch\" title=\"Attiva/disattiva auto-aggiornamento\">\n          <input type=\"checkbox\" [ngModel]=\"autoUpdate()\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (ngModelChange)=\"autoUpdate.set($event); autoUpdateChanged()\" />\n          <span class=\"est2-switch__slider\"></span>\n        </label>\n      </div>\n    }\n\n    <!-- Pager superiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'top') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Barra \"seleziona tutto\" (visibile solo con selezione multipla attiva e righe presenti) -->\n    @if (Selection() && !SingleSelection() && hasSelection) {\n      <div class=\"est2-selectbar\" [style.height.px]=\"selbarHeight() ? selbarHeight() + 1 : null\">\n        @if (allSelected) {\n          <span>Tutti i <strong>{{ selectedCount }}</strong> elementi sono selezionati</span>\n        } @else {\n          <span><strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'elemento selezionato' : 'elementi selezionati' }}</span>\n          @if (canSelectEverything) {\n            <span class=\"est2-link\" (click)=\"selectEverything()\">Seleziona tutti i {{ totalCount() }} elementi</span>\n          }\n        }\n        <span class=\"est2-selectbar__spacer\"></span>\n        <span class=\"est2-link\" (click)=\"clearSelection()\">Azzera selezione</span>\n      </div>\n    }\n\n    <div class=\"est2-scroll\" [style.max-height.px]=\"MaxHeight()\">\n      <table class=\"est2-table {{ TableClass() }}\"\n             [class.est2-table--range]=\"rangeActive()\"\n             [class.est2-table--dragging]=\"rangeDragging()\"\n             (mousedown)=\"onGridMouseDown($event)\"\n             (mouseover)=\"onGridMouseOver($event)\">\n\n        <!-- ================= HEADER ================= -->\n        @if (!HeaderHidden()) {\n          <thead #theadRef>\n            <!-- Righe di header-group multi-livello (dall'alto verso il basso) -->\n            @if (hasHeaderGroups()) {\n              @for (grow of headerGroupRows(); track $index) {\n                <tr class=\"est2-hgroup-row\">\n                  @if (Selection()) { <th class=\"est2-col-min est2-selcol\" [class.est2-pinned]=\"hasPinned()\" [style.left.px]=\"hasPinned() ? 0 : null\"></th> }\n                  @for (op of DynamicOperations(); track op.id) { <th class=\"est2-col-min\"></th> }\n                  @for (cell of grow; track cell.id; let gi = $index) {\n                    <th [attr.colspan]=\"cell.span\"\n                        [attr.data-groupid]=\"cell.isGroup ? cell.id : null\"\n                        [class.est2-hgroup]=\"cell.isGroup\"\n                        [class.est2-pinned]=\"gi < pinnedCount()\"\n                        [style.left.px]=\"gi < pinnedCount() ? pinnedLeftPx(gi) : null\"\n                        class=\"est2-hgroup-cell\">\n                      @if (cell.isGroup) {\n                        @if (cell.template) {\n                          <ng-container *ngTemplateOutlet=\"cell.template\"></ng-container>\n                        } @else {\n                          {{ cell.label }}\n                        }\n                      }\n                    </th>\n                  }\n                  @if (Removal()) { <th class=\"est2-col-min\"></th> }\n                  @if (hasChrome()) { <th class=\"est2-col-min\"></th> }\n                </tr>\n              }\n            }\n            <tr>\n              <!-- Colonna di selezione -->\n              @if (Selection()) {\n                <th class=\"est2-col-min est2-selcol\"\n                    [class.est2-pinned]=\"hasPinned()\"\n                    [style.left.px]=\"hasPinned() ? 0 : null\">\n                  @if (!SingleSelection()) {\n                    <input type=\"checkbox\" class=\"est2-check\"\n                           [checked]=\"globalCheck()\"\n                           [indeterminate]=\"selectionIndeterminate\"\n                           [disabled]=\"SelectionDisabled()\"\n                           (change)=\"toggleAll()\"\n                           aria-label=\"Seleziona tutto\" />\n                  }\n                </th>\n              }\n\n              <!-- Header da colonne (direttive / dinamica / report) -->\n              @if (usesColumns()) {\n                <!-- intestazioni vuote per le operazioni dinamiche -->\n                @for (op of DynamicOperations(); track op.id) {\n                  <th class=\"est2-col-min\"></th>\n                }\n                @for (col of visibleColumns(); track trackCol($index, col); let ci = $index) {\n                  <th [attr.data-colid]=\"col.id\"\n                      [class]=\"col.headerClass\"\n                      [class.est2-th--orderable]=\"OrderByColumn() && col.orderable\"\n                      [class.est2-col-min]=\"col.header?.thShrink\"\n                      [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                      [class.est2-pinned]=\"col.pinned\"\n                      [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                      [style.width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                      [style.min-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                      [style.max-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                      [style.text-align]=\"col.alignment\"\n                      [style.background-color]=\"col.headerBg || null\"\n                      (click)=\"toggleSort(col)\">\n                    <span class=\"est2-th__inner\">\n                      @if (col.header?.Template) {\n                        <ng-container *ngTemplateOutlet=\"col.header!.Template!; context: col.multiProp != null ? { $implicit: col.headerText } : null\"></ng-container>\n                      } @else {\n                        {{ col.headerText }}\n                      }\n                      @if (OrderByColumn() && col.orderable && orderOf(col.id)) {\n                        <span class=\"est2-sort est2-sort--active\"\n                              [class.est2-sort--desc]=\"orderOf(col.id) === 'DESC'\">\n                          <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 15l6-6 6 6\"/></svg>\n                        </span>\n                        @if (orderIndex(col.id) > 0 && MultipleOrderingDirectives()) {\n                          <span class=\"est2-sort__badge\">{{ orderIndex(col.id) }}</span>\n                        }\n                      }\n                      <!-- Indicatore/toggle di pin (visibile se pinnata o all'hover) -->\n                      @if (ColumnsPinnable() && col.multiProp == null) {\n                        <button type=\"button\" class=\"est2-pinbtn\"\n                                [class.est2-pinbtn--on]=\"col.pinned\"\n                                [title]=\"col.pinned ? 'Sblocca colonna' : 'Blocca colonna a sinistra'\"\n                                (click)=\"togglePin(col, $event)\">\n                          <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                        </button>\n                      }\n                    </span>\n                    <!-- Handle di ridimensionamento (colonne pinnate, gated da ColumnsResizable) -->\n                    @if (ColumnsResizable() && col.pinned) {\n                      <span class=\"est2-resize-handle\" title=\"Trascina per ridimensionare\"\n                            (mousedown)=\"startColumnResize(col, $event)\"\n                            (click)=\"$event.stopPropagation()\"></span>\n                    }\n                  </th>\n                }\n              }\n              <!-- Header da template semplice -->\n              @else if (headerRef) {\n                <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\n              }\n\n              <!-- Colonna rimozione -->\n              @if (Removal()) { <th class=\"est2-col-min\"></th> }\n              <!-- Colonna chrome (export / gestione colonne / menu) -->\n              @if (hasChrome()) {\n                <th class=\"est2-col-min est2-chrome-th\">\n                  <div class=\"est2-chrome\">\n                    @if (Export()) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Esporta\" (click)=\"$event.stopPropagation(); toggleExportMenu()\">\n                          <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><path d=\"M7 10l5 5 5-5\"/><path d=\"M12 15V3\"/></svg>\n                        </button>\n                        @if (exportMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @if (CSVExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                            @if (XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('XLSX')\">Esporta Excel (XLSX)</button> }\n                            @if (!CSVExport() && !XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                          </div>\n                        }\n                      </div>\n                    }\n                    @if (HiddenColumns() || ColumnsOrdering()) {\n                      <button type=\"button\" class=\"est2-chrome-btn\" title=\"Colonne\" (click)=\"$event.stopPropagation(); openColumnsDialog()\">\n                        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"1\"/><path d=\"M9 3v18\"/><path d=\"M15 3v18\"/></svg>\n                      </button>\n                    }\n                    @if (CornerMenuOptions().length > 0) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Opzioni\" (click)=\"$event.stopPropagation(); toggleCornerMenu()\">\u22EE</button>\n                        @if (cornerMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @for (opt of CornerMenuOptions(); track opt.id) {\n                              <button type=\"button\" class=\"est2-menu-item\" (click)=\"cornerAction(opt.id); cornerMenuOpen.set(false)\">{{ opt.description }}</button>\n                            }\n                          </div>\n                        }\n                      </div>\n                    }\n                  </div>\n                </th>\n              }\n            </tr>\n          </thead>\n        }\n\n        <!-- ================= BODY ================= -->\n        @if (!BodyHidden()) {\n          <tbody>\n            @for (item of boundSource(); track trackRow($index, item); let ri = $index) {\n              @if ((!grouped() && !Hierarchy()) || item._visible) {\n              <tr [class]=\"rowClass(item)\"\n                  [class.est2-row--selected]=\"item._selected\"\n                  [class.est2-row--removed]=\"item.removed || item.deleted\"\n                  [class.est2-row--group]=\"item._group\"\n                  [class.est2-row--clickable]=\"Selection() || item._group\"\n                  [contextMenu]=\"ContextMenu || emptyMenu\"\n                  [contextMenuSubject]=\"item\"\n                  (click)=\"handleRowClick(item, $event)\">\n\n                <!-- Cella di selezione -->\n                @if (Selection()) {\n                  <td class=\"est2-col-min est2-selcol\"\n                      [class.est2-pinned]=\"hasPinned()\"\n                      [style.left.px]=\"hasPinned() ? 0 : null\">\n                    @if (item._group) {\n                      @if (!SingleSelection()) {\n                        <input type=\"checkbox\" class=\"est2-check\"\n                               [checked]=\"groupSelectionState(item) === 'all'\"\n                               [indeterminate]=\"groupSelectionState(item) === 'some'\"\n                               [disabled]=\"SelectionDisabled()\"\n                               (click)=\"$event.stopPropagation()\"\n                               (change)=\"toggleGroupSelection(item)\"\n                               aria-label=\"Seleziona gruppo\" />\n                      }\n                    } @else {\n                      <input type=\"checkbox\" class=\"est2-check\"\n                             [checked]=\"item._selected\"\n                             [indeterminate]=\"hierarchyIndeterminate(item)\"\n                             [disabled]=\"SelectionDisabled()\"\n                             (click)=\"$event.stopPropagation()\"\n                             (change)=\"toggleRow(item)\"\n                             aria-label=\"Seleziona riga\" />\n                    }\n                  </td>\n                }\n\n                <!-- Celle da colonne (direttive / dinamica / report) -->\n                @if (usesColumns()) {\n                  <!-- Operazioni dinamiche (icone a sinistra) -->\n                  @for (op of DynamicOperations(); track op.id) {\n                    <td class=\"est2-col-min est2-op-cell\">\n                      @if (!item._group && operationVisible(op, item)) {\n                        <span class=\"est2-op\" [class]=\"op.iconClass || ''\" [title]=\"op.title\"\n                              (click)=\"$event.stopPropagation(); dynamicOperation(item, op.id)\">{{ op.text }}</span>\n                      }\n                    </td>\n                  }\n                  @for (col of visibleColumns(); track trackCol($index, col); let first = $first, ci = $index) {\n                    <td [class]=\"col.cssClass\"\n                        [style.text-align]=\"col.alignment\"\n                        [style.color]=\"cellColor(item, col, 'fore')\"\n                        [style.background-color]=\"cellColor(item, col, 'back')\"\n                        [class.est2-nowrap]=\"!col.wrap\"\n                        [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                        [class.est2-pinned]=\"col.pinned\"\n                        [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                        [style.width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                        [style.min-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                        [style.max-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                        (mouseenter)=\"onCellHover($event)\"\n                        [class.est2-td--group-key]=\"item._group && item.column === col.id\"\n                        [attr.data-r]=\"rangeActive() && !item._group ? ri : null\"\n                        [attr.data-c]=\"rangeActive() && !item._group ? ci : null\"\n                        [class.est2-cell-sel]=\"rangeActive() && inRange(ri, ci)\"\n                        [class.est2-cell-sel-t]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.top\"\n                        [class.est2-cell-sel-b]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.bottom\"\n                        [class.est2-cell-sel-l]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.left\"\n                        [class.est2-cell-sel-r]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.right\"\n                        [class.est2-cell-editing]=\"isEditing(ri, ci)\"\n                        (dblclick)=\"onCellDblClick(item, col, ri, ci)\">\n                      @if (isEditing(ri, ci)) {\n                        @if (editorFor(col); as edTpl) {\n                          <ng-container *ngTemplateOutlet=\"edTpl; context: editorContext(item, col)\"></ng-container>\n                        } @else {\n                          <ng-container *ngTemplateOutlet=\"defaultEditor; context: { $implicit: item, col: col }\"></ng-container>\n                        }\n                      } @else if (item._group) {\n                        @if (item.column === col.id) {\n                          <span class=\"est2-group-key\" [style.padding-left.px]=\"groupIndent(item)\">\n                            <span class=\"est2-group-chevron\" [class.est2-group-chevron--open]=\"item._expanded\">\n                              <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                            </span>\n                            {{ groupCellDisplay(item, col) }}\n                          </span>\n                        } @else {\n                          {{ groupCellDisplay(item, col) }}\n                        }\n                      } @else {\n                        <!-- Navigatore albero nella prima colonna -->\n                        @if (Hierarchy() && first) {\n                          <span class=\"est2-hier-lead\" [style.padding-left.px]=\"hierarchyIndent(item)\">\n                            @if (item.parent) {\n                              <span class=\"est2-group-chevron est2-hier-toggle\" [class.est2-group-chevron--open]=\"item._expanded\"\n                                    (click)=\"$event.stopPropagation(); toggleHierarchyNode(item)\">\n                                <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                              </span>\n                            } @else {\n                              <span class=\"est2-hier-toggle\"></span>\n                            }\n                          </span>\n                        }\n                        @if (itemCellHidden(col)) {\n                          <!-- colonna di gruppo nascosta sulla riga-oggetto -->\n                        } @else if (col.multiProp != null) {\n                          @if (col.cell?.Template) {\n                            <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: multiCell(item, col) }\"></ng-container>\n                          } @else {\n                            {{ multiCell(item, col)?.value }}\n                          }\n                        } @else if (col.cell?.Template) {\n                          <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: item }\"></ng-container>\n                        } @else if (col.routePath) {\n                          <a class=\"est2-link\" [routerLink]=\"routerLinkFor(item, col)\">{{ cellValue(item, col) }}</a>\n                        } @else if (col.propAccessor != null) {\n                          {{ reportCellDisplay(item, col) }}\n                        } @else if (col.type === 'enum') {\n                          {{ (cellValue(item, col) | est2_lookup : col.source).description }}\n                        } @else {\n                          {{ cellValue(item, col) | est2_format : col.type : col.format : locale }}\n                        }\n                      }\n                    </td>\n                  }\n                }\n                <!-- Celle da template semplice -->\n                @else if (bodyRef) {\n                  <ng-container *ngTemplateOutlet=\"bodyRef; context: { $implicit: item }\"></ng-container>\n                }\n\n                <!-- Rimozione (non sulle righe-gruppo) -->\n                @if (Removal()) {\n                  <td class=\"est2-col-min\">\n                    @if (!item._group && canRemove(item)) {\n                      @if (item.removed || item.deleted) {\n                        <button type=\"button\" class=\"est2-rowaction\" title=\"Ripristina\" (click)=\"abortRemoval(item)\">\u21BA</button>\n                      } @else {\n                        <button type=\"button\" class=\"est2-rowaction est2-rowaction--danger\" title=\"Rimuovi\" (click)=\"removeItem(item)\">\u2715</button>\n                      }\n                    }\n                  </td>\n                }\n                <!-- Chrome -->\n                @if (hasChrome()) { <td class=\"est2-col-min\"></td> }\n              </tr>\n              }\n            } @empty {\n              <tr>\n                <td class=\"est2-empty\" [attr.colspan]=\"totalColspan()\">Nessun elemento da visualizzare</td>\n              </tr>\n            }\n          </tbody>\n        }\n      </table>\n\n      <!-- Overlay di caricamento -->\n      @if (researchInProgress() || (firstBind() && ShowLoadingOnBootstrap())) {\n        <div class=\"est2-loading\">\n          <span class=\"est2-spinner\"></span>\n          <span>Caricamento\u2026</span>\n        </div>\n      }\n    </div>\n\n    <!-- Pager inferiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'bottom') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Avviso transitorio (es. incolla con dimensioni incompatibili) -->\n    @if (notice()) {\n      <div class=\"est2-toast\" role=\"alert\">\n        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 9v4\"/><path d=\"M12 17h.01\"/><path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\"/></svg>\n        <span>{{ notice() }}</span>\n      </div>\n    }\n\n    <!-- Dialog visibilit\u00E0 / ordine colonne -->\n    @if (columnsDialogOpen()) {\n      <div class=\"est2-dialog-backdrop\" (click)=\"closeColumnsDialog()\">\n        <div class=\"est2-dialog\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-modal=\"true\">\n          <div class=\"est2-dialog__head\">\n            <span>\n              @if (HiddenColumns() && ColumnsOrdering()) { Visibilit\u00E0 e ordine colonne }\n              @else if (HiddenColumns()) { Visibilit\u00E0 colonne }\n              @else { Ordine colonne }\n            </span>\n            <button type=\"button\" class=\"est2-dialog__close\" (click)=\"closeColumnsDialog()\" aria-label=\"Chiudi\">\u2715</button>\n          </div>\n\n          @if (HiddenColumns()) {\n            <div class=\"est2-dialog__tools\">\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(true)\">Mostra tutte</button>\n              <span class=\"est2-dialog__sep\">\u00B7</span>\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(false)\">Nascondi tutte</button>\n            </div>\n          }\n\n          <ul class=\"est2-collist\">\n            @for (c of dialogCols(); track c.id; let i = $index) {\n              <li class=\"est2-collist__row\"\n                  [attr.draggable]=\"ColumnsOrdering() ? true : null\"\n                  [class.est2-collist__row--drag]=\"ColumnsOrdering()\"\n                  [class.est2-collist__row--dragging]=\"dragIndex() === i\"\n                  [class.est2-collist__row--drop-above]=\"dragOverIndex() === i && dragIndex() !== null && dragIndex()! > i\"\n                  [class.est2-collist__row--drop-below]=\"dragOverIndex() === i && dragIndex() !== null && dragIndex()! < i\"\n                  (dragstart)=\"dialogDragStart(i, $event)\"\n                  (dragover)=\"dialogDragOver(i, $event)\"\n                  (drop)=\"dialogDrop(i, $event)\"\n                  (dragend)=\"dialogDragEnd()\">\n                @if (ColumnsOrdering()) {\n                  <span class=\"est2-collist__grip\" title=\"Trascina per riordinare\" aria-hidden=\"true\">\n                    <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"currentColor\"><circle cx=\"9\" cy=\"6\" r=\"1.6\"/><circle cx=\"15\" cy=\"6\" r=\"1.6\"/><circle cx=\"9\" cy=\"12\" r=\"1.6\"/><circle cx=\"15\" cy=\"12\" r=\"1.6\"/><circle cx=\"9\" cy=\"18\" r=\"1.6\"/><circle cx=\"15\" cy=\"18\" r=\"1.6\"/></svg>\n                  </span>\n                }\n                @if (HiddenColumns()) {\n                  <label class=\"est2-collist__vis\">\n                    <input type=\"checkbox\" class=\"est2-check\" [checked]=\"c.visible\" (change)=\"dialogToggle(i)\" />\n                  </label>\n                }\n                <span class=\"est2-collist__label\">{{ c.label }}</span>\n                @if (ColumnsPinnable()) {\n                  <button type=\"button\" class=\"est2-iconbtn est2-collist__pin\" [class.est2-collist__pin--on]=\"c.pinned\"\n                          [disabled]=\"c.grouped\"\n                          [title]=\"c.grouped ? 'Le colonne di un gruppo non sono bloccabili' : (c.pinned ? 'Sblocca' : 'Blocca a sinistra')\"\n                          (click)=\"dialogTogglePin(i)\">\n                    <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                  </button>\n                }\n                @if (ColumnsOrdering()) {\n                  <span class=\"est2-collist__ord\">\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === 0\" title=\"Su\" (click)=\"dialogMove(i, -1)\">\u2191</button>\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === dialogCols().length - 1\" title=\"Gi\u00F9\" (click)=\"dialogMove(i, 1)\">\u2193</button>\n                  </span>\n                }\n              </li>\n            }\n          </ul>\n\n          <div class=\"est2-dialog__foot\">\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"resetColumnsDialog()\">Ripristina</button>\n            <span class=\"est2-dialog__spacer\"></span>\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"closeColumnsDialog()\">Annulla</button>\n            <button type=\"button\" class=\"est2-btn est2-btn--primary\" (click)=\"applyColumnsDialog()\">Applica</button>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n<!-- Template pager riutilizzabile sopra/sotto -->\n<ng-template #pager>\n  @if (!HidePaging() && !grouped()) {\n    <es-table2-pager\n      [page]=\"currentPage()\"\n      [pages]=\"totalPages()\"\n      [total]=\"totalCount()\"\n      [itemsPerPage]=\"viewMode() ? (view()?.itemsperpageoverride ?? 15) : ArraymodeItemsPerPage()\"\n      [countLabel]=\"CountLabel()\"\n      [showCount]=\"!HidePagingCount()\"\n      [showButtons]=\"!HidePagingButtons()\"\n      [showPagingOptions]=\"!HidePagingButtons()\"\n      [allowAll]=\"AllSearch()\"\n      (pageChange)=\"goToPage($event)\"\n      (itemsPerPageChange)=\"changeItemsPerPage($event)\">\n    </es-table2-pager>\n  }\n</ng-template>\n\n<!-- Editor di cella di default (usato quando il consumer non fornisce un `*editor`) -->\n<ng-template #defaultEditor let-item let-col=\"col\">\n  @switch (col.type) {\n    @case ('enum') {\n      <select class=\"est2-editor-input\"\n              [value]=\"editDraft\"\n              (change)=\"editDraft = $any($event.target).value\"\n              (keydown.enter)=\"commitEdit(item, col)\"\n              (keydown.escape)=\"cancelEdit()\"\n              (blur)=\"commitEdit(item, col)\">\n        @for (o of col.source || []; track o.id) {\n          <option [value]=\"o.id\" [selected]=\"o.id == editDraft\">{{ o.description }}</option>\n        }\n      </select>\n    }\n    @case ('boolean') {\n      <input type=\"checkbox\" class=\"est2-editor-input est2-check\"\n             [checked]=\"editDraft === true || editDraft === 'true'\"\n             (change)=\"editDraft = $any($event.target).checked; commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\" />\n    }\n    @default {\n      <input class=\"est2-editor-input\"\n             [type]=\"editorInputType(col.type)\"\n             [value]=\"editDraft\"\n             (input)=\"editDraft = $any($event.target).value\"\n             (keydown.enter)=\"commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\"\n             (blur)=\"commitEdit(item, col)\" />\n    }\n  }\n</ng-template>\n\n<!-- Menu di default (nessuna operazione) usato quando il consumer non passa [ContextMenu] -->\n<context-menu #emptyMenu>\n  <ng-template contextMenuItem [passive]=\"true\"><em>Nessuna operazione disponibile\u2026</em></ng-template>\n</context-menu>\n", styles: [".est2{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent);--est-radius: 10px;--est-radius-sm: 6px;--est-radius-pill: 999px;--est-gap: 8px;--est-cell-py: 6px;--est-cell-px: 12px;--est-row-h: 33px;--est-font: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--est-fs: 13px;--est-fs-sm: 12px;--est-fw-head: 700;--est-transition: .14s cubic-bezier(.4, 0, .2, 1);--est-bg-zebra: color-mix(in srgb, var(--est-fg) 3.5%, var(--est-bg));font-family:var(--est-font);font-size:var(--est-fs);color:var(--est-fg);position:relative;display:block}@media(prefers-color-scheme:dark){.est2{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}}.est2.est2--dark{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}.est2.est2--light{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent)}.est2.est2--dense{--est-cell-py: 3px;--est-cell-px: 9px;--est-row-h: 27px;--est-fs: 12.5px}.est2 *,.est2 *:before,.est2 *:after{box-sizing:border-box}.est2 .est2-scroll{position:relative;width:100%;overflow:auto;border:1px solid var(--est-border);border-radius:var(--est-radius);background:var(--est-bg);-webkit-overflow-scrolling:touch}.est2 table.est2-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--est-bg)}.est2 thead th{position:sticky;top:0;z-index:3;background:var(--est-bg-subtle);color:var(--est-fg);font-weight:var(--est-fw-head);font-size:var(--est-fs);text-align:left;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);box-shadow:var(--est-shadow-sticky);-webkit-user-select:none;user-select:none}.est2 thead tr.est2-hgroup-row th{font-size:var(--est-fs-sm);font-weight:700;color:var(--est-fg-muted);text-align:center;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);background:var(--est-bg-subtle);border-bottom:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th.est2-hgroup{color:var(--est-fg);border-left:1px solid var(--est-border);border-right:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th:not(.est2-hgroup){background:var(--est-bg-subtle);border-bottom-color:transparent}.est2 thead tr:last-child th.est2-col-groupstart,.est2 tbody td.est2-col-groupstart{border-left:1px solid var(--est-border)}.est2 tbody td{padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);color:var(--est-fg);vertical-align:middle;background:transparent}.est2 tbody tr:nth-child(2n) td{background:var(--est-bg-zebra)}.est2 tbody tr:nth-child(2n) td.est2-pinned{background:var(--est-bg-zebra)}.est2 th.est2-pinned,.est2 td.est2-pinned{position:sticky;background:var(--est-bg);box-shadow:1px 0 0 var(--est-border)}.est2 thead th.est2-pinned{position:sticky}.est2 .est2-resize-handle{position:absolute;top:0;right:-3px;width:10px;height:100%;cursor:col-resize;z-index:2;touch-action:none;-webkit-user-select:none;user-select:none}.est2 .est2-resize-handle:after{content:\"\";position:absolute;top:28%;bottom:28%;right:3px;width:2px;border-radius:2px;background:color-mix(in srgb,var(--est-fg) 30%,transparent);transition:background var(--est-transition),top var(--est-transition),bottom var(--est-transition)}.est2 .est2-resize-handle:hover:after{background:var(--est-accent);top:15%;bottom:15%}.est2 thead th.est2-pinned .est2-resize-handle:active:after{background:var(--est-accent);top:6%;bottom:6%}.est2 td.est2-pinned{overflow:hidden;text-overflow:ellipsis}.est2 .est2-selcol{width:44px;min-width:44px;max-width:44px}.est2 td.est2-pinned{z-index:3}.est2 thead th.est2-pinned,.est2 thead tr.est2-hgroup-row th.est2-pinned{z-index:6;background:var(--est-bg-subtle)}.est2 tbody tr:hover td.est2-pinned{background:color-mix(in srgb,var(--est-fg) 5%,var(--est-bg))}.est2 tbody tr.est2-row--selected td.est2-pinned{background:color-mix(in srgb,var(--est-accent) 12%,var(--est-bg))}.est2 tbody tr.est2-row--group td.est2-pinned{background:var(--est-bg-subtle)}.est2 .est2-pinbtn{display:inline-flex;align-items:center;justify-content:center;margin-left:4px;padding:2px;border:none;background:transparent;color:var(--est-fg-faint);border-radius:var(--est-radius-sm);cursor:pointer;opacity:0;transition:opacity var(--est-transition),color var(--est-transition),background var(--est-transition)}.est2 thead th:hover .est2-pinbtn{opacity:.7}.est2 .est2-pinbtn:hover{background:var(--est-bg-hover);color:var(--est-fg);opacity:1}.est2 .est2-pinbtn--on{opacity:1;color:var(--est-accent);transform:rotate(0)}.est2 thead th:hover .est2-pinbtn--on{opacity:1}.est2 .est2-collist__pin.est2-collist__pin--on{color:var(--est-accent);border-color:var(--est-accent)}.est2 tbody tr{height:var(--est-row-h);transition:background var(--est-transition)}.est2 tbody tr:last-child td{border-bottom:none}.est2 tbody tr:hover td{background:var(--est-bg-hover)}.est2 tbody tr.est2-row--selected td{background:var(--est-bg-selected)}.est2 tbody tr.est2-row--clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--removed td{text-decoration:line-through;color:var(--est-fg-faint)}.est2 .est2-table--range tbody td[data-r]{cursor:cell}.est2 .est2-table--dragging,.est2 .est2-table--dragging tbody td{-webkit-user-select:none;user-select:none}.est2 tbody td.est2-cell-sel{background:color-mix(in srgb,var(--est-accent) 14%,transparent)}.est2 tbody td.est2-cell-sel-t{box-shadow:inset 0 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b{box-shadow:inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l{box-shadow:inset 2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-r{box-shadow:inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b{box-shadow:inset 0 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 0 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px -2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-editing{padding:2px 6px}.est2 .est2-editor-input{width:100%;box-sizing:border-box;height:calc(var(--est-row-h) - 8px);padding:2px 6px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1.5px solid var(--est-accent);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-editor-input:focus-visible{box-shadow:var(--est-ring)}.est2 input.est2-editor-input[type=checkbox]{width:16px;height:16px}.est2 .est2-autoupdate{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:4px 2px 8px;font-size:var(--est-fs-sm);color:var(--est-fg-muted)}.est2 .est2-autoupdate__label{display:inline-flex;align-items:center;gap:6px}.est2 .est2-autoupdate__secs{width:44px;text-align:center;padding:3px 4px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-autoupdate__secs:focus-visible{box-shadow:var(--est-ring);border-color:var(--est-accent)}.est2 .est2-switch{position:relative;display:inline-flex;width:38px;height:20px;cursor:pointer}.est2 .est2-switch input{position:absolute;opacity:0;width:0;height:0}.est2 .est2-switch__slider{flex:1;border-radius:var(--est-radius-pill);background:var(--est-border-strong);transition:background var(--est-transition)}.est2 .est2-switch__slider:before{content:\"\";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #00000040;transition:transform var(--est-transition)}.est2 .est2-switch input:checked+.est2-switch__slider{background:var(--est-accent)}.est2 .est2-switch input:checked+.est2-switch__slider:before{transform:translate(18px)}.est2 .est2-switch input:focus-visible+.est2-switch__slider{box-shadow:var(--est-ring)}.est2 .est2-toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%);z-index:20;display:inline-flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:8px 14px;font-size:13px;font-weight:500;color:#fff;background:#b91c1c;border-radius:var(--est-radius);box-shadow:0 6px 20px #00000040;animation:est2-toast-in .16s ease-out}.est2 .est2-toast svg{flex:0 0 auto}@keyframes est2-toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(prefers-reduced-motion:reduce){.est2 .est2-toast{animation:none}}.est2 tbody tr.est2-row--group{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--group td{background:var(--est-bg-subtle);font-weight:600;color:var(--est-fg);border-bottom:1px solid var(--est-border)}.est2 tbody tr.est2-row--group:hover td{background:var(--est-bg-hover)}.est2 .est2-td--group-key{color:var(--est-fg)}.est2 .est2-group-key{display:inline-flex;align-items:center;gap:6px}.est2 .est2-group-chevron{display:inline-flex;color:var(--est-fg-muted);transition:transform var(--est-transition)}.est2 .est2-group-chevron--open{transform:rotate(90deg)}.est2 .est2-hier-lead{display:inline-flex;align-items:center;vertical-align:middle;margin-right:4px}.est2 .est2-hier-toggle{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:none}.est2 .est2-group-chevron.est2-hier-toggle{cursor:pointer;border-radius:var(--est-radius-sm);transition:transform var(--est-transition),background var(--est-transition),color var(--est-transition)}.est2 .est2-group-chevron.est2-hier-toggle:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 th.est2-th--orderable{cursor:pointer;transition:color var(--est-transition)}.est2 th.est2-th--orderable:hover{color:var(--est-fg)}.est2 .est2-th__inner{display:inline-flex;align-items:center;gap:6px}.est2 .est2-sort{display:inline-flex;width:14px;height:14px;opacity:.35;transition:opacity var(--est-transition),transform var(--est-transition)}.est2 .est2-sort--active{opacity:1;color:var(--est-accent)}.est2 .est2-sort--desc{transform:rotate(180deg)}.est2 .est2-sort__badge{font-size:9px;font-weight:700;color:var(--est-accent);margin-left:2px}.est2 .est2-check{appearance:none;width:16px;height:16px;border:1.5px solid var(--est-border-strong);border-radius:var(--est-radius-sm);background:var(--est-bg);cursor:pointer;position:relative;transition:border-color var(--est-transition),background var(--est-transition);vertical-align:middle;flex:none}.est2 .est2-check:hover{border-color:var(--est-accent)}.est2 .est2-check:checked{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:checked:after{content:\"\";position:absolute;left:4.5px;top:1.5px;width:4px;height:8px;border:solid var(--est-accent-fg);border-width:0 2px 2px 0;transform:rotate(45deg)}.est2 .est2-check:focus-visible{outline:none;box-shadow:var(--est-ring)}.est2 .est2-check:indeterminate{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:indeterminate:after{content:\"\";position:absolute;left:3px;top:6px;width:8px;height:2px;background:var(--est-accent-fg);transform:none;border:none}.est2 th.est2-col-min,.est2 td.est2-col-min{width:1%;white-space:nowrap}.est2 .est2-wrap{position:relative}.est2 .est2-selectbar{position:absolute;top:0;left:0;right:0;z-index:15;display:flex;align-items:center;gap:12px;padding:9px 14px;font-size:var(--est-fs-sm);color:var(--est-fg);background:var(--est-bg-subtle);border:none;border-radius:var(--est-radius) var(--est-radius) 0 0;box-shadow:inset 3px 0 0 var(--est-accent)}.est2 .est2-selectbar strong{color:var(--est-fg);font-weight:700}.est2 .est2-selectbar__spacer{flex:1 1 auto}.est2 .est2-link{color:var(--est-accent);cursor:pointer;font-weight:600}.est2 .est2-link:hover{text-decoration:underline}.est2 .est2-rowaction{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);border:none;background:transparent;color:var(--est-fg-faint);cursor:pointer;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-rowaction:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-rowaction--danger:hover{color:var(--est-danger)}.est2 .est2-op-cell{text-align:center}.est2 .est2-op{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding:0 6px;border-radius:var(--est-radius-sm);color:var(--est-accent);cursor:pointer;font-size:var(--est-fs-sm);transition:background var(--est-transition)}.est2 .est2-op:hover{background:var(--est-accent-weak)}.est2 .est2-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:color-mix(in srgb,var(--est-bg) 70%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:5;color:var(--est-fg-muted);font-size:var(--est-fs-sm)}.est2 .est2-spinner{width:16px;height:16px;border:2px solid var(--est-border-strong);border-top-color:var(--est-accent);border-radius:50%;animation:est2-spin .7s linear infinite}@keyframes est2-spin{to{transform:rotate(360deg)}}.est2 .est2-nowrap{white-space:nowrap}.est2 .est2-cornermenu{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);cursor:pointer;color:var(--est-fg-muted);transition:background var(--est-transition)}.est2 .est2-cornermenu:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-chrome-th{position:relative}.est2 .est2-chrome{display:inline-flex;align-items:center;gap:2px}.est2 .est2-chrome-wrap{position:relative;display:inline-flex}.est2 .est2-chrome-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;background:transparent;border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer;font-size:16px;line-height:1;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-chrome-btn:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-menu{position:absolute;top:calc(100% + 4px);right:0;z-index:30;min-width:180px;padding:4px;background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 8px 24px #0000002e;display:flex;flex-direction:column}.est2 .est2-menu-item{display:block;width:100%;padding:8px 10px;border:none;background:transparent;text-align:left;font:inherit;color:var(--est-fg);border-radius:var(--est-radius-sm);cursor:pointer}.est2 .est2-menu-item:hover{background:var(--est-bg-hover)}.est2 .est2-dialog-backdrop{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:16px;background:color-mix(in srgb,#000 32%,transparent)}.est2 .est2-dialog{width:520px;max-width:calc(100vw - 32px);max-height:100%;display:flex;flex-direction:column;background:var(--est-bg);color:var(--est-fg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 16px 48px #0000004d;overflow:hidden}.est2 .est2-dialog__head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;font-weight:700;border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__close{border:none;background:transparent;cursor:pointer;color:var(--est-fg-muted);font-size:15px;line-height:1;padding:4px;border-radius:var(--est-radius-sm)}.est2 .est2-dialog__close:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-dialog__tools{padding:8px 14px;font-size:var(--est-fs-sm);border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__tools .est2-link{border:none;background:none;padding:0;font:inherit;font-weight:600}.est2 .est2-dialog__sep{margin:0 6px;color:var(--est-fg-faint)}.est2 .est2-collist{list-style:none;margin:0;padding:6px;overflow-y:auto}.est2 .est2-collist__row{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--est-radius-sm)}.est2 .est2-collist__row:hover{background:var(--est-bg-hover)}.est2 .est2-collist__row--drag{cursor:grab}.est2 .est2-collist__row--drag:active{cursor:grabbing}.est2 .est2-collist__row--dragging{opacity:.45;background:var(--est-bg-hover)}.est2 .est2-collist__row--drop-above{box-shadow:inset 0 2px 0 0 var(--est-accent)}.est2 .est2-collist__row--drop-below{box-shadow:inset 0 -2px 0 0 var(--est-accent)}.est2 .est2-collist__grip{display:inline-flex;align-items:center;justify-content:center;color:var(--est-fg-faint);cursor:grab;flex:0 0 auto}.est2 .est2-collist__grip:active{cursor:grabbing}.est2 .est2-collist__row--drag:hover .est2-collist__grip{color:var(--est-fg-muted)}.est2 .est2-collist__vis{display:inline-flex}.est2 .est2-collist__label{flex:1 1 auto}.est2 .est2-collist__ord{display:inline-flex;gap:4px}.est2 .est2-iconbtn{width:26px;height:26px;border:1px solid var(--est-border);background:var(--est-bg);border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer}.est2 .est2-iconbtn:hover:not(:disabled){background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-iconbtn:disabled{opacity:.4;cursor:default}.est2 .est2-dialog__foot{display:flex;align-items:center;gap:8px;padding:12px 14px;border-top:1px solid var(--est-border)}.est2 .est2-dialog__spacer{flex:1 1 auto}.est2 .est2-btn{padding:7px 14px;border-radius:var(--est-radius-sm);font:inherit;font-weight:600;cursor:pointer;border:1px solid transparent}.est2 .est2-btn--ghost{background:transparent;color:var(--est-fg);border-color:var(--est-border)}.est2 .est2-btn--ghost:hover{background:var(--est-bg-hover)}.est2 .est2-btn--primary{background:var(--est-accent);color:var(--est-accent-fg)}.est2 .est2-btn--primary:hover{filter:brightness(1.05)}.est2 .est2-empty{padding:48px 16px;text-align:center;color:var(--est-fg-faint);font-size:var(--est-fs-sm)}.ngx-contextmenu{--ctx-bg: #ffffff;--ctx-fg: #1a1d24;--ctx-muted: #626b7a;--ctx-border: #e6e9ef;--ctx-hover: #f2f4f7;--ctx-accent: #4f46e5;--ctx-shadow: 0 10px 28px -8px rgba(16, 24, 40, .22), 0 2px 8px -3px rgba(16, 24, 40, .14);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.ngx-contextmenu .dropdown-menu{display:block;min-width:200px;margin:0;padding:6px;list-style:none;background:var(--ctx-bg);border:1px solid var(--ctx-border);border-radius:12px;box-shadow:var(--ctx-shadow);animation:est2-ctx-in .12s cubic-bezier(.16,1,.3,1)}.ngx-contextmenu li{list-style:none;margin:0}.ngx-contextmenu li>a{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:7px;color:var(--ctx-fg);font-size:13.5px;line-height:1.2;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .12s ease,color .12s ease}.ngx-contextmenu li>a:hover,.ngx-contextmenu li>a:focus{background:var(--ctx-hover);color:var(--ctx-fg);text-decoration:none;outline:none}.ngx-contextmenu li.divider,.ngx-contextmenu li[role=separator]{height:1px;margin:6px 8px;padding:0;background:var(--ctx-border)}.ngx-contextmenu li.disabled>a,.ngx-contextmenu li[aria-disabled=true]>a{color:var(--ctx-muted);opacity:.55;pointer-events:none}@media(prefers-color-scheme:dark){.ngx-contextmenu{--ctx-bg: #1e222b;--ctx-fg: #e7eaf0;--ctx-muted: #9aa3b2;--ctx-border: #2a2f3a;--ctx-hover: #232733;--ctx-accent: #7c74ff;--ctx-shadow: 0 12px 30px -8px rgba(0, 0, 0, .6), 0 2px 8px -3px rgba(0, 0, 0, .5)}}@keyframes est2-ctx-in{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.ngx-contextmenu .dropdown-menu{animation:none}}\n"], dependencies: [{ kind: "directive", type: i8.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", 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]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i9.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i12.ContextMenuAttachDirective, selector: "[contextMenu]", inputs: ["contextMenuSubject", "contextMenu"] }, { kind: "component", type: i12.ContextMenuComponent, selector: "context-menu", inputs: ["menuClass", "autoFocus", "useBootstrap4", "disabled"], outputs: ["close", "open"] }, { kind: "directive", type: i12.ContextMenuItemDirective, selector: "[contextMenuItem]", inputs: ["subMenu", "divider", "enabled", "passive", "visible"], outputs: ["execute"] }, { kind: "component", type: EsTable2PagerComponent, selector: "es-table2-pager", inputs: ["page", "pages", "total", "itemsPerPage", "countLabel", "showCount", "showButtons", "showPagingOptions", "allowAll"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "pipe", type: Est2FormatPipe, name: "est2_format" }, { kind: "pipe", type: Est2LookupPipe, name: "est2_lookup" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: EsTable2Component, decorators: [{
             type: Component,
-            args: [{ selector: 'es-table2', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (view()) {\n  <div class=\"est2-wrap {{ ContainerClass() }}\"\n       [style.height]=\"Height()\"\n       [style.background-color]=\"EmptySpaceBackgroundColor() || null\">\n\n    <!-- Auto-aggiornamento: toggle + intervallo (in alto a destra) -->\n    @if (AutoUpdate()) {\n      <div class=\"est2-autoupdate\">\n        <label class=\"est2-autoupdate__label\">\n          Aggiorna ogni\n          <input type=\"text\" maxlength=\"3\" class=\"est2-autoupdate__secs\"\n                 [ngModel]=\"seconds()\" (ngModelChange)=\"seconds.set($event)\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (change)=\"autoUpdateChanged()\" />\n          secondi\n        </label>\n        <label class=\"est2-switch\" title=\"Attiva/disattiva auto-aggiornamento\">\n          <input type=\"checkbox\" [ngModel]=\"autoUpdate()\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (ngModelChange)=\"autoUpdate.set($event); autoUpdateChanged()\" />\n          <span class=\"est2-switch__slider\"></span>\n        </label>\n      </div>\n    }\n\n    <!-- Pager superiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'top') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Barra \"seleziona tutto\" (visibile solo con selezione multipla attiva e righe presenti) -->\n    @if (Selection() && !SingleSelection() && hasSelection) {\n      <div class=\"est2-selectbar\" [style.height.px]=\"selbarHeight() ? selbarHeight() + 1 : null\">\n        @if (allSelected) {\n          <span>Tutti i <strong>{{ selectedCount }}</strong> elementi sono selezionati</span>\n        } @else {\n          <span><strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'elemento selezionato' : 'elementi selezionati' }}</span>\n          @if (canSelectEverything) {\n            <span class=\"est2-link\" (click)=\"selectEverything()\">Seleziona tutti i {{ totalCount() }} elementi</span>\n          }\n        }\n        <span class=\"est2-selectbar__spacer\"></span>\n        <span class=\"est2-link\" (click)=\"clearSelection()\">Azzera selezione</span>\n      </div>\n    }\n\n    <div class=\"est2-scroll\" [style.max-height.px]=\"MaxHeight()\">\n      <table class=\"est2-table {{ TableClass() }}\"\n             [class.est2-table--range]=\"rangeActive()\"\n             [class.est2-table--dragging]=\"rangeDragging()\"\n             (mousedown)=\"onGridMouseDown($event)\"\n             (mouseover)=\"onGridMouseOver($event)\">\n\n        <!-- ================= HEADER ================= -->\n        @if (!HeaderHidden()) {\n          <thead #theadRef>\n            <!-- Righe di header-group multi-livello (dall'alto verso il basso) -->\n            @if (hasHeaderGroups()) {\n              @for (grow of headerGroupRows(); track $index) {\n                <tr class=\"est2-hgroup-row\">\n                  @if (Selection()) { <th class=\"est2-col-min est2-selcol\" [class.est2-pinned]=\"hasPinned()\" [style.left.px]=\"hasPinned() ? 0 : null\"></th> }\n                  @for (op of DynamicOperations(); track op.id) { <th class=\"est2-col-min\"></th> }\n                  @for (cell of grow; track cell.id; let gi = $index) {\n                    <th [attr.colspan]=\"cell.span\"\n                        [attr.data-groupid]=\"cell.isGroup ? cell.id : null\"\n                        [class.est2-hgroup]=\"cell.isGroup\"\n                        [class.est2-pinned]=\"gi < pinnedCount()\"\n                        [style.left.px]=\"gi < pinnedCount() ? pinnedLeftPx(gi) : null\"\n                        class=\"est2-hgroup-cell\">\n                      @if (cell.isGroup) {\n                        @if (cell.template) {\n                          <ng-container *ngTemplateOutlet=\"cell.template\"></ng-container>\n                        } @else {\n                          {{ cell.label }}\n                        }\n                      }\n                    </th>\n                  }\n                  @if (Removal()) { <th class=\"est2-col-min\"></th> }\n                  @if (hasChrome()) { <th class=\"est2-col-min\"></th> }\n                </tr>\n              }\n            }\n            <tr>\n              <!-- Colonna di selezione -->\n              @if (Selection()) {\n                <th class=\"est2-col-min est2-selcol\"\n                    [class.est2-pinned]=\"hasPinned()\"\n                    [style.left.px]=\"hasPinned() ? 0 : null\">\n                  @if (!SingleSelection()) {\n                    <input type=\"checkbox\" class=\"est2-check\"\n                           [checked]=\"globalCheck()\"\n                           [indeterminate]=\"selectionIndeterminate\"\n                           [disabled]=\"SelectionDisabled()\"\n                           (change)=\"toggleAll()\"\n                           aria-label=\"Seleziona tutto\" />\n                  }\n                </th>\n              }\n\n              <!-- Header da colonne (direttive / dinamica / report) -->\n              @if (usesColumns()) {\n                <!-- intestazioni vuote per le operazioni dinamiche -->\n                @for (op of DynamicOperations(); track op.id) {\n                  <th class=\"est2-col-min\"></th>\n                }\n                @for (col of visibleColumns(); track trackCol($index, col); let ci = $index) {\n                  <th [attr.data-colid]=\"col.id\"\n                      [class]=\"col.headerClass\"\n                      [class.est2-th--orderable]=\"OrderByColumn() && col.orderable\"\n                      [class.est2-col-min]=\"col.header?.thShrink\"\n                      [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                      [class.est2-pinned]=\"col.pinned\"\n                      [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                      [style.min-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                      [style.max-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                      [style.text-align]=\"col.alignment\"\n                      [style.background-color]=\"col.headerBg || null\"\n                      (click)=\"toggleSort(col)\">\n                    <span class=\"est2-th__inner\">\n                      @if (col.header?.Template) {\n                        <ng-container *ngTemplateOutlet=\"col.header!.Template!; context: col.multiProp != null ? { $implicit: col.headerText } : null\"></ng-container>\n                      } @else {\n                        {{ col.headerText }}\n                      }\n                      @if (OrderByColumn() && col.orderable && orderOf(col.id)) {\n                        <span class=\"est2-sort est2-sort--active\"\n                              [class.est2-sort--desc]=\"orderOf(col.id) === 'DESC'\">\n                          <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 15l6-6 6 6\"/></svg>\n                        </span>\n                        @if (orderIndex(col.id) > 0 && MultipleOrderingDirectives()) {\n                          <span class=\"est2-sort__badge\">{{ orderIndex(col.id) }}</span>\n                        }\n                      }\n                      <!-- Indicatore/toggle di pin (visibile se pinnata o all'hover) -->\n                      @if (ColumnsPinnable() && col.multiProp == null) {\n                        <button type=\"button\" class=\"est2-pinbtn\"\n                                [class.est2-pinbtn--on]=\"col.pinned\"\n                                [title]=\"col.pinned ? 'Sblocca colonna' : 'Blocca colonna a sinistra'\"\n                                (click)=\"togglePin(col, $event)\">\n                          <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                        </button>\n                      }\n                    </span>\n                  </th>\n                }\n              }\n              <!-- Header da template semplice -->\n              @else if (headerRef) {\n                <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\n              }\n\n              <!-- Colonna rimozione -->\n              @if (Removal()) { <th class=\"est2-col-min\"></th> }\n              <!-- Colonna chrome (export / gestione colonne / menu) -->\n              @if (hasChrome()) {\n                <th class=\"est2-col-min est2-chrome-th\">\n                  <div class=\"est2-chrome\">\n                    @if (Export()) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Esporta\" (click)=\"$event.stopPropagation(); toggleExportMenu()\">\n                          <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><path d=\"M7 10l5 5 5-5\"/><path d=\"M12 15V3\"/></svg>\n                        </button>\n                        @if (exportMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @if (CSVExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                            @if (XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('XLSX')\">Esporta Excel (XLSX)</button> }\n                            @if (!CSVExport() && !XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                          </div>\n                        }\n                      </div>\n                    }\n                    @if (HiddenColumns() || ColumnsOrdering()) {\n                      <button type=\"button\" class=\"est2-chrome-btn\" title=\"Colonne\" (click)=\"$event.stopPropagation(); openColumnsDialog()\">\n                        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"1\"/><path d=\"M9 3v18\"/><path d=\"M15 3v18\"/></svg>\n                      </button>\n                    }\n                    @if (CornerMenuOptions().length > 0) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Opzioni\" (click)=\"$event.stopPropagation(); toggleCornerMenu()\">\u22EE</button>\n                        @if (cornerMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @for (opt of CornerMenuOptions(); track opt.id) {\n                              <button type=\"button\" class=\"est2-menu-item\" (click)=\"cornerAction(opt.id); cornerMenuOpen.set(false)\">{{ opt.description }}</button>\n                            }\n                          </div>\n                        }\n                      </div>\n                    }\n                  </div>\n                </th>\n              }\n            </tr>\n          </thead>\n        }\n\n        <!-- ================= BODY ================= -->\n        @if (!BodyHidden()) {\n          <tbody>\n            @for (item of boundSource(); track trackRow($index, item); let ri = $index) {\n              @if ((!grouped() && !Hierarchy()) || item._visible) {\n              <tr [class]=\"rowClass(item)\"\n                  [class.est2-row--selected]=\"item._selected\"\n                  [class.est2-row--removed]=\"item.removed || item.deleted\"\n                  [class.est2-row--group]=\"item._group\"\n                  [class.est2-row--clickable]=\"Selection() || item._group\"\n                  [contextMenu]=\"ContextMenu || emptyMenu\"\n                  [contextMenuSubject]=\"item\"\n                  (click)=\"handleRowClick(item, $event)\">\n\n                <!-- Cella di selezione -->\n                @if (Selection()) {\n                  <td class=\"est2-col-min est2-selcol\"\n                      [class.est2-pinned]=\"hasPinned()\"\n                      [style.left.px]=\"hasPinned() ? 0 : null\">\n                    @if (item._group) {\n                      @if (!SingleSelection()) {\n                        <input type=\"checkbox\" class=\"est2-check\"\n                               [checked]=\"groupSelectionState(item) === 'all'\"\n                               [indeterminate]=\"groupSelectionState(item) === 'some'\"\n                               [disabled]=\"SelectionDisabled()\"\n                               (click)=\"$event.stopPropagation()\"\n                               (change)=\"toggleGroupSelection(item)\"\n                               aria-label=\"Seleziona gruppo\" />\n                      }\n                    } @else {\n                      <input type=\"checkbox\" class=\"est2-check\"\n                             [checked]=\"item._selected\"\n                             [indeterminate]=\"hierarchyIndeterminate(item)\"\n                             [disabled]=\"SelectionDisabled()\"\n                             (click)=\"$event.stopPropagation()\"\n                             (change)=\"toggleRow(item)\"\n                             aria-label=\"Seleziona riga\" />\n                    }\n                  </td>\n                }\n\n                <!-- Celle da colonne (direttive / dinamica / report) -->\n                @if (usesColumns()) {\n                  <!-- Operazioni dinamiche (icone a sinistra) -->\n                  @for (op of DynamicOperations(); track op.id) {\n                    <td class=\"est2-col-min est2-op-cell\">\n                      @if (!item._group && operationVisible(op, item)) {\n                        <span class=\"est2-op\" [class]=\"op.iconClass || ''\" [title]=\"op.title\"\n                              (click)=\"$event.stopPropagation(); dynamicOperation(item, op.id)\">{{ op.text }}</span>\n                      }\n                    </td>\n                  }\n                  @for (col of visibleColumns(); track trackCol($index, col); let first = $first, ci = $index) {\n                    <td [class]=\"col.cssClass\"\n                        [style.text-align]=\"col.alignment\"\n                        [style.color]=\"cellColor(item, col, 'fore')\"\n                        [style.background-color]=\"cellColor(item, col, 'back')\"\n                        [class.est2-nowrap]=\"!col.wrap\"\n                        [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                        [class.est2-pinned]=\"col.pinned\"\n                        [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                        [style.min-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                        [style.max-width.px]=\"col.pinned && col.pinnedWidth ? col.pinnedWidth : null\"\n                        [class.est2-td--group-key]=\"item._group && item.column === col.id\"\n                        [attr.data-r]=\"rangeActive() && !item._group ? ri : null\"\n                        [attr.data-c]=\"rangeActive() && !item._group ? ci : null\"\n                        [class.est2-cell-sel]=\"rangeActive() && inRange(ri, ci)\"\n                        [class.est2-cell-sel-t]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.top\"\n                        [class.est2-cell-sel-b]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.bottom\"\n                        [class.est2-cell-sel-l]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.left\"\n                        [class.est2-cell-sel-r]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.right\"\n                        [class.est2-cell-editing]=\"isEditing(ri, ci)\"\n                        (dblclick)=\"onCellDblClick(item, col, ri, ci)\">\n                      @if (isEditing(ri, ci)) {\n                        @if (editorFor(col); as edTpl) {\n                          <ng-container *ngTemplateOutlet=\"edTpl; context: editorContext(item, col)\"></ng-container>\n                        } @else {\n                          <ng-container *ngTemplateOutlet=\"defaultEditor; context: { $implicit: item, col: col }\"></ng-container>\n                        }\n                      } @else if (item._group) {\n                        @if (item.column === col.id) {\n                          <span class=\"est2-group-key\" [style.padding-left.px]=\"groupIndent(item)\">\n                            <span class=\"est2-group-chevron\" [class.est2-group-chevron--open]=\"item._expanded\">\n                              <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                            </span>\n                            {{ groupCellDisplay(item, col) }}\n                          </span>\n                        } @else {\n                          {{ groupCellDisplay(item, col) }}\n                        }\n                      } @else {\n                        <!-- Navigatore albero nella prima colonna -->\n                        @if (Hierarchy() && first) {\n                          <span class=\"est2-hier-lead\" [style.padding-left.px]=\"hierarchyIndent(item)\">\n                            @if (item.parent) {\n                              <span class=\"est2-group-chevron est2-hier-toggle\" [class.est2-group-chevron--open]=\"item._expanded\"\n                                    (click)=\"$event.stopPropagation(); toggleHierarchyNode(item)\">\n                                <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                              </span>\n                            } @else {\n                              <span class=\"est2-hier-toggle\"></span>\n                            }\n                          </span>\n                        }\n                        @if (itemCellHidden(col)) {\n                          <!-- colonna di gruppo nascosta sulla riga-oggetto -->\n                        } @else if (col.multiProp != null) {\n                          @if (col.cell?.Template) {\n                            <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: multiCell(item, col) }\"></ng-container>\n                          } @else {\n                            {{ multiCell(item, col)?.value }}\n                          }\n                        } @else if (col.cell?.Template) {\n                          <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: item }\"></ng-container>\n                        } @else if (col.routePath) {\n                          <a class=\"est2-link\" [routerLink]=\"routerLinkFor(item, col)\">{{ cellValue(item, col) }}</a>\n                        } @else if (col.propAccessor != null) {\n                          {{ reportCellDisplay(item, col) }}\n                        } @else if (col.type === 'enum') {\n                          {{ (cellValue(item, col) | est2_lookup : col.source).description }}\n                        } @else {\n                          {{ cellValue(item, col) | est2_format : col.type : col.format : locale }}\n                        }\n                      }\n                    </td>\n                  }\n                }\n                <!-- Celle da template semplice -->\n                @else if (bodyRef) {\n                  <ng-container *ngTemplateOutlet=\"bodyRef; context: { $implicit: item }\"></ng-container>\n                }\n\n                <!-- Rimozione (non sulle righe-gruppo) -->\n                @if (Removal()) {\n                  <td class=\"est2-col-min\">\n                    @if (!item._group && canRemove(item)) {\n                      @if (item.removed || item.deleted) {\n                        <button type=\"button\" class=\"est2-rowaction\" title=\"Ripristina\" (click)=\"abortRemoval(item)\">\u21BA</button>\n                      } @else {\n                        <button type=\"button\" class=\"est2-rowaction est2-rowaction--danger\" title=\"Rimuovi\" (click)=\"removeItem(item)\">\u2715</button>\n                      }\n                    }\n                  </td>\n                }\n                <!-- Chrome -->\n                @if (hasChrome()) { <td class=\"est2-col-min\"></td> }\n              </tr>\n              }\n            } @empty {\n              <tr>\n                <td class=\"est2-empty\" [attr.colspan]=\"totalColspan()\">Nessun elemento da visualizzare</td>\n              </tr>\n            }\n          </tbody>\n        }\n      </table>\n\n      <!-- Overlay di caricamento -->\n      @if (researchInProgress() || (firstBind() && ShowLoadingOnBootstrap())) {\n        <div class=\"est2-loading\">\n          <span class=\"est2-spinner\"></span>\n          <span>Caricamento\u2026</span>\n        </div>\n      }\n    </div>\n\n    <!-- Pager inferiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'bottom') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Avviso transitorio (es. incolla con dimensioni incompatibili) -->\n    @if (notice()) {\n      <div class=\"est2-toast\" role=\"alert\">\n        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 9v4\"/><path d=\"M12 17h.01\"/><path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\"/></svg>\n        <span>{{ notice() }}</span>\n      </div>\n    }\n\n    <!-- Dialog visibilit\u00E0 / ordine colonne -->\n    @if (columnsDialogOpen()) {\n      <div class=\"est2-dialog-backdrop\" (click)=\"closeColumnsDialog()\">\n        <div class=\"est2-dialog\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-modal=\"true\">\n          <div class=\"est2-dialog__head\">\n            <span>\n              @if (HiddenColumns() && ColumnsOrdering()) { Visibilit\u00E0 e ordine colonne }\n              @else if (HiddenColumns()) { Visibilit\u00E0 colonne }\n              @else { Ordine colonne }\n            </span>\n            <button type=\"button\" class=\"est2-dialog__close\" (click)=\"closeColumnsDialog()\" aria-label=\"Chiudi\">\u2715</button>\n          </div>\n\n          @if (HiddenColumns()) {\n            <div class=\"est2-dialog__tools\">\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(true)\">Mostra tutte</button>\n              <span class=\"est2-dialog__sep\">\u00B7</span>\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(false)\">Nascondi tutte</button>\n            </div>\n          }\n\n          <ul class=\"est2-collist\">\n            @for (c of dialogCols(); track c.id; let i = $index) {\n              <li class=\"est2-collist__row\">\n                @if (HiddenColumns()) {\n                  <label class=\"est2-collist__vis\">\n                    <input type=\"checkbox\" class=\"est2-check\" [checked]=\"c.visible\" (change)=\"dialogToggle(i)\" />\n                  </label>\n                }\n                <span class=\"est2-collist__label\">{{ c.label }}</span>\n                @if (ColumnsPinnable()) {\n                  <button type=\"button\" class=\"est2-iconbtn est2-collist__pin\" [class.est2-collist__pin--on]=\"c.pinned\"\n                          [disabled]=\"c.grouped\"\n                          [title]=\"c.grouped ? 'Le colonne di un gruppo non sono bloccabili' : (c.pinned ? 'Sblocca' : 'Blocca a sinistra')\"\n                          (click)=\"dialogTogglePin(i)\">\n                    <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                  </button>\n                }\n                @if (ColumnsOrdering()) {\n                  <span class=\"est2-collist__ord\">\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === 0\" title=\"Su\" (click)=\"dialogMove(i, -1)\">\u2191</button>\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === dialogCols().length - 1\" title=\"Gi\u00F9\" (click)=\"dialogMove(i, 1)\">\u2193</button>\n                  </span>\n                }\n              </li>\n            }\n          </ul>\n\n          <div class=\"est2-dialog__foot\">\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"resetColumnsDialog()\">Ripristina</button>\n            <span class=\"est2-dialog__spacer\"></span>\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"closeColumnsDialog()\">Annulla</button>\n            <button type=\"button\" class=\"est2-btn est2-btn--primary\" (click)=\"applyColumnsDialog()\">Applica</button>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n<!-- Template pager riutilizzabile sopra/sotto -->\n<ng-template #pager>\n  @if (!HidePaging() && !grouped()) {\n    <es-table2-pager\n      [page]=\"currentPage()\"\n      [pages]=\"totalPages()\"\n      [total]=\"totalCount()\"\n      [itemsPerPage]=\"viewMode() ? (view()?.itemsperpageoverride ?? 15) : ArraymodeItemsPerPage()\"\n      [countLabel]=\"CountLabel()\"\n      [showCount]=\"!HidePagingCount()\"\n      [showButtons]=\"!HidePagingButtons()\"\n      [showPagingOptions]=\"!HidePagingButtons()\"\n      [allowAll]=\"AllSearch()\"\n      (pageChange)=\"goToPage($event)\"\n      (itemsPerPageChange)=\"changeItemsPerPage($event)\">\n    </es-table2-pager>\n  }\n</ng-template>\n\n<!-- Editor di cella di default (usato quando il consumer non fornisce un `*editor`) -->\n<ng-template #defaultEditor let-item let-col=\"col\">\n  @switch (col.type) {\n    @case ('enum') {\n      <select class=\"est2-editor-input\"\n              [value]=\"editDraft\"\n              (change)=\"editDraft = $any($event.target).value\"\n              (keydown.enter)=\"commitEdit(item, col)\"\n              (keydown.escape)=\"cancelEdit()\"\n              (blur)=\"commitEdit(item, col)\">\n        @for (o of col.source || []; track o.id) {\n          <option [value]=\"o.id\" [selected]=\"o.id == editDraft\">{{ o.description }}</option>\n        }\n      </select>\n    }\n    @case ('boolean') {\n      <input type=\"checkbox\" class=\"est2-editor-input est2-check\"\n             [checked]=\"editDraft === true || editDraft === 'true'\"\n             (change)=\"editDraft = $any($event.target).checked; commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\" />\n    }\n    @default {\n      <input class=\"est2-editor-input\"\n             [type]=\"editorInputType(col.type)\"\n             [value]=\"editDraft\"\n             (input)=\"editDraft = $any($event.target).value\"\n             (keydown.enter)=\"commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\"\n             (blur)=\"commitEdit(item, col)\" />\n    }\n  }\n</ng-template>\n\n<!-- Menu di default (nessuna operazione) usato quando il consumer non passa [ContextMenu] -->\n<context-menu #emptyMenu>\n  <ng-template contextMenuItem [passive]=\"true\"><em>Nessuna operazione disponibile\u2026</em></ng-template>\n</context-menu>\n", styles: [".est2{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent);--est-radius: 10px;--est-radius-sm: 6px;--est-radius-pill: 999px;--est-gap: 8px;--est-cell-py: 6px;--est-cell-px: 12px;--est-row-h: 33px;--est-font: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--est-fs: 13px;--est-fs-sm: 12px;--est-fw-head: 700;--est-transition: .14s cubic-bezier(.4, 0, .2, 1);--est-bg-zebra: color-mix(in srgb, var(--est-fg) 3.5%, var(--est-bg));font-family:var(--est-font);font-size:var(--est-fs);color:var(--est-fg);position:relative;display:block}@media(prefers-color-scheme:dark){.est2{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}}.est2.est2--dark{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}.est2.est2--light{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent)}.est2.est2--dense{--est-cell-py: 3px;--est-cell-px: 9px;--est-row-h: 27px;--est-fs: 12.5px}.est2 *,.est2 *:before,.est2 *:after{box-sizing:border-box}.est2 .est2-scroll{position:relative;width:100%;overflow:auto;border:1px solid var(--est-border);border-radius:var(--est-radius);background:var(--est-bg);-webkit-overflow-scrolling:touch}.est2 table.est2-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--est-bg)}.est2 thead th{position:sticky;top:0;z-index:3;background:var(--est-bg-subtle);color:var(--est-fg);font-weight:var(--est-fw-head);font-size:var(--est-fs);text-align:left;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);box-shadow:var(--est-shadow-sticky);-webkit-user-select:none;user-select:none}.est2 thead tr.est2-hgroup-row th{font-size:var(--est-fs-sm);font-weight:700;color:var(--est-fg-muted);text-align:center;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);background:var(--est-bg-subtle);border-bottom:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th.est2-hgroup{color:var(--est-fg);border-left:1px solid var(--est-border);border-right:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th:not(.est2-hgroup){background:var(--est-bg-subtle);border-bottom-color:transparent}.est2 thead tr:last-child th.est2-col-groupstart,.est2 tbody td.est2-col-groupstart{border-left:1px solid var(--est-border)}.est2 tbody td{padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);color:var(--est-fg);vertical-align:middle;background:transparent}.est2 tbody tr:nth-child(2n) td{background:var(--est-bg-zebra)}.est2 tbody tr:nth-child(2n) td.est2-pinned{background:var(--est-bg-zebra)}.est2 th.est2-pinned,.est2 td.est2-pinned{position:sticky;background:var(--est-bg);box-shadow:1px 0 0 var(--est-border)}.est2 .est2-selcol{width:44px;min-width:44px;max-width:44px}.est2 td.est2-pinned{z-index:3}.est2 thead th.est2-pinned,.est2 thead tr.est2-hgroup-row th.est2-pinned{z-index:6;background:var(--est-bg-subtle)}.est2 tbody tr:hover td.est2-pinned{background:color-mix(in srgb,var(--est-fg) 5%,var(--est-bg))}.est2 tbody tr.est2-row--selected td.est2-pinned{background:color-mix(in srgb,var(--est-accent) 12%,var(--est-bg))}.est2 tbody tr.est2-row--group td.est2-pinned{background:var(--est-bg-subtle)}.est2 .est2-pinbtn{display:inline-flex;align-items:center;justify-content:center;margin-left:4px;padding:2px;border:none;background:transparent;color:var(--est-fg-faint);border-radius:var(--est-radius-sm);cursor:pointer;opacity:0;transition:opacity var(--est-transition),color var(--est-transition),background var(--est-transition)}.est2 thead th:hover .est2-pinbtn{opacity:.7}.est2 .est2-pinbtn:hover{background:var(--est-bg-hover);color:var(--est-fg);opacity:1}.est2 .est2-pinbtn--on{opacity:1;color:var(--est-accent);transform:rotate(0)}.est2 thead th:hover .est2-pinbtn--on{opacity:1}.est2 .est2-collist__pin.est2-collist__pin--on{color:var(--est-accent);border-color:var(--est-accent)}.est2 tbody tr{height:var(--est-row-h);transition:background var(--est-transition)}.est2 tbody tr:last-child td{border-bottom:none}.est2 tbody tr:hover td{background:var(--est-bg-hover)}.est2 tbody tr.est2-row--selected td{background:var(--est-bg-selected)}.est2 tbody tr.est2-row--clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--removed td{text-decoration:line-through;color:var(--est-fg-faint)}.est2 .est2-table--range tbody td[data-r]{cursor:cell}.est2 .est2-table--dragging,.est2 .est2-table--dragging tbody td{-webkit-user-select:none;user-select:none}.est2 tbody td.est2-cell-sel{background:color-mix(in srgb,var(--est-accent) 14%,transparent)}.est2 tbody td.est2-cell-sel-t{box-shadow:inset 0 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b{box-shadow:inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l{box-shadow:inset 2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-r{box-shadow:inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b{box-shadow:inset 0 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 0 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px -2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-editing{padding:2px 6px}.est2 .est2-editor-input{width:100%;box-sizing:border-box;height:calc(var(--est-row-h) - 8px);padding:2px 6px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1.5px solid var(--est-accent);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-editor-input:focus-visible{box-shadow:var(--est-ring)}.est2 input.est2-editor-input[type=checkbox]{width:16px;height:16px}.est2 .est2-autoupdate{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:4px 2px 8px;font-size:var(--est-fs-sm);color:var(--est-fg-muted)}.est2 .est2-autoupdate__label{display:inline-flex;align-items:center;gap:6px}.est2 .est2-autoupdate__secs{width:44px;text-align:center;padding:3px 4px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-autoupdate__secs:focus-visible{box-shadow:var(--est-ring);border-color:var(--est-accent)}.est2 .est2-switch{position:relative;display:inline-flex;width:38px;height:20px;cursor:pointer}.est2 .est2-switch input{position:absolute;opacity:0;width:0;height:0}.est2 .est2-switch__slider{flex:1;border-radius:var(--est-radius-pill);background:var(--est-border-strong);transition:background var(--est-transition)}.est2 .est2-switch__slider:before{content:\"\";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #00000040;transition:transform var(--est-transition)}.est2 .est2-switch input:checked+.est2-switch__slider{background:var(--est-accent)}.est2 .est2-switch input:checked+.est2-switch__slider:before{transform:translate(18px)}.est2 .est2-switch input:focus-visible+.est2-switch__slider{box-shadow:var(--est-ring)}.est2 .est2-toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%);z-index:20;display:inline-flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:8px 14px;font-size:13px;font-weight:500;color:#fff;background:#b91c1c;border-radius:var(--est-radius);box-shadow:0 6px 20px #00000040;animation:est2-toast-in .16s ease-out}.est2 .est2-toast svg{flex:0 0 auto}@keyframes est2-toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(prefers-reduced-motion:reduce){.est2 .est2-toast{animation:none}}.est2 tbody tr.est2-row--group{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--group td{background:var(--est-bg-subtle);font-weight:600;color:var(--est-fg);border-bottom:1px solid var(--est-border)}.est2 tbody tr.est2-row--group:hover td{background:var(--est-bg-hover)}.est2 .est2-td--group-key{color:var(--est-fg)}.est2 .est2-group-key{display:inline-flex;align-items:center;gap:6px}.est2 .est2-group-chevron{display:inline-flex;color:var(--est-fg-muted);transition:transform var(--est-transition)}.est2 .est2-group-chevron--open{transform:rotate(90deg)}.est2 .est2-hier-lead{display:inline-flex;align-items:center;vertical-align:middle;margin-right:4px}.est2 .est2-hier-toggle{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:none}.est2 .est2-group-chevron.est2-hier-toggle{cursor:pointer;border-radius:var(--est-radius-sm);transition:transform var(--est-transition),background var(--est-transition),color var(--est-transition)}.est2 .est2-group-chevron.est2-hier-toggle:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 th.est2-th--orderable{cursor:pointer;transition:color var(--est-transition)}.est2 th.est2-th--orderable:hover{color:var(--est-fg)}.est2 .est2-th__inner{display:inline-flex;align-items:center;gap:6px}.est2 .est2-sort{display:inline-flex;width:14px;height:14px;opacity:.35;transition:opacity var(--est-transition),transform var(--est-transition)}.est2 .est2-sort--active{opacity:1;color:var(--est-accent)}.est2 .est2-sort--desc{transform:rotate(180deg)}.est2 .est2-sort__badge{font-size:9px;font-weight:700;color:var(--est-accent);margin-left:2px}.est2 .est2-check{appearance:none;width:16px;height:16px;border:1.5px solid var(--est-border-strong);border-radius:var(--est-radius-sm);background:var(--est-bg);cursor:pointer;position:relative;transition:border-color var(--est-transition),background var(--est-transition);vertical-align:middle;flex:none}.est2 .est2-check:hover{border-color:var(--est-accent)}.est2 .est2-check:checked{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:checked:after{content:\"\";position:absolute;left:4.5px;top:1.5px;width:4px;height:8px;border:solid var(--est-accent-fg);border-width:0 2px 2px 0;transform:rotate(45deg)}.est2 .est2-check:focus-visible{outline:none;box-shadow:var(--est-ring)}.est2 .est2-check:indeterminate{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:indeterminate:after{content:\"\";position:absolute;left:3px;top:6px;width:8px;height:2px;background:var(--est-accent-fg);transform:none;border:none}.est2 th.est2-col-min,.est2 td.est2-col-min{width:1%;white-space:nowrap}.est2 .est2-wrap{position:relative}.est2 .est2-selectbar{position:absolute;top:0;left:0;right:0;z-index:15;display:flex;align-items:center;gap:12px;padding:9px 14px;font-size:var(--est-fs-sm);color:var(--est-fg);background:var(--est-bg-subtle);border:none;border-radius:var(--est-radius) var(--est-radius) 0 0;box-shadow:inset 3px 0 0 var(--est-accent)}.est2 .est2-selectbar strong{color:var(--est-fg);font-weight:700}.est2 .est2-selectbar__spacer{flex:1 1 auto}.est2 .est2-link{color:var(--est-accent);cursor:pointer;font-weight:600}.est2 .est2-link:hover{text-decoration:underline}.est2 .est2-rowaction{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);border:none;background:transparent;color:var(--est-fg-faint);cursor:pointer;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-rowaction:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-rowaction--danger:hover{color:var(--est-danger)}.est2 .est2-op-cell{text-align:center}.est2 .est2-op{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding:0 6px;border-radius:var(--est-radius-sm);color:var(--est-accent);cursor:pointer;font-size:var(--est-fs-sm);transition:background var(--est-transition)}.est2 .est2-op:hover{background:var(--est-accent-weak)}.est2 .est2-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:color-mix(in srgb,var(--est-bg) 70%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:5;color:var(--est-fg-muted);font-size:var(--est-fs-sm)}.est2 .est2-spinner{width:16px;height:16px;border:2px solid var(--est-border-strong);border-top-color:var(--est-accent);border-radius:50%;animation:est2-spin .7s linear infinite}@keyframes est2-spin{to{transform:rotate(360deg)}}.est2 .est2-nowrap{white-space:nowrap}.est2 .est2-cornermenu{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);cursor:pointer;color:var(--est-fg-muted);transition:background var(--est-transition)}.est2 .est2-cornermenu:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-chrome-th{position:relative}.est2 .est2-chrome{display:inline-flex;align-items:center;gap:2px}.est2 .est2-chrome-wrap{position:relative;display:inline-flex}.est2 .est2-chrome-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;background:transparent;border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer;font-size:16px;line-height:1;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-chrome-btn:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-menu{position:absolute;top:calc(100% + 4px);right:0;z-index:30;min-width:180px;padding:4px;background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 8px 24px #0000002e;display:flex;flex-direction:column}.est2 .est2-menu-item{display:block;width:100%;padding:8px 10px;border:none;background:transparent;text-align:left;font:inherit;color:var(--est-fg);border-radius:var(--est-radius-sm);cursor:pointer}.est2 .est2-menu-item:hover{background:var(--est-bg-hover)}.est2 .est2-dialog-backdrop{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:16px;background:color-mix(in srgb,#000 32%,transparent)}.est2 .est2-dialog{width:380px;max-width:100%;max-height:100%;display:flex;flex-direction:column;background:var(--est-bg);color:var(--est-fg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 16px 48px #0000004d;overflow:hidden}.est2 .est2-dialog__head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;font-weight:700;border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__close{border:none;background:transparent;cursor:pointer;color:var(--est-fg-muted);font-size:15px;line-height:1;padding:4px;border-radius:var(--est-radius-sm)}.est2 .est2-dialog__close:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-dialog__tools{padding:8px 14px;font-size:var(--est-fs-sm);border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__tools .est2-link{border:none;background:none;padding:0;font:inherit;font-weight:600}.est2 .est2-dialog__sep{margin:0 6px;color:var(--est-fg-faint)}.est2 .est2-collist{list-style:none;margin:0;padding:6px;overflow-y:auto}.est2 .est2-collist__row{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--est-radius-sm)}.est2 .est2-collist__row:hover{background:var(--est-bg-hover)}.est2 .est2-collist__vis{display:inline-flex}.est2 .est2-collist__label{flex:1 1 auto}.est2 .est2-collist__ord{display:inline-flex;gap:4px}.est2 .est2-iconbtn{width:26px;height:26px;border:1px solid var(--est-border);background:var(--est-bg);border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer}.est2 .est2-iconbtn:hover:not(:disabled){background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-iconbtn:disabled{opacity:.4;cursor:default}.est2 .est2-dialog__foot{display:flex;align-items:center;gap:8px;padding:12px 14px;border-top:1px solid var(--est-border)}.est2 .est2-dialog__spacer{flex:1 1 auto}.est2 .est2-btn{padding:7px 14px;border-radius:var(--est-radius-sm);font:inherit;font-weight:600;cursor:pointer;border:1px solid transparent}.est2 .est2-btn--ghost{background:transparent;color:var(--est-fg);border-color:var(--est-border)}.est2 .est2-btn--ghost:hover{background:var(--est-bg-hover)}.est2 .est2-btn--primary{background:var(--est-accent);color:var(--est-accent-fg)}.est2 .est2-btn--primary:hover{filter:brightness(1.05)}.est2 .est2-empty{padding:48px 16px;text-align:center;color:var(--est-fg-faint);font-size:var(--est-fs-sm)}.ngx-contextmenu{--ctx-bg: #ffffff;--ctx-fg: #1a1d24;--ctx-muted: #626b7a;--ctx-border: #e6e9ef;--ctx-hover: #f2f4f7;--ctx-accent: #4f46e5;--ctx-shadow: 0 10px 28px -8px rgba(16, 24, 40, .22), 0 2px 8px -3px rgba(16, 24, 40, .14);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.ngx-contextmenu .dropdown-menu{display:block;min-width:200px;margin:0;padding:6px;list-style:none;background:var(--ctx-bg);border:1px solid var(--ctx-border);border-radius:12px;box-shadow:var(--ctx-shadow);animation:est2-ctx-in .12s cubic-bezier(.16,1,.3,1)}.ngx-contextmenu li{list-style:none;margin:0}.ngx-contextmenu li>a{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:7px;color:var(--ctx-fg);font-size:13.5px;line-height:1.2;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .12s ease,color .12s ease}.ngx-contextmenu li>a:hover,.ngx-contextmenu li>a:focus{background:var(--ctx-hover);color:var(--ctx-fg);text-decoration:none;outline:none}.ngx-contextmenu li.divider,.ngx-contextmenu li[role=separator]{height:1px;margin:6px 8px;padding:0;background:var(--ctx-border)}.ngx-contextmenu li.disabled>a,.ngx-contextmenu li[aria-disabled=true]>a{color:var(--ctx-muted);opacity:.55;pointer-events:none}@media(prefers-color-scheme:dark){.ngx-contextmenu{--ctx-bg: #1e222b;--ctx-fg: #e7eaf0;--ctx-muted: #9aa3b2;--ctx-border: #2a2f3a;--ctx-hover: #232733;--ctx-accent: #7c74ff;--ctx-shadow: 0 12px 30px -8px rgba(0, 0, 0, .6), 0 2px 8px -3px rgba(0, 0, 0, .5)}}@keyframes est2-ctx-in{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.ngx-contextmenu .dropdown-menu{animation:none}}\n"] }]
+            args: [{ selector: 'es-table2', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (view()) {\n  <div class=\"est2-wrap {{ ContainerClass() }}\"\n       [style.height]=\"Height()\"\n       [style.background-color]=\"EmptySpaceBackgroundColor() || null\">\n\n    <!-- Auto-aggiornamento: toggle + intervallo (in alto a destra) -->\n    @if (AutoUpdate()) {\n      <div class=\"est2-autoupdate\">\n        <label class=\"est2-autoupdate__label\">\n          Aggiorna ogni\n          <input type=\"text\" maxlength=\"3\" class=\"est2-autoupdate__secs\"\n                 [ngModel]=\"seconds()\" (ngModelChange)=\"seconds.set($event)\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (change)=\"autoUpdateChanged()\" />\n          secondi\n        </label>\n        <label class=\"est2-switch\" title=\"Attiva/disattiva auto-aggiornamento\">\n          <input type=\"checkbox\" [ngModel]=\"autoUpdate()\"\n                 [ngModelOptions]=\"{ standalone: true }\"\n                 (ngModelChange)=\"autoUpdate.set($event); autoUpdateChanged()\" />\n          <span class=\"est2-switch__slider\"></span>\n        </label>\n      </div>\n    }\n\n    <!-- Pager superiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'top') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Barra \"seleziona tutto\" (visibile solo con selezione multipla attiva e righe presenti) -->\n    @if (Selection() && !SingleSelection() && hasSelection) {\n      <div class=\"est2-selectbar\" [style.height.px]=\"selbarHeight() ? selbarHeight() + 1 : null\">\n        @if (allSelected) {\n          <span>Tutti i <strong>{{ selectedCount }}</strong> elementi sono selezionati</span>\n        } @else {\n          <span><strong>{{ selectedCount }}</strong> {{ selectedCount === 1 ? 'elemento selezionato' : 'elementi selezionati' }}</span>\n          @if (canSelectEverything) {\n            <span class=\"est2-link\" (click)=\"selectEverything()\">Seleziona tutti i {{ totalCount() }} elementi</span>\n          }\n        }\n        <span class=\"est2-selectbar__spacer\"></span>\n        <span class=\"est2-link\" (click)=\"clearSelection()\">Azzera selezione</span>\n      </div>\n    }\n\n    <div class=\"est2-scroll\" [style.max-height.px]=\"MaxHeight()\">\n      <table class=\"est2-table {{ TableClass() }}\"\n             [class.est2-table--range]=\"rangeActive()\"\n             [class.est2-table--dragging]=\"rangeDragging()\"\n             (mousedown)=\"onGridMouseDown($event)\"\n             (mouseover)=\"onGridMouseOver($event)\">\n\n        <!-- ================= HEADER ================= -->\n        @if (!HeaderHidden()) {\n          <thead #theadRef>\n            <!-- Righe di header-group multi-livello (dall'alto verso il basso) -->\n            @if (hasHeaderGroups()) {\n              @for (grow of headerGroupRows(); track $index) {\n                <tr class=\"est2-hgroup-row\">\n                  @if (Selection()) { <th class=\"est2-col-min est2-selcol\" [class.est2-pinned]=\"hasPinned()\" [style.left.px]=\"hasPinned() ? 0 : null\"></th> }\n                  @for (op of DynamicOperations(); track op.id) { <th class=\"est2-col-min\"></th> }\n                  @for (cell of grow; track cell.id; let gi = $index) {\n                    <th [attr.colspan]=\"cell.span\"\n                        [attr.data-groupid]=\"cell.isGroup ? cell.id : null\"\n                        [class.est2-hgroup]=\"cell.isGroup\"\n                        [class.est2-pinned]=\"gi < pinnedCount()\"\n                        [style.left.px]=\"gi < pinnedCount() ? pinnedLeftPx(gi) : null\"\n                        class=\"est2-hgroup-cell\">\n                      @if (cell.isGroup) {\n                        @if (cell.template) {\n                          <ng-container *ngTemplateOutlet=\"cell.template\"></ng-container>\n                        } @else {\n                          {{ cell.label }}\n                        }\n                      }\n                    </th>\n                  }\n                  @if (Removal()) { <th class=\"est2-col-min\"></th> }\n                  @if (hasChrome()) { <th class=\"est2-col-min\"></th> }\n                </tr>\n              }\n            }\n            <tr>\n              <!-- Colonna di selezione -->\n              @if (Selection()) {\n                <th class=\"est2-col-min est2-selcol\"\n                    [class.est2-pinned]=\"hasPinned()\"\n                    [style.left.px]=\"hasPinned() ? 0 : null\">\n                  @if (!SingleSelection()) {\n                    <input type=\"checkbox\" class=\"est2-check\"\n                           [checked]=\"globalCheck()\"\n                           [indeterminate]=\"selectionIndeterminate\"\n                           [disabled]=\"SelectionDisabled()\"\n                           (change)=\"toggleAll()\"\n                           aria-label=\"Seleziona tutto\" />\n                  }\n                </th>\n              }\n\n              <!-- Header da colonne (direttive / dinamica / report) -->\n              @if (usesColumns()) {\n                <!-- intestazioni vuote per le operazioni dinamiche -->\n                @for (op of DynamicOperations(); track op.id) {\n                  <th class=\"est2-col-min\"></th>\n                }\n                @for (col of visibleColumns(); track trackCol($index, col); let ci = $index) {\n                  <th [attr.data-colid]=\"col.id\"\n                      [class]=\"col.headerClass\"\n                      [class.est2-th--orderable]=\"OrderByColumn() && col.orderable\"\n                      [class.est2-col-min]=\"col.header?.thShrink\"\n                      [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                      [class.est2-pinned]=\"col.pinned\"\n                      [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                      [style.width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                      [style.min-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                      [style.max-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                      [style.text-align]=\"col.alignment\"\n                      [style.background-color]=\"col.headerBg || null\"\n                      (click)=\"toggleSort(col)\">\n                    <span class=\"est2-th__inner\">\n                      @if (col.header?.Template) {\n                        <ng-container *ngTemplateOutlet=\"col.header!.Template!; context: col.multiProp != null ? { $implicit: col.headerText } : null\"></ng-container>\n                      } @else {\n                        {{ col.headerText }}\n                      }\n                      @if (OrderByColumn() && col.orderable && orderOf(col.id)) {\n                        <span class=\"est2-sort est2-sort--active\"\n                              [class.est2-sort--desc]=\"orderOf(col.id) === 'DESC'\">\n                          <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M6 15l6-6 6 6\"/></svg>\n                        </span>\n                        @if (orderIndex(col.id) > 0 && MultipleOrderingDirectives()) {\n                          <span class=\"est2-sort__badge\">{{ orderIndex(col.id) }}</span>\n                        }\n                      }\n                      <!-- Indicatore/toggle di pin (visibile se pinnata o all'hover) -->\n                      @if (ColumnsPinnable() && col.multiProp == null) {\n                        <button type=\"button\" class=\"est2-pinbtn\"\n                                [class.est2-pinbtn--on]=\"col.pinned\"\n                                [title]=\"col.pinned ? 'Sblocca colonna' : 'Blocca colonna a sinistra'\"\n                                (click)=\"togglePin(col, $event)\">\n                          <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                        </button>\n                      }\n                    </span>\n                    <!-- Handle di ridimensionamento (colonne pinnate, gated da ColumnsResizable) -->\n                    @if (ColumnsResizable() && col.pinned) {\n                      <span class=\"est2-resize-handle\" title=\"Trascina per ridimensionare\"\n                            (mousedown)=\"startColumnResize(col, $event)\"\n                            (click)=\"$event.stopPropagation()\"></span>\n                    }\n                  </th>\n                }\n              }\n              <!-- Header da template semplice -->\n              @else if (headerRef) {\n                <ng-container *ngTemplateOutlet=\"headerRef\"></ng-container>\n              }\n\n              <!-- Colonna rimozione -->\n              @if (Removal()) { <th class=\"est2-col-min\"></th> }\n              <!-- Colonna chrome (export / gestione colonne / menu) -->\n              @if (hasChrome()) {\n                <th class=\"est2-col-min est2-chrome-th\">\n                  <div class=\"est2-chrome\">\n                    @if (Export()) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Esporta\" (click)=\"$event.stopPropagation(); toggleExportMenu()\">\n                          <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"/><path d=\"M7 10l5 5 5-5\"/><path d=\"M12 15V3\"/></svg>\n                        </button>\n                        @if (exportMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @if (CSVExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                            @if (XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('XLSX')\">Esporta Excel (XLSX)</button> }\n                            @if (!CSVExport() && !XLSXExport()) { <button type=\"button\" class=\"est2-menu-item\" (click)=\"export('CSV')\">Esporta CSV</button> }\n                          </div>\n                        }\n                      </div>\n                    }\n                    @if (HiddenColumns() || ColumnsOrdering()) {\n                      <button type=\"button\" class=\"est2-chrome-btn\" title=\"Colonne\" (click)=\"$event.stopPropagation(); openColumnsDialog()\">\n                        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"1\"/><path d=\"M9 3v18\"/><path d=\"M15 3v18\"/></svg>\n                      </button>\n                    }\n                    @if (CornerMenuOptions().length > 0) {\n                      <div class=\"est2-chrome-wrap\">\n                        <button type=\"button\" class=\"est2-chrome-btn\" title=\"Opzioni\" (click)=\"$event.stopPropagation(); toggleCornerMenu()\">\u22EE</button>\n                        @if (cornerMenuOpen()) {\n                          <div class=\"est2-menu\" (click)=\"$event.stopPropagation()\">\n                            @for (opt of CornerMenuOptions(); track opt.id) {\n                              <button type=\"button\" class=\"est2-menu-item\" (click)=\"cornerAction(opt.id); cornerMenuOpen.set(false)\">{{ opt.description }}</button>\n                            }\n                          </div>\n                        }\n                      </div>\n                    }\n                  </div>\n                </th>\n              }\n            </tr>\n          </thead>\n        }\n\n        <!-- ================= BODY ================= -->\n        @if (!BodyHidden()) {\n          <tbody>\n            @for (item of boundSource(); track trackRow($index, item); let ri = $index) {\n              @if ((!grouped() && !Hierarchy()) || item._visible) {\n              <tr [class]=\"rowClass(item)\"\n                  [class.est2-row--selected]=\"item._selected\"\n                  [class.est2-row--removed]=\"item.removed || item.deleted\"\n                  [class.est2-row--group]=\"item._group\"\n                  [class.est2-row--clickable]=\"Selection() || item._group\"\n                  [contextMenu]=\"ContextMenu || emptyMenu\"\n                  [contextMenuSubject]=\"item\"\n                  (click)=\"handleRowClick(item, $event)\">\n\n                <!-- Cella di selezione -->\n                @if (Selection()) {\n                  <td class=\"est2-col-min est2-selcol\"\n                      [class.est2-pinned]=\"hasPinned()\"\n                      [style.left.px]=\"hasPinned() ? 0 : null\">\n                    @if (item._group) {\n                      @if (!SingleSelection()) {\n                        <input type=\"checkbox\" class=\"est2-check\"\n                               [checked]=\"groupSelectionState(item) === 'all'\"\n                               [indeterminate]=\"groupSelectionState(item) === 'some'\"\n                               [disabled]=\"SelectionDisabled()\"\n                               (click)=\"$event.stopPropagation()\"\n                               (change)=\"toggleGroupSelection(item)\"\n                               aria-label=\"Seleziona gruppo\" />\n                      }\n                    } @else {\n                      <input type=\"checkbox\" class=\"est2-check\"\n                             [checked]=\"item._selected\"\n                             [indeterminate]=\"hierarchyIndeterminate(item)\"\n                             [disabled]=\"SelectionDisabled()\"\n                             (click)=\"$event.stopPropagation()\"\n                             (change)=\"toggleRow(item)\"\n                             aria-label=\"Seleziona riga\" />\n                    }\n                  </td>\n                }\n\n                <!-- Celle da colonne (direttive / dinamica / report) -->\n                @if (usesColumns()) {\n                  <!-- Operazioni dinamiche (icone a sinistra) -->\n                  @for (op of DynamicOperations(); track op.id) {\n                    <td class=\"est2-col-min est2-op-cell\">\n                      @if (!item._group && operationVisible(op, item)) {\n                        <span class=\"est2-op\" [class]=\"op.iconClass || ''\" [title]=\"op.title\"\n                              (click)=\"$event.stopPropagation(); dynamicOperation(item, op.id)\">{{ op.text }}</span>\n                      }\n                    </td>\n                  }\n                  @for (col of visibleColumns(); track trackCol($index, col); let first = $first, ci = $index) {\n                    <td [class]=\"col.cssClass\"\n                        [style.text-align]=\"col.alignment\"\n                        [style.color]=\"cellColor(item, col, 'fore')\"\n                        [style.background-color]=\"cellColor(item, col, 'back')\"\n                        [class.est2-nowrap]=\"!col.wrap\"\n                        [class.est2-col-groupstart]=\"columnGroupBoundaries().has(ci)\"\n                        [class.est2-pinned]=\"col.pinned\"\n                        [style.left.px]=\"col.pinned ? pinnedLeftPx(ci) : null\"\n                        [style.width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                        [style.min-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                        [style.max-width.px]=\"col.pinned ? pinnedWidthPx(col) : null\"\n                        (mouseenter)=\"onCellHover($event)\"\n                        [class.est2-td--group-key]=\"item._group && item.column === col.id\"\n                        [attr.data-r]=\"rangeActive() && !item._group ? ri : null\"\n                        [attr.data-c]=\"rangeActive() && !item._group ? ci : null\"\n                        [class.est2-cell-sel]=\"rangeActive() && inRange(ri, ci)\"\n                        [class.est2-cell-sel-t]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.top\"\n                        [class.est2-cell-sel-b]=\"rangeActive() && inRange(ri, ci) && ri === rangeRect()!.bottom\"\n                        [class.est2-cell-sel-l]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.left\"\n                        [class.est2-cell-sel-r]=\"rangeActive() && inRange(ri, ci) && ci === rangeRect()!.right\"\n                        [class.est2-cell-editing]=\"isEditing(ri, ci)\"\n                        (dblclick)=\"onCellDblClick(item, col, ri, ci)\">\n                      @if (isEditing(ri, ci)) {\n                        @if (editorFor(col); as edTpl) {\n                          <ng-container *ngTemplateOutlet=\"edTpl; context: editorContext(item, col)\"></ng-container>\n                        } @else {\n                          <ng-container *ngTemplateOutlet=\"defaultEditor; context: { $implicit: item, col: col }\"></ng-container>\n                        }\n                      } @else if (item._group) {\n                        @if (item.column === col.id) {\n                          <span class=\"est2-group-key\" [style.padding-left.px]=\"groupIndent(item)\">\n                            <span class=\"est2-group-chevron\" [class.est2-group-chevron--open]=\"item._expanded\">\n                              <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                            </span>\n                            {{ groupCellDisplay(item, col) }}\n                          </span>\n                        } @else {\n                          {{ groupCellDisplay(item, col) }}\n                        }\n                      } @else {\n                        <!-- Navigatore albero nella prima colonna -->\n                        @if (Hierarchy() && first) {\n                          <span class=\"est2-hier-lead\" [style.padding-left.px]=\"hierarchyIndent(item)\">\n                            @if (item.parent) {\n                              <span class=\"est2-group-chevron est2-hier-toggle\" [class.est2-group-chevron--open]=\"item._expanded\"\n                                    (click)=\"$event.stopPropagation(); toggleHierarchyNode(item)\">\n                                <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 6l6 6-6 6\"/></svg>\n                              </span>\n                            } @else {\n                              <span class=\"est2-hier-toggle\"></span>\n                            }\n                          </span>\n                        }\n                        @if (itemCellHidden(col)) {\n                          <!-- colonna di gruppo nascosta sulla riga-oggetto -->\n                        } @else if (col.multiProp != null) {\n                          @if (col.cell?.Template) {\n                            <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: multiCell(item, col) }\"></ng-container>\n                          } @else {\n                            {{ multiCell(item, col)?.value }}\n                          }\n                        } @else if (col.cell?.Template) {\n                          <ng-container *ngTemplateOutlet=\"col.cell!.Template; context: { $implicit: item }\"></ng-container>\n                        } @else if (col.routePath) {\n                          <a class=\"est2-link\" [routerLink]=\"routerLinkFor(item, col)\">{{ cellValue(item, col) }}</a>\n                        } @else if (col.propAccessor != null) {\n                          {{ reportCellDisplay(item, col) }}\n                        } @else if (col.type === 'enum') {\n                          {{ (cellValue(item, col) | est2_lookup : col.source).description }}\n                        } @else {\n                          {{ cellValue(item, col) | est2_format : col.type : col.format : locale }}\n                        }\n                      }\n                    </td>\n                  }\n                }\n                <!-- Celle da template semplice -->\n                @else if (bodyRef) {\n                  <ng-container *ngTemplateOutlet=\"bodyRef; context: { $implicit: item }\"></ng-container>\n                }\n\n                <!-- Rimozione (non sulle righe-gruppo) -->\n                @if (Removal()) {\n                  <td class=\"est2-col-min\">\n                    @if (!item._group && canRemove(item)) {\n                      @if (item.removed || item.deleted) {\n                        <button type=\"button\" class=\"est2-rowaction\" title=\"Ripristina\" (click)=\"abortRemoval(item)\">\u21BA</button>\n                      } @else {\n                        <button type=\"button\" class=\"est2-rowaction est2-rowaction--danger\" title=\"Rimuovi\" (click)=\"removeItem(item)\">\u2715</button>\n                      }\n                    }\n                  </td>\n                }\n                <!-- Chrome -->\n                @if (hasChrome()) { <td class=\"est2-col-min\"></td> }\n              </tr>\n              }\n            } @empty {\n              <tr>\n                <td class=\"est2-empty\" [attr.colspan]=\"totalColspan()\">Nessun elemento da visualizzare</td>\n              </tr>\n            }\n          </tbody>\n        }\n      </table>\n\n      <!-- Overlay di caricamento -->\n      @if (researchInProgress() || (firstBind() && ShowLoadingOnBootstrap())) {\n        <div class=\"est2-loading\">\n          <span class=\"est2-spinner\"></span>\n          <span>Caricamento\u2026</span>\n        </div>\n      }\n    </div>\n\n    <!-- Pager inferiore -->\n    @if (PagingStyle() === 'both' || PagingStyle() === 'bottom') {\n      <ng-container *ngTemplateOutlet=\"pager\"></ng-container>\n    }\n\n    <!-- Avviso transitorio (es. incolla con dimensioni incompatibili) -->\n    @if (notice()) {\n      <div class=\"est2-toast\" role=\"alert\">\n        <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 9v4\"/><path d=\"M12 17h.01\"/><path d=\"M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\"/></svg>\n        <span>{{ notice() }}</span>\n      </div>\n    }\n\n    <!-- Dialog visibilit\u00E0 / ordine colonne -->\n    @if (columnsDialogOpen()) {\n      <div class=\"est2-dialog-backdrop\" (click)=\"closeColumnsDialog()\">\n        <div class=\"est2-dialog\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-modal=\"true\">\n          <div class=\"est2-dialog__head\">\n            <span>\n              @if (HiddenColumns() && ColumnsOrdering()) { Visibilit\u00E0 e ordine colonne }\n              @else if (HiddenColumns()) { Visibilit\u00E0 colonne }\n              @else { Ordine colonne }\n            </span>\n            <button type=\"button\" class=\"est2-dialog__close\" (click)=\"closeColumnsDialog()\" aria-label=\"Chiudi\">\u2715</button>\n          </div>\n\n          @if (HiddenColumns()) {\n            <div class=\"est2-dialog__tools\">\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(true)\">Mostra tutte</button>\n              <span class=\"est2-dialog__sep\">\u00B7</span>\n              <button type=\"button\" class=\"est2-link\" (click)=\"dialogSetAll(false)\">Nascondi tutte</button>\n            </div>\n          }\n\n          <ul class=\"est2-collist\">\n            @for (c of dialogCols(); track c.id; let i = $index) {\n              <li class=\"est2-collist__row\"\n                  [attr.draggable]=\"ColumnsOrdering() ? true : null\"\n                  [class.est2-collist__row--drag]=\"ColumnsOrdering()\"\n                  [class.est2-collist__row--dragging]=\"dragIndex() === i\"\n                  [class.est2-collist__row--drop-above]=\"dragOverIndex() === i && dragIndex() !== null && dragIndex()! > i\"\n                  [class.est2-collist__row--drop-below]=\"dragOverIndex() === i && dragIndex() !== null && dragIndex()! < i\"\n                  (dragstart)=\"dialogDragStart(i, $event)\"\n                  (dragover)=\"dialogDragOver(i, $event)\"\n                  (drop)=\"dialogDrop(i, $event)\"\n                  (dragend)=\"dialogDragEnd()\">\n                @if (ColumnsOrdering()) {\n                  <span class=\"est2-collist__grip\" title=\"Trascina per riordinare\" aria-hidden=\"true\">\n                    <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"currentColor\"><circle cx=\"9\" cy=\"6\" r=\"1.6\"/><circle cx=\"15\" cy=\"6\" r=\"1.6\"/><circle cx=\"9\" cy=\"12\" r=\"1.6\"/><circle cx=\"15\" cy=\"12\" r=\"1.6\"/><circle cx=\"9\" cy=\"18\" r=\"1.6\"/><circle cx=\"15\" cy=\"18\" r=\"1.6\"/></svg>\n                  </span>\n                }\n                @if (HiddenColumns()) {\n                  <label class=\"est2-collist__vis\">\n                    <input type=\"checkbox\" class=\"est2-check\" [checked]=\"c.visible\" (change)=\"dialogToggle(i)\" />\n                  </label>\n                }\n                <span class=\"est2-collist__label\">{{ c.label }}</span>\n                @if (ColumnsPinnable()) {\n                  <button type=\"button\" class=\"est2-iconbtn est2-collist__pin\" [class.est2-collist__pin--on]=\"c.pinned\"\n                          [disabled]=\"c.grouped\"\n                          [title]=\"c.grouped ? 'Le colonne di un gruppo non sono bloccabili' : (c.pinned ? 'Sblocca' : 'Blocca a sinistra')\"\n                          (click)=\"dialogTogglePin(i)\">\n                    <svg viewBox=\"0 0 24 24\" width=\"13\" height=\"13\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 17v5\"/><path d=\"M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z\"/></svg>\n                  </button>\n                }\n                @if (ColumnsOrdering()) {\n                  <span class=\"est2-collist__ord\">\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === 0\" title=\"Su\" (click)=\"dialogMove(i, -1)\">\u2191</button>\n                    <button type=\"button\" class=\"est2-iconbtn\" [disabled]=\"i === dialogCols().length - 1\" title=\"Gi\u00F9\" (click)=\"dialogMove(i, 1)\">\u2193</button>\n                  </span>\n                }\n              </li>\n            }\n          </ul>\n\n          <div class=\"est2-dialog__foot\">\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"resetColumnsDialog()\">Ripristina</button>\n            <span class=\"est2-dialog__spacer\"></span>\n            <button type=\"button\" class=\"est2-btn est2-btn--ghost\" (click)=\"closeColumnsDialog()\">Annulla</button>\n            <button type=\"button\" class=\"est2-btn est2-btn--primary\" (click)=\"applyColumnsDialog()\">Applica</button>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n}\n\n<!-- Template pager riutilizzabile sopra/sotto -->\n<ng-template #pager>\n  @if (!HidePaging() && !grouped()) {\n    <es-table2-pager\n      [page]=\"currentPage()\"\n      [pages]=\"totalPages()\"\n      [total]=\"totalCount()\"\n      [itemsPerPage]=\"viewMode() ? (view()?.itemsperpageoverride ?? 15) : ArraymodeItemsPerPage()\"\n      [countLabel]=\"CountLabel()\"\n      [showCount]=\"!HidePagingCount()\"\n      [showButtons]=\"!HidePagingButtons()\"\n      [showPagingOptions]=\"!HidePagingButtons()\"\n      [allowAll]=\"AllSearch()\"\n      (pageChange)=\"goToPage($event)\"\n      (itemsPerPageChange)=\"changeItemsPerPage($event)\">\n    </es-table2-pager>\n  }\n</ng-template>\n\n<!-- Editor di cella di default (usato quando il consumer non fornisce un `*editor`) -->\n<ng-template #defaultEditor let-item let-col=\"col\">\n  @switch (col.type) {\n    @case ('enum') {\n      <select class=\"est2-editor-input\"\n              [value]=\"editDraft\"\n              (change)=\"editDraft = $any($event.target).value\"\n              (keydown.enter)=\"commitEdit(item, col)\"\n              (keydown.escape)=\"cancelEdit()\"\n              (blur)=\"commitEdit(item, col)\">\n        @for (o of col.source || []; track o.id) {\n          <option [value]=\"o.id\" [selected]=\"o.id == editDraft\">{{ o.description }}</option>\n        }\n      </select>\n    }\n    @case ('boolean') {\n      <input type=\"checkbox\" class=\"est2-editor-input est2-check\"\n             [checked]=\"editDraft === true || editDraft === 'true'\"\n             (change)=\"editDraft = $any($event.target).checked; commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\" />\n    }\n    @default {\n      <input class=\"est2-editor-input\"\n             [type]=\"editorInputType(col.type)\"\n             [value]=\"editDraft\"\n             (input)=\"editDraft = $any($event.target).value\"\n             (keydown.enter)=\"commitEdit(item, col)\"\n             (keydown.escape)=\"cancelEdit()\"\n             (blur)=\"commitEdit(item, col)\" />\n    }\n  }\n</ng-template>\n\n<!-- Menu di default (nessuna operazione) usato quando il consumer non passa [ContextMenu] -->\n<context-menu #emptyMenu>\n  <ng-template contextMenuItem [passive]=\"true\"><em>Nessuna operazione disponibile\u2026</em></ng-template>\n</context-menu>\n", styles: [".est2{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent);--est-radius: 10px;--est-radius-sm: 6px;--est-radius-pill: 999px;--est-gap: 8px;--est-cell-py: 6px;--est-cell-px: 12px;--est-row-h: 33px;--est-font: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--est-fs: 13px;--est-fs-sm: 12px;--est-fw-head: 700;--est-transition: .14s cubic-bezier(.4, 0, .2, 1);--est-bg-zebra: color-mix(in srgb, var(--est-fg) 3.5%, var(--est-bg));font-family:var(--est-font);font-size:var(--est-fs);color:var(--est-fg);position:relative;display:block}@media(prefers-color-scheme:dark){.est2{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}}.est2.est2--dark{--est-bg: #14161c;--est-bg-subtle: #1a1d25;--est-bg-raised: #1e222b;--est-bg-hover: #232733;--est-bg-selected: color-mix(in srgb, var(--est-accent) 26%, transparent);--est-fg: #e7eaf0;--est-fg-muted: #9aa3b2;--est-fg-faint: #6b7484;--est-border: #2a2f3a;--est-border-strong: #39404d;--est-accent: #7c74ff;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 22%, transparent);--est-danger: #f87171;--est-warning: #fbbf24;--est-success: #34d399;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 6px 16px -10px rgba(0, 0, 0, .7);--est-shadow-pop: 0 10px 28px -8px rgba(0, 0, 0, .6), 0 2px 6px -2px rgba(0, 0, 0, .5);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 55%, transparent)}.est2.est2--light{--est-bg: #ffffff;--est-bg-subtle: #f7f8fa;--est-bg-raised: #ffffff;--est-bg-hover: #f2f4f7;--est-bg-selected: color-mix(in srgb, var(--est-accent) 12%, transparent);--est-fg: #1a1d24;--est-fg-muted: #626b7a;--est-fg-faint: #9aa3b2;--est-border: #e6e9ef;--est-border-strong: #d3d8e0;--est-accent: #4f46e5;--est-accent-fg: #ffffff;--est-accent-weak: color-mix(in srgb, var(--est-accent) 14%, transparent);--est-danger: #dc2626;--est-warning: #d97706;--est-success: #059669;--est-shadow-sticky: 0 1px 0 var(--est-border), 0 4px 12px -8px rgba(16, 24, 40, .24);--est-shadow-pop: 0 8px 24px -6px rgba(16, 24, 40, .18), 0 2px 6px -2px rgba(16, 24, 40, .12);--est-ring: 0 0 0 3px color-mix(in srgb, var(--est-accent) 40%, transparent)}.est2.est2--dense{--est-cell-py: 3px;--est-cell-px: 9px;--est-row-h: 27px;--est-fs: 12.5px}.est2 *,.est2 *:before,.est2 *:after{box-sizing:border-box}.est2 .est2-scroll{position:relative;width:100%;overflow:auto;border:1px solid var(--est-border);border-radius:var(--est-radius);background:var(--est-bg);-webkit-overflow-scrolling:touch}.est2 table.est2-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--est-bg)}.est2 thead th{position:sticky;top:0;z-index:3;background:var(--est-bg-subtle);color:var(--est-fg);font-weight:var(--est-fw-head);font-size:var(--est-fs);text-align:left;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);box-shadow:var(--est-shadow-sticky);-webkit-user-select:none;user-select:none}.est2 thead tr.est2-hgroup-row th{font-size:var(--est-fs-sm);font-weight:700;color:var(--est-fg-muted);text-align:center;white-space:nowrap;padding:var(--est-cell-py) var(--est-cell-px);background:var(--est-bg-subtle);border-bottom:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th.est2-hgroup{color:var(--est-fg);border-left:1px solid var(--est-border);border-right:1px solid var(--est-border)}.est2 thead tr.est2-hgroup-row th:not(.est2-hgroup){background:var(--est-bg-subtle);border-bottom-color:transparent}.est2 thead tr:last-child th.est2-col-groupstart,.est2 tbody td.est2-col-groupstart{border-left:1px solid var(--est-border)}.est2 tbody td{padding:var(--est-cell-py) var(--est-cell-px);border-bottom:1px solid var(--est-border);color:var(--est-fg);vertical-align:middle;background:transparent}.est2 tbody tr:nth-child(2n) td{background:var(--est-bg-zebra)}.est2 tbody tr:nth-child(2n) td.est2-pinned{background:var(--est-bg-zebra)}.est2 th.est2-pinned,.est2 td.est2-pinned{position:sticky;background:var(--est-bg);box-shadow:1px 0 0 var(--est-border)}.est2 thead th.est2-pinned{position:sticky}.est2 .est2-resize-handle{position:absolute;top:0;right:-3px;width:10px;height:100%;cursor:col-resize;z-index:2;touch-action:none;-webkit-user-select:none;user-select:none}.est2 .est2-resize-handle:after{content:\"\";position:absolute;top:28%;bottom:28%;right:3px;width:2px;border-radius:2px;background:color-mix(in srgb,var(--est-fg) 30%,transparent);transition:background var(--est-transition),top var(--est-transition),bottom var(--est-transition)}.est2 .est2-resize-handle:hover:after{background:var(--est-accent);top:15%;bottom:15%}.est2 thead th.est2-pinned .est2-resize-handle:active:after{background:var(--est-accent);top:6%;bottom:6%}.est2 td.est2-pinned{overflow:hidden;text-overflow:ellipsis}.est2 .est2-selcol{width:44px;min-width:44px;max-width:44px}.est2 td.est2-pinned{z-index:3}.est2 thead th.est2-pinned,.est2 thead tr.est2-hgroup-row th.est2-pinned{z-index:6;background:var(--est-bg-subtle)}.est2 tbody tr:hover td.est2-pinned{background:color-mix(in srgb,var(--est-fg) 5%,var(--est-bg))}.est2 tbody tr.est2-row--selected td.est2-pinned{background:color-mix(in srgb,var(--est-accent) 12%,var(--est-bg))}.est2 tbody tr.est2-row--group td.est2-pinned{background:var(--est-bg-subtle)}.est2 .est2-pinbtn{display:inline-flex;align-items:center;justify-content:center;margin-left:4px;padding:2px;border:none;background:transparent;color:var(--est-fg-faint);border-radius:var(--est-radius-sm);cursor:pointer;opacity:0;transition:opacity var(--est-transition),color var(--est-transition),background var(--est-transition)}.est2 thead th:hover .est2-pinbtn{opacity:.7}.est2 .est2-pinbtn:hover{background:var(--est-bg-hover);color:var(--est-fg);opacity:1}.est2 .est2-pinbtn--on{opacity:1;color:var(--est-accent);transform:rotate(0)}.est2 thead th:hover .est2-pinbtn--on{opacity:1}.est2 .est2-collist__pin.est2-collist__pin--on{color:var(--est-accent);border-color:var(--est-accent)}.est2 tbody tr{height:var(--est-row-h);transition:background var(--est-transition)}.est2 tbody tr:last-child td{border-bottom:none}.est2 tbody tr:hover td{background:var(--est-bg-hover)}.est2 tbody tr.est2-row--selected td{background:var(--est-bg-selected)}.est2 tbody tr.est2-row--clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--removed td{text-decoration:line-through;color:var(--est-fg-faint)}.est2 .est2-table--range tbody td[data-r]{cursor:cell}.est2 .est2-table--dragging,.est2 .est2-table--dragging tbody td{-webkit-user-select:none;user-select:none}.est2 tbody td.est2-cell-sel{background:color-mix(in srgb,var(--est-accent) 14%,transparent)}.est2 tbody td.est2-cell-sel-t{box-shadow:inset 0 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b{box-shadow:inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l{box-shadow:inset 2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-r{box-shadow:inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b{box-shadow:inset 0 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 0 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-r{box-shadow:inset -2px 2px 0 0 var(--est-accent),inset 0 -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px -2px 0 0 var(--est-accent),inset -2px 0 0 0 var(--est-accent)}.est2 tbody td.est2-cell-sel-t.est2-cell-sel-b.est2-cell-sel-l.est2-cell-sel-r{box-shadow:inset 2px 2px 0 0 var(--est-accent),inset -2px -2px 0 0 var(--est-accent)}.est2 tbody td.est2-cell-editing{padding:2px 6px}.est2 .est2-editor-input{width:100%;box-sizing:border-box;height:calc(var(--est-row-h) - 8px);padding:2px 6px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1.5px solid var(--est-accent);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-editor-input:focus-visible{box-shadow:var(--est-ring)}.est2 input.est2-editor-input[type=checkbox]{width:16px;height:16px}.est2 .est2-autoupdate{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:4px 2px 8px;font-size:var(--est-fs-sm);color:var(--est-fg-muted)}.est2 .est2-autoupdate__label{display:inline-flex;align-items:center;gap:6px}.est2 .est2-autoupdate__secs{width:44px;text-align:center;padding:3px 4px;font:inherit;color:var(--est-fg);background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius-sm);outline:none}.est2 .est2-autoupdate__secs:focus-visible{box-shadow:var(--est-ring);border-color:var(--est-accent)}.est2 .est2-switch{position:relative;display:inline-flex;width:38px;height:20px;cursor:pointer}.est2 .est2-switch input{position:absolute;opacity:0;width:0;height:0}.est2 .est2-switch__slider{flex:1;border-radius:var(--est-radius-pill);background:var(--est-border-strong);transition:background var(--est-transition)}.est2 .est2-switch__slider:before{content:\"\";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #00000040;transition:transform var(--est-transition)}.est2 .est2-switch input:checked+.est2-switch__slider{background:var(--est-accent)}.est2 .est2-switch input:checked+.est2-switch__slider:before{transform:translate(18px)}.est2 .est2-switch input:focus-visible+.est2-switch__slider{box-shadow:var(--est-ring)}.est2 .est2-toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%);z-index:20;display:inline-flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:8px 14px;font-size:13px;font-weight:500;color:#fff;background:#b91c1c;border-radius:var(--est-radius);box-shadow:0 6px 20px #00000040;animation:est2-toast-in .16s ease-out}.est2 .est2-toast svg{flex:0 0 auto}@keyframes est2-toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(prefers-reduced-motion:reduce){.est2 .est2-toast{animation:none}}.est2 tbody tr.est2-row--group{cursor:pointer;-webkit-user-select:none;user-select:none}.est2 tbody tr.est2-row--group td{background:var(--est-bg-subtle);font-weight:600;color:var(--est-fg);border-bottom:1px solid var(--est-border)}.est2 tbody tr.est2-row--group:hover td{background:var(--est-bg-hover)}.est2 .est2-td--group-key{color:var(--est-fg)}.est2 .est2-group-key{display:inline-flex;align-items:center;gap:6px}.est2 .est2-group-chevron{display:inline-flex;color:var(--est-fg-muted);transition:transform var(--est-transition)}.est2 .est2-group-chevron--open{transform:rotate(90deg)}.est2 .est2-hier-lead{display:inline-flex;align-items:center;vertical-align:middle;margin-right:4px}.est2 .est2-hier-toggle{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:none}.est2 .est2-group-chevron.est2-hier-toggle{cursor:pointer;border-radius:var(--est-radius-sm);transition:transform var(--est-transition),background var(--est-transition),color var(--est-transition)}.est2 .est2-group-chevron.est2-hier-toggle:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 th.est2-th--orderable{cursor:pointer;transition:color var(--est-transition)}.est2 th.est2-th--orderable:hover{color:var(--est-fg)}.est2 .est2-th__inner{display:inline-flex;align-items:center;gap:6px}.est2 .est2-sort{display:inline-flex;width:14px;height:14px;opacity:.35;transition:opacity var(--est-transition),transform var(--est-transition)}.est2 .est2-sort--active{opacity:1;color:var(--est-accent)}.est2 .est2-sort--desc{transform:rotate(180deg)}.est2 .est2-sort__badge{font-size:9px;font-weight:700;color:var(--est-accent);margin-left:2px}.est2 .est2-check{appearance:none;width:16px;height:16px;border:1.5px solid var(--est-border-strong);border-radius:var(--est-radius-sm);background:var(--est-bg);cursor:pointer;position:relative;transition:border-color var(--est-transition),background var(--est-transition);vertical-align:middle;flex:none}.est2 .est2-check:hover{border-color:var(--est-accent)}.est2 .est2-check:checked{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:checked:after{content:\"\";position:absolute;left:4.5px;top:1.5px;width:4px;height:8px;border:solid var(--est-accent-fg);border-width:0 2px 2px 0;transform:rotate(45deg)}.est2 .est2-check:focus-visible{outline:none;box-shadow:var(--est-ring)}.est2 .est2-check:indeterminate{background:var(--est-accent);border-color:var(--est-accent)}.est2 .est2-check:indeterminate:after{content:\"\";position:absolute;left:3px;top:6px;width:8px;height:2px;background:var(--est-accent-fg);transform:none;border:none}.est2 th.est2-col-min,.est2 td.est2-col-min{width:1%;white-space:nowrap}.est2 .est2-wrap{position:relative}.est2 .est2-selectbar{position:absolute;top:0;left:0;right:0;z-index:15;display:flex;align-items:center;gap:12px;padding:9px 14px;font-size:var(--est-fs-sm);color:var(--est-fg);background:var(--est-bg-subtle);border:none;border-radius:var(--est-radius) var(--est-radius) 0 0;box-shadow:inset 3px 0 0 var(--est-accent)}.est2 .est2-selectbar strong{color:var(--est-fg);font-weight:700}.est2 .est2-selectbar__spacer{flex:1 1 auto}.est2 .est2-link{color:var(--est-accent);cursor:pointer;font-weight:600}.est2 .est2-link:hover{text-decoration:underline}.est2 .est2-rowaction{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);border:none;background:transparent;color:var(--est-fg-faint);cursor:pointer;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-rowaction:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-rowaction--danger:hover{color:var(--est-danger)}.est2 .est2-op-cell{text-align:center}.est2 .est2-op{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding:0 6px;border-radius:var(--est-radius-sm);color:var(--est-accent);cursor:pointer;font-size:var(--est-fs-sm);transition:background var(--est-transition)}.est2 .est2-op:hover{background:var(--est-accent-weak)}.est2 .est2-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:color-mix(in srgb,var(--est-bg) 70%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:5;color:var(--est-fg-muted);font-size:var(--est-fs-sm)}.est2 .est2-spinner{width:16px;height:16px;border:2px solid var(--est-border-strong);border-top-color:var(--est-accent);border-radius:50%;animation:est2-spin .7s linear infinite}@keyframes est2-spin{to{transform:rotate(360deg)}}.est2 .est2-nowrap{white-space:nowrap}.est2 .est2-cornermenu{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--est-radius-sm);cursor:pointer;color:var(--est-fg-muted);transition:background var(--est-transition)}.est2 .est2-cornermenu:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-chrome-th{position:relative}.est2 .est2-chrome{display:inline-flex;align-items:center;gap:2px}.est2 .est2-chrome-wrap{position:relative;display:inline-flex}.est2 .est2-chrome-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;background:transparent;border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer;font-size:16px;line-height:1;transition:background var(--est-transition),color var(--est-transition)}.est2 .est2-chrome-btn:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-menu{position:absolute;top:calc(100% + 4px);right:0;z-index:30;min-width:180px;padding:4px;background:var(--est-bg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 8px 24px #0000002e;display:flex;flex-direction:column}.est2 .est2-menu-item{display:block;width:100%;padding:8px 10px;border:none;background:transparent;text-align:left;font:inherit;color:var(--est-fg);border-radius:var(--est-radius-sm);cursor:pointer}.est2 .est2-menu-item:hover{background:var(--est-bg-hover)}.est2 .est2-dialog-backdrop{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:16px;background:color-mix(in srgb,#000 32%,transparent)}.est2 .est2-dialog{width:520px;max-width:calc(100vw - 32px);max-height:100%;display:flex;flex-direction:column;background:var(--est-bg);color:var(--est-fg);border:1px solid var(--est-border);border-radius:var(--est-radius);box-shadow:0 16px 48px #0000004d;overflow:hidden}.est2 .est2-dialog__head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;font-weight:700;border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__close{border:none;background:transparent;cursor:pointer;color:var(--est-fg-muted);font-size:15px;line-height:1;padding:4px;border-radius:var(--est-radius-sm)}.est2 .est2-dialog__close:hover{background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-dialog__tools{padding:8px 14px;font-size:var(--est-fs-sm);border-bottom:1px solid var(--est-border)}.est2 .est2-dialog__tools .est2-link{border:none;background:none;padding:0;font:inherit;font-weight:600}.est2 .est2-dialog__sep{margin:0 6px;color:var(--est-fg-faint)}.est2 .est2-collist{list-style:none;margin:0;padding:6px;overflow-y:auto}.est2 .est2-collist__row{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--est-radius-sm)}.est2 .est2-collist__row:hover{background:var(--est-bg-hover)}.est2 .est2-collist__row--drag{cursor:grab}.est2 .est2-collist__row--drag:active{cursor:grabbing}.est2 .est2-collist__row--dragging{opacity:.45;background:var(--est-bg-hover)}.est2 .est2-collist__row--drop-above{box-shadow:inset 0 2px 0 0 var(--est-accent)}.est2 .est2-collist__row--drop-below{box-shadow:inset 0 -2px 0 0 var(--est-accent)}.est2 .est2-collist__grip{display:inline-flex;align-items:center;justify-content:center;color:var(--est-fg-faint);cursor:grab;flex:0 0 auto}.est2 .est2-collist__grip:active{cursor:grabbing}.est2 .est2-collist__row--drag:hover .est2-collist__grip{color:var(--est-fg-muted)}.est2 .est2-collist__vis{display:inline-flex}.est2 .est2-collist__label{flex:1 1 auto}.est2 .est2-collist__ord{display:inline-flex;gap:4px}.est2 .est2-iconbtn{width:26px;height:26px;border:1px solid var(--est-border);background:var(--est-bg);border-radius:var(--est-radius-sm);color:var(--est-fg-muted);cursor:pointer}.est2 .est2-iconbtn:hover:not(:disabled){background:var(--est-bg-hover);color:var(--est-fg)}.est2 .est2-iconbtn:disabled{opacity:.4;cursor:default}.est2 .est2-dialog__foot{display:flex;align-items:center;gap:8px;padding:12px 14px;border-top:1px solid var(--est-border)}.est2 .est2-dialog__spacer{flex:1 1 auto}.est2 .est2-btn{padding:7px 14px;border-radius:var(--est-radius-sm);font:inherit;font-weight:600;cursor:pointer;border:1px solid transparent}.est2 .est2-btn--ghost{background:transparent;color:var(--est-fg);border-color:var(--est-border)}.est2 .est2-btn--ghost:hover{background:var(--est-bg-hover)}.est2 .est2-btn--primary{background:var(--est-accent);color:var(--est-accent-fg)}.est2 .est2-btn--primary:hover{filter:brightness(1.05)}.est2 .est2-empty{padding:48px 16px;text-align:center;color:var(--est-fg-faint);font-size:var(--est-fs-sm)}.ngx-contextmenu{--ctx-bg: #ffffff;--ctx-fg: #1a1d24;--ctx-muted: #626b7a;--ctx-border: #e6e9ef;--ctx-hover: #f2f4f7;--ctx-accent: #4f46e5;--ctx-shadow: 0 10px 28px -8px rgba(16, 24, 40, .22), 0 2px 8px -3px rgba(16, 24, 40, .14);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.ngx-contextmenu .dropdown-menu{display:block;min-width:200px;margin:0;padding:6px;list-style:none;background:var(--ctx-bg);border:1px solid var(--ctx-border);border-radius:12px;box-shadow:var(--ctx-shadow);animation:est2-ctx-in .12s cubic-bezier(.16,1,.3,1)}.ngx-contextmenu li{list-style:none;margin:0}.ngx-contextmenu li>a{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:7px;color:var(--ctx-fg);font-size:13.5px;line-height:1.2;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .12s ease,color .12s ease}.ngx-contextmenu li>a:hover,.ngx-contextmenu li>a:focus{background:var(--ctx-hover);color:var(--ctx-fg);text-decoration:none;outline:none}.ngx-contextmenu li.divider,.ngx-contextmenu li[role=separator]{height:1px;margin:6px 8px;padding:0;background:var(--ctx-border)}.ngx-contextmenu li.disabled>a,.ngx-contextmenu li[aria-disabled=true]>a{color:var(--ctx-muted);opacity:.55;pointer-events:none}@media(prefers-color-scheme:dark){.ngx-contextmenu{--ctx-bg: #1e222b;--ctx-fg: #e7eaf0;--ctx-muted: #9aa3b2;--ctx-border: #2a2f3a;--ctx-hover: #232733;--ctx-accent: #7c74ff;--ctx-shadow: 0 12px 30px -8px rgba(0, 0, 0, .6), 0 2px 8px -3px rgba(0, 0, 0, .5)}}@keyframes est2-ctx-in{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.ngx-contextmenu .dropdown-menu{animation:none}}\n"] }]
         }], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
                     type: Self
                 }, {
@@ -8872,6 +9028,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImpo
             }], onDocClick: [{
                 type: HostListener,
                 args: ['document:click']
+            }], onResizeMove: [{
+                type: HostListener,
+                args: ['document:mousemove', ['$event']]
+            }], onResizeEnd: [{
+                type: HostListener,
+                args: ['document:mouseup']
             }] } });
 
 const MODULES = [