Primitive

Heatmap Grid

Heatmap grid, labels, corner, and intensity cells.

Use Heatmap Grid after row/column data has been normalized. Components own intensity scaling and cell ordering.
data
DOM renderImage render
Heatmap GridDefault
MonTueWedAPI12188

Playground

Controls update query params directly, so every primitive state can be linked, rendered, and screenshotted deterministically.

Loading playground

Rendered matrix

Every state maps to the same primitive render route through the state query param.

Default

Heatmap grid with column labels, row label, and values.
MonTueWedAPI12188
Render state

Public contract

The public prop table is generated from item metadata and schema-backed controls.
NameTypeDefaultDescription
HeatmapGrid.columnCount *number-Column count for the grid.
HeatmapCell.intensitynumber-Computed heatmap opacity scalar.
HeatmapCell.childrenReactNode-Optional cell value.