Horizontal scale that drops a marker on the current reading and tints the expected window behind it.
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Monitoring19 } from "@/components/beste/piece/monitoring19";
<Monitoring19
min="100ms"
max="500ms"
position={38}
bandStart={18}
bandEnd={52}
tone="violet"
/>Distributed trace timeline laying spans across a shared horizontal axis, each row labeled in monospace.
Circular progress dial holding a percentage at its center, captioned with a label and supporting hint.
Headline number for traffic volume with a trend arrow and tinted delta badge against a prior window.
Inline edge between two named endpoints, drawn as a status-tinted stem with the round-trip latency floating mid-span.
Bare ECG-style heartbeat trace with a pulsing live dot at the leading edge and no other chrome.
Utilization bar for CPU, memory, disk, or network with a recolorable fill and matching percentage label.