Set default country code in amplify authenticator signup component

Question

Amplify authenticator is really convenient for common authentication flow.

By default, the country code is pre-select to +1, but the apps developed for other countries may want to default to another one.

Is there a way to change the default pre-selected value.

The official document doesn't include anything about this.

Answer 1

You can pass the dialCode in formFields.

{
  type: 'phone_number',
  dialCode: 27, // or '+27' 
  value: '5555555555',
}

Answer 2

signUpConfig.defaultCountryCode to the rescure.

After reading the source code of amplify-js. Here the code is.

getDefaultDialCode() {
        return this.props.signUpConfig &&
            this.props.signUpConfig.defaultCountryCode &&
            countryDialCodes.indexOf(
                `+${this.props.signUpConfig.defaultCountryCode}`
            ) !== -1
            ? `+${this.props.signUpConfig.defaultCountryCode}`
            : '+1';
    }

So to use it. The HOC should like

export default withAuthenticator(App, {signUpConfig: {defaultCountryCode: 61}})