Number Input
Preview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxClearable
Preview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxStates
Preview
index.tsxPreview
index.tsx$
Preview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsx$
Preview
index.tsxPreview
index.tsxPreview
index.tsxFloating label
Preview
index.tsxPreview
index.tsxPreview
index.tsxUSD
Preview
index.tsxPreview
index.tsxPreview
index.tsxSize Medium
Preview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxPreview
index.tsxAlternative
Preview
index.tsxDesign Tokens for NumberInput
Note: NumberInput uses the same design tokens as the Input component. See BaseInput documentation for available tokens.
NumberInput API Reference
<NumberInput />
| Prop | Type | Default | Description |
|---|---|---|---|
| type | string | 'number' | Input type (always 'number' for NumberInput) |
| min | number | Minimum value | |
| max | number | Maximum value | |
| stepControl | number | 1 | Step increment |
| stepper | 'auto' | 'chevron' | 'separate' | 'auto' | Stepper type |
| unit | string | string[] | Unit or list of units | |
| selectedUnit | string | Selected unit | |
| onUnitChange | (unit: string) => void | Callback when unit changes | |
| allowInput | boolean | true | Allow manual input when using stepper |
| onValueChange | function (values, event?) | Callback when value changes (number format) | |
| isClearable | boolean | false | Show clear button |
| floatingLabel | React.ReactNode | Floating label | |
| theme | 'default' | 'alternative' | 'default' | Theme |
| inputSize | 'sm' | 'md' | 'sm' | Input size |
| leftIcon | React.ReactNode | Left icon | |
| onClear | () => void | Callback when clear | |
| ...InputProps | See Input | Inherits all props from Input | |
| ...NumericFormatProps | See NumericFormat | Inherits all props from NumericFormat |
Note: NumberInput inherits all props from Input and the native input element. See Input documentation for full details on available props and tokens.