/ember-star-rating

:star: An ember.js component for star ratings using svgs!

Primary LanguageJavaScriptMIT LicenseMIT

ember-star-rating

npm version Build Status FOSSA Status

Ember.js component for ratings.

Check out the dummy app here

Installing the Add-on

  • Ember.js v3.4 or above
  • Ember CLI v2.13 or above
  • Node.js v8 or above

In your application's directory:

$ ember install ember-star-rating

Using the Add-on

Use the component in your template:

<StarRating @rating={{rating}} />

or with positional params.

{{star-rating rating}}

Configuration

Option Type Default Info
rating Number 0 The current rating value
numStars Number 5 The number of "stars" to render
readOnly Boolean false Whether the component can be edited or not
anyPercent Boolean false Allow setting a rating to any percentage. Example: 3.2
wholeOnly Boolean false Only allow integer rating values. Example: 1 - 5
useHalfStars Boolean true Allow half rating values. Example: 2.5
onHover Function NOOP Called on the mouseMove and mouseLeave events with the rating value at the time.
onClick Function NOOP Called when the user selects a rating value. This is still invoked when readOnly is set to true
width Number 26 Width of the SVG element
height Number 26 Height of the SVG element
viewBox String '0 0 26 26' ViewBox of the SVG element
svgPath String '...' Path value of the SVG element
fillColor String 'yellow' Color of the SVG element that is considered full (has a rating)
baseColor String 'lightgrey' Color of the SVG element that is considered empty

License

See LICENSE.md

FOSSA Status