This package contains hooks and components that can help create grids that can be navigated similar to Excel.
Column configs has three options for summary rows:
renderSummaryCell
summaryText
summaryCellColSpan
If renderSummaryCell
or summaryText
is set for any column,
the table will get a summary row at the bottom.
Receives items
in argument object, and must return a string.
Receives items
and text
in argument object.
If no summaryText
was specified, then text
will be undefined.
If no renderSummaryCell
is specified, then a default renderer for summary
will be used.
Examples:
summaryText: ({ items }) =>
String(sumBy(items, (item) => item.numPassengers ?? 0)),
renderSummaryCell: ({ items, text }) => (
<Indent>
<Tag label={text} />
</Indent>
)
summaryCellColSpan
can be set to make the cell span multiple columns.
If any columns after the spanning column has summary options, they will be ignored.
If there are column groups, a column can only span over columns of that column group.
If summaryCellColSpan
is too high and won't fit into the table (or column group) then
the col span will be limited so that it fits.