@oneteme/jquery-table 0.0.1

package/lib/component/table.component.d.ts

@@ -0,0 +1,199 @@
+import { AfterViewInit, ElementRef, EventEmitter, OnChanges, OnDestroy, QueryList, SimpleChanges, TemplateRef } from '@angular/core';
+import { MatMenuTrigger } from '@angular/material/menu';
+import { MatPaginator } from '@angular/material/paginator';
+import { MatSort } from '@angular/material/sort';
+import { MatTableDataSource } from '@angular/material/table';
+import { TableColumnProvider, TableProvider } from '../jquery-table.model';
+import { JqtCellDefDirective } from '../directive/jqt-cell-def.directive';
+import { SlicePanelComponent } from './slice-panel/slice-panel.component';
+import * as i0 from "@angular/core";
+export declare class TableComponent<T = any> implements OnChanges, AfterViewInit, OnDestroy {
+    config?: TableProvider<T>;
+    dataSource?: T[] | {
+        data: T[];
+    };
+    data?: T[];
+    displayedColumns?: string[];
+    columnsConfig?: TableColumnProvider<T>[];
+    columnLabels?: Record<string, string>;
+    isLoading: boolean;
+    addRequested: EventEmitter<void>;
+    columnAdded: EventEmitter<TableColumnProvider<T>>;
+    columnRemoved: EventEmitter<TableColumnProvider<T>>;
+    categorySelected: EventEmitter<string>;
+    rowSelected: EventEmitter<T>;
+    set paginator(value: MatPaginator | undefined);
+    get paginator(): MatPaginator | undefined;
+    private _paginator?;
+    sort?: MatSort;
+    tableBodyScrollRef?: ElementRef<HTMLElement>;
+    slicePanelRef?: SlicePanelComponent<T>;
+    viewMenuTrigger?: MatMenuTrigger;
+    _cellDefs: QueryList<JqtCellDefDirective>;
+    renderedColumns: string[];
+    tableDataSource: MatTableDataSource<any, import("@angular/material/table").MatTableDataSourcePaginator>;
+    activeColumns: TableColumnProvider<T>[];
+    activeSliceFilter: (row: T) => boolean;
+    _sliceConfigs: any[];
+    _sliceColumns: TableColumnProvider<T>[];
+    _sliceData: T[];
+    _sliceShowToggle: boolean;
+    _staticSlicesForMenu: Array<{
+        key: string;
+        title: string;
+        icon?: string;
+    }>;
+    _activeDynamicSliceColumns: TableColumnProvider<T>[];
+    _availableColumnsForDynamicSlice: TableColumnProvider<T>[];
+    _allDynamicSliceColumns: TableColumnProvider<T>[];
+    _activeSliceByLabel: string;
+    searchQuery: string;
+    activeGroupByKey: string | null;
+    _matSortActive: string;
+    _matSortDirection: 'asc' | 'desc' | '';
+    private _collapsedGroups;
+    private _activeSort;
+    private _sortSubscribed;
+    private _destroy$;
+    private _defaultGroupCollapsed;
+    private _groupPages;
+    private _totalFilteredCount;
+    _lazyColumnStatus: Map<string, "error" | "loaded" | "idle" | "loading">;
+    _lazyColumnData: Map<string, Map<any, any>>;
+    private _lazyFetchCancels;
+    private _cdr;
+    private _el;
+    isGroupHeader: (_: number, row: any) => boolean;
+    pageSize: number;
+    pageSizeOptions: number[];
+    pageSizeOptionsGroupBy: number[];
+    groupPageSize: number;
+    groupSortOrder: 'asc' | 'desc';
+    draggedColumnKey: string | null;
+    dragOverColumnKey: string | null;
+    private userCustomizedColumns;
+    private resolvedConfig;
+    private _columnMap;
+    private _resolvedData;
+    private _preservePageIndex;
+    private _initialSearchApplied;
+    private static readonly MAX_GROUP_COUNT;
+    private _allFilteredRows;
+    private _paginatorSubscribed;
+    private _groupCacheRows;
+    private _groupCacheKey;
+    private _groupCacheSortOrder;
+    private _groupCacheSortActive;
+    private _groupCacheSortDir;
+    private _groupCacheOrder;
+    private _groupCacheMap;
+    private _pendingRender;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    private _measureHeaderHeight;
+    get title(): string;
+    get showTitle(): boolean;
+    get visibleColumns(): TableColumnProvider<T>[];
+    get showSearchBar(): boolean;
+    get showViewButton(): boolean;
+    get showToolbar(): boolean;
+    get showFields(): boolean;
+    get showGroupBySection(): boolean;
+    get filteredRowCount(): number;
+    get activeGroupByLabel(): string;
+    get totalColumnCount(): number;
+    get activeSliceByLabel(): string;
+    get activeDynamicSliceColumns(): TableColumnProvider<T>[];
+    removeDynamicSliceByKey(key: string): void;
+    get groupByColumns(): TableColumnProvider<T>[];
+    colLabel(col: {
+        key: string;
+        header?: string;
+    }): string;
+    onSearchChange(): void;
+    onGroupByChange(key: string | null): void;
+    onGroupPageSizeChange(size: number | string): void;
+    onGroupSortToggle(dir: 'asc' | 'desc'): void;
+    getLazyColumnStatus(key: string): 'idle' | 'loading' | 'loaded' | 'error';
+    getLazyRenderType(rowValue: any): 'loading' | 'error' | 'value';
+    retryLazyColumn(column: TableColumnProvider<T>): void;
+    triggerLazyFetch(column: TableColumnProvider<T>): void;
+    toggleGroupCollapse(groupKey: string): void;
+    private scrollToGroupHeader;
+    isGroupCollapsed(groupKey: string): boolean;
+    groupPageBack(groupKey: string): void;
+    groupPageForward(groupKey: string, totalCount: number): void;
+    get hasAddableColumns(): boolean;
+    get menuBaseColumns(): TableColumnProvider<T>[];
+    get menuOptionalColumns(): TableColumnProvider<T>[];
+    get availableColumnsToAdd(): TableColumnProvider<T>[];
+    get allowColumnRemoval(): boolean;
+    get hasSliceConfig(): boolean;
+    get showSlicePanel(): boolean;
+    get showAddSliceButton(): boolean;
+    get staticSlicesForMenu(): Array<{
+        key: string;
+        title: string;
+        icon?: string;
+    }>;
+    get availableColumnsForDynamicSlice(): TableColumnProvider<T>[];
+    isStaticSliceVisible(columnKey: string): boolean;
+    toggleStaticSlice(columnKey: string): void;
+    addDynamicSlice(column: TableColumnProvider<T>): void;
+    get allDynamicSliceColumns(): TableColumnProvider<T>[];
+    isDynamicSliceActive(key: string): boolean;
+    toggleDynamicSlice(col: TableColumnProvider<T>): void;
+    onSliceFilterChange(pred: (row: T) => boolean): void;
+    onDynamicSliceKeysChange(keys: string[]): void;
+    get emptyStateLabel(): string;
+    get loadingStateLabel(): string;
+    get effectiveIsLoading(): boolean;
+    get isEmpty(): boolean;
+    get showPagination(): boolean;
+    get isColumnDragDropEnabled(): boolean;
+    get totalRows(): number;
+    onAddColumn(column: TableColumnProvider<T>): void;
+    onColumnVisibilityChange(column: TableColumnProvider<T>, checked: boolean): void;
+    isColumnVisible(columnKey: string): boolean;
+    onRemoveColumn(columnKey: string, event?: Event): void;
+    getCellTemplate(key: string): TemplateRef<{
+        $implicit: any;
+        index: number;
+    }> | null;
+    get hasCustomCellDefs(): boolean;
+    get hasRowClickHandler(): boolean;
+    trackRowFn: (_index: number, row: any) => any;
+    getRowClass(row: any): string | string[] | Record<string, boolean>;
+    onRowClick(row: any, event: MouseEvent | null): void;
+    onHeaderDragStart(columnKey: string, event: DragEvent): void;
+    onHeaderDragOver(columnKey: string, event: DragEvent): void;
+    onHeaderDrop(targetColumnKey: string, event: DragEvent): void;
+    onHeaderDragEnd(): void;
+    isHeaderDropTarget(columnKey: string): boolean;
+    canRemoveColumn(column: TableColumnProvider<T>): boolean;
+    isCellEmpty(value: any): boolean;
+    asTitle(value: any): string;
+    private refreshViewModel;
+    private _computeSliceLabel;
+    private _scheduleRender;
+    private _executeRender;
+    private _projectCurrentPage;
+    private buildEffectiveConfig;
+    private resolveData;
+    private resolveColumnsFromCompat;
+    private getCategoryFilteredData;
+    private projectRows;
+    private _buildSortComparator;
+    private getLazyAwareValue;
+    private resolveCellValue;
+    private resolvePageSize;
+    private resolvePageSizeOptions;
+    private resolvePageSizeOptionsGroupBy;
+    private resolveDefaultGroupPageSize;
+    private uniqueColumnsByKey;
+    private attachPaginator;
+    private attachSort;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TableComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent<any>, "jquery-table", never, { "config": { "alias": "config"; "required": false; }; "dataSource": { "alias": "dataSource"; "required": false; }; "data": { "alias": "data"; "required": false; }; "displayedColumns": { "alias": "displayedColumns"; "required": false; }; "columnsConfig": { "alias": "columnsConfig"; "required": false; }; "columnLabels": { "alias": "columnLabels"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; }, { "addRequested": "addRequested"; "columnAdded": "columnAdded"; "columnRemoved": "columnRemoved"; "categorySelected": "categorySelected"; "rowSelected": "rowSelected"; }, ["_cellDefs"], never, true, never>;
+}

package/lib/component/table.utils.d.ts

@@ -0,0 +1,17 @@
+import { MatPaginatorIntl } from '@angular/material/paginator';
+/** Traductions françaises du paginator Material. */
+export declare function getFrenchPaginatorIntl(): MatPaginatorIntl;
+/**
+ * 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)
+ */
+export declare function normalizeCellValue(value: any): any;
+/**
+ * Transforme une clé camelCase/snake_case en libellé lisible.
+ * Ex: 'createdAt' → 'Created at', 'my_field' → 'My field'
+ */
+export declare function humanizeKey(key: string): string;

package/lib/directive/jqt-cell-def.directive.d.ts

@@ -0,0 +1,29 @@
+import { TemplateRef } from '@angular/core';
+import * as i0 from "@angular/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).
+ */
+export declare class JqtCellDefDirective {
+    readonly template: TemplateRef<{
+        $implicit: any;
+        index: number;
+    }>;
+    /** Clé de la colonne à laquelle ce template s'applique. */
+    columnKey: string;
+    constructor(template: TemplateRef<{
+        $implicit: any;
+        index: number;
+    }>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<JqtCellDefDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<JqtCellDefDirective, "[jqtCellDef]", never, { "columnKey": { "alias": "jqtCellDef"; "required": false; }; }, {}, never, never, true, never>;
+}

package/lib/jquery-table.model.d.ts

@@ -0,0 +1,72 @@
+import { DataProvider } from '@oneteme/jquery-core';
+import { Observable } from 'rxjs';
+import { SliceConfig } from './component/slice-panel/slice-panel.model';
+export { SliceConfig } from './component/slice-panel/slice-panel.model';
+export interface TableColumnProvider<T = any> {
+    key: string;
+    /** Libellé affiché dans l'en-tête de colonne. Optionnel si la colonne utilise un template custom. */
+    header?: string;
+    icon?: string;
+    value?: DataProvider<any>;
+    /** Valeur utilisée pour le tri si différente de `value`. Utile quand `value` retourne une chaîne formatée (date, durée...). */
+    sortValue?: DataProvider<any>;
+    sortable?: boolean;
+    removable?: boolean;
+    optional?: boolean;
+    width?: string;
+    groupable?: boolean;
+    sliceable?: boolean;
+    /** Chargement différé : la présence de cet objet active le mode lazy. */
+    lazy?: {
+        /** Fonction appelée pour charger les valeurs de la colonne. Retourne un tableau dans le même ordre que les lignes. */
+        fetchFn: () => Observable<any[]>;
+    };
+}
+/** Configuration de la barre de recherche. */
+export interface TableSearchConfig {
+    enabled?: boolean;
+    /** Valeur initiale au chargement. */
+    initialQuery?: string;
+}
+/** Configuration de la pagination. */
+export interface TablePaginationConfig {
+    enabled?: boolean;
+    pageSize?: number;
+    pageSizeOptions?: number[];
+    /** Options de taille de page spécifiques au mode Group by. Si absent, utilise `pageSizeOptions`. */
+    pageSizeOptionsGroupBy?: number[];
+}
+/** Configuration du menu View (Champs / Group by / Slice by). */
+export interface TableViewConfig {
+    /** Active le bouton View. Par défaut : `false`. */
+    enabled?: boolean;
+    /** Autorise le masquage/affichage des colonnes de base via View > Champs. Par défaut : `true`. */
+    enableColumnRemoval?: boolean;
+    /** Active le drag & drop pour réordonner les colonnes. Par défaut : `false`. */
+    enableColumnDragDrop?: boolean;
+}
+/** Labels d'état du tableau. */
+export interface TableLabelsConfig {
+    /** Affiché quand le tableau est vide. Par défaut : `'Aucune donnée'`. */
+    empty?: string;
+    /** Affiché pendant le chargement. Par défaut : `'Chargement des données...'`. */
+    loading?: string;
+}
+export interface TableProvider<T = any> {
+    columns?: TableColumnProvider<T>[];
+    title?: string;
+    slices?: SliceConfig<T>[];
+    /** Affiche le bouton toggle pour replier/déplier le panneau de slices. Par défaut : `true`. */
+    enableSliceToggle?: boolean;
+    search?: TableSearchConfig;
+    pagination?: TablePaginationConfig;
+    view?: TableViewConfig;
+    labels?: TableLabelsConfig;
+    /** Tri initial appliqué au chargement. N'est pas écrasé par les changements de données. */
+    defaultSort?: {
+        active: string;
+        direction: 'asc' | 'desc';
+    };
+    rowClass?: (row: T, index: number) => string | string[] | Record<string, boolean>;
+    onRowSelected?: (row: T, event: MouseEvent | null) => void;
+}

package/package.json

@@ -0,0 +1,35 @@
+{
+  "name": "@oneteme/jquery-table",
+  "version": "0.0.1",
+  "description": "jquery table lib",
+  "homepage": "https://github.com/oneteme/jquery-charts",
+  "bugs": "https://github.com/oneteme/jquery-charts/issues",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/oneteme/jquery-charts.git"
+  },
+  "peerDependencies": {
+    "@angular/common": ">=16.1.0",
+    "@angular/core": ">=16.1.0",
+    "@angular/material": "^16.1.0",
+    "@angular/cdk": "^16.1.0",
+    "@oneteme/jquery-core": "^0.0.27"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/oneteme-jquery-table.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/oneteme-jquery-table.mjs",
+      "esm": "./esm2022/oneteme-jquery-table.mjs",
+      "default": "./fesm2022/oneteme-jquery-table.mjs"
+    }
+  }
+}

package/public-api.d.ts

@@ -0,0 +1,5 @@
+export * from './lib/jquery-table.model';
+export * from './lib/component/table.component';
+export * from './lib/component/slice-panel/slice-panel.model';
+export * from './lib/component/slice-panel/slice-panel.component';
+export * from './lib/directive/jqt-cell-def.directive';