Material-UI Rating
Installation
Stable channel
npm install material-ui-rating@next
Usage
import Rating from 'material-ui-rating'
<Rating
value={3}
max={5}
onChange={(value) => console.log(`Rated with value ${value}`)}
/>
Material Rating Properties, Name, Type, Default, Description, -------------------, --------, -------, -------------------------------------------------------------------------------------, classes*, object, Useful to extend the style applied to components. The accepted keys are listed below., component, elementType, div, The component used for the root node. Either a string to use a DOM element or a component., disabled, bool, false, Disables the rating and gray it out if set to true., disableHover, bool, false, Disable hover effects if set to true., iconFilled, node, This is the icon to be used as an icon in value range., iconFilledRenderer, func, Overrides filled icon renderer., iconHoveredRenderer, func, Overrides hovered icon renderer., iconHovered, node, This is the icon to be used as an hovered icon., iconNormal, node, This is the icon to be used as an normal icon., iconNormalRenderer, func, Overrides normal icon renderer., max, number, 5, The max value of the rating bar., onChange, func, Fired when a value is clicked., readOnly, bool, false, Don't allow input if set to true., value, number, 0, The value of the rating bar., * required property
CSS API
You can override all the class names injected by Material-UI-Rating thanks to the classes property. This property accepts the following keys:
root- Applied to the rootdivelementiconButton- Applied to the IconButton componenticon- Applied to the SvgIcon componentdisabled- Applied to the IconButton component when disabled prop istruereadOnly- Applied to the IconButton component when readOnly prop istrue
RTL support
Following Material-UI's conventions, this package respects theme.direction.rtl, so right-to-left support works out-of-the-box.
License
The files included in this repository are licensed under the MIT license.