@alaarab/ogrid-react 2.0.23 → 2.1.0

package/dist/esm/hooks/useOGridDataFetching.js

@@ -0,0 +1,74 @@
+import { useState, useEffect, useRef, useMemo } from 'react';
+import { processClientSideData } from '../utils';
+/**
+ * Manages data fetching (server-side) and client-side filtering/sorting/pagination.
+ * Fires onFirstDataRendered once when items first appear.
+ */
+export function useOGridDataFetching(params) {
+    const { isServerSide, dataSource, displayData, columns, stableFilters, filters, sort, page, pageSize, onError, onFirstDataRendered, } = params;
+    const isClientSide = !isServerSide;
+    // --- Client-side filtering & sorting ---
+    const clientItemsAndTotal = useMemo(() => {
+        if (!isClientSide)
+            return null;
+        const rows = processClientSideData(displayData, columns, stableFilters, sort.field, sort.direction);
+        const total = rows.length;
+        const start = (page - 1) * pageSize;
+        const paged = rows.slice(start, start + pageSize);
+        return { items: paged, totalCount: total };
+    }, [isClientSide, displayData, columns, stableFilters, sort.field, sort.direction, page, pageSize]);
+    // --- Server-side data fetching ---
+    const [serverItems, setServerItems] = useState([]);
+    const [serverTotalCount, setServerTotalCount] = useState(0);
+    const [serverLoading, setServerLoading] = useState(true);
+    const fetchIdRef = useRef(0);
+    const [refreshCounter, setRefreshCounter] = useState(0);
+    useEffect(() => {
+        if (!isServerSide || !dataSource) {
+            if (!isServerSide)
+                setServerLoading(false);
+            return;
+        }
+        const id = ++fetchIdRef.current;
+        setServerLoading(true);
+        dataSource
+            .fetchPage({
+            page, pageSize,
+            sort: { field: sort.field, direction: sort.direction },
+            filters,
+        })
+            .then((res) => {
+            if (id !== fetchIdRef.current)
+                return;
+            setServerItems(res.items);
+            setServerTotalCount(res.totalCount);
+        })
+            .catch((err) => {
+            if (id !== fetchIdRef.current)
+                return;
+            onError?.(err);
+            setServerItems([]);
+            setServerTotalCount(0);
+        })
+            .finally(() => {
+            if (id === fetchIdRef.current)
+                setServerLoading(false);
+        });
+    }, [isServerSide, dataSource, page, pageSize, sort.field, sort.direction, filters, onError, refreshCounter]);
+    const displayItems = isClientSide && clientItemsAndTotal ? clientItemsAndTotal.items : serverItems;
+    const displayTotalCount = isClientSide && clientItemsAndTotal ? clientItemsAndTotal.totalCount : serverTotalCount;
+    // Fire onFirstDataRendered once when the grid first has data
+    const firstDataRenderedRef = useRef(false);
+    useEffect(() => {
+        if (!firstDataRenderedRef.current && displayItems.length > 0) {
+            firstDataRenderedRef.current = true;
+            onFirstDataRendered?.();
+        }
+    }, [displayItems.length, onFirstDataRendered]);
+    return {
+        displayItems,
+        displayTotalCount,
+        serverLoading,
+        refreshData: () => setRefreshCounter((prev) => prev + 1),
+    };
+}

package/dist/esm/hooks/useOGridFilters.js

@@ -0,0 +1,59 @@
+import { useState, useCallback, useMemo } from 'react';
+import { mergeFilter, deriveFilterOptionsFromData, getMultiSelectFilterFields, } from '../utils';
+import { useFilterOptions } from './useFilterOptions';
+import { useShallowEqualMemo } from './useShallowEqualMemo';
+/** Deep-equal check for filter objects (shallow key+value comparison). */
+function filtersEqual(a, b) {
+    const aKeys = Object.keys(a);
+    const bKeys = Object.keys(b);
+    if (aKeys.length !== bKeys.length)
+        return false;
+    for (let i = 0; i < bKeys.length; i++) {
+        if (a[bKeys[i]] !== b[bKeys[i]])
+            return false;
+    }
+    return true;
+}
+const EMPTY_LOADING_OPTIONS = {};
+const EMPTY_DATA_SOURCE = { fetchFilterOptions: undefined };
+/**
+ * Manages filter state, filter options (client + server), and stabilized filter reference.
+ * Resets to page 1 on filter change.
+ */
+export function useOGridFilters(params) {
+    const { controlledFilters, onFiltersChange, setPage, columns, displayData, dataSource } = params;
+    const [internalFilters, setInternalFilters] = useState({});
+    const filters = controlledFilters ?? internalFilters;
+    const setFilters = useCallback((f) => {
+        if (controlledFilters === undefined)
+            setInternalFilters(f);
+        onFiltersChange?.(f);
+        setPage(1);
+    }, [controlledFilters, onFiltersChange, setPage]);
+    const handleFilterChange = useCallback((key, value) => {
+        setFilters(mergeFilter(filters, key, value));
+    }, [filters, setFilters]);
+    // Stabilize filters via shallow comparison so processClientSideData useMemo
+    // doesn't re-run when the filter object reference changes but values are identical.
+    const stableFilters = useShallowEqualMemo(filters, (a, b) => filtersEqual(a, b));
+    const hasActiveFilters = useMemo(() => Object.values(filters).some((v) => v !== undefined), [filters]);
+    // --- Filter options (server or client-derived) ---
+    const multiSelectFilterFields = useMemo(() => getMultiSelectFilterFields(columns), [columns]);
+    const filterOptionsSource = dataSource ?? EMPTY_DATA_SOURCE;
+    const { filterOptions: serverFilterOptions, loadingOptions: loadingFilterOptions } = useFilterOptions(filterOptionsSource, multiSelectFilterFields);
+    const hasServerFilterOptions = dataSource?.fetchFilterOptions != null;
+    const clientFilterOptions = useMemo(() => {
+        if (hasServerFilterOptions)
+            return serverFilterOptions;
+        return deriveFilterOptionsFromData(displayData, columns);
+    }, [hasServerFilterOptions, displayData, columns, serverFilterOptions]);
+    return {
+        filters,
+        setFilters,
+        handleFilterChange,
+        stableFilters,
+        hasActiveFilters,
+        clientFilterOptions,
+        loadingFilterOptions: dataSource?.fetchFilterOptions ? loadingFilterOptions : EMPTY_LOADING_OPTIONS,
+    };
+}

package/dist/esm/hooks/useOGridPagination.js

@@ -0,0 +1,24 @@
+import { useState, useCallback } from 'react';
+/**
+ * Manages pagination state with controlled/uncontrolled dual-mode support.
+ * Resets to page 1 when page size changes.
+ */
+export function useOGridPagination(params) {
+    const { controlledPage, controlledPageSize, defaultPageSize, onPageChange, onPageSizeChange } = params;
+    const [internalPage, setInternalPage] = useState(1);
+    const [internalPageSize, setInternalPageSize] = useState(defaultPageSize);
+    const page = controlledPage ?? internalPage;
+    const pageSize = controlledPageSize ?? internalPageSize;
+    const setPage = useCallback((p) => {
+        if (controlledPage === undefined)
+            setInternalPage(p);
+        onPageChange?.(p);
+    }, [controlledPage, onPageChange]);
+    const setPageSize = useCallback((size) => {
+        if (controlledPageSize === undefined)
+            setInternalPageSize(size);
+        onPageSizeChange?.(size);
+        setPage(1);
+    }, [controlledPageSize, onPageSizeChange, setPage]);
+    return { page, pageSize, setPage, setPageSize };
+}

package/dist/esm/hooks/useOGridSorting.js

@@ -0,0 +1,24 @@
+import { useState, useCallback } from 'react';
+import { computeNextSortState } from '../utils';
+/**
+ * Manages sort state with controlled/uncontrolled dual-mode support.
+ * Resets to page 1 on sort change.
+ */
+export function useOGridSorting(params) {
+    const { controlledSort, defaultSortField, defaultSortDirection, onSortChange, setPage } = params;
+    const [internalSort, setInternalSort] = useState({
+        field: defaultSortField,
+        direction: defaultSortDirection,
+    });
+    const sort = controlledSort ?? internalSort;
+    const setSort = useCallback((s) => {
+        if (controlledSort === undefined)
+            setInternalSort(s);
+        onSortChange?.(s);
+        setPage(1);
+    }, [controlledSort, onSortChange, setPage]);
+    const handleSort = useCallback((columnKey, direction) => {
+        setSort(computeNextSortState(sort, columnKey, direction));
+    }, [sort, setSort]);
+    return { sort, setSort, handleSort, defaultSortField, defaultSortDirection };
+}

package/dist/esm/hooks/usePaginationControls.js

@@ -1,4 +1,4 @@
-import { useMemo, useCallback } from 'react';
+import { useMemo } from 'react';
 import { getPaginationViewModel } from '../utils';
 /**
  * Shared pagination controls logic for React UI packages.
@@ -8,12 +8,9 @@ export function usePaginationControls(props) {
     const { currentPage, pageSize, totalCount, onPageSizeChange, pageSizeOptions, entityLabelPlural } = props;
     const labelPlural = entityLabelPlural ?? 'items';
     const vm = useMemo(() => getPaginationViewModel(currentPage, pageSize, totalCount, pageSizeOptions ? { pageSizeOptions } : undefined), [currentPage, pageSize, totalCount, pageSizeOptions]);
-    const handlePageSizeChange = useCallback((value) => {
-        onPageSizeChange(value);
-    }, [onPageSizeChange]);
     return {
         labelPlural,
         vm,
-        handlePageSizeChange,
+        handlePageSizeChange: onPageSizeChange,
     };
 }

package/dist/esm/hooks/usePeopleFilterState.js

@@ -8,6 +8,7 @@ import { PEOPLE_SEARCH_DEBOUNCE_MS } from '@alaarab/ogrid-core';
 export function usePeopleFilterState(params) {
     const { onUserChange, peopleSearch, isFilterOpen, filterType } = params;
     const peopleInputRef = useRef(null);
+    const focusTimeoutRef = useRef(undefined);
     const peopleSearchTimeoutRef = useRef(undefined);
     const [peopleSuggestions, setPeopleSuggestions] = useState([]);
     const [isPeopleLoading, setIsPeopleLoading] = useState(false);
@@ -18,9 +19,13 @@ export function usePeopleFilterState(params) {
             setPeopleSearchText('');
             setPeopleSuggestions([]);
             if (filterType === 'people') {
-                setTimeout(() => peopleInputRef.current?.focus(), 50);
+                focusTimeoutRef.current = window.setTimeout(() => peopleInputRef.current?.focus(), 50);
             }
         }
+        return () => {
+            if (focusTimeoutRef.current)
+                window.clearTimeout(focusTimeoutRef.current);
+        };
     }, [isFilterOpen, filterType]);
     // People search with debounce
     useEffect(() => {

package/dist/esm/hooks/useRichSelectState.js

@@ -1,4 +1,10 @@
 import { useState, useCallback, useMemo } from 'react';
+/** Shared display text formatter for select and rich-select editors. */
+export function getSelectDisplayText(value, formatValue) {
+    if (formatValue)
+        return formatValue(value);
+    return value != null ? String(value) : '';
+}
 /**
  * Manages searchable rich select editor state with keyboard navigation (arrow keys, enter, escape).
  * @param params - Values, format function, initial value, and commit/cancel callbacks.
@@ -8,11 +14,7 @@ export function useRichSelectState(params) {
     const { values, formatValue, onCommit, onCancel } = params;
     const [searchText, setSearchText] = useState('');
     const [highlightedIndex, setHighlightedIndex] = useState(0);
-    const getDisplayText = useCallback((value) => {
-        if (formatValue)
-            return formatValue(value);
-        return value != null ? String(value) : '';
-    }, [formatValue]);
+    const getDisplayText = useCallback((value) => getSelectDisplayText(value, formatValue), [formatValue]);
     const filteredValues = useMemo(() => {
         if (!searchText.trim())
             return values;

package/dist/esm/hooks/useRowSelection.js

@@ -1,5 +1,6 @@
 import { useState, useCallback, useRef, useMemo } from 'react';
 import { useLatestRef } from './useLatestRef';
+import { applyRangeRowSelection, computeRowSelectionState } from '../utils';
 /**
  * Manages row selection state for single or multiple selection modes with shift-click range support.
  * @param params - Items, getRowId, selection mode, controlled state, and selection change callback.
@@ -33,22 +34,13 @@ export function useRowSelection(params) {
             lastClickedRowRef.current = rowIndex;
             return;
         }
-        const next = new Set(selectedRowIdsRef.current);
         const currentItems = itemsRef.current;
+        let next;
         if (shiftKey && lastClickedRowRef.current >= 0 && lastClickedRowRef.current !== rowIndex) {
-            const start = Math.min(lastClickedRowRef.current, rowIndex);
-            const end = Math.max(lastClickedRowRef.current, rowIndex);
-            for (let i = start; i <= end; i++) {
-                if (i < currentItems.length) {
-                    const id = getRowId(currentItems[i]);
-                    if (checked)
-                        next.add(id);
-                    else
-                        next.delete(id);
-                }
-            }
+            next = applyRangeRowSelection(lastClickedRowRef.current, rowIndex, checked, currentItems, getRowId, selectedRowIdsRef.current);
         }
         else {
+            next = new Set(selectedRowIdsRef.current);
             if (checked)
                 next.add(rowId);
             else
@@ -56,9 +48,7 @@ export function useRowSelection(params) {
         }
         lastClickedRowRef.current = rowIndex;
         updateSelection(next);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- itemsRef, selectedRowIdsRef are stable refs
-    [rowSelection, getRowId, updateSelection]);
+    }, [rowSelection, getRowId, updateSelection, itemsRef, selectedRowIdsRef]);
     const handleSelectAll = useCallback((checked) => {
         if (checked) {
             updateSelection(new Set(items.map((item) => getRowId(item))));
@@ -67,17 +57,7 @@ export function useRowSelection(params) {
             updateSelection(new Set());
         }
     }, [items, getRowId, updateSelection]);
-    const allSelected = useMemo(() => {
-        if (selectedRowIds.size === 0 || items.length === 0)
-            return false;
-        return items.every((item) => selectedRowIds.has(getRowId(item)));
-    }, [items, selectedRowIds, getRowId]);
-    const someSelected = useMemo(() => {
-        if (allSelected)
-            return false;
-        // No iteration needed — any selected row means "some" are selected
-        return selectedRowIds.size > 0;
-    }, [allSelected, selectedRowIds.size]);
+    const { allSelected, someSelected } = useMemo(() => computeRowSelectionState(selectedRowIds, items, getRowId), [items, selectedRowIds, getRowId]);
     return {
         selectedRowIds,
         updateSelection,

package/dist/esm/hooks/useSelectState.js

@@ -1,4 +1,5 @@
 import { useState, useCallback, useEffect, useRef } from 'react';
+import { getSelectDisplayText } from './useRichSelectState';
 /**
  * Manages select editor state with keyboard navigation (arrow keys, enter, escape).
  * Simpler than useRichSelectState — no search, just a dropdown list.
@@ -6,11 +7,7 @@ import { useState, useCallback, useEffect, useRef } from 'react';
 export function useSelectState(params) {
     const { values, formatValue, initialValue, onCommit, onCancel } = params;
     const dropdownRef = useRef(null);
-    const getDisplayText = useCallback((value) => {
-        if (formatValue)
-            return formatValue(value);
-        return value != null ? String(value) : '';
-    }, [formatValue]);
+    const getDisplayText = useCallback((value) => getSelectDisplayText(value, formatValue), [formatValue]);
     // Start highlighted on current value
     const initialIndex = values.findIndex((v) => String(v) === String(initialValue));
     const [highlightedIndex, setHighlightedIndex] = useState(Math.max(initialIndex, 0));

package/dist/esm/hooks/useShallowEqualMemo.js

@@ -0,0 +1,14 @@
+import { useRef } from 'react';
+/**
+ * Returns a referentially stable value as long as the comparator considers
+ * the new value equal to the previous one.  Unlike the broken
+ * `useMemo` + `useRef` + `useEffect` pattern, this works correctly because
+ * it compares *before* React's own reference check on the dependency array.
+ */
+export function useShallowEqualMemo(value, isEqual) {
+    const ref = useRef(value);
+    if (!isEqual(value, ref.current)) {
+        ref.current = value;
+    }
+    return ref.current;
+}

package/dist/esm/hooks/useTableLayout.js

@@ -23,8 +23,7 @@ export function useTableLayout(params) {
         ro.observe(el);
         measure();
         return () => ro.disconnect();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []); // wrapperRef excluded — refs are stable
+    }, [wrapperRef]);
     // --- Column sizing overrides state ---
     const [columnSizingOverrides, setColumnSizingOverrides] = useState(() => {
         if (!initialColumnWidths)
@@ -44,15 +43,8 @@ export function useTableLayout(params) {
     useEffect(() => {
         const colIds = new Set(flatColumns.map((c) => c.columnId));
         setColumnSizingOverrides((prev) => {
-            const next = { ...prev };
-            let changed = false;
-            for (const id of Object.keys(next)) {
-                if (!colIds.has(id)) {
-                    delete next[id];
-                    changed = true;
-                }
-            }
-            return changed ? next : prev;
+            const kept = Object.fromEntries(Object.entries(prev).filter(([id]) => colIds.has(id)));
+            return Object.keys(kept).length !== Object.keys(prev).length ? kept : prev;
         });
     }, [flatColumns]);
     // --- Desired table width calculation ---

package/dist/esm/hooks/useUndoRedo.js

@@ -12,30 +12,36 @@ export function useUndoRedo(params) {
     }
     const [historyLength, setHistoryLength] = useState(0);
     const [redoLength, setRedoLength] = useState(0);
+    const getStack = useCallback(() => {
+        const s = stackRef.current;
+        if (!s)
+            throw new Error('UndoRedoStack not initialized');
+        return s;
+    }, []);
     const wrapped = useCallback((event) => {
         if (!onCellValueChanged)
             return;
-        const stack = stackRef.current;
+        const stack = getStack();
         stack.record(event);
         if (!stack.isBatching) {
             setHistoryLength(stack.historyLength);
             setRedoLength(stack.redoLength);
         }
         onCellValueChanged(event);
-    }, [onCellValueChanged]);
+    }, [onCellValueChanged, getStack]);
     const beginBatch = useCallback(() => {
-        stackRef.current.beginBatch();
-    }, []);
+        getStack().beginBatch();
+    }, [getStack]);
     const endBatch = useCallback(() => {
-        const stack = stackRef.current;
+        const stack = getStack();
         stack.endBatch();
         setHistoryLength(stack.historyLength);
         setRedoLength(stack.redoLength);
-    }, []);
+    }, [getStack]);
     const undo = useCallback(() => {
         if (!onCellValueChanged)
             return;
-        const stack = stackRef.current;
+        const stack = getStack();
         const lastBatch = stack.undo();
         if (!lastBatch)
             return;
@@ -50,11 +56,11 @@ export function useUndoRedo(params) {
                 newValue: ev.oldValue,
             });
         }
-    }, [onCellValueChanged]);
+    }, [onCellValueChanged, getStack]);
     const redo = useCallback(() => {
         if (!onCellValueChanged)
             return;
-        const stack = stackRef.current;
+        const stack = getStack();
         const nextBatch = stack.redo();
         if (!nextBatch)
             return;
@@ -64,7 +70,7 @@ export function useUndoRedo(params) {
         for (const ev of nextBatch) {
             onCellValueChanged(ev);
         }
-    }, [onCellValueChanged]);
+    }, [onCellValueChanged, getStack]);
     return {
         onCellValueChanged: onCellValueChanged ? wrapped : undefined,
         undo,

package/dist/esm/index.js

@@ -2,7 +2,7 @@
 export { CHECKBOX_COLUMN_WIDTH, ROW_NUMBER_COLUMN_WIDTH, DEFAULT_MIN_COLUMN_WIDTH, CELL_PADDING, GRID_BORDER_RADIUS, } from '@alaarab/ogrid-core';
 export { toUserLike, isInSelectionRange, normalizeSelectionRange } from './types';
 // Hooks
-export { useFilterOptions, useOGrid, useActiveCell, useCellEditing, useContextMenu, useCellSelection, useClipboard, useRowSelection, useKeyboardNavigation, useUndoRedo, useDebounce, useFillHandle, useDataGridState, useColumnHeaderFilterState, useTextFilterState, useMultiSelectFilterState, usePeopleFilterState, useDateFilterState, useColumnChooserState, useInlineCellEditorState, useColumnResize, useRichSelectState, useSelectState, useSideBarState, useTableLayout, useColumnReorder, useVirtualScroll, useListVirtualizer, useLatestRef, usePaginationControls, useDataGridTableOrchestration, } from './hooks';
+export { useFilterOptions, useOGrid, useActiveCell, useCellEditing, useContextMenu, useCellSelection, useClipboard, useRowSelection, useKeyboardNavigation, useUndoRedo, useDebounce, useFillHandle, useDataGridState, useColumnHeaderFilterState, useTextFilterState, useMultiSelectFilterState, usePeopleFilterState, useDateFilterState, useColumnChooserState, useInlineCellEditorState, useColumnResize, useRichSelectState, useSelectState, useSideBarState, useTableLayout, useColumnReorder, useVirtualScroll, useListVirtualizer, useLatestRef, usePaginationControls, useDataGridTableOrchestration, useColumnMeta, } from './hooks';
 // Constants
 export { GRID_ROOT_STYLE, CURSOR_CELL_STYLE, POPOVER_ANCHOR_STYLE, PREVENT_DEFAULT, NOOP, STOP_PROPAGATION, } from './constants/domHelpers';
 // Components

package/dist/esm/utils/index.js

@@ -1,5 +1,5 @@
 // Shared utilities re-exported from core
-export { escapeCsvValue, buildCsvHeader, buildCsvRows, exportToCsv, triggerCsvDownload, getCellValue, flattenColumns, buildHeaderRows, getFilterField, mergeFilter, deriveFilterOptionsFromData, getMultiSelectFilterFields, getStatusBarParts, getDataGridStatusBarConfig, getPaginationViewModel, PAGE_SIZE_OPTIONS, MAX_PAGE_BUTTONS, GRID_CONTEXT_MENU_ITEMS, COLUMN_HEADER_MENU_ITEMS, getContextMenuHandlers, getColumnHeaderMenuItems, formatShortcut, parseValue, numberParser, currencyParser, dateParser, emailParser, booleanParser, computeAggregations, processClientSideData, computeNextSortState, measureColumnContentWidth, AUTOSIZE_EXTRA_PX, AUTOSIZE_MAX_PX, findCtrlArrowTarget, computeTabNavigation, rangesEqual, clampSelectionToBounds, computeAutoScrollSpeed, formatCellValueForTsv, formatSelectionAsTsv, parseTsvClipboard, UndoRedoStack, } from '@alaarab/ogrid-core';
+export { escapeCsvValue, buildCsvHeader, buildCsvRows, exportToCsv, triggerCsvDownload, getCellValue, flattenColumns, buildHeaderRows, getFilterField, mergeFilter, deriveFilterOptionsFromData, getMultiSelectFilterFields, getStatusBarParts, getDataGridStatusBarConfig, getPaginationViewModel, PAGE_SIZE_OPTIONS, MAX_PAGE_BUTTONS, GRID_CONTEXT_MENU_ITEMS, COLUMN_HEADER_MENU_ITEMS, getContextMenuHandlers, getColumnHeaderMenuItems, formatShortcut, parseValue, numberParser, currencyParser, dateParser, emailParser, booleanParser, computeAggregations, processClientSideData, computeNextSortState, measureColumnContentWidth, AUTOSIZE_EXTRA_PX, AUTOSIZE_MAX_PX, findCtrlArrowTarget, computeTabNavigation, rangesEqual, clampSelectionToBounds, computeAutoScrollSpeed, formatCellValueForTsv, formatSelectionAsTsv, parseTsvClipboard, applyPastedValues, applyCutClear, applyFillValues, computeArrowNavigation, applyCellDeletion, applyRangeRowSelection, computeRowSelectionState, UndoRedoStack, } from '@alaarab/ogrid-core';
 // View model utilities (re-exported from core + React-specific getCellInteractionProps)
 export { getHeaderFilterConfig, getCellRenderDescriptor, resolveCellDisplayContent, resolveCellStyle, buildInlineEditorProps, buildPopoverEditorProps, getCellInteractionProps, } from './dataGridViewModel';
 export { areGridRowPropsEqual, isRowInRange } from './gridRowComparator';

package/dist/types/components/ColumnChooserProps.d.ts

@@ -8,5 +8,7 @@ export interface IColumnChooserProps {
     columns: IColumnDefinition[];
     visibleColumns: Set<string>;
     onVisibilityChange: (columnKey: string, visible: boolean) => void;
+    /** Optional batch setter — used by select-all / clear-all for a single state update. */
+    onSetVisibleColumns?: (columns: Set<string>) => void;
     className?: string;
 }

package/dist/types/components/ColumnHeaderFilterContent.d.ts

@@ -44,8 +44,6 @@ export interface DateFilterClassNames {
 export declare const DateFilterContent: React.FC<DateFilterContentProps>;
 export declare function getColumnHeaderFilterStateParams(props: IColumnHeaderFilterProps): {
     filterType: ColumnFilterType;
-    isSorted: boolean;
-    isSortedDescending: boolean;
     onSort: (() => void) | undefined;
     selectedValues: string[] | undefined;
     onFilterChange: ((values: string[]) => void) | undefined;

package/dist/types/hooks/index.d.ts

@@ -2,6 +2,14 @@ export { useFilterOptions } from './useFilterOptions';
 export type { UseFilterOptionsResult } from './useFilterOptions';
 export { useOGrid } from './useOGrid';
 export type { UseOGridResult, UseOGridPagination, UseOGridColumnChooser, UseOGridLayout, UseOGridFilters, ColumnChooserPlacement, } from './useOGrid';
+export { useOGridPagination } from './useOGridPagination';
+export type { UseOGridPaginationParams, UseOGridPaginationState } from './useOGridPagination';
+export { useOGridSorting } from './useOGridSorting';
+export type { UseOGridSortingParams, UseOGridSortingState, SortState } from './useOGridSorting';
+export { useOGridFilters as useOGridFiltersState } from './useOGridFilters';
+export type { UseOGridFiltersParams, UseOGridFiltersState } from './useOGridFilters';
+export { useOGridDataFetching } from './useOGridDataFetching';
+export type { UseOGridDataFetchingParams, UseOGridDataFetchingState } from './useOGridDataFetching';
 export { useActiveCell } from './useActiveCell';
 export type { UseActiveCellResult } from './useActiveCell';
 export { useCellEditing } from './useCellEditing';
@@ -23,6 +31,14 @@ export { useFillHandle } from './useFillHandle';
 export type { UseFillHandleResult, UseFillHandleParams } from './useFillHandle';
 export { useDataGridState } from './useDataGridState';
 export type { UseDataGridStateParams, UseDataGridStateResult, DataGridLayoutState, DataGridRowSelectionState, DataGridEditingState, DataGridCellInteractionState, DataGridContextMenuState, DataGridViewModelState, DataGridPinningState, } from './useDataGridState';
+export { useDataGridLayout } from './useDataGridLayout';
+export type { UseDataGridLayoutParams, UseDataGridLayoutResult } from './useDataGridLayout';
+export { useDataGridEditing } from './useDataGridEditing';
+export type { UseDataGridEditingParams, UseDataGridEditingResult } from './useDataGridEditing';
+export { useDataGridInteraction } from './useDataGridInteraction';
+export type { UseDataGridInteractionParams, UseDataGridInteractionResult } from './useDataGridInteraction';
+export { useDataGridContextMenu } from './useDataGridContextMenu';
+export type { UseDataGridContextMenuParams, UseDataGridContextMenuResult } from './useDataGridContextMenu';
 export { useColumnHeaderFilterState } from './useColumnHeaderFilterState';
 export type { UseColumnHeaderFilterStateParams, UseColumnHeaderFilterStateResult, } from './useColumnHeaderFilterState';
 export { useTextFilterState } from './useTextFilterState';
@@ -58,7 +74,10 @@ export type { IVirtualScrollConfig, UseVirtualScrollParams, UseVirtualScrollResu
 export { useListVirtualizer } from './useListVirtualizer';
 export type { UseListVirtualizerOptions, UseListVirtualizerResult, VirtualItem, } from './useListVirtualizer';
 export { useLatestRef } from './useLatestRef';
+export { useShallowEqualMemo } from './useShallowEqualMemo';
 export { usePaginationControls } from './usePaginationControls';
 export type { UsePaginationControlsProps, UsePaginationControlsResult, } from './usePaginationControls';
 export { useDataGridTableOrchestration } from './useDataGridTableOrchestration';
 export type { UseDataGridTableOrchestrationParams, UseDataGridTableOrchestrationResult, } from './useDataGridTableOrchestration';
+export { useColumnMeta } from './useColumnMeta';
+export type { UseColumnMetaParams, ColumnMetaResult } from './useColumnMeta';

package/dist/types/hooks/useClipboard.d.ts

@@ -14,7 +14,6 @@ export interface UseClipboardResult {
     handleCopy: () => void;
     handleCut: () => void;
     handlePaste: () => Promise<void>;
-    cutRangeRef: React.MutableRefObject<ISelectionRange | null>;
     /** Current cut range for UI (marching ants). Null when no cut or after paste. */
     cutRange: ISelectionRange | null;
     /** Current copy range for UI (marching ants). Null when no copy or after paste/cut. */

package/dist/types/hooks/useColumnChooserState.d.ts

@@ -7,6 +7,8 @@ export interface UseColumnChooserStateParams {
     columns: IColumnDefinition[];
     visibleColumns: Set<string>;
     onVisibilityChange: (columnKey: string, visible: boolean) => void;
+    /** Optional batch setter for select-all / clear-all — avoids N individual callbacks. */
+    onSetVisibleColumns?: (columns: Set<string>) => void;
 }
 export interface UseColumnChooserStateResult {
     open: boolean;

package/dist/types/hooks/useColumnHeaderFilterState.d.ts

@@ -8,8 +8,6 @@ import type { ColumnFilterType, IDateFilterValue } from '../types/columnTypes';
 import type { UserLike } from '../types/dataGridTypes';
 export interface UseColumnHeaderFilterStateParams {
     filterType: ColumnFilterType;
-    isSorted?: boolean;
-    isSortedDescending?: boolean;
     onSort?: () => void;
     selectedValues?: string[];
     onFilterChange?: (values: string[]) => void;

package/dist/types/hooks/useColumnHeaderMenuState.d.ts

@@ -14,8 +14,6 @@ export interface UseColumnHeaderMenuStateParams {
         sortable?: boolean;
         resizable?: boolean;
     }>;
-    data: unknown[];
-    getRowId: (item: unknown) => string | number;
 }
 export interface UseColumnHeaderMenuStateResult {
     isOpen: boolean;

package/dist/types/hooks/useColumnMeta.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Shared hook that pre-computes per-column styles and class names for DataGridTable.
+ * Extracted from Radix/Fluent/Material DataGridTable to avoid duplication.
+ *
+ * @param params.addStickyPosition - When true, adds `position: 'sticky'` inline for pinned columns.
+ *   This is needed by Fluent UI whose `TableCell` injects atomic `position: relative` via CSS-in-JS,
+ *   overriding the shared `.pinnedColLeft { position: sticky }` class. Radix/Material don't need it.
+ */
+import type { IColumnDef } from '../types';
+export interface UseColumnMetaParams<T> {
+    visibleCols: IColumnDef<T>[];
+    getColumnWidth: (col: IColumnDef<T>) => number;
+    columnSizingOverrides: Record<string, {
+        widthPx: number;
+    }>;
+    measuredColumnWidths: Record<string, number>;
+    pinnedColumns: Record<string, 'left' | 'right'>;
+    leftOffsets: Record<string, number>;
+    rightOffsets: Record<string, number>;
+    pinnedColLeftClass: string;
+    pinnedColRightClass: string;
+    /** When true, adds `position: sticky` inline to pinned cells (Fluent-specific). */
+    addStickyPosition?: boolean;
+}
+export interface ColumnMetaResult {
+    cellStyles: Record<string, React.CSSProperties>;
+    cellClasses: Record<string, string>;
+    hdrStyles: Record<string, React.CSSProperties>;
+    hdrClasses: Record<string, string>;
+}
+/**
+ * Computes per-column styles and class names once per render, avoiding per-cell object creation.
+ */
+export declare function useColumnMeta<T>(params: UseColumnMetaParams<T>): ColumnMetaResult;

package/dist/types/hooks/useDataGridContextMenu.d.ts

@@ -0,0 +1,20 @@
+import type { DataGridContextMenuState } from './useDataGridState';
+export interface UseDataGridContextMenuParams {
+    cellSelection: boolean;
+}
+export interface UseDataGridContextMenuResult {
+    contextMenu: DataGridContextMenuState;
+    contextMenuPosition: {
+        x: number;
+        y: number;
+    } | null;
+    setContextMenuPosition: (pos: {
+        x: number;
+        y: number;
+    } | null) => void;
+}
+/**
+ * Manages context menu position and handlers.
+ * Extracted from useDataGridState for modularity.
+ */
+export declare function useDataGridContextMenu(params: UseDataGridContextMenuParams): UseDataGridContextMenuResult;