ColumnCalc

A data grid ends in a sticky summary row (36px, pinned to the grid's bottom edge). Each cell reads Add calculation until you pick an aggregation, then shows the result beside its operation name. Plug it into DataTable's per-column summary(rows) slot.

The menu is type-aware, measured from the live app at 180px wide:

Pass numeric for columns that should offer Sum/Average/Min/Max — those operations only apply to number columns.

Installation

npm install @crisp-ui-kit/crisp

Props

computeCalc is exported and pure, so the arithmetic is testable without rendering.

Notes

Two behaviours worth knowing:

• Emptiness is not falsiness. 0 and false are values, not blanks — only null, undefined, blank strings and empty arrays count as empty. A column of zeroes reports Count filled, not Count empty.
• null, not 0, when there is nothing to aggregate. Sum over a column with no numbers renders nothing rather than a misleading 0. Counting over an empty set is still a real 0.