mini-react-dom/src/core/renderToString.js

A lightweight React-like DOM renderer with JSX, hooks, context, SSR and lazy support

export function renderToString(element) {
  if (typeof element === "string" || typeof element === "number") {
    return String(element);
  }

  if (typeof element.type === "function") {
    return renderToString(element.type(element.props));
  }

  if (element.type === Symbol("fragment")) {
    return (element.props.children || []).map(renderToString).join("");
  }

  if (element.type === "TEXT_ELEMENT") {
    return element.props.nodeValue;
  }

  const props = element.props || {};
  const children = props.children || [];
  const attrs = Object.entries(props)
    .filter(([k]) => k !== "children")
    .map(([k, v]) => ` ${k}="${v}"`)
    .join("");

  const childrenHTML = children.map(renderToString).join("");
  return `<${element.type}${attrs}>${childrenHTML}</${element.type}>`;
}