Skip to Content

ProgressBar

Uploading35%
Processing…
import { ProgressBar } from '@gg-software/ui'; <ProgressBar value={35} showValue label="Uploading" /> <ProgressBar value={70} tone="success" /> <ProgressBar indeterminate label="Processing…" /> <ProgressBar value={512} max={1024} format={(percent) => `${percent.toFixed(0)} %`} />

Props

PropTypeDefaultDescription
valuenumber0
maxnumber100
tone"success" | "warning" | "primary" | "danger"primary
size"sm" | "md" | "lg"md
indeterminatebooleanfalse
showValuebooleanfalse
labelReactNode
format((percent: number) => ReactNode)
classNamestring

* required · generated from packages/ui/src/display/ProgressBar/ProgressBar.tsx