Progress indicator
Progress indicators show users the number of steps in a task, where they are up to in the process and how much is left to do.
import { ... } from '@ag.ds-next/react/progress-indicator';Usage
Progress indicator components can be imported via the progress-indicator entrypoint in the @ag.ds-next/react package.
For example:
import { ... } from '@ag.ds-next/react/progress-indicator';Props
| Prop | Type | Description |
|---|---|---|
| items | (ProgressIndicatorItem<{}> | ProgressIndicatorItemWithLevelTwoItems<{}>)[] | The list of items, including level 2 items, to display. Use in conjunction with `activePath`. Note level 2 items are only available when using links. |
| activePath? | string | Used for highlighting the active step. This should match the active item's `href` (or label if no href is supplied). |
| background? | "body" | "bodyAlt" | If the ProgressIndicator is placed on a page with 'bodyAlt' background, please set this to "bodyAlt". |
| hideSubtitle? | booleanDefault: false | If true, the `subTitle` above the list of items will not be rendered. |
Source
You can view the full source code for this package on Github.