@oneteme/jquery-table 0.0.1

package/fesm2022/oneteme-jquery-table.mjs

@@ -0,0 +1,1618 @@
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { Directive, Input, EventEmitter, inject, ChangeDetectorRef, Component, ChangeDetectionStrategy, Output, ViewChild, ElementRef, ContentChildren } from '@angular/core';
+import * as i2$1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i6 from '@angular/material/menu';
+import { MatMenuModule } from '@angular/material/menu';
+import * as i4 from '@angular/material/paginator';
+import { MatPaginatorIntl, MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
+import * as i9 from '@angular/material/select';
+import { MatSelectModule } from '@angular/material/select';
+import * as i5 from '@angular/material/sort';
+import { MatSort, MatSortModule } from '@angular/material/sort';
+import * as i3 from '@angular/material/table';
+import { MatTableDataSource, MatTableModule } from '@angular/material/table';
+import { Subject, take, takeUntil } from 'rxjs';
+import * as i8 from '@angular/material/form-field';
+import * as i10 from '@angular/material/core';
+
+/**
+ * Directive permettant de définir un template de cellule personnalisé pour une colonne.
+ *
+ * Usage:
+ * ```html
+ * <jquery-table [config]="tableConfig">
+ *   <ng-template jqtCellDef="monKey" let-row>
+ *     <span>{{ row.monChamp }}</span>
+ *   </ng-template>
+ * </jquery-table>
+ * ```
+ * Le contexte expose `$implicit` (ligne brute `T`) et `index` (index global).
+ */
+class JqtCellDefDirective {
+    constructor(template) {
+        this.template = template;
+        /** Clé de la colonne à laquelle ce template s'applique. */
+        this.columnKey = '';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JqtCellDefDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: JqtCellDefDirective, isStandalone: true, selector: "[jqtCellDef]", inputs: { columnKey: ["jqtCellDef", "columnKey"] }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JqtCellDefDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[jqtCellDef]',
+                    standalone: true,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; }, propDecorators: { columnKey: [{
+                type: Input,
+                args: ['jqtCellDef']
+            }] } });
+
+const EMPTY_CATEGORY_KEY = '__empty__';
+const EMPTY_CATEGORY_LABEL = 'Vide';
+class SlicePanelComponent {
+    constructor() {
+        this.sliceConfigs = [];
+        this.columns = [];
+        this.data = [];
+        this.lazyData = new Map();
+        this.lazyStatus = new Map();
+        this.showToggle = true;
+        this.showCounts = true;
+        this.collapsedByDefault = false;
+        this.alwaysShow = false;
+        this.filterChange = new EventEmitter();
+        this.activeKeysChange = new EventEmitter();
+        this.dynamicSliceKeysChange = new EventEmitter();
+        this.collapsedChange = new EventEmitter();
+        this._cdr = inject(ChangeDetectorRef);
+        this.isCollapsed = false;
+        this.activeKeysBySlice = new Map();
+        this._expandedSlices = new Set();
+        this._dynamicSlices = [];
+        this._hiddenStaticSliceKeys = new Set();
+        // ── Cache ─────────────────────────────────────────────────────
+        this._cachedSlices = [];
+        this._countCache = new Map();
+        this.trackBySliceIndex = (index, _) => index;
+        this.trackByCategoryKey = (_, cat) => cat.key;
+    }
+    // ── Lifecycle ─────────────────────────────────────────────────
+    ngOnInit() {
+        this.isCollapsed = this.collapsedByDefault;
+        const initiallyHidden = (this.sliceConfigs || [])
+            .filter(s => s.hidden === true && !!s.columnKey)
+            .map(s => s.columnKey);
+        if (initiallyHidden.length) {
+            this._hiddenStaticSliceKeys = new Set([...this._hiddenStaticSliceKeys, ...initiallyHidden]);
+        }
+    }
+    ngOnChanges(changes) {
+        if (changes['sliceConfigs'] || changes['data'] || changes['columns'] || changes['lazyData'] || changes['lazyStatus']) {
+            this._refreshDynamicSlices();
+            this._rebuildCache();
+            this._cdr.markForCheck();
+        }
+    }
+    // ── Computed ──────────────────────────────────────────────────
+    get showPanel() {
+        const visibleStaticCount = (this.sliceConfigs || []).filter((s) => !s.columnKey || !this._hiddenStaticSliceKeys.has(s.columnKey)).length;
+        const hasCfg = visibleStaticCount > 0 || this._dynamicSlices.length > 0;
+        if (this.alwaysShow)
+            return hasCfg;
+        return hasCfg && (this.data?.length ?? 0) > 0;
+    }
+    get slices() {
+        return this._cachedSlices;
+    }
+    get staticSliceCount() {
+        return (this.sliceConfigs || []).filter((s) => !s.columnKey || !this._hiddenStaticSliceKeys.has(s.columnKey)).length;
+    }
+    get staticSlicesForMenu() {
+        return (this.sliceConfigs || [])
+            .filter((s) => !!s.columnKey)
+            .map((s) => ({ key: s.columnKey, title: s.title || s.columnKey }));
+    }
+    get activeDynamicSliceColumns() {
+        return this._dynamicSlices
+            .map((d) => (this.columns || []).find((c) => c.key === d.key))
+            .filter((c) => !!c);
+    }
+    get availableColumnsForDynamicSlice() {
+        const dynamicKeys = new Set(this._dynamicSlices.map((d) => d.key));
+        const staticKeys = new Set((this.sliceConfigs || []).map((s) => s.columnKey).filter((k) => !!k));
+        const existingKeys = new Set([...dynamicKeys, ...staticKeys]);
+        const seen = new Set();
+        return (this.columns || []).filter((c) => {
+            if (existingKeys.has(c.key) || seen.has(c.key))
+                return false;
+            seen.add(c.key);
+            return true;
+        });
+    }
+    get activeSliceByLabel() {
+        const staticActiveCount = (this.sliceConfigs || []).filter((s) => !s.columnKey || !this._hiddenStaticSliceKeys.has(s.columnKey)).length;
+        const total = staticActiveCount + this._dynamicSlices.length;
+        if (total === 0)
+            return 'Aucun';
+        if (total === 1) {
+            const first = (this.sliceConfigs || []).find((s) => !s.columnKey || !this._hiddenStaticSliceKeys.has(s.columnKey));
+            if (first)
+                return first.title || first.columnKey || '1';
+            return this.activeDynamicSliceColumns[0]?.header || '1';
+        }
+        return `${total} actifs`;
+    }
+    // ── UI state ──────────────────────────────────────────────────
+    isSliceCollapsed(sliceIndex) {
+        if (this._cachedSlices.length === 1) {
+            return this._expandedSlices.has(-1 - sliceIndex);
+        }
+        return !this._expandedSlices.has(sliceIndex);
+    }
+    toggleSliceCollapse(sliceIndex) {
+        if (this.slices.length === 1) {
+            const closedKey = -1 - sliceIndex;
+            if (this._expandedSlices.has(closedKey)) {
+                this._expandedSlices.delete(closedKey);
+            }
+            else {
+                this._expandedSlices.add(closedKey);
+                this._scrollSliceTitleIntoView(sliceIndex);
+            }
+        }
+        else {
+            if (this._expandedSlices.has(sliceIndex)) {
+                this._expandedSlices.delete(sliceIndex);
+            }
+            else {
+                this._expandedSlices.clear();
+                this._expandedSlices.add(sliceIndex);
+                this._scrollSliceTitleIntoView(sliceIndex);
+            }
+        }
+        this._cdr.markForCheck();
+    }
+    togglePanel() {
+        this.isCollapsed = !this.isCollapsed;
+        this.collapsedChange.emit(this.isCollapsed);
+        this._cdr.markForCheck();
+    }
+    isSliceDynamic(sliceIndex) {
+        return sliceIndex >= this.staticSliceCount;
+    }
+    isSliceLoading(sliceIndex) {
+        const staticSlice = (this.sliceConfigs || [])[sliceIndex];
+        if (staticSlice?.columnKey) {
+            const colDef = (this.columns || []).find(c => c.key === staticSlice.columnKey);
+            if (colDef?.lazy) {
+                const status = this.lazyStatus.get(staticSlice.columnKey) ?? 'idle';
+                return status === 'loading' || status === 'idle';
+            }
+            return false;
+        }
+        const key = this._getDynamicSliceColumnKey(sliceIndex);
+        if (!key)
+            return false;
+        const colDef = (this.columns || []).find(c => c.key === key);
+        if (!colDef?.lazy)
+            return false;
+        const status = this.lazyStatus.get(key) ?? 'idle';
+        return status === 'loading' || status === 'idle';
+    }
+    isStaticSliceVisible(columnKey) {
+        return !this._hiddenStaticSliceKeys.has(columnKey);
+    }
+    toggleStaticSlice(columnKey) {
+        const next = new Set(this._hiddenStaticSliceKeys);
+        if (next.has(columnKey))
+            next.delete(columnKey);
+        else
+            next.add(columnKey);
+        this._hiddenStaticSliceKeys = next;
+        this._rebuildCache();
+        this._emitFilter();
+        this._cdr.markForCheck();
+    }
+    // ── Selection ─────────────────────────────────────────────────
+    getSliceIcon(slice) {
+        if (slice.icon)
+            return slice.icon;
+        if (slice.columnKey) {
+            return (this.columns || []).find(c => c.key === slice.columnKey)?.icon;
+        }
+        return undefined;
+    }
+    isSliceCategoryActive(sliceIndex, categoryKey) {
+        return this.activeKeysBySlice.get(sliceIndex)?.has(categoryKey) ?? false;
+    }
+    isSliceAllActive(sliceIndex) {
+        return !this.activeKeysBySlice.has(sliceIndex) || this.activeKeysBySlice.get(sliceIndex).size === 0;
+    }
+    sliceCategoryCount(sliceIndex, categoryKey) {
+        const cacheKey = `${sliceIndex}:${categoryKey}`;
+        if (this._countCache.has(cacheKey)) {
+            return this._countCache.get(cacheKey);
+        }
+        const slice = this._cachedSlices[sliceIndex];
+        if (!slice)
+            return 0;
+        const category = (slice.categories || []).find((c) => c.key === categoryKey);
+        const count = category ? (this.data || []).filter((row) => category.filter(row)).length : 0;
+        this._countCache.set(cacheKey, count);
+        return count;
+    }
+    isSliceEmpty(sliceIndex) {
+        const slice = this._cachedSlices[sliceIndex];
+        if (!slice)
+            return true;
+        return (slice.categories || []).every(c => this.sliceCategoryCount(sliceIndex, c.key) === 0);
+    }
+    onSliceCategorySelected(sliceIndex, categoryKey) {
+        const slice = this.slices[sliceIndex];
+        if (!slice)
+            return;
+        if (!this.activeKeysBySlice.has(sliceIndex)) {
+            this.activeKeysBySlice.set(sliceIndex, new Set());
+        }
+        const activeKeys = this.activeKeysBySlice.get(sliceIndex);
+        if (slice.multiSelect === false) {
+            if (activeKeys.has(categoryKey)) {
+                activeKeys.clear();
+            }
+            else {
+                activeKeys.clear();
+                activeKeys.add(categoryKey);
+            }
+        }
+        else {
+            if (activeKeys.has(categoryKey)) {
+                activeKeys.delete(categoryKey);
+            }
+            else {
+                activeKeys.add(categoryKey);
+            }
+        }
+        this._emitFilter();
+        this._cdr.markForCheck();
+    }
+    onSliceAllSelected(sliceIndex) {
+        if (this.activeKeysBySlice.has(sliceIndex)) {
+            this.activeKeysBySlice.get(sliceIndex).clear();
+        }
+        this._emitFilter();
+        this._cdr.markForCheck();
+    }
+    // ── Dynamic slice management ──────────────────────────────────
+    addDynamicSlice(column) {
+        const distinctValues = this._computeDistinctValues(column.key);
+        const newSlice = {
+            title: column.header,
+            columnKey: column.key,
+            categories: distinctValues.map((v) => this._buildCategoryFromValue(column.key, v)),
+        };
+        this._dynamicSlices = [...this._dynamicSlices, { key: column.key, slice: newSlice }];
+        this._rebuildCache();
+        this.dynamicSliceKeysChange.emit(this._dynamicSlices.map(d => d.key));
+        this._emitFilter();
+        this._cdr.markForCheck();
+    }
+    removeDynamicSlice(sliceIndex) {
+        const dynamicIndex = sliceIndex - this.staticSliceCount;
+        if (dynamicIndex < 0)
+            return;
+        const newActiveKeys = new Map();
+        this.activeKeysBySlice.forEach((keys, idx) => {
+            if (idx < sliceIndex)
+                newActiveKeys.set(idx, keys);
+            else if (idx > sliceIndex)
+                newActiveKeys.set(idx - 1, keys);
+        });
+        this.activeKeysBySlice = newActiveKeys;
+        this._dynamicSlices = this._dynamicSlices.filter((_, i) => i !== dynamicIndex);
+        this._rebuildCache();
+        this.dynamicSliceKeysChange.emit(this._dynamicSlices.map(d => d.key));
+        this._emitFilter();
+        this._cdr.markForCheck();
+    }
+    removeDynamicSliceByKey(key) {
+        const dynamicIndex = this._dynamicSlices.findIndex((d) => d.key === key);
+        if (dynamicIndex < 0)
+            return;
+        const sliceIndex = this.staticSliceCount + dynamicIndex;
+        this.removeDynamicSlice(sliceIndex);
+    }
+    // ── Private helpers ───────────────────────────────────────────
+    _emitFilter() {
+        const slices = this.slices;
+        const activeKeysBySlice = this.activeKeysBySlice;
+        this.activeKeysChange.emit(slices.map((_, i) => {
+            const keys = activeKeysBySlice.get(i);
+            return keys ? [...keys] : [];
+        }));
+        const pred = (row) => slices.every((slice, sliceIndex) => {
+            const activeKeys = activeKeysBySlice.get(sliceIndex);
+            if (!activeKeys || activeKeys.size === 0)
+                return true;
+            return [...activeKeys].some((key) => {
+                const category = (slice.categories || []).find((c) => c.key === key);
+                return category ? category.filter(row) : false;
+            });
+        });
+        this.filterChange.emit(pred);
+    }
+    _getDynamicSliceColumnKey(sliceIndex) {
+        const dynamicIndex = sliceIndex - this.staticSliceCount;
+        return this._dynamicSlices[dynamicIndex]?.key ?? null;
+    }
+    _materializeSlice(slice) {
+        if (!slice.columnKey || (slice.categories && slice.categories.length > 0)) {
+            return slice;
+        }
+        const col = (this.columns || []).find(c => c.key === slice.columnKey);
+        const isLazy = !!col?.lazy;
+        if (isLazy && this.lazyStatus.get(slice.columnKey) !== 'loaded') {
+            return { ...slice, categories: [] };
+        }
+        if (slice.bucket) {
+            const distinctValues = [...new Set((this.data || []).map(slice.bucket))].sort();
+            return {
+                ...slice,
+                categories: distinctValues.map((v) => ({
+                    key: v,
+                    label: v,
+                    filter: (row) => slice.bucket(row) === v,
+                })),
+            };
+        }
+        const distinctValues = this._computeDistinctValues(slice.columnKey);
+        return {
+            ...slice,
+            categories: distinctValues.map((v) => this._buildCategoryFromValue(slice.columnKey, v)),
+        };
+    }
+    _buildCategoryFromValue(columnKey, v) {
+        if (v === EMPTY_CATEGORY_KEY) {
+            return {
+                key: EMPTY_CATEGORY_KEY,
+                label: EMPTY_CATEGORY_LABEL,
+                filter: (row) => {
+                    const val = this._getLazyAwareValue(columnKey, row);
+                    return val == null || val === '';
+                },
+            };
+        }
+        return {
+            key: v,
+            label: v,
+            filter: (row) => String(this._getLazyAwareValue(columnKey, row) ?? '') === v,
+        };
+    }
+    _computeDistinctValues(columnKey) {
+        const rawValues = (this.data || []).map((row) => {
+            const val = this._getLazyAwareValue(columnKey, row);
+            return val != null && val !== '' ? String(val) : null;
+        });
+        const distinct = [...new Set(rawValues.filter((v) => v !== null))].sort();
+        if (rawValues.some(v => v === null)) {
+            distinct.push(EMPTY_CATEGORY_KEY);
+        }
+        return distinct;
+    }
+    _getLazyAwareValue(columnKey, row) {
+        const colDef = (this.columns || []).find(c => c.key === columnKey);
+        if (colDef?.lazy) {
+            return this.lazyData.get(columnKey)?.get(row) ?? null;
+        }
+        if (colDef?.value) {
+            return colDef.value(row, 0);
+        }
+        return row[columnKey];
+    }
+    _rebuildCache() {
+        const staticSlices = (this.sliceConfigs || []).filter((s) => !s.columnKey || !this._hiddenStaticSliceKeys.has(s.columnKey));
+        const allSlices = [...staticSlices, ...this._dynamicSlices.map((d) => d.slice)];
+        this._cachedSlices = allSlices.map((slice) => this._materializeSlice(slice));
+        this._countCache.clear();
+    }
+    _refreshDynamicSlices() {
+        this._dynamicSlices = this._dynamicSlices.map(({ key, slice }) => {
+            const distinctValues = this._computeDistinctValues(key);
+            return {
+                key,
+                slice: {
+                    ...slice,
+                    categories: distinctValues.map((v) => this._buildCategoryFromValue(key, v)),
+                },
+            };
+        });
+    }
+    _scrollSliceTitleIntoView(sliceIndex) {
+        setTimeout(() => {
+            const container = this.slicePanelBodyRef?.nativeElement;
+            if (!container)
+                return;
+            const row = container.querySelector(`[data-slice-index="${sliceIndex}"]`);
+            if (!row)
+                return;
+            row.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SlicePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SlicePanelComponent, isStandalone: true, selector: "slice-panel", inputs: { sliceConfigs: "sliceConfigs", columns: "columns", data: "data", lazyData: "lazyData", lazyStatus: "lazyStatus", showToggle: "showToggle", showCounts: "showCounts", collapsedByDefault: "collapsedByDefault", alwaysShow: "alwaysShow" }, outputs: { filterChange: "filterChange", activeKeysChange: "activeKeysChange", dynamicSliceKeysChange: "dynamicSliceKeysChange", collapsedChange: "collapsedChange" }, viewQueries: [{ propertyName: "slicePanelBodyRef", first: true, predicate: ["slicePanelBody"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"slice-panel-wrapper\" [class.collapsed]=\"isCollapsed\">\n  <aside class=\"slice-panel\" [class.collapsed]=\"isCollapsed\">\n    <div class=\"slice-panel-header\">\n      <span *ngIf=\"!isCollapsed\" class=\"slice-panel-title\">\n        <mat-icon class=\"slice-panel-title-icon\" fontSet=\"material-icons-outlined\">filter_list</mat-icon>\n        {{ slices.length > 1 ? 'Filtres' : 'Filtre' }}\n      </span>\n      <button\n        *ngIf=\"showToggle\"\n        type=\"button\"\n        class=\"slice-toggle\"\n        [attr.aria-label]=\"isCollapsed ? 'D\u00E9plier le filtre' : 'Replier le filtre'\"\n        (click)=\"togglePanel()\"\n      >\n        <span class=\"slice-toggle-icon\">{{ isCollapsed ? '\u203A' : '\u2039' }}</span>\n      </button>\n    </div>\n\n    <div class=\"slice-panel-body\" *ngIf=\"!isCollapsed\" #slicePanelBody>\n      <ng-container *ngFor=\"let slice of slices; let si = index; trackBy: trackBySliceIndex\">\n        <div class=\"slice-title-row\" [attr.data-slice-index]=\"si\" (click)=\"toggleSliceCollapse(si)\">\n          <span class=\"slice-title-chevron\" [class.expanded]=\"!isSliceCollapsed(si)\">\u203A</span>\n          <mat-icon *ngIf=\"getSliceIcon(slice)\" class=\"slice-title-icon\" fontSet=\"material-icons-outlined\">{{ getSliceIcon(slice) }}</mat-icon>\n          <p class=\"slice-title\">{{ slice.title || 'Filtrer' }}</p>\n          <button\n            *ngIf=\"isSliceDynamic(si)\"\n            type=\"button\"\n            class=\"slice-remove-btn\"\n            (click)=\"$event.stopPropagation(); removeDynamicSlice(si)\"\n          >\u00D7</button>\n        </div>\n\n        <div class=\"slice-section-items\" *ngIf=\"!isSliceCollapsed(si)\">\n          <ng-container *ngIf=\"isSliceLoading(si); else sliceContent\">\n            <div class=\"slice-lazy-loading\">\n              <span class=\"lazy-skeleton\"></span>\n              <span class=\"lazy-skeleton\"></span>\n              <span class=\"lazy-skeleton\"></span>\n            </div>\n          </ng-container>\n          <ng-template #sliceContent>\n            <ng-container *ngFor=\"let category of slice.categories; trackBy: trackByCategoryKey\">\n              <button\n                *ngIf=\"sliceCategoryCount(si, category.key) > 0\"\n                class=\"slice-item\"\n                type=\"button\"\n                [class.active]=\"isSliceCategoryActive(si, category.key)\"\n                [attr.data-category-key]=\"category.key\"\n                [title]=\"category.label\"\n                (click)=\"onSliceCategorySelected(si, category.key)\"\n              >\n                <span>{{ category.label }}</span>\n                <span *ngIf=\"showCounts\">{{ sliceCategoryCount(si, category.key) }}</span>\n              </button>\n            </ng-container>\n            <div *ngIf=\"isSliceEmpty(si)\" class=\"slice-empty-state\">Aucune donn\u00E9e</div>\n          </ng-template>\n        </div>\n\n        <hr *ngIf=\"si < slices.length - 1\" class=\"slice-divider\" />\n      </ng-container>\n    </div>\n  </aside>\n</div>\n", styles: [":host{display:block;width:100%;height:100%;min-height:0;box-sizing:border-box}.slice-panel-wrapper{height:100%;max-height:100%;overflow-y:auto;box-sizing:border-box}.slice-panel{margin-top:0;border:1px solid var(--jqt-border-color);border-radius:10px;background:var(--jqt-surface-color);display:flex;flex-direction:column;min-width:0;height:100%;overflow:hidden;box-sizing:border-box}.slice-panel-header{flex-shrink:0;display:flex;justify-content:flex-end;align-items:center;height:34px;padding:0 8px;margin-bottom:8px}.slice-panel-header:has(.slice-panel-title){justify-content:space-between;padding-left:12px}.slice-panel-body{flex:1 1 0;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:4px;padding:4px 10px 10px;scrollbar-width:thin;scrollbar-color:var(--jqt-border-color) transparent}.slice-panel-body::-webkit-scrollbar{width:2px}.slice-panel-body::-webkit-scrollbar-thumb{background:var(--jqt-primary-color);border-radius:4px}.slice-panel-title{margin:0;padding-top:2px;font-size:11px;font-weight:700;line-height:1;text-transform:uppercase;letter-spacing:.08em;color:var(--jqt-text-color);-webkit-user-select:none;user-select:none;align-self:center;display:inline-flex;align-items:center;gap:5px}.slice-panel-title .slice-panel-title-icon{font-size:16px;width:16px;height:16px;line-height:1;flex-shrink:0}.slice-section-items{display:flex;flex-direction:column;gap:2px;flex:0 0 auto;scrollbar-width:thin;scrollbar-color:var(--jqt-border-color) transparent}.slice-section-items::-webkit-scrollbar{width:2px}.slice-section-items .slice-empty-state{padding:8px 10px;font-size:12px;color:var(--jqt-text-muted, #9ca3af);font-style:italic;text-align:center}.slice-section-items::-webkit-scrollbar-thumb{background:var(--jqt-border-color);border-radius:4px}.slice-toggle{border:0;background:var(--jqt-surface-color);color:var(--jqt-text-color);border-radius:6px;width:22px;height:22px;padding:0;font-size:14px;text-align:center;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1}.slice-toggle-icon{width:100%;height:100%;display:inline-flex;align-items:center;justify-content:center;line-height:1}.slice-panel.collapsed{border-color:transparent;background:transparent;overflow:visible}.slice-panel.collapsed .slice-panel-header{height:34px;padding:0;justify-content:center;align-items:center}.slice-panel.collapsed .slice-toggle{width:34px;height:34px;border:1px solid var(--jqt-border-color);background:var(--jqt-surface-color);border-radius:8px;font-size:16px}.slice-panel.collapsed .slice-toggle:hover{border-color:var(--jqt-text-muted)}.slice-title-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:4px 0 6px;cursor:pointer;-webkit-user-select:none;user-select:none}.slice-title-row:hover .slice-title{color:var(--jqt-text-color)}.slice-title-row:hover .slice-title-chevron{color:var(--jqt-text-secondary)}.slice-title-row:first-of-type .slice-title{margin-top:0}.slice-title-chevron{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;color:var(--jqt-text-muted);transition:transform .15s ease;transform:rotate(0);position:relative;top:-1px}.slice-title-chevron.expanded{transform:rotate(90deg)}.slice-title{flex:1 1 auto;margin:0;font-size:14px;font-weight:600;color:var(--jqt-title-color)}.slice-title-icon{flex-shrink:0;font-size:14px!important;width:14px!important;height:14px!important;color:var(--jqt-title-color)}.slice-remove-btn{background:none;border:none;cursor:pointer;color:var(--jqt-border-color);font-size:12px;padding:0 2px;line-height:1;flex-shrink:0;opacity:.5;transition:opacity .15s,color .15s}.slice-remove-btn:hover{color:var(--jqt-text-secondary);opacity:1}.slice-title-row:hover .slice-remove-btn{opacity:.8}.slice-item{display:flex;justify-content:space-between;align-items:center;text-align:left;width:100%;padding:5px 10px 5px 16px;background:transparent;border:0;cursor:pointer;border-radius:8px;color:var(--jqt-text-color);box-sizing:border-box;min-width:0;gap:8px}.slice-item.active{background:var(--jqt-row-hover-bg);font-weight:600}.slice-item.slice-multi{padding-left:6px}.slice-item span:first-child{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slice-item span:last-child{flex:0 0 auto;min-width:1.2em;text-align:right}.slice-check-box{flex:0 0 16px;width:16px;height:16px;border:1.5px solid var(--jqt-text-muted);border-radius:4px;background:var(--jqt-surface-color);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;transition:background .15s,border-color .15s}.slice-check-box.checked{background:var(--jqt-text-secondary);border-color:var(--jqt-text-secondary)}.slice-check-box.checked:after{content:\"\";display:block;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translateY(-1px)}.slice-divider{border:none;border-top:1px solid var(--jqt-border-color);margin:6px 0}.lazy-skeleton{display:block;height:12px;width:70%;border-radius:4px;background:linear-gradient(90deg,var(--jqt-border-color) 25%,var(--jqt-surface-alt-color) 50%,var(--jqt-border-color) 75%);background-size:200% 100%;animation:lazy-shimmer 1.4s ease-in-out infinite}.slice-lazy-loading{display:flex;flex-direction:column;gap:8px;padding:8px 10px}.slice-lazy-loading .lazy-skeleton{width:80%}.slice-lazy-loading .lazy-skeleton:nth-child(2){width:60%}.slice-lazy-loading .lazy-skeleton:nth-child(3){width:45%}@keyframes lazy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SlicePanelComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'slice-panel', imports: [CommonModule, MatIconModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"slice-panel-wrapper\" [class.collapsed]=\"isCollapsed\">\n  <aside class=\"slice-panel\" [class.collapsed]=\"isCollapsed\">\n    <div class=\"slice-panel-header\">\n      <span *ngIf=\"!isCollapsed\" class=\"slice-panel-title\">\n        <mat-icon class=\"slice-panel-title-icon\" fontSet=\"material-icons-outlined\">filter_list</mat-icon>\n        {{ slices.length > 1 ? 'Filtres' : 'Filtre' }}\n      </span>\n      <button\n        *ngIf=\"showToggle\"\n        type=\"button\"\n        class=\"slice-toggle\"\n        [attr.aria-label]=\"isCollapsed ? 'D\u00E9plier le filtre' : 'Replier le filtre'\"\n        (click)=\"togglePanel()\"\n      >\n        <span class=\"slice-toggle-icon\">{{ isCollapsed ? '\u203A' : '\u2039' }}</span>\n      </button>\n    </div>\n\n    <div class=\"slice-panel-body\" *ngIf=\"!isCollapsed\" #slicePanelBody>\n      <ng-container *ngFor=\"let slice of slices; let si = index; trackBy: trackBySliceIndex\">\n        <div class=\"slice-title-row\" [attr.data-slice-index]=\"si\" (click)=\"toggleSliceCollapse(si)\">\n          <span class=\"slice-title-chevron\" [class.expanded]=\"!isSliceCollapsed(si)\">\u203A</span>\n          <mat-icon *ngIf=\"getSliceIcon(slice)\" class=\"slice-title-icon\" fontSet=\"material-icons-outlined\">{{ getSliceIcon(slice) }}</mat-icon>\n          <p class=\"slice-title\">{{ slice.title || 'Filtrer' }}</p>\n          <button\n            *ngIf=\"isSliceDynamic(si)\"\n            type=\"button\"\n            class=\"slice-remove-btn\"\n            (click)=\"$event.stopPropagation(); removeDynamicSlice(si)\"\n          >\u00D7</button>\n        </div>\n\n        <div class=\"slice-section-items\" *ngIf=\"!isSliceCollapsed(si)\">\n          <ng-container *ngIf=\"isSliceLoading(si); else sliceContent\">\n            <div class=\"slice-lazy-loading\">\n              <span class=\"lazy-skeleton\"></span>\n              <span class=\"lazy-skeleton\"></span>\n              <span class=\"lazy-skeleton\"></span>\n            </div>\n          </ng-container>\n          <ng-template #sliceContent>\n            <ng-container *ngFor=\"let category of slice.categories; trackBy: trackByCategoryKey\">\n              <button\n                *ngIf=\"sliceCategoryCount(si, category.key) > 0\"\n                class=\"slice-item\"\n                type=\"button\"\n                [class.active]=\"isSliceCategoryActive(si, category.key)\"\n                [attr.data-category-key]=\"category.key\"\n                [title]=\"category.label\"\n                (click)=\"onSliceCategorySelected(si, category.key)\"\n              >\n                <span>{{ category.label }}</span>\n                <span *ngIf=\"showCounts\">{{ sliceCategoryCount(si, category.key) }}</span>\n              </button>\n            </ng-container>\n            <div *ngIf=\"isSliceEmpty(si)\" class=\"slice-empty-state\">Aucune donn\u00E9e</div>\n          </ng-template>\n        </div>\n\n        <hr *ngIf=\"si < slices.length - 1\" class=\"slice-divider\" />\n      </ng-container>\n    </div>\n  </aside>\n</div>\n", styles: [":host{display:block;width:100%;height:100%;min-height:0;box-sizing:border-box}.slice-panel-wrapper{height:100%;max-height:100%;overflow-y:auto;box-sizing:border-box}.slice-panel{margin-top:0;border:1px solid var(--jqt-border-color);border-radius:10px;background:var(--jqt-surface-color);display:flex;flex-direction:column;min-width:0;height:100%;overflow:hidden;box-sizing:border-box}.slice-panel-header{flex-shrink:0;display:flex;justify-content:flex-end;align-items:center;height:34px;padding:0 8px;margin-bottom:8px}.slice-panel-header:has(.slice-panel-title){justify-content:space-between;padding-left:12px}.slice-panel-body{flex:1 1 0;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:4px;padding:4px 10px 10px;scrollbar-width:thin;scrollbar-color:var(--jqt-border-color) transparent}.slice-panel-body::-webkit-scrollbar{width:2px}.slice-panel-body::-webkit-scrollbar-thumb{background:var(--jqt-primary-color);border-radius:4px}.slice-panel-title{margin:0;padding-top:2px;font-size:11px;font-weight:700;line-height:1;text-transform:uppercase;letter-spacing:.08em;color:var(--jqt-text-color);-webkit-user-select:none;user-select:none;align-self:center;display:inline-flex;align-items:center;gap:5px}.slice-panel-title .slice-panel-title-icon{font-size:16px;width:16px;height:16px;line-height:1;flex-shrink:0}.slice-section-items{display:flex;flex-direction:column;gap:2px;flex:0 0 auto;scrollbar-width:thin;scrollbar-color:var(--jqt-border-color) transparent}.slice-section-items::-webkit-scrollbar{width:2px}.slice-section-items .slice-empty-state{padding:8px 10px;font-size:12px;color:var(--jqt-text-muted, #9ca3af);font-style:italic;text-align:center}.slice-section-items::-webkit-scrollbar-thumb{background:var(--jqt-border-color);border-radius:4px}.slice-toggle{border:0;background:var(--jqt-surface-color);color:var(--jqt-text-color);border-radius:6px;width:22px;height:22px;padding:0;font-size:14px;text-align:center;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1}.slice-toggle-icon{width:100%;height:100%;display:inline-flex;align-items:center;justify-content:center;line-height:1}.slice-panel.collapsed{border-color:transparent;background:transparent;overflow:visible}.slice-panel.collapsed .slice-panel-header{height:34px;padding:0;justify-content:center;align-items:center}.slice-panel.collapsed .slice-toggle{width:34px;height:34px;border:1px solid var(--jqt-border-color);background:var(--jqt-surface-color);border-radius:8px;font-size:16px}.slice-panel.collapsed .slice-toggle:hover{border-color:var(--jqt-text-muted)}.slice-title-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:4px 0 6px;cursor:pointer;-webkit-user-select:none;user-select:none}.slice-title-row:hover .slice-title{color:var(--jqt-text-color)}.slice-title-row:hover .slice-title-chevron{color:var(--jqt-text-secondary)}.slice-title-row:first-of-type .slice-title{margin-top:0}.slice-title-chevron{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;color:var(--jqt-text-muted);transition:transform .15s ease;transform:rotate(0);position:relative;top:-1px}.slice-title-chevron.expanded{transform:rotate(90deg)}.slice-title{flex:1 1 auto;margin:0;font-size:14px;font-weight:600;color:var(--jqt-title-color)}.slice-title-icon{flex-shrink:0;font-size:14px!important;width:14px!important;height:14px!important;color:var(--jqt-title-color)}.slice-remove-btn{background:none;border:none;cursor:pointer;color:var(--jqt-border-color);font-size:12px;padding:0 2px;line-height:1;flex-shrink:0;opacity:.5;transition:opacity .15s,color .15s}.slice-remove-btn:hover{color:var(--jqt-text-secondary);opacity:1}.slice-title-row:hover .slice-remove-btn{opacity:.8}.slice-item{display:flex;justify-content:space-between;align-items:center;text-align:left;width:100%;padding:5px 10px 5px 16px;background:transparent;border:0;cursor:pointer;border-radius:8px;color:var(--jqt-text-color);box-sizing:border-box;min-width:0;gap:8px}.slice-item.active{background:var(--jqt-row-hover-bg);font-weight:600}.slice-item.slice-multi{padding-left:6px}.slice-item span:first-child{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slice-item span:last-child{flex:0 0 auto;min-width:1.2em;text-align:right}.slice-check-box{flex:0 0 16px;width:16px;height:16px;border:1.5px solid var(--jqt-text-muted);border-radius:4px;background:var(--jqt-surface-color);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;transition:background .15s,border-color .15s}.slice-check-box.checked{background:var(--jqt-text-secondary);border-color:var(--jqt-text-secondary)}.slice-check-box.checked:after{content:\"\";display:block;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translateY(-1px)}.slice-divider{border:none;border-top:1px solid var(--jqt-border-color);margin:6px 0}.lazy-skeleton{display:block;height:12px;width:70%;border-radius:4px;background:linear-gradient(90deg,var(--jqt-border-color) 25%,var(--jqt-surface-alt-color) 50%,var(--jqt-border-color) 75%);background-size:200% 100%;animation:lazy-shimmer 1.4s ease-in-out infinite}.slice-lazy-loading{display:flex;flex-direction:column;gap:8px;padding:8px 10px}.slice-lazy-loading .lazy-skeleton{width:80%}.slice-lazy-loading .lazy-skeleton:nth-child(2){width:60%}.slice-lazy-loading .lazy-skeleton:nth-child(3){width:45%}@keyframes lazy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}\n"] }]
+        }], propDecorators: { sliceConfigs: [{
+                type: Input
+            }], columns: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], lazyData: [{
+                type: Input
+            }], lazyStatus: [{
+                type: Input
+            }], showToggle: [{
+                type: Input
+            }], showCounts: [{
+                type: Input
+            }], collapsedByDefault: [{
+                type: Input
+            }], alwaysShow: [{
+                type: Input
+            }], filterChange: [{
+                type: Output
+            }], activeKeysChange: [{
+                type: Output
+            }], dynamicSliceKeysChange: [{
+                type: Output
+            }], collapsedChange: [{
+                type: Output
+            }], slicePanelBodyRef: [{
+                type: ViewChild,
+                args: ['slicePanelBody']
+            }] } });
+
+/** Traductions françaises du paginator Material. */
+function getFrenchPaginatorIntl() {
+    const intl = new MatPaginatorIntl();
+    intl.itemsPerPageLabel = 'Éléments par page :';
+    intl.nextPageLabel = 'Page suivante';
+    intl.previousPageLabel = 'Page précédente';
+    intl.firstPageLabel = 'Première page';
+    intl.lastPageLabel = 'Dernière page';
+    intl.getRangeLabel = (page, pageSize, length) => {
+        if (length === 0 || pageSize === 0)
+            return `0 sur ${length}`;
+        length = Math.max(length, 0);
+        const start = page * pageSize;
+        const end = start < length ? Math.min(start + pageSize, length) : start + pageSize;
+        return `${start + 1} – ${end} sur ${length}`;
+    };
+    return intl;
+}
+/**
+ * Convertit une valeur brute en chaîne affichable.
+ * - null/undefined → ''
+ * - Date → format locale fr-FR
+ * - Tableau → valeurs jointes par ', '
+ * - Objet avec label/name → sa valeur string
+ * - Autres → String(value)
+ */
+function normalizeCellValue(value) {
+    if (value === null || value === undefined) {
+        return '';
+    }
+    if (value instanceof Date) {
+        return value.toLocaleString('fr-FR');
+    }
+    if (Array.isArray(value)) {
+        return value.map((item) => normalizeCellValue(item)).join(', ');
+    }
+    if (typeof value === 'object') {
+        if ('label' in value && value.label !== undefined) {
+            return String(value.label);
+        }
+        if ('name' in value && value.name !== undefined) {
+            return String(value.name);
+        }
+        return JSON.stringify(value);
+    }
+    return value;
+}
+/**
+ * Transforme une clé camelCase/snake_case en libellé lisible.
+ * Ex: 'createdAt' → 'Created at', 'my_field' → 'My field'
+ */
+function humanizeKey(key) {
+    return key
+        .replaceAll(/([a-z0-9])([A-Z])/g, '$1 $2')
+        .replaceAll(/[_-]+/g, ' ')
+        .replace(/^./, (value) => value.toUpperCase());
+}
+
+class TableComponent {
+    constructor() {
+        this.isLoading = false;
+        this.addRequested = new EventEmitter();
+        this.columnAdded = new EventEmitter();
+        this.columnRemoved = new EventEmitter();
+        this.categorySelected = new EventEmitter();
+        this.rowSelected = new EventEmitter();
+        this.renderedColumns = [];
+        this.tableDataSource = new MatTableDataSource([]);
+        this.activeColumns = [];
+        this.activeSliceFilter = () => true;
+        // Propriétés stables pour les bindings du template (contre erreur NG0100)
+        this._sliceConfigs = [];
+        this._sliceColumns = [];
+        this._sliceData = [];
+        this._sliceShowToggle = true;
+        this._staticSlicesForMenu = [];
+        this._activeDynamicSliceColumns = [];
+        this._availableColumnsForDynamicSlice = [];
+        this._allDynamicSliceColumns = [];
+        this._activeSliceByLabel = 'Aucun';
+        this.searchQuery = '';
+        this.activeGroupByKey = null;
+        this._matSortActive = '';
+        this._matSortDirection = '';
+        this._collapsedGroups = new Set();
+        this._activeSort = { active: '', direction: '' };
+        this._sortSubscribed = null;
+        this._destroy$ = new Subject();
+        this._defaultGroupCollapsed = false;
+        this._groupPages = new Map();
+        this._totalFilteredCount = 0;
+        this._lazyColumnStatus = new Map();
+        this._lazyColumnData = new Map();
+        this._lazyFetchCancels = new Map();
+        this._cdr = inject(ChangeDetectorRef);
+        this._el = inject((ElementRef));
+        this.isGroupHeader = (_, row) => row.__groupHeader === true;
+        // ── Lifecycle ──────────────────────────────────────────────────────────────
+        this.pageSize = 5;
+        this.pageSizeOptions = [5, 10, 20];
+        this.pageSizeOptionsGroupBy = [5, 10, 20];
+        this.groupPageSize = 5;
+        this.groupSortOrder = 'asc';
+        this.draggedColumnKey = null;
+        this.dragOverColumnKey = null;
+        this.userCustomizedColumns = false;
+        this.resolvedConfig = { columns: [] };
+        this._columnMap = new Map();
+        this._resolvedData = [];
+        this._preservePageIndex = null;
+        this._initialSearchApplied = false;
+        // ── Optimisation performance ─────────────────────────────────────────────
+        this._allFilteredRows = [];
+        this._paginatorSubscribed = null;
+        // Cache groupBy : invalide uniquement quand les données/tri/groupKey changent
+        this._groupCacheRows = null;
+        this._groupCacheKey = null;
+        this._groupCacheSortOrder = 'asc';
+        this._groupCacheSortActive = '';
+        this._groupCacheSortDir = '';
+        this._groupCacheOrder = [];
+        this._groupCacheMap = new Map();
+        this._pendingRender = null;
+        this.trackRowFn = (_index, row) => row.__groupHeader ? `__group_${row.__groupKey}` : row.__index ?? _index;
+    }
+    set paginator(value) {
+        this._paginator = value;
+        if (value) {
+            this.attachPaginator();
+            this._scheduleRender();
+        }
+    }
+    get paginator() { return this._paginator; }
+    // Seuil au-delà duquel le rendu groupé est bloqué pour protéger le navigateur
+    static { this.MAX_GROUP_COUNT = 500; }
+    ngOnChanges(changes) {
+        const dataChanged = !!(changes['config'] || changes['data'] || changes['dataSource']);
+        if (dataChanged) {
+            this._lazyFetchCancels.forEach(s => { s.next(); s.complete(); });
+            this._lazyFetchCancels.clear();
+            this._lazyColumnStatus = new Map();
+            this._lazyColumnData = new Map();
+        }
+        if (changes['config'] && !this._initialSearchApplied) {
+            const initial = this.config?.search?.initialQuery;
+            if (initial != null) {
+                this.searchQuery = initial;
+                this._initialSearchApplied = true;
+            }
+        }
+        this.refreshViewModel();
+        if (dataChanged) {
+            this.activeColumns.filter(c => c.lazy).forEach(c => this.triggerLazyFetch(c));
+        }
+    }
+    ngAfterViewInit() {
+        this.attachPaginator();
+        this.attachSort();
+        this._measureHeaderHeight();
+    }
+    ngOnDestroy() {
+        if (this._pendingRender !== null) {
+            clearTimeout(this._pendingRender);
+        }
+        this._destroy$.next();
+        this._destroy$.complete();
+    }
+    _measureHeaderHeight() {
+        const headerRow = this._el.nativeElement.querySelector('tr.mat-mdc-header-row');
+        if (headerRow) {
+            const h = headerRow.getBoundingClientRect().height;
+            if (h > 0) {
+                this._el.nativeElement.style.setProperty('--actual-header-height', h + 'px');
+            }
+        }
+    }
+    // ── Getters d'affichage ────────────────────────────────────────────────────
+    get title() {
+        return this.resolvedConfig.title ?? '';
+    }
+    get showTitle() {
+        return !!this.resolvedConfig.title;
+    }
+    get visibleColumns() {
+        return this.activeColumns;
+    }
+    get showSearchBar() { return this.resolvedConfig.search?.enabled === true; }
+    get showViewButton() { return this.resolvedConfig.view?.enabled === true; }
+    get showToolbar() { return this.showSearchBar || this.showViewButton; }
+    get showFields() { return this.showViewButton; }
+    get showGroupBySection() { return this.showViewButton && this.groupByColumns.length > 0; }
+    get filteredRowCount() {
+        return this.activeGroupByKey ? this._totalFilteredCount : this._allFilteredRows.length;
+    }
+    get activeGroupByLabel() {
+        if (!this.activeGroupByKey)
+            return 'Aucun';
+        const col = this.groupByColumns.find((c) => c.key === this.activeGroupByKey);
+        return col?.header || this.activeGroupByKey;
+    }
+    get totalColumnCount() {
+        return new Set((this.resolvedConfig.columns || []).map((c) => c.key)).size;
+    }
+    get activeSliceByLabel() {
+        return this._activeSliceByLabel;
+    }
+    get activeDynamicSliceColumns() {
+        return this._activeDynamicSliceColumns;
+    }
+    removeDynamicSliceByKey(key) {
+        this.slicePanelRef?.removeDynamicSliceByKey(key);
+    }
+    get groupByColumns() {
+        const all = this.resolvedConfig.columns || [];
+        const seen = new Set();
+        return all.filter((c) => {
+            if (c.groupable === false || seen.has(c.key))
+                return false;
+            if (!c.header && c.groupable !== true)
+                return false;
+            seen.add(c.key);
+            return true;
+        });
+    }
+    colLabel(col) {
+        return col.header || humanizeKey(col.key);
+    }
+    // ── Actions utilisateur ────────────────────────────────────────────────────
+    onSearchChange() {
+        this._preservePageIndex = 0;
+        this.refreshViewModel();
+        this.paginator?.firstPage();
+    }
+    onGroupByChange(key) {
+        this.activeGroupByKey = key;
+        this._defaultGroupCollapsed = key !== null;
+        this._collapsedGroups.clear();
+        this._groupPages.clear();
+        this.groupPageSize = this.resolveDefaultGroupPageSize();
+        this.refreshViewModel();
+        this.paginator?.firstPage();
+        if (key) {
+            this.viewMenuTrigger?.closeMenu();
+            const colDef = (this.resolvedConfig.columns || []).find(c => c.key === key);
+            if (colDef?.lazy && this._lazyColumnStatus.get(key) !== 'loaded') {
+                this.triggerLazyFetch(colDef);
+            }
+        }
+        else {
+            setTimeout(() => {
+                this.tableBodyScrollRef?.nativeElement.scrollTo({ top: 0, behavior: 'smooth' });
+            }, 0);
+        }
+    }
+    onGroupPageSizeChange(size) {
+        this.groupPageSize = Number(size);
+        this._groupPages.clear();
+        this.refreshViewModel();
+    }
+    onGroupSortToggle(dir) {
+        if (this.groupSortOrder === dir)
+            return;
+        this.groupSortOrder = dir;
+        this._groupPages.clear();
+        this.refreshViewModel();
+        const openGroup = this._defaultGroupCollapsed
+            ? (this._collapsedGroups.size === 1 ? [...this._collapsedGroups][0] : null)
+            : null;
+        if (openGroup) {
+            setTimeout(() => this.scrollToGroupHeader(openGroup), 0);
+        }
+    }
+    // ── Lazy loading ─────────────────────────────────────────────────────────
+    getLazyColumnStatus(key) {
+        return this._lazyColumnStatus.get(key) ?? 'idle';
+    }
+    getLazyRenderType(rowValue) {
+        if (rowValue === '__lazy_loading__')
+            return 'loading';
+        if (rowValue === '__lazy_error__')
+            return 'error';
+        return 'value';
+    }
+    retryLazyColumn(column) {
+        const k = column.key;
+        const prev = this._lazyFetchCancels.get(k);
+        if (prev) {
+            prev.next();
+            prev.complete();
+        }
+        this._lazyFetchCancels.delete(k);
+        const newStatus = new Map(this._lazyColumnStatus);
+        newStatus.delete(k);
+        this._lazyColumnStatus = newStatus;
+        const newData = new Map(this._lazyColumnData);
+        newData.delete(k);
+        this._lazyColumnData = newData;
+        this.triggerLazyFetch(column);
+    }
+    triggerLazyFetch(column) {
+        if (!column.lazy)
+            return;
+        const k = column.key;
+        if (this._lazyColumnStatus.get(k) === 'loading')
+            return;
+        const prev = this._lazyFetchCancels.get(k);
+        if (prev) {
+            prev.next();
+            prev.complete();
+        }
+        const cancel$ = new Subject();
+        this._lazyFetchCancels.set(k, cancel$);
+        const newStatus1 = new Map(this._lazyColumnStatus);
+        newStatus1.set(k, 'loading');
+        this._lazyColumnStatus = newStatus1;
+        this.refreshViewModel();
+        column.lazy.fetchFn().pipe(take(1), takeUntil(cancel$)).subscribe({
+            next: (values) => {
+                const rowMap = new Map();
+                const data = this._resolvedData;
+                values.forEach((value, i) => {
+                    if (i < data.length)
+                        rowMap.set(data[i], value);
+                });
+                const newData = new Map(this._lazyColumnData);
+                newData.set(k, rowMap);
+                this._lazyColumnData = newData;
+                const newStatus2 = new Map(this._lazyColumnStatus);
+                newStatus2.set(k, 'loaded');
+                this._lazyColumnStatus = newStatus2;
+                this.refreshViewModel();
+                this._cdr.markForCheck();
+            },
+            error: () => {
+                const newStatusErr = new Map(this._lazyColumnStatus);
+                newStatusErr.set(k, 'error');
+                this._lazyColumnStatus = newStatusErr;
+                this.refreshViewModel();
+                this._cdr.markForCheck();
+            },
+        });
+    }
+    // ── Groupement ────────────────────────────────────────────────────────────
+    toggleGroupCollapse(groupKey) {
+        if (this._collapsedGroups.has(groupKey)) {
+            this._collapsedGroups.delete(groupKey);
+        }
+        else {
+            this._collapsedGroups.clear();
+            this._collapsedGroups.add(groupKey);
+            setTimeout(() => this.scrollToGroupHeader(groupKey), 0);
+        }
+        // Court-circuit de refreshViewModel : la data et les colonnes n'ont pas changé,
+        // seul l'état collapsed change — reprojection directe sans rebuild complet
+        this._projectCurrentPage();
+        this._cdr.markForCheck();
+    }
+    scrollToGroupHeader(groupKey) {
+        const container = this.tableBodyScrollRef?.nativeElement;
+        if (!container)
+            return;
+        const row = container.querySelector(`tr[data-group-key="${CSS.escape(groupKey)}"]`);
+        if (!row)
+            return;
+        const headerHeight = parseFloat(this._el.nativeElement.style.getPropertyValue('--actual-header-height') || '56') || 56;
+        const containerRect = container.getBoundingClientRect();
+        const rowRect = row.getBoundingClientRect();
+        const currentScrollTop = container.scrollTop;
+        const targetScrollTop = currentScrollTop + (rowRect.top - containerRect.top) - headerHeight;
+        container.scrollTo({ top: targetScrollTop, behavior: 'smooth' });
+    }
+    isGroupCollapsed(groupKey) {
+        return this._defaultGroupCollapsed ? !this._collapsedGroups.has(groupKey) : this._collapsedGroups.has(groupKey);
+    }
+    groupPageBack(groupKey) {
+        const current = this._groupPages.get(groupKey) ?? 0;
+        if (current > 0) {
+            this._groupPages.set(groupKey, current - 1);
+            this._projectCurrentPage();
+            this._cdr.markForCheck();
+        }
+    }
+    groupPageForward(groupKey, totalCount) {
+        const maxPage = Math.ceil(totalCount / this.groupPageSize) - 1;
+        const current = this._groupPages.get(groupKey) ?? 0;
+        if (current < maxPage) {
+            this._groupPages.set(groupKey, current + 1);
+            this._projectCurrentPage();
+            this._cdr.markForCheck();
+        }
+    }
+    // ── Colonnes ──────────────────────────────────────────────────────────────
+    get hasAddableColumns() {
+        return this.menuBaseColumns.length > 0 || this.menuOptionalColumns.length > 0;
+    }
+    get menuBaseColumns() {
+        return this.uniqueColumnsByKey((this.resolvedConfig.columns || []).filter((c) => !c.optional));
+    }
+    get menuOptionalColumns() {
+        return this.uniqueColumnsByKey((this.resolvedConfig.columns || []).filter((c) => c.optional));
+    }
+    get availableColumnsToAdd() {
+        const activeKeys = new Set(this.activeColumns.map((column) => column.key));
+        return (this.resolvedConfig.columns || []).filter((c) => c.optional && !activeKeys.has(c.key));
+    }
+    get allowColumnRemoval() {
+        return this.resolvedConfig.view?.enableColumnRemoval !== false;
+    }
+    // ── Slices ────────────────────────────────────────────────────────────────
+    get hasSliceConfig() {
+        return (this.resolvedConfig.slices?.length ?? 0) > 0;
+    }
+    get showSlicePanel() {
+        return this.slicePanelRef?.showPanel ?? (this.hasSliceConfig && this._resolvedData.length > 0);
+    }
+    get showAddSliceButton() {
+        return this.showViewButton && ((this.resolvedConfig.slices?.length ?? 0) > 0 || this._allDynamicSliceColumns.length > 0);
+    }
+    get staticSlicesForMenu() {
+        return this._staticSlicesForMenu;
+    }
+    get availableColumnsForDynamicSlice() {
+        return this._availableColumnsForDynamicSlice;
+    }
+    isStaticSliceVisible(columnKey) {
+        return this.slicePanelRef?.isStaticSliceVisible(columnKey) ?? true;
+    }
+    toggleStaticSlice(columnKey) {
+        this.slicePanelRef?.toggleStaticSlice(columnKey);
+    }
+    addDynamicSlice(column) {
+        this.slicePanelRef?.addDynamicSlice(column);
+        if (column.lazy && this._lazyColumnStatus.get(column.key) !== 'loaded') {
+            this.triggerLazyFetch(column);
+        }
+    }
+    get allDynamicSliceColumns() {
+        return this._allDynamicSliceColumns;
+    }
+    isDynamicSliceActive(key) {
+        return this._activeDynamicSliceColumns.some(c => c.key === key);
+    }
+    toggleDynamicSlice(col) {
+        if (this.isDynamicSliceActive(col.key)) {
+            this.removeDynamicSliceByKey(col.key);
+        }
+        else {
+            this.addDynamicSlice(col);
+        }
+    }
+    onSliceFilterChange(pred) {
+        this.activeSliceFilter = pred;
+        this._preservePageIndex = 0;
+        this.refreshViewModel();
+        this.paginator?.firstPage();
+    }
+    onDynamicSliceKeysChange(keys) {
+        const allCols = this.resolvedConfig.columns ?? [];
+        const staticKeys = new Set((this.resolvedConfig.slices ?? []).map(s => s.columnKey).filter((k) => !!k));
+        const dynamicKeySet = new Set(keys);
+        const existingKeys = new Set([...staticKeys, ...dynamicKeySet]);
+        this._activeDynamicSliceColumns = keys
+            .map(k => allCols.find(c => c.key === k))
+            .filter((c) => !!c);
+        const seen = new Set();
+        this._availableColumnsForDynamicSlice = allCols.filter(c => {
+            if (c.sliceable === false || existingKeys.has(c.key) || seen.has(c.key))
+                return false;
+            seen.add(c.key);
+            return true;
+        });
+        this._computeSliceLabel();
+        this._cdr.markForCheck();
+    }
+    get emptyStateLabel() {
+        return this.resolvedConfig.labels?.empty || 'Aucune donnée';
+    }
+    get loadingStateLabel() {
+        return this.resolvedConfig.labels?.loading || 'Chargement des données...';
+    }
+    get effectiveIsLoading() {
+        return this.isLoading || this._pendingRender !== null;
+    }
+    get isEmpty() {
+        return !this.effectiveIsLoading && this._allFilteredRows.length === 0;
+    }
+    get showPagination() {
+        if (this.activeGroupByKey !== null)
+            return false;
+        return this.resolvedConfig.pagination?.enabled !== false;
+    }
+    get isColumnDragDropEnabled() {
+        return this.resolvedConfig.view?.enableColumnDragDrop === true;
+    }
+    get totalRows() {
+        return this.activeGroupByKey
+            ? this.tableDataSource.data.filter((r) => !r.__groupHeader).length
+            : this._allFilteredRows.length;
+    }
+    // ── Gestion des colonnes ─────────────────────────────────────────────────
+    onAddColumn(column) {
+        this.userCustomizedColumns = true;
+        const configCols = this.resolvedConfig.columns ?? [];
+        const configIndex = configCols.findIndex(c => c.key === column.key);
+        if (configIndex === -1) {
+            this.activeColumns = [...this.activeColumns, column];
+        }
+        else {
+            const insertBefore = this.activeColumns.findIndex(c => {
+                const ci = configCols.findIndex(cc => cc.key === c.key);
+                return ci !== -1 && ci > configIndex;
+            });
+            if (insertBefore === -1) {
+                this.activeColumns = [...this.activeColumns, column];
+            }
+            else {
+                const copy = [...this.activeColumns];
+                copy.splice(insertBefore, 0, column);
+                this.activeColumns = copy;
+            }
+        }
+        this._preservePageIndex = this.paginator?.pageIndex ?? null;
+        this.refreshViewModel();
+        if (column.lazy) {
+            this.triggerLazyFetch(column);
+        }
+        this.addRequested.emit();
+        this.columnAdded.emit(column);
+    }
+    onColumnVisibilityChange(column, checked) {
+        const isVisible = this.isColumnVisible(column.key);
+        if (checked && !isVisible) {
+            this.onAddColumn(column);
+            return;
+        }
+        if (!checked && isVisible) {
+            if (!column.optional && !this.allowColumnRemoval) {
+                return;
+            }
+            if (this.activeColumns.length <= 1) {
+                return;
+            }
+            this.userCustomizedColumns = true;
+            this.activeColumns = this.activeColumns.filter((item) => item.key !== column.key);
+            this._preservePageIndex = this.paginator?.pageIndex ?? null;
+            this.refreshViewModel();
+            this.columnRemoved.emit(column);
+        }
+    }
+    isColumnVisible(columnKey) {
+        return this.activeColumns.some((column) => column.key === columnKey);
+    }
+    onRemoveColumn(columnKey, event) {
+        event?.stopPropagation();
+        if (!this.allowColumnRemoval) {
+            return;
+        }
+        const column = this.activeColumns.find((item) => item.key === columnKey);
+        if (!column || !this.canRemoveColumn(column)) {
+            return;
+        }
+        this.userCustomizedColumns = true;
+        this.activeColumns = this.activeColumns.filter((item) => item.key !== columnKey);
+        this.refreshViewModel();
+        this.columnRemoved.emit(column);
+    }
+    // ── Lignes ────────────────────────────────────────────────────────────────
+    getCellTemplate(key) {
+        return this._cellDefs?.find((d) => d.columnKey === key)?.template ?? null;
+    }
+    get hasCustomCellDefs() {
+        return (this._cellDefs?.length ?? 0) > 0;
+    }
+    get hasRowClickHandler() {
+        return this.rowSelected.observed || !!this.config?.onRowSelected;
+    }
+    getRowClass(row) {
+        const fn = this.resolvedConfig.rowClass;
+        if (!fn || row?.__groupHeader)
+            return {};
+        return fn(row.__raw ?? row, row.__index ?? 0);
+    }
+    onRowClick(row, event) {
+        if (row?.__groupHeader)
+            return;
+        if (!this.hasRowClickHandler)
+            return;
+        const resolved = (row?.__raw ?? row);
+        this.rowSelected.emit(resolved);
+        this.config?.onRowSelected?.(resolved, event);
+    }
+    // ── Drag & drop ───────────────────────────────────────────────────────────
+    onHeaderDragStart(columnKey, event) {
+        if (!this.isColumnDragDropEnabled) {
+            return;
+        }
+        this.draggedColumnKey = columnKey;
+        this.dragOverColumnKey = null;
+        if (event.dataTransfer) {
+            event.dataTransfer.effectAllowed = 'move';
+            event.dataTransfer.setData('text/plain', columnKey);
+        }
+    }
+    onHeaderDragOver(columnKey, event) {
+        if (!this.isColumnDragDropEnabled || !this.draggedColumnKey) {
+            return;
+        }
+        event.preventDefault();
+        this.dragOverColumnKey = columnKey;
+    }
+    onHeaderDrop(targetColumnKey, event) {
+        if (!this.isColumnDragDropEnabled || !this.draggedColumnKey) {
+            return;
+        }
+        event.preventDefault();
+        const previousIndex = this.activeColumns.findIndex((column) => column.key === this.draggedColumnKey);
+        const currentIndex = this.activeColumns.findIndex((column) => column.key === targetColumnKey);
+        if (previousIndex === -1 || currentIndex === -1 || previousIndex === currentIndex) {
+            this.onHeaderDragEnd();
+            return;
+        }
+        this.userCustomizedColumns = true;
+        const reordered = [...this.activeColumns];
+        const [moved] = reordered.splice(previousIndex, 1);
+        reordered.splice(currentIndex, 0, moved);
+        this.activeColumns = reordered;
+        this.refreshViewModel();
+        this.onHeaderDragEnd();
+    }
+    onHeaderDragEnd() {
+        this.draggedColumnKey = null;
+        this.dragOverColumnKey = null;
+    }
+    isHeaderDropTarget(columnKey) {
+        return !!this.draggedColumnKey && this.dragOverColumnKey === columnKey && this.draggedColumnKey !== columnKey;
+    }
+    canRemoveColumn(column) {
+        return (this.allowColumnRemoval &&
+            column.removable !== false &&
+            this.activeColumns.length > 1);
+    }
+    isCellEmpty(value) {
+        return value === '' || value == null;
+    }
+    asTitle(value) {
+        if (value === null || value === undefined) {
+            return '';
+        }
+        return String(value);
+    }
+    // ── Pipeline de données (privé) ──────────────────────────────────────────
+    refreshViewModel() {
+        this._resolvedData = this.resolveData();
+        this.resolvedConfig = this.buildEffectiveConfig();
+        this._columnMap = new Map((this.resolvedConfig.columns || []).map(c => [c.key, c]));
+        const defaultColumns = (this.resolvedConfig.columns || []).filter(c => !c.optional);
+        if (!this.userCustomizedColumns || this.activeColumns.length === 0) {
+            this.activeColumns = [...defaultColumns];
+        }
+        else {
+            const allowedKeys = new Set((this.resolvedConfig.columns || []).map((column) => column.key));
+            this.activeColumns = this.activeColumns.filter((column) => allowedKeys.has(column.key));
+        }
+        this.renderedColumns = this.activeColumns.map((column) => column.key);
+        this.pageSize = this.paginator?.pageSize || this.resolvePageSize();
+        this.pageSizeOptions = this.resolvePageSizeOptions();
+        this.pageSizeOptionsGroupBy = this.resolvePageSizeOptionsGroupBy();
+        if (this.groupPageSize !== 0 && !this.pageSizeOptionsGroupBy.includes(this.groupPageSize)) {
+            this.groupPageSize = this.resolveDefaultGroupPageSize();
+        }
+        this.attachPaginator();
+        this.attachSort();
+        // Mise à jour des propriétés stables pour les bindings du template
+        this._sliceConfigs = this.resolvedConfig.slices ?? [];
+        this._sliceColumns = this.resolvedConfig.columns ?? [];
+        this._sliceData = this._resolvedData;
+        this._sliceShowToggle = this.resolvedConfig.enableSliceToggle !== false;
+        this._staticSlicesForMenu = (this.resolvedConfig.slices ?? [])
+            .filter(s => !!s.columnKey)
+            .map(s => {
+            const colIcon = (this.resolvedConfig.columns ?? []).find(c => c.key === s.columnKey)?.icon;
+            return { key: s.columnKey, title: s.title || humanizeKey(s.columnKey), icon: s.icon ?? colIcon };
+        });
+        if (!this._activeSort.active && this.resolvedConfig.defaultSort) {
+            this._matSortActive = this.resolvedConfig.defaultSort.active;
+            this._matSortDirection = this.resolvedConfig.defaultSort.direction;
+        }
+        const staticKeys = new Set((this.resolvedConfig.slices ?? []).map(s => s.columnKey).filter((k) => !!k));
+        const activeDynKeys = new Set(this._activeDynamicSliceColumns.map(c => c.key));
+        const seen = new Set();
+        this._availableColumnsForDynamicSlice = (this.resolvedConfig.columns ?? []).filter(c => {
+            if (c.sliceable === false || staticKeys.has(c.key) || activeDynKeys.has(c.key) || seen.has(c.key))
+                return false;
+            if (!c.header && c.sliceable !== true)
+                return false;
+            seen.add(c.key);
+            return true;
+        });
+        const seen2 = new Set();
+        this._allDynamicSliceColumns = (this.resolvedConfig.columns ?? []).filter(c => {
+            if (c.sliceable === false || staticKeys.has(c.key) || seen2.has(c.key))
+                return false;
+            if (!c.header && c.sliceable !== true)
+                return false;
+            seen2.add(c.key);
+            return true;
+        });
+        this._computeSliceLabel();
+        this._scheduleRender();
+    }
+    _computeSliceLabel() {
+        const visibleStaticCount = this.slicePanelRef?.staticSliceCount
+            ?? this._sliceConfigs.length;
+        const total = visibleStaticCount + this._activeDynamicSliceColumns.length;
+        if (total === 0) {
+            this._activeSliceByLabel = 'Aucun';
+            return;
+        }
+        if (total === 1) {
+            if (visibleStaticCount === 1) {
+                const first = this._sliceConfigs.find(s => !s.columnKey || this.isStaticSliceVisible(s.columnKey));
+                this._activeSliceByLabel = first?.title || first?.columnKey || '1';
+                return;
+            }
+            this._activeSliceByLabel = this._activeDynamicSliceColumns[0]?.header || '1';
+            return;
+        }
+        this._activeSliceByLabel = `${total} actifs`;
+    }
+    _scheduleRender() {
+        if (this._pendingRender !== null) {
+            clearTimeout(this._pendingRender);
+            this._pendingRender = null;
+        }
+        this._pendingRender = setTimeout(() => {
+            this._pendingRender = null;
+            this._executeRender();
+        }, 0);
+    }
+    _executeRender() {
+        const categoryRows = this.getCategoryFilteredData();
+        if (this.activeGroupByKey) {
+            // En mode groupBy, projectRows gère tout le tri internement — pas de sort global inutile
+            this._allFilteredRows = categoryRows;
+        }
+        else {
+            const compareFn = this._buildSortComparator();
+            this._allFilteredRows = compareFn ? [...categoryRows].sort(compareFn) : categoryRows;
+        }
+        // Mettre à jour le paginator avec le nouveau total
+        if (this.paginator) {
+            const savedIndex = this._preservePageIndex ?? this.paginator.pageIndex;
+            const maxPage = Math.max(0, Math.ceil(this._allFilteredRows.length / this.pageSize) - 1);
+            this.paginator.length = this._allFilteredRows.length;
+            this.paginator.pageIndex = Math.min(savedIndex, maxPage);
+            this._preservePageIndex = null;
+        }
+        this._projectCurrentPage();
+        this._cdr.markForCheck();
+    }
+    _projectCurrentPage() {
+        if (this.activeGroupByKey) {
+            this.tableDataSource.data = this.projectRows(this._allFilteredRows);
+            return;
+        }
+        const pageIndex = this.paginator?.pageIndex ?? 0;
+        const start = pageIndex * this.pageSize;
+        const pageRows = this._allFilteredRows.slice(start, start + this.pageSize);
+        const projected = [];
+        pageRows.forEach((row, i) => {
+            const idx = start + i;
+            const p = { __raw: row, __index: idx };
+            this.activeColumns.forEach((col) => {
+                p[col.key] = this.resolveCellValue(col, row, idx);
+            });
+            projected.push(p);
+        });
+        this.tableDataSource.data = projected;
+    }
+    buildEffectiveConfig() {
+        const config = this.config || {};
+        const rows = this._resolvedData;
+        const columns = config.columns ||
+            this.columnsConfig ||
+            this.resolveColumnsFromCompat(rows);
+        return {
+            ...config,
+            columns,
+            slices: config.slices || [],
+            enableSliceToggle: config.enableSliceToggle ?? true,
+        };
+    }
+    resolveData() {
+        if (Array.isArray(this.data)) {
+            return this.data;
+        }
+        if (Array.isArray(this.dataSource)) {
+            return this.dataSource;
+        }
+        if (this.dataSource && Array.isArray(this.dataSource.data)) {
+            return this.dataSource.data;
+        }
+        return [];
+    }
+    resolveColumnsFromCompat(rows) {
+        if (this.displayedColumns?.length) {
+            return this.displayedColumns.map((key) => ({
+                key,
+                header: this.columnLabels?.[key] || humanizeKey(key),
+            }));
+        }
+        const firstRow = rows[0];
+        if (!firstRow || typeof firstRow !== 'object') {
+            return [];
+        }
+        return Object.keys(firstRow).map((key) => ({
+            key,
+            header: this.columnLabels?.[key] || humanizeKey(key),
+        }));
+    }
+    getCategoryFilteredData() {
+        const data = this._resolvedData;
+        let filtered = data.filter(this.activeSliceFilter);
+        const query = this.searchQuery?.trim().toLowerCase();
+        if (query) {
+            filtered = filtered.filter((row) => this.activeColumns.some((col) => {
+                const val = this.getLazyAwareValue(col.key, row);
+                return val != null && String(val).toLowerCase().includes(query);
+            }));
+        }
+        return filtered;
+    }
+    projectRows(rows) {
+        const groupKey = this.activeGroupByKey;
+        if (!groupKey) {
+            const result = [];
+            rows.forEach((row, index) => {
+                const projected = { __raw: row, __index: index };
+                this.activeColumns.forEach((col) => {
+                    projected[col.key] = this.resolveCellValue(col, row, index);
+                });
+                result.push(projected);
+            });
+            return result;
+        }
+        const groupColDef = this._columnMap.get(groupKey);
+        const groupLazyStatus = groupColDef?.lazy ? (this._lazyColumnStatus.get(groupKey) ?? 'idle') : 'loaded';
+        if (groupLazyStatus !== 'loaded') {
+            this._totalFilteredCount = rows.length;
+            return [{ __groupHeader: true, __groupKey: '__lazy_loading__', __groupCount: rows.length, __groupPage: 0, __groupPageCount: 1 }];
+        }
+        const effectiveSort = this._activeSort.active && this._activeSort.direction
+            ? this._activeSort
+            : this.resolvedConfig.defaultSort ?? { active: '', direction: '' };
+        // Vérifie si le cache est encore valide (même référence de rows + même paramètres de tri/groupe)
+        const cacheValid = this._groupCacheRows === rows &&
+            this._groupCacheKey === groupKey &&
+            this._groupCacheSortOrder === this.groupSortOrder &&
+            this._groupCacheSortActive === (effectiveSort.active ?? '') &&
+            this._groupCacheSortDir === (effectiveSort.direction ?? '');
+        let groupOrder;
+        let groupMap;
+        if (cacheValid) {
+            groupOrder = this._groupCacheOrder;
+            groupMap = this._groupCacheMap;
+        }
+        else {
+            // Pré-calcul des valeurs de groupe en un seul passage (évite O(n) find() par comparaison)
+            const groupValueCache = new Map();
+            rows.forEach(row => groupValueCache.set(row, String(this.getLazyAwareValue(groupKey, row) ?? '')));
+            // Pré-calcul des valeurs de tri (évite O(n log n) × getLazyAwareValue dans le comparateur)
+            let fastCompareFn = null;
+            if (effectiveSort.active && effectiveSort.direction) {
+                const sortValueCache = new Map();
+                rows.forEach(row => sortValueCache.set(row, this.getLazyAwareValue(effectiveSort.active, row)));
+                const dir = effectiveSort.direction;
+                fastCompareFn = (a, b) => {
+                    const va = sortValueCache.get(a);
+                    const vb = sortValueCache.get(b);
+                    let cmp = 0;
+                    if (typeof va === 'number' && typeof vb === 'number') {
+                        cmp = va < vb ? -1 : va > vb ? 1 : 0;
+                    }
+                    else {
+                        const sa = va == null ? '' : String(va).toLowerCase();
+                        const sb = vb == null ? '' : String(vb).toLowerCase();
+                        cmp = sa < sb ? -1 : sa > sb ? 1 : 0;
+                    }
+                    return dir === 'asc' ? cmp : -cmp;
+                };
+            }
+            const sorted = [...rows].sort((a, b) => {
+                const va = groupValueCache.get(a);
+                const vb = groupValueCache.get(b);
+                const cmp = va.localeCompare(vb);
+                return this.groupSortOrder === 'desc' ? -cmp : cmp;
+            });
+            groupOrder = [];
+            groupMap = new Map();
+            sorted.forEach((row) => {
+                const groupValue = groupValueCache.get(row);
+                if (!groupMap.has(groupValue)) {
+                    groupOrder.push(groupValue);
+                    groupMap.set(groupValue, []);
+                }
+                groupMap.get(groupValue).push(row);
+            });
+            // Tri intra-groupe stocké dans le cache — évite le re-tri sur collapse/expand/pagination
+            if (fastCompareFn) {
+                const fn = fastCompareFn;
+                groupMap.forEach((groupRows, key) => {
+                    groupMap.set(key, [...groupRows].sort(fn));
+                });
+            }
+            // Mise en cache
+            this._groupCacheRows = rows;
+            this._groupCacheKey = groupKey;
+            this._groupCacheSortOrder = this.groupSortOrder;
+            this._groupCacheSortActive = effectiveSort.active ?? '';
+            this._groupCacheSortDir = effectiveSort.direction ?? '';
+            this._groupCacheOrder = groupOrder;
+            this._groupCacheMap = groupMap;
+        }
+        this._totalFilteredCount = rows.length;
+        // Protection contre les jeux de données à trop haute cardinalité
+        if (groupOrder.length > TableComponent.MAX_GROUP_COUNT) {
+            return [{ __groupHeader: true, __groupKey: '__too_many_groups__', __groupCount: groupOrder.length, __groupPage: 0, __groupPageCount: 1 }];
+        }
+        const pageSize = this.groupPageSize;
+        const result = [];
+        groupOrder.forEach((groupValue) => {
+            const groupRows = groupMap.get(groupValue);
+            const totalCount = groupRows.length;
+            const currentPage = pageSize === 0 ? 0 : (this._groupPages.get(groupValue) ?? 0);
+            const pageCount = pageSize === 0 ? 1 : Math.max(1, Math.ceil(totalCount / pageSize));
+            const collapsed = this.isGroupCollapsed(groupValue);
+            result.push({ __groupHeader: true, __groupKey: groupValue, __groupCount: totalCount, __groupPage: currentPage, __groupPageCount: pageCount });
+            if (!collapsed) {
+                const start = pageSize === 0 ? 0 : currentPage * pageSize;
+                const end = pageSize === 0 ? totalCount : Math.min(start + pageSize, totalCount);
+                groupRows.slice(start, end).forEach((row, i) => {
+                    const idx = start + i;
+                    const projected = { __raw: row, __index: idx };
+                    this.activeColumns.forEach((col) => {
+                        projected[col.key] = this.resolveCellValue(col, row, idx);
+                    });
+                    result.push(projected);
+                });
+            }
+        });
+        return result;
+    }
+    _buildSortComparator() {
+        const sort = this._activeSort.active && this._activeSort.direction
+            ? this._activeSort
+            : this.resolvedConfig.defaultSort ?? { active: '', direction: '' };
+        const { active, direction } = sort;
+        if (!active || !direction)
+            return null;
+        return (a, b) => {
+            const va = this.getLazyAwareValue(active, a);
+            const vb = this.getLazyAwareValue(active, b);
+            let cmp = 0;
+            if (typeof va === 'number' && typeof vb === 'number') {
+                cmp = va < vb ? -1 : va > vb ? 1 : 0;
+            }
+            else {
+                const sa = va == null ? '' : String(va).toLowerCase();
+                const sb = vb == null ? '' : String(vb).toLowerCase();
+                cmp = sa < sb ? -1 : sa > sb ? 1 : 0;
+            }
+            return direction === 'asc' ? cmp : -cmp;
+        };
+    }
+    getLazyAwareValue(columnKey, row) {
+        const colDef = this._columnMap.get(columnKey);
+        if (colDef?.lazy) {
+            return this._lazyColumnData.get(columnKey)?.get(row) ?? null;
+        }
+        if (colDef?.sortValue) {
+            return normalizeCellValue(colDef.sortValue(row, 0));
+        }
+        if (colDef?.value) {
+            return normalizeCellValue(colDef.value(row, 0));
+        }
+        return row[columnKey];
+    }
+    resolveCellValue(col, row, index) {
+        if (col.lazy) {
+            const status = this._lazyColumnStatus.get(col.key) ?? 'idle';
+            if (status === 'loading')
+                return '__lazy_loading__';
+            if (status === 'error')
+                return '__lazy_error__';
+            if (status === 'loaded') {
+                const rowMap = this._lazyColumnData.get(col.key);
+                return normalizeCellValue(rowMap?.get(row) ?? '');
+            }
+            return '';
+        }
+        const valueProvider = col.value;
+        const rawValue = valueProvider ? valueProvider(row, index) : row?.[col.key];
+        return normalizeCellValue(rawValue);
+    }
+    resolvePageSize() {
+        return Math.max(1, this.resolvedConfig.pagination?.pageSize || this.pageSize || 5);
+    }
+    resolvePageSizeOptions() {
+        const options = this.resolvedConfig.pagination?.pageSizeOptions || [5, 10, 20];
+        const unique = [...new Set(options.filter((value) => value > 0))];
+        if (!unique.includes(this.pageSize)) {
+            unique.push(this.pageSize);
+        }
+        return unique.sort((a, b) => a - b);
+    }
+    resolvePageSizeOptionsGroupBy() {
+        const options = this.resolvedConfig.pagination?.pageSizeOptionsGroupBy || this.resolvedConfig.pagination?.pageSizeOptions || [5, 10, 20];
+        const unique = [...new Set(options.filter((v) => v > 0))];
+        if (this.groupPageSize > 0 && !unique.includes(this.groupPageSize)) {
+            unique.push(this.groupPageSize);
+        }
+        return unique.sort((a, b) => a - b);
+    }
+    resolveDefaultGroupPageSize() {
+        const cfg = this.resolvedConfig;
+        const options = cfg.pagination?.pageSizeOptionsGroupBy || cfg.pagination?.pageSizeOptions;
+        if (options?.length)
+            return options[0];
+        return cfg.pagination?.pageSize || 5;
+    }
+    uniqueColumnsByKey(columns) {
+        const seen = new Set();
+        return columns.filter((column) => {
+            if (seen.has(column.key)) {
+                return false;
+            }
+            seen.add(column.key);
+            return true;
+        });
+    }
+    attachPaginator() {
+        if (!this.showPagination) {
+            this.tableDataSource.paginator = null;
+            return;
+        }
+        if (!this.paginator)
+            return;
+        this.tableDataSource.paginator = null;
+        this.paginator.pageSize = this.pageSize;
+        if (this._paginatorSubscribed !== this.paginator) {
+            this._paginatorSubscribed = this.paginator;
+            this.paginator.page.pipe(takeUntil(this._destroy$)).subscribe(() => {
+                this.pageSize = this.paginator.pageSize;
+                if (this._pendingRender !== null)
+                    return;
+                this._projectCurrentPage();
+                this._cdr.markForCheck();
+            });
+        }
+    }
+    attachSort() {
+        if (!this.sort)
+            return;
+        this.tableDataSource.sort = null;
+        if (this._sortSubscribed !== this.sort) {
+            this._sortSubscribed = this.sort;
+            this.sort.sortChange.pipe(takeUntil(this._destroy$)).subscribe(() => {
+                this._activeSort = {
+                    active: this.sort.active,
+                    direction: this.sort.direction,
+                };
+                this._scheduleRender();
+            });
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableComponent, isStandalone: true, selector: "jquery-table", inputs: { config: "config", dataSource: "dataSource", data: "data", displayedColumns: "displayedColumns", columnsConfig: "columnsConfig", columnLabels: "columnLabels", isLoading: "isLoading" }, outputs: { addRequested: "addRequested", columnAdded: "columnAdded", columnRemoved: "columnRemoved", categorySelected: "categorySelected", rowSelected: "rowSelected" }, providers: [{ provide: MatPaginatorIntl, useFactory: getFrenchPaginatorIntl }], queries: [{ propertyName: "_cellDefs", predicate: JqtCellDefDirective }], viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableBodyScrollRef", first: true, predicate: ["tableBodyScroll"], descendants: true }, { propertyName: "slicePanelRef", first: true, predicate: SlicePanelComponent, descendants: true }, { propertyName: "viewMenuTrigger", first: true, predicate: ["viewMenuTrigger"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<section class=\"jquery-table-wrapper\">\n  <header class=\"table-header\" *ngIf=\"showTitle\">\n    <h3>{{ title }}</h3>\n  </header>\n\n  <div\n    class=\"table-layout\"\n    [class.slice-collapsed]=\"showSlicePanel && (slicePanelRef?.isCollapsed ?? false)\"\n    [class.no-slice]=\"!showSlicePanel\"\n  >\n    <slice-panel\n      [style.display]=\"showSlicePanel ? null : 'none'\"\n      [sliceConfigs]=\"_sliceConfigs\"\n      [columns]=\"_sliceColumns\"\n      [data]=\"_sliceData\"\n      [lazyData]=\"_lazyColumnData\"\n      [lazyStatus]=\"_lazyColumnStatus\"\n      [showToggle]=\"_sliceShowToggle\"\n      (filterChange)=\"onSliceFilterChange($event)\"\n      (dynamicSliceKeysChange)=\"onDynamicSliceKeysChange($event)\"\n    ></slice-panel>\n\n    <div class=\"table-shell\">\n      <div class=\"table-toolbar\" *ngIf=\"showToolbar\">\n        <div class=\"table-toolbar-left\">\n          <div *ngIf=\"showSearchBar\" class=\"search-input-wrapper\">\n            <svg class=\"search-icon\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"8.5\" cy=\"8.5\" r=\"5.5\" stroke=\"currentColor\" stroke-width=\"1.5\"/>\n              <path d=\"M13 13L17 17\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n            </svg>\n            <input\n              class=\"search-input\"\n              type=\"text\"\n              [(ngModel)]=\"searchQuery\"\n              (ngModelChange)=\"onSearchChange()\"\n              placeholder=\"Rechercher...\"\n              autocomplete=\"off\"\n            />\n            <button *ngIf=\"searchQuery\" type=\"button\" class=\"search-clear-btn\" (click)=\"searchQuery = ''; onSearchChange()\">\u00D7</button>\n            <span class=\"search-count\">{{ filteredRowCount }}</span>\n          </div>\n        </div>\n        <div *ngIf=\"showViewButton\" class=\"table-toolbar-right\">\n          <button type=\"button\" class=\"view-btn\" [matMenuTriggerFor]=\"viewMenu\" #viewMenuTrigger=\"matMenuTrigger\">\n            <mat-icon class=\"view-btn-icon\">settings</mat-icon>\n            View\n          </button>\n\n          <mat-menu #viewMenu=\"matMenu\" [panelClass]=\"'view-menu-panel'\">\n            <button *ngIf=\"showFields\" mat-menu-item [matMenuTriggerFor]=\"fieldsSubMenu\" class=\"view-menu-sub-trigger\">\n              <span class=\"view-menu-sub-label\">Champs</span>\n              <span class=\"view-menu-sub-value\">{{ visibleColumns.length }}/{{ totalColumnCount }}</span>\n            </button>\n            <button *ngIf=\"showGroupBySection\" mat-menu-item [matMenuTriggerFor]=\"groupBySubMenu\" class=\"view-menu-sub-trigger\">\n              <span class=\"view-menu-sub-label\">Group by</span>\n              <span class=\"view-menu-sub-value\">{{ activeGroupByLabel }}</span>\n            </button>\n            <button *ngIf=\"showAddSliceButton\" mat-menu-item [matMenuTriggerFor]=\"sliceBySubMenu\" class=\"view-menu-sub-trigger\">\n              <span class=\"view-menu-sub-label\">Slice by</span>\n              <span class=\"view-menu-sub-value\">{{ activeSliceByLabel }}</span>\n            </button>\n          </mat-menu>\n\n          <mat-menu #fieldsSubMenu=\"matMenu\" [panelClass]=\"'view-submenu-panel'\">\n            <div class=\"view-submenu\" (mousedown)=\"$event.stopPropagation()\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\n              <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let column of menuBaseColumns\"\n                [disabled]=\"!column.optional && !allowColumnRemoval\"\n                (click)=\"onColumnVisibilityChange(column, !isColumnVisible(column.key))\">\n                <span class=\"view-menu-check\">{{ isColumnVisible(column.key) ? '\u2713' : '' }}</span>\n                <mat-icon *ngIf=\"column.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ column.icon }}</mat-icon>\n                {{ colLabel(column) }}\n              </button>\n              <ng-container *ngIf=\"menuOptionalColumns.length > 0\">\n                <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let column of menuOptionalColumns\"\n                  [disabled]=\"(isColumnVisible(column.key) && visibleColumns.length === 1) || getLazyColumnStatus(column.key) === 'loading'\"\n                  (click)=\"onColumnVisibilityChange(column, !isColumnVisible(column.key))\">\n                  <span class=\"view-menu-check\">{{ isColumnVisible(column.key) ? '\u2713' : '' }}</span>\n                  <mat-icon *ngIf=\"column.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ column.icon }}</mat-icon>\n                  {{ colLabel(column) }}\n                  <span *ngIf=\"column.lazy && getLazyColumnStatus(column.key) === 'loading'\" class=\"lazy-menu-spinner\">\u21BB</span>\n                  <span *ngIf=\"column.lazy && getLazyColumnStatus(column.key) === 'error'\" class=\"lazy-menu-error\" title=\"Erreur de chargement\">\u26A0</span>\n                </button>\n              </ng-container>\n            </div>\n          </mat-menu>\n\n          <mat-menu #groupBySubMenu=\"matMenu\" [panelClass]=\"'view-submenu-panel'\">\n            <div class=\"view-submenu\" (mousedown)=\"$event.stopPropagation()\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\n              <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let col of groupByColumns\"\n                [class.active]=\"activeGroupByKey === col.key\"\n                (click)=\"onGroupByChange(activeGroupByKey === col.key ? null : col.key)\">\n                <span class=\"view-menu-check\">{{ activeGroupByKey === col.key ? '\u2713' : '' }}</span>\n                <mat-icon *ngIf=\"col.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ col.icon }}</mat-icon>\n                {{ colLabel(col) }}\n              </button>\n            </div>\n          </mat-menu>\n\n          <mat-menu #sliceBySubMenu=\"matMenu\" [panelClass]=\"'view-submenu-panel'\">\n            <div class=\"view-submenu\" (mousedown)=\"$event.stopPropagation()\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\n              <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let s of staticSlicesForMenu\"\n                (click)=\"toggleStaticSlice(s.key)\">\n                <span class=\"view-menu-check\">{{ isStaticSliceVisible(s.key) ? '\u2713' : '' }}</span>\n                <mat-icon *ngIf=\"s.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ s.icon }}</mat-icon>\n                {{ s.title }}\n              </button>\n              <ng-container *ngIf=\"allDynamicSliceColumns.length > 0\">\n                <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let col of allDynamicSliceColumns\"\n                  [class.active]=\"isDynamicSliceActive(col.key)\"\n                  (click)=\"toggleDynamicSlice(col)\">\n                  <span class=\"view-menu-check\">{{ isDynamicSliceActive(col.key) ? '\u2713' : '' }}</span>\n                  <mat-icon *ngIf=\"col.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ col.icon }}</mat-icon>\n                  {{ colLabel(col) }}\n                </button>\n              </ng-container>\n            </div>\n          </mat-menu>\n        </div>\n      </div>\n\n      <div class=\"table-body-wrapper\">\n      <div class=\"table-body-scroll\" #tableBodyScroll>\n      <table mat-table matSort [dataSource]=\"tableDataSource\" class=\"jquery-table\"\n             [trackBy]=\"trackRowFn\"\n             [matSortActive]=\"_matSortActive\" [matSortDirection]=\"_matSortDirection\">\n        <ng-container *ngFor=\"let column of visibleColumns\" [matColumnDef]=\"column.key\">\n          <th\n            mat-header-cell\n            *matHeaderCellDef\n            [mat-sort-header]=\"column.sortable !== false ? column.key : ''\"\n            [disabled]=\"column.sortable === false\"\n            [style.width]=\"column.width || null\"\n            [style.min-width]=\"column.width || null\"\n            [class.drag-enabled]=\"isColumnDragDropEnabled\"\n            [class.drop-target]=\"isHeaderDropTarget(column.key)\"\n            (dragover)=\"onHeaderDragOver(column.key, $event)\"\n            (drop)=\"onHeaderDrop(column.key, $event)\"\n          >\n            <div class=\"head-cell\">\n              <mat-icon *ngIf=\"column.icon\" class=\"head-icon\" fontSet=\"material-icons-outlined\">{{ column.icon }}</mat-icon>\n              <span class=\"head-text\" [title]=\"column.header\">{{ column.header }}</span>\n              <span\n                *ngIf=\"isColumnDragDropEnabled\"\n                class=\"drag-handle\"\n                draggable=\"true\"\n                (dragstart)=\"onHeaderDragStart(column.key, $event)\"\n                (dragend)=\"onHeaderDragEnd()\"\n                (click)=\"$event.stopPropagation()\"\n              >\n                <mat-icon>drag_indicator</mat-icon>\n              </span>\n            </div>\n          </th>\n          <td mat-cell *matCellDef=\"let row\"\n            [style.width]=\"column.width || null\"\n            [style.min-width]=\"column.width || null\">\n            <ng-container *ngIf=\"getCellTemplate(column.key) as customTpl; else defaultCellTpl\">\n              <ng-container *ngTemplateOutlet=\"customTpl; context: { $implicit: row.__raw, index: row.__index }\"></ng-container>\n            </ng-container>\n            <ng-template #defaultCellTpl>\n              <ng-container [ngSwitch]=\"column.lazy ? getLazyRenderType(row[column.key]) : 'value'\">\n                <span *ngSwitchCase=\"'loading'\" class=\"lazy-skeleton\"></span>\n                <button *ngSwitchCase=\"'error'\" type=\"button\" class=\"lazy-error-btn\" (click)=\"retryLazyColumn(column)\" title=\"Erreur de chargement \u2014 cliquer pour r\u00E9essayer\">\n                  <span class=\"lazy-error-icon\">\u26A0</span>\n                  <span class=\"lazy-error-label\">R\u00E9essayer</span>\n                </button>\n                <span *ngSwitchDefault class=\"cell-text\" [class.cell-empty]=\"isCellEmpty(row[column.key])\" [title]=\"asTitle(row[column.key])\">{{ isCellEmpty(row[column.key]) ? 'N/A' : row[column.key] }}</span>\n              </ng-container>\n            </ng-template>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"renderedColumns; sticky: true\"></tr>\n        <tr\n          mat-row\n          *matRowDef=\"let row; columns: renderedColumns; when: !isGroupHeader\"\n          [attr.tabindex]=\"hasRowClickHandler ? 0 : null\"\n          [ngClass]=\"getRowClass(row)\"\n          [class.no-pointer]=\"!hasRowClickHandler\"\n          (click)=\"onRowClick(row, $event)\"\n          (keydown.enter)=\"onRowClick(row, null)\"\n          (keydown.space)=\"onRowClick(row, null)\"\n        ></tr>\n        <ng-container matColumnDef=\"__group_row\">\n          <td mat-cell *matCellDef=\"let row\" [attr.colspan]=\"renderedColumns.length\" class=\"group-header-cell\">\n            <div class=\"group-header-label\">\n              <span class=\"group-chevron\" [class.collapsed]=\"isGroupCollapsed(row.__groupKey)\" *ngIf=\"row.__groupKey !== '__lazy_loading__' && row.__groupKey !== '__too_many_groups__'\">\u203A</span>\n              <span *ngIf=\"row.__groupKey !== '__lazy_loading__' && row.__groupKey !== '__too_many_groups__'\" class=\"group-key-label\">{{ row.__groupKey }}</span>\n              <span *ngIf=\"row.__groupKey === '__lazy_loading__'\" class=\"lazy-skeleton group-lazy-key-skeleton\"></span>\n              <span *ngIf=\"row.__groupKey === '__too_many_groups__'\" class=\"group-too-many-label\">\u26A0 Trop de groupes ({{ row.__groupCount }}) \u2014 affinez les donn\u00E9es ou choisissez une autre colonne</span>\n              <span class=\"group-count-badge\">{{ row.__groupCount }}</span>\n              <div class=\"group-pagination\" *ngIf=\"!isGroupCollapsed(row.__groupKey) && row.__groupPageCount > 1\" (click)=\"$event.stopPropagation()\">\n                <button type=\"button\" class=\"group-page-btn\" [disabled]=\"row.__groupPage === 0\" (click)=\"groupPageBack(row.__groupKey)\">\u2039</button>\n                <span class=\"group-page-info\">{{ row.__groupPage + 1 }}\u00A0/\u00A0{{ row.__groupPageCount }}</span>\n                <button type=\"button\" class=\"group-page-btn\" [disabled]=\"row.__groupPage >= row.__groupPageCount - 1\" (click)=\"groupPageForward(row.__groupKey, row.__groupCount)\">\u203A</button>\n              </div>\n            </div>\n          </td>\n        </ng-container>\n        <tr mat-row *matRowDef=\"let row; columns: ['__group_row']; when: isGroupHeader\"\n            class=\"group-header-row\"\n            [class.group-header-loading]=\"row.__groupKey === '__lazy_loading__'\"\n            [class.group-header-too-many]=\"row.__groupKey === '__too_many_groups__'\"\n            [attr.data-group-key]=\"row.__groupKey\"\n            (click)=\"row.__groupKey !== '__lazy_loading__' && row.__groupKey !== '__too_many_groups__' && toggleGroupCollapse(row.__groupKey)\"></tr>\n        <tr class=\"mat-mdc-row no-data-row\" *matNoDataRow>\n          <td class=\"mat-mdc-cell no-data-cell\" [attr.colspan]=\"renderedColumns.length\"></td>\n        </tr>\n      </table>\n      </div><!-- /table-body-scroll -->\n      <div class=\"table-body-overlay\" *ngIf=\"effectiveIsLoading || isEmpty\">\n        <span class=\"table-body-overlay-text\">{{ effectiveIsLoading ? loadingStateLabel : emptyStateLabel }}</span>\n      </div>\n      </div><!-- /table-body-wrapper -->\n\n      <div class=\"bottom-bar\" *ngIf=\"showPagination\">\n        <mat-paginator\n          [length]=\"totalRows\"\n          [pageSize]=\"pageSize\"\n          [pageSizeOptions]=\"pageSizeOptions\"\n        ></mat-paginator>\n      </div>\n\n      <div class=\"group-bottom-bar\" *ngIf=\"activeGroupByKey\">\n        <div class=\"group-bottom-bar-container\">\n          <div class=\"group-bottom-bar-left\">\n            <button type=\"button\" class=\"group-reset-btn\" (click)=\"onGroupByChange(null)\">\n              <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"group-reset-icon\">\n                <path d=\"M3 8a5 5 0 1 0 5-5 5 5 0 0 0-3.54 1.46L3 3\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                <path d=\"M3 3v2.5H5.5\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n              </svg>\n              Retirer le groupe\n            </button>\n            <div class=\"group-bar-separator\"></div>\n            <div class=\"group-sort-controls\">\n              <span class=\"group-sort-label\">Trier :</span>\n              <button type=\"button\" class=\"group-sort-btn\" [class.active]=\"groupSortOrder === 'asc'\" (click)=\"onGroupSortToggle('asc')\" title=\"A \u2192 Z\">\n                <mat-icon>arrow_upward</mat-icon>\n              </button>\n              <button type=\"button\" class=\"group-sort-btn\" [class.active]=\"groupSortOrder === 'desc'\" (click)=\"onGroupSortToggle('desc')\" title=\"Z \u2192 A\">\n                <mat-icon>arrow_downward</mat-icon>\n              </button>\n            </div>\n          </div>\n          <div class=\"mat-mdc-paginator-page-size\">\n            <div class=\"mat-mdc-paginator-page-size-label\">Lignes par groupe :</div>\n            <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" class=\"mat-mdc-paginator-page-size-select\">\n              <mat-select\n                [(ngModel)]=\"groupPageSize\"\n                (ngModelChange)=\"onGroupPageSizeChange($event)\"\n                panelClass=\"mat-mdc-paginator-select-page-size group-page-size-panel\"\n                [panelWidth]=\"'auto'\"\n              >\n                <mat-select-trigger>{{ groupPageSize === 0 ? 'Toutes' : groupPageSize }}</mat-select-trigger>\n                <mat-option *ngFor=\"let opt of pageSizeOptionsGroupBy\" [value]=\"opt\">{{ opt }}</mat-option>\n                <mat-option [value]=\"0\">Toutes</mat-option>\n              </mat-select>\n            </mat-form-field>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</section>\n", styles: [":host{display:block;max-height:100%;min-height:inherit;--jqt-title-color: #1f2937;--jqt-text-color: #111827;--jqt-text-secondary: #6b7280;--jqt-text-muted: #9ca3af;--jqt-surface-color: #ffffff;--jqt-surface-alt-color: #f9fafb;--jqt-row-hover-bg: #f3f4f6;--jqt-border-color: #e5e7eb;--jqt-group-bg: #eef2f7;--jqt-group-bg-hover: #e4ecf4;--jqt-group-accent: #94a3b8;--jqt-group-border: #d1d9e4;--jqt-primary-color: #1d4ed8;--jqt-danger-color: #dc2626;--jqt-danger-hover-bg: #fef2f2;--jqt-danger-border: #fca5a5;--jqt-header-bg: #f5f5f5;--jqt-header-text-color: #374151;--jqt-cell-bg: #ffffff;--jqt-footer-bg: #f5f5f5;--jqt-footer-text-color: #374151;--jqt-footer-icon-color: #374151}.jquery-table-wrapper{display:flex;flex-direction:column;width:100%;height:100%;min-height:inherit;padding:2px 2px 0;box-sizing:border-box}.table-header{display:flex;align-items:center;justify-content:flex-start;gap:8px;margin-bottom:12px}.table-header h3{margin:0;font-size:20px;font-weight:600;color:var(--jqt-title-color)}.table-layout{display:grid;grid-template-columns:minmax(155px,190px) minmax(0,1fr);gap:12px;align-items:stretch;min-height:inherit;height:100%}.table-layout.no-slice{grid-template-columns:minmax(0,1fr)}.table-layout.slice-collapsed{grid-template-columns:40px minmax(0,1fr)}.table-shell{display:flex;flex-direction:column;flex:1 1 0;min-height:0;min-width:0;width:100%;max-width:100%}.table-body-wrapper{position:relative;flex:1 1 0;min-height:0;display:flex;flex-direction:column}.table-body-scroll{flex:1 1 0;overflow-y:auto;min-height:0;border-top:1px solid var(--jqt-border-color);border-right:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);border-radius:8px 8px 0 0;scrollbar-width:thin;scrollbar-color:var(--jqt-border-color) transparent}.table-body-scroll::-webkit-scrollbar{width:6px}.table-body-scroll::-webkit-scrollbar-thumb{background:var(--jqt-border-color);border-radius:4px}.table-body-overlay{position:absolute;top:var(--actual-header-height, 56px);left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;justify-content:center;background:var(--jqt-surface-color);border-right:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);pointer-events:none}.table-body-overlay-text{font-size:14px;color:var(--jqt-text-secondary)}.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 0 8px}.table-toolbar-left{flex:1 1 auto;min-width:0}.table-toolbar-right{flex:0 0 auto}.search-input-wrapper{position:relative;display:inline-flex;align-items:center;width:100%;height:34px;border:1px solid var(--jqt-border-color);border-radius:8px;background:var(--jqt-surface-color);padding:0 8px;box-sizing:border-box;gap:6px}.search-input-wrapper:focus-within{border-color:var(--jqt-text-muted)}.search-input-wrapper .search-icon{flex-shrink:0;width:14px;height:14px;color:var(--jqt-text-muted)}.search-input{flex:1;border:none;outline:none;font-size:13px;color:var(--jqt-text-color);background:transparent;padding:7px 0;min-width:0}.search-input::placeholder{color:var(--jqt-text-muted)}.search-count{flex-shrink:0;font-size:12px;font-weight:600;color:var(--jqt-text-secondary);background:var(--jqt-row-hover-bg);border-radius:10px;padding:1px 7px;min-width:20px;text-align:center;line-height:18px}.search-clear-btn{background:none;border:none;cursor:pointer;color:var(--jqt-text-muted);font-size:16px;padding:0;line-height:1;flex-shrink:0}.search-clear-btn:hover{color:var(--jqt-text-color)}.view-btn{display:inline-flex;align-items:center;gap:5px;height:34px;border:1px solid var(--jqt-border-color);border-radius:8px;background:var(--jqt-surface-color);padding:0 12px;font-size:13px;font-weight:500;color:var(--jqt-text-color);cursor:pointer;white-space:nowrap;box-sizing:border-box}.view-btn:hover{border-color:var(--jqt-text-muted)}.view-btn-icon{font-size:16px;width:16px;height:16px;line-height:1;flex-shrink:0}.group-header-row{cursor:pointer}:host ::ng-deep .jquery-table{border-spacing:0}:host ::ng-deep .group-header-row td{padding:0!important;background:var(--jqt-group-bg);border-bottom:1px solid var(--jqt-group-border);border-top:1px solid var(--jqt-group-border);border-left:3px solid var(--jqt-group-accent);position:sticky;top:var(--actual-header-height, 56px);z-index:2;box-shadow:-4px 0 0 0 var(--jqt-group-bg)}:host ::ng-deep .group-header-row:hover td{background:var(--jqt-group-bg-hover);box-shadow:-4px 0 0 0 var(--jqt-group-bg-hover)}:host ::ng-deep .group-header-loading td,:host ::ng-deep .group-header-loading:hover td,:host ::ng-deep .group-header-too-many td,:host ::ng-deep .group-header-too-many:hover td{cursor:default;background:var(--jqt-surface-alt-color)}.group-too-many-label{font-size:12px;font-weight:500;color:var(--jqt-warn-color, #b45309);font-style:italic}.group-header-cell{padding:0!important}.group-header-label{display:flex;align-items:center;gap:6px;padding:6px 16px;font-size:12px;font-weight:700;color:var(--jqt-text-color);text-transform:uppercase;letter-spacing:.04em}.group-key-label{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-count-badge{flex-shrink:0;font-size:11px;line-height:1;font-weight:600;color:#fff;background:var(--jqt-text-secondary, #6b7280);border-radius:10px;padding:3px 7px;min-width:20px;text-align:center;text-transform:none;letter-spacing:0}.group-pagination{display:inline-flex;align-items:center;gap:4px;flex-shrink:0;margin-left:auto}.group-page-btn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border:1px solid var(--jqt-border-color);border-radius:5px;background:var(--jqt-surface-color);cursor:pointer;font-size:14px;color:var(--jqt-text-color);line-height:1;padding:0 0 3px;text-transform:none;letter-spacing:0}.group-page-btn:hover:not(:disabled){border-color:var(--jqt-text-muted);background:var(--jqt-surface-alt-color)}.group-page-btn:disabled{opacity:.35;cursor:default}.group-page-info{font-size:11px;color:var(--jqt-text-secondary);min-width:36px;text-align:center;font-weight:500;text-transform:none;letter-spacing:0}.group-chevron{flex-shrink:0;font-size:14px;font-weight:700;padding-bottom:3px;transition:transform .15s ease;transform:rotate(90deg)}.group-chevron.collapsed{transform:rotate(0)}.no-data-row{cursor:default!important}.no-data-cell{padding:0!important;height:0!important;border:none!important}.jquery-table{width:100%;table-layout:fixed}:host ::ng-deep .mat-mdc-table{width:100%;background:transparent}:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mat-mdc-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .mat-mdc-header-row{background:var(--jqt-header-bg)}:host ::ng-deep .mat-mdc-header-cell{background:var(--jqt-header-bg);color:var(--jqt-header-text-color)}:host ::ng-deep .mat-mdc-row,:host ::ng-deep .mat-mdc-cell{background:var(--jqt-cell-bg)}:host ::ng-deep .mat-mdc-row{cursor:pointer;border-bottom-color:var(--jqt-border-color)}:host ::ng-deep .mat-mdc-row.no-pointer{cursor:auto}:host ::ng-deep .mat-mdc-row.no-data-row{cursor:default}:host ::ng-deep .mat-mdc-header-cell.drag-enabled{-webkit-user-select:none;user-select:none}:host ::ng-deep .mat-mdc-header-cell.drag-enabled:active{cursor:default}:host ::ng-deep .mat-mdc-header-cell.drop-target{background:var(--jqt-row-hover-bg)}.head-cell{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}.drag-handle{display:inline-flex;align-items:center;cursor:grab;color:var(--jqt-border-color);flex-shrink:0;padding:0 2px;border-radius:4px;line-height:1}.drag-handle:active{cursor:grabbing}.drag-handle:hover{color:var(--jqt-text-muted)}.drag-handle mat-icon{font-size:16px;width:16px;height:16px;line-height:1}.head-icon{font-size:14px;width:14px;height:14px;line-height:1;flex-shrink:0;color:var(--jqt-text-muted)}.head-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase;font-size:11px;font-weight:600;letter-spacing:.05em}.head-actions{display:inline-flex;align-items:center;gap:6px}.cell-text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cell-empty{color:var(--jqt-empty-cell-color, #9ca3af);font-style:italic}.bottom-bar{display:flex;align-items:center;flex:0 0 auto;background:var(--jqt-footer-bg);border-top:1px solid var(--jqt-border-color);border-right:1px solid var(--jqt-border-color);border-bottom:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);border-radius:0 0 8px 8px}:host ::ng-deep .bottom-bar mat-paginator{flex:1 1 auto;background:transparent;color:var(--jqt-footer-text-color)}:host ::ng-deep .bottom-bar .mat-mdc-paginator-outer-container{display:flex}:host ::ng-deep .bottom-bar .mat-mdc-paginator-container{display:flex;align-items:center;flex-wrap:nowrap;min-height:0;height:var(--actual-header-height, 56px);padding:0 8px;box-sizing:border-box}:host ::ng-deep .bottom-bar .mat-mdc-paginator-range-label,:host ::ng-deep .bottom-bar .mat-mdc-paginator-page-size-label{font-size:12px;color:var(--jqt-footer-text-color)}:host ::ng-deep .bottom-bar .mat-mdc-icon-button{color:var(--jqt-footer-icon-color);width:28px;height:28px;padding:0;line-height:1;display:inline-flex;align-items:center;justify-content:center;--mdc-icon-button-state-layer-size: 28px}:host ::ng-deep .bottom-bar .mat-mdc-icon-button .mat-mdc-button-persistent-ripple,:host ::ng-deep .bottom-bar .mat-mdc-icon-button .mdc-icon-button__state-layer{width:28px;height:28px;top:50%;left:50%;transform:translate(-50%,-50%)}:host ::ng-deep .bottom-bar .mat-mdc-icon-button .mat-icon{font-size:18px;width:18px;height:18px;line-height:18px}:host ::ng-deep .bottom-bar .mat-mdc-icon-button:disabled{opacity:.35}:host ::ng-deep .bottom-bar .mat-mdc-paginator-page-size-select{width:72px;font-size:12px}:host ::ng-deep .bottom-bar .mat-mdc-text-field-wrapper{padding:0 8px}:host ::ng-deep .bottom-bar .mdc-text-field--outlined{height:28px}:host ::ng-deep .bottom-bar .mat-mdc-form-field-infix{padding-top:0;padding-bottom:0;min-height:0;height:28px;display:flex;align-items:center}:host ::ng-deep .bottom-bar .mat-mdc-select-value-text{font-size:12px;color:var(--jqt-text-color)}:host ::ng-deep .bottom-bar .mdc-notched-outline__leading,:host ::ng-deep .bottom-bar .mdc-notched-outline__notch,:host ::ng-deep .bottom-bar .mdc-notched-outline__trailing{border-color:var(--jqt-border-color)}.group-bottom-bar{display:flex;align-items:center;flex:0 0 auto;background:var(--jqt-footer-bg);border-top:1px solid var(--jqt-border-color);border-right:1px solid var(--jqt-border-color);border-bottom:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);border-radius:0 0 8px 8px}.group-bottom-bar-container{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;height:var(--actual-header-height, 56px);padding:0 16px;gap:16px;width:100%;box-sizing:border-box}.group-bar-separator{width:1px;height:20px;background:#9ca3af;flex-shrink:0;margin:0 4px}.group-bottom-bar-left{display:flex;align-items:center;gap:8px;flex-shrink:0}.group-sort-controls{display:flex;align-items:center;gap:2px}.group-sort-label{font-size:12px;color:var(--jqt-footer-text-color);white-space:nowrap;margin-right:2px}.group-sort-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--jqt-footer-icon-color);cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}.group-sort-btn mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.group-sort-btn:hover{background:#0000000a}.group-sort-btn.active{color:var(--jqt-primary-color, #1976d2);border-color:var(--jqt-primary-color, #1976d2);background:#1976d214}:host ::ng-deep .group-bottom-bar .mat-mdc-paginator-page-size{display:flex;align-items:center;gap:8px}:host ::ng-deep .group-bottom-bar .mat-mdc-paginator-page-size-label{font-size:12px;color:var(--jqt-footer-text-color);white-space:nowrap}:host ::ng-deep .group-bottom-bar .mat-mdc-paginator-page-size-select{width:72px;font-size:12px}:host ::ng-deep .group-bottom-bar .mat-mdc-text-field-wrapper{padding:0 8px}:host ::ng-deep .group-bottom-bar .mdc-text-field--outlined{height:28px}:host ::ng-deep .group-bottom-bar .mat-mdc-form-field-infix{padding-top:0;padding-bottom:0;min-height:0;height:28px;display:flex;align-items:center}:host ::ng-deep .group-bottom-bar .mat-mdc-select-value-text{font-size:12px;color:var(--jqt-text-color)}:host ::ng-deep .group-bottom-bar .mdc-notched-outline__leading,:host ::ng-deep .group-bottom-bar .mdc-notched-outline__notch,:host ::ng-deep .group-bottom-bar .mdc-notched-outline__trailing{border-color:var(--jqt-border-color)}:host ::ng-deep .group-bottom-bar .mat-mdc-select-arrow{color:var(--jqt-footer-text-color)}.group-reset-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--jqt-border-color);border-radius:8px;background:var(--jqt-surface-color);color:var(--jqt-text-secondary);font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease;white-space:nowrap;flex-shrink:0}.group-reset-btn:hover{background:var(--jqt-danger-hover-bg);color:var(--jqt-danger-color);border-color:var(--jqt-danger-border)}.group-reset-icon{width:14px;height:14px;flex-shrink:0}::ng-deep .mat-mdc-paginator-select-page-size .mat-pseudo-checkbox{display:none!important}::ng-deep .group-page-size-panel{min-width:90px!important}::ng-deep .group-page-size-panel .mat-mdc-option{justify-content:center;min-height:40px}::ng-deep .group-page-size-panel .mdc-list-item__primary-text{text-align:center;width:100%}@media (max-width: 960px){.table-layout{grid-template-columns:1fr}}::ng-deep .view-menu-panel .mat-mdc-menu-panel{min-width:220px!important;overflow:visible!important}::ng-deep .view-menu-panel .mat-mdc-menu-content{padding:4px 0!important}::ng-deep .view-submenu-panel .mat-mdc-menu-panel{min-width:200px!important}::ng-deep .view-submenu-panel .mat-mdc-menu-content{padding:0!important}::ng-deep .view-menu-panel .view-menu-sub-trigger.mat-mdc-menu-item{min-height:42px;padding:0 14px;display:flex;align-items:center;box-sizing:border-box}::ng-deep .view-menu-panel .view-menu-sub-trigger .mdc-list-item__primary-text{display:flex;align-items:center;width:100%;gap:0;overflow:hidden}::ng-deep .view-menu-sub-label{font-size:13px;font-weight:500;color:var(--jqt-text-color);flex:0 0 auto;white-space:nowrap;padding-right:8px}::ng-deep .view-menu-sub-value{font-size:12px;color:var(--jqt-text-secondary);flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}::ng-deep .view-submenu{padding:4px 6px;min-width:180px;box-sizing:border-box}::ng-deep .view-submenu .view-menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:7px 8px;border:none;background:transparent;border-radius:6px;font-size:13px;color:var(--jqt-text-color);cursor:pointer;text-align:left;box-sizing:border-box;white-space:nowrap}::ng-deep .view-submenu .view-menu-item:hover{background:var(--jqt-row-hover-bg)}::ng-deep .view-submenu .view-menu-item.active{font-weight:600}::ng-deep .view-submenu .view-menu-item:disabled{opacity:.4;cursor:default}::ng-deep .view-menu-col-icon{flex-shrink:0;font-size:14px!important;width:14px!important;height:14px!important;color:var(--jqt-text-muted)}::ng-deep .view-menu-check{flex-shrink:0;width:16px;text-align:center;font-size:12px;color:var(--jqt-text-color)}::ng-deep .view-menu-separator{border:none;border-top:1px solid var(--jqt-border-color);margin:4px 0}.lazy-skeleton{display:block;height:12px;width:70%;border-radius:4px;background:linear-gradient(90deg,var(--jqt-border-color) 25%,var(--jqt-surface-alt-color) 50%,var(--jqt-border-color) 75%);background-size:200% 100%;animation:lazy-shimmer 1.4s ease-in-out infinite}.group-lazy-key-skeleton{flex:1 1 auto;min-width:80px;height:13px;border-radius:4px}@keyframes lazy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.lazy-error-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:1px solid #fca5a5;border-radius:4px;padding:2px 6px;cursor:pointer;color:#ef4444;font-size:12px;opacity:.85;transition:opacity .15s}.lazy-error-btn:hover{opacity:1;background:#fef2f2}.lazy-error-icon{font-size:12px}.lazy-error-label{font-size:11px;font-weight:500}::ng-deep .lazy-menu-spinner{display:inline-block;margin-left:auto;font-size:13px;color:var(--jqt-text-secondary);animation:lazy-spin 1s linear infinite}::ng-deep .lazy-menu-error{display:inline-block;margin-left:auto;font-size:13px;color:#ef4444}@keyframes lazy-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i3.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i4.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i5.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i5.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i9.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "panelWidth", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "directive", type: i9.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i10.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: SlicePanelComponent, selector: "slice-panel", inputs: ["sliceConfigs", "columns", "data", "lazyData", "lazyStatus", "showToggle", "showCounts", "collapsedByDefault", "alwaysShow"], outputs: ["filterChange", "activeKeysChange", "dynamicSliceKeysChange", "collapsedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'jquery-table', imports: [CommonModule, FormsModule, MatTableModule, MatButtonModule, MatPaginatorModule, MatSortModule, MatMenuModule, MatIconModule, MatSelectModule, SlicePanelComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MatPaginatorIntl, useFactory: getFrenchPaginatorIntl }], template: "<section class=\"jquery-table-wrapper\">\n  <header class=\"table-header\" *ngIf=\"showTitle\">\n    <h3>{{ title }}</h3>\n  </header>\n\n  <div\n    class=\"table-layout\"\n    [class.slice-collapsed]=\"showSlicePanel && (slicePanelRef?.isCollapsed ?? false)\"\n    [class.no-slice]=\"!showSlicePanel\"\n  >\n    <slice-panel\n      [style.display]=\"showSlicePanel ? null : 'none'\"\n      [sliceConfigs]=\"_sliceConfigs\"\n      [columns]=\"_sliceColumns\"\n      [data]=\"_sliceData\"\n      [lazyData]=\"_lazyColumnData\"\n      [lazyStatus]=\"_lazyColumnStatus\"\n      [showToggle]=\"_sliceShowToggle\"\n      (filterChange)=\"onSliceFilterChange($event)\"\n      (dynamicSliceKeysChange)=\"onDynamicSliceKeysChange($event)\"\n    ></slice-panel>\n\n    <div class=\"table-shell\">\n      <div class=\"table-toolbar\" *ngIf=\"showToolbar\">\n        <div class=\"table-toolbar-left\">\n          <div *ngIf=\"showSearchBar\" class=\"search-input-wrapper\">\n            <svg class=\"search-icon\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <circle cx=\"8.5\" cy=\"8.5\" r=\"5.5\" stroke=\"currentColor\" stroke-width=\"1.5\"/>\n              <path d=\"M13 13L17 17\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"/>\n            </svg>\n            <input\n              class=\"search-input\"\n              type=\"text\"\n              [(ngModel)]=\"searchQuery\"\n              (ngModelChange)=\"onSearchChange()\"\n              placeholder=\"Rechercher...\"\n              autocomplete=\"off\"\n            />\n            <button *ngIf=\"searchQuery\" type=\"button\" class=\"search-clear-btn\" (click)=\"searchQuery = ''; onSearchChange()\">\u00D7</button>\n            <span class=\"search-count\">{{ filteredRowCount }}</span>\n          </div>\n        </div>\n        <div *ngIf=\"showViewButton\" class=\"table-toolbar-right\">\n          <button type=\"button\" class=\"view-btn\" [matMenuTriggerFor]=\"viewMenu\" #viewMenuTrigger=\"matMenuTrigger\">\n            <mat-icon class=\"view-btn-icon\">settings</mat-icon>\n            View\n          </button>\n\n          <mat-menu #viewMenu=\"matMenu\" [panelClass]=\"'view-menu-panel'\">\n            <button *ngIf=\"showFields\" mat-menu-item [matMenuTriggerFor]=\"fieldsSubMenu\" class=\"view-menu-sub-trigger\">\n              <span class=\"view-menu-sub-label\">Champs</span>\n              <span class=\"view-menu-sub-value\">{{ visibleColumns.length }}/{{ totalColumnCount }}</span>\n            </button>\n            <button *ngIf=\"showGroupBySection\" mat-menu-item [matMenuTriggerFor]=\"groupBySubMenu\" class=\"view-menu-sub-trigger\">\n              <span class=\"view-menu-sub-label\">Group by</span>\n              <span class=\"view-menu-sub-value\">{{ activeGroupByLabel }}</span>\n            </button>\n            <button *ngIf=\"showAddSliceButton\" mat-menu-item [matMenuTriggerFor]=\"sliceBySubMenu\" class=\"view-menu-sub-trigger\">\n              <span class=\"view-menu-sub-label\">Slice by</span>\n              <span class=\"view-menu-sub-value\">{{ activeSliceByLabel }}</span>\n            </button>\n          </mat-menu>\n\n          <mat-menu #fieldsSubMenu=\"matMenu\" [panelClass]=\"'view-submenu-panel'\">\n            <div class=\"view-submenu\" (mousedown)=\"$event.stopPropagation()\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\n              <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let column of menuBaseColumns\"\n                [disabled]=\"!column.optional && !allowColumnRemoval\"\n                (click)=\"onColumnVisibilityChange(column, !isColumnVisible(column.key))\">\n                <span class=\"view-menu-check\">{{ isColumnVisible(column.key) ? '\u2713' : '' }}</span>\n                <mat-icon *ngIf=\"column.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ column.icon }}</mat-icon>\n                {{ colLabel(column) }}\n              </button>\n              <ng-container *ngIf=\"menuOptionalColumns.length > 0\">\n                <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let column of menuOptionalColumns\"\n                  [disabled]=\"(isColumnVisible(column.key) && visibleColumns.length === 1) || getLazyColumnStatus(column.key) === 'loading'\"\n                  (click)=\"onColumnVisibilityChange(column, !isColumnVisible(column.key))\">\n                  <span class=\"view-menu-check\">{{ isColumnVisible(column.key) ? '\u2713' : '' }}</span>\n                  <mat-icon *ngIf=\"column.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ column.icon }}</mat-icon>\n                  {{ colLabel(column) }}\n                  <span *ngIf=\"column.lazy && getLazyColumnStatus(column.key) === 'loading'\" class=\"lazy-menu-spinner\">\u21BB</span>\n                  <span *ngIf=\"column.lazy && getLazyColumnStatus(column.key) === 'error'\" class=\"lazy-menu-error\" title=\"Erreur de chargement\">\u26A0</span>\n                </button>\n              </ng-container>\n            </div>\n          </mat-menu>\n\n          <mat-menu #groupBySubMenu=\"matMenu\" [panelClass]=\"'view-submenu-panel'\">\n            <div class=\"view-submenu\" (mousedown)=\"$event.stopPropagation()\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\n              <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let col of groupByColumns\"\n                [class.active]=\"activeGroupByKey === col.key\"\n                (click)=\"onGroupByChange(activeGroupByKey === col.key ? null : col.key)\">\n                <span class=\"view-menu-check\">{{ activeGroupByKey === col.key ? '\u2713' : '' }}</span>\n                <mat-icon *ngIf=\"col.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ col.icon }}</mat-icon>\n                {{ colLabel(col) }}\n              </button>\n            </div>\n          </mat-menu>\n\n          <mat-menu #sliceBySubMenu=\"matMenu\" [panelClass]=\"'view-submenu-panel'\">\n            <div class=\"view-submenu\" (mousedown)=\"$event.stopPropagation()\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\n              <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let s of staticSlicesForMenu\"\n                (click)=\"toggleStaticSlice(s.key)\">\n                <span class=\"view-menu-check\">{{ isStaticSliceVisible(s.key) ? '\u2713' : '' }}</span>\n                <mat-icon *ngIf=\"s.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ s.icon }}</mat-icon>\n                {{ s.title }}\n              </button>\n              <ng-container *ngIf=\"allDynamicSliceColumns.length > 0\">\n                <button type=\"button\" class=\"view-menu-item\" *ngFor=\"let col of allDynamicSliceColumns\"\n                  [class.active]=\"isDynamicSliceActive(col.key)\"\n                  (click)=\"toggleDynamicSlice(col)\">\n                  <span class=\"view-menu-check\">{{ isDynamicSliceActive(col.key) ? '\u2713' : '' }}</span>\n                  <mat-icon *ngIf=\"col.icon\" class=\"view-menu-col-icon\" fontSet=\"material-icons-outlined\">{{ col.icon }}</mat-icon>\n                  {{ colLabel(col) }}\n                </button>\n              </ng-container>\n            </div>\n          </mat-menu>\n        </div>\n      </div>\n\n      <div class=\"table-body-wrapper\">\n      <div class=\"table-body-scroll\" #tableBodyScroll>\n      <table mat-table matSort [dataSource]=\"tableDataSource\" class=\"jquery-table\"\n             [trackBy]=\"trackRowFn\"\n             [matSortActive]=\"_matSortActive\" [matSortDirection]=\"_matSortDirection\">\n        <ng-container *ngFor=\"let column of visibleColumns\" [matColumnDef]=\"column.key\">\n          <th\n            mat-header-cell\n            *matHeaderCellDef\n            [mat-sort-header]=\"column.sortable !== false ? column.key : ''\"\n            [disabled]=\"column.sortable === false\"\n            [style.width]=\"column.width || null\"\n            [style.min-width]=\"column.width || null\"\n            [class.drag-enabled]=\"isColumnDragDropEnabled\"\n            [class.drop-target]=\"isHeaderDropTarget(column.key)\"\n            (dragover)=\"onHeaderDragOver(column.key, $event)\"\n            (drop)=\"onHeaderDrop(column.key, $event)\"\n          >\n            <div class=\"head-cell\">\n              <mat-icon *ngIf=\"column.icon\" class=\"head-icon\" fontSet=\"material-icons-outlined\">{{ column.icon }}</mat-icon>\n              <span class=\"head-text\" [title]=\"column.header\">{{ column.header }}</span>\n              <span\n                *ngIf=\"isColumnDragDropEnabled\"\n                class=\"drag-handle\"\n                draggable=\"true\"\n                (dragstart)=\"onHeaderDragStart(column.key, $event)\"\n                (dragend)=\"onHeaderDragEnd()\"\n                (click)=\"$event.stopPropagation()\"\n              >\n                <mat-icon>drag_indicator</mat-icon>\n              </span>\n            </div>\n          </th>\n          <td mat-cell *matCellDef=\"let row\"\n            [style.width]=\"column.width || null\"\n            [style.min-width]=\"column.width || null\">\n            <ng-container *ngIf=\"getCellTemplate(column.key) as customTpl; else defaultCellTpl\">\n              <ng-container *ngTemplateOutlet=\"customTpl; context: { $implicit: row.__raw, index: row.__index }\"></ng-container>\n            </ng-container>\n            <ng-template #defaultCellTpl>\n              <ng-container [ngSwitch]=\"column.lazy ? getLazyRenderType(row[column.key]) : 'value'\">\n                <span *ngSwitchCase=\"'loading'\" class=\"lazy-skeleton\"></span>\n                <button *ngSwitchCase=\"'error'\" type=\"button\" class=\"lazy-error-btn\" (click)=\"retryLazyColumn(column)\" title=\"Erreur de chargement \u2014 cliquer pour r\u00E9essayer\">\n                  <span class=\"lazy-error-icon\">\u26A0</span>\n                  <span class=\"lazy-error-label\">R\u00E9essayer</span>\n                </button>\n                <span *ngSwitchDefault class=\"cell-text\" [class.cell-empty]=\"isCellEmpty(row[column.key])\" [title]=\"asTitle(row[column.key])\">{{ isCellEmpty(row[column.key]) ? 'N/A' : row[column.key] }}</span>\n              </ng-container>\n            </ng-template>\n          </td>\n        </ng-container>\n\n        <tr mat-header-row *matHeaderRowDef=\"renderedColumns; sticky: true\"></tr>\n        <tr\n          mat-row\n          *matRowDef=\"let row; columns: renderedColumns; when: !isGroupHeader\"\n          [attr.tabindex]=\"hasRowClickHandler ? 0 : null\"\n          [ngClass]=\"getRowClass(row)\"\n          [class.no-pointer]=\"!hasRowClickHandler\"\n          (click)=\"onRowClick(row, $event)\"\n          (keydown.enter)=\"onRowClick(row, null)\"\n          (keydown.space)=\"onRowClick(row, null)\"\n        ></tr>\n        <ng-container matColumnDef=\"__group_row\">\n          <td mat-cell *matCellDef=\"let row\" [attr.colspan]=\"renderedColumns.length\" class=\"group-header-cell\">\n            <div class=\"group-header-label\">\n              <span class=\"group-chevron\" [class.collapsed]=\"isGroupCollapsed(row.__groupKey)\" *ngIf=\"row.__groupKey !== '__lazy_loading__' && row.__groupKey !== '__too_many_groups__'\">\u203A</span>\n              <span *ngIf=\"row.__groupKey !== '__lazy_loading__' && row.__groupKey !== '__too_many_groups__'\" class=\"group-key-label\">{{ row.__groupKey }}</span>\n              <span *ngIf=\"row.__groupKey === '__lazy_loading__'\" class=\"lazy-skeleton group-lazy-key-skeleton\"></span>\n              <span *ngIf=\"row.__groupKey === '__too_many_groups__'\" class=\"group-too-many-label\">\u26A0 Trop de groupes ({{ row.__groupCount }}) \u2014 affinez les donn\u00E9es ou choisissez une autre colonne</span>\n              <span class=\"group-count-badge\">{{ row.__groupCount }}</span>\n              <div class=\"group-pagination\" *ngIf=\"!isGroupCollapsed(row.__groupKey) && row.__groupPageCount > 1\" (click)=\"$event.stopPropagation()\">\n                <button type=\"button\" class=\"group-page-btn\" [disabled]=\"row.__groupPage === 0\" (click)=\"groupPageBack(row.__groupKey)\">\u2039</button>\n                <span class=\"group-page-info\">{{ row.__groupPage + 1 }}\u00A0/\u00A0{{ row.__groupPageCount }}</span>\n                <button type=\"button\" class=\"group-page-btn\" [disabled]=\"row.__groupPage >= row.__groupPageCount - 1\" (click)=\"groupPageForward(row.__groupKey, row.__groupCount)\">\u203A</button>\n              </div>\n            </div>\n          </td>\n        </ng-container>\n        <tr mat-row *matRowDef=\"let row; columns: ['__group_row']; when: isGroupHeader\"\n            class=\"group-header-row\"\n            [class.group-header-loading]=\"row.__groupKey === '__lazy_loading__'\"\n            [class.group-header-too-many]=\"row.__groupKey === '__too_many_groups__'\"\n            [attr.data-group-key]=\"row.__groupKey\"\n            (click)=\"row.__groupKey !== '__lazy_loading__' && row.__groupKey !== '__too_many_groups__' && toggleGroupCollapse(row.__groupKey)\"></tr>\n        <tr class=\"mat-mdc-row no-data-row\" *matNoDataRow>\n          <td class=\"mat-mdc-cell no-data-cell\" [attr.colspan]=\"renderedColumns.length\"></td>\n        </tr>\n      </table>\n      </div><!-- /table-body-scroll -->\n      <div class=\"table-body-overlay\" *ngIf=\"effectiveIsLoading || isEmpty\">\n        <span class=\"table-body-overlay-text\">{{ effectiveIsLoading ? loadingStateLabel : emptyStateLabel }}</span>\n      </div>\n      </div><!-- /table-body-wrapper -->\n\n      <div class=\"bottom-bar\" *ngIf=\"showPagination\">\n        <mat-paginator\n          [length]=\"totalRows\"\n          [pageSize]=\"pageSize\"\n          [pageSizeOptions]=\"pageSizeOptions\"\n        ></mat-paginator>\n      </div>\n\n      <div class=\"group-bottom-bar\" *ngIf=\"activeGroupByKey\">\n        <div class=\"group-bottom-bar-container\">\n          <div class=\"group-bottom-bar-left\">\n            <button type=\"button\" class=\"group-reset-btn\" (click)=\"onGroupByChange(null)\">\n              <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"group-reset-icon\">\n                <path d=\"M3 8a5 5 0 1 0 5-5 5 5 0 0 0-3.54 1.46L3 3\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n                <path d=\"M3 3v2.5H5.5\" stroke=\"currentColor\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n              </svg>\n              Retirer le groupe\n            </button>\n            <div class=\"group-bar-separator\"></div>\n            <div class=\"group-sort-controls\">\n              <span class=\"group-sort-label\">Trier :</span>\n              <button type=\"button\" class=\"group-sort-btn\" [class.active]=\"groupSortOrder === 'asc'\" (click)=\"onGroupSortToggle('asc')\" title=\"A \u2192 Z\">\n                <mat-icon>arrow_upward</mat-icon>\n              </button>\n              <button type=\"button\" class=\"group-sort-btn\" [class.active]=\"groupSortOrder === 'desc'\" (click)=\"onGroupSortToggle('desc')\" title=\"Z \u2192 A\">\n                <mat-icon>arrow_downward</mat-icon>\n              </button>\n            </div>\n          </div>\n          <div class=\"mat-mdc-paginator-page-size\">\n            <div class=\"mat-mdc-paginator-page-size-label\">Lignes par groupe :</div>\n            <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" class=\"mat-mdc-paginator-page-size-select\">\n              <mat-select\n                [(ngModel)]=\"groupPageSize\"\n                (ngModelChange)=\"onGroupPageSizeChange($event)\"\n                panelClass=\"mat-mdc-paginator-select-page-size group-page-size-panel\"\n                [panelWidth]=\"'auto'\"\n              >\n                <mat-select-trigger>{{ groupPageSize === 0 ? 'Toutes' : groupPageSize }}</mat-select-trigger>\n                <mat-option *ngFor=\"let opt of pageSizeOptionsGroupBy\" [value]=\"opt\">{{ opt }}</mat-option>\n                <mat-option [value]=\"0\">Toutes</mat-option>\n              </mat-select>\n            </mat-form-field>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</section>\n", styles: [":host{display:block;max-height:100%;min-height:inherit;--jqt-title-color: #1f2937;--jqt-text-color: #111827;--jqt-text-secondary: #6b7280;--jqt-text-muted: #9ca3af;--jqt-surface-color: #ffffff;--jqt-surface-alt-color: #f9fafb;--jqt-row-hover-bg: #f3f4f6;--jqt-border-color: #e5e7eb;--jqt-group-bg: #eef2f7;--jqt-group-bg-hover: #e4ecf4;--jqt-group-accent: #94a3b8;--jqt-group-border: #d1d9e4;--jqt-primary-color: #1d4ed8;--jqt-danger-color: #dc2626;--jqt-danger-hover-bg: #fef2f2;--jqt-danger-border: #fca5a5;--jqt-header-bg: #f5f5f5;--jqt-header-text-color: #374151;--jqt-cell-bg: #ffffff;--jqt-footer-bg: #f5f5f5;--jqt-footer-text-color: #374151;--jqt-footer-icon-color: #374151}.jquery-table-wrapper{display:flex;flex-direction:column;width:100%;height:100%;min-height:inherit;padding:2px 2px 0;box-sizing:border-box}.table-header{display:flex;align-items:center;justify-content:flex-start;gap:8px;margin-bottom:12px}.table-header h3{margin:0;font-size:20px;font-weight:600;color:var(--jqt-title-color)}.table-layout{display:grid;grid-template-columns:minmax(155px,190px) minmax(0,1fr);gap:12px;align-items:stretch;min-height:inherit;height:100%}.table-layout.no-slice{grid-template-columns:minmax(0,1fr)}.table-layout.slice-collapsed{grid-template-columns:40px minmax(0,1fr)}.table-shell{display:flex;flex-direction:column;flex:1 1 0;min-height:0;min-width:0;width:100%;max-width:100%}.table-body-wrapper{position:relative;flex:1 1 0;min-height:0;display:flex;flex-direction:column}.table-body-scroll{flex:1 1 0;overflow-y:auto;min-height:0;border-top:1px solid var(--jqt-border-color);border-right:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);border-radius:8px 8px 0 0;scrollbar-width:thin;scrollbar-color:var(--jqt-border-color) transparent}.table-body-scroll::-webkit-scrollbar{width:6px}.table-body-scroll::-webkit-scrollbar-thumb{background:var(--jqt-border-color);border-radius:4px}.table-body-overlay{position:absolute;top:var(--actual-header-height, 56px);left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;justify-content:center;background:var(--jqt-surface-color);border-right:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);pointer-events:none}.table-body-overlay-text{font-size:14px;color:var(--jqt-text-secondary)}.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 0 8px}.table-toolbar-left{flex:1 1 auto;min-width:0}.table-toolbar-right{flex:0 0 auto}.search-input-wrapper{position:relative;display:inline-flex;align-items:center;width:100%;height:34px;border:1px solid var(--jqt-border-color);border-radius:8px;background:var(--jqt-surface-color);padding:0 8px;box-sizing:border-box;gap:6px}.search-input-wrapper:focus-within{border-color:var(--jqt-text-muted)}.search-input-wrapper .search-icon{flex-shrink:0;width:14px;height:14px;color:var(--jqt-text-muted)}.search-input{flex:1;border:none;outline:none;font-size:13px;color:var(--jqt-text-color);background:transparent;padding:7px 0;min-width:0}.search-input::placeholder{color:var(--jqt-text-muted)}.search-count{flex-shrink:0;font-size:12px;font-weight:600;color:var(--jqt-text-secondary);background:var(--jqt-row-hover-bg);border-radius:10px;padding:1px 7px;min-width:20px;text-align:center;line-height:18px}.search-clear-btn{background:none;border:none;cursor:pointer;color:var(--jqt-text-muted);font-size:16px;padding:0;line-height:1;flex-shrink:0}.search-clear-btn:hover{color:var(--jqt-text-color)}.view-btn{display:inline-flex;align-items:center;gap:5px;height:34px;border:1px solid var(--jqt-border-color);border-radius:8px;background:var(--jqt-surface-color);padding:0 12px;font-size:13px;font-weight:500;color:var(--jqt-text-color);cursor:pointer;white-space:nowrap;box-sizing:border-box}.view-btn:hover{border-color:var(--jqt-text-muted)}.view-btn-icon{font-size:16px;width:16px;height:16px;line-height:1;flex-shrink:0}.group-header-row{cursor:pointer}:host ::ng-deep .jquery-table{border-spacing:0}:host ::ng-deep .group-header-row td{padding:0!important;background:var(--jqt-group-bg);border-bottom:1px solid var(--jqt-group-border);border-top:1px solid var(--jqt-group-border);border-left:3px solid var(--jqt-group-accent);position:sticky;top:var(--actual-header-height, 56px);z-index:2;box-shadow:-4px 0 0 0 var(--jqt-group-bg)}:host ::ng-deep .group-header-row:hover td{background:var(--jqt-group-bg-hover);box-shadow:-4px 0 0 0 var(--jqt-group-bg-hover)}:host ::ng-deep .group-header-loading td,:host ::ng-deep .group-header-loading:hover td,:host ::ng-deep .group-header-too-many td,:host ::ng-deep .group-header-too-many:hover td{cursor:default;background:var(--jqt-surface-alt-color)}.group-too-many-label{font-size:12px;font-weight:500;color:var(--jqt-warn-color, #b45309);font-style:italic}.group-header-cell{padding:0!important}.group-header-label{display:flex;align-items:center;gap:6px;padding:6px 16px;font-size:12px;font-weight:700;color:var(--jqt-text-color);text-transform:uppercase;letter-spacing:.04em}.group-key-label{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-count-badge{flex-shrink:0;font-size:11px;line-height:1;font-weight:600;color:#fff;background:var(--jqt-text-secondary, #6b7280);border-radius:10px;padding:3px 7px;min-width:20px;text-align:center;text-transform:none;letter-spacing:0}.group-pagination{display:inline-flex;align-items:center;gap:4px;flex-shrink:0;margin-left:auto}.group-page-btn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border:1px solid var(--jqt-border-color);border-radius:5px;background:var(--jqt-surface-color);cursor:pointer;font-size:14px;color:var(--jqt-text-color);line-height:1;padding:0 0 3px;text-transform:none;letter-spacing:0}.group-page-btn:hover:not(:disabled){border-color:var(--jqt-text-muted);background:var(--jqt-surface-alt-color)}.group-page-btn:disabled{opacity:.35;cursor:default}.group-page-info{font-size:11px;color:var(--jqt-text-secondary);min-width:36px;text-align:center;font-weight:500;text-transform:none;letter-spacing:0}.group-chevron{flex-shrink:0;font-size:14px;font-weight:700;padding-bottom:3px;transition:transform .15s ease;transform:rotate(90deg)}.group-chevron.collapsed{transform:rotate(0)}.no-data-row{cursor:default!important}.no-data-cell{padding:0!important;height:0!important;border:none!important}.jquery-table{width:100%;table-layout:fixed}:host ::ng-deep .mat-mdc-table{width:100%;background:transparent}:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mat-mdc-cell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .mat-mdc-header-row{background:var(--jqt-header-bg)}:host ::ng-deep .mat-mdc-header-cell{background:var(--jqt-header-bg);color:var(--jqt-header-text-color)}:host ::ng-deep .mat-mdc-row,:host ::ng-deep .mat-mdc-cell{background:var(--jqt-cell-bg)}:host ::ng-deep .mat-mdc-row{cursor:pointer;border-bottom-color:var(--jqt-border-color)}:host ::ng-deep .mat-mdc-row.no-pointer{cursor:auto}:host ::ng-deep .mat-mdc-row.no-data-row{cursor:default}:host ::ng-deep .mat-mdc-header-cell.drag-enabled{-webkit-user-select:none;user-select:none}:host ::ng-deep .mat-mdc-header-cell.drag-enabled:active{cursor:default}:host ::ng-deep .mat-mdc-header-cell.drop-target{background:var(--jqt-row-hover-bg)}.head-cell{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}.drag-handle{display:inline-flex;align-items:center;cursor:grab;color:var(--jqt-border-color);flex-shrink:0;padding:0 2px;border-radius:4px;line-height:1}.drag-handle:active{cursor:grabbing}.drag-handle:hover{color:var(--jqt-text-muted)}.drag-handle mat-icon{font-size:16px;width:16px;height:16px;line-height:1}.head-icon{font-size:14px;width:14px;height:14px;line-height:1;flex-shrink:0;color:var(--jqt-text-muted)}.head-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-transform:uppercase;font-size:11px;font-weight:600;letter-spacing:.05em}.head-actions{display:inline-flex;align-items:center;gap:6px}.cell-text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cell-empty{color:var(--jqt-empty-cell-color, #9ca3af);font-style:italic}.bottom-bar{display:flex;align-items:center;flex:0 0 auto;background:var(--jqt-footer-bg);border-top:1px solid var(--jqt-border-color);border-right:1px solid var(--jqt-border-color);border-bottom:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);border-radius:0 0 8px 8px}:host ::ng-deep .bottom-bar mat-paginator{flex:1 1 auto;background:transparent;color:var(--jqt-footer-text-color)}:host ::ng-deep .bottom-bar .mat-mdc-paginator-outer-container{display:flex}:host ::ng-deep .bottom-bar .mat-mdc-paginator-container{display:flex;align-items:center;flex-wrap:nowrap;min-height:0;height:var(--actual-header-height, 56px);padding:0 8px;box-sizing:border-box}:host ::ng-deep .bottom-bar .mat-mdc-paginator-range-label,:host ::ng-deep .bottom-bar .mat-mdc-paginator-page-size-label{font-size:12px;color:var(--jqt-footer-text-color)}:host ::ng-deep .bottom-bar .mat-mdc-icon-button{color:var(--jqt-footer-icon-color);width:28px;height:28px;padding:0;line-height:1;display:inline-flex;align-items:center;justify-content:center;--mdc-icon-button-state-layer-size: 28px}:host ::ng-deep .bottom-bar .mat-mdc-icon-button .mat-mdc-button-persistent-ripple,:host ::ng-deep .bottom-bar .mat-mdc-icon-button .mdc-icon-button__state-layer{width:28px;height:28px;top:50%;left:50%;transform:translate(-50%,-50%)}:host ::ng-deep .bottom-bar .mat-mdc-icon-button .mat-icon{font-size:18px;width:18px;height:18px;line-height:18px}:host ::ng-deep .bottom-bar .mat-mdc-icon-button:disabled{opacity:.35}:host ::ng-deep .bottom-bar .mat-mdc-paginator-page-size-select{width:72px;font-size:12px}:host ::ng-deep .bottom-bar .mat-mdc-text-field-wrapper{padding:0 8px}:host ::ng-deep .bottom-bar .mdc-text-field--outlined{height:28px}:host ::ng-deep .bottom-bar .mat-mdc-form-field-infix{padding-top:0;padding-bottom:0;min-height:0;height:28px;display:flex;align-items:center}:host ::ng-deep .bottom-bar .mat-mdc-select-value-text{font-size:12px;color:var(--jqt-text-color)}:host ::ng-deep .bottom-bar .mdc-notched-outline__leading,:host ::ng-deep .bottom-bar .mdc-notched-outline__notch,:host ::ng-deep .bottom-bar .mdc-notched-outline__trailing{border-color:var(--jqt-border-color)}.group-bottom-bar{display:flex;align-items:center;flex:0 0 auto;background:var(--jqt-footer-bg);border-top:1px solid var(--jqt-border-color);border-right:1px solid var(--jqt-border-color);border-bottom:1px solid var(--jqt-border-color);border-left:1px solid var(--jqt-border-color);border-radius:0 0 8px 8px}.group-bottom-bar-container{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;height:var(--actual-header-height, 56px);padding:0 16px;gap:16px;width:100%;box-sizing:border-box}.group-bar-separator{width:1px;height:20px;background:#9ca3af;flex-shrink:0;margin:0 4px}.group-bottom-bar-left{display:flex;align-items:center;gap:8px;flex-shrink:0}.group-sort-controls{display:flex;align-items:center;gap:2px}.group-sort-label{font-size:12px;color:var(--jqt-footer-text-color);white-space:nowrap;margin-right:2px}.group-sort-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--jqt-footer-icon-color);cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}.group-sort-btn mat-icon{font-size:16px;width:16px;height:16px;line-height:16px}.group-sort-btn:hover{background:#0000000a}.group-sort-btn.active{color:var(--jqt-primary-color, #1976d2);border-color:var(--jqt-primary-color, #1976d2);background:#1976d214}:host ::ng-deep .group-bottom-bar .mat-mdc-paginator-page-size{display:flex;align-items:center;gap:8px}:host ::ng-deep .group-bottom-bar .mat-mdc-paginator-page-size-label{font-size:12px;color:var(--jqt-footer-text-color);white-space:nowrap}:host ::ng-deep .group-bottom-bar .mat-mdc-paginator-page-size-select{width:72px;font-size:12px}:host ::ng-deep .group-bottom-bar .mat-mdc-text-field-wrapper{padding:0 8px}:host ::ng-deep .group-bottom-bar .mdc-text-field--outlined{height:28px}:host ::ng-deep .group-bottom-bar .mat-mdc-form-field-infix{padding-top:0;padding-bottom:0;min-height:0;height:28px;display:flex;align-items:center}:host ::ng-deep .group-bottom-bar .mat-mdc-select-value-text{font-size:12px;color:var(--jqt-text-color)}:host ::ng-deep .group-bottom-bar .mdc-notched-outline__leading,:host ::ng-deep .group-bottom-bar .mdc-notched-outline__notch,:host ::ng-deep .group-bottom-bar .mdc-notched-outline__trailing{border-color:var(--jqt-border-color)}:host ::ng-deep .group-bottom-bar .mat-mdc-select-arrow{color:var(--jqt-footer-text-color)}.group-reset-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--jqt-border-color);border-radius:8px;background:var(--jqt-surface-color);color:var(--jqt-text-secondary);font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease;white-space:nowrap;flex-shrink:0}.group-reset-btn:hover{background:var(--jqt-danger-hover-bg);color:var(--jqt-danger-color);border-color:var(--jqt-danger-border)}.group-reset-icon{width:14px;height:14px;flex-shrink:0}::ng-deep .mat-mdc-paginator-select-page-size .mat-pseudo-checkbox{display:none!important}::ng-deep .group-page-size-panel{min-width:90px!important}::ng-deep .group-page-size-panel .mat-mdc-option{justify-content:center;min-height:40px}::ng-deep .group-page-size-panel .mdc-list-item__primary-text{text-align:center;width:100%}@media (max-width: 960px){.table-layout{grid-template-columns:1fr}}::ng-deep .view-menu-panel .mat-mdc-menu-panel{min-width:220px!important;overflow:visible!important}::ng-deep .view-menu-panel .mat-mdc-menu-content{padding:4px 0!important}::ng-deep .view-submenu-panel .mat-mdc-menu-panel{min-width:200px!important}::ng-deep .view-submenu-panel .mat-mdc-menu-content{padding:0!important}::ng-deep .view-menu-panel .view-menu-sub-trigger.mat-mdc-menu-item{min-height:42px;padding:0 14px;display:flex;align-items:center;box-sizing:border-box}::ng-deep .view-menu-panel .view-menu-sub-trigger .mdc-list-item__primary-text{display:flex;align-items:center;width:100%;gap:0;overflow:hidden}::ng-deep .view-menu-sub-label{font-size:13px;font-weight:500;color:var(--jqt-text-color);flex:0 0 auto;white-space:nowrap;padding-right:8px}::ng-deep .view-menu-sub-value{font-size:12px;color:var(--jqt-text-secondary);flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}::ng-deep .view-submenu{padding:4px 6px;min-width:180px;box-sizing:border-box}::ng-deep .view-submenu .view-menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:7px 8px;border:none;background:transparent;border-radius:6px;font-size:13px;color:var(--jqt-text-color);cursor:pointer;text-align:left;box-sizing:border-box;white-space:nowrap}::ng-deep .view-submenu .view-menu-item:hover{background:var(--jqt-row-hover-bg)}::ng-deep .view-submenu .view-menu-item.active{font-weight:600}::ng-deep .view-submenu .view-menu-item:disabled{opacity:.4;cursor:default}::ng-deep .view-menu-col-icon{flex-shrink:0;font-size:14px!important;width:14px!important;height:14px!important;color:var(--jqt-text-muted)}::ng-deep .view-menu-check{flex-shrink:0;width:16px;text-align:center;font-size:12px;color:var(--jqt-text-color)}::ng-deep .view-menu-separator{border:none;border-top:1px solid var(--jqt-border-color);margin:4px 0}.lazy-skeleton{display:block;height:12px;width:70%;border-radius:4px;background:linear-gradient(90deg,var(--jqt-border-color) 25%,var(--jqt-surface-alt-color) 50%,var(--jqt-border-color) 75%);background-size:200% 100%;animation:lazy-shimmer 1.4s ease-in-out infinite}.group-lazy-key-skeleton{flex:1 1 auto;min-width:80px;height:13px;border-radius:4px}@keyframes lazy-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.lazy-error-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:1px solid #fca5a5;border-radius:4px;padding:2px 6px;cursor:pointer;color:#ef4444;font-size:12px;opacity:.85;transition:opacity .15s}.lazy-error-btn:hover{opacity:1;background:#fef2f2}.lazy-error-icon{font-size:12px}.lazy-error-label{font-size:11px;font-weight:500}::ng-deep .lazy-menu-spinner{display:inline-block;margin-left:auto;font-size:13px;color:var(--jqt-text-secondary);animation:lazy-spin 1s linear infinite}::ng-deep .lazy-menu-error{display:inline-block;margin-left:auto;font-size:13px;color:#ef4444}@keyframes lazy-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
+        }], propDecorators: { config: [{
+                type: Input
+            }], dataSource: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], displayedColumns: [{
+                type: Input
+            }], columnsConfig: [{
+                type: Input
+            }], columnLabels: [{
+                type: Input
+            }], isLoading: [{
+                type: Input
+            }], addRequested: [{
+                type: Output
+            }], columnAdded: [{
+                type: Output
+            }], columnRemoved: [{
+                type: Output
+            }], categorySelected: [{
+                type: Output
+            }], rowSelected: [{
+                type: Output
+            }], paginator: [{
+                type: ViewChild,
+                args: [MatPaginator]
+            }], sort: [{
+                type: ViewChild,
+                args: [MatSort]
+            }], tableBodyScrollRef: [{
+                type: ViewChild,
+                args: ['tableBodyScroll']
+            }], slicePanelRef: [{
+                type: ViewChild,
+                args: [SlicePanelComponent]
+            }], viewMenuTrigger: [{
+                type: ViewChild,
+                args: ['viewMenuTrigger']
+            }], _cellDefs: [{
+                type: ContentChildren,
+                args: [JqtCellDefDirective]
+            }] } });
+
+/*
+ * Public API Surface of jquery-table
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { JqtCellDefDirective, SlicePanelComponent, TableComponent };
+//# sourceMappingURL=oneteme-jquery-table.mjs.map