KQ-206 · STEPPER/NUMBER

Stepper Number

A number spinner with weight to it. Hold a button and it accelerates from a tick to a blur; each change rolls the readout like an odometer, up or down with the direction of travel; and a push past the limit nudges and bounces back instead of doing nothing. A real spinbutton — arrows, PageUp/Down, and Home/End all work.

KQ-206 · STEPPER/NUMBER
12

Quantity 12

Install

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

$ pnpm dlx shadcn@latest add @kinetiq/stepper-number

Props

PropTypeDefaultDescription
valuenumberCurrent value (controlled).
onValueChange(value) => voidFires with the new value.
min / max / stepnumberBounds and increment.
format(value) => stringFormats the display and aria-valuetext.