Components

HeatMap

A grid-based heat visualization that maps values to color intensity.

Overview

HeatMap renders a grid of cells where color intensity represents data magnitude. Supports custom color scales, tooltips, and axis labels.

<HeatMap
  data={contributions}
  xLabels={months}
  yLabels={days}
  colorScale={['#eee', '#9be9a8', '#40c463', '#30a14e', '#216e39']}
/>

Prop	Type	Default	Description
`data`	`number[][]`	`[]`	Grid data values
`xLabels`	`string[]`	—	X-axis labels
`yLabels`	`string[]`	—	Y-axis labels
`colorScale`	`string[]`	Default scale	Color gradient steps
`cellSize`	`number`	`14`	Cell size in pixels

Component	When to Use Instead
Chart	Bar, line, and area charts
Sparkline	Inline trend indicator

DiffViewer

A diff viewer for comparing text changes with color-coded additions and deletions.

JsonViewer

A collapsible, syntax-colored JSON tree viewer with expand/collapse controls.