@readme/markdown 14.11.5 → 14.12.1

package/components/HTMLBlock/index.tsx

@@ -21,16 +21,12 @@ interface Props {
 }
 
 const HTMLBlock = ({ children = '', html: htmlProp, runScripts, safeMode: safeModeRaw = false }: Props) => {
-  // Determine HTML source: MDXish uses html prop (from HAST), MDX uses children
-  let html: string = '';
-  if (htmlProp !== undefined) {
-    html = htmlProp;
-  } else {
-    if (typeof children !== 'string') {
-      throw new TypeError('HTMLBlock: children must be a string');
-    }
-    html = children;
-  }
+  // Determine HTML source: MDXish uses html prop (from HAST), MDX uses children.
+  // A non-string child (no html prop) can't be injected as raw HTML — see the
+  // fail-soft fallback below.
+  const htmlSource = htmlProp !== undefined ? htmlProp : children;
+  const nonStringChildren = typeof htmlSource !== 'string';
+  const html: string = nonStringChildren ? '' : htmlSource;
 
   // eslint-disable-next-line no-param-reassign
   runScripts = typeof runScripts !== 'boolean' ? runScripts === 'true' : runScripts;
@@ -45,6 +41,12 @@ const HTMLBlock = ({ children = '', html: htmlProp, runScripts, safeMode: safeMo
     if (typeof window !== 'undefined' && typeof runScripts === 'boolean' && runScripts) exec();
   }, [runScripts, exec]);
 
+  if (nonStringChildren) {
+    // Fail soft: a non-string child (e.g. JSX that wasn't serialized back to a
+    // raw string) should never throw, so render the child nodes directly
+    return <div className="rdmd-html">{children}</div>;
+  }
+
   if (safeMode) {
     return (
       <pre className="html-unsafe">