A text input optimized for numbers
1import React from 'react'
2import NumberInput from '@tempoplatform/tpds/components/input/number'
3
4const [number, setNumber] = React.useState(10)
5
6<NumberInput
7 initialValue={number}
8 step={0.1}
9 minValue={-100}
10 maxValue={100}
11 maxLength={100}
12 allowFloats={true}
13 floatPrecision={3}
14 onChangeCallback={value => setNumber(value)}
15/>Prop Name
Type
Default
Required
Description
initialValue
String | Number
null
yes
The initial value displayed
step
Number
1
no
The amount to increase/decrease on arrow key input
minValue
Number
null
no
The minimum number the input will accept
maxValue
Number
null
no
The maximum number the input will accept
maxLength
Number
100
no
The maximum number of characters the input will accept
allowFloats
Boolean
true
no
Wether the input will accept floats - otherwise will be limited to integers
floatPrecision
Number
2
no
How many decimal places to allow if floats are allowed
onChangeCallback
Function
null
yes
The used to update the value