Progress
Linear progress (scaleX, striped, gradient, indeterminate) and a circular ring with centred label.
2 files · 118 locdeps: clsx, tailwind-merge
Installation
With the shadcn CLI, pointing at this platform’s registry:
npx shadcn@latest add https://opusui.131199999.xyz/r/progress.jsonOr offline, straight from your opus55 checkout (copies every file it needs):
node ../tailwind_component/opus55/scripts/add.mjs progressUsage
import { Progress, ProgressCircle } from "@/components/opus/ui/progress";
<Progress value={64} label="Uploading" showValue />
<ProgressCircle value={92} tone="success" />API
| Prop | Type | Default | Description |
|---|---|---|---|
| value | number | — | 0–100; omit for indeterminate. |
| tone | "primary" | "success" | "warning" | "destructive" | "gradient" | "primary" | Colour. |
| size / striped / label / showValue | — | — | Bar options. |
| ProgressCircle.size / thickness | number | 64 / 6 | Ring geometry. |