Progress
Displays a determinate progress bar that fills based on a 0–100 value.
<.progress></.progress>
Examples
Values
Progress bar at 0%, 40%, 75%, and 100%.
<div class="flex flex-col gap-4 w-[300px]">
<.progress value={0} label="0% complete" />
<.progress value={40} label="40% complete" />
<.progress value={75} label="75% complete" />
<.progress value={100} label="100% complete" />
</div>
Props
| Name | Type | Default | Values |
|---|---|---|---|
| class | :string | ||
| label | :string | "Progress" | |
| rest | :global | ||
| value | :integer | 0 |