add withoutContainer to `<Portal>` options

[Danue1]

I just want to render without containers. First of all, this is the design, if there is a better way, that's fine.

Summary

Before.

• We have to render <Portal> with container(<div> or <g>) into mount.

After.

• We can render <Portal> without container into mount.

[ryansolid]

The challenge here is this won't forward events properly. We use that element as a mechanism to forward delegated events. I gave the head some special treatment as it isn't expected to attach event listeners to it. But for typical insertions, we need the element the way it works currently.

[Danue1]

https://github.com/solidjs/solid/blob/28ca71f38b77bb4b78917830db1fe391711eac07/packages/solid/web/src/index.ts#L93-L97

Is it because we can't pass a getter like host? In that case, containers like <div>, <g> seem inevitable. Am I understanding correctly?

[Danue1]

Sorry to waste your time, but how could there be no way? At the very least, it would be nice to be able to style the container.

[Danue1]

Alternatively, specifying the container with the desired tag seems fine to me. I hope for your insights.

[ryansolid]

I mean it isn't impossible it is just tricky, we'd need to try to collect any top level elements even as they changed. Right now the escape hatch is Portal has a ref to the container. But It might be interesting passing other attributes through. Just have absolutely no idea how that'd play with TypeScript.

[Danue1]

Passing other attributes? If we think of something like <Portal classList={{ foo, bar }}>...</Portal>, is that correct?

[ryansolid]

Yes that's what I'm thinking.

[Danue1]

Thanks, I'll try it.