LinearProgress
Usage
import LinearProgress from "@repo/ui/LinearProgress";
<LinearProgress value={25} />;
Installation
npx the-dig@latest add LinearProgress
Props
value should normally be between 0 and 100. Add role="progressbar" and aria-valuenow/aria-valuemin/aria-valuemax in the surrounding markup when progress is user-relevant.
| Prop | Type | Default |
|---|---|---|
value * | number | - |
color | "brand" | "success" | "warning" | "danger" | "brand" |
className | string | - |
Colors
import LinearProgress from "@repo/ui/LinearProgress";
<LinearProgress value={50} color="brand"/>
<LinearProgress value={50} color="success" />
<LinearProgress value={50} color="warning" />
<LinearProgress value={50} color="danger" />