viclafouch / mui-tel-input

📌 A phone number input designed for MUI (Material ui) V6 built with libphonenumber-js
https://viclafouch.github.io/mui-tel-input
MIT License
168 stars 67 forks source link

Passing in slotProps (MUI v6) for endAdornment causes country code to not render #158

Open shadoath opened 3 weeks ago

shadoath commented 3 weeks ago

I noticed that if I pass in slot props:

<MuiTelInput
  label="Phone"
  value={phone}
  onChange={handleChange}
  slotProps={{
    input: {
      endAdornment: (
        <Tooltip title="Request verification code">
          <IconButton onClick={requestPhoneCode}>
            <Sms />
          </IconButton>
        </Tooltip>
      ),
    },
  }}
/>

Looking at the code, this is because the old InputProps are being used instead. I was able to get my endAdornment to render by using the deprecated InputProps.

Requesting that support for the new slotProps be added. I see that there have been recent changes to support MUI v6 (I only recently upgraded myself), so I can understand it may be planned.

Thank you!

shadoath commented 3 weeks ago

A basic attempt at a solution: #159