React-phone-input-2: Autofocus not working after selecting a country code

Question

Can you explain, how can I focus the input after selecting the code country? On the demo it works as expected, but mine doesn't work...

There is a code of PhoneInput component:

<PhoneInput
   inputProps={{
       autoFocus: true
   }}
   onChange={(e, action) => phoneChange(e, action)}
   localization={i18n.language === 'ru' && ru}
   placeholder={placeholder}
   value={phoneNumber}
   buttonClass={styles.phoneButton}
   inputClass={styles.phoneInput}
   dropdownClass={styles.phoneDropdown}
   searchClass={styles.phoneSearch}
   searchPlaceholder={searchHolder}
   searchNotFound={searchFind}
   country={country}
   disableSearchIcon={true}
   enableSearch={true}
   autocompleteSearch={true}
   jumpCursorToEnd={true}
/>

I have tried to pass inputProps to a PhoneInput component, but it focuses the input on the first mount ;(

Answer 1

I suppose you have the most recent version of react-phone-input-2 installed on your project (2.15.1 or 2.15.0).

Versions lower than 2.14.0 will do the work for you.

You can uninstall your current version:

npm uninstall react-phone-input-2

And install the 2.14.0 version, that works with autoFocus, when you change the country:

npm install [email protected]