Chart

Recharts wired to the five chart colors, terminal tooltip and stepped reveal.

Relay strength

Last seven channels, dB

Installation

npx shadcn@latest add @afterglow/chart

Component structure.

ChartContainer
├── ChartStyle
├── ChartTooltip
│   └── ChartTooltipContent
└── ChartLegend
    └── ChartLegendContent

Square bars compare traffic in both directions without introducing another color scale.

Channel load

Messages per minute

A compact ring chart for part-to-whole data, with the same token-driven legend and tooltip.

Traffic share

Current uplink volume

Recharts still owns the plot. These parts connect it to Afterglow's colors, tooltip, legend and mount motion.

Provides the series config and a responsive container. The chart draws in with a short stepped reveal when it mounts.

Prop	Type	Default
config	ChartConfig	-
initialDimension	{ width: number; height: number }	{ width: 320, height: 200 }

Everything else is Recharts's API, documented there.