import type { ReactNode, HTMLAttributes, CSSProperties, TdHTMLAttributes, ThHTMLAttributes } from 'react'; import { RowData, RowSelectionState } from '@tanstack/react-table'; declare module '@tanstack/react-table' { interface TableMeta { updateData: (rowId: string, columnId: string, value: unknown) => void; } interface ColumnMeta { filters?: TableColumnData['filters']; enableEditing?: boolean; renderCell?: TableColumnData['renderCell']; setCellProps?: TableColumnData['setCellProps']; } } export type TableRowData = { /** * Уникальный идентификатор строки */ id: string; /** * Неограниченный список пар ключ:значение, составляющих контент таблицы. * Должен совпадать с ключами из TableColumnData */ [key: string]: string | number | object; }; export type TableColumnData = { /** * Уникальный идентификатор колонки */ id: string; /** * Label колонки */ label: string; /** * Ширина колонки */ width?: number; /** * Включение сортировки */ enableSorting?: boolean; /** * Включение ресайза */ enableResizing?: boolean; /** * Включение изменения ячеек */ enableEditing?: boolean; /** * Набор опций для фильтрации строк */ filters?: { value: string; label: string; }[]; /** * Кастомный обработчик для фильтрации строк */ filterFn?: (filteredValue: string, cellValue: unknown) => boolean; /** * Рендер-пропс для ячейки */ renderCell?: (value: unknown, row: TableRowData, rowIndex: number) => ReactNode; /** * Сеттер свойств для ячейки */ setCellProps?: (row: TableRowData, cellId: string) => HTMLAttributes & TdHTMLAttributes; }; export interface TableProps extends Omit, 'onChange'> { /** * Основной контент */ data: TableRowData[]; /** * Настройка колонок */ columns: TableColumnData[]; /** * Обработчик изменения состояния */ onChange?: (data: { selected: TableProps['selected']; filtered: TableProps['filtered']; sorted: TableProps['sorted']; }) => void; /** * Вариант отображения border * @default all */ borderVariant?: 'all' | 'rows' | 'header'; /** * Включение функционала выбора строк * @default false */ enableSelection?: boolean; /** * Состояние параметров выбранных строк */ selected?: RowSelectionState; /** * Состояние параметров фильтрации */ filtered?: { id: string; value: unknown; }[]; /** * Состояние параметров сортировки */ sorted?: { id: string; desc: boolean; }[]; /** * Максимальная высота таблицы */ maxHeight?: CSSProperties['maxHeight']; /** * Прилипание шапки при скролле * @default false */ stickyHeader?: boolean; /** * Обработчик обновления контента ячейки */ onCellUpdate?: (rowId: string, columnId: string, value: unknown) => void; /** * Сеттер свойств для строки */ setRowProps?: (row: TableRowData) => HTMLAttributes & ThHTMLAttributes; /** * Слот для контента над таблицей. */ topContent?: ReactNode; /** * Слот для контента под таблицей. */ bottomContent?: ReactNode; /** * Слот для лоадинга под контентом. */ loadingSlot?: ReactNode; /** * Обработчик сколла контента. */ onScroll?: (e: React.UIEvent) => void; /** * Возможность указать className для различных семантических узлов внутри компонента. */ classNames?: { /** * Корневой верхнеуровневый контейнер. */ root?: string; /** * Элемент со стилями таблицы, такими как font-size, width, border и тд. */ table?: string; header?: { /** * Элемент шапки таблицы. */ wrapper?: string; /** * Элемент строки шапки таблицы. */ row?: string; /** * Элемент ячейки шапки таблицы. */ cell?: string; }; body?: { /** * Элемент главного контейнера с контентом. */ wrapper?: string; /** * Элемент строки основного контента таблицы. */ row?: string; /** * Элемент ячейки основного контента таблицы. */ cell?: string; }; }; /** * Размер таблицы */ size?: string; /** * Внешний вид таблицы */ view?: string; } //# sourceMappingURL=Table.types.d.ts.map