accessible-react-rating

It is an accessibile react component for rating. Demo Link

Install

npm install --save accessible-react-rating

Usage

import React, { Component } from 'react';

import MyComponent from 'accessible-react-rating';

class Example extends Component {
  render() {
    return <MyComponent />;
  }
}

Properties

Property	Type	Default	Description
emptySymbol	element	in the example	shown when it is not selected
fullSymbol	element	in the example	shown when it is selected.
numberOfRatings	number	5	the number of symbols.
initialRating	number	0	the number of symbols that are selected.
legend	string	'your ratings'	the legend in the fieldset .
getRatingValue	function	()=>{}	the callback function when the symbols are selected .

Accessibility

Keyboard navigation

Use keyboard tab and arrow left/right to select the star

Screen reader

Test with VoiceOver

emptySymbol = , fullSymbol = , numberOfRatings = 5, initialRating = 0, getRatingValue = () => {}, legend = 'your ratings'

License

MIT © bowen31337