@preboot.io/preboot-ui-community
Version:
A community-driven React component library to accelerate building modern SaaS applications, designed to work with PreBoot.io backend.
68 lines (67 loc) • 2.53 kB
TypeScript
import { FilterCriteria, SearchParams, TableData } from './types/types';
export type FilterType = 'text' | 'enum' | 'date' | 'array-enum' | 'boolean';
export type FiltersRenderMode = 'all' | 'selective';
export type ExportFormat = 'xlsx' | 'csv' | 'pdf';
export type ExportMode = 'download' | 'async';
export interface ExportFunction {
(format: ExportFormat, fileName: string, params: SearchParams): Promise<Blob | void>;
}
export interface Column<T, K extends keyof T = keyof T> {
key: K;
label: string;
render?: (value: T[K], item: T) => React.ReactNode;
sortable?: boolean;
filterable?: boolean;
filterType?: FilterType;
filterOperator?: FilterCriteria['operator'];
filterOptions?: {
label: string;
value: string;
}[];
tooltip?: string;
columnStyle?: React.CSSProperties;
columnClassName?: string;
}
export interface RowAction<T> {
label: string;
color?: string;
icon?: React.ComponentType<any>;
onClick: (item: T) => void;
show?: (item: T) => boolean;
}
export interface Translations {
addFilter?: string;
noRecordsFound?: string;
exportAs?: string;
export?: string;
totalItems?: string;
booleanTrue?: string;
booleanFalse?: string;
}
export interface DataTableProps<T> {
data: TableData;
columns: readonly {
[K in keyof T]: Column<T, K>;
}[keyof T][];
loading: boolean;
onParamsChange: (params: SearchParams) => void;
currentParams: SearchParams;
rowActions?: RowAction<T>[];
onRowClick?: (item: T) => void;
onRowDoubleClick?: (item: T) => void;
noRecordsText?: string;
containerClassName?: string;
tableClassName?: string;
enableStickyColumn?: boolean;
enableStickyHeader?: boolean;
scrollAreaHeight?: number;
enableStickyActionColumn?: boolean;
filtersRenderMode?: FiltersRenderMode;
enableExport?: boolean;
exportFormats?: ExportFormat[];
exportFunction?: ExportFunction;
exportMode?: ExportMode;
defaultExportFileName?: string;
translations?: Translations;
}
export declare function DataTable<T>({ data, columns, loading, onParamsChange, currentParams, rowActions, onRowClick, onRowDoubleClick, noRecordsText, containerClassName, tableClassName, filtersRenderMode, enableExport, exportFormats, exportFunction, exportMode, defaultExportFileName, enableStickyColumn, enableStickyHeader, scrollAreaHeight, enableStickyActionColumn, translations }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;