Number stepper

Inline numeric input with decrement/increment controls, min/max, and step support.

Number stepper is for small bounded adjustments. Use a slider when the value is approximate or continuous.

Agents

Playground

Props in the URL.

Controls update query params directly. Complex slots use curated fixtures so component states stay deterministic, linkable, and screenshot-ready.

Loading playground.

States

Every state maps to the same component render route through the `state` query param.

Agents

Default

Bounded numeric adjustment.

Agents

Small

Compact quantity control.

Agents

Choose a value between 1 and 10.

Error

Invalid or out-of-policy value.

Props

Name	Type	Default	Description
`value`	`number`	-	Controlled numeric value.
`defaultValue`	`number`	`0`	Uncontrolled initial value.
`min`	`number`	-	Minimum allowed value.
`max`	`number`	-	Maximum allowed value.
`step`	`number`	`1`	Increment size.
`onValueChange`	`(value: number) => void`	-	Receives clamped numeric value.
`label`	`ReactNode`	-	Field label.