1.0.0 • Published 4 years ago
@jswork/react-progress v1.0.0
react-progress
Progress for react.
installation
npm install -S @jswork/react-progress
properties
Name | Type | Required | Default | Description |
---|---|---|---|---|
className | string | false | - | The extended className for component. |
color | string | false | '#419bf9' | The highlight body color. |
value | number | false | 0 | The progress value. |
max | number | false | 100 | The max limit value. |
usage
import css
@import "~@jswork/react-progress/dist/style.css"; // or use sass @import "~@jswork/react-progress/dist/style.scss"; // customize your styles: $react-progress-options: ()
import js
import ReactDemokit from '@jswork/react-demokit'; import React from 'react'; import ReactDOM from 'react-dom'; import ReactProgress from '@jswork/react-progress'; import './assets/style.scss'; class App extends React.Component { get items() { return Array.from(Array(10).keys()); } render() { return ( <ReactDemokit className="p-3 app-container" url="https://github.com/afeiship/react-progress"> <article className="message is-info"> <div className="message-header">Preview:</div> <div className="message-body"> <h3 className="mb-3"> <center className="button is-primary">Progress bar</center> </h3> {this.items.map((item) => { return ( <ReactProgress className="mb-2" key={item} value={item * 10 + 10} /> ); })} </div> </article> </ReactDemokit> ); } } ReactDOM.render(<App />, document.getElementById('app'));
documentation
license
Code released under the MIT license.
1.0.0
4 years ago