Rating
Star rating. Interactive it is a radio group with a hover preview; read-only it shows averages down to half stars.
import { Rating } from "pleate/rating";Rate and display
How was your stay?
- Alfama flat, Lisbon212
- River view room, Porto87
Props
- value / defaultValue / onValueChange
Score; 0 means not rated.
numberdefault 0- max
Number of stars.
numberdefault 5- readOnly
Display only; fractional values allowed.
booleandefault false- allowHalf
Read-only values round to halves instead of whole stars.
booleandefault false- size
Star size.
"sm" | "md"default "md"- showValue
The number in mono next to the stars.
booleandefault false
Accessibility
- Interactive: a radio group (Radix); arrow keys move and select, and each star is named "n of max".
- Read-only: a single role="img" with a label like "Rating: 4.6 out of 5".