Tips for displaying a dropdown to overflow the React Virtualized container without being hidden?

[rupam999]

I know it’s a bit of a loaded question. First off, thank you to Brian Vaughn for this library. It’s extremely helpful. However, I cannot figure out how to get my opened dropdown to overflow the virtualized list container without being hidden cut off). I think I have a decent grasp of stacking context and z-indexes and I don’t want to change the overflow property values in the ReactVirtualized css classes. The default scrolling behavior of this list is necessary. But I do prefer to have the dropdown overflow the bottom border of the container. I have been learning about portals, but I don’t really see how this could be applied in this scenario. I am new to portals, but from my experimenting around, I don’t see how I could apply a portal for each occurrence of the dropdown component (I have a dropdown in every row of the list in the same column). If anybody has any ideas, it would be greatly appreciated. Thank you. Worst case scenario, maybe I could add some logic to make the dropdown slide open upwards if it’s closer to the bottom border. Either way, if you have any ideas, would be very grateful