Progress
How far a process or a target has come.
Results uploaded64%
Onboarding100%
Storage92%
Usage
import { Progress } from '@smartui/react';
import '@smartui/react/styles.css';When to use
- Measurable processes and targets.
When not to use
- Unknown duration. Use Spinner or Skeleton.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
value | number (0 to 100) | required | |
label | string | required | |
tone | 'accent' | 'success' | 'warning' | 'danger' | 'accent' | |
showValue | boolean | true |
Accessibility
- Announced as a progress bar with its current value.