Cannot apply custom dropdown style

[autsada]

Hello,

First of all, it's a very nice library and I enjoy using it so far, just one problem that I couldn't figure out how to fix. I applied my custom styles by setting "containerClass" and "inputClass" and both work fine, but it doesn't work for "dropdownClass" (as well as "dropdownStyle"), if anyone could guide me on how to solve this issue it would be highly appreciated.

Thank you.

[laurelgr]

I had the same issue, so I figured out a workaround via the working custom classes.

I used sibling selector + to apply styles from the inputClass styling, but you could also use :last-child or .flag-dropdown selectors to target the correct child from the containerClass.

Workaround example with inputClass and sibling selector +:

const useStyles = makeStyles((theme) => ({
  phoneInput: {
    '& + div.flag-dropdown': {
      // put here styles to apply on the dropdown element
    }
 }
}));

...

const classes = useStyles();
return <PhoneInput  inputClass={classes.phoneInput} />;