{"id":26690752,"url":"https://github.com/cameronroe/react-star-rating","last_synced_at":"2025-03-26T16:01:03.658Z","repository":{"id":27909144,"uuid":"31401005","full_name":"ninjasort/react-star-rating","owner":"ninjasort","description":"[Looking for Maintainers (email me)]: A simple star rating component built with React.","archived":false,"fork":false,"pushed_at":"2022-11-08T14:28:46.000Z","size":1569,"stargazers_count":173,"open_issues_count":21,"forks_count":55,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-03-26T01:35:35.777Z","etag":null,"topics":["react","star-rating-component"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ninjasort.png","metadata":{"files":{"readme":"README.md","changelog":"changelog.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-02-27T03:05:46.000Z","updated_at":"2024-07-14T14:22:18.000Z","dependencies_parsed_at":"2022-08-02T12:36:03.383Z","dependency_job_id":null,"html_url":"https://github.com/ninjasort/react-star-rating","commit_stats":null,"previous_names":["cameronjroe/react-star-rating","cameronroe/react-star-rating"],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjasort%2Freact-star-rating","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjasort%2Freact-star-rating/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjasort%2Freact-star-rating/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjasort%2Freact-star-rating/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ninjasort","download_url":"https://codeload.github.com/ninjasort/react-star-rating/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245689494,"owners_count":20656416,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react","star-rating-component"],"created_at":"2025-03-26T16:00:29.918Z","updated_at":"2025-03-26T16:01:03.642Z","avatar_url":"https://github.com/ninjasort.png","language":"JavaScript","funding_links":[],"categories":["Uncategorized","UI Components","\u003csummary\u003eUI Components\u003c/summary\u003e","Demos"],"sub_categories":["Uncategorized","Form Components"],"readme":"# react-star-rating ![](https://david-dm.org/cameronjroe/react-star-rating.svg)\n\n[![NPM](https://nodei.co/npm/react-star-rating.png?compact=true)](https://nodei.co/npm/react-star-rating/)\n\n\u003c!-- [![Build Status](https://travis-ci.org/)](https://travis-ci.org/) --\u003e\n![](src/assets/star-rating.png)\n\n\u003e A simple star rating component built with React.\n\n## Install\n\n```sh\n$ npm install react-star-rating --save\n```\n\nInclude the css:\n\n```html\n\u003clink rel=\"stylesheet\" href=\"node_modules/react-star-rating/dist/css/react-star-rating.min.css\"\u003e\n```\n\n## Usage\n\n### ES6\n```js\nimport React from 'react';\nimport StarRating from 'react-star-rating';\n\nclass FormComponent extends React.Component {\n  render() {\n    return (\n      \u003cform action=\"/api\" method=\"POST\"\u003e\n        \u003cStarRating name=\"airbnb-rating\" caption=\"Rate your stay!\" totalStars={5} /\u003e\n        \u003cbutton type=\"submit\" className=\"btn btn-submit\"\u003eSubmit Rating\u003c/button\u003e\n      \u003c/form\u003e\n    );\n  }\n}\n\nReact.render(\u003cFormComponent /\u003e, document.getElementById('star-rating'));\n```\n\n### ES5\n```js\nvar React = require('react');\nvar StarRating = require('react-star-rating');\n\nvar FormComponent = React.createClass({\n    render: function () {\n      return (\n        \u003cform action=\"/api\" method=\"POST\"\u003e\n          \u003cStarRating name=\"airbnb-rating\" caption=\"Rate your stay!\" totalStars={5} /\u003e\n          \u003cbutton type=\"submit\" className=\"btn btn-submit\"\u003eSubmit Rating\u003c/button\u003e\n        \u003c/form\u003e\n      );\n    }\n});\n\nReact.render(\u003cFormComponent /\u003e, document.getElementById('star-rating'));\n```\n\n## Options\n  - **name**={string} - name for form input (required)\n  - **caption**={string} - caption for rating (optional)\n  - **totalStars**={number} - rating amount (required, default: 5)\n  - **rating**={number} - a set rating between the rating amount (optional)\n  - **disabled**={boolean} - whether to disable the rating from being selected (optional)\n  - **editing**={boolean} - whether the rating is explicitly in editing mode (optional)\n  - **size**={number} - size of stars (optional)\n  - **onRatingClick**={function} - a handler function that gets called onClick of the rating (optional) - gets passed (event, {position, rating, caption, name})\n\n## Todo\n\n- [x] Fix ES6 bug with bundling\n- [x] Add svg stars\n- [x] Double-check touch support works\n- [ ] Re-implement star hovering (kinda janky right now)\n\n\n## License\n\n[MIT](https://github.com/cameronjroe/react-star-rating/blob/master/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcameronroe%2Freact-star-rating","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcameronroe%2Freact-star-rating","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcameronroe%2Freact-star-rating/lists"}