@n3/react-fixedtable

Таблица с фиксированными заголовками и колонками.

Установка

``
yarn add @n3/react-fixedtable
npm install @n3/react-fixedtable --save
`

Использование

Нужно обернуть компонент таблицы компонентом FixedTable. ref из render props должен указывать на dom-элемент таблицы.


`tsx
import { FixedTable } from '@n3/react-fixedtable';

// ...


{({
ref,
}) => (
ref={ref}
>
...

)}

`

Props

| Название | Обязательность | Тип | Значение по умолчанию | Описание |
|----------|----------------|-----|-----------------------|----------|
| className | | string | '' | Класс корневого элемента |
| stickyHeadClassName | | string | '' | Класс шапки в зафиксированном состоянии |
| stickyFootClassName | | string | '' | Класс футера в зафиксированном состоянии |
| children | + | func | | Функция рендера таблицы
@param {Object} renderProps
@param {React ref} renderProps.ref - ref таблицы
@param {?Number} renderProps.leftCols - количество колонок таблицы, используется для оптимизации рендера таблицы с фиксированными колонками слева. Если рендерится основная таблица, принимает null |
| top | | number | 0 | Отступ от верхнего края экрана до фиксированной шапки |
| bottom | | number | 0 | Отсутп от нижнего края экрана до фиксированного футера |
| fixedLeftCols | | number | 0 | Количество левых колонок для фиксации |
| fixedLeftColsClassName | | string | '' | Класс обёртки блока фиксированных колонок |
| fixedLeftColsStickyClassName | | string | '' | Класс обёртки блока фиксированных колонок в зафиксированном состоянии |
| getScrollableWrapper | | func | () => document | Функция получения элемента, скролл которого отслеживается таблицей |
| checkCanInit | | func | () => true | Функция проверки возможности инициализации. Если определена, инициализация не начнётся до того момента, пока не вернёт true |
| checkCanInitInterval | | number | 5 | Интервал между вызовами checkCanInit в мс |
| initDelay | | number | 0 | Задержка инициализации в мс |
| horizontalScrollDelta | | number | 5 | Контрольное значение разницы ширины таблицы и ширины области в пикселях, начиная с которой появляется горизонтальный скролл |
| scrollbarWidth | | number | 15 | Ширина скроллбара |
| updateUniqs | | arrayOf [
  any
] | [] | Набор значений, при изменении хотя бы одного будет произведена перерисовка фиксированных элементов |
| tableRef | | Ref | | ref для получения таблицы |
| isNativeStickyPositioning | | boolean | false` | Использовать нативное sticky-позиционирование через css |