mixdog 0.9.0 → 0.9.1

package/src/tui/markdown/format-token.mjs

@@ -5,14 +5,15 @@
  *   - chalk is forced to truecolor (level 3) so colors render regardless of the
  *     ambient TTY detection (we control the surface).
  *   - The `permission`/code accent and blockquote bar come from our theme.mjs.
- *   - `code` (fenced) is emitted as a block-colored plain text + EOL (no
- *     syntax highlighter dependency); `codespan` (inline) gets the accent color.
+ *   - `code` (fenced) uses cli-highlight + theme syntax palette; `codespan`
+ *     (inline) gets the accent color.
  *   - `table` is NOT handled here — the React component (MarkdownTable.jsx)
  *     renders tables with proper ink Box layout (hybrid split).
  *   - Hyperlinks/issue-ref linkify are dropped (no OSC-8 dependency); link text
  *     is shown plainly with its URL.
  */
 import { Chalk } from 'chalk';
+import { highlight, supportsLanguage } from 'cli-highlight';
 import stripAnsi from 'strip-ansi';
 import stringWidth from 'string-width';
 import wrapAnsi from 'wrap-ansi';
@@ -101,6 +102,7 @@ export function extraColorizers() {
     body: fallbackBody,
     // Truecolor background band for fenced code blocks (per-line wrap).
     codeBg: rgbBg(theme.mdCodeBlockBg ?? theme.background),
+    codeSpanBg: rgbBg(theme.mdCodeSpanBg ?? theme.mdCodeBlockBg ?? theme.background),
   };
   return _extra;
 }
@@ -124,12 +126,10 @@ function decodeEntities(s) {
 }
 
 // ── Fenced code block rendering ─────────────────────────────────────────────
-// Compact language label (no ``` fences), two-space-indented wrapped body.
-// Diff/patch languages
-// (and code text that clearly looks like a unified diff) get colored +/-/@@
-// lines; other known languages get a conservative regex highlighter; unknown
-// languages fall back to the flat `mdCodeBlock` body color.
-const CODE_BLOCK_INDENT = '  ';
+// Flush-left wrapped body with per-line background band (no ``` fences / lang row).
+// Diff/patch languages (and bodies that look like unified diffs) keep the diff
+// highlighter; other languages use cli-highlight (highlight.js) themed from our
+// syntax* palette; unknown languages fall back to flat `mdCodeBlock` body color.
 const DIFF_LANGS = new Set(['diff', 'patch', 'udiff', 'git-diff', 'gitdiff']);
 
 /** Wrap text to width, ANSI-aware (lockstep with table-layout hard wrap). */
@@ -167,17 +167,36 @@ function hardWrapAnsiLines(text, width) {
   return out.length > 0 ? out : [''];
 }
 
-/** Wrap one logical code line (ANSI content, no indent) and prefix each segment. */
-function wrapIndentedCodeLine(ansiContent, maxLineWidth) {
-  const indentW = stringWidth(CODE_BLOCK_INDENT);
-  const contentMax = Math.max(1, maxLineWidth - indentW);
-  const segments = hardWrapAnsiLines(ansiContent, contentMax);
-  return segments.map((seg) => `${CODE_BLOCK_INDENT}${seg}`);
+/** Wrap one logical code line (ANSI content) to max visible width. */
+function wrapCodeLine(ansiContent, maxLineWidth) {
+  const contentMax = Math.max(1, maxLineWidth);
+  return hardWrapAnsiLines(ansiContent, contentMax);
 }
 
-/** Tint code lines without padding to terminal width (no trailing bg band). */
-function tintCodeLines(lines, codeBg) {
-  return lines.map((line) => codeBg(line)).join(EOL);
+/** Visible terminal width of an ANSI-colored line (codes excluded). */
+function visibleLineWidth(line) {
+  return stringWidth(stripAnsi(String(line ?? '')));
+}
+
+/** Max visible width across lang label + body lines (content-based, not terminal). */
+function codeBlockContentWidth(langLine, bodyLines) {
+  const all = [...(langLine ? [langLine] : []), ...bodyLines];
+  if (all.length === 0) return 0;
+  return Math.max(1, ...all.map(visibleLineWidth));
+}
+
+/** Apply code-block bg to one line, padded to a shared compact block width. */
+function tintCodeLineToBlockWidth(line, codeBg, blockWidth) {
+  const w = visibleLineWidth(line);
+  const pad = Math.max(0, blockWidth - w);
+  return codeBg(`${line ?? ''}${' '.repeat(pad)}`);
+}
+
+function tintCodeBlockBody(langLine, bodyLines, codeBg) {
+  const blockWidth = codeBlockContentWidth(langLine, bodyLines);
+  const langOut = langLine ? tintCodeLineToBlockWidth(langLine, codeBg, blockWidth) : '';
+  const bodyOut = bodyLines.map((line) => tintCodeLineToBlockWidth(line, codeBg, blockWidth)).join(EOL);
+  return { langOut, bodyOut };
 }
 
 /** Reduce render width by a visible prefix (list marker, blockquote bar, etc.). */
@@ -266,34 +285,60 @@ function colorizeDiffStatTrailer(line, c) {
     .replace(/(\d+)(\s+deletions?\(-\))/g, (_, n, rest) => `${c.diffRemoved(n)}${c.diffContext(rest)}`);
 }
 
-function renderDiffBody(text, c, bandWidth) {
+function collectDiffBodyLines(text, c, bandWidth) {
   const lines = [];
   for (const line of String(text ?? '').split(EOL)) {
     const colored = colorizeDiffLine(line, c);
-    lines.push(...wrapIndentedCodeLine(colored, bandWidth));
+    lines.push(...wrapCodeLine(colored, bandWidth));
   }
-  return tintCodeLines(lines, c.codeBg);
-}
-
-// ── Lightweight syntax highlighting (regex token classes, no parser) ────────
-const KEYWORDS = {
-  js: ['const', 'let', 'var', 'function', 'return', 'if', 'else', 'for', 'while', 'do', 'switch', 'case', 'break', 'continue', 'new', 'class', 'extends', 'super', 'this', 'import', 'export', 'from', 'default', 'async', 'await', 'yield', 'try', 'catch', 'finally', 'throw', 'typeof', 'instanceof', 'in', 'of', 'void', 'delete', 'null', 'undefined', 'true', 'false'],
-  py: ['def', 'class', 'return', 'if', 'elif', 'else', 'for', 'while', 'import', 'from', 'as', 'with', 'try', 'except', 'finally', 'raise', 'pass', 'break', 'continue', 'lambda', 'yield', 'global', 'nonlocal', 'async', 'await', 'and', 'or', 'not', 'in', 'is', 'None', 'True', 'False', 'self'],
-  sh: ['if', 'then', 'else', 'elif', 'fi', 'for', 'while', 'do', 'done', 'case', 'esac', 'function', 'return', 'in', 'export', 'local', 'echo', 'cd', 'set', 'unset', 'read', 'source'],
-  css: [],
-  go: ['package', 'import', 'func', 'return', 'if', 'else', 'for', 'range', 'switch', 'case', 'default', 'break', 'continue', 'fallthrough', 'goto', 'defer', 'go', 'select', 'chan', 'map', 'struct', 'interface', 'type', 'var', 'const', 'nil', 'true', 'false', 'iota', 'string', 'int', 'int64', 'float64', 'bool', 'byte', 'rune', 'error'],
-  rust: ['fn', 'let', 'mut', 'const', 'static', 'return', 'if', 'else', 'match', 'for', 'while', 'loop', 'break', 'continue', 'struct', 'enum', 'trait', 'impl', 'mod', 'use', 'pub', 'crate', 'self', 'super', 'where', 'as', 'dyn', 'move', 'ref', 'unsafe', 'async', 'await', 'type', 'true', 'false', 'Some', 'None', 'Ok', 'Err', 'Box', 'Vec', 'String', 'usize', 'isize', 'i32', 'u32', 'i64', 'u64', 'f64', 'bool'],
-  java: ['public', 'private', 'protected', 'class', 'interface', 'enum', 'extends', 'implements', 'abstract', 'final', 'static', 'void', 'new', 'return', 'if', 'else', 'for', 'while', 'do', 'switch', 'case', 'default', 'break', 'continue', 'try', 'catch', 'finally', 'throw', 'throws', 'import', 'package', 'this', 'super', 'instanceof', 'synchronized', 'volatile', 'transient', 'native', 'int', 'long', 'short', 'byte', 'char', 'float', 'double', 'boolean', 'true', 'false', 'null'],
-  c: ['auto', 'break', 'case', 'char', 'const', 'continue', 'default', 'do', 'double', 'else', 'enum', 'extern', 'float', 'for', 'goto', 'if', 'inline', 'int', 'long', 'register', 'return', 'short', 'signed', 'sizeof', 'static', 'struct', 'switch', 'typedef', 'union', 'unsigned', 'void', 'volatile', 'while', 'class', 'namespace', 'template', 'public', 'private', 'protected', 'virtual', 'new', 'delete', 'using', 'nullptr', 'true', 'false', 'bool'],
-  ruby: ['def', 'end', 'class', 'module', 'if', 'elsif', 'else', 'unless', 'case', 'when', 'then', 'while', 'until', 'for', 'in', 'do', 'begin', 'rescue', 'ensure', 'raise', 'return', 'yield', 'break', 'next', 'redo', 'retry', 'self', 'nil', 'true', 'false', 'and', 'or', 'not', 'require', 'require_relative', 'attr_accessor', 'attr_reader', 'attr_writer', 'puts', 'lambda', 'proc'],
-  sql: ['select', 'from', 'where', 'insert', 'into', 'values', 'update', 'set', 'delete', 'create', 'alter', 'drop', 'table', 'view', 'index', 'join', 'inner', 'left', 'right', 'outer', 'full', 'on', 'group', 'by', 'order', 'having', 'limit', 'offset', 'distinct', 'as', 'and', 'or', 'not', 'null', 'is', 'in', 'between', 'like', 'union', 'all', 'primary', 'key', 'foreign', 'references', 'default', 'constraint', 'unique', 'count', 'sum', 'avg', 'min', 'max'],
-  yaml: [],
-  toml: [],
+  return lines;
+}
+
+// ── cli-highlight (highlight.js) ────────────────────────────────────────────
+/** Internal family → highlight.js language id (when alias alone is insufficient). */
+const FAMILY_TO_HLJS = {
+  js: 'javascript',
+  ts: 'typescript',
+  tsx: 'tsx',
+  jsx: 'jsx',
+  json: 'json',
+  sh: 'bash',
+  py: 'python',
+  css: 'css',
+  html: 'xml',
+  go: 'go',
+  rust: 'rust',
+  java: 'java',
+  c: 'cpp',
+  ruby: 'ruby',
+  sql: 'sql',
+  yaml: 'yaml',
+  toml: 'ini',
+  kotlin: 'kotlin',
+  swift: 'swift',
+  php: 'php',
+  csharp: 'csharp',
+  dockerfile: 'dockerfile',
+  protobuf: 'protobuf',
+  scala: 'scala',
+  dart: 'dart',
+  lua: 'lua',
+  perl: 'perl',
+  r: 'r',
+  objc: 'objectivec',
+  powershell: 'powershell',
+  makefile: 'makefile',
+  nginx: 'nginx',
+  ini: 'ini',
+  vim: 'vim',
+  haskell: 'haskell',
+  elixir: 'elixir',
+  clojure: 'clojure',
 };
 
 export const LANG_FAMILY = {
   js: 'js', javascript: 'js', mjs: 'js', cjs: 'js',
-  ts: 'js', typescript: 'js', jsx: 'js', tsx: 'js',
+  ts: 'ts', typescript: 'ts', jsx: 'jsx', tsx: 'tsx',
   json: 'json', json5: 'json',
   bash: 'sh', sh: 'sh', shell: 'sh', zsh: 'sh',
   python: 'py', py: 'py',
@@ -308,64 +353,187 @@ export const LANG_FAMILY = {
   sql: 'sql',
   yaml: 'yaml', yml: 'yaml',
   toml: 'toml',
+  kotlin: 'kotlin', kt: 'kotlin', kts: 'kotlin',
+  swift: 'swift',
+  php: 'php',
+  csharp: 'csharp', cs: 'csharp', 'c#': 'csharp',
+  dockerfile: 'dockerfile', docker: 'dockerfile',
+  graphql: 'graphql', gql: 'graphql',
+  protobuf: 'protobuf', proto: 'protobuf',
+  scala: 'scala',
+  dart: 'dart',
+  lua: 'lua',
+  perl: 'perl', pl: 'perl',
+  r: 'r', rl: 'r',
+  objc: 'objc', 'objective-c': 'objc', 'obj-c': 'objc',
+  powershell: 'powershell', ps1: 'powershell', ps: 'powershell', pwsh: 'powershell',
+  makefile: 'makefile', make: 'makefile',
+  nginx: 'nginx',
+  ini: 'ini',
+  vim: 'vim',
+  haskell: 'haskell', hs: 'haskell',
+  elixir: 'elixir', ex: 'elixir', exs: 'elixir',
+  clojure: 'clojure', clj: 'clojure',
 };
 
-// Families whose comment lines / inline comments start with `#`.
-const HASH_COMMENT_FAMILIES = new Set(['sh', 'py', 'yaml', 'toml']);
+const HIGHLIGHT_CACHE_MAX = 300;
+const highlightCache = new Map();
 
-/** Highlight a single line for a c-like / scripting family (token scan). */
-export function highlightCodeLine(line, family, c) {
-  const kw = new Set(KEYWORDS[family === 'json' ? 'js' : family] ?? []);
-  // Comment lines (whole-line) for the common families.
-  if (family === 'js' && /^\s*\/\//.test(line)) return c.synComment(line);
-  if (HASH_COMMENT_FAMILIES.has(family) && /^\s*#/.test(line)) return c.synComment(line);
-  if (family === 'html' && /^\s*<!--/.test(line)) return c.synComment(line);
-
-  // Token regex: strings, numbers, comments, identifiers, punctuation.
-  const TOKEN_RE = /(`(?:\\.|[^`\\])*`|"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*')|(\/\/[^\n]*|#[^\n]*)|(\b\d+(?:\.\d+)?\b)|([A-Za-z_$][A-Za-z0-9_$]*)|([{}()[\].,;:=+\-*/%<>!&|^~?]+)/g;
-  let out = '';
-  let last = 0;
-  let m;
-  TOKEN_RE.lastIndex = 0;
-  while ((m = TOKEN_RE.exec(line)) !== null) {
-    if (m.index > last) out += c.body(line.slice(last, m.index));
-    const [, str, comment, num, ident, punct] = m;
-    if (str !== undefined) {
-      out += c.synString(str);
-    } else if (comment !== undefined) {
-      // `#` is only a comment for sh/py; for js treat as body.
-      if (comment.startsWith('//') ? family === 'js' : HASH_COMMENT_FAMILIES.has(family)) {
-        out += c.synComment(comment);
-      } else {
-        out += c.body(comment);
-      }
-    } else if (num !== undefined) {
-      out += c.synNumber(num);
-    } else if (ident !== undefined) {
-      if (kw.has(ident)) out += c.synKeyword(ident);
-      else if (line[TOKEN_RE.lastIndex] === '(') out += c.synFunction(ident);
-      else out += c.body(ident);
-    } else if (punct !== undefined) {
-      out += c.synOperator(punct);
+/** @internal Test-only introspection for highlight LRU cache. */
+export function _highlightCacheSizeForTests() {
+  return highlightCache.size;
+}
+
+let _hljsThemeVersion = -1;
+let _hljsTheme = null;
+
+/** Map highlight.js token classes to chalk truecolor fns from the active theme. */
+function buildCliHighlightTheme(c) {
+  const plain = (s) => c.body(s);
+  return {
+    default: plain,
+    keyword: c.synKeyword,
+    built_in: c.synType,
+    type: c.synType,
+    literal: c.synKeyword,
+    number: c.synNumber,
+    regexp: c.synString,
+    string: c.synString,
+    subst: plain,
+    symbol: plain,
+    class: c.synType,
+    function: c.synFunction,
+    title: c.synFunction,
+    params: c.synVariable,
+    comment: c.synComment,
+    doctag: c.synComment,
+    meta: c.synComment,
+    section: c.synType,
+    tag: c.synPunct,
+    name: c.synFunction,
+    builtin: c.synType,
+    attr: c.synType,
+    attribute: c.synType,
+    variable: c.synVariable,
+    selector: c.synKeyword,
+    template: c.synVariable,
+    bullet: plain,
+    code: plain,
+    emphasis: plain,
+    strong: plain,
+    formula: plain,
+    link: plain,
+    quote: plain,
+    addition: c.synString,
+    deletion: c.synString,
+  };
+}
+
+function getCliHighlightTheme() {
+  const version = getThemeVersion();
+  if (_hljsTheme && _hljsThemeVersion === version) return _hljsTheme;
+  _hljsThemeVersion = version;
+  _hljsTheme = buildCliHighlightTheme(extraColorizers());
+  return _hljsTheme;
+}
+
+function hljsLanguageFromFamily(family) {
+  if (!family || family === 'md') return null;
+  const mapped = FAMILY_TO_HLJS[family];
+  if (mapped && supportsLanguage(mapped)) return mapped;
+  if (supportsLanguage(family)) return family;
+  return null;
+}
+
+/** Resolve a fenced info-string to a highlight.js language id. */
+function resolveHljsLanguage(lang) {
+  const normalized = normalizeLang(lang);
+  if (!normalized) return null;
+  const viaFamily = hljsLanguageFromFamily(LANG_FAMILY[normalized]);
+  if (viaFamily) return viaFamily;
+  return supportsLanguage(normalized) ? normalized : null;
+}
+
+/**
+ * Highlight source with cli-highlight; returns null when language is unsupported
+ * or highlighting fails (caller falls back to flat body color).
+ */
+function highlightCodeText(text, hljsLang) {
+  if (!hljsLang || !supportsLanguage(hljsLang)) return null;
+  const src = String(text ?? '');
+  if (!src.trim()) return null;
+  if (!/[A-Za-z0-9]/.test(src)) return null;
+  const cacheKey = `${hljsLang}|${getThemeVersion()}|${src}`;
+  const cached = highlightCache.get(cacheKey);
+  if (cached !== undefined) {
+    highlightCache.delete(cacheKey);
+    highlightCache.set(cacheKey, cached);
+    return cached;
+  }
+  try {
+    const out = highlight(src, {
+      language: hljsLang,
+      theme: getCliHighlightTheme(),
+      ignoreIllegals: true,
+    });
+    if (highlightCache.size >= HIGHLIGHT_CACHE_MAX) {
+      const first = highlightCache.keys().next().value;
+      if (first !== undefined) highlightCache.delete(first);
     }
-    last = TOKEN_RE.lastIndex;
+    highlightCache.set(cacheKey, out);
+    return out;
+  } catch {
+    return null;
   }
-  if (last < line.length) out += c.body(line.slice(last));
-  return out;
 }
 
-function renderHighlightedBody(text, family, c, bandWidth) {
+/** Highlight a single line (tool expanded output); uses the same theme map. */
+export function highlightCodeLine(line, family, c) {
+  const hljsLang = hljsLanguageFromFamily(family);
+  const highlighted = highlightCodeText(line, hljsLang);
+  if (highlighted != null) return highlighted;
+  return line ? c.body(line) : '';
+}
+
+/**
+ * Highlight a multi-line block in one cli-highlight call; returns one ANSI string per line.
+ * On miss, each line is flat-colored with `c.body`.
+ */
+export function highlightCodeBlockToLines(text, family, c) {
+  const hljsLang = hljsLanguageFromFamily(family);
+  const raw = String(text ?? '');
+  const highlighted = hljsLang ? highlightCodeText(raw, hljsLang) : null;
+  if (highlighted != null) {
+    return highlighted.split(EOL);
+  }
+  return raw.split(EOL).map((line) => (line ? c.body(line) : ''));
+}
+
+function collectFlatBodyLines(text, codeBlock, bandWidth) {
   const lines = [];
   for (const line of String(text ?? '').split(EOL)) {
-    const colored = line ? highlightCodeLine(line, family, c) : '';
-    lines.push(...wrapIndentedCodeLine(colored, bandWidth));
+    const colored = codeBlock(line);
+    lines.push(...wrapCodeLine(colored, bandWidth));
   }
-  return tintCodeLines(lines, c.codeBg);
+  return lines;
+}
+
+function collectHighlightedBodyLines(text, hljsLang, bandWidth) {
+  const highlighted = highlightCodeText(text, hljsLang);
+  const { codeBlock } = colorizers();
+  const source = highlighted != null
+    ? highlighted
+    : String(text ?? '').split(EOL).map(codeBlock).join(EOL);
+  const lines = [];
+  for (const line of source.split(EOL)) {
+    lines.push(...wrapCodeLine(line, bandWidth));
+  }
+  return lines;
 }
 
 /**
- * Render a fenced `code` token: compact language label, wrapped indented body,
- * and language-aware coloring (no visible ``` fence lines).
+ * Render a fenced `code` token: flush-left wrapped body with background band
+ * and language-aware coloring (no visible ``` fence lines or lang label).
  */
 function renderCodeBlock(token, width = 0) {
   const { codeBlock } = colorizers();
@@ -374,30 +542,20 @@ function renderCodeBlock(token, width = 0) {
   const text = decodeEntities(token.text ?? '');
   const bandWidth = Math.max(8, Number(width) || 80);
 
-  let body;
+  let bodyLines;
   if (DIFF_LANGS.has(lang) || (!lang && looksLikeUnifiedDiff(text))) {
-    body = renderDiffBody(text, c, bandWidth);
+    bodyLines = collectDiffBodyLines(text, c, bandWidth);
   } else {
+    const hljsLang = resolveHljsLanguage(lang);
     const family = LANG_FAMILY[lang];
-    // Any known family except markdown-in-markdown routes through the regex
-    // highlighter (html/json/yaml/toml included). 'md' stays flat (no nested
-    // markdown highlighter); unknown langs fall back to the flat body color.
-    if (family && family !== 'md') {
-      body = renderHighlightedBody(text, family, c, bandWidth);
+    if (hljsLang && family !== 'md') {
+      bodyLines = collectHighlightedBodyLines(text, hljsLang, bandWidth);
     } else {
-      // Unknown/plain language: flat code-block body color, still indented.
-      const lines = [];
-      for (const line of text.split(EOL)) {
-        const colored = codeBlock(line);
-        lines.push(...wrapIndentedCodeLine(colored, bandWidth));
-      }
-      body = tintCodeLines(lines, c.codeBg);
+      bodyLines = collectFlatBodyLines(text, codeBlock, bandWidth);
     }
   }
-  const langLine = lang
-    ? `${c.codeBg(c.fenceBorder(lang))}${EOL}`
-    : '';
-  return `${langLine}${body}${body ? EOL : ''}`;
+  const { bodyOut } = tintCodeBlockBody(null, bodyLines, c.codeBg);
+  return `${bodyOut}${bodyOut ? EOL : ''}`;
 }
 
 function numberToLetter(n) {
@@ -455,19 +613,19 @@ export function formatToken(token, listBaseIndent = 0, orderedListNumber = null,
       const inner = (token.tokens ?? []).map((t) => formatToken(t, 0, null, null, innerWidth)).join('');
       return inner
         .split(EOL)
-        .map((line) =>
-          stripAnsi(line).trim()
-            ? `${bar} ${quoteText(chalk.italic(line))}`
-            : line,
-        )
+        .map((line) => {
+          // Padded fenced-code blank rows are space-only; trim() would drop the quote bar.
+          if (stringWidth(stripAnsi(line)) === 0) return line;
+          return `${bar} ${quoteText(chalk.italic(line))}`;
+        })
         .join(EOL);
     }
     case 'code':
-      // Fenced block: compact lang label + wrapped indented, colored body.
+      // Fenced block: flush-left wrapped body with syntax highlighting.
       return renderCodeBlock(token, width);
     case 'codespan':
       // inline code
-      return accent(decodeEntities(token.text));
+      return ex.codeSpanBg(accent(decodeEntities(token.text)));
     case 'em':
       return ex.emph(chalk.italic((token.tokens ?? []).map((t) => formatToken(t, 0, null, parent)).join('')));
     case 'strong':
@@ -598,7 +756,8 @@ function formatListItem(token, listBaseIndent, orderedListNumber, parent, depth
         out += `${markerPrefix.trimEnd()}${EOL}`;
         firstBlock = false;
       }
-      out += formatToken(child, nestedListIndent, null, token, childWidth, depth + 1);
+      // Pass outer `width` so the nested list subtracts only its own marker prefix once.
+      out += formatToken(child, nestedListIndent, null, token, width, depth + 1);
       continue;
     }
 

package/src/tui/markdown/format-token.test.mjs

@@ -3,7 +3,12 @@ import assert from 'node:assert/strict';
 import { marked } from 'marked';
 import stripAnsi from 'strip-ansi';
 import stringWidth from 'string-width';
-import { formatToken } from './format-token.mjs';
+import {
+  formatToken,
+  highlightCodeBlockToLines,
+  extraColorizers,
+  _highlightCacheSizeForTests,
+} from './format-token.mjs';
 import { setThemeSetting, theme } from '../theme.mjs';
 
 setThemeSetting('mixdog', { persist: false });
@@ -18,14 +23,13 @@ function lexFirst(md, type) {
   return tokens.find((t) => t.type === type) ?? tokens[0];
 }
 
-test('fenced code block renders lang label without ``` fences and indented body', () => {
+test('fenced code block has no ``` fences and flush-left body', () => {
   const token = lexFirst('```js\nconst x = 1;\n```\n', 'code');
   const out = formatToken(token);
   const plain = stripAnsi(out);
-  assert.ok(plain.includes('js'), 'language label visible');
   assert.ok(!plain.includes('```'), 'no literal fence markers');
-  assert.ok(plain.includes('  const x = 1;'), 'body is two-space indented');
-  assert.ok(out.includes(rgbSgr(theme.mdCodeBlockBorder)), 'lang label uses border color');
+  assert.ok(plain.includes('const x = 1;'), 'body is flush-left');
+  assert.ok(!plain.trimStart().startsWith('js'), 'no language label row');
 });
 
 test('short code line has no terminal-width trailing padding band', () => {
@@ -33,7 +37,17 @@ test('short code line has no terminal-width trailing padding band', () => {
   const out = formatToken(token, 0, null, null, 60);
   const bodyLine = stripAnsi(out).split('\n').find((l) => l.includes('short'));
   assert.ok(bodyLine, 'body line present');
-  assert.equal(bodyLine, '  short', 'body line is only indent + text');
+  assert.equal(bodyLine, 'short', 'body line is only text');
+});
+
+test('code block body lines share one compact background width', () => {
+  const token = lexFirst('```js\na\n\nlonger line\n```\n', 'code');
+  const out = formatToken(token, 0, null, null, 80);
+  const plainLines = stripAnsi(out).split('\n').filter((l) => l.length > 0);
+  const widths = plainLines.map((l) => stringWidth(l));
+  assert.ok(widths.length >= 3, 'body lines rendered');
+  assert.equal(new Set(widths).size, 1, 'every row uses the same content width');
+  assert.equal(Math.max(...widths), stringWidth('longer line'), 'width follows longest rendered line');
 });
 
 test('long code line wraps within requested body width', () => {
@@ -41,7 +55,7 @@ test('long code line wraps within requested body width', () => {
   const token = lexFirst(`\`\`\`js\n${long}\n\`\`\`\n`, 'code');
   const width = 20;
   const out = formatToken(token, 0, null, null, width);
-  const bodyLines = stripAnsi(out).split('\n').filter((l) => l.startsWith('  '));
+  const bodyLines = stripAnsi(out).split('\n').filter((l) => l.includes('a'));
   assert.ok(bodyLines.length > 1, 'long line is wrapped into multiple rows');
   for (const line of bodyLines) {
     assert.ok(line.length <= width, `wrapped line "${line}" fits width ${width}`);
@@ -83,6 +97,52 @@ test('blockquote fenced code block respects narrowed width and has no fences', (
   }
 });
 
+test('blockquote fenced code with blank line keeps quote prefix on every code row', () => {
+  const codeTok = lexFirst('```js\na\n\nb\n```\n', 'code');
+  const quoteTok = { type: 'blockquote', tokens: [codeTok] };
+  const outerWidth = 40;
+  const out = formatToken(quoteTok, 0, null, null, outerWidth);
+  const plain = stripAnsi(out);
+  assert.ok(!plain.includes('```'), 'no literal fence markers');
+  const bar = '\u258e';
+  const visibleLines = plain.split('\n').filter((l) => stringWidth(l) > 0);
+  assert.ok(visibleLines.length >= 3, 'two body lines + blank padded row');
+  for (const line of visibleLines) {
+    assert.ok(line.startsWith(bar), `quote bar on every visible row: "${line}"`);
+    assert.ok(stringWidth(line) <= outerWidth, `line fits outer width: "${line}"`);
+  }
+  const blankPadded = visibleLines.find((l) => !l.includes('a') && !l.includes('b'));
+  assert.ok(blankPadded, 'background-padded blank code row is rendered');
+  assert.ok(blankPadded.startsWith(bar), 'blank padded code row keeps quote prefix');
+});
+
+test('two-level nested list code block does not double-subtract list prefix width', () => {
+  const long = 'd'.repeat(40);
+  const codeTok = lexFirst(`\`\`\`js\n${long}\n\`\`\`\n`, 'code');
+  const innerList = {
+    type: 'list',
+    ordered: false,
+    items: [{ type: 'list_item', tokens: [codeTok] }],
+  };
+  const outerList = {
+    type: 'list',
+    ordered: false,
+    items: [{ type: 'list_item', tokens: [innerList] }],
+  };
+  const outerWidth = 30;
+  const singleLevelNested = formatToken(innerList, 2, null, null, outerWidth);
+  const twoLevelNested = formatToken(outerList, 0, null, null, outerWidth);
+  const codeLines = (plain) => plain.split('\n').filter((l) => l.includes('d'));
+  const singleLines = codeLines(stripAnsi(singleLevelNested));
+  const nestedLines = codeLines(stripAnsi(twoLevelNested));
+  assert.equal(
+    nestedLines.length,
+    singleLines.length,
+    'nested list code wraps like one-level nested list at the same outer width',
+  );
+  assert.ok(nestedLines.length > 1, 'code is wrapped under narrow width');
+});
+
 test('js highlighting colors keyword, string, number distinctly', () => {
   const token = lexFirst('```js\nconst n = 42;\nlet s = "hi";\n```\n', 'code');
   const out = formatToken(token);
@@ -91,6 +151,42 @@ test('js highlighting colors keyword, string, number distinctly', () => {
   assert.ok(out.includes(rgbSgr(theme.syntaxString)), 'string colored');
 });
 
+test('highlight cache serves repeat block highlight without changing output', () => {
+  const c = extraColorizers();
+  const text = `const cacheProbe_${Date.now()} = 1;\nlet y = 2;\n`;
+  const sizeBefore = _highlightCacheSizeForTests();
+  const first = highlightCodeBlockToLines(text, 'js', c);
+  assert.equal(_highlightCacheSizeForTests(), sizeBefore + 1, 'first highlight populates cache');
+  const second = highlightCodeBlockToLines(text, 'js', c);
+  assert.deepEqual(second, first);
+  assert.equal(_highlightCacheSizeForTests(), sizeBefore + 1, 'cache hit does not grow entries');
+  assert.ok(first[0].includes('38;2;'), 'highlighted ANSI present');
+});
+
+test('inline codespan emits truecolor background band', () => {
+  const tokens = marked.lexer('`hello`');
+  const codespan = tokens[0].tokens[0];
+  assert.equal(codespan.type, 'codespan');
+  const out = formatToken(codespan);
+  assert.ok(out.includes('48;2;'), 'background SGR present');
+  assert.ok(stripAnsi(out).includes('hello'));
+  assert.ok(out.includes(rgbSgr(theme.mdCode)), 'inline code accent');
+});
+
+test('kotlin fence resolves and highlights', () => {
+  const token = lexFirst('```kotlin\nfun main() {}\n```\n', 'code');
+  const out = formatToken(token);
+  assert.ok(out.includes(rgbSgr(theme.syntaxKeyword)) || out.includes(rgbSgr(theme.mdCodeBlock)));
+  assert.ok(stripAnsi(out).includes('fun main'));
+});
+
+test('typescript fence uses typescript highlighter', () => {
+  const token = lexFirst('```ts\nconst x: number = 1;\n```\n', 'code');
+  const out = formatToken(token);
+  assert.ok(out.includes('38;2;'));
+  assert.ok(stripAnsi(out).includes('const x'));
+});
+
 test('diff fenced block colors add/remove/hunk/header separately', () => {
   const diff = [
     '```diff',
@@ -142,7 +238,7 @@ test('unknown language falls back to flat code block color', () => {
   const token = lexFirst('```foobarlang\nsome text\n```\n', 'code');
   const out = formatToken(token);
   assert.ok(out.includes(rgbSgr(theme.mdCodeBlock)), 'flat code-block color used');
-  assert.ok(stripAnsi(out).includes('  some text'), 'body still indented');
+  assert.ok(stripAnsi(out).includes('some text'), 'body is flush-left');
 });
 
 test('inline link emits OSC 8 hyperlink with styled label (URL hidden)', () => {
@@ -200,7 +296,7 @@ test('ordered list markers follow nesting depth (1. / a. / i.)', () => {
 
 test('every palette defines the full extended key set', () => {
   const required = [
-    'mdCodeBlockBorder', 'mdCodeBlockBg', 'mdLink', 'mdLinkText', 'mdStrong', 'mdEmph',
+    'mdCodeBlockBorder', 'mdCodeBlockBg', 'mdCodeSpanBg', 'mdLink', 'mdLinkText', 'mdStrong', 'mdEmph',
     'mdDiffAdded', 'mdDiffRemoved', 'mdDiffHunk', 'mdDiffHeader', 'mdDiffContext',
     'mdDiffAddedBg', 'mdDiffRemovedBg',
     'syntaxComment', 'syntaxKeyword', 'syntaxFunction', 'syntaxVariable',