Tagify Dropdown not interactable when used with shadcn / radix ui Dialog

163 Views Asked by At

I'm facing a usability problem with Shadcn/Radix UI dialog in my web application. I've implemented a feature from tagify where i dynamically appended a dropdown menu of an input field inside my shadcn / radix ui dialog to the body. However, after doing so, I've observed that I can no longer click or select the dropdown items within the dialog since the way of shadcn disabled that.

It seems that Shadcn is completely disabling interaction with elements outside the dialog and its content, making it impossible to interact with the dropdown items from tagify. I believe a potential solution might be to append the input field directly to the input element itself, allowing normal interaction or allowing the hovering / clicking on the dropdown menu's component.

I've attached an image illustrating the problem for better understanding where you can see I have an tagify input menu inside a radix ui dialog . Any insights or suggestions would be greatly appreciated.

0

There are 0 best solutions below