Open
Description
React (and HTML, for that matter) don't really like it when <div>
is inside <p>
. This happens when I portal inside markdown (where virtually everything is inside a <p>
), for portalling a video, for example.
So, I would like the option to use inline portal element (outputting <span>
). Perhaps ELEMENT_TYPE_HTML
could be renamed to ELEMENT_TYPE_HTML_BLOCK
and add ELEMENT_TYPE_HTML_INLINE
Here's the error for the placeholder. There's another for the portal container. I'll make a PR to fix both of these.
In HTML, <div> cannot be a descendant of <p>.
This will cause a hydration error.
...
<div ref={null} className="Positioned..." style={{...}}>
<CommentContainer depth={1}>
<render depth={1} themeName="rainbow">
<div ref={null} className="Container_..." style={{...}}>
<ModeratableItemBannerOutlet>
<div>
<CommentHeader>
<div aria-hidden={false} className={"rah-stat..."} style={{height:"auto", ...}} ref={null}>
<div className={undefined} style={{}} ref={function ref}>
<render onClick={function _temp2}>
<div onClick={function _temp2} ref={null} className="Content_ci...">
<CommentContent item={{id:4411616, ...}} showTouchFriendlyLinks={true} mdClassName="collapse-m...">
<CommentMarkdown className="collapse-m..." id="https://le../.">
<Markdown className="collapse-m..." id="https://le../." components={{...}}>
<Markdown className="collapse-m..." components={{...}} remarkPlugins={[...]} ...>
<div className="collapse-m...">
> <p>
...
<Video alt="image" node={{type:"element", ...}} onClick={function onClick} ...>
<span style={{opacity:0}} className="media smal...">
<OutPortal2 alt="image" node={{...}} onClick={function onClick} ...>
> <div ref={{current:null}}>
...
...
Metadata
Metadata
Assignees
Labels
No labels