# API Health block

> Three-column KPI metric row with radial segmented gauges and trend indicators

Stat card row for API and ops monitoring: each metric pairs a segmented radial gauge with a value, unit, and up or down trend delta. Built on ReUI Frame and FramePanel with shadcn Button. Use for dashboard KPI strips, metrics overview, and stats.

- Type: Pro block
- Category: [Radial Chart](https://reui.io/blocks/chart/radial-chart.md)
- Page: https://reui.io/blocks/chart/radial-chart/chart-8
- MCP: `get_block("chart-8")`
- Built with: Button, Frame
- Installs with a ReUI Pro or Ultimate license; setup: https://reui.io/docs/license-setup

## Best for

A 3 cell API health strip, each value led by a 20 segment ring gauge drawn in SVG over a blurred dot texture

## Agent notes

- Replace `responseMetrics` in data.tsx; each gauge's `active`, `start` and `count` are set by hand, not derived from `value`
- `trendTone` alone sets the arrow and the success or destructive color, so keep it in step with `trendLabel` and `trendValue`
- The ellipsis actions `Button` on each `MetricCard` has no handler or menu; wire it to your metric actions

## When not to use

- A KPI grid whose cells pair a delta badge with an area wedge in place of a gauge: use [KPI Area Charts](https://reui.io/blocks/application/card/card-29.md) (`get_block("card-29")`)
- Support desk figures such as tickets and satisfaction, each under an icon tile: use [Support Metrics](https://reui.io/blocks/application/stats/stats-12.md) (`get_block("stats-12")`)

## Install

```bash
npx shadcn@latest add @reui/chart-8
```

## About Radial Chart blocks

### When to use

- Uptime, coverage or capital raised as a segmented arc gauge beside its value
- A row of round meters, one per API or service metric, each with a trend delta

### When not to use

- Several sources sharing one total, read as slices of a ring: use the [Pie Chart blocks](https://reui.io/blocks/chart/pie-chart.md)
- A capacity or zone meter laid out as straight segments in a row: use the [Bar Chart blocks](https://reui.io/blocks/chart/bar-chart.md)

### Agent notes

- chart-7 and chart-8 draw their arcs as SVG paths, while chart-12 draws a half ring with `Pie` from recharts

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.
