"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "linkedin" | "facebook" | "messenger" | "whatsapp" | "twitter" | "telegram"Progress
Progress is used to display the progress status for a task that takes a long time or consists of several steps.
Props#
colorScheme
colorSchemeType
Default
"blue"hasStripe
hasStripeDescription
If true, the progress bar will show stripe
Type
booleanisAnimated
isAnimatedDescription
If true, and hasStripe is true, the stripes will be animated
Type
booleanisIndeterminate
isIndeterminateDescription
If true, the progress will be indeterminate and the value
prop will be ignored
Type
booleanmax
maxDescription
The maximum value of the progress
Type
numberDefault
100min
minDescription
The minimum value of the progress
Type
numberDefault
0size
sizeType
"xs" | "sm" | "md" | "lg"Default
"md"value
valueDescription
The value of the progress indicator.
If undefined the progress bar will be in indeterminate state
Type
numbervariant
variantDescription
Variants for Progress are not implemented in the default theme. You can extend the theme to implement them.
Type
string