A form input for numeric values with built-in validation, min/max constraints, and step controls. Use NumberInput for quantities, measurements, percentages, and similar inputs.
ts
| Guidance | Practices |
|---|---|
| Do | Set min, max, and step to guide users toward valid values. |
| Do | Show units (e.g. "%" or "GB") so users know what the number represents. |
| Don't | Use NumberInput for free-form text that happens to contain numbers; use TextInput instead. |
| Don't | Set both isOptional and isRequired on the same field. |
Number input with a clear button, unit suffix, and min/max constraint
Number input with min/max boundaries and a helper description
Number inputs showing error, warning, and success validation states
Number input with a percentage unit suffix and valid range