slim-progress-bar
Slim progress bar reusable component in reactjs
Last updated a year ago by nikhilkarkra .
MIT · Original npm · Tarball · package.json
$ cnpm install slim-progress-bar 
SYNC missed versions from official npm registry.

Slim Progress Bar

This is the reusable component of slim progress bar created by using following technologies-

  1. Reactjs
  2. Styled components

Useage:

npm install slim-progress-bar
import Progress from 'slim-progress-bar';

export default class App extends Component {
  constructor(props){
    super(props)
    this.state={
      percent:10
    }
  }
  render() {
    return (
      <Progress position="top" percent={this.state.percent}  id="pageTop"/> 
    );
  }
}

API

Props

name type default description
percent number 0 it set the width of the progress bar
position string 'top' it set the position of the progress bar ['top', 'bottom', 'left', 'right'
color String #007cba it set the color of the progress bar in different ways 1) #007cba 2) red 3) rgb(0, 0, 255)
progressType string 'header-level it set type of progress bar 1) header-level(position:fixed) 2) block-level (position:absolute)
height number 4px Set the height of progress bar for position top and bottom
width number 4px set the width of progress bar for position left and right
id string set the id that helps in testing

Current Tags

  • 1.0.0                                ...           latest (a year ago)

1 Versions

  • 1.0.0                                ...           a year ago
Maintainers (1)
Downloads
Today 0
This Week 1
This Month 1
Last Day 0
Last Week 0
Last Month 0
Dev Dependencies (0)
None
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |