@ackplus/react-tanstack-data-table
Version:
A powerful React data table component built with MUI and TanStack Table
55 lines • 2.6 kB
TypeScript
/**
* Custom Column Filter Feature for TanStack Table
*
* This feature adds advanced column filtering capabilities to TanStack Table
* following the official custom features pattern introduced in v8.14.0
*/
import { Table, TableFeature, RowData, Updater, RowModel } from '@tanstack/react-table';
import type { ColumnFilterState } from '../types/table.types';
export interface ColumnFilterRule {
id: string;
columnId: string;
operator: string;
value: any;
columnType?: string;
}
export interface ColumnFilterOptions {
enableAdvanceColumnFilter?: boolean;
onColumnFilterChange?: (updater: Updater<ColumnFilterState>) => void;
onColumnFilterApply?: (state: ColumnFilterState) => void;
}
declare module '@tanstack/react-table' {
interface TableState {
columnFilter: ColumnFilterState;
}
interface TableOptionsResolved<TData extends RowData> {
enableAdvanceColumnFilter?: boolean;
onColumnFilterChange?: (updater: Updater<ColumnFilterState>) => void;
onColumnFilterApply?: (state: ColumnFilterState) => void;
}
interface Table<TData extends RowData> {
setColumnFilterState: (updater: Updater<ColumnFilterState>) => void;
addPendingColumnFilter: (columnId: string, operator: string, value: any) => void;
updatePendingColumnFilter: (filterId: string, updates: Partial<ColumnFilterRule>) => void;
removePendingColumnFilter: (filterId: string) => void;
clearAllPendingColumnFilters: () => void;
setPendingFilterLogic: (logic: 'AND' | 'OR') => void;
applyPendingColumnFilters: () => void;
addColumnFilter: (columnId: string, operator: string, value: any) => void;
updateColumnFilter: (filterId: string, updates: Partial<ColumnFilterRule>) => void;
removeColumnFilter: (filterId: string) => void;
clearAllColumnFilters: () => void;
setFilterLogic: (logic: 'AND' | 'OR') => void;
getActiveColumnFilters: () => ColumnFilterRule[];
getPendingColumnFilters: () => ColumnFilterRule[];
getColumnFilterState: () => ColumnFilterState;
}
}
export declare const ColumnFilterFeature: TableFeature<any>;
/**
* Utility function to check if a row matches the custom column filters
* This can be used for client-side filtering
*/
export declare function matchesCustomColumnFilters(row: any, filters: ColumnFilterRule[], logic?: 'AND' | 'OR'): boolean;
export declare const getCombinedFilteredRowModel: <TData>() => (table: Table<TData>) => () => RowModel<TData>;
//# sourceMappingURL=column-filter.feature.d.ts.map