1.3.1 • Published 7 years ago

react-progress-bar-plus v1.3.1

Weekly downloads
6,093
License
MIT
Repository
github
Last release
7 years ago

React Progress Bar Plus

Progress bar component for ReactJS.

Installation

NPM

npm install --save react-progress-bar-plus

Bower

bower install --save react-progress-bar-plus

Usage

JS

const ProgressBar = require('react-progress-bar-plus');

<ProgressBar percent={10}/>

CSS

Webpack:

require('react-progress-bar-plus/lib/progress-bar.css');

Without Webpack:

<link rel="stylesheet" type="text/css" href="path/to/react-progress-bar-plus/lib/progress-bar.css">

UMD

<link rel="stylesheet" type="text/css" href="path/to/react-progress-bar-plus/dist/react-progress-bar-plus.css">
<script src="path/to/react-progress-bar-plus/dist/react-progress-bar-plus.js"></script>
const ProgressBar = window.ReactProgressBarPlus;

Example here

Props

NameTypeDefaultDescription
percentnumber-1Progress percent
onTopboolfalseProgress bar will ontop & height 100%
autoIncrementboolfalseif true percent will auto increment Math.random() + 1 - Math.random()% in intervalTime ms.
intervalTimenumber200Interval time for auto increment.
spinneroneOf(false, 'left', 'right')leftSpinner position. Pass false to hide spinner icon.
classNamestringCustom class

Example

View demo or example folder.

License

MIT Licensed. Copyright (c) Minh Tran 2016.