@helping-ai-workflow/md2doc 3.16.1 → 3.17.1

package/lib/editor/code-edit.js

@@ -0,0 +1,184 @@
+'use strict';
+/* UMD, same shape as convert-md.js: `require`-able in node for the unit tests
+   (test/code-edit.test.js), and injected into the editor page as
+   `window.md2docCodeEdit` (lib/editor/server.js). Interpolated raw into a
+   <script> tag, so it must never contain a closing script tag. */
+(function (root, factory) {
+  if (typeof module === 'object' && module.exports) module.exports = factory();
+  else root.md2docCodeEdit = factory();
+})(typeof self !== 'undefined' ? self : this, function () {
+
+// v3.17.0 T1: the pure core of the in-place code editor (decisions D3, D7,
+// D10). No DOM, no editor state.
+
+// D7: the languages the highlighter registers (lib/highlight.js LANGS, same
+// order), each with its display name and every alias that resolves to it —
+// highlight.js's own built-in aliases plus the two custom lists. A unit row
+// keeps this table equal to the server's.
+const CODE_LANGS = [
+  { id: 'verilog', label: 'Verilog', aliases: ['v', 'sv', 'svh', 'systemverilog'] },
+  { id: 'python', label: 'Python', aliases: ['py', 'gyp', 'ipython'] },
+  { id: 'bash', label: 'Bash', aliases: ['sh', 'zsh', 'shell'] },
+  { id: 'c', label: 'C', aliases: ['h'] },
+  { id: 'cpp', label: 'C++', aliases: ['cc', 'c++', 'h++', 'hpp', 'hh', 'hxx', 'cxx'] },
+  { id: 'json', label: 'JSON', aliases: ['jsonc'] },
+  { id: 'yaml', label: 'YAML', aliases: ['yml'] },
+  { id: 'tcl', label: 'Tcl', aliases: ['tk'] },
+  { id: 'makefile', label: 'Makefile', aliases: ['mk', 'mak', 'make'] },
+  { id: 'javascript', label: 'JavaScript', aliases: ['js', 'jsx', 'mjs', 'cjs'] },
+  { id: 'diff', label: 'Diff', aliases: ['patch'] },
+  { id: '', label: '純文字', aliases: ['plaintext', 'text', 'txt'] },
+];
+
+function firstWord(info) {
+  return String(info || '').trim().split(/\s+/)[0] || '';
+}
+
+// The chip's text for a fence info string: the first word's language name,
+// aliases resolved; empty is 純文字; an unknown word is shown as written.
+function langLabel(info) {
+  const word = firstWord(info);
+  if (!word) return '純文字';
+  const w = word.toLowerCase();
+  for (const l of CODE_LANGS) {
+    if ((l.id && l.id === w) || l.aliases.indexOf(w) !== -1) return l.label;
+  }
+  return word;
+}
+
+// The language menu's filter: case-insensitive prefix on id, label or alias.
+function filterLangs(query) {
+  const q = String(query || '').trim().toLowerCase();
+  if (!q) return CODE_LANGS.slice();
+  return CODE_LANGS.filter((l) =>
+    (l.id && l.id.indexOf(q) === 0) || l.label.toLowerCase().indexOf(q) === 0 ||
+    l.aliases.some((a) => a.indexOf(q) === 0));
+}
+
+// Replace the info string's first word; '' removes it. The other words are
+// kept, single-spaced.
+function setFenceLang(info, lang) {
+  const words = String(info || '').trim().split(/\s+/).filter(Boolean);
+  const rest = words.slice(1);
+  return (lang ? [lang].concat(rest) : rest).join(' ');
+}
+
+// blockLines[0] must open a fence (up to 3 spaces, then 3+ backticks or
+// tildes). CommonMark: a backtick fence's info string may not hold a backtick
+// (that line is inline code). Body lines are returned raw (indentation
+// included); the closer is the first line of 0-3 spaces + the same char at
+// least `open` times + nothing else. No closer: the block runs to the end.
+function parseFence(blockLines) {
+  if (!blockLines || !blockLines.length) return null;
+  const m = /^( {0,3})(`{3,}|~{3,})(.*)$/.exec(blockLines[0]);
+  if (!m) return null;
+  const char = m[2][0];
+  const info = m[3].trim();
+  if (char === '`' && info.indexOf('`') !== -1) return null;
+  const open = m[2].length;
+  const closer = new RegExp('^ {0,3}' + (char === '`' ? '`' : '~') + '{' + open + ',}[ \\t]*$');
+  const body = [];
+  let closed = false;
+  for (let i = 1; i < blockLines.length; i++) {
+    if (closer.test(blockLines[i])) { closed = true; break; }
+    body.push(blockLines[i]);
+  }
+  return { indent: m[1], char, open, info, body, closed };
+}
+
+// D10: n = max(3, the opening length, the longest run of the fence char
+// anywhere in the body + 1). The body is written as given.
+function buildFence(f) {
+  let longest = 0;
+  const re = f.char === '~' ? /~+/g : /`+/g;
+  for (const line of f.body) {
+    let r;
+    re.lastIndex = 0;
+    while ((r = re.exec(line))) if (r[0].length > longest) longest = r[0].length;
+  }
+  const n = Math.max(3, f.open || 3, longest + 1);
+  const bar = f.indent + f.char.repeat(n);
+  return [bar + f.info].concat(f.body, [bar]);
+}
+
+// D3 Enter: a newline plus the current line's leading whitespace (only as far
+// as the caret when the caret sits inside the indentation).
+function newlineWithIndent(text, pos) {
+  const lineStart = text.lastIndexOf('\n', pos - 1) + 1;
+  const ws = /^[ \t]*/.exec(text.slice(lineStart))[0];
+  const indent = ws.slice(0, Math.max(0, Math.min(ws.length, pos - lineStart)));
+  return { text: text.slice(0, pos) + '\n' + indent + text.slice(pos), caret: pos + 1 + indent.length };
+}
+
+// D3 Tab / Shift+Tab over a selection (R42). Touched lines are those that
+// intersect [selStart, selEnd]; when the selection is not collapsed and its
+// end sits at column 0 of a line, that line is not touched. Indent adds two
+// spaces; dedent removes up to two leading spaces. A position on a touched
+// line keeps its column relative to the line's text (indent: a column-0
+// position moves with the text, unlike VS Code; dedent: clamps at the line
+// start); positions on other lines just follow the text.
+function indentLines(text, selStart, selEnd, dedent) {
+  const lines = text.split('\n');
+  const starts = [];
+  let off = 0;
+  for (const l of lines) { starts.push(off); off += l.length + 1; }
+  const touched = lines.map((l, i) => {
+    const s = starts[i], e = s + l.length;
+    if (!(s <= selEnd && e >= selStart)) return false;
+    if (selEnd > selStart && s === selEnd) return false;
+    return true;
+  });
+  const delta = lines.map((l, i) => {
+    if (!touched[i]) return 0;
+    if (!dedent) return 2;
+    const lead = /^ */.exec(l)[0].length;
+    return -Math.min(2, lead);
+  });
+  const newStarts = [];
+  let n = 0;
+  for (let i = 0; i < lines.length; i++) { newStarts.push(n); n += lines[i].length + delta[i] + 1; }
+  const out = lines.map((l, i) => (delta[i] > 0 ? '  ' + l : delta[i] < 0 ? l.slice(-delta[i]) : l));
+  function map(pos) {
+    let i = lines.length - 1;
+    while (i > 0 && starts[i] > pos) i--;
+    const col = pos - starts[i];
+    return newStarts[i] + (delta[i] < 0 ? Math.max(0, col + delta[i]) : col + delta[i]);
+  }
+  return { text: out.join('\n'), selStart: map(selStart), selEnd: map(selEnd) };
+}
+
+// The edit's own undo stack (native undo dies when re-colouring replaces the
+// innerHTML). Snap = { text, selStart, selEnd }. A push whose text equals the
+// current one is not a step; a push drops the redo tail; the stack keeps the
+// last `cap` snapshots.
+class TextHistory {
+  constructor(initial, cap) {
+    this.cap = cap || 200;
+    this.stack = [initial];
+    this.i = 0;
+  }
+  push(snap) {
+    if (snap.text === this.stack[this.i].text) {
+      this.stack[this.i] = snap;
+      return;
+    }
+    this.stack.length = this.i + 1;
+    this.stack.push(snap);
+    if (this.stack.length > this.cap) this.stack.shift();
+    this.i = this.stack.length - 1;
+  }
+  undo() {
+    if (this.i <= 0) return null;
+    this.i--;
+    return this.stack[this.i];
+  }
+  redo() {
+    if (this.i >= this.stack.length - 1) return null;
+    this.i++;
+    return this.stack[this.i];
+  }
+}
+
+return { CODE_LANGS, langLabel, filterLangs, parseFence, buildFence, setFenceLang,
+  newlineWithIndent, indentLines, TextHistory };
+});

package/lib/editor/icons.js

@@ -11,8 +11,10 @@ const BODY = {
   "arrow-up-to-line": "<path d=\"M5 3h14\" /><path d=\"m18 13-6-6-6 6\" /><path d=\"M12 7v14\" />",
   "bold": "<path d=\"M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8\" />",
   "check": "<path d=\"M20 6 9 17l-5-5\" />",
+  "chevron-down": "<path d=\"m6 9 6 6 6-6\" />",
   "circle-alert": "<circle cx=\"12\" cy=\"12\" r=\"10\" /><line x1=\"12\" x2=\"12\" y1=\"8\" y2=\"12\" /><line x1=\"12\" x2=\"12.01\" y1=\"16\" y2=\"16\" />",
   "code": "<polyline points=\"16 18 22 12 16 6\" /><polyline points=\"8 6 2 12 8 18\" />",
+  "copy": "<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\" /><path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\" />",
   "grip-vertical": "<circle cx=\"9\" cy=\"12\" r=\"1\" /><circle cx=\"9\" cy=\"5\" r=\"1\" /><circle cx=\"9\" cy=\"19\" r=\"1\" /><circle cx=\"15\" cy=\"12\" r=\"1\" /><circle cx=\"15\" cy=\"5\" r=\"1\" /><circle cx=\"15\" cy=\"19\" r=\"1\" />",
   "heading": "<path d=\"M6 12h12\" /><path d=\"M6 20V4\" /><path d=\"M18 20V4\" />",
   "image": "<rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" ry=\"2\" /><circle cx=\"9\" cy=\"9\" r=\"2\" /><path d=\"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\" />",
@@ -26,6 +28,7 @@ const BODY = {
   "list-ordered": "<path d=\"M10 12h11\" /><path d=\"M10 18h11\" /><path d=\"M10 6h11\" /><path d=\"M4 10h2\" /><path d=\"M4 6h1v4\" /><path d=\"M6 18H4c0-1 2-2 2-3s-1-1.5-2-1\" />",
   "minus": "<path d=\"M5 12h14\" />",
   "panel-left": "<rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" /><path d=\"M9 3v18\" />",
+  "pencil": "<path d=\"M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z\" /><path d=\"m15 5 4 4\" />",
   "plus": "<path d=\"M5 12h14\" /><path d=\"M12 5v14\" />",
   "quote": "<path d=\"M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z\" /><path d=\"M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z\" />",
   "redo-2": "<path d=\"m15 14 5-5-5-5\" /><path d=\"M20 9H9.5A5.5 5.5 0 0 0 4 14.5A5.5 5.5 0 0 0 9.5 20H13\" />",

package/lib/editor/inline-md.js

@@ -442,5 +442,109 @@
     return /^https?:\/\/\S+$/.test(String(text == null ? '' : text).trim());
   }
 
-  return { serializeInline, canWysiwyg, escapeText, escapeBlockStarts, normalizeHref, isPastedUrl };
+  // ── v3.17.0 T7 (D17): the image paragraph ───────────────────────────────
+  // A paragraph that is one `![alt](dest "title")` and nothing else. scanImage
+  // finds the three spans a rewrite may touch (the alt between the brackets,
+  // the destination, everything else is left byte-for-byte): the title with
+  // its quote style and the whitespace around it, the leading and trailing
+  // whitespace of the line. A linked image, a reference image (`![a][r]`),
+  // text around the image or a second image is not one.
+  function scanImage(text) {
+    const s = String(text == null ? '' : text);
+    const m = /^[ \t]*!\[/.exec(s);
+    if (!m) return null;
+    let i = m[0].length;
+    const altStart = i;
+    let depth = 0;
+    for (; i < s.length; i++) {
+      const c = s[i];
+      if (c === '\\') { i++; continue; }
+      if (c === '\n') return null;
+      if (c === '[') depth++;
+      else if (c === ']') { if (depth === 0) break; depth--; }
+    }
+    if (i >= s.length || s[i] !== ']') return null;
+    const altEnd = i;
+    i++;
+    if (s[i] !== '(') return null;
+    i++;
+    while (i < s.length && (s[i] === ' ' || s[i] === '\t')) i++;
+    const destStart = i;
+    let angle = false;
+    let destEnd;
+    if (s[i] === '<') {
+      angle = true;
+      i++;
+      for (; i < s.length; i++) {
+        const c = s[i];
+        if (c === '\\') { i++; continue; }
+        if (c === '\n' || c === '<') return null;
+        if (c === '>') break;
+      }
+      if (i >= s.length) return null;
+      destEnd = i + 1;
+      i = destEnd;
+    } else {
+      let parens = 0;
+      for (; i < s.length; i++) {
+        const c = s[i];
+        if (c === '\\') { i++; continue; }
+        if (c === ' ' || c === '\t' || c === '\n') break;
+        if (c === '(') parens++;
+        else if (c === ')') { if (parens === 0) break; parens--; }
+      }
+      if (parens !== 0) return null;
+      destEnd = i;
+    }
+    let j = i;
+    while (j < s.length && (s[j] === ' ' || s[j] === '\t')) j++;
+    let title = null;
+    if (j > i && j < s.length && (s[j] === '"' || s[j] === "'" || s[j] === '(')) {
+      const close = s[j] === '(' ? ')' : s[j];
+      let k = j + 1;
+      for (; k < s.length; k++) {
+        if (s[k] === '\\') { k++; continue; }
+        if (s[k] === close) break;
+      }
+      if (k >= s.length) return null;
+      title = s.slice(j, k + 1);
+      j = k + 1;
+      while (j < s.length && (s[j] === ' ' || s[j] === '\t')) j++;
+    }
+    if (s[j] !== ')') return null;
+    const tail = s.slice(j + 1);
+    if (!/^[ \t]*$/.test(tail)) return null;
+    return { s, altStart, altEnd, destStart, destEnd, angle, title };
+  }
+
+  function parseImageParagraph(text) {
+    const f = scanImage(text);
+    if (!f) return null;
+    const rawAlt = f.s.slice(f.altStart, f.altEnd);
+    const rawDest = f.s.slice(f.destStart, f.destEnd);
+    return {
+      alt: rawAlt.replace(/\\([!-\/:-@\[-`{-~])/g, '$1'),
+      dest: f.angle ? rawDest.slice(1, -1) : rawDest,
+      title: f.title,
+      angle: f.angle,
+    };
+  }
+
+  // Alt and/or destination replaced, everything else kept. `alt` is plain text
+  // (the three characters that would end or bend the brackets gain a
+  // backslash); `dest` is written as given, so the caller makes it
+  // markdown-ready — an angle-bracketed original loses its brackets.
+  function rewriteImage(text, patch) {
+    const f = scanImage(text);
+    if (!f) return String(text == null ? '' : text);
+    const p = patch || {};
+    let out = f.s.slice(0, f.altStart);
+    out += typeof p.alt === 'string' ? p.alt.replace(/[\\\[\]]/g, '\\$&') : f.s.slice(f.altStart, f.altEnd);
+    out += f.s.slice(f.altEnd, f.destStart);
+    out += typeof p.dest === 'string' ? p.dest : f.s.slice(f.destStart, f.destEnd);
+    out += f.s.slice(f.destEnd);
+    return out;
+  }
+
+  return { serializeInline, canWysiwyg, escapeText, escapeBlockStarts, normalizeHref, isPastedUrl, parseImageParagraph, rewriteImage };
 });

package/lib/editor/server.js

@@ -4,7 +4,7 @@ const path = require('path');
 const http = require('http');
 const crypto = require('crypto');
 const drawioLib = require('../drawio.js');
-const { renderMarkdown, buildKatexStyleTag, diagramEnginePaths } = require('../md2doc.js');
+const { renderMarkdown, buildKatexStyleTag, diagramEnginePaths, renderDotSvg } = require('../md2doc.js');
 
 const LINEOPS_SRC = fs.readFileSync(path.join(__dirname, 'lineops.js'), 'utf8');
 const INLINE_MD_SRC = fs.readFileSync(path.join(__dirname, 'inline-md.js'), 'utf8');
@@ -29,6 +29,10 @@ const CONVERT_MD_SRC = fs.readFileSync(path.join(__dirname, 'convert-md.js'), 'u
 // skeletons). Pure, no dependency on any other editor module; it only has to
 // land before client.js reads window.md2docBlockCatalog.
 const BLOCK_CATALOG_SRC = fs.readFileSync(path.join(__dirname, 'block-catalog.js'), 'utf8');
+// v3.17.0 T1: the pure core of the in-place code editor (fence parse/build,
+// language list, Enter/Tab/Shift+Tab text edits, the edit's own undo history).
+// No dependency on any other editor module; lands right after block-catalog.
+const CODE_EDIT_SRC = fs.readFileSync(path.join(__dirname, 'code-edit.js'), 'utf8');
 // v3.2.0: the pure string-diff module behind incremental DOM patching —
 // stripBlockId()/patchmap() compare oldParts[i] against newParts[j] with only
 // data-block-id normalized (see the global constraint on that). Same "no
@@ -218,6 +222,9 @@ function diagramLibBody(name) {
     const close = tag.lastIndexOf('</style>');
     return { type: 'text/css; charset=utf-8', body: tag.slice(open, close) };
   }
+  if (name === 'highlight.js') {
+    return { type: 'application/javascript; charset=utf-8', body: require('../highlight.js').browserBundle() };
+  }
   return null;
 }
 
@@ -699,7 +706,7 @@ async function createEditorServer({
       // all: any page the user happens to be browsing while `md2doc --edit`
       // is running could fire a cross-site "simple" POST at every candidate
       // localhost port and write to disk.
-      const STATE_CHANGING_POST_PATHS = new Set(['/api/render', '/api/save', '/api/ping', '/api/asset']);
+      const STATE_CHANGING_POST_PATHS = new Set(['/api/render', '/api/save', '/api/ping', '/api/asset', '/api/preview']);
       if (req.method === 'POST' && STATE_CHANGING_POST_PATHS.has(url.pathname)) {
         const contentType = String(req.headers['content-type'] || '');
         if (!/^application\/json\b/i.test(contentType)) {
@@ -768,6 +775,7 @@ async function createEditorServer({
           `<script>${INDENT_CLAMP_SRC}</script>\n` +
           `<script>${CONVERT_MD_SRC}</script>\n` +
           `<script>${BLOCK_CATALOG_SRC}</script>\n` +
+          `<script>${CODE_EDIT_SRC}</script>\n` +
           `<script>${PATCHMAP_SRC}</script>\n` +
           `<script>${SELECTION_SRC}</script>\n` +
           `<script>${CELL_RANGE_SRC}</script>\n` +
@@ -826,6 +834,26 @@ async function createEditorServer({
         return send(res, 200, { parts, blocks });
       }
 
+      // v3.17.0 (D11, R31): the stateless Graphviz preview for the diagram
+      // panel. Deliberately NOT /api/render: that route re-reads the document
+      // and records its draw.io references for the staleness heartbeat; a
+      // preview of an unsaved dot source must touch neither.
+      if (req.method === 'POST' && url.pathname === '/api/preview') {
+        const body = await readJson(req, 1024 * 1024);
+        const fileId = body ? body.fileId : undefined;
+        if (!Number.isInteger(fileId) || fileId < 0 || fileId >= absFiles.length) {
+          return send(res, 400, { error: 'fileId must be an index into the open file list' });
+        }
+        if (body.lang !== 'dot') return send(res, 400, { error: 'lang must be dot' });
+        if (typeof body.source !== 'string') return send(res, 400, { error: 'source must be a string' });
+        try {
+          return send(res, 200, { svg: await renderDotSvg(body.source) });
+        } catch (e) {
+          const first = String((e && e.message) || e).split('\n')[0];
+          return send(res, 422, { error: first });
+        }
+      }
+
       if (req.method === 'POST' && url.pathname === '/api/save') {
         const { fileId, content, baseMtimeMs } = await readJson(req);
         const file = absFiles[fileId];

package/lib/editor/wave-codec.js

@@ -2503,9 +2503,11 @@ function sameLane(a, b) {
  * Paint one cycle of one lane, addressed by display index.
  *
  * `ch` is a single character: a level, a value character, `|` for a gap, or `.`
- * to make the cycle continue the one in front of it. Anything else — a longer
- * string, a cycle outside the lane, a `.` or `|` at cycle 0 where there is
- * nothing to continue or to draw over — answers the doc unchanged.
+ * to make the cycle continue the one in front of it. A cycle past the lane's
+ * end grows the lane first, continuing its last level up to that cycle (see
+ * `paint`). Anything else — a longer string, a negative or fractional cycle, a
+ * `.` or `|` at cycle 0 where there is nothing to continue or to draw over —
+ * answers the doc unchanged.
  *
  * A newly painted value cell keeps the label of the value cell it replaced and
  * otherwise starts blank; a cell painted with something that is not a value
@@ -2542,12 +2544,20 @@ function paint(doc, laneIndex, from, to, ch, asRun) {
       lo = hi;
       hi = swap;
     }
-    if (!isIndex(lo, n) || !isIndex(hi, n)) return null;
+    if (lo < 0) return null;
     // A repeater at cycle 0 has nothing to repeat, and the engine answers that
     // by drawing the run and the cycle after it as x. Refusing is the honest
     // reply to a brush that cannot mean anything where it was aimed.
     if (lo === 0 && (ch === HELD_CHAR || ch === GAP_CHAR)) return null;
-    const anchored = anchorAfter(model.cells, hi);
+    // Past the lane's end: continue its last level up to `hi` first, then
+    // paint. A lane shorter than the diagram is ordinary (新增訊號 writes one
+    // cycle, hand-written lanes differ in length) and the editor's grid is as
+    // wide as the whole diagram, so `geometry.cellAt` hands out these cells on
+    // purpose; refusing them here left every click past a short lane's end
+    // silently doing nothing. How far past is bounded by the caller (the
+    // grid), not here.
+    const grown = hi < n ? model.cells : model.cells.concat(fillerCells(model.cells, n, hi + 1 - n));
+    const anchored = anchorAfter(grown, hi);
     const before = resolveCells(anchored);
     const heldLevel = lo > 0 ? before.levels[lo - 1] : '';
     const cells = anchored.slice();

package/lib/editor/wave-ui.js

@@ -1690,6 +1690,14 @@
       if (added) notify('notice', lead + where);
       return added;
     }
+    /** The lane 新增訊號 writes: `x` across the whole diagram, not one cycle
+     *  of it. A one-cycle lane draws a single x and then nothing, which read
+     *  as a broken signal (user report 2026-10-28), and every cycle after it
+     *  had to be grown by painting before it showed anything. */
+    function newSignalLane() {
+      const cycles = layoutNow().cycles;
+      return { name: '', wave: 'x' + '.'.repeat(Math.max(0, cycles - 1)) };
+    }
     function addLaneFromToolbar(name, lane) {
       addLaneAt(signalInsertAt(), name, lane);
     }
@@ -1705,7 +1713,7 @@
       const el = panels.menu('ed-wave-signal-pop', [
         { key: 'ed-wave-signal-add', label: '新增訊號',
           title: '在選取的 lane 後面加一條（沒有選取就加在最前面）—— 會落在' + where,
-          run: function () { closePopover(true); addLaneFromToolbar('add-lane', { name: '', wave: 'x' }); } },
+          run: function () { closePopover(true); addLaneFromToolbar('add-lane', newSignalLane()); } },
         { key: 'ed-wave-signal-blank', label: '新增空白列',
           title: '在選取的 lane 後面插入一個空白列（WaveJSON 的 {}，用來空出間距）—— 會落在' + where,
           run: function () { closePopover(true); addLaneFromToolbar('add-spacer', {}); } },
@@ -1950,7 +1958,7 @@
         const row = layoutNow().lanes[i];
         const actions = {
           copy: picked(function () { duplicateLaneAt(i); }),
-          addBelow: picked(function () { addLaneAt(i + 1, 'add-lane', { name: '', wave: 'x' }); }),
+          addBelow: picked(function () { addLaneAt(i + 1, 'add-lane', newSignalLane()); }),
           blankBelow: picked(function () { addLaneAt(i + 1, 'add-spacer', {}); }),
           up: picked(function () { moveLaneBy(i, -1); }),
           down: picked(function () { moveLaneBy(i, 1); }),
@@ -2473,7 +2481,7 @@
     // signal at the end — the one insert position the ⠿ menus (which add
     // BELOW a row) and 訊號 (after the selection) do not make obvious.
     panels.toolButton('ed-wave-add-lane', '＋ 新增訊號', '在最後面加一條訊號', function () {
-      addLaneAt(layoutNow().lanes.length, 'add-lane', { name: '', wave: 'x' });
+      addLaneAt(layoutNow().lanes.length, 'add-lane', newSignalLane());
     }, stage);
     // One canvas per editor session (spec §3.2); `close()` destroys it.
     engineCanvas = opts.canvas.createCanvas({

package/lib/highlight.js

@@ -5,7 +5,7 @@
 // text rather than guessing.
 const hljs = require('highlight.js/lib/core');
 
-const LANGS = {
+const LANG_DEFS = {
   verilog: require('highlight.js/lib/languages/verilog'),
   python: require('highlight.js/lib/languages/python'),
   bash: require('highlight.js/lib/languages/bash'),
@@ -19,9 +19,16 @@ const LANGS = {
   diff: require('highlight.js/lib/languages/diff'),
   plaintext: require('highlight.js/lib/languages/plaintext'),
 };
-for (const [name, def] of Object.entries(LANGS)) hljs.registerLanguage(name, def);
-hljs.registerAliases(['systemverilog', 'sv', 'v'], { languageName: 'verilog' });
-hljs.registerAliases(['sh', 'shell', 'zsh'], { languageName: 'bash' });
+for (const [name, def] of Object.entries(LANG_DEFS)) hljs.registerLanguage(name, def);
+// The two custom alias lists, flat: alias -> language. Registered below and
+// replayed verbatim by browserBundle().
+const ALIASES = {};
+for (const [target, list] of [['verilog', ['systemverilog', 'sv', 'v']], ['bash', ['sh', 'shell', 'zsh']]]) {
+  hljs.registerAliases(list, { languageName: target });
+  for (const a of list) ALIASES[a] = target;
+}
+// The registered ids, in registration order (the editor's language menu).
+const LANGS = Object.keys(LANG_DEFS);
 
 // `lang` is the fence's info string; only its first word names the language,
 // case-insensitively. Returns escaped, coloured HTML, or null when the
@@ -32,4 +39,38 @@ function highlightCode(code, lang) {
   return hljs.highlight(code, { language: name, ignoreIllegals: true }).value;
 }
 
-module.exports = { highlightCode };
+// v3.17.0 D6: the same highlighter as one script for the edit page, served on
+// demand at /api/lib/highlight.js. highlight.js core and each registered
+// language wrapped in a CommonJS shim, then the same registration and the same
+// highlightCode semantics. No closing script tag may appear in it (the page
+// loads it as a script; a test guards that). Built once.
+let bundle = null;
+function browserBundle() {
+  if (bundle !== null) return bundle;
+  const fs = require('fs');
+  const wrap = (file) => '(function () { var module = { exports: {} }; var exports = module.exports;\n' +
+    fs.readFileSync(require.resolve(file), 'utf8') + '\nreturn module.exports; })()';
+  const parts = [
+    '(function () {',
+    'var hljs = ' + wrap('highlight.js/lib/core') + ';',
+    'var defs = {',
+    LANGS.map((n) => JSON.stringify(n) + ': ' + wrap('highlight.js/lib/languages/' + n)).join(',\n'),
+    '};',
+    'var LANGS = ' + JSON.stringify(LANGS) + ';',
+    'var ALIASES = ' + JSON.stringify(ALIASES) + ';',
+    'LANGS.forEach(function (n) { hljs.registerLanguage(n, defs[n]); });',
+    'Object.keys(ALIASES).forEach(function (a) { hljs.registerAliases([a], { languageName: ALIASES[a] }); });',
+    'function highlightCode(code, lang) {',
+    "  var name = String(lang || '').trim().split(/\\s+/)[0].toLowerCase();",
+    '  if (!name || !hljs.getLanguage(name)) return null;',
+    "  return hljs.highlight(code, { language: name, ignoreIllegals: true }).value;",
+    '}',
+    "var root = typeof window !== 'undefined' ? window : self;",
+    'root.md2docHljs = { highlightCode: highlightCode, LANGS: LANGS };',
+    '})();',
+  ];
+  bundle = parts.join('\n');
+  return bundle;
+}
+
+module.exports = { highlightCode, LANGS, ALIASES, browserBundle };