The visual color appearance of the component
Progress
Progress is used to display the progress status for a task that takes a long time or consists of several steps.
Props#
colorScheme
colorSchemeDescription
Type
"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink"Default
bluehasStripe
hasStripeDescription
If true, the progress bar will show stripe
Type
booleanDefault
falseisAnimated
isAnimatedDescription
If true, and hasStripe is true, the stripes will be animated
Type
booleanDefault
falseisIndeterminate
isIndeterminateDescription
If true, the progress will be indeterminate and the value
prop will be ignored
Type
booleanDefault
falsemax
maxDescription
The maximum value of the progress
Type
numberDefault
100min
minDescription
The minimum value of the progress
Type
numberDefault
0size
sizeDescription
The size of the Progress
Type
"xs" | "sm" | "md" | "lg"Default
mdvalue
valueDescription
The value of the progress indicator.
If undefined the progress bar will be in indeterminate state
Type
numbervariant
variantDescription
The variant of the Progress
Type
stringProps#
colorScheme
colorSchemeDescription
The visual color appearance of the component
Type
"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink"Default
bluehasStripe
hasStripeDescription
If true, the progress bar will show stripe
Type
booleanDefault
falseisAnimated
isAnimatedDescription
If true, and hasStripe is true, the stripes will be animated
Type
booleanDefault
falseisIndeterminate
isIndeterminateDescription
If true, the progress will be indeterminate and the value
prop will be ignored
Type
booleanDefault
falsemax
maxDescription
The maximum value of the progress
Type
numberDefault
100min
minDescription
The minimum value of the progress
Type
numberDefault
0size
sizeDescription
The size of the Progress
Type
"xs" | "sm" | "md" | "lg"Default
mdvalue
valueDescription
The value of the progress indicator.
If undefined the progress bar will be in indeterminate state
Type
numbervariant
variantDescription
The variant of the Progress
Type
string