A headline count with a trend note, a tick-segmented progress bar, and a dotted legend breaking the total into stages.
Support Queue
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Stats14 } from "@/components/beste/piece/stats14";
<Stats14
title="Support Queue"
value="1,284"
deltaLabel="312 cleared today"
segments={[
{
"label": "New",
"value": 420,
"tone": "emerald"
},
{
"label": "Active",
"value": 610,
"tone": "amber"
},
{
"label": "On hold",
"value": 254,
"tone": "muted"
}
]}
/>Headline value with a signed trend arrow, percentage, and period caption.
Large headline number with an uppercase label and an optional tiny hint line.
Gradient hero card with a huge headline number, uppercase label, and a short context caption.
Small progress ring with a centered score paired with a short label and caption.
Colored icon tile beside a bold stat and a one-line description.
Pinging emerald dot next to a big count and an uppercase caption. Reads as a live realtime figure.