Progress bar

A progress bar communicates the status of a system process.

Examples Code Usage Changelog

Installation

Package installation information
Install	`yarn add @atlaskit/progress-bar`
Source	Bitbucket.org, (opens new window)
npm	@atlaskit/progress-bar, (opens new window)
Bundle	unpkg.com, (opens new window)

Props

`appearance`
Description	The visual style of the progress bar.
Default	`"default"`
Type	`"default" \| "success" \| "inverse"`

`ariaLabel`
Description	This is the descriptive label that's associated with the progress bar. Always include useful information on the current state of the progress bar so that people who use assistive technology can understand what the current state of the progress bar is.
Type	`string`

`isIndeterminate`
Description	Shows the progress bar in an indeterminate state when `true`.
Default	`false`
Type	`boolean`

`testId`
Description	A `testId` prop is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
Default	`"progress-bar"`
Type	`string`

`value`
Description	Sets the value of the progress bar, between `0` and `1` inclusive.
Default	`0`
Type	`number`

Was this page helpful?

We use this feedback to improve our documentation.