@jmruthers/pace-core 0.5.136 → 0.5.139

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

@@ -147,6 +147,21 @@ describe('[component] FilterRow', () => {
       const filters = screen.getAllByTestId('column-filter');
       expect(filters[0]).toHaveAttribute('data-placeholder', expect.stringContaining('Filter'));
     });
+
+    it('uses column header text in filter placeholder', () => {
+      const columns = [
+        columnHelper.accessor('name', {
+          header: 'Full Name',
+        }),
+      ];
+      const table = createTable(columns);
+      const visibleColumns = table.getHeaderGroups()[0]?.headers || [];
+      
+      render(<FilterRow table={table} visibleColumns={visibleColumns} />);
+      
+      const filter = screen.getByTestId('column-filter');
+      expect(filter).toHaveAttribute('data-placeholder', 'Filter Full Name...');
+    });
   });
 
   describe('Filter Type Detection', () => {
@@ -245,6 +260,34 @@ describe('[component] FilterRow', () => {
       expect(filter).toHaveAttribute('data-filter-type', 'select');
     });
 
+    it('respects explicit filterType: text even when unique values ≤ 10', () => {
+      // This test reproduces the bug: filterType: 'text' should not be overridden
+      // by auto-detection when there are ≤10 unique values
+      const limitedData: TestData[] = Array.from({ length: 7 }, (_, i) => ({
+        id: String(i),
+        name: `Brand ${i % 7}`,
+        email: `user${i}@example.com`,
+        age: 20 + i,
+        status: ['active', 'inactive', 'pending'][i % 3],
+        createdAt: new Date(),
+      }));
+      
+      const columns = [
+        columnHelper.accessor('name', {
+          header: 'Brand',
+          filterType: 'text', // Explicitly set to text
+        }),
+      ];
+      const table = createTable(columns, limitedData);
+      const visibleColumns = table.getHeaderGroups()[0]?.headers || [];
+      
+      render(<FilterRow table={table} visibleColumns={visibleColumns} />);
+      
+      const filter = screen.getByTestId('column-filter');
+      // Should remain as 'text' filter, NOT auto-detect to 'select'
+      expect(filter).toHaveAttribute('data-filter-type', 'text');
+    });
+
     it('defaults to text filter when no auto-detection matches', () => {
       // Use data with many unique values (>10) to avoid auto-detection as select
       const manyUniqueData: TestData[] = Array.from({ length: 15 }, (_, i) => ({

package/src/components/DataTable/core/ActionManager.ts

@@ -0,0 +1,235 @@
+/**
+ * @file DataTable Action Manager
+ * @package @jmruthers/pace-core
+ * @module Components/DataTable/Architecture/Managers
+ * @since 0.3.0
+ */
+
+import type { ActionManager } from './interfaces';
+import type { DataTableAction, DataRecord } from '../types';
+
+/**
+ * Action manager implementation following SRP
+ * Responsible only for action operations
+ */
+export class ActionManagerImpl<TData extends DataRecord> implements ActionManager<TData> {
+  private actions: DataTableAction<TData>[] = [];
+  private actionMap = new Map<string, DataTableAction<TData>>();
+
+  constructor(initialActions: DataTableAction<TData>[] = []) {
+    this.setActions(initialActions);
+  }
+
+  /**
+   * Get all actions
+   */
+  getActions(): DataTableAction<TData>[] {
+    return [...this.actions];
+  }
+
+  /**
+   * Add a new action
+   */
+  addAction(action: DataTableAction<TData>): void {
+    const actionId = this.getActionId(action);
+    
+    // Remove existing action with same ID if it exists
+    this.removeAction(actionId);
+    
+    // Add new action
+    this.actions.push(action);
+    this.actionMap.set(actionId, action);
+  }
+
+  /**
+   * Remove an action by ID
+   */
+  removeAction(id: string): void {
+    const index = this.actions.findIndex(action => this.getActionId(action) === id);
+    if (index !== -1) {
+      this.actions.splice(index, 1);
+      this.actionMap.delete(id);
+    }
+  }
+
+  /**
+   * Update an existing action
+   */
+  updateAction(id: string, updates: Partial<DataTableAction<TData>>): void {
+    const existingAction = this.actionMap.get(id);
+    if (!existingAction) {
+      throw new Error(`Action with ID "${id}" not found`);
+    }
+
+    const updatedAction = { ...existingAction, ...updates };
+    const index = this.actions.findIndex(action => this.getActionId(action) === id);
+    
+    if (index !== -1) {
+      this.actions[index] = updatedAction;
+      this.actionMap.set(id, updatedAction);
+    }
+  }
+
+  /**
+   * Get action by ID
+   */
+  getAction(id: string): DataTableAction<TData> | undefined {
+    return this.actionMap.get(id);
+  }
+
+  /**
+   * Check if action exists
+   */
+  hasAction(id: string): boolean {
+    return this.actionMap.has(id);
+  }
+
+  /**
+   * Get action IDs
+   */
+  getActionIds(): string[] {
+    return Array.from(this.actionMap.keys());
+  }
+
+  /**
+   * Get enabled actions
+   */
+  getEnabledActions(): DataTableAction<TData>[] {
+    return this.actions.filter(action => {
+      if (!action.disabled) return true;
+      if (typeof action.disabled === 'function') {
+        // For function-based disabled, we need a row to check against
+        // Since we don't have a specific row here, we'll create a mock row
+        // This is not ideal but allows the method to work
+        const mockRow = {} as TData;
+        return !action.disabled(mockRow);
+      }
+      return !action.disabled;
+    });
+  }
+
+  /**
+   * Get actions by variant
+   */
+  getActionsByVariant(variant: DataTableAction<TData>['variant']): DataTableAction<TData>[] {
+    return this.actions.filter(action => action.variant === variant);
+  }
+
+  /**
+   * Get destructive actions
+   */
+  getDestructiveActions(): DataTableAction<TData>[] {
+    return this.getActionsByVariant('destructive');
+  }
+
+  /**
+   * Get primary actions
+   */
+  getPrimaryActions(): DataTableAction<TData>[] {
+    return this.getActionsByVariant('default');
+  }
+
+  /**
+   * Get secondary actions
+   */
+  getSecondaryActions(): DataTableAction<TData>[] {
+    return this.getActionsByVariant('secondary');
+  }
+
+  /**
+   * Set all actions at once
+   */
+  setActions(actions: DataTableAction<TData>[]): void {
+    this.actions = [...actions];
+    this.actionMap.clear();
+    
+    actions.forEach(action => {
+      const id = this.getActionId(action);
+      this.actionMap.set(id, action);
+    });
+  }
+
+  /**
+   * Clear all actions
+   */
+  clearActions(): void {
+    this.actions = [];
+    this.actionMap.clear();
+  }
+
+  /**
+   * Get action count
+   */
+  getActionCount(): number {
+    return this.actions.length;
+  }
+
+  /**
+   * Get action by index
+   */
+  getActionByIndex(index: number): DataTableAction<TData> | undefined {
+    return this.actions[index];
+  }
+
+  /**
+   * Get action index by ID
+   */
+  getActionIndex(id: string): number {
+    return this.actions.findIndex(action => this.getActionId(action) === id);
+  }
+
+  /**
+   * Move action to new position
+   */
+  moveAction(id: string, newIndex: number): void {
+    const currentIndex = this.getActionIndex(id);
+    if (currentIndex === -1) {
+      throw new Error(`Action with ID "${id}" not found`);
+    }
+
+    if (newIndex < 0 || newIndex >= this.actions.length) {
+      throw new Error(`Invalid index: ${newIndex}`);
+    }
+
+    const action = this.actions[currentIndex];
+    this.actions.splice(currentIndex, 1);
+    this.actions.splice(newIndex, 0, action);
+  }
+
+  /**
+   * Execute an action
+   */
+  executeAction(id: string, row: TData): void {
+    const action = this.actionMap.get(id);
+    if (!action) {
+      throw new Error(`Action with ID "${id}" not found`);
+    }
+
+    if (action.disabled && typeof action.disabled === 'function' && action.disabled(row)) {
+      throw new Error(`Action "${id}" is disabled for this row`);
+    }
+
+    action.onClick(row);
+  }
+
+  /**
+   * Check if action is disabled for a specific row
+   */
+  isActionDisabled(id: string, row: TData): boolean {
+    const action = this.actionMap.get(id);
+    if (!action) return true;
+
+    if (typeof action.disabled === 'function') {
+      return action.disabled(row);
+    }
+
+    return !!action.disabled;
+  }
+
+  /**
+   * Get action ID from action definition
+   */
+  private getActionId(action: DataTableAction<TData>): string {
+    return action.testId || action.label.toLowerCase().replace(/\s+/g, '-') || `action-${Math.random().toString(36).substr(2, 9)}`;
+  }
+} 

package/src/components/DataTable/core/ColumnManager.ts

@@ -0,0 +1,205 @@
+/**
+ * @file DataTable Column Manager
+ * @package @jmruthers/pace-core
+ * @module Components/DataTable/Architecture/Managers
+ * @since 0.3.0
+ */
+
+import type { ColumnManager } from './interfaces';
+import type { ColumnDef } from '@tanstack/react-table';
+import type { DataRecord } from '../types';
+
+/**
+ * Column manager implementation following SRP
+ * Responsible only for column operations
+ */
+export class ColumnManagerImpl<TData extends DataRecord> implements ColumnManager<TData> {
+  private columns: ColumnDef<TData>[] = [];
+  private columnMap = new Map<string, ColumnDef<TData>>();
+
+  constructor(initialColumns: ColumnDef<TData>[] = []) {
+    this.setColumns(initialColumns);
+  }
+
+  /**
+   * Get all columns
+   */
+  getColumns(): ColumnDef<TData>[] {
+    return [...this.columns];
+  }
+
+  /**
+   * Add a new column
+   */
+  addColumn(column: ColumnDef<TData>): void {
+    const columnId = this.getColumnId(column);
+    
+    // Remove existing column with same ID if it exists
+    this.removeColumn(columnId);
+    
+    // Add new column
+    this.columns.push(column);
+    this.columnMap.set(columnId, column);
+  }
+
+  /**
+   * Remove a column by ID
+   */
+  removeColumn(id: string): void {
+    const index = this.columns.findIndex(col => this.getColumnId(col) === id);
+    if (index !== -1) {
+      this.columns.splice(index, 1);
+      this.columnMap.delete(id);
+    }
+  }
+
+  /**
+   * Update an existing column
+   */
+  updateColumn(id: string, updates: Partial<ColumnDef<TData>>): void {
+    const existingColumn = this.columnMap.get(id);
+    if (!existingColumn) {
+      throw new Error(`Column with ID "${id}" not found`);
+    }
+
+    const updatedColumn = { ...existingColumn, ...updates } as ColumnDef<TData>;
+    const index = this.columns.findIndex(col => this.getColumnId(col) === id);
+    
+    if (index !== -1) {
+      this.columns[index] = updatedColumn;
+      this.columnMap.set(id, updatedColumn);
+    }
+  }
+
+  /**
+   * Get a specific column by ID
+   */
+  getColumn(id: string): ColumnDef<TData> | undefined {
+    return this.columnMap.get(id);
+  }
+
+  /**
+   * Check if a column exists
+   */
+  hasColumn(id: string): boolean {
+    return this.columnMap.has(id);
+  }
+
+  /**
+   * Get column IDs
+   */
+  getColumnIds(): string[] {
+    return Array.from(this.columnMap.keys());
+  }
+
+  /**
+   * Get visible columns
+   */
+  getVisibleColumns(): ColumnDef<TData>[] {
+    return this.columns.filter(column => {
+      const id = this.getColumnId(column);
+      return column.enableHiding !== false;
+    });
+  }
+
+  /**
+   * Get sortable columns
+   */
+  getSortableColumns(): ColumnDef<TData>[] {
+    return this.columns.filter(column => column.enableSorting === true);
+  }
+
+  /**
+   * Get filterable columns
+   */
+  getFilterableColumns(): ColumnDef<TData>[] {
+    return this.columns.filter(column => column.enableColumnFilter === true);
+  }
+
+  /**
+   * Get groupable columns
+   */
+  getGroupableColumns(): ColumnDef<TData>[] {
+    return this.columns.filter(column => column.enableGrouping === true);
+  }
+
+  /**
+   * Set all columns at once
+   */
+  setColumns(columns: ColumnDef<TData>[]): void {
+    this.columns = [...columns];
+    this.columnMap.clear();
+    
+    columns.forEach(column => {
+      const id = this.getColumnId(column);
+      this.columnMap.set(id, column);
+    });
+  }
+
+  /**
+   * Clear all columns
+   */
+  clearColumns(): void {
+    this.columns = [];
+    this.columnMap.clear();
+  }
+
+  /**
+   * Get column count
+   */
+  getColumnCount(): number {
+    return this.columns.length;
+  }
+
+  /**
+   * Get column by index
+   */
+  getColumnByIndex(index: number): ColumnDef<TData> | undefined {
+    return this.columns[index];
+  }
+
+  /**
+   * Get column index by ID
+   */
+  getColumnIndex(id: string): number {
+    return this.columns.findIndex(col => this.getColumnId(col) === id);
+  }
+
+  /**
+   * Move column to new position
+   */
+  moveColumn(id: string, newIndex: number): void {
+    const currentIndex = this.getColumnIndex(id);
+    if (currentIndex === -1) {
+      throw new Error(`Column with ID "${id}" not found`);
+    }
+
+    if (newIndex < 0 || newIndex >= this.columns.length) {
+      throw new Error(`Invalid index: ${newIndex}`);
+    }
+
+    const column = this.columns[currentIndex];
+    this.columns.splice(currentIndex, 1);
+    this.columns.splice(newIndex, 0, column);
+  }
+
+  /**
+   * Get column ID from column definition
+   */
+  private getColumnId(column: ColumnDef<TData>): string {
+    // Handle different column types
+    if ('id' in column && column.id) {
+      return column.id;
+    }
+    
+    if ('accessorKey' in column && column.accessorKey) {
+      return String(column.accessorKey);
+    }
+    
+    if ('accessorFn' in column && typeof column.accessorFn === 'function') {
+      return `fn-${Math.random().toString(36).substr(2, 9)}`;
+    }
+    
+    return `fn-${Math.random().toString(36).substr(2, 9)}`;
+  }
+} 

package/src/components/DataTable/core/DataManager.ts

@@ -0,0 +1,188 @@
+/**
+ * @file DataTable Data Manager
+ * @package @jmruthers/pace-core
+ * @module Components/DataTable/Architecture/Managers
+ * @since 0.3.0
+ */
+
+import type { DataTableDataManager, DataAdapter, FetchOptions } from './interfaces';
+import type { DataRecord } from '../types';
+
+/**
+ * Data manager implementation following SRP
+ * Responsible only for data operations
+ */
+export class DataManager<TData extends DataRecord> implements DataTableDataManager<TData> {
+  private data: TData[] = [];
+  private _isLoading = false;
+  private error: Error | null = null;
+  private adapter: DataAdapter<TData>;
+  private cache = new Map<string, { data: TData[]; timestamp: number }>();
+  private cacheTimeout: number;
+
+  constructor(adapter: DataAdapter<TData>, cacheTimeout = 5 * 60 * 1000) {
+    this.adapter = adapter;
+    this.cacheTimeout = cacheTimeout;
+  }
+
+  /**
+   * Get current data
+   */
+  getData(): TData[] {
+    return this.data;
+  }
+
+  /**
+   * Update a data item
+   */
+  async updateData(id: string, data: Partial<TData>): Promise<void> {
+    try {
+      this.setLoading(true);
+      this.setError(null);
+      
+      await this.adapter.updateData(id, data);
+      
+      // Update local data
+      const index = this.data.findIndex(item => this.getRowId(item) === id);
+      if (index !== -1) {
+        this.data[index] = { ...this.data[index], ...data };
+      }
+      
+      this.clearCache();
+    } catch (error) {
+      this.setError(error as Error);
+      throw error;
+    } finally {
+      this.setLoading(false);
+    }
+  }
+
+  /**
+   * Delete a data item
+   */
+  async deleteData(id: string): Promise<void> {
+    try {
+      this.setLoading(true);
+      this.setError(null);
+      
+      await this.adapter.deleteData(id);
+      
+      // Remove from local data
+      this.data = this.data.filter(item => this.getRowId(item) !== id);
+      
+      this.clearCache();
+    } catch (error) {
+      this.setError(error as Error);
+      throw error;
+    } finally {
+      this.setLoading(false);
+    }
+  }
+
+  /**
+   * Create a new data item
+   */
+  async createData(data: Partial<TData>): Promise<TData> {
+    try {
+      this.setLoading(true);
+      this.setError(null);
+      
+      const newItem = await this.adapter.createData(data);
+      
+      // Add to local data
+      this.data.push(newItem);
+      
+      this.clearCache();
+      return newItem;
+    } catch (error) {
+      this.setError(error as Error);
+      throw error;
+    } finally {
+      this.setLoading(false);
+    }
+  }
+
+
+  /**
+   * Get cached data if available
+   */
+  async getCachedData(cacheKey: string): Promise<TData[] | null> {
+    const cached = this.cache.get(cacheKey);
+    if (!cached) return null;
+    
+    const isExpired = Date.now() - cached.timestamp > this.cacheTimeout;
+    if (isExpired) {
+      this.cache.delete(cacheKey);
+      return null;
+    }
+    
+    return cached.data;
+  }
+
+  /**
+   * Set cached data
+   */
+  setCachedData(cacheKey: string, data: TData[]): void {
+    this.cache.set(cacheKey, {
+      data,
+      timestamp: Date.now(),
+    });
+  }
+
+  /**
+   * Clear all cached data
+   */
+  clearCache(): void {
+    this.cache.clear();
+  }
+
+  /**
+   * Check if currently loading
+   */
+  isLoading(): boolean {
+    return this._isLoading;
+  }
+
+  /**
+   * Get current error
+   */
+  getError(): Error | null {
+    return this.error;
+  }
+
+  /**
+   * Set loading state
+   */
+  private setLoading(loading: boolean): void {
+    this._isLoading = loading;
+  }
+
+  /**
+   * Set error state
+   */
+  private setError(error: Error | null): void {
+    this.error = error;
+  }
+
+  /**
+   * Get row ID from data item
+   */
+  private getRowId(item: TData): string {
+    return (item as any).id || (item as any).key || JSON.stringify(item);
+  }
+
+  /**
+   * Set adapter
+   */
+  setAdapter(adapter: DataAdapter<TData>): void {
+    this.adapter = adapter;
+    this.clearCache();
+  }
+
+  /**
+   * Get adapter
+   */
+  getAdapter(): DataAdapter<TData> {
+    return this.adapter;
+  }
+}