KQ-077 · WHEEL/PICKER

Wheel Picker

A value picker built as a recessed drum — options curve beneath a fixed selection window, drags carry momentum into detents, every landing ticks the window caps, and letter keys typeahead straight to an option.

KQ-077 · WHEEL/PICKER
Shutter Drum · 8 StopsKQ-077

Exposure Preset

  • 1/500
  • 1/250
  • 1/125
  • 1/60
  • 1/15
  • 1/4
  • 1s
1/125

Committed

1/125

Fires once per settle.

KQ-077 · Wheel Picker · Rows 5 · P 700 · ζ 0.83

Drag, scroll, or type a digit - the drum settles on a detent.

Install

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

$ pnpm dlx shadcn@latest add @kinetiq/wheel-picker

Props

PropTypeDefaultDescription
options{ value: string; label: string }[]The drum's rows.
value / defaultValue / onValueChangestring / string / (value) => voidControlled or uncontrolled selection; fires once per settle.
visibleRows / height3 | 5 | 7 / number5 / 200Window size and control height.
aria-label / aria-labelledbystringOne is required — it is a bare form control.