Skip to main content

Progress
component

A component for showing completion status or loading progress. You can view the Storybook for more interactive examples.

Was this section helpful?

Progress

import {Progress} from '@shopify/shop-minis-react'

export default function MyComponent() {
return <Progress value={50} />
}

Preview

Anchor to examplesExamples

Progress bar values and states

Anchor to example-half-progressHalf progress

A progress bar showing 50% completion

Anchor to example-complete-progressComplete progress

A completed progress bar at 100%

Was this section helpful?

Half progress

import {Progress} from '@shopify/shop-minis-react'

export default function MyComponent() {
return <Progress value={50} />
}