Simple progress bar components for react
npm install rc-progress-bars
//npm
npm install --save rc-progress-bars
`
`
//yarn
yarn add rc-progress-bars
`
Available Components
$3
This component shows a progress bar with some number of checkpoints, the checkpoints will be displayed as stars. Example below for this component:
`
import ProgressBarWithCheckpoints from "./ProgressBarWithCheckpoints";
export default function SampleProgressBarWithCheckpoint() {
return (
)
}
`
#### Props
##### Required
progress: number The value the bar should be filled up to.
maxValue: number The value for the bar to be completely full.
checkpoints: Array Array of the checkpoints to be used. Each checkpoint will be of type {Position: number, Label: string, Description?: string}.
##### Optional
filledBackground: string The color of the filled portion of the bar. Defaults to #e0e0e0
unfilledBackground: string The color of the unfilled portion of the bar. Defaults to #0074d9
filledCheckpoint: string The color of all filled checkpoint icons. Defaults to #FFD700
unfilledCheckpoint: string The color of all unfilled checkpoint icons. Defaults to #848484`