Getting Started

Install the package using either npm or yarn

``



//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`