Using the ShadowDOM

[rauloaida]

Describe the bug

• No documentation/example I could find on the correct way to implement the shadowDOM using Reshaped.
• Reshaped styles are not applying in the example attached.

To Reproduce
CodeSandbox Example

Expected behavior

• Reshaped theme and functionality can be used normally within a shadowDOM element.

Environment (please complete the following information):

• Reshaped 2.9.3
• Chrome v117.0.5938.92

Additional context
Shadowdom elements are awesome :) would love to have this functionality with Reshaped and replace all our iframes!

[blvdmitry]

That's an interesting use case for sure and I guess what ShadowDOM does right now is actually what one would expect from both ShadowDOM and iframe since both make sure your styles inside and outside the container are isolated. Therefore there is a big dependency on the way styles are loaded on the page. If you're able to load the link/style tags inside your shadow DOM – they should apply to the components as expected. I'll try to find more examples of how others are using ShadowDOM in next js with their default build tooling