progress-arc-component
Advanced tools
Comparing version 1.0.0 to 1.0.1
{ | ||
"name": "progress-arc-component", | ||
"version": "1.0.0", | ||
"version": "1.0.1", | ||
"description": "Simple progress arc for React, customizable with styled-components", | ||
@@ -5,0 +5,0 @@ "main": "lib/ProgressArc.js", |
@@ -1,7 +0,15 @@ | ||
# Simple progress arc component for React | ||
# Simple progress arc for React | ||
## [Demo](http://szastupov.github.io/progress-arc-component) | ||
## Installation | ||
yarn add progress-arc-component | ||
With yarn: | ||
$ yarn add progress-arc-component | ||
With npm: | ||
$ npm install --save progress-arc-component | ||
## Usage | ||
@@ -44,3 +52,3 @@ | ||
ProgressArc generates SVG which can be style with styled-components: | ||
ProgressArc generates SVG that can be tweaked with [styled-components][1]: | ||
@@ -63,28 +71,4 @@ ```javascript | ||
` | ||
class Yellow extends Component { | ||
state = { | ||
prog: 60 | ||
} | ||
render() { | ||
let { prog } = this.state | ||
return ( | ||
<div> | ||
<StyledProgressArc value={prog}/> | ||
<input | ||
type="range" | ||
min="0" max="100" | ||
value={prog} | ||
onChange={e => this.setState({prog: e.target.value})} | ||
/> | ||
</div> | ||
) | ||
} | ||
} | ||
``` | ||
License | ||
======= | ||
MIT | ||
[1]: https://github.com/styled-components/styled-components |
75174
73