Support for ShadowDOM - Githubissues

fregante commented 2 years ago

If I use a closed shadow DOM, the styles appended by Goober to the document’s head no longer reach it

const root = document.createElement("div");
document.body.append(root);
+ root.attachShadow({mode: "closed"})
render(<Toaster />, root);

Can you expose Goober’s target? https://github.com/cristianbote/goober/blob/e3f99e960a59d606fe7d4584383834465883ec8d/docs/docs/api/targets.md#L15

For example:

const root = document.createElement("div");
document.body.append(root);
root.attachShadow({mode: "closed"})
- render(<Toaster />, root);
+ render(<Toaster styleLocation={root} />, root);

Edit: Also asked in:

https://github.com/timolins/react-hot-toast/issues/189

fregante commented 2 years ago

Can you expose Goober’s target? cristianbote/goober@e3f99e9/docs/docs/api/targets.md#L15

Rather, is it possible to automatically detect and use React’s root instead?

kkosmowski commented 2 years ago

what's the status on this one? It should be pretty straightforward to implement. Is there any other way I can tell react-hot-toast where to put the styles (that usually are added to document.head)?