NumberField

iOS-style stepper with increment/decrement buttons.

Preview

Quantity

Step by 5

bash

npx auralix-ui add number-field

tsx

import { NumberField } from "@/components/ui/NumberField";

<NumberField value={qty} onChange={setQty} min={0} max={10} />

Name	Type	Default	Description
`value`	`number`	`0`	Current value.
`onChange`	`(value: number) => void`	`-`	Callback on value change.
`min`	`number`	`-`	Minimum value.
`max`	`number`	`-`	Maximum value.
`step`	`number`	`1`	Step increment.
`size`	`"sm" \| "md" \| "lg"`	`"md"`	Size of the stepper.

On this page