@jmruthers/pace-core 0.6.8 → 0.6.10

package/src/components/DataTable/__tests__/README.md

@@ -74,7 +74,7 @@ The `DataTable.regressionFixes.test.tsx` file documents specific fixes:
 
 - **Action Button Icons and Behavior (4 tests)**
   - Pencil icons for Edit buttons
-  - Trash icons for Delete buttons
+  - Trash2 icons for Delete buttons
   - Correct edit mode entry behavior
   - Immediate delete handler execution
 

package/src/components/DataTable/__tests__/a11y.basic.test.tsx

@@ -9,7 +9,7 @@
  */
 
 import React from 'react';
-import { render, screen, fireEvent, waitFor, within } from '@testing-library/react';
+import { render, screen, waitFor, within } from '@testing-library/react';
 import { axe, toHaveNoViolations } from 'jest-axe';
 import userEvent from '@testing-library/user-event';
 import { vi, beforeEach, afterEach } from 'vitest';

package/src/components/DataTable/__tests__/keyboard.test.tsx

@@ -9,7 +9,7 @@
  */
 
 import React from 'react';
-import { render, screen, fireEvent, waitFor, within } from '@testing-library/react';
+import { render, screen, waitFor, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { vi, beforeEach, afterEach } from 'vitest';
 import { DataTable } from '../DataTable';

package/src/components/DataTable/__tests__/pagination.modes.test.tsx

@@ -9,7 +9,7 @@
  */
 
 import React from 'react';
-import { render, screen, fireEvent, waitFor, act } from '@testing-library/react';
+import { render, screen, act, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { vi, describe, it, expect, beforeEach, afterEach } from 'vitest';
 import { DataTable } from '../DataTable';
@@ -337,7 +337,6 @@ describe('getPaginationBinding', () => {
 
 describe('DataTable Pagination Integration', () => {
   const smallDataset = generateTestData(25);
-  const largeDataset = generateTestData(100);
 
   describe('Client Mode Integration', () => {
     it('should render pagination controls for client mode', async () => {
@@ -449,7 +448,6 @@ describe('DataTable Pagination Integration', () => {
 
   describe('Server Mode Integration', () => {
     it('should validate server mode configuration', () => {
-      const mockFetchData = vi.fn();
       const mockOnPageChange = vi.fn();
       const mockOnPageSizeChange = vi.fn();
 

package/src/components/DataTable/__tests__/ssr.strict-mode.test.tsx

@@ -197,14 +197,8 @@ describe('DataTable SSR and Strict Mode Compatibility', () => {
       if (!window.location) {
         (window as any).location = { reload: () => {} } as any;
       }
-      const originalReload = window.location.reload?.bind(window.location);
       const mockReload = vi.fn();
       // Some environments have readonly location.reload; simulate guard by calling through a wrapper
-      const callReloadSafely = () => {
-        try {
-          window.location.reload();
-        } catch {}
-      };
 
       // Render a minimal access denied UI that does not invoke reload
       const AccessDeniedStub = () => <div>Access Denied</div>;

package/src/components/DataTable/__tests__/test-utils/sharedTestUtils.tsx

@@ -8,7 +8,7 @@
  * Shared utilities and helpers for DataTable tests to reduce duplication
  * and provide consistent testing patterns across the test suite.
  */
-import type { DataTableColumn, DataTableAction, DataTableFeatureConfig } from '../../types';
+import type { DataTableAction, DataTableFeatureConfig } from '../../types';
 // AccessLevel removed - use AccessLevel type from rbac/types.ts if needed
 import '@testing-library/jest-dom';
 import React from 'react';
@@ -123,7 +123,7 @@ export const createTanStackTableModuleMock = (tableMock: any = {}) => ({
   getPaginationRowModel: vi.fn(),
   getGroupedRowModel: vi.fn(),
   getExpandedRowModel: vi.fn(),
-  flexRender: vi.fn((component: unknown, props: unknown) => 'Mocked Cell'),
+  flexRender: vi.fn((_component: unknown, _props: unknown) => 'Mocked Cell'),
   createColumnHelper: vi.fn(),
 });
 
@@ -132,23 +132,31 @@ export const createTanStackTableModuleMock = (tableMock: any = {}) => ({
  */
 export const createPerformanceUtilsMock = () => ({
   DataChunkManager: class MockDataChunkManager {
-    constructor(config: any) {}
+    constructor(_config: unknown) {
+      // Mock constructor - config parameter kept for API compatibility
+    }
     getChunk = vi.fn(() => [])
     getMemoryUsage = vi.fn(() => 5)
     clear = vi.fn()
   },
   SearchIndex: class MockSearchIndex {
-    constructor(config: any) {}
+    constructor(_config: unknown) {
+      // Mock constructor - config parameter kept for API compatibility
+    }
     buildIndex = vi.fn()
     search = vi.fn(() => [{ id: '1', name: 'Test User' }])
   },
   PerformanceMonitor: class MockPerformanceMonitor {
-    constructor() {}
+    constructor() {
+      // Mock constructor - no initialization needed
+    }
     startRender = vi.fn()
     endRender = vi.fn()
   },
   VisibilityTracker: class MockVisibilityTracker {
-    constructor() {}
+    constructor() {
+      // Mock constructor - no initialization needed
+    }
     observe = vi.fn()
     unobserve = vi.fn()
     disconnect = vi.fn()

package/src/components/DataTable/components/ActionButtons.tsx

@@ -97,7 +97,7 @@ function ActionButtonsComponent<TData extends DataRecord = DataRecord>({
     return null;
   }
 
-  const renderAction = (action: DataTableAction<TData>, actionIndex: number) => {
+  const renderAction = (action: DataTableAction<TData>, _actionIndex: number) => {
     let Icon = action.icon;
     let label = action.label;
 
@@ -124,11 +124,12 @@ function ActionButtonsComponent<TData extends DataRecord = DataRecord>({
         {visibleActions.map((action, actionIndex) => {
           const { Icon, label } = renderAction(action, actionIndex);
           const isDisabled = evaluateCondition(action.disabled, rowData, false);
+          const hasIcon = Boolean(Icon);
 
           return (
             <Button
               key={actionIndex}
-              variant={action.variant === 'destructive' ? 'destructive' : 'ghost'}
+              variant={action.variant || 'ghost'}
               size="sm"
               onClick={() => {
                 if (!isDisabled) {
@@ -139,9 +140,13 @@ function ActionButtonsComponent<TData extends DataRecord = DataRecord>({
               aria-disabled={isDisabled}
               data-testid={action.testId}
               aria-label={label}
-              className="size-8 p-0"
+              className={hasIcon ? "size-8 p-0" : "h-8 px-2"}
             >
-              {Icon && <Icon className="size-4" />}
+              {Icon ? (
+                <Icon className="size-4" />
+              ) : (
+                <span className="text-xs whitespace-nowrap">{label}</span>
+              )}
             </Button>
           );
         })}

package/src/components/DataTable/components/BulkOperationsDropdown.tsx

@@ -52,7 +52,7 @@ import { Button } from '../../Button/Button';
 import { 
   MoreHorizontal, 
   Download, 
-  Trash 
+  Trash2 
 } from 'lucide-react';
 
 /**
@@ -64,7 +64,7 @@ export interface BulkOperationsDropdownProps {
   /** Currently selected rows */
   selectedRows: Record<string, boolean>;
   /** Handler for bulk operations */
-  onOperation?: (operation: string, selectedRows: any[]) => void;
+  onOperation?: (operation: string, selectedRows: string[]) => void;
   /** Custom class names */
   className?: string;
 }
@@ -93,7 +93,7 @@ export function BulkOperationsDropdown({
   // Icon mapping for operations
   const operationIcons = {
     export: Download,
-    delete: Trash,
+    delete: Trash2,
   };
 
   // Label mapping for operations

package/src/components/DataTable/components/ColumnFilter.tsx

@@ -4,12 +4,13 @@ import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '.
 import type { Column } from '@tanstack/react-table';
 import { getColumnHeaderText } from '../utils/columnUtils';
 import { Filter } from 'lucide-react';
+import type { DataRecord } from '../types';
 
 /**
  * Props for the ColumnFilter component.
  */
 interface ColumnFilterProps {
-  column: Column<any, unknown>;
+  column: Column<DataRecord, unknown>;
   placeholder?: string;
   filterType?: 'text' | 'select' | 'number' | 'date';
   options?: Array<{ value: string; label: string }>;
@@ -43,12 +44,6 @@ export function ColumnFilter({
     }
   };
 
-  const clearFilter = () => {
-    column.setFilterValue(undefined);
-  };
-
-  const hasFilter = columnFilterValue !== undefined && columnFilterValue !== '';
-  
   // Get the default placeholder using column header text (for Input components)
   const defaultPlaceholder = `Filter ${getColumnHeaderText(column)}...`;
   // For Select components, use just the column name (icon will replace "Filter" text)

package/src/components/DataTable/components/DataTableCore.tsx

@@ -8,13 +8,10 @@
  * This is the main component that consumers will use.
  */
 
-import React, { useMemo, useCallback, useEffect, useLayoutEffect, useRef, useState, startTransition, useDeferredValue } from 'react';
-import { useReactTable } from '@tanstack/react-table';
+import React, { useMemo, useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
+import { useReactTable, type SortingState } from '@tanstack/react-table';
 import { useLocation } from 'react-router-dom';
-import type {
-  SortingState,
-} from '@tanstack/react-table';
-import { Edit, Trash } from 'lucide-react';
+import { Edit, Trash2 } from 'lucide-react';
 import { useDataTablePerformance } from '../../../hooks/useDataTablePerformance';
 import { LoadingState } from './LoadingState';
 import { DataTableLayout } from './DataTableLayout';
@@ -25,10 +22,8 @@ import { useDataTableState } from '../hooks/useDataTableState';
 import { useDataTableDataPipeline } from '../hooks/useDataTableDataPipeline';
 import { useServerSideDataEffect } from '../hooks/useServerSideDataEffect';
 import { useEffectiveColumnOrder } from '../hooks/useEffectiveColumnOrder';
-import { useTableHandlers } from '../hooks/useTableHandlers';
+import { useTableHandlers, type TableStateSnapshot } from '../hooks/useTableHandlers';
 import { useDataTableConfiguration } from '../hooks/useDataTableConfiguration';
-import type { TableStateSnapshot } from '../hooks/useTableHandlers';
-import { ColumnFactory } from '../core/ColumnFactory';
 import { AccessDeniedPage } from './AccessDeniedPage';
 // NOTE: All toast() calls in this component use the default timeout (5 seconds).
 // Do NOT set duration or timeout properties - let the toast system use its default.
@@ -44,23 +39,23 @@ import { usePermissionTracking } from './hooks/usePermissionTracking';
 import { useImportModalFocus } from './hooks/useImportModalFocus';
 import { toCellValueRecord } from './cellValueUtils';
 
-import { normalizeDataTableFeatures } from '../types';
-import type {
-  DataRecord,
-  GetRowId,
-  PerformanceConfig,
-  ServerSideConfig,
-  ChunkingConfig,
-  SearchIndexConfig,
-  PaginationMode,
-  EmptyStateConfig,
-  DataTableFeatureConfig,
-  NormalizedDataTableFeatureConfig,
-  DataTableColumn,
-  AggregateConfig,
-  DataTableAction,
-  HierarchicalConfig,
-  DataTableRBACConfig,
+import {
+  normalizeDataTableFeatures,
+  type DataRecord,
+  type GetRowId,
+  type PerformanceConfig,
+  type ServerSideConfig,
+  type ChunkingConfig,
+  type SearchIndexConfig,
+  type PaginationMode,
+  type EmptyStateConfig,
+  type DataTableFeatureConfig,
+  type NormalizedDataTableFeatureConfig,
+  type DataTableColumn,
+  type AggregateConfig,
+  type DataTableAction,
+  type HierarchicalConfig,
+  type DataTableRBACConfig,
 } from '../types';
 import type { ImportModalConfig } from './ImportModal';
 
@@ -120,7 +115,7 @@ export interface DataTableCoreProps<TData extends DataRecord> {
   // Utilities
   getRowId?: GetRowId<TData>;
   isLoading?: boolean;
-  emptyState?: EmptyStateConfig | React.ReactElement<any>;
+  emptyState?: EmptyStateConfig | React.ReactElement;
   aggregates?: AggregateConfig[];
   importModalConfig?: ImportModalConfig;
   actions?: DataTableAction<TData>[];
@@ -129,6 +124,8 @@ export interface DataTableCoreProps<TData extends DataRecord> {
   // Default state configuration
   defaultGrouping?: string[];
   defaultSorting?: SortingState;
+  /** Initial column visibility state - columns with value `false` will be hidden by default */
+  initialColumnVisibility?: Record<string, boolean>;
   
   // Persistence configuration
   storageKey?: string;
@@ -158,7 +155,7 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
     virtualHeight = 600,
     enhancedPagination = false,
     loadingComponent: LoadingComponent = LoadingState,
-    errorComponent: ErrorComponent,
+    errorComponent: _ErrorComponent,
     initialPageSize = 10,
     onEditRow,
     onDeleteRow,
@@ -177,6 +174,7 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
     columnOrder: externalColumnOrder,
     defaultGrouping,
     defaultSorting,
+    initialColumnVisibility: initialColumnVisibilityProp,
     storageKey,
     onLayoutChange,
   } = props;
@@ -242,11 +240,6 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
   useEffect(() => {
     dataChangeCountRef.current += 1;
     
-    const previousLength = previousDataLengthRef.current;
-    const currentLength = data.length;
-    const snapshotLength = dataSnapshotRef.current.length;
-    const lengthDecreased = currentLength < previousLength;
-    
     // Data prop changed (logging removed for performance)
   }, [data, isDeleting]);
   
@@ -304,18 +297,19 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
     updateColumnVisibility: updateSavedColumnVisibility,
   } = useColumnVisibilityPersistence({
     tableId: title ? `datatable-${title.toLowerCase().replace(/\s+/g, '-')}` : undefined,
-    defaultVisibility: {},
+    defaultVisibility: initialColumnVisibilityProp || {},
     enablePersistence: secureFeatures.columnVisibility,
     storageKey,
   });
   
-  // Merge saved column visibility into initial state
+  // Merge saved column visibility into initial state (saved visibility takes precedence over prop)
   const initialColumnVisibility = useMemo(() => {
     if (secureFeatures.columnVisibility && savedColumnVisibility && Object.keys(savedColumnVisibility).length > 0) {
       return savedColumnVisibility;
     }
-    return {};
-  }, [secureFeatures.columnVisibility, savedColumnVisibility]);
+    // Fall back to prop if no saved visibility
+    return initialColumnVisibilityProp || {};
+  }, [secureFeatures.columnVisibility, savedColumnVisibility, initialColumnVisibilityProp]);
   
   // Get location for route-based key derivation
   let location: { pathname: string } | null = null;
@@ -337,7 +331,7 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
   
   // Use the centralized state management hook for ALL table state
   // Note: 'actions' prop parameter is shadowed by destructuring, so we rename to stateActions
-  const { state, actions: stateActions, clearDraft } = useDataTableState<TData>({
+  const { state, actions: stateActions } = useDataTableState<TData>({
     initialPageSize,
     columnIds: effectiveColumnOrder,
     initialRowSelection: selection || {},
@@ -386,9 +380,8 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
     }
   }, [defaultGrouping, stateActions]);
 
-  // Extract commonly used state values
-  const { sorting, columnFilters, columnVisibility, grouping, expanded, pagination, columnOrder, 
-          showImportModal, showFilterRow, isCreating, creationData, editingRowId, editingData } = state;
+  // Extract commonly used state values (only what's needed)
+  // Note: Most state values are accessed via state object directly when needed
   
   // ============================================================================
   // PERFORMANCE HOOK - ALWAYS call this hook
@@ -404,7 +397,6 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
 
   const {
     paginationMode: detectedMode,
-    isVirtualized,
     pageSizeOptions: optimizedPageSizeOptions,
     isLoading: performanceLoading,
     searchQuery,
@@ -461,11 +453,12 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
 
   // Cleanup deletion timeout on unmount
   useEffect(() => {
+    const pendingDeletions = pendingDeletionsRef.current;
     return () => {
       if (deletionTimeoutRef.current) {
         clearTimeout(deletionTimeoutRef.current);
       }
-      pendingDeletionsRef.current.clear();
+      pendingDeletions.clear();
     };
   }, []);
   
@@ -707,7 +700,7 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
     };
     
     return handlers;
-  }, [permissions.canUpdate.can, permissions.canDelete.can, permissions.canCreate.can, permissions.canImport.can, permissions.canExport.can, wrappedOnEditRow, onDeleteRow, wrappedOnCreateRow, onImport, onExport, onDeleteSelected, secureFeatures.creation]);
+  }, [permissions.canUpdate.can, permissions.canDelete.can, permissions.canCreate.can, permissions.canImport.can, permissions.canExport.can, wrappedOnEditRow, onDeleteRow, wrappedOnCreateRow, onImport, onExport, onDeleteSelected]);
 
   // MANDATORY: Process actions with RBAC checks
   const effectiveActions = useMemo(() => {
@@ -771,11 +764,10 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
           
           try {
             // Call the delete handler - this may update the parent's data prop
-            const deleteStartTime = Date.now();
-            const result = secureHandlers.onDeleteRow!(row) as any;
-            // Handle async operations
-            if (result !== undefined && result !== null && typeof result === 'object' && typeof result.then === 'function') {
-              await result;
+            const result = secureHandlers.onDeleteRow!(row);
+            // Handle async operations (even though typed as void, handlers might return Promise)
+            if (result !== undefined && result !== null && typeof result === 'object' && 'then' in result && typeof (result as { then: unknown }).then === 'function') {
+              await (result as Promise<unknown>);
             }
             // Remove from pending deletions
             pendingDeletionsRef.current.delete(rowId);
@@ -810,7 +802,7 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
             });
           }
         },
-        icon: Trash,
+        icon: Trash2,
         testId: 'delete',
         variant: 'destructive' as const,
         hidden: !permissions.canDelete.can,
@@ -818,7 +810,7 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
     }
 
     return result;
-  }, [actions, secureFeatures, permissions, secureHandlers, resolvedGetRowId, stateActions, effectiveData, isDeleting, pendingDeletionsRef, deletionTimeoutRef, dataSnapshotRef]);
+  }, [actions, secureFeatures, permissions, secureHandlers, resolvedGetRowId, stateActions, data, isDeleting, logger]);
 
   // Normalize columnOrder for useTableColumns: ensure 'select' is always first
   const normalizedColumnOrderForColumns = useMemo(() => {
@@ -842,7 +834,7 @@ function DataTableInternal<TData extends DataRecord>(props: DataTableCoreProps<T
     pageSize: effectivePageSize,
   }), [state.pagination, effectivePageSize]);
   
-  const tableStateSnapshot = useMemo<TableStateSnapshot<TData>>(() => {
+  const tableStateSnapshot = useMemo<TableStateSnapshot>(() => {
     // Normalize columnOrder in snapshot: ensure 'select' is always first if selection is enabled
     const normalizedColumnOrder = secureFeatures.selection && state.columnOrder.includes('select')
       ? ['select', ...state.columnOrder.filter(id => id !== 'select')]

package/src/components/DataTable/components/DataTableLayout.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
-import { Edit, Trash } from 'lucide-react';
 import { SortIndicator } from './SortIndicator';
-import type { Table } from '@tanstack/react-table';
+import type { Table, Column } from '@tanstack/react-table';
 import { cn } from '../../../utils/core/cn';
 import { Button } from '../../Button/Button';
 import { DataTableToolbar } from './DataTableToolbar';
@@ -21,17 +20,16 @@ import type {
   DataTableRBACConfig,
   EmptyStateConfig,
   ExportOptions,
+  GetRowId,
   HierarchicalConfig,
   NormalizedDataTableFeatureConfig,
   PaginationMode,
 } from '../types';
 import type { DataTableState, DataTableStateActions } from '../hooks/useDataTableState';
 import type { UseDataTablePermissionsReturn } from '../hooks/useDataTablePermissions';
-import type { GetRowId } from '../types';
 import type { ImportModalConfig } from './ImportModal';
 import type { UseDataTableDataPipelineResult } from '../hooks/useDataTableDataPipeline';
 import type { UseKeyboardNavigationReturn } from '../hooks/useKeyboardNavigation';
-import type { Column } from '@tanstack/react-table';
 import type { createLogger } from '../../../utils/core/logger';
 
 interface DataTableLayoutProps<TData extends DataRecord> {
@@ -45,8 +43,8 @@ interface DataTableLayoutProps<TData extends DataRecord> {
   enhancedPagination: boolean;
   searchQuery: string;
   onSearch: (value: string) => void;
-  state: DataTableState<TData>;
-  stateActions: DataTableStateActions<TData>;
+  state: DataTableState;
+  stateActions: DataTableStateActions;
   rowSelection: Record<string, boolean>;
   onCreateRow?: (data: Partial<TData>) => void;
   onEditRow?: (row: TData, data: Partial<TData>) => void;
@@ -64,7 +62,7 @@ interface DataTableLayoutProps<TData extends DataRecord> {
   aggregates: AggregateConfig[];
   resolvedGetRowId: GetRowId<TData>;
   data: TData[];
-  emptyState?: EmptyStateConfig | React.ReactElement<any>;
+  emptyState?: EmptyStateConfig | React.ReactElement;
   virtualHeight: number;
   hierarchical?: HierarchicalConfig;
   hierarchicalState: UseDataTableDataPipelineResult<TData>['hierarchicalState'];
@@ -109,8 +107,8 @@ export function DataTableLayout<TData extends DataRecord>({
   onCreateRow,
   onEditRow,
   onImport,
-  onExport,
-  onDeleteSelected,
+  onExport: _onExport,
+  onDeleteSelected: _onDeleteSelected,
   rbac,
   permissions,
   effectiveActions,
@@ -140,6 +138,10 @@ export function DataTableLayout<TData extends DataRecord>({
   }, [state.editingData]);
   const handleExport = async () => {
     try {
+      // IMPORTANT: Use getFilteredRowModel() to get ALL filtered rows (not just current page)
+      // getFilteredRowModel() returns all filtered rows regardless of pagination
+      // This ensures exports include all data, not just the visible paginated rows
+      // Note: There is NO limit on the number of rows exported - all filtered rows are included
       const tableRows = table.getFilteredRowModel().rows;
       const tableColumns = table.getAllColumns();
       const visibleTableColumns = tableColumns.filter((col) => !SYSTEM_COLUMN_IDS.has(col.id) && col.getIsVisible());
@@ -183,12 +185,13 @@ export function DataTableLayout<TData extends DataRecord>({
         header?: string;
         id?: string;
         accessorKey?: string;
-        accessorFn?: (row: any) => any;
+        accessorFn?: (row: TData) => unknown;
         editAccessorKey?: string;
         isIdColumn?: boolean;
       }> = exportOptions.visibleColumns.map((col) => {
         const colId = col.id || col.accessorKey;
-        const hasAccessorFn = 'accessorFn' in col && (col as any).accessorFn;
+        // Check if col has accessorFn property directly (DataTableColumn) or in columnDef (Column)
+        const hasAccessorFn = 'accessorFn' in col && typeof (col as { accessorFn?: (row: TData) => unknown }).accessorFn === 'function';
 
         return {
           ...col,
@@ -196,13 +199,20 @@ export function DataTableLayout<TData extends DataRecord>({
             ? col.header
             : col.accessorKey || colId || 'Column',
           id: colId ? String(colId) : undefined,
-          accessorFn: hasAccessorFn ? (col as any).accessorFn : undefined,
+          accessorFn: hasAccessorFn ? ((col as { accessorFn: (row: TData) => unknown }).accessorFn as (row: DataRecord) => unknown) : undefined,
         };
       });
 
       await exportToCSVWithTableRows(
         exportOptions.tableRows,
-        exportColumns,
+        exportColumns as Array<{
+          header?: string;
+          id?: string;
+          accessorKey?: string;
+          accessorFn?: (row: DataRecord) => unknown;
+          editAccessorKey?: string;
+          isIdColumn?: boolean;
+        }>,
         exportOptions.columnIdToTableColumn,
         exportOptions.filename
       );
@@ -286,9 +296,9 @@ export function DataTableLayout<TData extends DataRecord>({
                       return;
                     }
                     try {
-                      const result = secureHandlers.onDeleteSelected!(selectedRows) as any;
-                      if (result !== undefined && result !== null && typeof result === 'object' && typeof result.then === 'function') {
-                        await result;
+                      const result = secureHandlers.onDeleteSelected!(selectedRows);
+                      if (result !== undefined && result !== null && typeof result === 'object' && 'then' in result && typeof (result as { then: unknown }).then === 'function') {
+                        await (result as Promise<unknown>);
                       }
                       // Clear selection after successful deletion
                       stateActions.clearRowSelection();
@@ -358,7 +368,7 @@ export function DataTableLayout<TData extends DataRecord>({
                     () => {
                       const originalHandler = header.column.getToggleSortingHandler();
                       if (originalHandler) {
-                        originalHandler({} as any);
+                        originalHandler({});
                       }
 
                       const columnName =
@@ -477,7 +487,7 @@ export function DataTableLayout<TData extends DataRecord>({
           grouping={state.grouping}
           aggregates={aggregates}
           getRowId={resolvedGetRowId}
-          emptyState={React.isValidElement(emptyState) ? undefined : (emptyState as any)}
+          emptyState={React.isValidElement(emptyState) ? undefined : (emptyState as EmptyStateConfig)}
           isFiltered={searchQuery !== '' || state.columnFilters.length > 0}
           onClearFilters={() => {
             onSearch('');
@@ -497,8 +507,14 @@ export function DataTableLayout<TData extends DataRecord>({
                   collapseAll: hierarchicalState.collapseAll,
                   isAllExpanded:
                     hierarchicalState.getExpandedIds().length > 0 &&
-                    hierarchicalState.getExpandedIds().length === (finalTableData as any[]).filter((row) => (row as any).isParent).length,
-                  hasAnyChildren: (finalTableData as any[]).some((row) => (row as any).isParent),
+                    hierarchicalState.getExpandedIds().length === finalTableData.filter((row) => {
+                      const hierarchicalRow = row as TData & { isParent?: boolean };
+                      return hierarchicalRow.isParent === true;
+                    }).length,
+                  hasAnyChildren: finalTableData.some((row) => {
+                    const hierarchicalRow = row as TData & { isParent?: boolean };
+                    return hierarchicalRow.isParent === true;
+                  }),
                 }
               : undefined
           }
@@ -534,12 +550,7 @@ export function DataTableLayout<TData extends DataRecord>({
               if (result && typeof result.then === 'function') {
                 await result;
               }
-
-              toast({
-                title: 'Import Successful',
-                description: `Successfully imported ${modalData.length} ${modalData.length === 1 ? 'row' : 'rows'}`,
-                variant: 'default',
-              });
+              // Toast notification removed - will be handled by parent component or ImportModal
             } catch (error) {
               logger.error('Import error:', error);
               toast({