Input Spinner

A minimalist input spinner for choosing quantities with buttons, typing, or arrow keys.

Add to your project

Connect Uniquel to your coding agent before using the component ID.

MCP ID

component:input/input-spinner

Claude*

Codex*

Lovable

Base44

Figma Make

Replit*

Cursor*

* Compatible with most projects that use the default React/Next.js framework.

React

Tailwind CSSLucide

Prop	Type	Description
`value`	`number`	Controlled numeric value
`defaultValue`	`number`	Initial value when uncontrolled
`onValueChange`	`(value: number) => void`	Called after typing or using either control
`min`	`number`	Lowest allowed value
`max`	`number`	Highest allowed value
`step`	`number`	Amount added or removed with each step
`disabled`	`boolean`	Disables the input and both controls
`className`	`string`	Styles for the outer control

Labeled React number input with an optional unit, stacked controls, bounds, and empty values.

Accessible React search bar with highlighted results, keyboard navigation, and polished loading and empty states.

A six-digit PIN input with paste support and keyboard navigation for verification codes.

1500

A vertical range input with configurable value labels, thumb shapes, colors, and height.

A premium search input with a focused state and an icon that becomes a submit action as you type.