@ackplus/react-tanstack-data-table 1.1.16 → 1.1.18

package/dist/lib/hooks/use-data-table-engine.js

@@ -0,0 +1,964 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDataTableEngine = useDataTableEngine;
+const react_table_1 = require("@tanstack/react-table");
+const react_virtual_1 = require("@tanstack/react-virtual");
+const styles_1 = require("@mui/material/styles");
+const react_1 = require("react");
+// your features / utils
+const column_filter_feature_1 = require("../features/column-filter.feature");
+const features_1 = require("../features");
+const special_columns_utils_1 = require("../utils/special-columns.utils");
+const utils_1 = require("../utils");
+const debounced_fetch_utils_1 = require("../utils/debounced-fetch.utils");
+const DEFAULT_INITIAL_STATE = {
+    sorting: [],
+    pagination: { pageIndex: 0, pageSize: 10 },
+    selectionState: { ids: [], type: "include" },
+    globalFilter: "",
+    expanded: {},
+    columnOrder: [],
+    columnPinning: { left: [], right: [] },
+    columnVisibility: {},
+    columnSizing: {},
+    columnFilter: {
+        filters: [],
+        logic: "AND",
+        pendingFilters: [],
+        pendingLogic: "AND",
+    },
+};
+function uiReducer(state, action) {
+    switch (action.type) {
+        case "SET_SORTING_RESET_PAGE":
+            return { ...state, sorting: action.payload, pagination: { pageIndex: 0, pageSize: state.pagination.pageSize } };
+        case "SET_PAGINATION":
+            return { ...state, pagination: action.payload };
+        case "SET_GLOBAL_FILTER_RESET_PAGE":
+            return { ...state, globalFilter: action.payload, pagination: { pageIndex: 0, pageSize: state.pagination.pageSize } };
+        case "SET_SELECTION":
+            return { ...state, selectionState: action.payload };
+        case "SET_COLUMN_FILTER":
+            return { ...state, columnFilter: action.payload };
+        case "SET_COLUMN_FILTER_RESET_PAGE":
+            return { ...state, columnFilter: action.payload, pagination: { pageIndex: 0, pageSize: state.pagination.pageSize } };
+        case "SET_EXPANDED":
+            return { ...state, expanded: action.payload };
+        case "SET_TABLE_SIZE":
+            return { ...state, tableSize: action.payload };
+        case "SET_COLUMN_ORDER":
+            return { ...state, columnOrder: action.payload };
+        case "SET_COLUMN_PINNING":
+            return { ...state, columnPinning: action.payload };
+        case "SET_COLUMN_VISIBILITY":
+            return { ...state, columnVisibility: action.payload };
+        case "SET_COLUMN_SIZING":
+            return { ...state, columnSizing: action.payload };
+        case "RESTORE_LAYOUT":
+            return { ...state, ...action.payload };
+        case "RESET_ALL":
+            return { ...state, ...action.payload };
+        default:
+            return state;
+    }
+}
+function useLatestRef(value) {
+    const ref = (0, react_1.useRef)(value);
+    (0, react_1.useEffect)(() => {
+        ref.current = value;
+    }, [value]);
+    return ref;
+}
+function useEvent(fn) {
+    const fnRef = useLatestRef(fn);
+    return (0, react_1.useCallback)(((...args) => fnRef.current(...args)), [fnRef]);
+}
+function useDataTableEngine(props) {
+    const { initialState, columns, data = [], totalRow = 0, idKey = "id", dataMode = "client", initialLoadData = true, onFetchData, onFetchStateChange, onDataStateChange, enableRowSelection = false, enableMultiRowSelection = true, selectMode = "page", isRowSelectable, onSelectionChange, enableBulkActions = false, enableColumnResizing = false, columnResizeMode = "onChange", onColumnSizingChange, enableColumnDragging = false, onColumnDragEnd, enableColumnPinning = false, onColumnPinningChange, onColumnVisibilityChange, enableColumnVisibility = true, enableExpanding = false, getRowCanExpand, enablePagination = false, paginationMode = "client", enableGlobalFilter = true, enableColumnFilter = false, filterMode = "client", enableSorting = true, sortingMode = "client", onSortingChange, exportFilename = "export", exportConcurrency = "cancelAndRestart", exportChunkSize = 1000, exportStrictTotalCheck = false, exportSanitizeCSV = true, onExportProgress, onExportComplete, onExportError, onServerExport, onExportCancel, onExportStateChange, fitToScreen = true, tableSize: initialTableSize = "medium", enableVirtualization = false, estimateRowHeight = 52, loading = false, onColumnFiltersChange, onPaginationChange, onGlobalFilterChange, slots = {}, slotProps = {}, } = props;
+    const theme = (0, styles_1.useTheme)();
+    const isServerMode = dataMode === "server";
+    const isServerPagination = paginationMode === "server" || isServerMode;
+    const isServerFiltering = filterMode === "server" || isServerMode;
+    const isServerSorting = sortingMode === "server" || isServerMode;
+    // --- initial config (memo)
+    const initialStateConfig = (0, react_1.useMemo)(() => {
+        const config = { ...DEFAULT_INITIAL_STATE, ...initialState };
+        return config;
+    }, [initialState]);
+    const initialUIState = (0, react_1.useMemo)(() => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        return ({
+            sorting: (_a = initialStateConfig.sorting) !== null && _a !== void 0 ? _a : DEFAULT_INITIAL_STATE.sorting,
+            pagination: (_b = initialStateConfig.pagination) !== null && _b !== void 0 ? _b : DEFAULT_INITIAL_STATE.pagination,
+            globalFilter: (_c = initialStateConfig.globalFilter) !== null && _c !== void 0 ? _c : DEFAULT_INITIAL_STATE.globalFilter,
+            selectionState: (_d = initialStateConfig.selectionState) !== null && _d !== void 0 ? _d : DEFAULT_INITIAL_STATE.selectionState,
+            columnFilter: (_e = initialStateConfig.columnFilter) !== null && _e !== void 0 ? _e : DEFAULT_INITIAL_STATE.columnFilter,
+            expanded: (_f = initialStateConfig.expanded) !== null && _f !== void 0 ? _f : {},
+            tableSize: (initialTableSize || "medium"),
+            columnOrder: (_g = initialStateConfig.columnOrder) !== null && _g !== void 0 ? _g : DEFAULT_INITIAL_STATE.columnOrder,
+            columnPinning: (_h = initialStateConfig.columnPinning) !== null && _h !== void 0 ? _h : DEFAULT_INITIAL_STATE.columnPinning,
+            columnVisibility: (_j = initialStateConfig.columnVisibility) !== null && _j !== void 0 ? _j : DEFAULT_INITIAL_STATE.columnVisibility,
+            columnSizing: (_k = initialStateConfig.columnSizing) !== null && _k !== void 0 ? _k : DEFAULT_INITIAL_STATE.columnSizing,
+        });
+    }, [initialStateConfig, initialTableSize]);
+    // --- UI state (reducer)
+    const [ui, dispatch] = (0, react_1.useReducer)(uiReducer, initialUIState);
+    // --- server data state (UI-affecting)
+    const [serverData, setServerData] = (0, react_1.useState)(null);
+    const [serverTotal, setServerTotal] = (0, react_1.useState)(0);
+    // --- export UI state
+    const [exportPhase, setExportPhase] = (0, react_1.useState)(null);
+    const [exportProgress, setExportProgress] = (0, react_1.useState)({});
+    const [exportController, setExportController] = (0, react_1.useState)(null);
+    const [queuedExportCount, setQueuedExportCount] = (0, react_1.useState)(0);
+    // --- refs (no-render control)
+    const tableContainerRef = (0, react_1.useRef)(null);
+    const apiRef = (0, react_1.useRef)(null);
+    const exportControllerRef = (0, react_1.useRef)(null);
+    const exportQueueRef = (0, react_1.useRef)(Promise.resolve());
+    const lastSentRef = (0, react_1.useRef)("");
+    // --- latest refs (prevent stale closures in stable API)
+    const uiRef = useLatestRef(ui);
+    const dataRef = useLatestRef(data);
+    ;
+    const serverDataRef = useLatestRef(serverData);
+    const nextFetchDelayRef = (0, react_1.useRef)(0);
+    // callbacks refs (super important)
+    const onFetchDataRef = useLatestRef(onFetchData);
+    const onFetchStateChangeRef = useLatestRef(onFetchStateChange);
+    const onDataStateChangeRef = useLatestRef(onDataStateChange);
+    const onSortingChangeRef = useLatestRef(onSortingChange);
+    const onPaginationChangeRef = useLatestRef(onPaginationChange);
+    const onGlobalFilterChangeRef = useLatestRef(onGlobalFilterChange);
+    const onColumnFiltersChangeRef = useLatestRef(onColumnFiltersChange);
+    const onColumnDragEndRef = useLatestRef(onColumnDragEnd);
+    const onColumnPinningChangeRef = useLatestRef(onColumnPinningChange);
+    const onColumnVisibilityChangeRef = useLatestRef(onColumnVisibilityChange);
+    const onColumnSizingChangeRef = useLatestRef(onColumnSizingChange);
+    const onSelectionChangeRef = useLatestRef(onSelectionChange);
+    const onExportProgressRef = useLatestRef(onExportProgress);
+    const onExportCompleteRef = useLatestRef(onExportComplete);
+    const onExportErrorRef = useLatestRef(onExportError);
+    const onExportCancelRef = useLatestRef(onExportCancel);
+    const onExportStateChangeRef = useLatestRef(onExportStateChange);
+    const onServerExportRef = useLatestRef(onServerExport);
+    // --- debounced fetch helper (can stay as-is)
+    const fetchHandler = useEvent((filters, opts) => { var _a; return (_a = onFetchDataRef.current) === null || _a === void 0 ? void 0 : _a.call(onFetchDataRef, filters, opts); });
+    const { debouncedFetch, isLoading: fetchLoading } = (0, debounced_fetch_utils_1.useDebouncedFetch)(fetchHandler);
+    const tableData = (0, react_1.useMemo)(() => {
+        return serverData !== null ? serverData : data;
+    }, [serverData, data]);
+    const tableTotalRow = (0, react_1.useMemo)(() => {
+        return serverData !== null ? serverTotal : totalRow || data.length;
+    }, [serverData, serverTotal, totalRow, data]);
+    const tableLoading = (0, react_1.useMemo)(() => {
+        return onFetchData ? loading || fetchLoading : loading;
+    }, [onFetchData, loading, fetchLoading]);
+    // --- columns enhancement
+    const enhancedColumns = (0, react_1.useMemo)(() => {
+        let cols = [...columns];
+        if (enableExpanding) {
+            cols = [
+                (0, special_columns_utils_1.createExpandingColumn)({
+                    ...((slotProps === null || slotProps === void 0 ? void 0 : slotProps.expandColumn) && typeof slotProps.expandColumn === "object"
+                        ? slotProps.expandColumn
+                        : {}),
+                }),
+                ...cols,
+            ];
+        }
+        if (enableRowSelection) {
+            cols = [
+                (0, special_columns_utils_1.createSelectionColumn)({
+                    ...((slotProps === null || slotProps === void 0 ? void 0 : slotProps.selectionColumn) && typeof slotProps.selectionColumn === "object"
+                        ? slotProps.selectionColumn
+                        : {}),
+                    multiSelect: enableMultiRowSelection,
+                }),
+                ...cols,
+            ];
+        }
+        return (0, utils_1.withIdsDeep)(cols);
+    }, [
+        columns,
+        enableExpanding,
+        enableRowSelection,
+        enableMultiRowSelection,
+        slotProps === null || slotProps === void 0 ? void 0 : slotProps.expandColumn,
+        slotProps === null || slotProps === void 0 ? void 0 : slotProps.selectionColumn,
+    ]);
+    // --- fetchData: useEvent so it's stable but reads latest state refs
+    const fetchData = useEvent(async (overrides = {}, options) => {
+        var _a, _b;
+        const s = uiRef.current;
+        const filters = {
+            globalFilter: s.globalFilter,
+            pagination: s.pagination,
+            columnFilter: s.columnFilter,
+            sorting: s.sorting,
+            ...overrides,
+        };
+        (_a = onFetchStateChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onFetchStateChangeRef, filters, options === null || options === void 0 ? void 0 : options.meta);
+        const handler = onFetchDataRef.current;
+        if (!handler)
+            return;
+        const delay = (_b = options === null || options === void 0 ? void 0 : options.delay) !== null && _b !== void 0 ? _b : 0;
+        const result = await debouncedFetch(filters, { debounceDelay: delay, meta: options === null || options === void 0 ? void 0 : options.meta });
+        if (result && Array.isArray(result.data) && result.total !== undefined) {
+            setServerData(result.data);
+            setServerTotal(result.total);
+        }
+        return result;
+    });
+    // --- derived selection counts
+    const isSomeRowsSelected = (0, react_1.useMemo)(() => {
+        if (!enableBulkActions || !enableRowSelection)
+            return false;
+        if (ui.selectionState.type === "exclude")
+            return ui.selectionState.ids.length < tableTotalRow;
+        return ui.selectionState.ids.length > 0;
+    }, [enableBulkActions, enableRowSelection, ui.selectionState, tableTotalRow]);
+    const selectedRowCount = (0, react_1.useMemo)(() => {
+        if (!enableBulkActions || !enableRowSelection)
+            return 0;
+        if (ui.selectionState.type === "exclude")
+            return tableTotalRow - ui.selectionState.ids.length;
+        return ui.selectionState.ids.length;
+    }, [enableBulkActions, enableRowSelection, ui.selectionState, tableTotalRow]);
+    // --- TanStack Table
+    const table = (0, react_table_1.useReactTable)({
+        _features: [column_filter_feature_1.ColumnFilterFeature, features_1.SelectionFeature],
+        data: tableData,
+        columns: enhancedColumns,
+        initialState: initialStateConfig,
+        state: {
+            ...(enableSorting ? { sorting: ui.sorting } : {}),
+            ...(enablePagination ? { pagination: ui.pagination } : {}),
+            ...(enableGlobalFilter ? { globalFilter: ui.globalFilter } : {}),
+            ...(enableExpanding ? { expanded: ui.expanded } : {}),
+            ...(enableColumnDragging ? { columnOrder: ui.columnOrder } : {}),
+            ...(enableColumnPinning ? { columnPinning: ui.columnPinning } : {}),
+            ...(enableColumnVisibility ? { columnVisibility: ui.columnVisibility } : {}),
+            ...(enableColumnResizing ? { columnSizing: ui.columnSizing } : {}),
+            ...(enableColumnFilter ? { columnFilter: ui.columnFilter } : {}),
+            ...(enableRowSelection ? { selectionState: ui.selectionState } : {}),
+        },
+        selectMode,
+        enableAdvanceSelection: !!enableRowSelection,
+        isRowSelectable: isRowSelectable,
+        ...(enableRowSelection
+            ? {
+                onSelectionStateChange: (updaterOrValue) => {
+                    dispatch({
+                        type: "SET_SELECTION",
+                        payload: typeof updaterOrValue === "function"
+                            ? updaterOrValue(uiRef.current.selectionState)
+                            : updaterOrValue,
+                    });
+                },
+            }
+            : {}),
+        enableAdvanceColumnFilter: enableColumnFilter,
+        onColumnFilterChange: (updater) => {
+            const next = typeof updater === "function" ? updater(uiRef.current.columnFilter) : updater;
+            dispatch({ type: "SET_COLUMN_FILTER", payload: next });
+        },
+        onColumnFilterApply: (state) => {
+            dispatch({ type: "SET_COLUMN_FILTER_RESET_PAGE", payload: state });
+        },
+        ...(enableSorting
+            ? {
+                onSortingChange: (updaterOrValue) => {
+                    var _a;
+                    const prev = uiRef.current.sorting;
+                    const next = typeof updaterOrValue === "function" ? updaterOrValue(prev) : updaterOrValue;
+                    const cleaned = (next || []).filter((s) => s === null || s === void 0 ? void 0 : s.id);
+                    (_a = onSortingChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onSortingChangeRef, cleaned);
+                    dispatch({ type: "SET_SORTING_RESET_PAGE", payload: cleaned });
+                },
+            }
+            : {}),
+        ...(enablePagination
+            ? {
+                onPaginationChange: (updater) => {
+                    var _a;
+                    const prev = uiRef.current.pagination;
+                    const next = typeof updater === "function" ? updater(prev) : updater;
+                    (_a = onPaginationChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPaginationChangeRef, next);
+                    dispatch({ type: "SET_PAGINATION", payload: next });
+                },
+            }
+            : {}),
+        ...(enableGlobalFilter
+            ? {
+                onGlobalFilterChange: (updaterOrValue) => {
+                    var _a;
+                    const prev = uiRef.current.globalFilter;
+                    const next = typeof updaterOrValue === "function" ? updaterOrValue(prev) : updaterOrValue;
+                    (_a = onGlobalFilterChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onGlobalFilterChangeRef, next);
+                    nextFetchDelayRef.current = 400;
+                    dispatch({ type: "SET_GLOBAL_FILTER_RESET_PAGE", payload: next });
+                },
+            }
+            : {}),
+        ...(enableExpanding ? { onExpandedChange: (u) => dispatch({ type: "SET_EXPANDED", payload: typeof u === "function" ? u(uiRef.current.expanded) : u }) } : {}),
+        ...(enableColumnDragging ? { onColumnOrderChange: (u) => dispatch({ type: "SET_COLUMN_ORDER", payload: typeof u === "function" ? u(uiRef.current.columnOrder) : u }) } : {}),
+        ...(enableColumnPinning ? { onColumnPinningChange: (u) => dispatch({ type: "SET_COLUMN_PINNING", payload: typeof u === "function" ? u(uiRef.current.columnPinning) : u }) } : {}),
+        ...(enableColumnVisibility ? { onColumnVisibilityChange: (u) => dispatch({ type: "SET_COLUMN_VISIBILITY", payload: typeof u === "function" ? u(uiRef.current.columnVisibility) : u }) } : {}),
+        ...(enableColumnResizing ? { onColumnSizingChange: (u) => dispatch({ type: "SET_COLUMN_SIZING", payload: typeof u === "function" ? u(uiRef.current.columnSizing) : u }) } : {}),
+        getCoreRowModel: (0, react_table_1.getCoreRowModel)(),
+        ...(enableSorting ? { getSortedRowModel: (0, react_table_1.getSortedRowModel)() } : {}),
+        ...(enableColumnFilter || enableGlobalFilter ? { getFilteredRowModel: (0, column_filter_feature_1.getCombinedFilteredRowModel)() } : {}),
+        ...(enablePagination && !isServerPagination ? { getPaginationRowModel: (0, react_table_1.getPaginationRowModel)() } : {}),
+        enableSorting,
+        manualSorting: isServerSorting,
+        manualFiltering: isServerFiltering,
+        enableColumnResizing,
+        columnResizeMode,
+        columnResizeDirection: theme.direction,
+        enableColumnPinning,
+        ...(enableExpanding ? { getRowCanExpand: getRowCanExpand } : {}),
+        manualPagination: isServerPagination,
+        autoResetPageIndex: false,
+        rowCount: enablePagination ? (tableTotalRow !== null && tableTotalRow !== void 0 ? tableTotalRow : tableData.length) : tableData.length,
+        getRowId: (row, index) => (0, utils_1.generateRowId)(row, index, idKey),
+    });
+    // --- layout sizing
+    const allLeafColumns = table.getAllLeafColumns();
+    const hasExplicitSizing = allLeafColumns.some((col) => {
+        const { size, minSize, maxSize } = col.columnDef;
+        return size !== undefined || minSize !== undefined || maxSize !== undefined;
+    });
+    const useFixedLayout = fitToScreen || enableColumnResizing || hasExplicitSizing;
+    const tableTotalSize = table.getTotalSize();
+    const tableWidth = fitToScreen ? "100%" : useFixedLayout ? tableTotalSize : "100%";
+    const tableStyle = {
+        width: tableWidth,
+        minWidth: fitToScreen ? tableTotalSize : undefined,
+        tableLayout: useFixedLayout ? "fixed" : "auto",
+    };
+    // --- virtualization
+    const rows = table.getRowModel().rows;
+    const rowVirtualizer = (0, react_virtual_1.useVirtualizer)({
+        count: rows.length,
+        getScrollElement: () => tableContainerRef.current,
+        estimateSize: () => estimateRowHeight,
+        overscan: 10,
+        enabled: enableVirtualization && !enablePagination && rows.length > 0,
+    });
+    const serverKey = (0, react_1.useMemo)(() => {
+        if (!(isServerMode || isServerPagination || isServerFiltering || isServerSorting))
+            return null;
+        return JSON.stringify({
+            sorting: ui.sorting,
+            pagination: ui.pagination,
+            globalFilter: ui.globalFilter,
+            columnFilter: { filters: ui.columnFilter.filters, logic: ui.columnFilter.logic }, // only applied
+        });
+    }, [isServerMode, isServerPagination, isServerFiltering, isServerSorting, ui.sorting, ui.pagination, ui.globalFilter, ui.columnFilter]);
+    const serverKeyRef = useLatestRef(serverKey);
+    const lastServerKeyRef = (0, react_1.useRef)(null);
+    // --- initial fetch
+    (0, react_1.useEffect)(() => {
+        if (!initialLoadData)
+            return;
+        // If we're in server mode, mark current serverKey as already handled
+        // so the serverKey effect doesn't immediately fetch again.
+        if (serverKeyRef.current) {
+            lastServerKeyRef.current = serverKeyRef.current;
+        }
+        if (onFetchData || onFetchStateChange) {
+            void fetchData({}, { delay: 0, meta: { reason: "initial" } });
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (!serverKey)
+            return;
+        if (serverKey === lastServerKeyRef.current)
+            return;
+        lastServerKeyRef.current = serverKey;
+        const delay = (_a = nextFetchDelayRef.current) !== null && _a !== void 0 ? _a : 0;
+        nextFetchDelayRef.current = 0; // reset after using
+        const timeoutId = setTimeout(() => {
+            void fetchData({}, { delay, meta: { reason: "stateChange" } });
+        }, 0);
+        return () => clearTimeout(timeoutId);
+    }, [serverKey, fetchData]);
+    // columnFilter apply handler stays explicit (button), but you can also auto-fetch on change if needed
+    const handleColumnFilterChangeHandler = (0, react_1.useCallback)((updater, isApply = false) => {
+        var _a;
+        const prev = uiRef.current.columnFilter;
+        const next = typeof updater === "function" ? updater(prev) : updater;
+        if (isApply) {
+            nextFetchDelayRef.current = 0;
+            dispatch({ type: "SET_COLUMN_FILTER_RESET_PAGE", payload: next });
+        }
+        else {
+            dispatch({ type: "SET_COLUMN_FILTER", payload: next });
+        }
+        (_a = onColumnFiltersChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onColumnFiltersChangeRef, next, isApply);
+    }, [onColumnFiltersChangeRef, uiRef]);
+    // --- emit table state (dedupe)
+    (0, react_1.useEffect)(() => {
+        const cb = onDataStateChangeRef.current;
+        if (!cb)
+            return;
+        const live = table.getState();
+        const payload = {
+            sorting: live.sorting,
+            pagination: live.pagination,
+            globalFilter: live.globalFilter,
+            columnFilter: live.columnFilter,
+            columnVisibility: live.columnVisibility,
+            columnSizing: live.columnSizing,
+            columnOrder: live.columnOrder,
+            columnPinning: live.columnPinning,
+        };
+        const key = JSON.stringify(payload);
+        if (key === lastSentRef.current)
+            return;
+        lastSentRef.current = key;
+        cb(payload);
+    }, [table, ui.sorting, ui.pagination, ui.globalFilter, ui.columnFilter, ui.columnVisibility, ui.columnSizing, ui.columnOrder, ui.columnPinning, onDataStateChangeRef]);
+    // --- helpers
+    const resetPageToFirst = (0, react_1.useCallback)(() => {
+        return { pageIndex: 0, pageSize: uiRef.current.pagination.pageSize };
+    }, [uiRef]);
+    const normalizeRefreshOptions = (0, react_1.useCallback)((options, fallbackReason = "refresh") => {
+        var _a, _b, _c;
+        if (typeof options === "boolean")
+            return { resetPagination: options, force: false, reason: fallbackReason };
+        return {
+            resetPagination: (_a = options === null || options === void 0 ? void 0 : options.resetPagination) !== null && _a !== void 0 ? _a : false,
+            force: (_b = options === null || options === void 0 ? void 0 : options.force) !== null && _b !== void 0 ? _b : false,
+            reason: (_c = options === null || options === void 0 ? void 0 : options.reason) !== null && _c !== void 0 ? _c : fallbackReason,
+        };
+    }, []);
+    const triggerRefresh = (0, react_1.useCallback)(async (options, fallbackReason = "refresh") => {
+        var _a;
+        const n = normalizeRefreshOptions(options, fallbackReason);
+        const current = uiRef.current.pagination;
+        const nextPagination = enablePagination
+            ? { pageIndex: n.resetPagination ? 0 : current.pageIndex, pageSize: current.pageSize }
+            : undefined;
+        if (nextPagination) {
+            nextFetchDelayRef.current = 0;
+            dispatch({ type: "SET_PAGINATION", payload: nextPagination });
+            (_a = onPaginationChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPaginationChangeRef, nextPagination);
+        }
+        const paginationChanged = !!nextPagination &&
+            (nextPagination.pageIndex !== current.pageIndex || nextPagination.pageSize !== current.pageSize);
+        if (!paginationChanged) {
+            await fetchData({}, { delay: 0, meta: { reason: n.reason, force: n.force } });
+        }
+    }, [enablePagination, fetchData, normalizeRefreshOptions, onPaginationChangeRef, uiRef]);
+    const getResetPayload = (0, react_1.useCallback)(() => {
+        var _a, _b, _c;
+        const resetSorting = initialStateConfig.sorting || [];
+        const resetGlobalFilter = (_a = initialStateConfig.globalFilter) !== null && _a !== void 0 ? _a : "";
+        const resetColumnFilter = ((_b = initialStateConfig.columnFilter) !== null && _b !== void 0 ? _b : DEFAULT_INITIAL_STATE.columnFilter);
+        const resetPagination = enablePagination
+            ? (initialStateConfig.pagination || { pageIndex: 0, pageSize: 10 })
+            : uiRef.current.pagination;
+        return {
+            sorting: resetSorting,
+            globalFilter: resetGlobalFilter,
+            columnFilter: resetColumnFilter,
+            ...(enablePagination ? { pagination: resetPagination } : {}),
+            selectionState: (_c = initialStateConfig.selectionState) !== null && _c !== void 0 ? _c : DEFAULT_INITIAL_STATE.selectionState,
+            expanded: {},
+            columnVisibility: initialStateConfig.columnVisibility || {},
+            columnSizing: initialStateConfig.columnSizing || {},
+            columnOrder: initialStateConfig.columnOrder || [],
+            columnPinning: initialStateConfig.columnPinning || { left: [], right: [] },
+        };
+    }, [enablePagination, initialStateConfig]);
+    const resetAllAndReload = (0, react_1.useCallback)(() => {
+        const payload = getResetPayload();
+        dispatch({ type: "RESET_ALL", payload });
+        void fetchData({
+            sorting: payload.sorting,
+            globalFilter: payload.globalFilter,
+            columnFilter: payload.columnFilter,
+            ...(enablePagination ? { pagination: payload.pagination } : {}),
+        }, { delay: 0, meta: { reason: "reset", force: true } });
+    }, [enablePagination, fetchData, getResetPayload]);
+    // --- export (refs + small UI state)
+    const setExportControllerSafely = (0, react_1.useCallback)((value) => {
+        setExportController((current) => {
+            const next = typeof value === "function" ? value(current) : value;
+            exportControllerRef.current = next;
+            return next;
+        });
+    }, []);
+    const handleExportProgressInternal = (0, react_1.useCallback)((p) => {
+        var _a;
+        setExportProgress(p || {});
+        (_a = onExportProgressRef.current) === null || _a === void 0 ? void 0 : _a.call(onExportProgressRef, p);
+    }, []);
+    const handleExportStateChangeInternal = (0, react_1.useCallback)((s) => {
+        var _a;
+        setExportPhase(s.phase);
+        if (s.processedRows !== undefined || s.totalRows !== undefined || s.percentage !== undefined) {
+            setExportProgress({
+                processedRows: s.processedRows,
+                totalRows: s.totalRows,
+                percentage: s.percentage,
+            });
+        }
+        (_a = onExportStateChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onExportStateChangeRef, s);
+    }, []);
+    const runExportWithPolicy = (0, react_1.useCallback)(async (options) => {
+        var _a;
+        const { format, filename, mode, execute } = options;
+        const startExecution = async () => {
+            const controller = new AbortController();
+            setExportProgress({});
+            setExportControllerSafely(controller);
+            try {
+                await execute(controller);
+            }
+            finally {
+                setExportControllerSafely((cur) => (cur === controller ? null : cur));
+            }
+        };
+        if (exportConcurrency === "queue") {
+            setQueuedExportCount((p) => p + 1);
+            const runQueued = async () => {
+                setQueuedExportCount((p) => Math.max(0, p - 1));
+                await startExecution();
+            };
+            const queuedPromise = exportQueueRef.current.catch(() => undefined).then(runQueued);
+            exportQueueRef.current = queuedPromise;
+            return queuedPromise;
+        }
+        const active = exportControllerRef.current;
+        if (active) {
+            if (exportConcurrency === "ignoreIfRunning") {
+                handleExportStateChangeInternal({
+                    phase: "error",
+                    mode,
+                    format,
+                    filename,
+                    message: "An export is already running",
+                    code: "EXPORT_IN_PROGRESS",
+                    endedAt: Date.now(),
+                });
+                (_a = onExportErrorRef.current) === null || _a === void 0 ? void 0 : _a.call(onExportErrorRef, { message: "An export is already running", code: "EXPORT_IN_PROGRESS" });
+                return;
+            }
+            if (exportConcurrency === "cancelAndRestart")
+                active.abort();
+        }
+        await startExecution();
+    }, [exportConcurrency, handleExportStateChangeInternal, onExportErrorRef, setExportControllerSafely]);
+    const handleCancelExport = (0, react_1.useCallback)(() => {
+        var _a;
+        const active = exportControllerRef.current;
+        if (!active)
+            return;
+        active.abort();
+        setExportControllerSafely((cur) => (cur === active ? null : cur));
+        (_a = onExportCancelRef.current) === null || _a === void 0 ? void 0 : _a.call(onExportCancelRef);
+    }, [onExportCancelRef, setExportControllerSafely]);
+    const isExporting = exportController !== null;
+    // --- stable API (created once)
+    if (!apiRef.current) {
+        apiRef.current = {};
+        // IMPORTANT: do NOT capture `table/ui/data` here. Always read from refs inside methods.
+        apiRef.current.table = { getTable: () => table }; // will be updated below via tableRef
+        // We'll overwrite getTable below with a ref-backed function.
+    }
+    // table ref so API always returns latest table instance
+    const tableRef = useLatestRef(table);
+    (0, react_1.useEffect)(() => {
+        const api = apiRef.current;
+        api.table = { getTable: () => tableRef.current };
+        // --- state getters
+        api.state = {
+            getTableState: () => tableRef.current.getState(),
+            getCurrentFilters: () => tableRef.current.getState().columnFilter,
+            getCurrentSorting: () => tableRef.current.getState().sorting,
+            getCurrentPagination: () => tableRef.current.getState().pagination,
+            getCurrentSelection: () => uiRef.current.selectionState,
+            getGlobalFilter: () => tableRef.current.getState().globalFilter,
+        };
+        // --- data
+        api.data = {
+            refresh: (options) => void triggerRefresh(options, "refresh"),
+            reload: (options = {}) => { var _a; return void triggerRefresh({ ...options, reason: (_a = options.reason) !== null && _a !== void 0 ? _a : "reload" }, "reload"); },
+            resetAll: () => resetAllAndReload(),
+            getAllData: () => {
+                const sData = serverDataRef.current;
+                const base = sData !== null ? sData : dataRef.current;
+                return [...base];
+            },
+            getDataCount: () => {
+                const sData = serverDataRef.current;
+                const base = sData !== null ? sData : dataRef.current;
+                return base.length;
+            },
+            getFilteredDataCount: () => tableRef.current.getFilteredRowModel().rows.length,
+        };
+        // --- sorting/pagination/filtering - dispatch + callbacks + server fetch policies
+        api.sorting = {
+            setSorting: (next) => {
+                var _a;
+                const cleaned = (next || []).filter((s) => s === null || s === void 0 ? void 0 : s.id);
+                (_a = onSortingChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onSortingChangeRef, cleaned);
+                nextFetchDelayRef.current = 0;
+                dispatch({ type: "SET_SORTING_RESET_PAGE", payload: cleaned });
+            },
+            clearSorting: () => {
+                var _a;
+                (_a = onSortingChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onSortingChangeRef, []);
+                nextFetchDelayRef.current = 0;
+                dispatch({ type: "SET_SORTING_RESET_PAGE", payload: [] });
+            },
+            resetSorting: () => {
+                var _a;
+                const next = (initialStateConfig.sorting || []);
+                (_a = onSortingChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onSortingChangeRef, next);
+                nextFetchDelayRef.current = 0;
+                dispatch({ type: "SET_SORTING_RESET_PAGE", payload: next });
+            },
+        };
+        api.pagination = {
+            goToPage: (pageIndex) => {
+                var _a;
+                const prev = uiRef.current.pagination;
+                const next = { ...prev, pageIndex };
+                (_a = onPaginationChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPaginationChangeRef, next);
+                nextFetchDelayRef.current = 0;
+                dispatch({ type: "SET_PAGINATION", payload: next });
+            },
+            setPageSize: (pageSize) => {
+                var _a;
+                const next = { pageIndex: 0, pageSize };
+                (_a = onPaginationChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPaginationChangeRef, next);
+                nextFetchDelayRef.current = 0;
+                dispatch({ type: "SET_PAGINATION", payload: next });
+            },
+            resetPagination: () => {
+                var _a;
+                const next = (initialStateConfig.pagination || { pageIndex: 0, pageSize: 10 });
+                (_a = onPaginationChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPaginationChangeRef, next);
+                nextFetchDelayRef.current = 0;
+                dispatch({ type: "SET_PAGINATION", payload: next });
+            },
+        };
+        api.filtering = {
+            setGlobalFilter: (filter) => {
+                var _a;
+                (_a = onGlobalFilterChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onGlobalFilterChangeRef, filter);
+                nextFetchDelayRef.current = 400;
+                dispatch({ type: "SET_GLOBAL_FILTER_RESET_PAGE", payload: filter });
+            },
+            clearGlobalFilter: () => {
+                var _a;
+                (_a = onGlobalFilterChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onGlobalFilterChangeRef, "");
+                nextFetchDelayRef.current = 400;
+                dispatch({ type: "SET_GLOBAL_FILTER_RESET_PAGE", payload: "" });
+            },
+            setColumnFilters: (filters, isApply = false) => handleColumnFilterChangeHandler(filters, isApply),
+        };
+        api.columnVisibility = {
+            showColumn: (id) => dispatch({ type: "SET_COLUMN_VISIBILITY", payload: { ...uiRef.current.columnVisibility, [id]: true } }),
+            hideColumn: (id) => dispatch({ type: "SET_COLUMN_VISIBILITY", payload: { ...uiRef.current.columnVisibility, [id]: false } }),
+            resetColumnVisibility: () => dispatch({ type: "SET_COLUMN_VISIBILITY", payload: initialStateConfig.columnVisibility || {} }),
+        };
+        api.columnOrdering = {
+            setColumnOrder: (next) => {
+                var _a;
+                dispatch({ type: "SET_COLUMN_ORDER", payload: next });
+                (_a = onColumnDragEndRef.current) === null || _a === void 0 ? void 0 : _a.call(onColumnDragEndRef, next);
+            },
+            resetColumnOrder: () => dispatch({ type: "SET_COLUMN_ORDER", payload: initialStateConfig.columnOrder || [] }),
+        };
+        api.columnPinning = {
+            setPinning: (next) => {
+                var _a;
+                dispatch({ type: "SET_COLUMN_PINNING", payload: next });
+                (_a = onColumnPinningChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onColumnPinningChangeRef, next);
+            },
+            resetColumnPinning: () => dispatch({ type: "SET_COLUMN_PINNING", payload: initialStateConfig.columnPinning || { left: [], right: [] } }),
+        };
+        api.columnResizing = {
+            resetColumnSizing: () => dispatch({ type: "SET_COLUMN_SIZING", payload: initialStateConfig.columnSizing || {} }),
+        };
+        api.selection = {
+            getSelectionState: () => { var _a, _b; return ((_b = (_a = tableRef.current).getSelectionState) === null || _b === void 0 ? void 0 : _b.call(_a)) || { ids: [], type: "include" }; },
+            getSelectedRows: () => tableRef.current.getSelectedRows(),
+            getSelectedCount: () => tableRef.current.getSelectedCount(),
+            isRowSelected: (rowId) => tableRef.current.getIsRowSelected(rowId) || false,
+            // keep using your table extension methods if you have them:
+            selectAll: () => { var _a, _b; return (_b = (_a = tableRef.current).selectAll) === null || _b === void 0 ? void 0 : _b.call(_a); },
+            deselectAll: () => { var _a, _b; return (_b = (_a = tableRef.current).deselectAll) === null || _b === void 0 ? void 0 : _b.call(_a); },
+        };
+        // --- export API (use your existing exportClientData/exportServerData)
+        api.export = {
+            exportCSV: async (options = {}) => {
+                var _a, _b, _c, _d;
+                const fn = (_a = options.filename) !== null && _a !== void 0 ? _a : exportFilename;
+                const chunkSize = (_b = options.chunkSize) !== null && _b !== void 0 ? _b : exportChunkSize;
+                const strictTotalCheck = (_c = options.strictTotalCheck) !== null && _c !== void 0 ? _c : exportStrictTotalCheck;
+                const sanitizeCSV = (_d = options.sanitizeCSV) !== null && _d !== void 0 ? _d : exportSanitizeCSV;
+                const mode = dataMode === "server" && !!onServerExportRef.current ? "server" : "client";
+                await runExportWithPolicy({
+                    format: "csv",
+                    filename: fn,
+                    mode,
+                    execute: async (controller) => {
+                        var _a, _b;
+                        // TODO: keep your state-change event mapping (starting/progress/completed/cancel/error)
+                        if (mode === "server" && onServerExportRef.current) {
+                            await (0, utils_1.exportServerData)(tableRef.current, {
+                                format: "csv",
+                                filename: fn,
+                                fetchData: (filters, selection, signal) => { var _a; return (_a = onServerExportRef.current) === null || _a === void 0 ? void 0 : _a.call(onServerExportRef, filters, selection, signal); },
+                                currentFilters: {
+                                    globalFilter: tableRef.current.getState().globalFilter,
+                                    columnFilter: tableRef.current.getState().columnFilter,
+                                    sorting: tableRef.current.getState().sorting,
+                                    pagination: tableRef.current.getState().pagination,
+                                },
+                                selection: (_b = (_a = tableRef.current).getSelectionState) === null || _b === void 0 ? void 0 : _b.call(_a),
+                                onProgress: handleExportProgressInternal,
+                                onComplete: onExportCompleteRef.current,
+                                onError: onExportErrorRef.current,
+                                onStateChange: (s) => handleExportStateChangeInternal({ ...s, mode, format: "csv", filename: fn, queueLength: queuedExportCount }),
+                                signal: controller.signal,
+                                chunkSize,
+                                strictTotalCheck,
+                                sanitizeCSV,
+                            });
+                            return;
+                        }
+                        await (0, utils_1.exportClientData)(tableRef.current, {
+                            format: "csv",
+                            filename: fn,
+                            onProgress: handleExportProgressInternal,
+                            onComplete: onExportCompleteRef.current,
+                            onError: onExportErrorRef.current,
+                            onStateChange: (s) => handleExportStateChangeInternal({ ...s, mode, format: "csv", filename: fn, queueLength: queuedExportCount }),
+                            signal: controller.signal,
+                            sanitizeCSV,
+                        });
+                    },
+                });
+            },
+            exportExcel: async (options = {}) => {
+                var _a, _b, _c, _d;
+                const fn = (_a = options.filename) !== null && _a !== void 0 ? _a : exportFilename;
+                const chunkSize = (_b = options.chunkSize) !== null && _b !== void 0 ? _b : exportChunkSize;
+                const strictTotalCheck = (_c = options.strictTotalCheck) !== null && _c !== void 0 ? _c : exportStrictTotalCheck;
+                const sanitizeCSV = (_d = options.sanitizeCSV) !== null && _d !== void 0 ? _d : exportSanitizeCSV;
+                const mode = dataMode === "server" && !!onServerExportRef.current ? "server" : "client";
+                await runExportWithPolicy({
+                    format: "excel",
+                    filename: fn,
+                    mode,
+                    execute: async (controller) => {
+                        var _a, _b;
+                        // TODO: keep your state-change event mapping (starting/progress/completed/cancel/error)
+                        if (mode === "server" && onServerExportRef.current) {
+                            await (0, utils_1.exportServerData)(tableRef.current, {
+                                format: "excel",
+                                filename: fn,
+                                fetchData: (filters, selection, signal) => { var _a; return (_a = onServerExportRef.current) === null || _a === void 0 ? void 0 : _a.call(onServerExportRef, filters, selection, signal); },
+                                currentFilters: {
+                                    globalFilter: tableRef.current.getState().globalFilter,
+                                    columnFilter: tableRef.current.getState().columnFilter,
+                                    sorting: tableRef.current.getState().sorting,
+                                    pagination: tableRef.current.getState().pagination,
+                                },
+                                selection: (_b = (_a = tableRef.current).getSelectionState) === null || _b === void 0 ? void 0 : _b.call(_a),
+                                onProgress: handleExportProgressInternal,
+                                onComplete: onExportCompleteRef.current,
+                                onError: onExportErrorRef.current,
+                                onStateChange: (s) => handleExportStateChangeInternal({ ...s, mode, format: "csv", filename: fn, queueLength: queuedExportCount }),
+                                signal: controller.signal,
+                                chunkSize,
+                                strictTotalCheck,
+                                sanitizeCSV,
+                            });
+                            return;
+                        }
+                        await (0, utils_1.exportClientData)(tableRef.current, {
+                            format: "excel",
+                            filename: fn,
+                            onProgress: handleExportProgressInternal,
+                            onComplete: onExportCompleteRef.current,
+                            onError: onExportErrorRef.current,
+                            onStateChange: (s) => handleExportStateChangeInternal({ ...s, mode, format: "csv", filename: fn, queueLength: queuedExportCount }),
+                            signal: controller.signal,
+                            sanitizeCSV,
+                        });
+                    },
+                });
+            },
+            isExporting: () => exportControllerRef.current != null,
+            cancelExport: () => handleCancelExport(),
+        };
+    }, [dataMode, exportChunkSize, exportFilename, exportSanitizeCSV, exportStrictTotalCheck, fetchData, handleCancelExport, handleColumnFilterChangeHandler, handleExportProgressInternal, handleExportStateChangeInternal, initialStateConfig, isServerMode, isServerPagination, isServerSorting, resetAllAndReload, resetPageToFirst, runExportWithPolicy, triggerRefresh, queuedExportCount, tableRef, uiRef, serverDataRef, dataRef, onSortingChangeRef, onPaginationChangeRef, onGlobalFilterChangeRef, onColumnDragEndRef, onColumnPinningChangeRef, onServerExportRef, onExportCompleteRef, onExportErrorRef]);
+    // --- imperative handlers (used by TanStack callbacks above or view)
+    const handleSortingChange = (0, react_1.useCallback)((updaterOrValue) => {
+        var _a;
+        const prev = uiRef.current.sorting;
+        const next = typeof updaterOrValue === "function" ? updaterOrValue(prev) : updaterOrValue;
+        const cleaned = (next || []).filter((s) => s === null || s === void 0 ? void 0 : s.id);
+        (_a = onSortingChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onSortingChangeRef, cleaned);
+        nextFetchDelayRef.current = 0;
+        dispatch({ type: "SET_SORTING_RESET_PAGE", payload: cleaned });
+    }, [onSortingChangeRef, uiRef]);
+    const handlePaginationChange = (0, react_1.useCallback)((updater) => {
+        var _a;
+        const prev = uiRef.current.pagination;
+        const next = typeof updater === "function" ? updater(prev) : updater;
+        (_a = onPaginationChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onPaginationChangeRef, next);
+        nextFetchDelayRef.current = 0;
+        dispatch({ type: "SET_PAGINATION", payload: next });
+    }, [onPaginationChangeRef, uiRef]);
+    const handleGlobalFilterChange = (0, react_1.useCallback)((updaterOrValue) => {
+        var _a;
+        const prev = uiRef.current.globalFilter;
+        const next = typeof updaterOrValue === "function" ? updaterOrValue(prev) : updaterOrValue;
+        (_a = onGlobalFilterChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onGlobalFilterChangeRef, next);
+        nextFetchDelayRef.current = 400;
+        dispatch({ type: "SET_GLOBAL_FILTER_RESET_PAGE", payload: next });
+    }, [onGlobalFilterChangeRef, uiRef]);
+    const handleColumnOrderChange = (0, react_1.useCallback)((updated) => {
+        var _a;
+        const prev = uiRef.current.columnOrder;
+        const next = typeof updated === "function" ? updated(prev) : updated;
+        dispatch({ type: "SET_COLUMN_ORDER", payload: next });
+        (_a = onColumnDragEndRef.current) === null || _a === void 0 ? void 0 : _a.call(onColumnDragEndRef, next);
+    }, [onColumnDragEndRef, uiRef]);
+    const handleColumnPinningChange = (0, react_1.useCallback)((updated) => {
+        var _a;
+        const prev = uiRef.current.columnPinning;
+        const next = typeof updated === "function" ? updated(prev) : updated;
+        dispatch({ type: "SET_COLUMN_PINNING", payload: next });
+        (_a = onColumnPinningChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onColumnPinningChangeRef, next);
+    }, [onColumnPinningChangeRef, uiRef]);
+    const handleColumnVisibilityChange = (0, react_1.useCallback)((updated) => {
+        var _a;
+        const prev = uiRef.current.columnVisibility;
+        const next = typeof updated === "function" ? updated(prev) : updated;
+        dispatch({ type: "SET_COLUMN_VISIBILITY", payload: next });
+        (_a = onColumnVisibilityChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onColumnVisibilityChangeRef, next);
+    }, [onColumnVisibilityChangeRef, uiRef]);
+    const handleColumnSizingChange = (0, react_1.useCallback)((updated) => {
+        var _a;
+        const prev = uiRef.current.columnSizing;
+        const next = typeof updated === "function" ? updated(prev) : updated;
+        dispatch({ type: "SET_COLUMN_SIZING", payload: next });
+        (_a = onColumnSizingChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onColumnSizingChangeRef, next);
+    }, [onColumnSizingChangeRef, uiRef]);
+    const handleColumnReorder = (0, react_1.useCallback)((draggedId, targetId) => {
+        const currentOrder = uiRef.current.columnOrder.length > 0
+            ? uiRef.current.columnOrder
+            : enhancedColumns.map((c, idx) => { var _a, _b; return (_b = (_a = c.id) !== null && _a !== void 0 ? _a : c.accessorKey) !== null && _b !== void 0 ? _b : `column_${idx}`; });
+        const from = currentOrder.indexOf(draggedId);
+        const to = currentOrder.indexOf(targetId);
+        if (from === -1 || to === -1)
+            return;
+        const next = [...currentOrder];
+        next.splice(from, 1);
+        next.splice(to, 0, draggedId);
+        handleColumnOrderChange(next);
+    }, [enhancedColumns, handleColumnOrderChange, uiRef]);
+    // optional: selection callback
+    (0, react_1.useEffect)(() => {
+        var _a;
+        (_a = onSelectionChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onSelectionChangeRef, ui.selectionState);
+    }, [onSelectionChangeRef, ui.selectionState]);
+    // --- provider props
+    const providerProps = (0, react_1.useMemo)(() => ({
+        table,
+        apiRef,
+        dataMode,
+        tableSize: ui.tableSize,
+        onTableSizeChange: (size) => dispatch({ type: "SET_TABLE_SIZE", payload: size }),
+        columnFilter: ui.columnFilter,
+        onChangeColumnFilter: (f) => handleColumnFilterChangeHandler(f, false),
+        slots,
+        slotProps,
+        isExporting,
+        exportController,
+        exportPhase,
+        exportProgress,
+        onCancelExport: handleCancelExport,
+        exportFilename,
+        onExportProgress,
+        onExportComplete,
+        onExportError,
+        onServerExport,
+    }), [
+        table,
+        dataMode,
+        ui.tableSize,
+        ui.columnFilter,
+        slots,
+        slotProps,
+        isExporting,
+        exportController,
+        exportPhase,
+        exportProgress,
+        handleCancelExport,
+        exportFilename,
+        onExportProgress,
+        onExportComplete,
+        onExportError,
+        onServerExport,
+        handleColumnFilterChangeHandler,
+    ]);
+    return {
+        table,
+        refs: {
+            tableContainerRef,
+            apiRef,
+            exportControllerRef,
+        },
+        derived: {
+            isServerMode,
+            isServerPagination,
+            isServerFiltering,
+            isServerSorting,
+            tableData,
+            tableTotalRow,
+            tableLoading,
+            rows,
+            visibleLeafColumns: table.getVisibleLeafColumns,
+            useFixedLayout,
+            tableStyle,
+            isExporting,
+            exportPhase,
+            exportProgress,
+            isSomeRowsSelected,
+            selectedRowCount,
+        },
+        state: ui,
+        actions: {
+            fetchData,
+            handleSortingChange,
+            handlePaginationChange,
+            handleGlobalFilterChange,
+            handleColumnFilterChangeHandler,
+            handleColumnOrderChange,
+            handleColumnPinningChange,
+            handleColumnVisibilityChange,
+            handleColumnSizingChange,
+            handleColumnReorder,
+            resetAllAndReload,
+            triggerRefresh,
+            setTableSize: (size) => dispatch({ type: "SET_TABLE_SIZE", payload: size }),
+            handleCancelExport,
+            renderRowModel: { rowVirtualizer },
+        },
+        api: apiRef.current,
+        providerProps,
+    };
+}