Not compatible with shadow dom

[kee0624]

Hi, there, I am getting the below error when using it with react shadow dom No group found for id ":r0:"

It seems like the error is from the PanelGroup component itself, you can reproduce the issue by wrapping the react-shadow-dom to the PanelGroup component, Has anyone experienced this issue before?

[kee0624]

I believe it is because the group.ts the document.querySelector is not able to find the shadow dom element, would you consider making the parent node customizable?

[bvaughn]

Feel free to open a PR with a proposal and I will look it over. (I don't plan to make any changes to support this myself.)

[dparrelli]

@kee0624 @bvaughn I was getting the same error in 0.0.56 on Next.js 13. Both 0.0.55 and 0.0.57 make the error go away, so could be isolated to 0.0.56 (assuming that's the version you're using). Possibly resolved as part of the work done here?

[bvaughn]

@dparrelli I believe you are right. There was a data attribute bug in 0.0.56 that was fixed in 3a2976d86a7abc84a4fef29ae6640cbe0676d50b

[Psvensso]

This is still not supported, it was not "fixed" in another issue.

The problem is in all the DOM utils, they dont not work when inside a shadowDom because of document.querySelector only selecting over light dom.

This must either be replaced by a rootElement argument/prop or handled internally by a ref to the root element or direct ref's to all dom elements instead of relying on the querySelector. But this is a pretty large architectural change.

[bvaughn]

Yeah. My comment was confusing this with another issue. I did not intend to try adding support for this (and still don’t)

[Psvensso]

@bvaughn thank you for taking the time to reply. We would really really appritiate if this feature was supported, we are using UI Composition with custom elements (think big admin portal like the Azure portal).

Appritiated if you could quickly glance over the PR and see if its anything you could concider including or leaving a comment on. Think it could be a benefit to drop the dependency on 'document' anyway.

thank you

[bvaughn]

Version 1.0.8 should now work with shadow dom

---

❤️ → ☕ givebrian.coffee

[psychedelicious]

@bvaughn Minor release feedback, https://github.com/bvaughn/react-resizable-panels/commit/d1be19f2877c5b53c2a40be8cb6a7e1ce9145fd4 is a breaking change now that these util methods are exported

[bvaughn]

Yeah that's fair. There should have been a default value for the container param.

This is a side project and I struggle to keep up with those. Sorry for letting that slip through.