Rc-ratings NPM

React Ratings

React Ratings is a React rating component built with StyledComponents 💅

You can install rc-ratings component using the yarn or npm package manager:

yarn add rc-ratings
npm install rc-ratings

The rc-ratings component peer depends on the React library.

You can install React using yarn:

yarn add --save react react-dom

Import Rating Component

import Rating from "rc-ratings";

Start using it:

<Rating />

Pass some config props:

<Rating animateOnHover disableAnimation initialRate={3} stop={10} />

Property	Type	Default	Description
`animateOnHover`	Boolean	false	Whether to animate rate hovering or not.
`disableAnimation`	Boolean	false	Disable stars animation onClick or onHover.
`emptyRate`	React Element	Empty Star	React Element
`fractions`	Number	1	Number of equal parts that make up a whole symbol.
`fullRate`	React Element	Full Star	React element
`initialRate`	Number	0	Initial rate value.
`readonly`	Boolean	false	Whether the rating can be modified or not.
`start`	Number	0	Range starting value.
`step`	Number	1	Step increment (must be between start and stop).
`stop`	Number	5	Range stop value.

Callback	Type	Parameters	Description
`onChange`	Function	rate: Number	Called when the selected rate is changed.
`onClick`	Function	(rate: Number, event: Event)	Called when a rate is clicked.
`onRate`	Function	rate: Number or undefined	Called when a rate is entered or left. When a rate is left it is called with `undefined`.

2 years ago

2 years ago

2 years ago