Progress

A component for showing completion status or loading progress. For full props documentation, see Radix Progress.

Examples

tsx

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

export default function MyComponent() {

return <Progress value={50} />

}

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

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

A progress bar showing 50% completion

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

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

A completed progress bar at 100%

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

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

Was this page helpful?