Number Input

Name: Boreal UI
Author: Davin Chiupka

The NumberInput component captures numeric values with optional min, max, step, and increment controls.

Usage & Examples

seats.tsx

<NumberInput
    label="Seats"
    defaultValue={12}
    min={1}
    max={50}
    step={1}
  />

Number Input props API
				Default	Description
`clampOnBlur`	`boolean`	No	props	`true`	Whether to clamp values to min/max on blur and when using stepper buttons.
`className`	`string`	No	styling	`—`	Additional class name for the component root.
`containerClassName`	`string`	No	props	`—`	Additional class name for the outer label/input container.
`controlsClassName`	`string`	No	props	`—`	Additional class name for the stepper controls wrapper.
`data-testid`	`string`	No	testing	`—`	Backward-compatible alias for test ID attributes.
`decrementAriaLabel`	`string`	No	props	`"Decrease value"`	Accessible label for the decrement control.
`decrementButtonClassName`	`string`	No	props	`—`	Additional class name for the decrement button.
`defaultValue`	`number \| ""`	No	props	`""`	Initial numeric value for uncontrolled usage.
`errorMessage`	`ReactNode`	No	props	`—`	-
`helperText`	`ReactNode`	No	props	`—`	-
`incrementAriaLabel`	`string`	No	props	`"Increase value"`	Accessible label for the increment control.
`incrementButtonClassName`	`string`	No	props	`—`	Additional class name for the increment button.