fix(web): harden remark-repair-tables against code-span pipes and mixed fences

- countSourceCells: strip backtick code spans before counting column
  boundaries — a header like | `a | b` | c | is 2 columns, not 3
- repairMarkdownTables: track fenceChar ('`'|'~'|null) instead of a
  boolean toggle so ``` inside ~~~ no longer incorrectly flips fence state
- add 2 tests: code-span-with-pipe in header, backtick inside tilde fence
- fix stale comment in markdown-text.tsx (plugin reads file.value, not AST nodes)
- drop no-op .trimStart() (padSeparatorLine already returns a trimmed string)

via [HAPI](https://hapi.run)

Co-Authored-By: HAPI <noreply@hapi.run>

Author: heavygee

web/src/components/assistant-ui/markdown-text.tsx

@@ -30,9 +30,8 @@ import type { MarkdownTextPrimitiveProps } from '@assistant-ui/react-markdown'
 
 // ── Plugin array ────────────────────────────────────────────────────────────
 // Order: remarkGfm → remarkRepairTables → remarkNonHttpsAutolink → remarkStripCjkAutolink → remarkMath → remarkDisableIndentedCode → remarkFilePathLinks
-// remarkRepairTables must run immediately after remarkGfm — it uses the parsed
-// table nodes plus file.value position data to detect and repair off-by-one
-// separator rows before other transforms run.
+// remarkRepairTables must run immediately after remarkGfm — it reads file.value
+// (raw source) to pad short separator rows before remark-gfm parses the table.
 // remarkNonHttpsAutolink must run BEFORE remarkStripCjkAutolink so that the
 // CJK strip plugin sees the new link nodes and can trim trailing CJK punctuation
 // from them. Both must come before remarkMath (to avoid treating TeX as URI).

web/src/lib/remark-repair-tables.test.ts

@@ -73,6 +73,26 @@ describe('repairMarkdownTables (string)', () => {
         expect(repairMarkdownTables(input)).toBe(input)
     })
 
+    it('does not pad a valid table whose header contains a code span with a pipe', () => {
+        // | `a | b` | c |  is a 2-column header; separator has 2 cells — valid
+        const input = '| `a | b` | c |\n|---|---|\n| x | y |\n'
+        expect(repairMarkdownTables(input)).toBe(input)
+    })
+
+    it('does not flip fence state when ``` appears inside a ~~~ block', () => {
+        const input = [
+            '~~~',
+            '```',
+            '| A | B | C |',
+            '|---|---|',
+            '| x | y | z |',
+            '```',
+            '~~~',
+            '',
+        ].join('\n')
+        expect(repairMarkdownTables(input)).toBe(input)
+    })
+
     it('repairs a broken table after a fenced code block closes', () => {
         const input = [
             '```',

web/src/lib/remark-repair-tables.ts

@@ -18,9 +18,11 @@ import type { VFile } from 'vfile'
 // ── Helpers ──────────────────────────────────────────────────────────────────
 
 /** Count pipe-delimited cells in one table row line of raw source.
+ *  Strips backtick code spans first so pipes inside them are not counted.
  *  Skips escaped pipes (\|) which are literal characters, not cell boundaries. */
 function countSourceCells(line: string): number {
-    const trimmed = line.trim()
+    // Replace code spans with a placeholder so any | inside them is invisible
+    const trimmed = line.trim().replace(/`[^`]*`/g, '\x00')
     const inner = trimmed.startsWith('|') ? trimmed.slice(1) : trimmed
     const stripped = inner.endsWith('|') ? inner.slice(0, -1) : inner
     let cells = 1
@@ -90,15 +92,19 @@ function padSeparatorLine(sepLine: string, targetCols: number): string | null {
 export function repairMarkdownTables(source: string): string {
     const lines = source.split('\n')
     let changed = false
-    let inFence = false
+    // Track the fence character separately so ``` inside ~~~ (or vice versa)
+    // does not incorrectly flip the fence state.
+    let fenceChar: '`' | '~' | null = null
 
     for (let i = 0; i < lines.length; i++) {
-        // Toggle fenced-code state on ``` / ~~~ opening/closing lines
-        if (/^\s*(```|~~~)/.test(lines[i])) {
-            inFence = !inFence
+        const fenceMatch = lines[i].match(/^\s*(`{3,}|~{3,})/)
+        if (fenceMatch) {
+            const ch = fenceMatch[1][0] as '`' | '~'
+            if (fenceChar === null) { fenceChar = ch }
+            else if (ch === fenceChar) { fenceChar = null }
             continue
         }
-        if (inFence) continue
+        if (fenceChar !== null) continue
         if (i === 0) continue
 
         const sep = lines[i]
@@ -116,7 +122,7 @@ export function repairMarkdownTables(source: string): string {
         if (repaired !== null) {
             // Preserve original leading whitespace so indented tables are unchanged
             const prefix = sep.match(/^\s*/)?.[0] ?? ''
-            lines[i] = prefix + repaired.trimStart()
+            lines[i] = prefix + repaired
             changed = true
         }
     }