On This Page
Premium rating indicator supporting custom shapes (Stars, Hearts, Thumbs), sizes, keyboard navigation, and micro-interactions.
star ratingGathering or displaying qualitative feedback (product reviews, app store ratings, item reviews)heart ratingMarking items as favorites, adding to wishlists, or showcasing popularity indicesthumb ratingBinary liking/disliking systems or quick satisfaction scoring layoutsread-only modeDisplaying aggregated feedback stats where user input is not permitted (e.g. historical average scores)| Prop | Type | Default | Description |
|---|---|---|---|
| value* | number | — | Selected active rating score count. |
| max | number | 5 | Maximum scoring slots count. |
| onChange | (value: number) => void | — | Callback fired when a rating icon is selected. |
| readonly | boolean | false | Disables pointer event hooks and transforms to read-only. |
| size | "sm" | "md" | "lg" | "md" | Visual dimensions of the rating icons. |
| icon | "star" | "heart" | "thumb" | "star" | Selection symbol rendering variant. |
| className | string | — | Additional custom class names. |