KQ-162 · RATING/ARC

Rating Arc

A rating that fills along a 220-degree arc — the fill draws itself and the thumb rides the curve rather than cutting across it, while sweeping the arc paints a ghost of the score you would commit.

KQ-162 · RATING/ARC

3.5 of 5

Score 3.5 · half marks

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/rating-arc

Props

PropTypeDefaultDescription
value / defaultValuenumberControlled or initial score, 0..max.
onValueChange(value) => voidFires the committed score.
max / stepnumber5 / 1Top of the scale and its granularity; 0.5 gives half marks.
label / readoutstring / boolean"Rating" / trueAccessible name, and whether to print the score beneath.