Skip to main content

ProgressBar

ProgressBar — Prism component.

Signature
Density
Viewport
Theme follows the navbar ☀/☾ toggle
Live demo
Open ↗

When to use

ProgressBar — Prism component.

Accessibility

Status messages use role="status" / aria-live="polite" (or assertive for errors) so updates are announced without stealing focus.

Import

const { ProgressBar } = window.PrismDesignSystem_39d121;

Props

PropTypeRequiredDescription
valuenumber
minnumber
maxnumber
labelstring
showValueboolean
tone"accent" | "positive" | "notice" | "negative"
isIndeterminateboolean
formatValue(value: number) => stringCustom value formatter, e.g. (v) => ${v} / 200 MB.
classNamestring