Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

ember-cli-icon-rating

Package Overview
Dependencies
Maintainers
1
Versions
20
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ember-cli-icon-rating

Icon (i.e. stars) rating input for ember applications

  • 2.0.10
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
1
Maintainers
1
Weekly downloads
 
Created
Source

Ember Observer Score Build Status Coverage Status NPM Version NPM Downloads Dependency Status DevDependency Status Greenkeeper

ember-cli-icon-rating

Rating Input that can use any Font Awesome Icon and defaults to using the star icon

DEMO

Installation

ember install ember-cli-icon-rating

Usage

  • Note: Uses DDAU so no updates are done without an onClick handler

Simplest Case

{{icon-rating
  value=value
  onClick=(action (mut value))
}}

Full Example (Defaults)

{{icon-rating
  min=1
  max=5
  step=1
  value=0
  width=0
  size='lg'
  readOnly=false
  baseIcon='star'
  fillIcon='star'
  baseColor='grey'
  fillColor='gold'
  disableHover=false
  showRatingAbove=false
  showRatingBelow=false
  icon=null // No Defaults for icon
  color=null // No Defaults for color
  onClick=null // No Defaults for onClick
}}

Component Options Available

  • min - Minumum icon value
  • max - Maximum icon value
  • readOnly - handlers will not run
  • value - Number of icons selected
  • width - Set width of individual icon container
  • step - How much each consecutive icon value is
  • showRatingAbove - Show Rating value above icon
  • showRatingBelow - Show Rating rating below icon
  • disableHover - Only update icon / color on click
  • size - size of icon, i.e. lg, 2 - 5 (see Font Awesome docs)
  • baseIcon - Font awesome icon to be used for the initial state
  • fillIcon - Font awesome icon to be used on hover and after selection
  • icon - Font Awesome icon to use for rating (overrides baseIcon / fillIcon)
  • color - any rgb, hex, string color to be used (overrides baseColor / fillColor)
  • baseColor - any rgb, hex, string color to be used as the initial color before selection
  • fillColor - any rgb, hex, string color to be used as the hover color and after selection
  • onClick - handler that runs when icon is clicked. Note: value does not change automatically

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.

Keywords

FAQs

Package last updated on 07 May 2019

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc