fix: dropdown overflow in markdown widget

[pramodrhegde]

Summary

fixes #5871

It solves the dropdown overflow being hidden inside the rich text editor

Before the fix:

After fix:

Test plan

I was able to reproduce the issue and verify the fix in the chrome browser.

Checklist

Please add a x inside each checkbox:

• I have read the contribution guidelines.
• Code is formatted via running yarn format.
• Tests are passing via running yarn test.
• The status checks are successful (continuous integration). Those can be seen below.

A picture of a cute animal (not mandatory but encouraged)

[pramodrhegde]

PS: The other part of the issue wherein the portion of the dropdown hidden below nested editor toolbar still needs to be triaged.

What I understood so far is, it is to do with the way z-index values are set up for dropdown and toolbar components. since different editor components form different z-index stacks, the dropdown from the lower stack order can never be brought in front of the toolbar of the editor component which is in higher stack order by just using a higher z-index value for the dropdown component. I see only one option so far i.e to bring all the editor components under a single z-index stack which is kinda tricky and I need to check if that is not going to break anything else w.r.t the existing CSS.

[erezrokah]

Thanks @pramodrhegde, do you mind sharing the configuration you used to reproduce the issue?

I was only able to reproduce the second part of the issue

[pramodrhegde]

Thanks @pramodrhegde, do you mind sharing the configuration you used to reproduce the issue?

I was only able to reproduce the second part of the issue

@erezrokah To reproduce the first issue:

1. You create a list of editor components that can overflow the rich text editor container.
2. Make sure one of these editor components inserts a rich text editor into the existing rich text editor.
3. Now add a rich text editor component and click on the add editor component dropdown from the newly added rich text editor component.
4. Try to scroll through and see if you can see the entire list of editor components that you can add.

which you will not be able to see as the overflow is hidden for the rich text editor container.

[erezrokah]

Thanks @pramodrhegde and sorry for the delay.

I appreciate the additional help in reproducing this