@ackplus/react-tanstack-data-table 1.1.19 → 1.1.21

package/src/lib/icons/add-icon.tsx

@@ -1,23 +0,0 @@
-import React, { ReactElement } from 'react';
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-
-export function AddIcon(props: SvgIconProps): ReactElement {
-    return (
-        <SvgIcon
-            {...props}
-            viewBox="0 0 24 24"
-        >
-            <path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
-            <circle
-                cx="12"
-                cy="12"
-                r="9"
-                fill="none"
-                stroke="currentColor"
-                strokeWidth="0.5"
-                opacity="0.3"
-            />
-        </SvgIcon>
-    );
-}

package/src/lib/icons/csv-icon.tsx

@@ -1,15 +0,0 @@
-import React, { ReactElement } from 'react';
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-
-export function CsvIcon(props: SvgIconProps): ReactElement {
-    return (
-        <SvgIcon
-            {...props}
-            viewBox="0 0 24 24"
-        >
-            <path d="M14,2H6A2,2 0 0,0 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2M18,20H6V4H13V9H18V20Z" />
-            <path d="M7,12.5A0.5,0.5 0 0,1 7.5,12H8.5A0.5,0.5 0 0,1 9,12.5V13.5A0.5,0.5 0 0,1 8.5,14H7.5A0.5,0.5 0 0,1 7,13.5M10.5,12.5A0.5,0.5 0 0,1 11,12H12A0.5,0.5 0 0,1 12.5,12.5V13.5A0.5,0.5 0 0,1 12,14H11A0.5,0.5 0 0,1 10.5,13.5M14,12.5A0.5,0.5 0 0,1 14.5,12H15.5A0.5,0.5 0 0,1 16,12.5V13.5A0.5,0.5 0 0,1 15.5,14H14.5A0.5,0.5 0 0,1 14,13.5" />
-        </SvgIcon>
-    );
-}

package/src/lib/icons/delete-icon.tsx

@@ -1,30 +0,0 @@
-import React, { ReactElement } from 'react';
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-
-export function DeleteIcon(props: SvgIconProps): ReactElement {
-    return (
-        <SvgIcon
-            {...props}
-            viewBox="0 0 24 24"
-        >
-            <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z" />
-            <rect
-                x="9"
-                y="8"
-                width="2"
-                height="9"
-                fill="currentColor"
-                opacity="0.6"
-            />
-            <rect
-                x="13"
-                y="8"
-                width="2"
-                height="9"
-                fill="currentColor"
-                opacity="0.6"
-            />
-        </SvgIcon>
-    );
-}

package/src/lib/icons/excel-icon.tsx

@@ -1,15 +0,0 @@
-import React, { ReactElement } from 'react';
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-
-export function ExcelIcon(props: SvgIconProps): ReactElement {
-    return (
-        <SvgIcon
-            {...props}
-            viewBox="0 0 24 24"
-        >
-            <path d="M14,2H6A2,2 0 0,0 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2M18,20H6V4H13V9H18V20Z" />
-            <path d="M11.5,15L9.75,12.5L11.5,10H10L8.75,11.5L7.5,10H6L7.75,12.5L6,15H7.5L8.75,13.5L10,15H11.5M15,10V12H17V10H15M15,14V16H17V14H15Z" />
-        </SvgIcon>
-    );
-}

package/src/lib/icons/index.ts

@@ -1,7 +0,0 @@
-export { UnpinIcon } from './unpin-icon';
-export { AddIcon } from './add-icon';
-export { DeleteIcon } from './delete-icon';
-export { ViewCompactIcon } from './view-compact-icon';
-export { ViewComfortableIcon } from './view-comfortable-icon';
-export { CsvIcon } from './csv-icon';
-export { ExcelIcon } from './excel-icon';

package/src/lib/icons/unpin-icon.tsx

@@ -1,18 +0,0 @@
-import React, { ReactElement } from 'react';
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-
-export function UnpinIcon(props: SvgIconProps): ReactElement {
-    return (
-        <SvgIcon
-            {...props}
-            viewBox="0 0 24 24"
-        >
-            <path
-                d="M2 5.27L3.28 4 20 20.72 18.73 22l-3.41-3.41V22h-1.6v-6H8v-2l2-2V9.27L2 5.27zM16 12V4h1V2H7v2h1v3.73l8 8z"
-                opacity="0.7"
-            />
-            <path d="M14.73 12L16 10.73V4h1V2H7v2h1v3.73l2.27 2.27z" />
-        </SvgIcon>
-    );
-}

package/src/lib/icons/view-comfortable-icon.tsx

@@ -1,45 +0,0 @@
-import React, { ReactElement } from 'react';
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-
-export function ViewComfortableIcon(props: SvgIconProps): ReactElement {
-    return (
-        <SvgIcon
-            {...props}
-            viewBox="0 0 24 24"
-        >
-            <rect
-                x="3"
-                y="3"
-                width="18"
-                height="3"
-                fill="currentColor"
-                rx="1"
-            />
-            <rect
-                x="3"
-                y="8"
-                width="18"
-                height="3"
-                fill="currentColor"
-                rx="1"
-            />
-            <rect
-                x="3"
-                y="13"
-                width="18"
-                height="3"
-                fill="currentColor"
-                rx="1"
-            />
-            <rect
-                x="3"
-                y="18"
-                width="18"
-                height="3"
-                fill="currentColor"
-                rx="1"
-            />
-        </SvgIcon>
-    );
-}

package/src/lib/icons/view-compact-icon.tsx

@@ -1,55 +0,0 @@
-import React, { ReactElement } from 'react';
-import { SvgIcon, SvgIconProps } from '@mui/material';
-
-
-export function ViewCompactIcon(props: SvgIconProps): ReactElement {
-    return (
-        <SvgIcon
-            {...props}
-            viewBox="0 0 24 24"
-        >
-            <rect
-                x="3"
-                y="4"
-                width="18"
-                height="2"
-                fill="currentColor"
-            />
-            <rect
-                x="3"
-                y="7"
-                width="18"
-                height="2"
-                fill="currentColor"
-            />
-            <rect
-                x="3"
-                y="10"
-                width="18"
-                height="2"
-                fill="currentColor"
-            />
-            <rect
-                x="3"
-                y="13"
-                width="18"
-                height="2"
-                fill="currentColor"
-            />
-            <rect
-                x="3"
-                y="16"
-                width="18"
-                height="2"
-                fill="currentColor"
-            />
-            <rect
-                x="3"
-                y="19"
-                width="18"
-                height="2"
-                fill="currentColor"
-            />
-        </SvgIcon>
-    );
-}

package/src/lib/types/column.types.ts

@@ -1,63 +0,0 @@
-import { ColumnDef, RowData, Column } from '@tanstack/react-table';
-import { ColumnFilterRule } from '../features';
-
-
-export const DEFAULT_SELECTION_COLUMN_NAME = '_selection';
-export const DEFAULT_EXPANDING_COLUMN_NAME = '_expanding';
-
-/**
- * Column Definition Types
- * Consolidated column-related interfaces from various files
- */
-
-/**
- * Module augmentation to extend TanStack Table's ColumnMeta interface
- * This automatically extends all ColumnDef types since they use ColumnMeta in their meta property
- */
-declare module '@tanstack/react-table' {
-    interface ColumnDefBase<TData extends RowData, TValue> {
-        type?: 'boolean' | 'number' | 'date' | 'select' | 'text';
-        options?: {
-            label: string;
-            value: string;
-        }[];
-        align?: 'left' | 'center' | 'right';
-        filterable?: boolean;
-        hideInExport?: boolean;
-        exportHeader?: string | ((context: {
-            columnId: string;
-            defaultHeader: string;
-            columnDef: ColumnDefBase<TData, TValue>;
-        }) => string);
-        exportValue?: (context: {
-            value: any;
-            row: TData;
-            rowIndex: number;
-            columnId: string;
-            columnDef: ColumnDefBase<TData, TValue>;
-        }) => any;
-        exportFormat?: 'auto' | 'string' | 'number' | 'boolean' | 'json' | 'date' | ((context: {
-            value: any;
-            row: TData;
-            rowIndex: number;
-            columnId: string;
-            columnDef: ColumnDefBase<TData, TValue>;
-        }) => any);
-        wrapText?: boolean; // If true, text will wrap; if false, text will truncate with ellipsis (default: false)
-        editComponent?: React.ComponentType<{
-            value: any;
-            onChange: (value: any) => void;
-            filter: ColumnFilterRule;
-            column: Column<TData, TValue>;
-        }>;
-        filterComponent?: React.ComponentType<{
-            value: any;
-            onChange: (value: any) => void;
-            filter: ColumnFilterRule;
-            column: Column<TData, TValue>;
-        }>;
-    }
-}
-export type DataTableColumn<TData extends RowData, TValue = unknown> = ColumnDef<TData, TValue> & {
-// All custom properties are now defined in the module augmentation above
-}

package/src/lib/types/data-table-api.ts

@@ -1,191 +0,0 @@
-import { ColumnPinningState, SortingState, ColumnOrderState, TableState, Row, Table } from '@tanstack/react-table';
-
-import { ColumnFilterState } from './table.types';
-import { SelectionState } from '../features';
-import { ServerExportResult } from './export.types';
-
-export interface DataRefreshApiOptions {
-    resetPagination?: boolean;
-    force?: boolean;
-    reason?: string;
-}
-
-export type DataRefreshApiInput = boolean | DataRefreshApiOptions;
-
-export interface DataTableExportApiOptions {
-    filename?: string;
-    onlyVisibleColumns?: boolean;
-    onlySelectedRows?: boolean;
-    includeHeaders?: boolean;
-    chunkSize?: number;
-    strictTotalCheck?: boolean;
-    sanitizeCSV?: boolean;
-}
-
-export interface DataTableApi<T = any> {
-    // Column Management
-    columnVisibility: {
-        showColumn: (columnId: string) => void;
-        hideColumn: (columnId: string) => void;
-        toggleColumn: (columnId: string) => void;
-        showAllColumns: () => void;
-        hideAllColumns: () => void;
-        resetColumnVisibility: () => void;
-    };
-
-    table :{
-        getTable: () => Table<T>;
-    }
-
-    // Column Ordering
-    columnOrdering: {
-        setColumnOrder: (columnOrder: ColumnOrderState) => void;
-        moveColumn: (columnId: string, toIndex: number) => void;
-        resetColumnOrder: () => void;
-    };
-
-    // Column Pinning
-    columnPinning: {
-        pinColumnLeft: (columnId: string) => void;
-        pinColumnRight: (columnId: string) => void;
-        unpinColumn: (columnId: string) => void;
-        setPinning: (pinning: ColumnPinningState) => void;
-        resetColumnPinning: () => void;
-    };
-
-    // Column Resizing
-    columnResizing: {
-        resizeColumn: (columnId: string, width: number) => void;
-        autoSizeColumn: (columnId: string) => void;
-        autoSizeAllColumns: () => void;
-        resetColumnSizing: () => void;
-    };
-
-    // Filtering
-    filtering: {
-        setGlobalFilter: (filter: string) => void;
-        clearGlobalFilter: () => void;
-        setColumnFilters: (filters: ColumnFilterState, isApply?: boolean) => void;
-        addColumnFilter: (columnId: string, operator: string, value: any) => void;
-        removeColumnFilter: (filterId: string) => void;
-        clearAllFilters: () => void;
-        resetFilters: () => void;
-    };
-
-    // Sorting
-    sorting: {
-        setSorting: (sorting: SortingState) => void;
-        sortColumn: (columnId: string, direction: 'asc' | 'desc' | false) => void;
-        clearSorting: () => void;
-        resetSorting: () => void;
-    };
-
-    // Pagination
-    pagination: {
-        goToPage: (pageIndex: number) => void;
-        nextPage: () => void;
-        previousPage: () => void;
-        setPageSize: (pageSize: number) => void;
-        goToFirstPage: () => void;
-        goToLastPage: () => void;
-        resetPagination?: () => void;
-    };
-
-    // Enhanced Row Selection with automatic mode detection
-    selection: {
-        // Basic selection (works with current selectMode)
-        selectRow: (rowId: string) => void;
-        deselectRow: (rowId: string) => void;
-        toggleRowSelection: (rowId: string) => void;
-
-        // Smart selection methods (automatically handle page vs all modes)
-        selectAll: () => void; // Selects all based on current selectMode
-        deselectAll: () => void; // Deselects all
-        toggleSelectAll: () => void; // Toggles select all
-
-        // Selection state getters
-        getSelectionState: () => SelectionState; // Get selection state
-        getSelectedCount: () => number; // Get total selected count
-        // Returns selected rows that are currently loaded in the table instance.
-        // For server/manual pagination, use getSelectionState() for full selection intent.
-        getSelectedRows: () => Row<T>[]
-        // Selection state checks
-        isRowSelected: (rowId: string) => boolean;
-    };
-
-    // Data Management
-    data: {
-        // Refresh data with pagination reset
-        refresh: (options?: DataRefreshApiInput) => void;
-        // Reload data without all current states
-        reload: (options?: DataRefreshApiOptions) => void;
-        // Reset all data to initial state
-        resetAll: () => void;
-
-        // Data CRUD operations
-        getAllData: () => T[];
-        getRowData: (rowId: string) => T | undefined;
-        getRowByIndex: (index: number) => T | undefined;
-        updateRow: (rowId: string, updates: Partial<T>) => void;
-        updateRowByIndex: (index: number, updates: Partial<T>) => void;
-        insertRow: (newRow: T, index?: number) => void;
-        deleteRow: (rowId: string) => void;
-        deleteRowByIndex: (index: number) => void;
-        deleteSelectedRows: () => void;
-        replaceAllData: (newData: T[]) => void;
-
-        // Bulk operations
-        updateMultipleRows: (updates: Array<{ rowId: string; data: Partial<T> }>) => void;
-        insertMultipleRows: (newRows: T[], startIndex?: number) => void;
-        deleteMultipleRows: (rowIds: string[]) => void;
-
-        // Field-specific updates
-        updateField: (rowId: string, fieldName: keyof T, value: any) => void;
-        updateFieldByIndex: (index: number, fieldName: keyof T, value: any) => void;
-
-        // Data queries
-        findRows: (predicate: (row: T) => boolean) => T[];
-        findRowIndex: (predicate: (row: T) => boolean) => number;
-        getDataCount: () => number;
-        getFilteredDataCount: () => number;
-    };
-
-    // Layout Management
-    layout: {
-        resetLayout: () => void;
-        resetAll: () => void;
-        saveLayout: () => any;
-        restoreLayout: (layout: any) => void;
-    };
-
-    // Table State
-    state: {
-        getTableState: () => any;
-        getCurrentFilters: () => ColumnFilterState;
-        getCurrentSorting: () => SortingState;
-        getCurrentPagination: () => { pageIndex: number; pageSize: number };
-        getCurrentSelection: () => SelectionState;
-    };
-
-    // Simplified Export
-    export: {
-        exportCSV: (options?: DataTableExportApiOptions) => Promise<void>;
-        exportExcel: (options?: DataTableExportApiOptions) => Promise<void>;
-        exportServerData: (options: {
-            format: 'csv' | 'excel';
-            filename?: string;
-            fetchData: (
-                filters?: Partial<TableState>,
-                selection?: SelectionState,
-                signal?: AbortSignal
-            ) => Promise<ServerExportResult<T>>;
-            pageSize?: number;
-            includeHeaders?: boolean;
-            chunkSize?: number;
-            strictTotalCheck?: boolean;
-            sanitizeCSV?: boolean;
-        }) => Promise<void>;
-        isExporting: () => boolean;
-        cancelExport: () => void;
-    };
-}

package/src/lib/types/data-table.types.ts

@@ -1,192 +0,0 @@
-/**
- * Type definitions for DataTable components
- */
-import { Row, SortingState, ColumnResizeMode, ColumnPinningState, PaginationState, ColumnDef } from '@tanstack/react-table';
-import { ReactNode } from 'react';
-
-import type { ColumnFilterState, TableFilters, TableState } from './index';
-import { DataTableSlots, PartialSlotProps } from './slots.types';
-import { DataTableSize } from '../utils/table-helpers';
-import { SelectionState, SelectMode } from '../features';
-import { DataTableLoggingOptions } from '../utils/logger';
-import { ExportConcurrencyMode, ExportProgressPayload, ExportStateChange, ServerExportResult } from './export.types';
-
-// Dynamic data management interfaces
-// TableFilters now imported from types folder
-
-export type DataRefreshReason = 'initial' | 'state-change' | 'refresh' | 'reload' | 'reset' | string;
-
-export interface DataFetchMeta {
-    reason?: DataRefreshReason;
-    force?: boolean;
-}
-
-export interface DataRefreshOptions extends DataFetchMeta {
-    resetPagination?: boolean;
-}
-
-export interface DataRefreshContext {
-    filters: Partial<TableFilters>;
-    state: Partial<TableState>;
-    options: Required<Pick<DataRefreshOptions, 'resetPagination' | 'force'>> & {
-        reason: string;
-    };
-}
-
-export type DataMutationAction =
-    | 'updateRow'
-    | 'updateRowByIndex'
-    | 'insertRow'
-    | 'deleteRow'
-    | 'deleteRowByIndex'
-    | 'deleteSelectedRows'
-    | 'replaceAllData'
-    | 'updateMultipleRows'
-    | 'insertMultipleRows'
-    | 'deleteMultipleRows'
-    | 'updateField'
-    | 'updateFieldByIndex';
-
-export interface DataMutationContext<T> {
-    action: DataMutationAction;
-    previousData: T[];
-    nextData: T[];
-    rowId?: string;
-    index?: number;
-    rowIds?: string[];
-    totalRow?: number;
-}
-
-export interface DataTableProps<T> {
-    // Core data props
-    // columns: DataTableColumn<T>[] | AccessorKeyColumnDef <T, string>[];
-    columns: ColumnDef<T, any>[];
-    data?: T[];
-    totalRow?: number;
-    idKey?: keyof T;
-    extraFilter?: ReactNode | null;
-    footerFilter?: ReactNode | null;
-
-    // Data management modes (MUI DataGrid style)
-    dataMode?: 'client' | 'server'; // Data management mode (default: 'client')
-    initialState?: Partial<TableState>;
-    initialLoadData?: boolean; // Initial load data (default: true)
-    onDataStateChange?: (filters: Partial<TableState>) => void; // Callback when any filter/state changes
-    onFetchData?: (filters: Partial<TableFilters>, meta?: DataFetchMeta) => Promise<{ data: T[]; total: number }>;
-    onFetchStateChange?: (filters: Partial<TableState>, meta?: DataFetchMeta) => void;
-    onRefreshData?: (context: DataRefreshContext) => void | Promise<void>;
-
-    // Simplified Export props
-    exportFilename?: string;
-    exportConcurrency?: ExportConcurrencyMode;
-    exportChunkSize?: number;
-    exportStrictTotalCheck?: boolean;
-    exportSanitizeCSV?: boolean;
-    onExportProgress?: (progress: ExportProgressPayload) => void;
-    onExportComplete?: (result: { success: boolean; filename: string; totalRows: number }) => void;
-    onExportError?: (error: { message: string; code: string }) => void;
-    onExportStateChange?: (state: ExportStateChange) => void;
-
-    // Server export callback - receives current table state/filters and selection data
-    onServerExport?: (
-        filters?: Partial<TableState>,
-        selection?: SelectionState,
-        signal?: AbortSignal
-    ) => Promise<ServerExportResult<any>>;
-
-    // Export cancellation callback - called when export is cancelled
-    onExportCancel?: () => void;
-
-    // Selection props
-    enableRowSelection?: boolean | ((row: Row<T>) => boolean);
-    enableMultiRowSelection?: boolean;
-    selectMode?: SelectMode; // 'page' | 'all' - defines selection scope
-    
-    // Row selection control (like MUI DataGrid)
-    isRowSelectable?: (params: { row: T; id: string }) => boolean;
-    
-    onSelectionChange?: (selection: SelectionState) => void;
-
-    // Row click props
-    onRowClick?: (event: React.MouseEvent<HTMLTableRowElement>, row: Row<T>) => void;
-    selectOnRowClick?: boolean; // If true, row click will toggle selection (default: false)
-
-    // Bulk action props
-    enableBulkActions?: boolean;
-    bulkActions?: (selectionState: SelectionState) => ReactNode;
-
-    // Column resizing props
-    enableColumnResizing?: boolean;
-    columnResizeMode?: ColumnResizeMode;
-    onColumnSizingChange?: (sizing: Record<string, number>) => void;
-
-    // Column ordering props
-    enableColumnDragging?: boolean;
-    onColumnDragEnd?: (columnOrder: string[]) => void;
-
-    // Column pinning props
-    enableColumnPinning?: boolean;
-    onColumnPinningChange?: (pinning: ColumnPinningState) => void;
-
-    // Column visibility props
-    enableColumnVisibility?: boolean;
-    onColumnVisibilityChange?: (visibility: Record<string, boolean>) => void;
-
-    // Expandable rows props
-    enableExpanding?: boolean;
-    getRowCanExpand?: (row: Row<T>) => boolean;
-    renderSubComponent?: (row: Row<T>) => ReactNode;
-
-    // Pagination props
-    enablePagination?: boolean;
-    paginationMode?: 'client' | 'server'; // Pagination mode (default: 'client')
-
-    // Filtering props
-    enableGlobalFilter?: boolean;
-    enableColumnFilter?: boolean;
-    filterMode?: 'client' | 'server'; // Filtering mode (default: 'client')
-
-    // Sorting props
-    enableSorting?: boolean;
-    sortingMode?: 'client' | 'server'; // Sorting mode (default: 'client')
-    onSortingChange?: (sorting: SortingState) => void;
-
-    // Styling props
-    enableHover?: boolean;
-    enableStripes?: boolean;
-    tableContainerProps?: any;
-    tableProps?: any;
-    fitToScreen?: boolean;
-    tableSize?: DataTableSize;
-
-    // Sticky header/footer props
-    enableStickyHeaderOrFooter?: boolean;
-    maxHeight?: string | number;
-
-    // Virtualization props
-    enableVirtualization?: boolean;
-    estimateRowHeight?: number;
-
-    // Toolbar props
-    enableTableSizeControl?: boolean;
-    enableExport?: boolean;
-    enableReset?: boolean;
-    enableRefresh?: boolean;
-
-    // Loading and empty states
-    loading?: boolean;
-    emptyMessage?: string | ReactNode;
-    skeletonRows?: number;
-
-    // Column filters props
-    onColumnFiltersChange?: (filterState: ColumnFilterState, isApplied?: boolean) => void;
-    onPaginationChange?: (pagination: PaginationState) => void;
-    onGlobalFilterChange?: (globalFilter: string) => void;
-    onColumnFilterChange?: (columnFilter: ColumnFilterState) => void;
-    // Slots for component customization (similar to MUI DataGrid)
-    slots?: Partial<DataTableSlots<T>>;
-    slotProps?: PartialSlotProps<T>;
-
-    // Logging configuration
-    logging?: boolean | DataTableLoggingOptions;
-}