memd-cli 3.0.2 → 3.1.0

package/.claude/settings.local.json

@@ -14,7 +14,9 @@
       "Bash(MEMD_THEME= pnpm test 2>&1 | tail -20)",
       "Bash(MEMD_THEME= npx vitest run 2>&1)",
       "Bash(node:*)",
-      "Bash(printf:*)"
+      "Bash(printf:*)",
+      "WebFetch(domain:registry.npmjs.org)",
+      "WebFetch(domain:api.github.com)"
     ]
   }
 }

package/CLAUDE.md

@@ -1,4 +1,73 @@
-## how to test
+# memd
 
-- `node main.js test/test1.md`
-- `node main.js test/test2.md`
+Markdown viewer CLI with Mermaid diagram support. Terminal rendering and HTTP serve mode.
+
+## Structure
+
+```
+memd/
+  main.js            # CLI entry point (commander). Terminal render + `serve` sub-command
+  render-shared.js   # HTML rendering: Mermaid SVG conversion, marked HTML output
+  render-utils.js    # Pure helpers: escapeHtml, mixHex, resolveThemeColors
+  render-worker.js   # Worker thread for serve mode (calls renderToHTML)
+  package.json
+  pnpm-lock.yaml
+  .npmrc
+  test/
+    memd.test.js     # vitest tests (CLI, HTML output, serve, TTY, theme)
+    test1.md         # basic markdown + mermaid
+    test2.md         # complex mermaid diagram
+    test3.md         # multiple mermaid blocks (marker ID uniqueness)
+    complex.md       # graph TD with <br>, special chars, edge labels
+    test-br.md       # <br> tag line breaks in mermaid nodes
+    test-cjk.md      # Japanese labels in mermaid
+    test-highlight.md # syntax highlighting test
+    poc_md.ts         # PoC script
+    poc_mermaid.ts    # PoC script
+    pixel.png         # test image for static file serving
+```
+
+## Commands
+
+```bash
+pnpm install          # install dependencies
+pnpm test             # run tests (vitest run --maxConcurrency=20)
+```
+
+## Manual testing
+
+```bash
+node main.js test/test1.md
+node main.js test/test2.md
+node main.js test/complex.md
+node main.js --html test/test1.md          # HTML output to stdout
+node main.js serve --dir test --port 3000  # HTTP serve mode
+```
+
+## Key CLI flags
+
+- `--no-pager` -- disable pager (less)
+- `--no-color` -- strip ANSI escape codes
+- `--ascii` -- ASCII-only diagram rendering
+- `--html` -- output HTML instead of terminal
+- `--theme <name>` -- color theme (default: `nord`)
+- `--width <n>` -- terminal width override
+
+## Environment variables
+
+- `MEMD_THEME` -- default theme (overridden by `--theme` flag)
+- `FORCE_COLOR=3` -- force truecolor ANSI output
+
+## Available themes
+
+nord, dracula, one-dark, github-dark, github-light, solarized-dark, solarized-light,
+catppuccin-mocha, catppuccin-latte, tokyo-night, tokyo-night-storm, tokyo-night-light,
+nord-light, zinc-dark, zinc-light
+
+## Architecture notes
+
+- `main.js` handles both terminal rendering (marked + marked-terminal + shiki) and `serve` sub-command (HTTP server with worker pool)
+- `render-shared.js` converts Mermaid fenced blocks to SVG via `@ktrysmt/beautiful-mermaid`, then renders full HTML with `marked`
+- `render-worker.js` runs `renderToHTML` in a worker thread for non-blocking serve mode
+- `render-utils.js` provides theme color resolution and HTML escaping (shared by main.js and render-shared.js)
+- Serve mode supports: directory listing, ETag/304 caching, gzip, static file serving (images/css), sidebar navigation, `--watch` with SSE live reload, CSP nonce

package/main.js

@@ -2,7 +2,7 @@
 // @ts-nocheck
 import { marked } from 'marked';
 import { markedTerminal } from 'marked-terminal';
-import { renderMermaidASCII, THEMES as MERMAID_THEMES } from 'beautiful-mermaid';
+import { renderMermaidASCII, THEMES as MERMAID_THEMES } from '@ktrysmt/beautiful-mermaid';
 import chalk from 'chalk';
 import { program } from 'commander';
 import { spawn } from 'child_process';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "memd-cli",
-  "version": "3.0.2",
+  "version": "3.1.0",
   "type": "module",
   "main": "main.js",
   "bin": {
@@ -10,7 +10,7 @@
     "test": "vitest run --maxConcurrency=20"
   },
   "dependencies": {
-    "beautiful-mermaid": "^1.1.3",
+    "@ktrysmt/beautiful-mermaid": "^1.1.4",
     "chalk": "^5.6.2",
     "commander": "^14.0.3",
     "marked": "^17.0.4",

package/render-shared.js

@@ -1,6 +1,6 @@
 import crypto from 'node:crypto';
 import { Marked } from 'marked';
-import { renderMermaidSVG } from 'beautiful-mermaid';
+import { renderMermaidSVG } from '@ktrysmt/beautiful-mermaid';
 import { escapeHtml, resolveThemeColors } from './render-utils.js';
 
 export const MERMAID_MODAL_SCRIPT = [

package/test/complex.md

@@ -0,0 +1,21 @@
+
+```mermaid
+  graph TD
+      A["AAA<br>(keita)"] --> C["CCC"]
+      B["BBB<br>(yuriko)"] --> C
+      C --> D["DDDD"]
+      D --> E["EEEE"]
+
+      A1["1 / 2"] --> A
+      A2["3 / 4"] --> A
+      A3["5 / 6"] --> A
+      A4["XXX<br>(YYY ZZZ)"] --> A
+
+      B1["77 77<br>(7 / 7 / 7)"] --> B
+      B2["88-88<br>(99 99)"] --> B
+      B3["111s 222s"] --> B
+
+      D --> F{"F?"}
+      F -->|Yes| G["High level<br>Tr"]
+      F -->|No| H["Dumb Tr<br>S"]
+```

package/test/memd.test.js

@@ -26,7 +26,7 @@ function runSync(args) {
 describe('memd CLI', () => {
   it.concurrent('--version', async () => {
     const output = await run(['-v'])
-    expect(output).toContain('3.0.2')
+    expect(output).toContain('3.1.0')
   })
 
   it.concurrent('--help', async () => {
@@ -122,6 +122,29 @@ describe('memd CLI', () => {
     expect(output).toContain('いいえ')
   })
 
+  it.concurrent('renders complex.md (graph TD with <br> and special chars)', async () => {
+    const output = await run(
+      ['--no-pager', '--no-color', '--width', '80', 'test/complex.md'],
+    )
+    // Node labels with <br> should render as multi-line text
+    expect(output).toContain('AAA')
+    expect(output).toContain('keita')
+    expect(output).toContain('BBB')
+    expect(output).toContain('yuriko')
+    // Leaf nodes
+    expect(output).toContain('1 / 2')
+    expect(output).toContain('XXX')
+    expect(output).toContain('YYY ZZZ')
+    // Decision node and edge labels
+    expect(output).toContain('F?')
+    expect(output).toContain('Yes')
+    expect(output).toContain('No')
+    expect(output).toContain('High level')
+    expect(output).toContain('Dumb Tr')
+    // <br> tags should not appear in rendered output
+    expect(output).not.toMatch(/<br\s*\/?>/)
+  })
+
   it('reads markdown from stdin via shell', () => {
     const output = execSync(
       `echo '# stdin test' | node ${MAIN} --no-pager --no-color`,