A compact status panel listing services, each with a colored dot and an operational state.
System status
Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.
import { Indicator13 } from "@/components/beste/piece/indicator13";
<Indicator13
title="System status"
items={[
{
"label": "Scheduling",
"status": "Operational",
"tone": "emerald"
},
{
"label": "Billing sync",
"status": "Operational",
"tone": "emerald"
},
{
"label": "Records export",
"status": "Degraded",
"tone": "amber"
}
]}
/>Pulsing status dot in four tints: live, beta, paused, offline.
Stock status chip with a dot and auto-phrased copy across in-stock, low, out, and preorder states.
Spinning loader icon paired with a status label inside a rounded pill.
Pill that names the deploy environment with a matching dot color and an optional mono branch suffix.
Row of small dots showing progress through N steps, with a trailing fraction count.
Four ascending bars that fill with the current reception level, paired with a network name and label.