Live example
**** Do we need to add properties for <CurrencyInput /> also? ****
Properties
|
Name |
Values |
Default |
|---|---|---|
|
Accepts all FieldProps |
FieldProps |
|
|
label (required) |
string |
|
|
currency |
'GBP' | 'EUR' | 'AUD' | 'USD' |
GBP |
|
... |
JSX.IntrinsicElements["input"] |
|
Native Properties
|
Name |
Values |
Default |
|---|---|---|
|
currency |
'GBP' | 'EUR' | 'AUD' | 'USD' |
'GBP' |
|
invalid |
boolean |
false |
|
stretch |
boolean |
false |
|
iconLeft |
IconNameExtended |
|
|
iconRight |
IconNameExtended |
|
|
… |
React.RefAttributes |
|
Composition
- Label text
- Hint text
- Currency icon
- Input text
- Input border
|
Tokens |
|
|---|---|
|
Text color |
color.surface.onsurface |
|
Hint text color |
color.surface.onsurfacevariant |
|
Input border color |
input.color.border |
|
Text font weight |
font.family.bold |
|
Hint text font weight |
font.family.book |
|
Text size |
font.size.md |
|
Text line height |
font.lineheight.md |
|
Padding |
space.100 space.200 |
|
Input border width |
border.width.md |