react-star

⭐️ Please support us by giving a star! Thanks! ⭐️

react-star

A tiny star rating component with custom icons for React.

🎁 Features

• Easy to use
• Compatible with both JavaScript and TypeScript

🔧 Install

react-star is available on npm. It can be installed with the following command:

npm install react-star --save

react-star is available on yarn as well. It can be installed with the following command:

yarn add react-star

💡 Usage

import React from 'react';
import { Star } from 'react-star';

class App extends React.Component {
  render() {
    return (
      <Star
        onChange={(value) => console.log(value)}
      />
    );
  }
};

export default App;

📖 APIs

Props	Type	Default	Description
defaultValue	number	0	The default value. Use when the component is not controlled.
shape	'thin' | 'fat'	'thin'	The shape of the star.
fraction	number	1	The number of equal subdivisions that can be selected as a rating in each icon, example, for a fractions value of 2, you will be able to select a rating with a precision of down to half a icon.
readOnly	boolean	false	Removes all hover effects and pointer events.
min	number	0	Minimum star.
max	number	5	Maximum star.

🔰 Callbacks

Callback	Type	Description
onChange	(value) => {}	The onChange props fires the moment when the value of the element is changed.
onClick	(value) => {}	The onclick props fires on a mouse click on the element.
onHover	(value) => {}	The onHover event occurs when the mouse pointer is moved onto an element.

❗ Issues

If you think any of the react-star can be improved, please do open a PR with any updates and submit any issues. Also, I will continue to improve this, so you might want to watch/star this repository to revisit.

🌟 Contribution

We'd love to have your helping hand on contributions to react-star by forking and sending a pull request!

Your contributions are heartily ♡ welcome, recognized and appreciated. (✿◠‿◠)

How to contribute:

• Open pull request with improvements
• Discuss ideas in issues
• Spread the word
• Reach out with any feedback

⚖️ License

The MIT License