@opencorestack/opengridx 1.0.7 → 1.2.0

package/lib/components/DataGrid/GridPinnedRows.tsx

@@ -10,6 +10,7 @@ import type {
     GridRowPinning,
     GridDetailPanelParams,
     GridDetailPanelHeight,
+    GridRowMeta,
 } from '../../types';
 import type { CellColSpanInfo, RowSpanningCaches } from '../../hooks/features/useGridSpanning';
 
@@ -36,6 +37,7 @@ export interface GridPinnedRowsProps<R extends GridRowModel> {
     colspanMap?: Map<GridRowId, Record<string, CellColSpanInfo>>;
     rowSpanningCaches?: RowSpanningCaches;
     rowHeight: number;
+    rowMetaMap: Map<GridRowId, GridRowMeta>;
 }
 
 export function GridPinnedRows<R extends GridRowModel>({
@@ -61,6 +63,7 @@ export function GridPinnedRows<R extends GridRowModel>({
     colspanMap,
     rowSpanningCaches,
     rowHeight,
+    rowMetaMap,
 }: GridPinnedRowsProps<R>) {
     if (rows.length === 0) return null;
 
@@ -91,6 +94,7 @@ export function GridPinnedRows<R extends GridRowModel>({
                     colspanMap={colspanMap}
                     rowSpanningCaches={rowSpanningCaches}
                     rowHeight={rowHeight}
+                    rowMeta={rowMetaMap.get(row.id)}
                 />
             ))}
         </div>

package/lib/components/DataGrid/GridVirtualRows.tsx

@@ -12,6 +12,7 @@ import type {
     GridRowPinning,
     GridDetailPanelParams,
     GridDetailPanelHeight,
+    GridRowMeta,
 } from '../../types';
 import type { GridVisibleRow } from '../../hooks/core/useGridVisibleRows';
 import type { UseRowReorderReturn } from '../../hooks/useRowReorder';
@@ -60,6 +61,7 @@ export interface GridVirtualRowsProps<R extends GridRowModel> {
     sortedUnpinnedRowCount: number;
     infiniteScrollSkeletonCount: number;
     unpinnedRowsLength: number;
+    rowMetaMap: Map<GridRowId, GridRowMeta>;
 }
 
 export function GridVirtualRows<R extends GridRowModel>({
@@ -97,6 +99,7 @@ export function GridVirtualRows<R extends GridRowModel>({
     sortedUnpinnedRowCount,
     infiniteScrollSkeletonCount,
     unpinnedRowsLength,
+    rowMetaMap,
 }: GridVirtualRowsProps<R>) {
     const skeletonColumns: GridColDef<R>[] = baseColumns.length > 0
         ? baseColumns
@@ -179,6 +182,7 @@ export function GridVirtualRows<R extends GridRowModel>({
                             colspanMap={colspanMap}
                             rowSpanningCaches={rowSpanningCaches}
                             rowHeight={rowHeight}
+                            rowMeta={rowMetaMap.get(row.id)}
                         />
                     ))
                 )}

package/lib/components/Pagination/Pagination.test.tsx

@@ -0,0 +1,64 @@
+import { describe, it, expect, vi } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import { Pagination } from './Pagination';
+
+const NOOP = () => {};
+
+describe('Pagination', () => {
+    it('renders "0 of 0" when rowCount is 0', () => {
+        render(
+            <Pagination
+                page={0}
+                pageSize={10}
+                rowCount={0}
+                onPageChange={NOOP}
+                onPageSizeChange={NOOP}
+            />
+        );
+        expect(screen.getByText('0 of 0')).toBeTruthy();
+    });
+
+    it('calls localeText.paginationOf with (0, 0, 0) when rowCount is 0', () => {
+        const paginationOf = vi.fn().mockReturnValue('custom empty');
+        render(
+            <Pagination
+                page={0}
+                pageSize={10}
+                rowCount={0}
+                onPageChange={NOOP}
+                onPageSizeChange={NOOP}
+                localeText={{ paginationOf }}
+            />
+        );
+        expect(paginationOf).toHaveBeenCalledWith(0, 0, 0);
+        expect(screen.getByText('custom empty')).toBeTruthy();
+    });
+
+    it('renders correct row range label for non-empty data', () => {
+        render(
+            <Pagination
+                page={0}
+                pageSize={10}
+                rowCount={25}
+                onPageChange={NOOP}
+                onPageSizeChange={NOOP}
+            />
+        );
+        expect(screen.getByText('1–10 of 25')).toBeTruthy();
+    });
+
+    it('calls localeText.paginationOf with correct args for non-empty data', () => {
+        const paginationOf = vi.fn().mockReturnValue('custom range');
+        render(
+            <Pagination
+                page={1}
+                pageSize={10}
+                rowCount={25}
+                onPageChange={NOOP}
+                onPageSizeChange={NOOP}
+                localeText={{ paginationOf }}
+            />
+        );
+        expect(paginationOf).toHaveBeenCalledWith(11, 20, 25);
+    });
+});

package/lib/components/Pagination/Pagination.tsx

@@ -1,6 +1,7 @@
 
 import React, { useId } from 'react';
 import { Button } from '../ui/Button';
+import type { GridLocaleText } from '../../types';
 
 export interface PaginationProps {
     page: number;
@@ -11,6 +12,7 @@ export interface PaginationProps {
     pageSizeOptions?: number[];
     showFirstButton?: boolean;
     showLastButton?: boolean;
+    localeText?: Pick<GridLocaleText, 'paginationRowsPerPage' | 'paginationOf' | 'paginationPage'>;
 }
 
 export function Pagination(props: PaginationProps) {
@@ -23,7 +25,8 @@ export function Pagination(props: PaginationProps) {
         onPageSizeChange,
         pageSizeOptions = [10, 25, 50, 100],
         showFirstButton = true,
-        showLastButton = true
+        showLastButton = true,
+        localeText,
     } = props;
 
     const pageCount = Math.max(1, Math.ceil(rowCount / pageSize));
@@ -33,6 +36,14 @@ export function Pagination(props: PaginationProps) {
     const lastRowIndex = Math.min(firstRowIndex + pageSize, rowCount);
     const displayedRows = rowCount === 0 ? 0 : `${firstRowIndex + 1}–${lastRowIndex}`;
 
+    const rowsPerPageLabel = localeText?.paginationRowsPerPage ?? 'Rows per page:';
+    const ofLabel = localeText?.paginationOf
+        ? localeText.paginationOf(rowCount === 0 ? 0 : firstRowIndex + 1, lastRowIndex, rowCount)
+        : `${displayedRows} of ${rowCount}`;
+    const pageLabel = localeText?.paginationPage
+        ? localeText.paginationPage(currentPage + 1, pageCount)
+        : `Page ${currentPage + 1} of ${pageCount}`;
+
     const handleFirstPage = () => {
         onPageChange(0);
     };
@@ -63,7 +74,7 @@ export function Pagination(props: PaginationProps) {
             { }
             <div className="ogx-pagination__page-size">
                 <label htmlFor={pageSizeId} className="ogx-pagination__label">
-                    Rows per page:
+                    {rowsPerPageLabel}
                 </label>
                 <select
                     id={pageSizeId}
@@ -82,7 +93,7 @@ export function Pagination(props: PaginationProps) {
 
             { }
             <div className="ogx-pagination__info" aria-live="polite" aria-atomic="true">
-                {displayedRows} of {rowCount}
+                {ofLabel}
             </div>
 
             { }
@@ -116,7 +127,7 @@ export function Pagination(props: PaginationProps) {
                 </Button>
 
                 <div className="ogx-pagination__page-info" aria-current="page">
-                    Page {currentPage + 1} of {pageCount}
+                    {pageLabel}
                 </div>
 
                 <Button

package/lib/components/Row/Row.tsx

@@ -5,7 +5,7 @@ import { Checkbox } from '../ui/Checkbox';
 import { ExpandIcon } from '../ui/ExpandIcon';
 import { DragHandleIcon } from '../ui/DragHandleIcon';
 import { DetailPanel } from '../DetailPanel/DetailPanel';
-import type { GridRowModel, GridColDef, GridRowId, GridColumnPinning, GridRowPinning, GridRowParams, GridCellParams, GridDetailPanelHeight } from '../../types';
+import type { GridRowModel, GridColDef, GridRowId, GridColumnPinning, GridRowPinning, GridRowParams, GridCellParams, GridDetailPanelHeight, GridRowMeta } from '../../types';
 import type { CellColSpanInfo, RowSpanningCaches } from '../../hooks/features/useGridSpanning';
 import { isColumnPinned, calculatePinnedPositions, isRowPinned } from '../../utils/pinning';
 
@@ -51,6 +51,7 @@ export interface RowProps<R extends GridRowModel = GridRowModel> {
     colspanMap?: Map<GridRowId, Record<string, CellColSpanInfo>>;
     rowSpanningCaches?: RowSpanningCaches;
     rowHeight?: number;
+    rowMeta?: GridRowMeta;
 }
 
 export function Row<R extends GridRowModel = GridRowModel>(props: RowProps<R>) {
@@ -91,7 +92,8 @@ export function Row<R extends GridRowModel = GridRowModel>(props: RowProps<R>) {
 
         colspanMap,
         rowSpanningCaches,
-        rowHeight = 52
+        rowHeight = 52,
+        rowMeta
     } = props;
 
     const checkboxId = useId();
@@ -121,7 +123,7 @@ export function Row<R extends GridRowModel = GridRowModel>(props: RowProps<R>) {
         );
     }, [columns, columnWidths, pinnedColumns, checkboxSelection, pinCheckboxColumn, hasDetailPanel, pinExpandColumn, rowReordering]);
 
-    const isGroupRow = row._hasChildren === true;
+    const isGroupRow = rowMeta?.hasChildren === true;
 
     const handleCellEditStart = React.useCallback((field: string, value: unknown) => {
         if (!isGroupRow) {
@@ -358,6 +360,7 @@ export function Row<R extends GridRowModel = GridRowModel>(props: RowProps<R>) {
                             colSpanInfo={colSpanInfo}
                             rowSpan={rowSpan}
                             isHiddenByRowSpan={isHiddenByRowSpan}
+                            rowMeta={rowMeta}
                         />
                     );
                 })}

package/lib/hooks/core/useGridColumns.tsx

@@ -74,14 +74,14 @@ export function useGridColumns<R extends GridRowModel>(
                 return {
                     ...col,
                     renderCell: (cellParams: GridRenderCellParams<R>) => {
-                        const r = cellParams.row as Record<string, unknown>;
-                        const depth = typeof r._treeDepth === 'number' ? r._treeDepth : 0;
-                        const hasChildren = Boolean(r._hasChildren);
-                        const isExpanded = Boolean(r._isExpanded);
-                        const groupingField = typeof r._groupingField === 'string' ? r._groupingField : undefined;
-                        const groupingValue = r._groupingValue;
-                        const descendantCount = typeof r._descendantCount === 'number' ? r._descendantCount : undefined;
-                        const isGroupRow = Boolean(r._isGroupRow);
+                        const meta = cellParams.rowMeta;
+                        const depth = meta?.treeDepth ?? 0;
+                        const hasChildren = Boolean(meta?.hasChildren);
+                        const isExpanded = Boolean(meta?.isExpanded);
+                        const groupingField = meta?.groupingField;
+                        const groupingValue = meta?.groupingValue;
+                        const descendantCount = meta?.descendantCount;
+                        const isGroupRow = Boolean(meta?.isGroupRow);
 
                         let content: React.ReactNode = col.renderCell ? col.renderCell(cellParams) : cellParams.value as React.ReactNode;
 
@@ -130,9 +130,9 @@ export function useGridColumns<R extends GridRowModel>(
             return {
                 ...col,
                 renderCell: (cellParams: GridRenderCellParams<R>) => {
-                    const r = cellParams.row as Record<string, unknown>;
-                    const hasChildren = Boolean(r._hasChildren);
-                    const groupingField = typeof r._groupingField === 'string' ? r._groupingField : undefined;
+                    const meta = cellParams.rowMeta;
+                    const hasChildren = Boolean(meta?.hasChildren);
+                    const groupingField = meta?.groupingField;
 
                     if (isRowGrouping && hasChildren) {
                         if (col.field === groupingField) return null;

package/lib/hooks/core/useGridControlledState.test.ts

@@ -0,0 +1,86 @@
+import { describe, it, expect } from 'vitest';
+import { renderHook, act } from '@testing-library/react';
+import { useGridControlledState } from './useGridControlledState';
+
+const BASE_PARAMS = {
+    sortModel: undefined,
+    paginationModel: undefined,
+    rowSelectionModel: undefined,
+};
+
+describe('useGridControlledState — sort', () => {
+    it('uncontrolled: setInternalSortModel updates sortModel', () => {
+        const { result } = renderHook(() => useGridControlledState(BASE_PARAMS));
+        expect(result.current.sortModel).toEqual([]);
+        act(() => {
+            result.current.setInternalSortModel([{ field: 'name', sort: 'asc' }]);
+        });
+        expect(result.current.sortModel).toEqual([{ field: 'name', sort: 'asc' }]);
+    });
+
+    it('controlled: external sortModel prop always wins', () => {
+        const externalSort = [{ field: 'age', sort: 'desc' as const }];
+        const { result } = renderHook(() =>
+            useGridControlledState({ ...BASE_PARAMS, sortModel: externalSort })
+        );
+        expect(result.current.isSortControlled).toBe(true);
+        expect(result.current.sortModel).toEqual(externalSort);
+        act(() => {
+            result.current.setInternalSortModel([{ field: 'name', sort: 'asc' }]);
+        });
+        // External prop still wins
+        expect(result.current.sortModel).toEqual(externalSort);
+    });
+
+    it('initialState.sorting seeds the internal sort model', () => {
+        const { result } = renderHook(() =>
+            useGridControlledState({
+                ...BASE_PARAMS,
+                initialState: { sorting: { sortModel: [{ field: 'name', sort: 'asc' }] } },
+            })
+        );
+        expect(result.current.sortModel).toEqual([{ field: 'name', sort: 'asc' }]);
+    });
+});
+
+describe('useGridControlledState — pagination', () => {
+    it('uncontrolled: handlePaginationModelChange updates effectivePaginationModel', () => {
+        const { result } = renderHook(() => useGridControlledState(BASE_PARAMS));
+        act(() => {
+            result.current.handlePaginationModelChange({ page: 2, pageSize: 25 });
+        });
+        expect(result.current.effectivePaginationModel).toEqual({ page: 2, pageSize: 25 });
+    });
+
+    it('controlled: external paginationModel always wins', () => {
+        const externalPagination = { page: 3, pageSize: 50 };
+        const { result } = renderHook(() =>
+            useGridControlledState({ ...BASE_PARAMS, paginationModel: externalPagination })
+        );
+        expect(result.current.effectivePaginationModel).toEqual(externalPagination);
+        act(() => {
+            result.current.handlePaginationModelChange({ page: 0, pageSize: 10 });
+        });
+        expect(result.current.effectivePaginationModel).toEqual(externalPagination);
+    });
+
+    it('initialState.pagination seeds page and pageSize', () => {
+        const { result } = renderHook(() =>
+            useGridControlledState({
+                ...BASE_PARAMS,
+                initialState: { pagination: { paginationModel: { page: 1, pageSize: 25 } } },
+            })
+        );
+        expect(result.current.effectivePaginationModel).toEqual({ page: 1, pageSize: 25 });
+    });
+});
+
+describe('useGridControlledState — selection', () => {
+    it('uncontrolled: setInternalRowSelectionModel updates selectedRowIds', () => {
+        const { result } = renderHook(() => useGridControlledState(BASE_PARAMS));
+        act(() => {
+            result.current.setInternalRowSelectionModel([1, 2, 3]);
+        });
+        expect(result.current.selectedRowIds).toEqual(new Set([1, 2, 3]));
+    });
+});

package/lib/hooks/core/useGridKeyboardNavigation.test.ts

@@ -0,0 +1,176 @@
+import { describe, it, expect, vi } from 'vitest';
+import { renderHook, act } from '@testing-library/react';
+import React from 'react';
+import { useGridKeyboardNavigation } from './useGridKeyboardNavigation';
+
+// Helper: build a minimal React.KeyboardEvent mock
+function keyEvent(key: string): React.KeyboardEvent {
+    return {
+        key,
+        preventDefault: vi.fn(),
+        stopPropagation: vi.fn(),
+        nativeEvent: new KeyboardEvent('keydown', { key }),
+        isDefaultPrevented: () => false,
+        isPropagationStopped: () => false,
+        persist: vi.fn(),
+        bubbles: true,
+        cancelable: true,
+        defaultPrevented: false,
+        eventPhase: 0,
+        isTrusted: false,
+        timeStamp: 0,
+        type: 'keydown',
+        currentTarget: null,
+        target: null,
+        shiftKey: false,
+        ctrlKey: false,
+        metaKey: false,
+        altKey: false,
+    } as unknown as React.KeyboardEvent;
+}
+
+const ROWS = [
+    { id: 1, name: 'Alice' },
+    { id: 2, name: 'Bob' },
+    { id: 3, name: 'Carol' },
+];
+
+const NAV_COLS = [
+    { field: 'name' },
+    { field: 'age' },
+];
+
+const MOCK_EDITING = {
+    editingCell: null,
+    startCellEdit: vi.fn(),
+    stopCellEdit: vi.fn(),
+};
+
+const MOCK_VIRTUALIZATION = {
+    cumulativeHeights: [52, 104, 156],
+    pinnedTopHeight: 0,
+    columnMetrics: null,
+};
+
+const BASE_PARAMS = {
+    allRenderableRows: ROWS,
+    navigationColumns: NAV_COLS,
+    checkboxSelection: false,
+    selectedRowIds: new Set<number | string>(),
+    handleSelectionChange: vi.fn(),
+    handleDetailPanelToggle: vi.fn(),
+    editingHandlers: MOCK_EDITING,
+    setKeyboardMode: vi.fn(),
+    sortModel: [],
+    handleSort: vi.fn(),
+    isCellEditable: undefined,
+    pagination: false,
+    pageSize: 100,
+    virtualization: MOCK_VIRTUALIZATION,
+    viewportRef: { current: null } as React.RefObject<HTMLDivElement | null>,
+};
+
+describe('useGridKeyboardNavigation — arrow keys', () => {
+    it('ArrowDown moves focusedCell to the next row', () => {
+        const { result } = renderHook(() => useGridKeyboardNavigation(BASE_PARAMS));
+        act(() => { result.current.setFocusedCell({ id: 1, field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('ArrowDown')); });
+        expect(result.current.focusedCell).toEqual({ id: 2, field: 'name' });
+    });
+
+    it('ArrowUp at header row does not move above it', () => {
+        const { result } = renderHook(() => useGridKeyboardNavigation(BASE_PARAMS));
+        // HEADER is the topmost position; ArrowUp from there should not move
+        act(() => { result.current.setFocusedCell({ id: 'HEADER', field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('ArrowUp')); });
+        expect(result.current.focusedCell?.id).toBe('HEADER');
+    });
+
+    it('ArrowDown at last row — no change', () => {
+        const { result } = renderHook(() => useGridKeyboardNavigation(BASE_PARAMS));
+        // ROWS has 3 entries; last row id is 3
+        const lastRow = ROWS[ROWS.length - 1];
+        act(() => { result.current.setFocusedCell({ id: lastRow.id, field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('ArrowDown')); });
+        expect(result.current.focusedCell?.id).toBe(lastRow.id);
+    });
+
+    it('ArrowRight moves focusedCell to next column', () => {
+        const { result } = renderHook(() => useGridKeyboardNavigation(BASE_PARAMS));
+        act(() => { result.current.setFocusedCell({ id: 1, field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('ArrowRight')); });
+        expect(result.current.focusedCell?.field).toBe('age');
+    });
+
+    it('ArrowLeft at header first column does not move left', () => {
+        const { result } = renderHook(() => useGridKeyboardNavigation(BASE_PARAMS));
+        // HEADER + first col is the leftmost position; wrap-left would require r=-2 which is out of bounds
+        act(() => { result.current.setFocusedCell({ id: 'HEADER', field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('ArrowLeft')); });
+        expect(result.current.focusedCell?.field).toBe('name');
+    });
+});
+
+describe('useGridKeyboardNavigation — Home / End', () => {
+    it('Home moves to first column', () => {
+        const { result } = renderHook(() => useGridKeyboardNavigation(BASE_PARAMS));
+        act(() => { result.current.setFocusedCell({ id: 1, field: 'age' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('Home')); });
+        expect(result.current.focusedCell?.field).toBe('name');
+    });
+
+    it('End moves to last column', () => {
+        const { result } = renderHook(() => useGridKeyboardNavigation(BASE_PARAMS));
+        act(() => { result.current.setFocusedCell({ id: 1, field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('End')); });
+        expect(result.current.focusedCell?.field).toBe('age');
+    });
+});
+
+describe('useGridKeyboardNavigation — editing', () => {
+    it('Enter calls startCellEdit on an editable cell', () => {
+        const startCellEdit = vi.fn();
+        const params = {
+            ...BASE_PARAMS,
+            editingHandlers: { ...MOCK_EDITING, startCellEdit },
+            navigationColumns: [{ field: 'name', editable: true }],
+        };
+        const { result } = renderHook(() => useGridKeyboardNavigation(params));
+        act(() => { result.current.setFocusedCell({ id: 1, field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('Enter')); });
+        expect(startCellEdit).toHaveBeenCalledWith(
+            expect.objectContaining({ id: 1, field: 'name' })
+        );
+    });
+
+    it('Escape calls stopCellEdit with cancel=true when editing', () => {
+        const stopCellEdit = vi.fn();
+        const params = {
+            ...BASE_PARAMS,
+            editingHandlers: {
+                editingCell: { id: 1, field: 'name', value: 'Alice' },
+                startCellEdit: vi.fn(),
+                stopCellEdit,
+            },
+        };
+        const { result } = renderHook(() => useGridKeyboardNavigation(params));
+        act(() => { result.current.setFocusedCell({ id: 1, field: 'name' }); });
+        act(() => { result.current.handleKeyDown(keyEvent('Escape')); });
+        expect(stopCellEdit).toHaveBeenCalledWith({ cancel: true });
+    });
+});
+
+describe('useGridKeyboardNavigation — selection', () => {
+    it('Space toggles checkbox selection on focused row', () => {
+        const handleSelectionChange = vi.fn();
+        const { result } = renderHook(() => useGridKeyboardNavigation({
+            ...BASE_PARAMS,
+            checkboxSelection: true,
+            handleSelectionChange,
+        }));
+        // Space only fires handleSelectionChange when field === '__checkbox_col__'
+        act(() => { result.current.setFocusedCell({ id: 2, field: '__checkbox_col__' }); });
+        act(() => { result.current.handleKeyDown(keyEvent(' ')); });
+        expect(handleSelectionChange).toHaveBeenCalledWith(2, true);
+    });
+});

package/lib/hooks/core/useGridRowPipeline.test.ts

@@ -0,0 +1,117 @@
+import { describe, it, expect } from 'vitest';
+import { renderHook } from '@testing-library/react';
+import { useGridRowPipeline } from './useGridRowPipeline';
+
+const DEFAULT_PAGINATION = { page: 0, pageSize: 3 };
+
+const ROWS = [
+    { id: 1, name: 'Alice', age: 30 },
+    { id: 2, name: 'Bob', age: 25 },
+    { id: 3, name: 'Carol', age: 35 },
+    { id: 4, name: 'Dan', age: 28 },
+    { id: 5, name: 'Eve', age: 22 },
+];
+
+const BASE_PARAMS = {
+    effectiveRows: ROWS,
+    activeHierarchyHandlers: null,
+    filterMode: 'client',
+    filterModel: { items: [] },
+    sortModel: [],
+    sortingMode: 'client',
+    pagination: false,
+    paginationMode: 'client',
+    effectivePaginationModel: DEFAULT_PAGINATION,
+    isLoading: false,
+    pageSize: 3,
+};
+
+describe('useGridRowPipeline — filtering', () => {
+    it('passes all rows through when filterModel is empty', () => {
+        const { result } = renderHook(() => useGridRowPipeline(BASE_PARAMS));
+        expect(result.current.filteredRows).toHaveLength(5);
+    });
+
+    it('filters rows by string contains operator', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            filterModel: { items: [{ id: 'f1', field: 'name', operator: 'contains' as const, value: 'al' }] },
+        }));
+        // 'Alice' contains 'al' (case-insensitive); 'Carol' does not ('car-o-l')
+        expect(result.current.filteredRows.map(r => r.id)).toEqual([1]);
+    });
+
+    it('filterMode=server passes rows through unfiltered', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            filterMode: 'server',
+            // dataSource required: hook only bypasses filtering when both filterMode=server AND dataSource are set
+            dataSource: {} as never,
+            filterModel: { items: [{ id: 'f1', field: 'name', operator: 'contains' as const, value: 'Alice' }] },
+        }));
+        expect(result.current.filteredRows).toHaveLength(5);
+    });
+});
+
+describe('useGridRowPipeline — sorting', () => {
+    it('sorts rows ascending by field', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            sortModel: [{ field: 'age', sort: 'asc' }],
+        }));
+        const ages = result.current.sortedUnpinnedRows.map(r => r.age);
+        expect(ages).toEqual([22, 25, 28, 30, 35]);
+    });
+
+    it('sorts rows descending by field', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            sortModel: [{ field: 'age', sort: 'desc' }],
+        }));
+        const ages = result.current.sortedUnpinnedRows.map(r => r.age);
+        expect(ages).toEqual([35, 30, 28, 25, 22]);
+    });
+
+    it('sortingMode=server passes rows through unsorted', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            sortingMode: 'server',
+            // dataSource required: hook only bypasses sorting when both sortingMode=server AND dataSource are set
+            dataSource: {} as never,
+            sortModel: [{ field: 'age', sort: 'asc' }],
+        }));
+        // Rows stay in original order
+        expect(result.current.sortedUnpinnedRows.map(r => r.id)).toEqual([1, 2, 3, 4, 5]);
+    });
+});
+
+describe('useGridRowPipeline — pagination', () => {
+    it('returns first pageSize rows on page 0', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            pagination: true,
+            effectivePaginationModel: { page: 0, pageSize: 3 },
+        }));
+        expect(result.current.paginatedUnpinnedRows.map(r => r.id)).toEqual([1, 2, 3]);
+    });
+
+    it('returns correct offset slice on page 1', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            pagination: true,
+            effectivePaginationModel: { page: 1, pageSize: 3 },
+        }));
+        expect(result.current.paginatedUnpinnedRows.map(r => r.id)).toEqual([4, 5]);
+    });
+
+    it('paginationMode=server returns all rows unsliced', () => {
+        const { result } = renderHook(() => useGridRowPipeline({
+            ...BASE_PARAMS,
+            pagination: true,
+            paginationMode: 'server',
+            dataSource: {} as never,
+            effectivePaginationModel: { page: 0, pageSize: 2 },
+        }));
+        expect(result.current.paginatedUnpinnedRows).toHaveLength(5);
+    });
+});