components/bits/NumberInput#

NumberInput()#

function NumberInput(props): Element;

Parameters#

Returns#

Element

NumberInputProps#

Properties#

allowEmpty?#

optional allowEmpty?: boolean;

disabled?#

optional disabled?: boolean;

error?#

optional error?: boolean;

fullWidth?#

optional fullWidth?: boolean;

helperText?#

optional helperText?: string;

inputProps?#

optional inputProps?: InputHTMLAttributes<HTMLInputElement>;

InputProps?#

optional InputProps?: any;

integer?#

optional integer?: boolean;

label?#

optional label?: string;

max?#

optional max?: number;

min?#

optional min?: number;

onChange#

onChange: (value) => void;

Parameters#

Returns#

void

outOfRange?#

optional outOfRange?: "reject" | "clamp";

What to do with a value outside [min, max] on commit.

'reject' (the default) keeps the typed text, shows the range in an error helper and does NOT call onChange — the parent keeps its last valid value and the user can see exactly what was wrong.

'clamp' is the old behaviour: silently rewrite the field to the nearest bound. It destroyed the entered value with nothing on screen to say so, which on a device settings form means a typo becomes a plausible-looking wrong number. Kept as an opt-in for the few callers whose bounds are cosmetic rather than meaningful.

placeholder?#

optional placeholder?: string;

size?#

optional size?: "small" | "medium";

step?#

optional step?: number;

sx?#

optional sx?: any;

units?#

optional units?: string;

value#

value: number | null;

variant?#

optional variant?: "outlined" | "filled" | "standard";