Column Definition Types
ColumnDefBase
Shared by all column types:
type ColumnDefBase<TData, TValue> = {
id?: string
header?: string | ((ctx: HeaderContext<TData, TValue>) => unknown)
footer?: string | ((ctx: HeaderContext<TData, TValue>) => unknown)
cell?: string | ((ctx: CellContext<TData, TValue>) => unknown)
meta?: ColumnMeta
}
ColumnDefExtensions
Optional configuration shared by accessor and display columns:
interface ColumnDefExtensions<TData, TValue> {
// Sizing
size?: number
minSize?: number
maxSize?: number
// Sorting
enableSorting?: boolean
sortingFn?: SortingFnOption
sortDescFirst?: boolean
sortUndefined?: false | -1 | 1 | 'first' | 'last'
invertSorting?: boolean
// Filtering
enableColumnFilter?: boolean
enableGlobalFilter?: boolean
filterFn?: FilterFnOption
// Visibility
enableHiding?: boolean
// Pinning
enablePinning?: boolean
// Resizing
enableResizing?: boolean
// Grouping
enableGrouping?: boolean
getGroupingValue?: (row: TData) => unknown
// Aggregation
aggregationFn?: AggregationFnOption
aggregatedCell?: string | ((ctx: CellContext) => unknown)
// Cell editing
editable?: boolean | ((row: Row) => boolean)
editConfig?: CellEditConfig
// Styling
cellClassName?: string | ((ctx: CellContext) => string | undefined)
headerClassName?: string
footerClassName?: string
}
CellEditConfig
interface CellEditConfig<TData, TValue> {
type: 'text' | 'number' | 'select' | 'toggle' | 'date' | 'checkbox' | 'custom'
options?: { label: string; value: unknown }[]
getOptions?: (row: Row) => { label: string; value: unknown }[]
validate?: (value: TValue, row: Row) => string | null
parse?: (inputValue: string) => TValue
format?: (value: TValue) => string
placeholder?: string
render?: (props: CellEditRenderProps) => unknown
}