ProgressPie

PreviousNext

Circular progress indicator.

import { ProgressPie } from "@/rl-ui";

<ProgressPie progress={65} />

Examples

Types

import { ProgressPie } from "@/rl-ui";

<>
<ProgressPie progress={70} type="default" />
<ProgressPie progress={70} type="success" />
<ProgressPie progress={70} type="warning" />
<ProgressPie progress={70} type="error" />
<ProgressPie progress={70} type="disabled" />
</>

Sizes

import { ProgressPie } from "@/rl-ui";

<>
<ProgressPie progress={40} size="small" />
<ProgressPie progress={40} size="medium" />
<ProgressPie progress={40} size="default" />
<ProgressPie progress={40} size="large" />
</>

API

PropTypeDefaultDescription
progressnumber0Percent complete (0–100).
size"small" | "medium" | "default" | "large""default"Diameter token.
type"default" | "success" | "warning" | "error" | "disabled""default"Status color.
backgroundFillbooleanfalseFill the track background.
strokeColorstring—Override type color.