react-progressbar
Advanced tools
+2
-0
| Param Aggarwal <paramaggarwal@gmail.com> | ||
| Abdennour TOUMI <ceo@rathath-it.com> | ||
| Philip Tzou <philiptz@stanford.edu> | ||
| Maxwell O'Roark |
+10
-8
@@ -24,7 +24,3 @@ 'use strict'; | ||
| var PropTypes = { | ||
| completed: _react2.default.PropTypes.oneOf(Array.from({ | ||
| length: 101 | ||
| }, function (v, k) { | ||
| return k; | ||
| })), | ||
| completed: _react2.default.PropTypes.number, | ||
| color: _react2.default.PropTypes.string, | ||
@@ -54,10 +50,9 @@ height: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.string, _react2.default.PropTypes.number]) | ||
| color = _props.color, | ||
| completed = _props.completed, | ||
| height = _props.height, | ||
| children = _props.children, | ||
| rest = _objectWithoutProperties(_props, ['color', 'completed', 'height', 'children']); | ||
| rest = _objectWithoutProperties(_props, ['color', 'height', 'children']); | ||
| var style = { | ||
| backgroundColor: color, | ||
| width: completed + '%', | ||
| width: this.completed + '%', | ||
| transition: "width 200ms", | ||
@@ -77,2 +72,9 @@ height: height | ||
| } | ||
| }, { | ||
| key: 'completed', | ||
| get: function get() { | ||
| if (this.props.completed < 0) return 0; | ||
| if (this.props.completed > 100) return 100; | ||
| return this.props.completed; | ||
| } | ||
| }]); | ||
@@ -79,0 +81,0 @@ |
+1
-1
| { | ||
| "name": "react-progressbar", | ||
| "version": "1.4.3", | ||
| "version": "1.4.4", | ||
| "description": "Basic progress bar in React", | ||
@@ -5,0 +5,0 @@ "main": "lib/index.js", |
+8
-33
@@ -7,38 +7,13 @@ # react-progressbar | ||
| # Add example steps: | ||
| ``` | ||
| git checkout docs-site; | ||
| ``` | ||
| add your examlple in `docs-site/src/examples` then, | ||
| Basic progress bar in React.js. | ||
|  | ||
| Demo: http://abdennour.github.io/react-progressbar/ | ||
| Usage | ||
| ===== | ||
| Simply `require('react-progressbar')` and pass in `completed` property as a number between 0 and 100. | ||
| You may additionally pass in a CSS color string for the `color` property. | ||
| ```js | ||
| var Progress = require('react-progressbar'); | ||
| var component = React.createClass({ | ||
| render: function() { | ||
| return ( | ||
| <div> | ||
| <Progress completed={75} /> | ||
| </div> | ||
| ); | ||
| } | ||
| }); | ||
| ``` | ||
| npm run build; | ||
| ``` | ||
| License | ||
| ======= | ||
| MIT | ||
| then |
67
3.08%7578
-4.58%19
-56.82%