@alaarab/ogrid-react 2.1.2 → 2.1.4

package/dist/esm/hooks/useColumnResize.js

@@ -1,127 +0,0 @@
-import { useCallback, useEffect, useRef } from 'react';
-import { useLatestRef } from './useLatestRef';
-/**
- * Manages column resize drag interactions with RAF-throttled state updates.
- * @param params - Sizing overrides, setter, min/default widths, and resize callback.
- * @returns Resize start handler and column width getter.
- */
-export function useColumnResize({ columnSizingOverrides, setColumnSizingOverrides, minWidth = 80, defaultWidth = 120, onColumnResized, }) {
-    const rafRef = useRef(0);
-    const onColumnResizedRef = useRef(onColumnResized);
-    onColumnResizedRef.current = onColumnResized;
-    const columnSizingOverridesRef = useLatestRef(columnSizingOverrides);
-    // Track active drag listeners so we can clean up on unmount
-    const cleanupRef = useRef(null);
-    useEffect(() => {
-        return () => {
-            if (cleanupRef.current) {
-                cleanupRef.current();
-                cleanupRef.current = null;
-            }
-        };
-    }, []);
-    const handleResizeStart = useCallback((e, col) => {
-        e.preventDefault();
-        e.stopPropagation();
-        // Clean up any in-progress drag before starting a new one
-        if (cleanupRef.current) {
-            cleanupRef.current();
-            cleanupRef.current = null;
-        }
-        const startX = e.clientX;
-        const columnId = col.columnId;
-        // Measure the actual rendered width from the DOM. With table-layout: auto,
-        // the browser may have auto-sized the column wider than the config values.
-        // The resize handle is a direct child of <th>, so parentElement is the header cell.
-        // Use closest('th') instead of parentElement to handle frameworks (e.g. Fluent UI)
-        // that wrap header cell children in an internal <button> element.
-        const thEl = e.currentTarget.closest('th');
-        const startWidth = thEl
-            ? thEl.getBoundingClientRect().width
-            : columnSizingOverridesRef.current[columnId]?.widthPx
-                ?? col.idealWidth
-                ?? col.defaultWidth
-                ?? defaultWidth;
-        let latestWidth = startWidth;
-        // Lock all column widths to their current DOM widths on first resize.
-        // With table-layout:auto, resizing one column causes the browser to compress others.
-        // Snapshotting all widths prevents this — only the dragged column changes.
-        const thead = thEl?.closest('thead');
-        if (thead) {
-            const allThs = thead.querySelectorAll('th[data-column-id]');
-            if (allThs.length > 0) {
-                setColumnSizingOverrides((prev) => {
-                    const next = { ...prev };
-                    allThs.forEach((th) => {
-                        const colId = th.dataset.columnId;
-                        if (colId && !next[colId]) {
-                            next[colId] = { widthPx: th.getBoundingClientRect().width };
-                        }
-                    });
-                    next[columnId] = { widthPx: startWidth };
-                    return next;
-                });
-            }
-        }
-        // Lock cursor and prevent text selection during drag
-        const prevCursor = document.body.style.cursor;
-        const prevUserSelect = document.body.style.userSelect;
-        document.body.style.cursor = 'col-resize';
-        document.body.style.userSelect = 'none';
-        const flushWidth = () => {
-            setColumnSizingOverrides((prev) => ({
-                ...prev,
-                [columnId]: { widthPx: latestWidth },
-            }));
-        };
-        const onMove = (moveEvent) => {
-            const deltaX = moveEvent.clientX - startX;
-            latestWidth = Math.max(minWidth, startWidth + deltaX);
-            if (!rafRef.current) {
-                rafRef.current = requestAnimationFrame(() => {
-                    rafRef.current = 0;
-                    flushWidth();
-                });
-            }
-        };
-        const cleanup = () => {
-            document.removeEventListener('mousemove', onMove);
-            document.removeEventListener('mouseup', onUp);
-            cleanupRef.current = null;
-            // Restore cursor and user-select
-            document.body.style.cursor = prevCursor;
-            document.body.style.userSelect = prevUserSelect;
-            // Cancel pending RAF and flush final width synchronously
-            if (rafRef.current) {
-                cancelAnimationFrame(rafRef.current);
-                rafRef.current = 0;
-            }
-        };
-        const onUp = () => {
-            cleanup();
-            flushWidth();
-            // Remove any rogue :focus-visible outlines that appeared during the drag.
-            // Re-focus the grid wrapper so keyboard navigation still works.
-            const wrapper = thEl?.closest('[tabindex]');
-            if (wrapper) {
-                wrapper.focus({ preventScroll: true });
-            }
-            else if (document.activeElement instanceof HTMLElement) {
-                document.activeElement.blur();
-            }
-            if (onColumnResizedRef.current) {
-                onColumnResizedRef.current(columnId, latestWidth);
-            }
-        };
-        document.addEventListener('mousemove', onMove);
-        document.addEventListener('mouseup', onUp);
-        cleanupRef.current = cleanup;
-    }, [defaultWidth, minWidth, setColumnSizingOverrides, columnSizingOverridesRef]);
-    const getColumnWidth = useCallback((col) => {
-        return columnSizingOverrides[col.columnId]?.widthPx
-            ?? col.idealWidth
-            ?? col.defaultWidth
-            ?? defaultWidth;
-    }, [columnSizingOverrides, defaultWidth]);
-    return { handleResizeStart, getColumnWidth };
-}

package/dist/esm/hooks/useContextMenu.js

@@ -1,21 +0,0 @@
-import { useState, useCallback } from 'react';
-/**
- * Manages context menu position state for right-click menus.
- * @returns Menu position, setter, right-click handler, and close handler.
- */
-export function useContextMenu() {
-    const [contextMenuPosition, setContextMenuPosition] = useState(null);
-    const handleCellContextMenu = useCallback((e) => {
-        e.preventDefault?.();
-        setContextMenuPosition({ x: e.clientX, y: e.clientY });
-    }, []);
-    const closeContextMenu = useCallback(() => {
-        setContextMenuPosition(null);
-    }, []);
-    return {
-        contextMenuPosition,
-        setContextMenuPosition,
-        handleCellContextMenu,
-        closeContextMenu,
-    };
-}

package/dist/esm/hooks/useDataGridContextMenu.js

@@ -1,24 +0,0 @@
-import { useMemo } from 'react';
-import { useContextMenu } from './useContextMenu';
-// Stable no-op handlers used when cellSelection is disabled
-const NOOP = () => { };
-const NOOP_CTX = (_e) => { };
-/**
- * Manages context menu position and handlers.
- * Extracted from useDataGridState for modularity.
- */
-export function useDataGridContextMenu(params) {
-    const { cellSelection } = params;
-    const { contextMenuPosition, setContextMenuPosition, handleCellContextMenu, closeContextMenu } = useContextMenu();
-    const contextMenuState = useMemo(() => ({
-        menuPosition: cellSelection ? contextMenuPosition : null,
-        setMenuPosition: cellSelection ? setContextMenuPosition : NOOP,
-        handleCellContextMenu: cellSelection ? handleCellContextMenu : NOOP_CTX,
-        closeContextMenu: cellSelection ? closeContextMenu : NOOP,
-    }), [cellSelection, contextMenuPosition, setContextMenuPosition, handleCellContextMenu, closeContextMenu]);
-    return {
-        contextMenu: contextMenuState,
-        contextMenuPosition,
-        setContextMenuPosition,
-    };
-}

package/dist/esm/hooks/useDataGridEditing.js

@@ -1,56 +0,0 @@
-import { useMemo, useCallback, useState } from 'react';
-import { parseValue } from '../utils';
-import { useLatestRef } from './useLatestRef';
-/**
- * Manages cell editing commit/cancel logic and popover editor state.
- * Extracted from useDataGridState for modularity.
- *
- * The editingCell/setEditingCell/pendingEditorValue/setPendingEditorValue are
- * passed in from useCellEditing() (called at the orchestrator level) to avoid
- * circular dependencies with useDataGridInteraction.
- */
-export function useDataGridEditing(params) {
-    const { editingCell, setEditingCell, pendingEditorValue, setPendingEditorValue, onCellValueChanged, setActiveCell, } = params;
-    const [popoverAnchorEl, setPopoverAnchorEl] = useState(null);
-    const visibleColsRef = useLatestRef(params.visibleCols);
-    const itemsLengthRef = useLatestRef(params.itemsLength);
-    const commitCellEdit = useCallback((item, columnId, oldValue, newValue, rowIndex, globalColIndex) => {
-        // Validate via valueParser before committing
-        const col = visibleColsRef.current.find((c) => c.columnId === columnId);
-        if (col) {
-            const result = parseValue(newValue, oldValue, item, col);
-            if (!result.valid) {
-                // Reject -- cancel the edit
-                setEditingCell(null);
-                setPopoverAnchorEl(null);
-                setPendingEditorValue(undefined);
-                return;
-            }
-            newValue = result.value;
-        }
-        onCellValueChanged?.({
-            item,
-            columnId,
-            oldValue,
-            newValue,
-            rowIndex,
-        });
-        setEditingCell(null);
-        setPopoverAnchorEl(null);
-        setPendingEditorValue(undefined);
-        // Advance to next row for inline editors
-        if (rowIndex < itemsLengthRef.current - 1) {
-            setActiveCell({ rowIndex: rowIndex + 1, columnIndex: globalColIndex });
-        }
-    }, [onCellValueChanged, setEditingCell, setPendingEditorValue, setActiveCell, visibleColsRef, itemsLengthRef]);
-    const cancelPopoverEdit = useCallback(() => {
-        setEditingCell(null);
-        setPopoverAnchorEl(null);
-        setPendingEditorValue(undefined);
-    }, [setEditingCell, setPendingEditorValue]);
-    const editingState = useMemo(() => ({
-        editingCell, setEditingCell, pendingEditorValue, setPendingEditorValue,
-        commitCellEdit, cancelPopoverEdit, popoverAnchorEl, setPopoverAnchorEl,
-    }), [editingCell, setEditingCell, pendingEditorValue, setPendingEditorValue, commitCellEdit, cancelPopoverEdit, popoverAnchorEl, setPopoverAnchorEl]);
-    return { editing: editingState };
-}

package/dist/esm/hooks/useDataGridInteraction.js

@@ -1,109 +0,0 @@
-import { useMemo, useCallback } from 'react';
-import { useCellSelection } from './useCellSelection';
-import { useClipboard } from './useClipboard';
-import { useKeyboardNavigation } from './useKeyboardNavigation';
-import { useFillHandle } from './useFillHandle';
-import { useUndoRedo } from './useUndoRedo';
-// Stable no-op handlers used when cellSelection is disabled (module-scope = no re-renders)
-const NOOP = () => { };
-const NOOP_ASYNC = async () => { };
-const NOOP_MOUSE = (_e, _r, _c) => { };
-const NOOP_KEY = (_e) => { };
-/**
- * Manages cell selection, keyboard navigation, clipboard, fill handle, and undo/redo.
- * Extracted from useDataGridState for modularity.
- *
- * activeCell/setActiveCell and editingCell/setEditingCell are passed in from the
- * orchestrator level to avoid circular dependencies with useDataGridEditing.
- */
-export function useDataGridInteraction(params) {
-    const { items, visibleCols, colOffset, hasCheckboxCol, visibleColumnCount, getRowId, editable, onCellValueChangedProp, cellSelection, rowSelection, selectedRowIds, editingCell, setEditingCell, activeCell, setActiveCell, handleRowCheckboxChange, setContextMenuPosition, wrapperRef, } = params;
-    // Wrap onCellValueChanged with undo/redo tracking
-    const undoRedo = useUndoRedo({ onCellValueChanged: onCellValueChangedProp });
-    const onCellValueChanged = undoRedo.onCellValueChanged;
-    const { selectionRange, setSelectionRange, handleCellMouseDown: handleCellMouseDownBase, handleSelectAllCells, isDragging, } = useCellSelection({
-        colOffset,
-        rowCount: items.length,
-        visibleColCount: visibleCols.length,
-        setActiveCell,
-        wrapperRef,
-    });
-    const { handleCopy, handleCut, handlePaste, cutRange, copyRange, clearClipboardRanges } = useClipboard({
-        items,
-        visibleCols,
-        colOffset,
-        selectionRange,
-        activeCell,
-        editable,
-        onCellValueChanged,
-        beginBatch: undoRedo.beginBatch,
-        endBatch: undoRedo.endBatch,
-    });
-    const handleCellMouseDown = useCallback((e, rowIndex, globalColIndex) => {
-        if (e.button !== 0)
-            return;
-        wrapperRef.current?.focus({ preventScroll: true });
-        clearClipboardRanges();
-        handleCellMouseDownBase(e, rowIndex, globalColIndex);
-    }, [handleCellMouseDownBase, clearClipboardRanges, wrapperRef]);
-    const { handleGridKeyDown } = useKeyboardNavigation({
-        data: { items, visibleCols, colOffset, hasCheckboxCol, visibleColumnCount, getRowId },
-        state: { activeCell, selectionRange, editingCell, selectedRowIds },
-        handlers: { setActiveCell, setSelectionRange, setEditingCell, handleRowCheckboxChange, handleCopy, handleCut, handlePaste, setContextMenu: setContextMenuPosition, onUndo: undoRedo.undo, onRedo: undoRedo.redo, clearClipboardRanges },
-        features: { editable, onCellValueChanged, rowSelection: rowSelection ?? 'none', wrapperRef },
-    });
-    const { handleFillHandleMouseDown } = useFillHandle({
-        items,
-        visibleCols,
-        editable,
-        onCellValueChanged,
-        selectionRange,
-        setSelectionRange,
-        setActiveCell,
-        colOffset,
-        wrapperRef,
-        beginBatch: undoRedo.beginBatch,
-        endBatch: undoRedo.endBatch,
-    });
-    const hasCellSelection = selectionRange != null || activeCell != null;
-    const interactionState = useMemo(() => ({
-        activeCell: cellSelection ? activeCell : null,
-        setActiveCell: cellSelection ? setActiveCell : NOOP,
-        selectionRange: cellSelection ? selectionRange : null,
-        setSelectionRange: cellSelection ? setSelectionRange : NOOP,
-        handleCellMouseDown: cellSelection ? handleCellMouseDown : NOOP_MOUSE,
-        handleSelectAllCells: cellSelection ? handleSelectAllCells : NOOP,
-        hasCellSelection: cellSelection ? hasCellSelection : false,
-        handleGridKeyDown: cellSelection ? handleGridKeyDown : NOOP_KEY,
-        handleFillHandleMouseDown: cellSelection ? handleFillHandleMouseDown : NOOP,
-        handleCopy: cellSelection ? handleCopy : NOOP,
-        handleCut: cellSelection ? handleCut : NOOP,
-        handlePaste: cellSelection ? handlePaste : NOOP_ASYNC,
-        cutRange: cellSelection ? cutRange : null,
-        copyRange: cellSelection ? copyRange : null,
-        clearClipboardRanges: cellSelection ? clearClipboardRanges : NOOP,
-        canUndo: undoRedo.canUndo,
-        canRedo: undoRedo.canRedo,
-        onUndo: undoRedo.undo,
-        onRedo: undoRedo.redo,
-        isDragging: cellSelection ? isDragging : false,
-    }), [
-        cellSelection, activeCell, setActiveCell, selectionRange, setSelectionRange,
-        handleCellMouseDown, handleSelectAllCells, hasCellSelection, handleGridKeyDown,
-        handleFillHandleMouseDown, handleCopy, handleCut, handlePaste, cutRange, copyRange,
-        clearClipboardRanges, undoRedo.canUndo, undoRedo.canRedo, undoRedo.undo, undoRedo.redo,
-        isDragging,
-    ]);
-    return {
-        interaction: interactionState,
-        selectionRange,
-        setSelectionRange,
-        cutRange,
-        copyRange,
-        clearClipboardRanges,
-        isDragging,
-        onCellValueChanged,
-        canUndo: undoRedo.canUndo,
-        canRedo: undoRedo.canRedo,
-    };
-}

package/dist/esm/hooks/useDataGridLayout.js

@@ -1,172 +0,0 @@
-import { useMemo, useState, useLayoutEffect, useCallback } from 'react';
-import { flattenColumns } from '../utils';
-import { CHECKBOX_COLUMN_WIDTH, DEFAULT_MIN_COLUMN_WIDTH } from '@alaarab/ogrid-core';
-import { useTableLayout } from './useTableLayout';
-import { useColumnPinning } from './useColumnPinning';
-import { useColumnHeaderMenuState } from './useColumnHeaderMenuState';
-import { useLatestRef } from './useLatestRef';
-/**
- * Manages column layout, visibility, sizing, pinning, and header menu state.
- * Extracted from useDataGridState for modularity.
- */
-export function useDataGridLayout(params) {
-    const { columns, items, getRowId, visibleColumns, columnOrder, rowSelection = 'none', showRowNumbers, initialColumnWidths, onColumnResized, onAutosizeColumn, pinnedColumns, onColumnPinned, sortBy, sortDirection, onColumnSort, wrapperRef, } = params;
-    // Cast is safe: input columns are React.IColumnDef instances; flattenColumns only extracts leaves.
-    const flatColumnsRaw = useMemo(() => flattenColumns(columns), [columns]);
-    // Apply runtime pin overrides (from applyColumnState or programmatic changes)
-    const flatColumns = useMemo(() => {
-        if (!pinnedColumns || Object.keys(pinnedColumns).length === 0)
-            return flatColumnsRaw;
-        return flatColumnsRaw.map((col) => {
-            const override = pinnedColumns[col.columnId];
-            if (override && col.pinned !== override) {
-                return { ...col, pinned: override };
-            }
-            return col;
-        });
-    }, [flatColumnsRaw, pinnedColumns]);
-    const visibleCols = useMemo(() => {
-        const filtered = visibleColumns
-            ? flatColumns.filter((c) => visibleColumns.has(c.columnId))
-            : flatColumns;
-        if (!columnOrder?.length)
-            return filtered;
-        const orderMap = new Map();
-        for (let i = 0; i < columnOrder.length; i++) {
-            orderMap.set(columnOrder[i], i);
-        }
-        return [...filtered].sort((a, b) => {
-            const ia = orderMap.get(a.columnId) ?? -1;
-            const ib = orderMap.get(b.columnId) ?? -1;
-            if (ia === -1 && ib === -1)
-                return 0;
-            if (ia === -1)
-                return 1;
-            if (ib === -1)
-                return -1;
-            return ia - ib;
-        });
-    }, [flatColumns, visibleColumns, columnOrder]);
-    const visibleColumnCount = visibleCols.length;
-    const hasCheckboxCol = rowSelection === 'multiple';
-    const hasRowNumbersCol = !!showRowNumbers;
-    const specialColsCount = (hasCheckboxCol ? 1 : 0) + (hasRowNumbersCol ? 1 : 0);
-    const totalColCount = visibleColumnCount + specialColsCount;
-    const colOffset = specialColsCount;
-    const rowIndexByRowId = useMemo(() => {
-        const m = new Map();
-        items.forEach((item, idx) => m.set(getRowId(item), idx));
-        return m;
-    }, [items, getRowId]);
-    const { containerWidth, minTableWidth, desiredTableWidth, columnSizingOverrides, setColumnSizingOverrides, } = useTableLayout({
-        wrapperRef,
-        visibleCols,
-        flatColumns,
-        hasCheckboxCol,
-        initialColumnWidths,
-        onColumnResized,
-    });
-    const pinningResult = useColumnPinning({
-        columns: flatColumns,
-        pinnedColumns,
-        onColumnPinned,
-    });
-    // Measure actual column widths from the DOM for accurate pinning offsets.
-    const [measuredColumnWidths, setMeasuredColumnWidths] = useState({});
-    useLayoutEffect(() => {
-        const wrapper = wrapperRef.current;
-        if (!wrapper)
-            return;
-        const headerCells = wrapper.querySelectorAll('th[data-column-id]');
-        if (headerCells.length === 0)
-            return;
-        const measured = {};
-        headerCells.forEach((cell) => {
-            const colId = cell.getAttribute('data-column-id');
-            if (colId)
-                measured[colId] = cell.offsetWidth;
-        });
-        setMeasuredColumnWidths((prev) => {
-            for (const key in measured) {
-                if (prev[key] !== measured[key])
-                    return measured;
-            }
-            if (Object.keys(prev).length !== Object.keys(measured).length)
-                return measured;
-            return prev;
-        });
-    }, [visibleCols, containerWidth, columnSizingOverrides, wrapperRef]);
-    // Build column width map for pinning offset computation
-    const columnWidthMap = useMemo(() => {
-        const map = {};
-        for (const col of visibleCols) {
-            const override = columnSizingOverrides[col.columnId];
-            map[col.columnId] = override
-                ? override.widthPx
-                : (measuredColumnWidths[col.columnId] ?? col.idealWidth ?? col.defaultWidth ?? col.minWidth ?? DEFAULT_MIN_COLUMN_WIDTH);
-        }
-        return map;
-    }, [visibleCols, columnSizingOverrides, measuredColumnWidths]);
-    const leftOffsets = useMemo(() => pinningResult.computeLeftOffsets(visibleCols, columnWidthMap, DEFAULT_MIN_COLUMN_WIDTH, hasCheckboxCol, CHECKBOX_COLUMN_WIDTH), [pinningResult, visibleCols, columnWidthMap, hasCheckboxCol]);
-    const rightOffsets = useMemo(() => pinningResult.computeRightOffsets(visibleCols, columnWidthMap, DEFAULT_MIN_COLUMN_WIDTH), [pinningResult, visibleCols, columnWidthMap]);
-    // Stabilize onColumnSort via ref
-    const onColumnSortRef = useLatestRef(onColumnSort);
-    const stableOnColumnSort = useCallback((columnKey, direction) => onColumnSortRef.current?.(columnKey, direction), [onColumnSortRef]);
-    // Autosize callback
-    const handleAutosizeColumn = useCallback((columnId, width) => {
-        setColumnSizingOverrides((prev) => ({ ...prev, [columnId]: { widthPx: width } }));
-        (onAutosizeColumn ?? onColumnResized)?.(columnId, width);
-    }, [setColumnSizingOverrides, onAutosizeColumn, onColumnResized]);
-    const headerMenuResult = useColumnHeaderMenuState({
-        pinnedColumns: pinningResult.pinnedColumns,
-        onPinColumn: pinningResult.pinColumn,
-        onUnpinColumn: pinningResult.unpinColumn,
-        sortBy,
-        sortDirection: sortDirection ?? 'asc',
-        onColumnSort: stableOnColumnSort,
-        onColumnResized,
-        onAutosizeColumn: handleAutosizeColumn,
-        columns: flatColumns,
-    });
-    // Memoize layout sub-object
-    const layoutState = useMemo(() => ({
-        flatColumns, visibleCols, visibleColumnCount, totalColCount, colOffset,
-        hasCheckboxCol, hasRowNumbersCol, rowIndexByRowId, containerWidth, minTableWidth,
-        desiredTableWidth, columnSizingOverrides, setColumnSizingOverrides, onColumnResized,
-        measuredColumnWidths,
-    }), [
-        flatColumns, visibleCols, visibleColumnCount, totalColCount, colOffset,
-        hasCheckboxCol, hasRowNumbersCol, rowIndexByRowId, containerWidth, minTableWidth,
-        desiredTableWidth, columnSizingOverrides, setColumnSizingOverrides, onColumnResized,
-        measuredColumnWidths,
-    ]);
-    // Memoize pinning sub-object
-    const pinningState = useMemo(() => ({
-        pinnedColumns: pinningResult.pinnedColumns,
-        pinColumn: pinningResult.pinColumn,
-        unpinColumn: pinningResult.unpinColumn,
-        isPinned: pinningResult.isPinned,
-        leftOffsets,
-        rightOffsets,
-        headerMenu: headerMenuResult,
-    }), [
-        pinningResult.pinnedColumns, pinningResult.pinColumn, pinningResult.unpinColumn,
-        pinningResult.isPinned, leftOffsets, rightOffsets,
-        headerMenuResult,
-    ]);
-    return {
-        layout: layoutState,
-        pinning: pinningState,
-        flatColumns,
-        visibleCols,
-        visibleColumnCount,
-        totalColCount,
-        colOffset,
-        hasCheckboxCol,
-        hasRowNumbersCol,
-        columnSizingOverrides,
-        setColumnSizingOverrides,
-        handleAutosizeColumn,
-        stableOnColumnSort,
-    };
-}

package/dist/esm/hooks/useDataGridState.js

@@ -1,169 +0,0 @@
-import { useMemo, useCallback } from 'react';
-import { getDataGridStatusBarConfig, computeAggregations } from '../utils';
-import { useRowSelection } from './useRowSelection';
-import { useCellEditing } from './useCellEditing';
-import { useActiveCell } from './useActiveCell';
-import { useLatestRef } from './useLatestRef';
-import { useDataGridLayout } from './useDataGridLayout';
-import { useDataGridEditing } from './useDataGridEditing';
-import { useDataGridInteraction } from './useDataGridInteraction';
-import { useDataGridContextMenu } from './useDataGridContextMenu';
-/**
- * Single orchestration hook for DataGridTable. Takes grid props and wrapper ref,
- * returns all derived state and handlers so Fluent/Material/Radix can be thin view layers.
- *
- * Internally delegates to focused sub-hooks:
- * - useDataGridLayout -- column layout, sizing, pinning, header menu
- * - useDataGridEditing -- cell editing commit/cancel, popover editor
- * - useDataGridInteraction -- cell selection, keyboard nav, clipboard, fill handle, undo/redo
- * - useDataGridContextMenu -- context menu state
- */
-export function useDataGridState(params) {
-    const { props, wrapperRef } = params;
-    const { items, columns, getRowId, visibleColumns, columnOrder, rowSelection = 'none', selectedRows: controlledSelectedRows, onSelectionChange, showRowNumbers, statusBar, emptyState, editable, cellSelection: cellSelectionProp, onCellValueChanged: onCellValueChangedProp, initialColumnWidths, onColumnResized, onAutosizeColumn, pinnedColumns, onColumnPinned, onCellError, } = props;
-    const cellSelection = cellSelectionProp !== false;
-    // --- Shared state hooks (called at orchestrator level to break circular deps) ---
-    const { editingCell, setEditingCell, pendingEditorValue, setPendingEditorValue, } = useCellEditing();
-    const { activeCell, setActiveCell } = useActiveCell(wrapperRef, editingCell);
-    // --- 1. Layout, pinning, header menu ---
-    const layoutResult = useDataGridLayout({
-        columns,
-        items,
-        getRowId,
-        visibleColumns,
-        columnOrder,
-        rowSelection,
-        showRowNumbers,
-        initialColumnWidths,
-        onColumnResized,
-        onAutosizeColumn,
-        pinnedColumns,
-        onColumnPinned,
-        sortBy: props.sortBy,
-        sortDirection: props.sortDirection,
-        onColumnSort: props.onColumnSort,
-        wrapperRef,
-    });
-    const { visibleCols, visibleColumnCount, colOffset, hasCheckboxCol, } = layoutResult;
-    // --- 2. Row selection ---
-    const rowSelectionResult = useRowSelection({
-        items,
-        getRowId,
-        rowSelection,
-        controlledSelectedRows,
-        onSelectionChange,
-    });
-    const { selectedRowIds, updateSelection, handleRowCheckboxChange, handleSelectAll, allSelected, someSelected, } = rowSelectionResult;
-    // --- 3. Context menu ---
-    const contextMenuResult = useDataGridContextMenu({ cellSelection });
-    const { setContextMenuPosition } = contextMenuResult;
-    // --- 4. Interaction (selection, keyboard, clipboard, fill handle, undo/redo) ---
-    const interactionResult = useDataGridInteraction({
-        items,
-        visibleCols,
-        colOffset,
-        hasCheckboxCol,
-        visibleColumnCount,
-        getRowId,
-        editable,
-        onCellValueChangedProp,
-        cellSelection,
-        rowSelection,
-        selectedRowIds,
-        editingCell,
-        setEditingCell,
-        activeCell,
-        setActiveCell,
-        handleRowCheckboxChange,
-        setContextMenuPosition,
-        wrapperRef,
-    });
-    const { selectionRange, cutRange, copyRange, isDragging, onCellValueChanged, } = interactionResult;
-    // --- 5. Editing (commit/cancel logic) ---
-    const editingResult = useDataGridEditing({
-        editingCell,
-        setEditingCell,
-        pendingEditorValue,
-        setPendingEditorValue,
-        visibleCols,
-        itemsLength: items.length,
-        onCellValueChanged,
-        setActiveCell,
-    });
-    // --- 6. View models ---
-    const { sortBy, sortDirection, filters, onFilterChange, filterOptions, loadingFilterOptions, peopleSearch, } = props;
-    const onFilterChangeRef = useLatestRef(onFilterChange);
-    const peopleSearchRef = useLatestRef(peopleSearch);
-    const stableOnFilterChange = useCallback((...args) => onFilterChangeRef.current?.(...args), [onFilterChangeRef]);
-    const stablePeopleSearch = useCallback((...args) => peopleSearchRef.current?.(...args) ?? Promise.resolve([]), [peopleSearchRef]);
-    const headerFilterInput = useMemo(() => ({
-        sortBy,
-        sortDirection,
-        onColumnSort: layoutResult.stableOnColumnSort,
-        filters,
-        onFilterChange: stableOnFilterChange,
-        filterOptions,
-        loadingFilterOptions,
-        peopleSearch: peopleSearch ? stablePeopleSearch : undefined,
-    }), [
-        sortBy,
-        sortDirection,
-        layoutResult.stableOnColumnSort,
-        filters,
-        stableOnFilterChange,
-        filterOptions,
-        loadingFilterOptions,
-        peopleSearch, stablePeopleSearch,
-    ]);
-    const cellDescriptorInput = useMemo(() => ({
-        editingCell,
-        activeCell: cellSelection ? activeCell : null,
-        selectionRange: cellSelection ? selectionRange : null,
-        cutRange: cellSelection ? cutRange : null,
-        copyRange: cellSelection ? copyRange : null,
-        colOffset,
-        itemsLength: items.length,
-        getRowId,
-        editable,
-        onCellValueChanged,
-        isDragging: cellSelection ? isDragging : false,
-    }), [
-        editingCell,
-        activeCell,
-        selectionRange,
-        cutRange,
-        copyRange,
-        colOffset,
-        items.length,
-        getRowId,
-        editable,
-        onCellValueChanged,
-        cellSelection,
-        isDragging,
-    ]);
-    const aggregation = useMemo(() => computeAggregations(items, visibleCols, cellSelection ? selectionRange : null), [items, visibleCols, selectionRange, cellSelection]);
-    const statusBarConfig = useMemo(() => {
-        const base = getDataGridStatusBarConfig(statusBar, items.length, selectedRowIds.size);
-        if (!base)
-            return null;
-        return { ...base, aggregation: aggregation ?? undefined };
-    }, [statusBar, items.length, selectedRowIds.size, aggregation]);
-    const showEmptyInGrid = items.length === 0 && !!emptyState && !props.isLoading;
-    // --- Memoize remaining sub-objects ---
-    const rowSelectionState = useMemo(() => ({
-        selectedRowIds, updateSelection, handleRowCheckboxChange,
-        handleSelectAll, allSelected, someSelected,
-    }), [selectedRowIds, updateSelection, handleRowCheckboxChange, handleSelectAll, allSelected, someSelected]);
-    const viewModelsState = useMemo(() => ({
-        headerFilterInput, cellDescriptorInput, statusBarConfig, showEmptyInGrid, onCellError,
-    }), [headerFilterInput, cellDescriptorInput, statusBarConfig, showEmptyInGrid, onCellError]);
-    return {
-        layout: layoutResult.layout,
-        rowSelection: rowSelectionState,
-        editing: editingResult.editing,
-        interaction: interactionResult.interaction,
-        contextMenu: contextMenuResult.contextMenu,
-        viewModels: viewModelsState,
-        pinning: layoutResult.pinning,
-    };
-}