Progress
Display progress relative to a limit or related to a task.
Usage
First of all, you need to import the Progress
component from the kitchn
package.
import { Progress } from "kitchn"
Default
Custom max
Dynamic colors
States
Props
Name | Type | Default | Required | Description | Accepted values |
---|---|---|---|---|---|
value | number | 0 | ✅ | The current value of the progress bar. | - |
max | number | 100 | - | The max value of the progress bar. | - |
colors | Record<number, string> | - | - | The custom colors for the progress bar. | - |
states | Record<number, string | React.ReactNode > | - | - | The custom states for the progress bar. | - |
title | boolean | true | - | The title of the progress bar. | - |
checkpointTitle | boolean | true | - | The title of the progress bar's checkpoint. | - |