bug(web): currency prose containing two $ signs is rendered as KaTeX math, mangling messages

[heavygee]

Bug

Markdown messages containing currency amounts (or any prose with two $ signs in the same text run) are silently re-rendered as KaTeX inline math. The text between the two $ signs is collapsed into a single math expression — whitespace stripped, letters reflowed as italic math symbols, apostrophes turned into prime marks — and is no longer readable as prose.

remark-math is configured with defaults, which enables singleDollarTextMath: true. Any pair of $ characters in a paragraph becomes a math span. Currency mentions are extremely common in chat (pricing discussions, plan comparisons, billing), so the false-positive rate is high enough that users have hit it on day-to-day prose.

Reproduction

Render this paragraph through the chat surface (works in <MarkdownText />, <Reasoning />, and <MarkdownRenderer /> — all share MARKDOWN_PLUGINS):

The plan is $200/mo and the bill is $80 — total $400 saved.

Expected: three literal currency amounts in plain text.

Actual: everything between the first $ and the next-to-last $ is rendered inside a <span class="katex"> block. Output looks like:

The plan is <span class="katex">200/mo and the bill is</span>80 — total $400 saved.

Real-world example pulled from a user-reported message:

At least $400 of API usage on a $200 plan. That's 2:1 minimum.

→ Renders as At least <math>...</math>400 of API usage on a 200 plan. That's 2:1 minimum. with all the running text collapsed into KaTeX italic glyphs.

Trade-off vs #237

Issue #237 (closed) added KaTeX support and explicitly cited single-dollar form $ E= mc^2 $ as desired. Disabling single-dollar inline math reverses that part of the decision — users who want inline math will need to switch to:

• $$E = mc^2$$ on its own line (block math, still works)
• ```math fenced block (if/when remark-math gains GFM math fence support)

That's a regression for math-heavy users, but the false-positive rate from $N/$NN currency prose is high enough that the current default makes most non-math messages unsafe to render.

Proposed fix

Pass singleDollarTextMath: false to remarkMath in web/src/components/assistant-ui/markdown-text.tsx (single source of truth — used by MarkdownText, Reasoning, and MarkdownRenderer). Block math $$...$$ keeps working. This matches GitHub-flavored markdown, which only treats math as math inside $$...$$ or fenced ```math blocks, never inside a single $.

PR with regression tests follows.

Environment

• web/ package
• remark-math@^6.0.0
• rehype-katex@^7.0.1
• Affects every MarkdownText / Reasoning / MarkdownRenderer consumer

[github-actions]

Confirmed from the web code path. HAPI currently registers remarkMath directly in the shared MARKDOWN_PLUGINS array with no options, then uses rehypeKatex for rendering. That shared array is consumed by MarkdownText, Reasoning, and MarkdownRenderer, so the reported behavior is not isolated to one component.

The proposed fix location looks correct: update the remarkMath entry in web/src/components/assistant-ui/markdown-text.tsx so the shared markdown pipeline disables single-dollar inline parsing. I also did not find an existing regression test for currency / prose with multiple $ characters; the current markdown integration test only covers plugin inclusion/order.

Relevant code:

• web/src/components/assistant-ui/markdown-text.tsx:36 - shared MARKDOWN_PLUGINS array.
• web/src/components/assistant-ui/markdown-text.tsx:40 - remarkMath is included without options.
• web/src/components/assistant-ui/markdown-text.tsx:45 - rehypeKatex is enabled for math rendering.
• web/src/components/assistant-ui/markdown-text.tsx:663 - MarkdownText uses the shared plugin arrays.
• web/src/components/assistant-ui/reasoning.tsx:47 - Reasoning uses the same shared plugin arrays.
• web/src/components/MarkdownRenderer.tsx:29 - MarkdownRenderer uses the same shared plugin arrays.
• web/src/components/assistant-ui/markdown-text.test.ts:6 - existing markdown plugin tests; no currency/two-dollar regression coverage found there.

---

HAPI Bot

[x-at-01]

While configuring remarkMath with singleDollarTextMath: false is indeed the correct way to solve the currency false-positive bug (matching GitHub-flavored markdown), you might also want to look into completely eliminating the client-side KaTeX dependency and its heavy stylesheets/font files in your assistant UI components.

Since 2023, all major modern browser engines (Blink, WebKit, Gecko) have native MathML Core support, meaning standard <math> tags are rendered natively via C++ using system math fonts.

I wrote @webc.site/math (GitHub: https://github.com/webc-site/math, Live Demo: https://math.webc.site) — the world's smallest and fastest TeX-to-MathML compiler. It compiles LaTeX formulas directly into standard <math> tags.

• Size: Only 3.58 KB Gzipped (zero dependencies, compared to KaTeX's 75KB JS + CSS + fonts).
• Speed: ~329,000 ops/s (about 3.6x faster than KaTeX).

In your web/src/components/assistant-ui/markdown-text.tsx, you can keep remark-math (with singleDollarTextMath: false to fix the currency bug) and compile the parsed math nodes to native MathML using custom components. This completely removes the need for rehype-katex and client-side CSS:

import compile from '@webc.site/math';
import ReactMarkdown from 'react-markdown';
import remarkMath from 'remark-math';

const components = {
  math: ({ value }) => <span dangerouslySetInnerHTML={{ __html: compile(value, true) }} />,
  inlineMath: ({ value }) => <span dangerouslySetInnerHTML={{ __html: compile(value, false) }} />
};

// inside markdown renderer:
<ReactMarkdown
  remarkPlugins={[[remarkMath, { singleDollarTextMath: false }]]}
  components={components}
>
  {content}
</ReactMarkdown>

This reduces the initial bundle size of HAPI's web frontend, removes the dependency on external CSS sheets or font loads, and naturally inherits text colors in dark mode.