Rating

v1.0.0·Added in 1.0.0

Rate or show a rating with stars or any icon: half values, a hover preview, a label per value and a fill that pops.

Click or tap an icon to rate; with allowHalf the left half of an icon gives a half value. With a mouse the icons preview the rating under the pointer (the part beyond the chosen value dimmed) and the label follows it. Clicking the chosen value again clears it when clearable. On a phone, drag a finger across the icons to scrub and lift it to commit; every icon is a 44px target and the drag never scrolls the page. On commit the icons fill with a small staggered pop, and lowering fades the removed fill. The group is one slider: Tab to it for a focus ring, then Right / Up adds one (a half with allowHalf), Left / Down removes one (mirrored in right-to-left pages), PageUp / PageDown move a whole icon, Home clears (or goes to the lowest value), End jumps to the top, digits 1 to 9 pick a value directly, and 0, Backspace or Delete clear. Read-only ratings are a picture with a spoken summary ("Rated 4.8 of 5"). In the playground Send rating checks that a rating was chosen, pretends to send it and thanks you.