JSPM

star-rating-web-component

1.1.1
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 8
  • Score
    100M100P100Q48108F
  • License MIT

Star Rating web component. Framework-independent: use with Ionic, Angular, Vue, React, vanilla Javascript, etc. You can choose any color (default is gold), any font size (default is 25px), and any number of stars (default is 5). Created with Stencil.js.

Package Exports

  • star-rating-web-component

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (star-rating-web-component) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Star Rating

Star Rating web component. Framework-independent: use with Ionic, Angular, Vue, React, vanilla Javascript, etc. You can choose any color (default is gold), any font size (default is 25px), and any number of stars (default is 5). Created with Stencil.js.

Installation

npm install star-rating-web-component --save

Setup after installation depends on which framework you are using. See the Setup Page on Github for details.

Sample Usage

The following produces a rating component with five gold stars of size 25px:

<star-rating (rated)="newRating($event)"></star-rating>

The following produces a rating component with four blue stars of size 50px, and starts with a rating of 3.

<star-rating color="blue" 
             stars="4" 
             size="50" 
             rating="3" 
             (rated)="newRating($event)">
</star-rating>

Sample Typescript rating handler:

newRating(ratingEvent: CustomEvent) {
    let rating: number = ratingEvent.detail;
    console.log('New rating: ',rating);
}