kpi
GraphKpi
One large number with a sparkline under it.
reads
The number is the headline. The spark is the last twelve points.
12,400
this week
+18%
MDX
```
+------------------- [ READS ] --------------------+
| |
| 12,400 |
| this week +18% |
| ▃▄▄▄▅▅▆▅▇▆▇█ |
| |
+--------------------------------------------------+
```install
command
latency
A latency number with a falling series.
142ms
read
−18ms
MDX
```
+-------------------- [ P95 ] ---------------------+
| |
| 142ms |
| read −18ms |
| ▇▆█▆▅▆▄▅▃▄▃▃ |
| |
+--------------------------------------------------+
```| Prop | Type | Default | Description |
|---|---|---|---|
| title | string | — | Caption drawn on the top edge of the frame. |
| value | string | — | The large number, already formatted. |
| label | string | — | Line under the number. |
| hint | string | — | Optional extra next to the label, like a delta. |
| data | number[] | "2 3 4" | — | Sparkline values. Scaled to the highest point. |
| glyphs | "shade" | "ascii" | "hash" | "bar" | string[] | — | Sparkline characters. Defaults to ▁▂▃▄▅▆▇█. |
| palette | "mono" | "duo" | "multi" | "mono" | mono is one accent plus muted. duo paints the second series with --graph-accent-2. multi cycles three accents. |
| corner | string | "+" | Character at each corner of the frame. |
| className | string | — | Passed to the outer frame. |