Enhance LaTeX rendering in dashboard markdown

[AlexCheema]

Motivation

When models output LaTeX-formatted math proofs, the dashboard was not rendering them correctly. Issues included:

• \documentclass, \begin{document}, \usepackage showing as raw text
• $...$ inline math with complex expressions (like \frac, \ldots) not rendering due to markdown escaping backslashes
• \begin{align*}...\end{align*} and other math environments showing as raw text
• \emph{...}, \textbf{...} LaTeX formatting commands not being converted
• $\require{...}$ (MathJax-specific) causing KaTeX errors
• \begin{proof}...\end{proof} showing as raw text

Changes

Enhanced MarkdownContent.svelte with comprehensive LaTeX support:

Math extraction before markdown processing:

• Extract $...$, $$...$$, \(...\), \[...\] into placeholders before markdown processes the text
• Use alphanumeric placeholders (MATHPLACEHOLDERINLINE0END) that won't be interpreted as HTML tags
• Restore and render with KaTeX after markdown processing

LaTeX document command removal:

• Strip \documentclass{...}, \usepackage{...}, \begin{document}, \end{document}
• Strip \maketitle, \title{...}, \author{...}, \date{...}
• Strip \require{...} (MathJax-specific, not KaTeX)
• Replace tikzpicture environments with [diagram] placeholder
• Strip \label{...} cross-reference commands

LaTeX math environments:

• Convert \begin{align*}, \begin{equation}, \begin{gather}, etc. to display math blocks

LaTeX text formatting:

• \emph{...} and \textit{...} → <em>...</em>
• \textbf{...} → <strong>...</strong>
• \texttt{...} → <code>...</code>
• \underline{...} → <u>...</u>

LaTeX environments styling:

• \begin{proof}...\end{proof} → styled proof block with QED symbol
• \begin{theorem}, \begin{lemma}, etc. → styled theorem blocks

Display math enhancements:

• Wrapped in styled container with subtle gold border
• "LaTeX" label and copy button appear on hover
• Dark theme KaTeX color overrides for better readability
• Custom scrollbar for overflow

Why It Works

The key insight is that markdown processing was escaping backslashes in LaTeX before KaTeX could see them. By extracting all math expressions into alphanumeric placeholders before markdown runs, then restoring them after, the LaTeX content passes through to KaTeX unmodified.

Using purely alphanumeric placeholders like MATHPLACEHOLDERINLINE0END instead of <<MATH_INLINE_0>> prevents markdown from interpreting them as HTML tags and stripping them.

Test Plan

Manual Testing

• Hardware: Any machine with the dashboard
• What you did:
  • Ask model to "write a proof in latex"
  • Verify inline math like $x \in S$ renders correctly
  • Verify display math like \begin{align*}...\end{align*} renders as block
  • Verify \documentclass, \begin{document} are stripped (not shown)
  • Verify \emph{...} converts to italics
  • Verify copy button works on display math blocks
  • Test edge cases: $5 (currency) stays as text, \$50 (escaped) becomes $50

Automated Testing

• Dashboard builds successfully with npm run build
• Existing functionality preserved

🤖 Generated with Claude Code