I am using PrimeVUE's DataTable with filtering. I have it set to "menu", which causes a dropdown menu to appear, allowing users to fill in a query which will filter the rows based on that.

Internally, PrimeVUE uses Vue's <Teleport /> component to attach te menu to body. Generally, this is good.

However, in my specific case, I use "Single SPA", which wraps the whole app inside #single-spa-application:web-app-2.

All styling is contained inside #single-spa-application:web-app-2. So, once I click the "filter" button, no styling is applied to the dropdown menu because it's outside of the CSS scope:

Some other PrimeVUE components provide an appendTo="#single-spa-application:web-app-2" option, which works wonderfully. However, this component does not.

Is it possible to "override" any Teleports within a certain component to point somewhere else? Currently, the only way I see is to actually fork and modify their code.