InputMoney provides mobile users with the appropriate keyboard for easy data entry.
- Label – always included, presents clear description of anticipated data
- Restrictions – numeric characters only
- Mobile keyboard – Tel (numbers only)
- Default placeholder – (\$) shows that a money value is anticipated. The dollar sign persists as the user types to keep context * front-of-mind
- Mask – (\$0,000) data formats as a user types
- Help message – provides additional formatting expectations (for example ‘e.g. \$5,000); don’t add examples as placeholders
- ‘Smart’ value – ok as placeholders or pre-filled input
Flag to enable the user to be able to supply a '-' to indicate the value should be negative.
The default label associated with the input field. Should always be supplied to meet accessibility best practices.
String to override the default placeholder text, which is "$".
string | number
In general all input components should be controlled, which means their value is passed into the component, and state is maintained within the React component as opposed to using refs from the DOM.
Although generally required, default to ''.