fix(editor): render code blocks when lowlight highlightAuto returns empty tree

lowlight.highlightAuto() returns a Root with zero children (relevance 0)
for content it cannot classify into any language. toHtml() of that tree
produces an empty string, so dangerouslySetInnerHTML rendered a blank
<code> element — the <pre> background was visible but the text was gone.

Fall through to plain text render when toHtml produces nothing.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-authored-by: multica-agent <github@multica.ai>

packages/views/editor/readonly-content.test.tsx

@@ -151,6 +151,15 @@ describe("ReadonlyContent code styling", () => {
     expect(blockCode?.textContent).toBe(literalCode);
   });
 
+  it("renders code blocks without a language tag (lowlight highlightAuto fallback)", () => {
+    const token = "mul_407ec1e4464b580304362ed749f821901fd7d310";
+    const { container } = render(
+      <ReadonlyContent content={["```", token, "```"].join("\n")} />,
+    );
+    const blockCode = container.querySelector("pre code");
+    expect(blockCode?.textContent?.trim()).toBe(token);
+  });
+
   it("keeps editor code literal by disabling font ligatures", () => {
     const codeCss = readFileSync("editor/styles/code.css", "utf8");
 

packages/views/editor/readonly-content.tsx

@@ -242,20 +242,23 @@ function buildComponents(): Partial<Components> {
         const tree = lang
           ? lowlight.highlight(lang, code)
           : lowlight.highlightAuto(code);
-        return (
-          <code
-            className={cn("hljs", lang && `language-${lang}`)}
-            dangerouslySetInnerHTML={{ __html: toHtml(tree) }}
-          />
-        );
+        const html = toHtml(tree);
+        if (html) {
+          return (
+            <code
+              className={cn("hljs", lang && `language-${lang}`)}
+              dangerouslySetInnerHTML={{ __html: html }}
+            />
+          );
+        }
       } catch {
-        // Fallback — render without highlighting
-        return (
-          <code className={className} {...props}>
-            {children}
-          </code>
-        );
+        // fall through to plain render
       }
+      return (
+        <code className={cn("hljs", className)} {...props}>
+          {children}
+        </code>
+      );
     },
 
     // Pre — pass through (CSS handles styling via .rich-text-editor pre).