material-ui-phone-number

material-ui-phone-number copied to clipboard

The onChange method is providing us mobile number and country info on the first and second param but the type definition includes only one event param due to which the users are unable to access the second param and are getting this error So in order to overcome this error, I have added the type definition for the onChange method as

  onChange: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> & ((mobileNumber: string, country: Country) => void);

and the type definition for the country (second param) as

type Country = {
  name: string;
  dialCode: string;
  countryCode: string;
}

After this, the user can access both params successfully without any ts errors

Why was this PR was not merged?

@alexplumb looks like a great fix

This package (https://github.com/viclafouch/mui-tel-input) handles this problem, supports both React 17 / 18

Until this is merged you can bypass the typescript error by setting the parameter as nullable: onChange={(value, country?) => {}}