Trying to render jsx as a string

[Aker3]

How can i get the jsx as a string ?
I'm tring to create a wrapper that when you pass a jsx children to it, it renders the component and below a documentation of the jsx

const DocCard: Component<DocCardProps> = (props) => {
  return (
    <Card>
      {props.children}
      <Highlight language={Language.REACT_TSX} class="highlight">
        {/* props.children as a string */}
      </Highlight>
    </Card>
  );
};

[trusktr]

const source = await fetch('./path/to/DocCard.jsx').then(r => r.text())
const function = source.match(YourRegExpForTheDocCard).match(etc) // get the function
const functionBody = function.split(...) // remove the header and footer if you want
console.log(functionBody) // Use the string.

[Aker3]

This don't work, I want basically a way to convert jsx to the string of the jsx, if this is posible.