Table
Пакет @cloud-ru/ds-table предоставляет таблицы поверх @tanstack/react-table: полнофункциональные Table / ServerTable и preset-обёртки с упрощённым API.
Архитектура пакета
defineColumns, statusColumn и actionsColumn — публичные утилиты: ими собирают columnDefinitions для Table напрямую. Preset-ы дают тот же результат через упрощённые пропсы (columns, statusColumn, rowActions в AdminTable).
ServerTable — обёртка над Table для серверной пагинации, сортировки и фильтрации.
Какой сценарий выбрать
Компоненты
| Сценарий | Компонент |
|---|---|
| Полный контроль над API | Table |
| Серверная пагинация | ServerTable |
| Серверный список сущностей + queryFn | EntitiesTable |
| Простой список: данные + колонки + пагинация | SimpleTable |
| Админка: поиск, фильтры, выбор, статус, действия | AdminTable |
| Иерархия (дерево) | TreeTable |
| Бесконечная прокрутка | InfiniteTable |
Утилиты
| Сценарий | Утилита |
|---|---|
| Декларативные колонки | defineColumns |
| Колонка статуса | statusColumn |
| Колонка действий строки | actionsColumn |
Каждый preset доступен в двух формах: компонент (<SimpleTable />) и хук (useSimpleTableProps() + <Table />).
Карточный режим (headlineKey, defaultView, view) — сквозная опция всех preset-ов, не отдельный компонент.
Установка
pnpm add @cloud-ru/ds-table
import { Table, ServerTable, SimpleTable, defineColumns } from '@cloud-ru/ds-table';
Смотри также
- Pagination — отдельный компонент пагинации.
- InfoBlock — основа пустых состояний таблицы.
- Card — самостоятельные карточки вне таблицы.