You are viewing a PR preview for PR #1506

Agriculture Design System
Beta
Design System for the Export Service

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.

View in FigmaView in StorybookView in Github
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

ProgressIndicator Props
PropTypeDescription
itemsProgressIndicatorItem[]
background?"body" | "bodyAlt"If the ProgressIndicator is placed on a page with 'bodyAlt' background, please set this to "bodyAlt".

Source

You can view the full source code for this package on Github.