Skip to content
Work in progress - do not use in production. This component is still being built: it is not flagged Ready for Dev, so its markup, attributes, events and styles can all still change without notice, it is not covered by the accessibility gate, and it is not published to npm. It is on this site so the work can be seen and reviewed - nothing more.

Rating

A star rating component for collecting user ratings.

Usage

<section is="root-rating" value="3" aria-label="Rating"></section>
<section is="root-rating" value="4" max="10" aria-label="Rating"></section>

Attributes

Attribute Type Default Description
value number 0 Current rating value
max number 5 Maximum rating
disabled boolean false Disables interaction
aria-label string - Accessible label

Events

Event Detail Description
root-rating.rate { value } Fired when rating changes
root-rating.change { value } Fired when the rating changes

Extends

HTMLElement - use with <section is="root-rating">.