Progress
A
<ProgressBar/> bar provides animated visual feedback to a user on how long an action is taking to complete.
<ProgressBar label='Progress' progress='75%' />
Prop | Description | Required | Value |
|---|---|---|---|
className | custom styles | optional | SCSS or Tailwind style |
label | text label | optional | string |
progress | percentage string | required | 0% - 100% |
<ProgressSteps/> are used to indicate the current point in a multiple-stage process, like filling in a long form.
<ProgressSteps items={[
{ name: 'Basket', url: '/basket', completed: true },
{ name: 'Checkout', url: '/checkout', completed: true },
{ name: 'Payment', url: '/payment', completed: false },
]}/>
Prop | Description | Required | Value |
|---|---|---|---|
items | list of step objects | required | array |
Last modified 10h ago