InputPhone

v9.3.0 Edit this page
Loading...

Usage

Loading examples...

Props

<InputPhone>

Standard phone input wrapper composing the standard NerdWallet formatted input component. There are some props that we don't allow the consumers to override (like type) on the underlying Formatted (and thus Input) component. See FormattedInput for the base formatted input component, as well as reference to the underlying react-number-format lib. react-number-format provides numerous props to override the formatted input if desired (like format and mask). InputPhone has an opinionated design, and some of those props are not surfaced in InputPhone.propTypes.

Name

Description

Type

Default

label

The default label associated with the input field. Should always be supplied to meet accessibility best practices.

string

'Phone number'

placeholder

String to override the default placeholder text, which is "+1".

string

'+1'

value

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 ''.

string

or

number

''

See Also