Input always formats as USA?

[iandonovan]

Expected Behavior

Like on the demo page, the phone number input should not be formatted as it is typed (since the format property is false). If the format property is true, it should format the phone number to match the selected country.

Current Behavior

Even with the format property set as FALSE, a phone number typed into the input is formatted as (123) 456-7189.

Steps to Reproduce

Input is initialized

Code:

<IntlTelInput
  containerClassName="intl-tel-input"
  inputClassName="form-control"
  fieldName="user[phone_number]"
/>

Resulting properties of the component when rendered:

allowDropdown: true
autoComplete: "off"
autoFocus: false
autoHideDialCode: true
autoPlaceholder: true
containerClassName: "intl-tel-input"
countriesData: null
customPlaceholder: null
defaultCountry: ""
defaultValue: ""
disabled: false
excludeCountries: []
fieldId: ""
fieldName: "user[phone_number]"
format: false
formatOnInit: true
geoIpLookup: null
inputClassName: "form-control"
nationalMode: true
noCountryDataHandler: null
numberType: "MOBILE"
onFlagClick: null
onPhoneNumberBlur: null
onPhoneNumberChange: null
onPhoneNumberFocus: null
onSelectFlag: null
onlyCountries: []
preferredCountries: ["us", "gb"]
separateDialCode: false
telInputProps: {}
useMobileFullscreenDropdown: true

Environment

• Version: v8.2.0
• Browser: Chrome 98.0

[iandonovan]

I think this has to do with setting fieldName. Likely an issue on my end.