Components
Metric Tile
SketchMetricTile — a hand-drawn stat card with an optional delta and sparkline.
SketchMetricTile combines a label, a large value, an optional delta string, and an
optional sparkline into a single sketched card. It fills the width of its container,
so wrap it to control the tile width.
Default
import { SketchMetricTile } from "blackchalk";<SketchMetricTilelabel="Revenue"value="$24,500"delta="+12% vs last month"/>With sparkline
import { SketchMetricTile } from "blackchalk";<SketchMetricTilelabel="Active users"value="1,284"delta="+8% this week"data={[4, 8, 6, 10, 9, 14, 12, 18]}/>Props
| Prop | Type | Default |
|---|---|---|
label | string | — |
value | string | — |
delta | string | — |
data | number[] | — |
style | CSSProperties | — |
See it in the Storybook playground, or read the source.