Inspired by https://github.com/iqnivek/react-circular-progressbar.
React sectioned progress bar is an independent variation of circular progress bar. The only big difference is that the progress is divided by specified number of sections.
| Name | Description |
|---|---|
| sizePx | Size of the component in pixels. The size is equal in height and width since the component is a circle |
| total | Total value (maximum progress) |
| progress | Actuall progress value |
| thickness | Thickness of the sections arcs |
| sectionsGapPercent | Gas between sections in percentage relative to the section itself. 0 means no gap, 50 means the gap between sections equals to the sections length |
| className | CSS class name for the parent element of the component |
| textFormatter | Callback function that is used to generate text inside in the center of the progressbar. E.g: progress => `${progress}%` |
| children | Everything wrapped by the component is used as progress text |