Progress
displayAnimated progress bar supporting determinate and indeterminate modes with color variants.
import { Progress } from '@/components/forge'Preview
Progress
Code Example
Props
| Prop | Type | Default | Required | Description |
|---|---|---|---|---|
value | number | - | No | Progress percentage 0–100 |
variant | 'default' | 'success' | 'warning' | 'danger' | 'default' | No | Color variant |
indeterminate | boolean | false | No | Animated loading state without a set value |
size | 'sm' | 'md' | 'lg' | 'md' | No | Track height |
Variants
defaultsuccesswarningdanger
Accessibility
- Uses role="progressbar" with aria-valuenow, aria-valuemin, aria-valuemax
- Indeterminate mode uses aria-label instead of aria-valuenow