Usage

Progress is used to display the progress status for a task that takes a long time or consists of several steps. It is encouraged to use aria-label for the progress bar to have accessible name.

Import

import { Progress } from '@passfort/castle'
content_copy
Copy

Example

<Stack>
  <Progress aria-label="Progress 1" value={1} />
  <Progress aria-label="Progress 2" value={25} />
  <Progress aria-label="Progress 3" value={50} />
  <Progress aria-label="Progress 4" value={75} />
  <Progress aria-label="Progress 5" value={100} />
</Stack>
<Stack>
  <Progress aria-label="Progress 1" value={1} />
  <Progress aria-label="Progress 2" value={25} />
  <Progress aria-label="Progress 3" value={50} />
  <Progress aria-label="Progress 4" value={75} />
  <Progress aria-label="Progress 5" value={100} />
</Stack>
content_copy
Copy
live example