Number Input

A numeric field with increment/decrement steppers, built on Base UI's NumberField.

$bunx shadcn@latest add @nx-ui/number-input
Registry item
Installs withutils

Basic usage

Default stepper controls, min/max clamped.

Sizes

Default (40px) matches Input; sm (36px) for denser forms.

Prefix and suffix

Affixes for a currency symbol or a unit label.

£
tonnes
×loads

Disabled and invalid

Standard disabled and aria-invalid treatments.

Gate intake — tonnage entered on arrival

A controlled quantity field used on the Nexus ReGen weighbridge intake form.

t

24 tonnes of aggregate logged against ticket #GT-10231.

API reference

Exported parts and their props, extracted from the component source.

…extends NumberInputProps