Unknown tags which are self closing do not close

[Specy]

Initial checklist

• I read the support docs
• I read the contributing guide
• I agree to follow the code of conduct
• I searched issues and couldn’t find anything (or linked relevant results below)

Affected packages and versions

7.0.0

Link to runnable example

No response

Steps to reproduce

I'm using this lib as a sort of MDX to have a realtime markdown editor with some custom components, i'm using the react-markdown lib, and adding custom components under the components propriety.
When dealing with known tags, like <a /> everything seems to work properly, but when using custom tags, for example a <Pdf src="..."/>, it seems like the tag never closes. I've read #16 and #8 made sure there were a new line between the component and the rest, this is the source:

test (shown)

<Pdf src="somepdf.pdf" />

test 123 (not shown, as the pdf component has no children, but it is being sent as a child to Pdf)

To make it work i need to manually close the tag <Pdf src="..." ></Pdf>.
Is this expected behaviour? If so, is there a workaround?

If it could be useful, this is my code:

<ReactMarkdown
        remarkPlugins={[
            remarkGfm,
            remarkMath,
        ]}
        rehypePlugins={[
                [rehypeKatex, {output: 'htmlAndMathml'}],
                rehypeRaw,
            ]
        }
        components={{
            //hidden rest of components
            pdf: withPropsValidator(MD_CUSTOM_COMPONENTS.pdf, ({props, children}) => {
                return <PDFRenderer
                    src={props.src}
                    style={{
                        width: props.width,
                        minHeight: props.minheight,
                        height: props.height,
                    }}
                    allowOpen={props.allowopen}
                    allowToolbar={props.allowtoolbar}
                    allowResize={props.allowresize}
                />
            }),
        }}
    >
        {markdown}
    </ReactMarkdown>;

Expected behavior

I expect the custom tag to close, leading to further source to be parsed on it's own instead of being a child of the self closing tag

Actual behavior

The custom self closing tag doesn't close, making all the next items as children of this tag

Runtime

Node v17

Package manager

npm 8

OS

Windows

Build and bundle tools

Next.js

[ChristianMurphy]

Welcome @Specy! 👋
Sorry you ran into confusion.

HTML does not have self closing tags.
It has void elements, void elements are only well known tags that come from this list https://developer.mozilla.org/en-US/docs/Glossary/Void_element

<pfd> is not a valid void element (nor valid HTML at all) so it does not self close.
Add a closing tag, or if you want JSX support, consider using MDX https://mdxjs.com/

[github-actions]

Hi! Thanks for reaching out! Because we treat issues as our backlog, we close issues that are questions since they don’t represent a task to be completed.

See our support docs for how and where to ask questions.

Thanks,
— bb