Rate-limit row that maps remaining capacity to a chain of filled and hollow dots, with a count beside it.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Monitoring12 } from "@/components/beste/piece/monitoring12";
<Monitoring12
total={10}
remaining={7}
tone="sky"
/>Utilization bar for CPU, memory, disk, or network with a recolorable fill and matching percentage label.
Compact service health row with operational state, pulsing dot, and uptime percentage on the right.
Circular progress dial holding a percentage at its center, captioned with a label and supporting hint.
Vertical battery of segments rendering current queue fill against capacity, with a stacked numeric ratio beside it.
Multi-region availability list with a status dot per cloud region and the round-trip latency rendered in mono.
Headline number for traffic volume with a trend arrow and tinted delta badge against a prior window.