NumberInput

Numeric input with increment/decrement stepper buttons, min/max bounds, and step control.

Examples

Number input with increment and decrement buttons.

Increments in steps of 5.

Step: 5

Constrained between 0 and 10.

Range: 0–10

Number input in a disabled state.

pnpm add @rokle/components @rokle/tokens

Installs with the default Rokle brand. Generate a custom brand on rokle.app to use your own colours and personality.

import { NumberInput } from "@rokle/components";

import { NumberInput } from "@rokle/components";

export function Example() {
  return <NumberInput />;
}

Prop	Type	Default	Description
value	number	-	Current numeric value.
onValueChange	(value: number) => void	-	Called when value changes.
min	number	-	Minimum allowed value.
max	number	-	Maximum allowed value.
step	number	1	Increment/decrement step size.