Skip to content

Commit 4d6262a

Browse files
committed
docs: add examples of number input type
Signed-off-by: Erik Kieckhafer <[email protected]>
1 parent 868b5e6 commit 4d6262a

File tree

1 file changed

+25
-0
lines changed

1 file changed

+25
-0
lines changed

package/src/components/TextInput/v1/TextInput.md

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,31 @@ To enable the multi-line text input, pass the `shouldAllowLineBreaks` prop.
3131
</div>
3232
```
3333

34+
#### Number
35+
To enable the number type text input, use the `type="number"`.
36+
37+
```jsx
38+
<div style={{ width: "50%" }}>
39+
<TextInput name="example" placeholder="0.00" type="number"/>
40+
</div>
41+
```
42+
43+
To set minimum or maximum values allowed, set the `min` and `max` props.
44+
45+
```jsx
46+
<div style={{ width: "50%" }}>
47+
<TextInput name="example" placeholder="0.00" max={10.00} min={0} type="number"/>
48+
</div>
49+
```
50+
51+
To set the increment the input arrows will use, set the `step` prop.
52+
53+
```jsx
54+
<div style={{ width: "50%" }}>
55+
<TextInput name="example" placeholder="0.00" max={10.00} min={0} step="0.01" type="number"/>
56+
</div>
57+
```
58+
3459
### Styles
3560

3661
By default, text inputs are white with dark text on grey backgrounds.

0 commit comments

Comments
 (0)