Dropdown-content problem when inside an expansion panel

[JoaquimCAP]

If the component is placed inside an expansion panel , when the list is opened, half dropdown will be hidden (if the height is smaller than the dropdown content)

I was trying to change the z-index + position: absolute, but playing with this styles didn't change anything.

Material Angular manages the dropdown box in a different way (rendered outside the main "app-root" and avoiding the overflow problem) https://stackblitz.com/edit/angular-r6ouax?file=app/expansion-overview-example.html

*Maybe another alternative solution can be a param/setting, that allows to change the orientation of the dropdown (for example, above the input, when there is not enough space below)

[nikhiln]

@JoaquimCAP Could you create stackblitz demonstrating the issue?

[JoaquimCAP]

Sorry, no time for testing in another environment. I found this stackblitz with your component: https://stackblitz.com/edit/angular-ngx-international-phone-number But is impossible to install all the packages from Angular Material (errors with core-js, dependencies missing, etc...) and at work i can't pass more time to test :( I hope someone else can do it!