Project Name | Stars | Downloads | Repos Using This | Packages Using This | Most Recent Commit | Total Releases | Latest Release | Open Issues | License | Language |
---|---|---|---|---|---|---|---|---|---|---|
Signoz | 12,987 | 19 hours ago | 660 | other | TypeScript | |||||
SigNoz is an open-source APM. It helps developers monitor their applications & troubleshoot problems, an open-source alternative to DataDog, NewRelic, etc. 🔥 🖥. 👉 Open source Application Performance Monitoring (APM) & Observability tool | ||||||||||
React Native Star Rating | 735 | 220 | 36 | 2 years ago | 11 | September 10, 2018 | 48 | JavaScript | ||
A React Native component for generating and displaying interactive star ratings | ||||||||||
React Native In App Review | 514 | 3 months ago | 44 | April 16, 2022 | 19 | mit | JavaScript | |||
The Google Play In-App Review API, App store rating API lets you prompt users to submit Play Store or App store ratings and reviews without the inconvenience of leaving your app or game. | ||||||||||
React Form Builder | 513 | 6 years ago | 3 | November 18, 2016 | 26 | mit | JavaScript | |||
A complete react form builder that interfaces with a json endpoint to load and save generated forms. The toolbox contains 16 items for gathering data. Everything from star ratings to signature boxes! | ||||||||||
React Rating | 476 | 234 | 55 | a year ago | 63 | March 25, 2020 | 17 | mit | JavaScript | |
A rating react component with custom symbols. | ||||||||||
React Star Rating Component | 322 | 360 | 33 | 4 years ago | 10 | March 04, 2018 | 19 | mit | JavaScript | |
Basic React component for star (or any other icon based) rating elements | ||||||||||
Rn Emoji Feedback | 209 | 7 years ago | 3 | mit | JavaScript | |||||
Demo of a Rating Component written in React Native | ||||||||||
React Rater | 189 | 64 | 9 | 2 months ago | 32 | September 07, 2022 | 1 | bsd-3-clause | JavaScript | |
⭐️ Interative & customizable star rater | ||||||||||
React Rating | 175 | 1 | a month ago | 10 | December 20, 2022 | mit | TypeScript | |||
:star: Zero-dependency, highly customizable rating component for React. | ||||||||||
React Stars | 149 | 170 | 21 | 3 years ago | 11 | November 06, 2017 | 38 | JavaScript | ||
A simple star rating component for your React projects :star: |
npm install react-stars --save
Then in your project include the component:
import ReactStars from 'react-stars'
import React from 'react'
import { render } from 'react-dom'
const ratingChanged = (newRating) => {
console.log(newRating)
}
render(<ReactStars
count={5}
onChange={ratingChanged}
size={24}
color2={'#ffd700'} />,
document.getElementById('where-to-render')
);
This a list of props that you can pass down to the component:
Property | Description | Default value | type |
---|---|---|---|
className |
Name of parent class | null |
string |
count |
How many total stars you want | 5 | number |
value |
Set rating value | 0 | number |
char |
Which character you want to use as a star | ★ | string |
color1 |
Color of inactive star (this supports any CSS valid value) | gray |
string |
color2 |
Color of selected or active star | #ffd700 |
string |
size |
Size of stars (in px) | 15px |
string |
edit |
Should you be able to select rating or just see rating (for reusability) | true |
boolean |
half |
Should component use half stars, if not the decimal part will be dropped otherwise normal algebra rools will apply to round to half stars | true |
boolean |
onChange(new_rating) |
Will be invoked any time the rating is changed | null |
function |
# Clone the repo
git clone [email protected]:n49/react-stars.git
# Go into project folder
cd react-stars
# Install dependancies
npm install
Build the component:
npm build
Run the examples (dev):
npm run dev-example
Build the examples (production):
npm run build-example
Then in your browser go to: http://127.0.0.1:8080/example
You will need to have React in your project in order to use the component, I didn't bundle React in the build, because it seemed like a crazy idea.