Progress

feedback

Displays an indicator showing the completion progress of a task.

Preview

Installation

npm install @launchapp/design-system
Import
import { Progress } from "@launchapp/design-system";

Examples

Progress Bar

<Progress value={60} className="w-[60%]" />

Animated Progress

const [progress, setProgress] = React.useState(13);React.useEffect(() => {  const timer = setTimeout(() => setProgress(66), 500);  return () => clearTimeout(timer);}, []);<Progress value={progress} className="w-[60%]" />

Props

PropTypeDefaultDescription
value
number | nullThe current progress value (0-100). null shows indeterminate.
max
number100The maximum value.
className
stringAdditional CSS classes.