Utility
AI
Terminal
progress-bar-demo
No opentui live preview is registered for this example yet.
Installation
pnpm dlx shadcn@latest add @termcn/progress-bar
Usage
import { ProgressBar } from "@/components/ui/progress-bar";<ProgressBar value={42} total={100} label="Uploading" />Examples
Custom Characters and Color
Terminal
progress-bar-custom
No opentui live preview is registered for this example yet.
API Reference
ProgressBar
| Prop | Type | Default |
|---|---|---|
value | number | required |
total | number | undefined |
width | number | 30 |
showPercent | boolean | true |
showEta | boolean | false |
fillChar | string | "█" |
emptyChar | string | "░" |
color | string | undefined |
label | string | undefined |