@opencorestack/opengridx 1.2.1 → 1.2.3

package/lib/components/Cell/Cell.tsx

@@ -241,7 +241,7 @@ function CellImpl<R extends GridRowModel = GridRowModel>(props: CellProps<R>) {
                 ) : colDef.renderCell ? (
                     <CellErrorBoundary
                         field={colDef.field}
-                        resetKey={value}
+                        resetKey={row}
                         renderFn={() => colDef.renderCell!({
                             value,
                             row,

package/lib/components/Cell/CellErrorBoundary.tsx

@@ -1,5 +1,12 @@
 import React from 'react';
 
+// Must live at module scope (not inline) so React sees a stable component type.
+// Calling renderFn() here puts the throw one level BELOW CellErrorBoundary,
+// which is required — a component cannot catch errors thrown in its own render().
+function CellRenderTarget({ renderFn }: { renderFn: () => React.ReactNode }) {
+    return <>{renderFn()}</>;
+}
+
 interface CellErrorBoundaryProps {
     renderFn: () => React.ReactNode;
     field: string;
@@ -35,6 +42,12 @@ export class CellErrorBoundary extends React.Component<CellErrorBoundaryProps, C
         return { hasError: true, error };
     }
 
+    override componentDidCatch(error: Error, info: React.ErrorInfo) {
+        if (process.env.NODE_ENV !== 'production') {
+            console.warn(`[CellErrorBoundary] field="${this.props.field}"`, error, info.componentStack);
+        }
+    }
+
     override render() {
         if (this.state.hasError) {
             return (
@@ -48,6 +61,6 @@ export class CellErrorBoundary extends React.Component<CellErrorBoundaryProps, C
                 </div>
             );
         }
-        return this.props.renderFn();
+        return <CellRenderTarget renderFn={this.props.renderFn} />;
     }
 }

package/lib/components/ColumnVisibilityPanel/ColumnVisibilityPanel.test.tsx

@@ -0,0 +1,85 @@
+import { describe, it, expect } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import { ColumnVisibilityPanel } from './ColumnVisibilityPanel';
+import type { GridColDef } from '../../types';
+
+const columns: GridColDef[] = [
+    { field: 'name', headerName: 'Name' },
+    { field: 'department', headerName: 'Department' },
+    { field: 'groupKey', headerName: 'Group Key', hideable: false },
+];
+
+const visibleColumns = new Set(['name', 'department', 'groupKey']);
+
+const noop = () => {};
+
+describe('ColumnVisibilityPanel', () => {
+    it('excludes hideable:false columns from the list by default', () => {
+        render(
+            <ColumnVisibilityPanel
+                columns={columns}
+                visibleColumns={visibleColumns}
+                onVisibilityChange={noop}
+                onShowAll={noop}
+                onHideAll={noop}
+            />
+        );
+        expect(screen.getByText('Name')).toBeInTheDocument();
+        expect(screen.getByText('Department')).toBeInTheDocument();
+        expect(screen.queryByText('Group Key')).not.toBeInTheDocument();
+    });
+
+    it('shows hideable:false columns as disabled when showNonHideableColumns is true', () => {
+        render(
+            <ColumnVisibilityPanel
+                columns={columns}
+                visibleColumns={visibleColumns}
+                onVisibilityChange={noop}
+                onShowAll={noop}
+                onHideAll={noop}
+                showNonHideableColumns
+            />
+        );
+        expect(screen.getByText('Name')).toBeInTheDocument();
+        expect(screen.getByText('Department')).toBeInTheDocument();
+        expect(screen.getByText('Group Key')).toBeInTheDocument();
+
+        // 3 columns shown + 1 "Show/Hide All" checkbox in footer = 4 checkboxes
+        // The 3rd column (Group Key, hideable:false) must be the disabled one
+        const checkboxes = screen.getAllByRole('checkbox');
+        const disabledCheckboxes = checkboxes.filter(cb => (cb as HTMLInputElement).disabled);
+        expect(disabledCheckboxes).toHaveLength(1);
+    });
+
+    it('does not render a disabled checkbox for hideable:false columns by default', () => {
+        render(
+            <ColumnVisibilityPanel
+                columns={columns}
+                visibleColumns={visibleColumns}
+                onVisibilityChange={noop}
+                onShowAll={noop}
+                onHideAll={noop}
+            />
+        );
+        const checkboxes = screen.getAllByRole('checkbox');
+        const disabledCheckboxes = checkboxes.filter(cb => (cb as HTMLInputElement).disabled);
+        expect(disabledCheckboxes).toHaveLength(0);
+    });
+
+    it('never shows hideable:false columns even when search would match them', () => {
+        // Without showNonHideableColumns, hideable:false columns are not in the base list
+        // so they cannot appear regardless of search. This test verifies the base list,
+        // not a dynamic search interaction.
+        render(
+            <ColumnVisibilityPanel
+                columns={columns}
+                visibleColumns={visibleColumns}
+                onVisibilityChange={noop}
+                onShowAll={noop}
+                onHideAll={noop}
+            />
+        );
+        // "Group Key" is hideable:false — must not appear in the default panel
+        expect(screen.queryByText('Group Key')).not.toBeInTheDocument();
+    });
+});

package/lib/components/ColumnVisibilityPanel/ColumnVisibilityPanel.tsx

@@ -11,6 +11,8 @@ export interface ColumnVisibilityPanelProps<R extends GridRowModel = GridRowMode
     onHideAll: () => void;
     onColumnReorder?: (fromField: string, toField: string) => void;
     onColumnOrderReset?: () => void;
+    /** Show columns with `hideable: false` in the panel as disabled rows. Default: false. */
+    showNonHideableColumns?: boolean;
 }
 
 function SearchIcon() {
@@ -44,7 +46,7 @@ function DragHandleIcon() {
 export function ColumnVisibilityPanel<R extends GridRowModel = GridRowModel>(
     props: ColumnVisibilityPanelProps<R>
 ) {
-    const { columns, visibleColumns, onVisibilityChange, onShowAll, onHideAll, onColumnReorder, onColumnOrderReset } = props;
+    const { columns, visibleColumns, onVisibilityChange, onShowAll, onHideAll, onColumnReorder, onColumnOrderReset, showNonHideableColumns } = props;
     const [searchQuery, setSearchQuery] = useState('');
     const [dragOverField, setDragOverField] = useState<string | null>(null);
     const dragFieldRef = useRef<string | null>(null);
@@ -53,12 +55,13 @@ export function ColumnVisibilityPanel<R extends GridRowModel = GridRowModel>(
     const allVisible = hideableColumns.every(col => visibleColumns.has(col.field));
 
     const filteredColumns = useMemo(() => {
-        if (!searchQuery) return columns;
+        const base = showNonHideableColumns ? columns : hideableColumns;
+        if (!searchQuery) return base;
         const lowerQuery = searchQuery.toLowerCase();
-        return columns.filter(col =>
+        return base.filter(col =>
             (col.headerName || col.field).toLowerCase().includes(lowerQuery)
         );
-    }, [columns, searchQuery]);
+    }, [columns, hideableColumns, searchQuery, showNonHideableColumns]);
 
     const handleToggleAll = (e: React.ChangeEvent<HTMLInputElement>) => {
         if (e.target.checked) {

package/lib/components/DataGrid/DataGrid.tsx

@@ -467,6 +467,7 @@ export function DataGrid<R extends GridRowModel = GridRowModel>(props: DataGridP
 
     useEffect(() => {
         gridData.apiRef.current.getVisibleRows = () => pagination ? paginatedUnpinnedRows : sortedUnpinnedRows;
+        gridData.apiRef.current.getAllFilteredRows = () => sortedUnpinnedRows;
         gridData.apiRef.current.getVisibleColumns = () => effectiveColumns as unknown as GridColDef[];
     }, [sortedUnpinnedRows, paginatedUnpinnedRows, pagination, effectiveColumns, gridData.apiRef]);
 

package/lib/components/Toolbar/GridToolbar.tsx

@@ -74,6 +74,8 @@ export interface GridToolbarProps {
     renderQuickFilter?: (props: ToolbarQuickFilterRenderProps) => React.ReactNode;
     /** Additional CSS class applied to the toolbar root element. */
     className?: string;
+    /** Show columns with `hideable: false` in the Columns panel as disabled rows. Default: false. */
+    showNonHideableColumns?: boolean;
 }
 
 const AGGREGATION_FUNCTIONS = ['none', 'sum', 'avg', 'count', 'min', 'max'] as const;
@@ -248,7 +250,8 @@ function ColumnsPanelWrapper({
     onHideAll,
     onColumnReorder,
     onColumnOrderReset,
-    onClose
+    onClose,
+    showNonHideableColumns,
 }: {
     anchorRef: React.RefObject<HTMLElement | null>;
     columns: GridColDef[];
@@ -259,6 +262,7 @@ function ColumnsPanelWrapper({
     onColumnReorder?: (fromField: string, toField: string) => void;
     onColumnOrderReset?: () => void;
     onClose: () => void;
+    showNonHideableColumns?: boolean;
 }) {
     const panelRef = useRef<HTMLDivElement>(null);
     const [pos, setPos] = useState<PanelPosition>({ top: 0, right: 0 });
@@ -317,6 +321,7 @@ function ColumnsPanelWrapper({
                 onHideAll={onHideAll}
                 onColumnReorder={onColumnReorder}
                 onColumnOrderReset={onColumnOrderReset}
+                showNonHideableColumns={showNonHideableColumns}
             />
         </div>
     );
@@ -464,6 +469,7 @@ export function GridToolbar({
     renderExportButton,
     renderQuickFilter,
     className,
+    showNonHideableColumns,
 }: GridToolbarProps) {
     const [aggOpen, setAggOpen] = useState(false);
     const [pivotOpen, setPivotOpen] = useState(false);
@@ -631,6 +637,7 @@ export function GridToolbar({
                                 onColumnReorder={onColumnReorder}
                                 onColumnOrderReset={onColumnOrderReset}
                                 onClose={() => { setColsOpen(false); onColumnsPanelClose?.(); }}
+                                showNonHideableColumns={showNonHideableColumns}
                             />
                         )}
                     </div>

package/lib/hooks/core/useDataGrid.ts

@@ -299,6 +299,7 @@ export function useDataGrid<R extends GridRowModel = GridRowModel>(params: UseDa
     getRow: (id: GridRowId) => stateRef.current.rows.idRowsLookup.get(id) || null,
     getAllRows: () => Array.from(stateRef.current.rows.idRowsLookup.values()),
     getVisibleRows: () => Array.from(stateRef.current.rows.idRowsLookup.values()),
+    getAllFilteredRows: () => Array.from(stateRef.current.rows.idRowsLookup.values()),
     getAggregationResult: () => null,
     getAggregationModel: () => null,
     getColumn: (field: string) => stateRef.current.columns.lookup.get(field) || null,

package/lib/types/index.ts

@@ -817,6 +817,8 @@ export interface GridApi {
   getAllRows: () => GridRowModel[];
   /** Returns all rows currently visible after filtering and sorting. */
   getVisibleRows: () => GridRowModel[];
+  /** Returns all filtered and sorted rows, ignoring pagination. Use this for full-dataset exports. */
+  getAllFilteredRows: () => GridRowModel[];
   /** Returns the current aggregation results. */
   getAggregationResult: () => Record<string, unknown> | null;
   /** Returns the active aggregation configuration. */

package/lib/utils/export/exportToPdf.test.ts

@@ -15,7 +15,6 @@ const mockAddImage = vi.fn();
 const mockSetPage = vi.fn();
 
 class MockJsPDF {
-    autoTable = mockAutoTable;
     save = mockSave;
     setFontSize = mockSetFontSize;
     setFont = mockSetFont;
@@ -35,7 +34,7 @@ class MockJsPDF {
 }
 
 vi.mock('jspdf', () => ({ default: MockJsPDF }));
-vi.mock('jspdf-autotable', () => ({}));
+vi.mock('jspdf-autotable', () => ({ default: mockAutoTable }));
 
 const sampleColumns: GridColDef[] = [
     { field: 'name', headerName: 'Name', width: 150 },
@@ -72,7 +71,7 @@ describe('exportToPdf', () => {
     it('excludes columns with exportable: false and system columns', async () => {
         const { exportToPdf } = await import('./exportToPdf');
         await exportToPdf(sampleRows, sampleColumns);
-        const call = mockAutoTable.mock.calls[0][0];
+        const call = mockAutoTable.mock.calls[0][1];
         // head should only have Name and Salary — not Hidden or __check__
         expect(call.head[0]).toEqual(['Name', 'Salary']);
     });
@@ -80,7 +79,7 @@ describe('exportToPdf', () => {
     it('applies valueFormatter to cell values', async () => {
         const { exportToPdf } = await import('./exportToPdf');
         await exportToPdf(sampleRows, sampleColumns);
-        const call = mockAutoTable.mock.calls[0][0];
+        const call = mockAutoTable.mock.calls[0][1];
         // salary column should be formatted
         expect(call.body[0][1]).toBe('$90000');
         expect(call.body[1][1]).toBe('$80000');
@@ -89,7 +88,7 @@ describe('exportToPdf', () => {
     it('filters to selectedRows when provided', async () => {
         const { exportToPdf } = await import('./exportToPdf');
         await exportToPdf(sampleRows, sampleColumns, { selectedRows: [1] });
-        const call = mockAutoTable.mock.calls[0][0];
+        const call = mockAutoTable.mock.calls[0][1];
         expect(call.body).toHaveLength(1);
         expect(call.body[0][0]).toBe('Alice');
     });
@@ -100,7 +99,7 @@ describe('exportToPdf', () => {
             aggregationResult: { salary: 170000 },
             aggregationModel: { salary: 'sum' },
         });
-        const call = mockAutoTable.mock.calls[0][0];
+        const call = mockAutoTable.mock.calls[0][1];
         expect(call.foot).toBeDefined();
         expect(call.foot[0][1]).toBe('$170000');
     });

package/lib/utils/export/exportToPdf.ts

@@ -6,9 +6,7 @@ import type {
 } from '../../types';
 import { formatAggregationValue } from '../../hooks/features/useAggregation';
 
-// jsPDF plugin augments the jsPDF prototype — we type only what we use
 interface JsPDFDoc {
-    autoTable: (opts: AutoTableOptions) => void;
     save: (filename: string) => void;
     setFontSize: (size: number) => void;
     setFont: (name: string, style: string) => void;
@@ -112,10 +110,14 @@ export async function exportToPdf<R extends GridRowModel>(
 ): Promise<void> {
     // Lazy-load peer deps — provides a clear error if not installed
     let JsPDF: new (opts: Record<string, unknown>) => JsPDFDoc;
+    let autoTable: (doc: JsPDFDoc, opts: AutoTableOptions) => void;
     try {
-        const mod = await import('jspdf');
-        JsPDF = mod.default as unknown as new (opts: Record<string, unknown>) => JsPDFDoc;
-        await import('jspdf-autotable');
+        const [jspdfMod, autoTableMod] = await Promise.all([
+            import('jspdf'),
+            import('jspdf-autotable'),
+        ]);
+        JsPDF = jspdfMod.default as unknown as new (opts: Record<string, unknown>) => JsPDFDoc;
+        autoTable = autoTableMod.default as unknown as (doc: JsPDFDoc, opts: AutoTableOptions) => void;
     } catch {
         throw new Error(
             "exportToPdf requires 'jspdf' and 'jspdf-autotable'. Run: npm install jspdf jspdf-autotable"
@@ -235,7 +237,7 @@ export async function exportToPdf<R extends GridRowModel>(
     const [hr, hg, hb] = hexToRgb(headerBackgroundColor);
     const [tr, tg, tb] = hexToRgb(headerTextColor);
 
-    doc.autoTable({
+    autoTable(doc, {
         head,
         body,
         ...(foot ? { foot } : {}),
@@ -250,7 +252,7 @@ export async function exportToPdf<R extends GridRowModel>(
             ? { alternateRowStyles: { fillColor: [248, 250, 252] } }
             : {}),
         ...(foot
-            ? { footStyles: { fillColor: [241, 245, 249], fontStyle: 'bold' } }
+            ? { footStyles: { fillColor: [241, 245, 249], fontStyle: 'bold', textColor: [0, 0, 0] } }
             : {}),
         columnStyles,
         showFoot: foot ? 'lastPage' : 'never',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencorestack/opengridx",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "description": "OpenGridX: High-performance React data infrastructure. Unlock advanced Row Grouping, Excel Export, and Column Pinning without the usual \"Pro\" gatekeeping. Built for speed, scale, and complete architectural freedom. Fully open, virtualization-ready, and feature-complete.",
   "type": "module",
   "main": "./dist/opengridx.umd.js",