Portal Custom root element

[GianlucaGuarini]

Hi there,
this discussion was opened 3 years ago. I think I might have a look at it to solve the issue. Do you accept PRs?

I could imagine something like this should be enough to solve our problems:

import { PortalRootProvider } from 'headlessui'

const ref = useRef<HTMLDivElement | null>(null)

return (
  <PortalRootProvider value={ref}>
    <div ref={ref}>
      {children}
      {/* all headless popover/modal components will be injected here */}
    <div>
  </PortalRootProvider>
)