react-rate-component :star:

React Hooks Rate Component

Demo

React Rate Component - Demo

Install

    npm install react-rate-component --save

Usage

import ReactRateComponent 'react-rate-component'

class Foo extends Component {
    changeRating(newRating) {
      setRate(newRating)
    }

    render() {
      return (
        <ReactRateComponent
            defaultValue={3}
            showCount={true}
            onChange={this.changeRating}
        />
      );
    }
}

class Bar extends Component {
  render() {
    return (
        <ReactRateComponent />
    );
  }
}

Properties

| Property | Description | Default value | Type | | -------- | ----------- | ------------- | ---- | | count | Total symbol count | 5 | number | | edit | You can make disable your rate symbols | true | boolean | | showCount | Set rating value | false | boolean | | defaultValue | Set rating default value | 0 | number | | symbol | Which character you want to use | ★ | string | | size | Size of symbol (px) | 25px | string | | activeColor | Color of selected or active symbols | #ffd700 | string | | inactiveColor | Color of inactive symbols | #949494 | string |

Callbacks

| Callback | Description | Type | | -------- | ----------- | ------------- | ---- | | onChange(new_rating) | Will be invoked any time the rating is changed | function (value) {} |

Todo

• Write tests

License MIT