Token Bucket

Rate-limit row that maps remaining capacity to a chain of filled and hollow dots, with a count beside it.

7/10

New here? Read the installation guide.

Import & use
import { Monitoring12 } from "@/components/beste/piece/monitoring12";

<Monitoring12
  total={10}
  remaining={7}
  tone="sky"
/>

More Monitoring pieces

View all Monitoring
CPU
72%

Resource Meter

Utilization bar for CPU, memory, disk, or network with a recolorable fill and matching percentage label.

API Gateway
Operational99.98%

Service Status

Compact service health row with operational state, pulsing dot, and uptime percentage on the right.

87%
Cache hitlast 1h

Metric Ring

Circular progress dial holding a percentage at its center, captioned with a label and supporting hint.

812

Queue Depth

Vertical battery of segments rendering current queue fill against capacity, with a stacked numeric ratio beside it.

us-east-1
42ms
eu-west-2
78ms
ap-south-1
210ms
sa-east-1

Region Status

Multi-region availability list with a status dot per cloud region and the round-trip latency rendered in mono.

12:34:56WARN auth.sessiontoken refresh retry 2/3

Log Stream Line

Single log entry styled like a tail output, with timestamp, level token, source, and message in mono.

Markdown version