react-simple-rating

a pure and clean react component for your rating function

Usage no npm install needed!

<script type="module">
  import reactSimpleRating from 'https://cdn.skypack.dev/react-simple-rating';
</script>

README

React-Rating

this is a really small and highly-extensible react-componenet made for your rating function

Usage

var Rating = require('react-simple-rating');

or

import Rating from 'react-simple-rating';

Examples

to check live example

npm run dev && open ./example/index.html

display-only

<Rating rating={3.43} displayOnly={true} />

functional

<Rating displayOnly={false} onSubmit={this.handleClick} />

arbitrary maxRating (but don't go too far)

<Rating displayOnly={false} maxRating={7} onSubmit={this.handleClick} />

however, if you go with too many symbols and lead to a line wrap, since it is based on RTL direction, it may not work as you expected (say 100 symbols)

custom unicode symbol

<Rating rating={3.43} displayOnly={true} ratingSymbol={'\u2764'} />

and yes, of course you can use your favorite icons from FontAwesome

<Rating rating={4.33} displayOnly={true} ratingSymbol={'\uf091'} />