@ackplus/react-tanstack-data-table 1.0.19-beta-0.6 → 1.0.19-beta-0.7

package/lib/hooks/use-data-table-api.js

@@ -1,673 +0,0 @@
-import { useImperativeHandle } from 'react';
-import { exportClientData, exportServerData } from '../utils/export-utils';
-export function useDataTableApi(props, ref) {
-    const { table, data, idKey, globalFilter, customColumnsFilter, sorting, pagination, columnOrder, columnPinning, enhancedColumns, enablePagination, enableColumnPinning, initialPageIndex, initialPageSize, pageSize, 
-    // Selection props
-    selectMode = 'page', onSelectionChange, handleColumnFilterStateChange, onDataStateChange, onFetchData, onDataChange, 
-    // Export props
-    exportFilename = 'export', onExportProgress, onExportComplete, onExportError, onServerExport, exportController, setExportController, isExporting, dataMode = 'client', } = props;
-    // Note: Custom selection is now handled by TanStack Table CustomSelectionFeature
-    useImperativeHandle(ref, () => ({
-        table: {
-            getTable: () => table,
-        },
-        // Column Management
-        columnVisibility: {
-            showColumn: (columnId) => {
-                table.getColumn(columnId)?.toggleVisibility(true);
-            },
-            hideColumn: (columnId) => {
-                table.getColumn(columnId)?.toggleVisibility(false);
-            },
-            toggleColumn: (columnId) => {
-                table.getColumn(columnId)?.toggleVisibility();
-            },
-            showAllColumns: () => {
-                table.toggleAllColumnsVisible(true);
-            },
-            hideAllColumns: () => {
-                table.toggleAllColumnsVisible(false);
-            },
-            resetColumnVisibility: () => {
-                table.resetColumnVisibility();
-            },
-        },
-        // Column Ordering
-        columnOrdering: {
-            setColumnOrder: (columnOrder) => {
-                table.setColumnOrder(columnOrder);
-            },
-            moveColumn: (columnId, toIndex) => {
-                const currentOrder = table.getState().columnOrder || [];
-                const currentIndex = currentOrder.indexOf(columnId);
-                if (currentIndex === -1)
-                    return;
-                const newOrder = [...currentOrder];
-                newOrder.splice(currentIndex, 1);
-                newOrder.splice(toIndex, 0, columnId);
-                table.setColumnOrder(newOrder);
-            },
-            resetColumnOrder: () => {
-                const initialOrder = enhancedColumns.map((col, index) => {
-                    if (col.id)
-                        return col.id;
-                    const anyCol = col;
-                    if (anyCol.accessorKey && typeof anyCol.accessorKey === 'string') {
-                        return anyCol.accessorKey;
-                    }
-                    return `column_${index}`;
-                });
-                table.setColumnOrder(initialOrder);
-            },
-        },
-        // Column Pinning
-        columnPinning: {
-            pinColumnLeft: (columnId) => {
-                const currentPinning = table.getState().columnPinning;
-                const newPinning = { ...currentPinning };
-                // Remove from right if exists
-                newPinning.right = (newPinning.right || []).filter(id => id !== columnId);
-                // Add to left if not exists
-                newPinning.left = [...(newPinning.left || []).filter(id => id !== columnId), columnId];
-                table.setColumnPinning(newPinning);
-            },
-            pinColumnRight: (columnId) => {
-                const currentPinning = table.getState().columnPinning;
-                const newPinning = { ...currentPinning };
-                // Remove from left if exists
-                newPinning.left = (newPinning.left || []).filter(id => id !== columnId);
-                // Add to right if not exists
-                newPinning.right = [...(newPinning.right || []).filter(id => id !== columnId), columnId];
-                table.setColumnPinning(newPinning);
-            },
-            unpinColumn: (columnId) => {
-                const currentPinning = table.getState().columnPinning;
-                const newPinning = {
-                    left: (currentPinning.left || []).filter(id => id !== columnId),
-                    right: (currentPinning.right || []).filter(id => id !== columnId),
-                };
-                table.setColumnPinning(newPinning);
-            },
-            setPinning: (pinning) => {
-                table.setColumnPinning(pinning);
-            },
-            resetColumnPinning: () => {
-                table.setColumnPinning(table.initialState.columnPinning);
-            },
-        },
-        // Column Resizing
-        columnResizing: {
-            resizeColumn: (columnId, width) => {
-                // Use table's setColumnSizing method
-                const currentSizing = table.getState().columnSizing;
-                table.setColumnSizing({
-                    ...currentSizing,
-                    [columnId]: width,
-                });
-            },
-            autoSizeColumn: (columnId) => {
-                // TanStack doesn't have built-in auto-size, so reset to default
-                table.getColumn(columnId)?.resetSize();
-            },
-            autoSizeAllColumns: () => {
-                table.resetColumnSizing();
-            },
-            resetColumnSizing: () => {
-                table.resetColumnSizing();
-            },
-        },
-        // Filtering
-        filtering: {
-            setGlobalFilter: (filter) => {
-                table.setGlobalFilter(filter);
-            },
-            clearGlobalFilter: () => {
-                table.setGlobalFilter('');
-            },
-            setCustomColumnFilters: (filters) => {
-                handleColumnFilterStateChange(filters);
-            },
-            addColumnFilter: (columnId, operator, value) => {
-                const newFilter = {
-                    id: `filter_${Date.now()}`,
-                    columnId,
-                    operator,
-                    value,
-                };
-                const currentFilters = customColumnsFilter.filters || [];
-                const newFilters = [...currentFilters, newFilter];
-                handleColumnFilterStateChange({
-                    filters: newFilters,
-                    logic: customColumnsFilter.logic,
-                    pendingFilters: customColumnsFilter.pendingFilters || [],
-                    pendingLogic: customColumnsFilter.pendingLogic || 'AND',
-                });
-            },
-            removeColumnFilter: (filterId) => {
-                const currentFilters = customColumnsFilter.filters || [];
-                const newFilters = currentFilters.filter((f) => f.id !== filterId);
-                handleColumnFilterStateChange({
-                    filters: newFilters,
-                    logic: customColumnsFilter.logic,
-                    pendingFilters: customColumnsFilter.pendingFilters || [],
-                    pendingLogic: customColumnsFilter.pendingLogic || 'AND',
-                });
-            },
-            clearAllFilters: () => {
-                table.setGlobalFilter('');
-                handleColumnFilterStateChange({
-                    filters: [],
-                    logic: 'AND',
-                    pendingFilters: [],
-                    pendingLogic: 'AND',
-                });
-            },
-            resetFilters: () => {
-                table.resetGlobalFilter();
-                handleColumnFilterStateChange({
-                    filters: [],
-                    logic: 'AND',
-                    pendingFilters: [],
-                    pendingLogic: 'AND',
-                });
-            },
-        },
-        // Sorting
-        sorting: {
-            setSorting: (sortingState) => {
-                table.setSorting(sortingState);
-            },
-            sortColumn: (columnId, direction) => {
-                const column = table.getColumn(columnId);
-                if (!column)
-                    return;
-                if (direction === false) {
-                    column.clearSorting();
-                }
-                else {
-                    column.toggleSorting(direction === 'desc');
-                }
-            },
-            clearSorting: () => {
-                table.resetSorting();
-            },
-            resetSorting: () => {
-                table.resetSorting();
-            },
-        },
-        // Pagination
-        pagination: {
-            goToPage: (pageIndex) => {
-                table.setPageIndex(pageIndex);
-            },
-            nextPage: () => {
-                table.nextPage();
-            },
-            previousPage: () => {
-                table.previousPage();
-            },
-            setPageSize: (pageSize) => {
-                table.setPageSize(pageSize);
-            },
-            goToFirstPage: () => {
-                table.setPageIndex(0);
-            },
-            goToLastPage: () => {
-                const pageCount = table.getPageCount();
-                if (pageCount > 0) {
-                    table.setPageIndex(pageCount - 1);
-                }
-            },
-        },
-        // Selection methods now use TanStack Table CustomSelectionFeature
-        // Access via table methods: table.selectRow(), table.getIsRowSelected(), etc.
-        selection: {
-            selectRow: (rowId) => table.selectRow?.(rowId),
-            deselectRow: (rowId) => table.deselectRow?.(rowId),
-            toggleRowSelection: (rowId) => table.toggleRowSelected?.(rowId),
-            selectAll: () => table.selectAll?.(),
-            deselectAll: () => table.deselectAll?.(),
-            toggleSelectAll: () => table.toggleAllRowsSelected?.(),
-            getSelectionState: () => table.getSelectionState?.() || { ids: [], type: 'include' },
-            getSelectedRows: () => table.getSelectedRows(),
-            getSelectedCount: () => table.getSelectedCount(),
-            isRowSelected: (rowId) => table.getIsRowSelected(rowId) || false,
-        },
-        // Data Management
-        data: {
-            refresh: () => {
-                // Call external data state change handler to trigger refresh
-                const currentFilters = {
-                    globalFilter,
-                    customColumnsFilter: customColumnsFilter,
-                    sorting,
-                    pagination,
-                };
-                if (onDataStateChange) {
-                    const currentState = {
-                        ...currentFilters,
-                        columnOrder,
-                        columnPinning,
-                    };
-                    onDataStateChange(currentState);
-                }
-                if (onFetchData) {
-                    onFetchData(currentFilters);
-                }
-            },
-            reload: () => {
-                // Same as refresh for now
-                const currentFilters = {
-                    globalFilter,
-                    customColumnsFilter: customColumnsFilter,
-                    sorting,
-                    pagination,
-                };
-                if (onDataStateChange) {
-                    const currentState = {
-                        ...currentFilters,
-                        columnOrder,
-                        columnPinning,
-                    };
-                    onDataStateChange({ ...currentState });
-                }
-                if (onFetchData) {
-                    onFetchData({ ...currentFilters });
-                }
-            },
-            // Data CRUD operations
-            getAllData: () => {
-                return [...data];
-            },
-            getRowData: (rowId) => {
-                return data.find(row => String(row[idKey]) === rowId);
-            },
-            getRowByIndex: (index) => {
-                return data[index];
-            },
-            updateRow: (rowId, updates) => {
-                const newData = data.map(row => String(row[idKey]) === rowId
-                    ? {
-                        ...row,
-                        ...updates,
-                    }
-                    : row);
-                onDataChange?.(newData);
-            },
-            updateRowByIndex: (index, updates) => {
-                const newData = [...data];
-                if (newData[index]) {
-                    newData[index] = {
-                        ...newData[index],
-                        ...updates,
-                    };
-                    onDataChange?.(newData);
-                }
-            },
-            insertRow: (newRow, index) => {
-                const newData = [...data];
-                if (index !== undefined) {
-                    newData.splice(index, 0, newRow);
-                }
-                else {
-                    newData.push(newRow);
-                }
-                onDataChange?.(newData);
-            },
-            deleteRow: (rowId) => {
-                const newData = data.filter(row => String(row[idKey]) !== rowId);
-                onDataChange?.(newData);
-            },
-            deleteRowByIndex: (index) => {
-                const newData = [...data];
-                newData.splice(index, 1);
-                onDataChange?.(newData);
-            },
-            deleteSelectedRows: () => {
-                const selectedRowIds = Object.keys(table.getState().rowSelection)
-                    .filter(key => table.getState().rowSelection[key]);
-                const newData = data.filter(row => !selectedRowIds.includes(String(row[idKey])));
-                onDataChange?.(newData);
-                // Clear selection after deletion
-                table.resetRowSelection();
-            },
-            replaceAllData: (newData) => {
-                onDataChange?.(newData);
-            },
-            // Bulk operations
-            updateMultipleRows: (updates) => {
-                const updateMap = new Map(updates.map(u => [u.rowId, u.data]));
-                const newData = data.map(row => {
-                    const rowId = String(row[idKey]);
-                    const updateData = updateMap.get(rowId);
-                    return updateData ? {
-                        ...row,
-                        ...updateData,
-                    } : row;
-                });
-                onDataChange?.(newData);
-            },
-            insertMultipleRows: (newRows, startIndex) => {
-                const newData = [...data];
-                if (startIndex !== undefined) {
-                    newData.splice(startIndex, 0, ...newRows);
-                }
-                else {
-                    newData.push(...newRows);
-                }
-                onDataChange?.(newData);
-            },
-            deleteMultipleRows: (rowIds) => {
-                const idsToDelete = new Set(rowIds);
-                const newData = data.filter(row => !idsToDelete.has(String(row[idKey])));
-                onDataChange?.(newData);
-            },
-            // Field-specific updates
-            updateField: (rowId, fieldName, value) => {
-                const newData = data.map(row => String(row[idKey]) === rowId
-                    ? {
-                        ...row,
-                        [fieldName]: value,
-                    }
-                    : row);
-                onDataChange?.(newData);
-            },
-            updateFieldByIndex: (index, fieldName, value) => {
-                const newData = [...data];
-                if (newData[index]) {
-                    newData[index] = {
-                        ...newData[index],
-                        [fieldName]: value,
-                    };
-                    onDataChange?.(newData);
-                }
-            },
-            // Data queries
-            findRows: (predicate) => {
-                return data.filter(predicate);
-            },
-            findRowIndex: (predicate) => {
-                return data.findIndex(predicate);
-            },
-            getDataCount: () => {
-                return data.length;
-            },
-            getFilteredDataCount: () => {
-                return table.getFilteredRowModel().rows.length;
-            },
-        },
-        // Layout Management
-        layout: {
-            resetLayout: () => {
-                table.resetColumnSizing();
-                table.resetColumnVisibility();
-                table.resetSorting();
-                table.resetGlobalFilter();
-            },
-            resetAll: () => {
-                // Reset everything to initial state
-                table.resetColumnSizing();
-                table.resetColumnVisibility();
-                table.resetSorting();
-                table.resetGlobalFilter();
-                table.resetColumnOrder();
-                table.resetExpanded();
-                table.resetRowSelection();
-                table.resetColumnPinning();
-                handleColumnFilterStateChange({
-                    filters: [],
-                    logic: 'AND',
-                    pendingFilters: [],
-                    pendingLogic: 'AND',
-                });
-                if (enablePagination) {
-                    table.setPageIndex(initialPageIndex);
-                    table.setPageSize(initialPageSize || pageSize);
-                }
-                if (enableColumnPinning) {
-                    table.setColumnPinning({
-                        left: [],
-                        right: [],
-                    });
-                }
-            },
-            saveLayout: () => {
-                return {
-                    columnVisibility: table.getState().columnVisibility,
-                    columnSizing: table.getState().columnSizing,
-                    columnOrder: table.getState().columnOrder,
-                    columnPinning: table.getState().columnPinning,
-                    sorting: table.getState().sorting,
-                    pagination: table.getState().pagination,
-                    globalFilter: table.getState().globalFilter,
-                    customColumnsFilter: customColumnsFilter,
-                };
-            },
-            restoreLayout: (layout) => {
-                if (layout.columnVisibility) {
-                    table.setColumnVisibility(layout.columnVisibility);
-                }
-                if (layout.columnSizing) {
-                    table.setColumnSizing(layout.columnSizing);
-                }
-                if (layout.columnOrder) {
-                    table.setColumnOrder(layout.columnOrder);
-                }
-                if (layout.columnPinning) {
-                    table.setColumnPinning(layout.columnPinning);
-                }
-                if (layout.sorting) {
-                    table.setSorting(layout.sorting);
-                }
-                if (layout.pagination && enablePagination) {
-                    table.setPagination(layout.pagination);
-                }
-                if (layout.globalFilter !== undefined) {
-                    table.setGlobalFilter(layout.globalFilter);
-                }
-                if (layout.customColumnsFilter) {
-                    handleColumnFilterStateChange(layout.customColumnsFilter);
-                }
-            },
-        },
-        // Table State
-        state: {
-            getTableState: () => {
-                return table.getState();
-            },
-            getCurrentFilters: () => {
-                return customColumnsFilter;
-            },
-            getCurrentSorting: () => {
-                return table.getState().sorting;
-            },
-            getCurrentPagination: () => {
-                return table.getState().pagination;
-            },
-            getCurrentSelection: () => {
-                return Object.keys(table.getState().rowSelection)
-                    .filter(key => table.getState().rowSelection[key]);
-            },
-        },
-        // Simplified Export
-        export: {
-            exportCSV: async (options = {}) => {
-                const { filename = exportFilename, } = options;
-                try {
-                    // Create abort controller for this export
-                    const controller = new AbortController();
-                    setExportController?.(controller);
-                    if (dataMode === 'server' && onServerExport) {
-                        // Server export with selection data
-                        const currentFilters = {
-                            globalFilter,
-                            customColumnsFilter,
-                            sorting,
-                            pagination,
-                            columnOrder,
-                            columnPinning,
-                        };
-                        await exportServerData(table, {
-                            format: 'csv',
-                            filename,
-                            fetchData: (filters, selection) => onServerExport(filters, selection),
-                            currentFilters,
-                            selection: table.getSelectionState?.(),
-                            onProgress: onExportProgress,
-                            onComplete: onExportComplete,
-                            onError: onExportError,
-                        });
-                    }
-                    else {
-                        // Client export - auto-detect selected rows if not specified
-                        await exportClientData(table, {
-                            format: 'csv',
-                            filename,
-                            onProgress: onExportProgress,
-                            onComplete: onExportComplete,
-                            onError: onExportError,
-                        });
-                    }
-                }
-                catch (error) {
-                    onExportError?.({
-                        message: error.message || 'Export failed',
-                        code: 'EXPORT_ERROR',
-                    });
-                }
-                finally {
-                    setExportController?.(null);
-                }
-            },
-            exportExcel: async (options = {}) => {
-                const { filename = exportFilename } = options;
-                try {
-                    // Create abort controller for this export
-                    const controller = new AbortController();
-                    setExportController?.(controller);
-                    if (dataMode === 'server' && onServerExport) {
-                        // Server export with selection data
-                        const currentFilters = {
-                            globalFilter,
-                            customColumnsFilter,
-                            sorting,
-                            pagination,
-                            columnOrder,
-                            columnPinning,
-                        };
-                        await exportServerData(table, {
-                            format: 'excel',
-                            filename,
-                            fetchData: (filters, selection) => onServerExport(filters, selection),
-                            currentFilters,
-                            selection: table.getSelectionState?.(),
-                            onProgress: onExportProgress,
-                            onComplete: onExportComplete,
-                            onError: onExportError,
-                        });
-                    }
-                    else {
-                        // Client export - auto-detect selected rows if not specified
-                        await exportClientData(table, {
-                            format: 'excel',
-                            filename,
-                            onProgress: onExportProgress,
-                            onComplete: onExportComplete,
-                            onError: onExportError,
-                        });
-                    }
-                }
-                catch (error) {
-                    onExportError?.({
-                        message: error.message || 'Export failed',
-                        code: 'EXPORT_ERROR',
-                    });
-                }
-                finally {
-                    setExportController?.(null);
-                }
-            },
-            exportServerData: async (options) => {
-                const { format, filename = exportFilename, fetchData = onServerExport, } = options;
-                if (!fetchData) {
-                    onExportError?.({
-                        message: 'No server export function provided',
-                        code: 'NO_SERVER_EXPORT',
-                    });
-                    return;
-                }
-                try {
-                    // Create abort controller for this export
-                    const controller = new AbortController();
-                    setExportController?.(controller);
-                    const currentFilters = {
-                        globalFilter,
-                        customColumnsFilter,
-                        sorting,
-                        pagination,
-                        columnOrder,
-                        columnPinning,
-                    };
-                    await exportServerData(table, {
-                        format,
-                        filename,
-                        fetchData: (filters, selection) => fetchData(filters, selection),
-                        currentFilters,
-                        selection: table.getSelectionState?.(),
-                        onProgress: onExportProgress,
-                        onComplete: onExportComplete,
-                        onError: onExportError,
-                    });
-                }
-                catch (error) {
-                    onExportError?.({
-                        message: error.message || 'Export failed',
-                        code: 'EXPORT_ERROR',
-                    });
-                }
-                finally {
-                    setExportController?.(null);
-                }
-            },
-            // Export state
-            isExporting: () => isExporting || false,
-            cancelExport: () => {
-                exportController?.abort();
-                setExportController?.(null);
-            },
-        },
-    }), [
-        table,
-        enhancedColumns,
-        handleColumnFilterStateChange,
-        customColumnsFilter,
-        data,
-        idKey,
-        onDataStateChange,
-        onFetchData,
-        globalFilter,
-        sorting,
-        pagination,
-        columnOrder,
-        columnPinning,
-        onDataChange,
-        enableColumnPinning,
-        enablePagination,
-        initialPageIndex,
-        initialPageSize,
-        pageSize,
-        // Export dependencies
-        exportFilename,
-        onExportProgress,
-        onExportComplete,
-        onExportError,
-        onServerExport,
-        exportController,
-        setExportController,
-        isExporting,
-        dataMode,
-        selectMode,
-        onSelectionChange,
-        // Note: custom selection removed from dependency array
-    ]);
-}

package/lib/hooks/use-table-state.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-table-state.d.ts","sourceRoot":"","sources":["../../../src/lib/hooks/use-table-state.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,EACH,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,kBAAkB,EAClB,eAAe,EAClB,MAAM,uBAAuB,CAAC;AAK/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAC;AAGjG;;GAEG;AACH,wBAAgB,aAAa,CAAC,OAAO,GAAE,oBAAyB;;;;;;;;;;;EAkF/D"}