Docs
GitHub

Progress

Progress shows how far along a task is. Pass a value for determinate progress; omit it for an indeterminate bar.

Usage

import { Progress } from "@sina-design-system/core";

<Progress value={62} />      {/* 62% */}
<Progress />                 {/* indeterminate */}

Examples

Determinate · 0 → 100

Indeterminate · no value

Props

PropTypeDefaultDescription
valuenumber0 to 100. Omit for an indeterminate bar.
labelstringAccessible name for the progressbar.

Accessibility

Built on Radix Progress with role="progressbar" and the correct aria-valuenow / aria-valuemin / aria-valuemax.