Adding properties to <Portal> components

[Yukaru-san]

When using Portals I noticed that there are always new <div> containers being created that wrap around the children.

A previous discussion showed me that this has to be done to prevent some major issues.

Wrapping children into an empty <> bracket would make the created div it's only parent though. The current issue with that approach however is that the Portal's <div> does not support adding classnames or an id. Would it be possible to add this functionality to Portal components?

I'm thinking about something like this:

<Portal id="someID" className="portal-class" mount={document.getElementById("portalTarget")} >
    <>
        <SomeContentA />
        <SomeContentB />
    </>
</Portal>

producing something like this:

<div id="someID" class="portal-class"> // Portal with properties
     <SomeContentA />
     <SomeContentB />
</div>

currently something similar would look like this:

<div> // The portal
    <div id="someID" class="portal-class"> // The parent containing properties
         <SomeContentA />
         <SomeContentB />
     </div>
</div>