formaat-design / reshaped

Community repository for storing examples, reporting issues and tracking roadmap
https://reshaped.so
97 stars 3 forks source link

Unable to use Modal/Overlay in a Web Component #260

Open erickcelio opened 4 weeks ago

erickcelio commented 4 weeks ago

Describe the bug When using reshaped inside a web component with shadow DOM, the Modal or Overlay is attached to the window root instead of the root of the web component. This can be problematic if the website using the web component doesn't have the reshaped CSS, and you want the CSS to be scoped within the web component, as this can cause issues.

To Reproduce https://codesandbox.io/p/sandbox/reshaped-wc-modal-dc2swq

Expected behavior When using a modal within a web component, the modal should be attached to the root of the shadow DOM or provided with an element reference to be attached.

Environment (please complete the following information):