blackchalkv0.3.0
Components

Rating

SketchRating — a hand-drawn five-star rating widget.

SketchRating draws five rough.js stars filled to reflect a numeric rating. It works as a read-only display or an interactive picker — clicking a star updates the value and fires onChange.

Default

import { SketchRating } from "blackchalk";<SketchRating rating={4} />

Interactive

import { SketchRating } from "blackchalk";<SketchRating rating={3.5} size={32} onChange={(r) => console.log(r)} />

Props

PropTypeDefault
ratingnumber0
sizenumber20
onChange(rating: number) => void
readOnlyboolean

See it in the Storybook playground, or read the source.

On this page