@latentic/live-markdown 0.3.1 → 0.4.0

package/dist/codemirror/math/mathPlugin.js

@@ -0,0 +1,73 @@
+import "../../chunk-V6TY7KAL.js";
+import { StateField } from "@codemirror/state";
+import { Decoration, EditorView } from "@codemirror/view";
+import { docTree, inCode } from "../core/codeContext.js";
+import { MathWidget } from "./mathWidget.js";
+const INLINE_MATH_RE = /(?<![\\$])\$(?!\s)([^\n$]+?)(?<!\s)\$(?!\d)/g;
+function computeDecorations(state) {
+  const marks = [];
+  const atomic = [];
+  const doc = state.doc;
+  const totalLines = doc.lines;
+  const tree = docTree(state);
+  const blockMarkAt = (num) => {
+    const line = doc.line(num);
+    return line.text.trim() === "$$" && !inCode(tree, line.from + line.text.indexOf("$"));
+  };
+  let lineNum = 1;
+  while (lineNum <= totalLines) {
+    const line = doc.line(lineNum);
+    const text = line.text;
+    const single = text.match(/^\$\$(.+)\$\$\s*$/);
+    if (single && !inCode(tree, line.from)) {
+      const replace = Decoration.replace({ widget: new MathWidget(single[1], true) });
+      marks.push(replace.range(line.from, line.to));
+      atomic.push(replace.range(line.from, line.to));
+      lineNum += 1;
+      continue;
+    }
+    if (blockMarkAt(lineNum)) {
+      let close = lineNum + 1;
+      while (close <= totalLines && !blockMarkAt(close)) {
+        close += 1;
+      }
+      if (close <= totalLines) {
+        const closeLine = doc.line(close);
+        const tex = doc.sliceString(line.to, closeLine.from).trim();
+        const replace = Decoration.replace({ widget: new MathWidget(tex, true), block: true });
+        marks.push(replace.range(line.from, closeLine.to));
+        atomic.push(replace.range(line.from, closeLine.to));
+        lineNum = close + 1;
+        continue;
+      }
+    }
+    INLINE_MATH_RE.lastIndex = 0;
+    let m;
+    while ((m = INLINE_MATH_RE.exec(text)) !== null) {
+      const matchStart = line.from + m.index;
+      const matchEnd = matchStart + m[0].length;
+      if (inCode(tree, matchStart) || inCode(tree, matchEnd - 1)) continue;
+      const replace = Decoration.replace({ widget: new MathWidget(m[1], false) });
+      marks.push(replace.range(matchStart, matchEnd));
+      atomic.push(replace.range(matchStart, matchEnd));
+    }
+    lineNum += 1;
+  }
+  return {
+    decorations: Decoration.set(marks, true),
+    atomic: Decoration.set(atomic, true)
+  };
+}
+const mathPlugin = StateField.define({
+  create: (state) => computeDecorations(state),
+  update: (value, tr) => tr.docChanged ? computeDecorations(tr.state) : value,
+  provide: (field) => [
+    EditorView.decorations.from(field, (value) => value.decorations),
+    EditorView.atomicRanges.of((view) => view.state.field(field, false)?.atomic ?? Decoration.none)
+  ]
+});
+export {
+  INLINE_MATH_RE,
+  mathPlugin
+};
+//# sourceMappingURL=mathPlugin.js.map

package/dist/codemirror/math/mathPlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/codemirror/math/mathPlugin.ts"],"sourcesContent":["import { type EditorState, type Range, StateField } from \"@codemirror/state\";\nimport { Decoration, type DecorationSet, EditorView } from \"@codemirror/view\";\n\nimport { docTree, inCode } from \"../core/codeContext\";\nimport { MathWidget } from \"./mathWidget\";\n\nexport const INLINE_MATH_RE = /(?<![\\\\$])\\$(?!\\s)([^\\n$]+?)(?<!\\s)\\$(?!\\d)/g;\n\nfunction computeDecorations(state: EditorState): { decorations: DecorationSet; atomic: DecorationSet } {\n  const marks: Range<Decoration>[] = [];\n  const atomic: Range<Decoration>[] = [];\n  const doc = state.doc;\n  const totalLines = doc.lines;\n  const tree = docTree(state);\n  // A `$$` line delimits a block only in prose — inside a code block it is\n  // literal text, neither an opener nor a closer.\n  const blockMarkAt = (num: number): boolean => {\n    const line = doc.line(num);\n    return line.text.trim() === \"$$\" && !inCode(tree, line.from + line.text.indexOf(\"$\"));\n  };\n\n  let lineNum = 1;\n  while (lineNum <= totalLines) {\n    const line = doc.line(lineNum);\n    const text = line.text;\n\n    // Single-line block: `$$ … $$` on one line.\n    const single = text.match(/^\\$\\$(.+)\\$\\$\\s*$/);\n    if (single && !inCode(tree, line.from)) {\n      const replace = Decoration.replace({ widget: new MathWidget(single[1], true) });\n      marks.push(replace.range(line.from, line.to));\n      atomic.push(replace.range(line.from, line.to));\n      lineNum += 1;\n      continue;\n    }\n\n    // Multi-line block: a lone `$$` opens it; scan to the next lone `$$`. This\n    // span crosses line breaks, so it must be a `block: true` replacement and\n    // is delivered via a StateField — CM6 forbids both a plugin-supplied and a\n    // non-block replace from covering a line break, and a real layout engine\n    // renders such a span as raw source rather than the widget.\n    if (blockMarkAt(lineNum)) {\n      let close = lineNum + 1;\n      while (close <= totalLines && !blockMarkAt(close)) {\n        close += 1;\n      }\n      if (close <= totalLines) {\n        const closeLine = doc.line(close);\n        const tex = doc.sliceString(line.to, closeLine.from).trim();\n        const replace = Decoration.replace({ widget: new MathWidget(tex, true), block: true });\n        marks.push(replace.range(line.from, closeLine.to));\n        atomic.push(replace.range(line.from, closeLine.to));\n        lineNum = close + 1;\n        continue;\n      }\n    }\n\n    // Inline `$ … $`.\n    INLINE_MATH_RE.lastIndex = 0;\n    let m: RegExpExecArray | null;\n    while ((m = INLINE_MATH_RE.exec(text)) !== null) {\n      const matchStart = line.from + m.index;\n      const matchEnd = matchStart + m[0].length;\n      if (inCode(tree, matchStart) || inCode(tree, matchEnd - 1)) continue;\n      const replace = Decoration.replace({ widget: new MathWidget(m[1], false) });\n      marks.push(replace.range(matchStart, matchEnd));\n      atomic.push(replace.range(matchStart, matchEnd));\n    }\n    lineNum += 1;\n  }\n\n  return {\n    decorations: Decoration.set(marks, true),\n    atomic: Decoration.set(atomic, true),\n  };\n}\n\nexport const mathPlugin = StateField.define<{ decorations: DecorationSet; atomic: DecorationSet }>({\n  create: (state) => computeDecorations(state),\n  update: (value, tr) => (tr.docChanged ? computeDecorations(tr.state) : value),\n  provide: (field) => [\n    EditorView.decorations.from(field, (value) => value.decorations),\n    EditorView.atomicRanges.of((view) => view.state.field(field, false)?.atomic ?? Decoration.none),\n  ],\n});\n"],"mappings":";AAAA,SAAuC,kBAAkB;AACzD,SAAS,YAAgC,kBAAkB;AAE3D,SAAS,SAAS,cAAc;AAChC,SAAS,kBAAkB;AAEpB,MAAM,iBAAiB;AAE9B,SAAS,mBAAmB,OAA2E;AACrG,QAAM,QAA6B,CAAC;AACpC,QAAM,SAA8B,CAAC;AACrC,QAAM,MAAM,MAAM;AAClB,QAAM,aAAa,IAAI;AACvB,QAAM,OAAO,QAAQ,KAAK;AAG1B,QAAM,cAAc,CAAC,QAAyB;AAC5C,UAAM,OAAO,IAAI,KAAK,GAAG;AACzB,WAAO,KAAK,KAAK,KAAK,MAAM,QAAQ,CAAC,OAAO,MAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,GAAG,CAAC;AAAA,EACtF;AAEA,MAAI,UAAU;AACd,SAAO,WAAW,YAAY;AAC5B,UAAM,OAAO,IAAI,KAAK,OAAO;AAC7B,UAAM,OAAO,KAAK;AAGlB,UAAM,SAAS,KAAK,MAAM,mBAAmB;AAC7C,QAAI,UAAU,CAAC,OAAO,MAAM,KAAK,IAAI,GAAG;AACtC,YAAM,UAAU,WAAW,QAAQ,EAAE,QAAQ,IAAI,WAAW,OAAO,CAAC,GAAG,IAAI,EAAE,CAAC;AAC9E,YAAM,KAAK,QAAQ,MAAM,KAAK,MAAM,KAAK,EAAE,CAAC;AAC5C,aAAO,KAAK,QAAQ,MAAM,KAAK,MAAM,KAAK,EAAE,CAAC;AAC7C,iBAAW;AACX;AAAA,IACF;AAOA,QAAI,YAAY,OAAO,GAAG;AACxB,UAAI,QAAQ,UAAU;AACtB,aAAO,SAAS,cAAc,CAAC,YAAY,KAAK,GAAG;AACjD,iBAAS;AAAA,MACX;AACA,UAAI,SAAS,YAAY;AACvB,cAAM,YAAY,IAAI,KAAK,KAAK;AAChC,cAAM,MAAM,IAAI,YAAY,KAAK,IAAI,UAAU,IAAI,EAAE,KAAK;AAC1D,cAAM,UAAU,WAAW,QAAQ,EAAE,QAAQ,IAAI,WAAW,KAAK,IAAI,GAAG,OAAO,KAAK,CAAC;AACrF,cAAM,KAAK,QAAQ,MAAM,KAAK,MAAM,UAAU,EAAE,CAAC;AACjD,eAAO,KAAK,QAAQ,MAAM,KAAK,MAAM,UAAU,EAAE,CAAC;AAClD,kBAAU,QAAQ;AAClB;AAAA,MACF;AAAA,IACF;AAGA,mBAAe,YAAY;AAC3B,QAAI;AACJ,YAAQ,IAAI,eAAe,KAAK,IAAI,OAAO,MAAM;AAC/C,YAAM,aAAa,KAAK,OAAO,EAAE;AACjC,YAAM,WAAW,aAAa,EAAE,CAAC,EAAE;AACnC,UAAI,OAAO,MAAM,UAAU,KAAK,OAAO,MAAM,WAAW,CAAC,EAAG;AAC5D,YAAM,UAAU,WAAW,QAAQ,EAAE,QAAQ,IAAI,WAAW,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC;AAC1E,YAAM,KAAK,QAAQ,MAAM,YAAY,QAAQ,CAAC;AAC9C,aAAO,KAAK,QAAQ,MAAM,YAAY,QAAQ,CAAC;AAAA,IACjD;AACA,eAAW;AAAA,EACb;AAEA,SAAO;AAAA,IACL,aAAa,WAAW,IAAI,OAAO,IAAI;AAAA,IACvC,QAAQ,WAAW,IAAI,QAAQ,IAAI;AAAA,EACrC;AACF;AAEO,MAAM,aAAa,WAAW,OAA8D;AAAA,EACjG,QAAQ,CAAC,UAAU,mBAAmB,KAAK;AAAA,EAC3C,QAAQ,CAAC,OAAO,OAAQ,GAAG,aAAa,mBAAmB,GAAG,KAAK,IAAI;AAAA,EACvE,SAAS,CAAC,UAAU;AAAA,IAClB,WAAW,YAAY,KAAK,OAAO,CAAC,UAAU,MAAM,WAAW;AAAA,IAC/D,WAAW,aAAa,GAAG,CAAC,SAAS,KAAK,MAAM,MAAM,OAAO,KAAK,GAAG,UAAU,WAAW,IAAI;AAAA,EAChG;AACF,CAAC;","names":[]}

package/dist/codemirror/math/mathScanRule.d.ts

@@ -0,0 +1,16 @@
+import { InlineScanRule } from '../core/inlineScan.js';
+import '@codemirror/state';
+
+/**
+ * `$…$` for the string renderers.
+ *
+ * The only rule that hydrates: KaTeX builds DOM, and its markup carries inline
+ * styles a cell's sanitiser allow-list deliberately drops. So the render pass
+ * emits the TeX as inert text, the sanitiser sees only that, and KaTeX — trusted
+ * code, reading the element's own `textContent` — replaces it afterwards. The
+ * allow-list stays as tight as it is for prose.
+ */
+
+declare const mathScanRule: InlineScanRule;
+
+export { mathScanRule };

package/dist/codemirror/math/mathScanRule.js

@@ -0,0 +1,18 @@
+import "../../chunk-V6TY7KAL.js";
+import { escapeText } from "../core/htmlEscape.js";
+import { INLINE_MATH_RE } from "./mathPlugin.js";
+import { renderMathInto } from "./mathWidget.js";
+const mathScanRule = {
+  name: "math",
+  pattern: INLINE_MATH_RE,
+  render: (match) => `<span class="cm-math-inline">${escapeText(match[1] ?? "")}</span>`,
+  hydrate: (root) => {
+    for (const el of root.querySelectorAll(".cm-math-inline")) {
+      renderMathInto(el, el.textContent ?? "", false);
+    }
+  }
+};
+export {
+  mathScanRule
+};
+//# sourceMappingURL=mathScanRule.js.map

package/dist/codemirror/math/mathScanRule.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/codemirror/math/mathScanRule.ts"],"sourcesContent":["/**\n * `$…$` for the string renderers.\n *\n * The only rule that hydrates: KaTeX builds DOM, and its markup carries inline\n * styles a cell's sanitiser allow-list deliberately drops. So the render pass\n * emits the TeX as inert text, the sanitiser sees only that, and KaTeX — trusted\n * code, reading the element's own `textContent` — replaces it afterwards. The\n * allow-list stays as tight as it is for prose.\n */\n\nimport { escapeText } from \"../core/htmlEscape\";\nimport { type InlineScanRule } from \"../core/inlineScan\";\nimport { INLINE_MATH_RE } from \"./mathPlugin\";\nimport { renderMathInto } from \"./mathWidget\";\n\nexport const mathScanRule: InlineScanRule = {\n  name: \"math\",\n  pattern: INLINE_MATH_RE,\n  render: (match) => `<span class=\"cm-math-inline\">${escapeText(match[1] ?? \"\")}</span>`,\n  hydrate: (root) => {\n    for (const el of root.querySelectorAll(\".cm-math-inline\")) {\n      renderMathInto(el as HTMLElement, el.textContent ?? \"\", false);\n    }\n  },\n};\n"],"mappings":";AAUA,SAAS,kBAAkB;AAE3B,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAExB,MAAM,eAA+B;AAAA,EAC1C,MAAM;AAAA,EACN,SAAS;AAAA,EACT,QAAQ,CAAC,UAAU,gCAAgC,WAAW,MAAM,CAAC,KAAK,EAAE,CAAC;AAAA,EAC7E,SAAS,CAAC,SAAS;AACjB,eAAW,MAAM,KAAK,iBAAiB,iBAAiB,GAAG;AACzD,qBAAe,IAAmB,GAAG,eAAe,IAAI,KAAK;AAAA,IAC/D;AAAA,EACF;AACF;","names":[]}

package/dist/codemirror/math/mathWidget.d.ts

@@ -0,0 +1,15 @@
+import { WidgetType, EditorView } from '@codemirror/view';
+
+/** Typeset `tex` into `el`, falling back to the source on a KaTeX failure so a
+ *  malformed expression shows what the author wrote rather than nothing. */
+declare function renderMathInto(el: HTMLElement, tex: string, displayMode: boolean): void;
+declare class MathWidget extends WidgetType {
+    readonly tex: string;
+    readonly displayMode: boolean;
+    constructor(tex: string, displayMode: boolean);
+    eq(other: MathWidget): boolean;
+    toDOM(_view: EditorView): HTMLElement;
+    ignoreEvent(): boolean;
+}
+
+export { MathWidget, renderMathInto };

package/dist/codemirror/math/mathWidget.js

@@ -0,0 +1,36 @@
+import {
+  __publicField
+} from "../../chunk-V6TY7KAL.js";
+import katex from "katex";
+import { WidgetType } from "@codemirror/view";
+function renderMathInto(el, tex, displayMode) {
+  try {
+    katex.render(tex, el, { displayMode, throwOnError: false, output: "html" });
+  } catch {
+    el.textContent = tex;
+  }
+}
+class MathWidget extends WidgetType {
+  constructor(tex, displayMode) {
+    super();
+    __publicField(this, "tex", tex);
+    __publicField(this, "displayMode", displayMode);
+  }
+  eq(other) {
+    return other.tex === this.tex && other.displayMode === this.displayMode;
+  }
+  toDOM(_view) {
+    const span = document.createElement(this.displayMode ? "div" : "span");
+    span.className = this.displayMode ? "cm-math-block" : "cm-math-inline";
+    renderMathInto(span, this.tex, this.displayMode);
+    return span;
+  }
+  ignoreEvent() {
+    return false;
+  }
+}
+export {
+  MathWidget,
+  renderMathInto
+};
+//# sourceMappingURL=mathWidget.js.map

package/dist/codemirror/math/mathWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/codemirror/math/mathWidget.ts"],"sourcesContent":["import katex from \"katex\";\nimport { EditorView, WidgetType } from \"@codemirror/view\";\n\n/** Typeset `tex` into `el`, falling back to the source on a KaTeX failure so a\n *  malformed expression shows what the author wrote rather than nothing. */\nexport function renderMathInto(el: HTMLElement, tex: string, displayMode: boolean): void {\n  try {\n    katex.render(tex, el, { displayMode, throwOnError: false, output: \"html\" });\n  } catch {\n    el.textContent = tex;\n  }\n}\n\nexport class MathWidget extends WidgetType {\n  constructor(\n    readonly tex: string,\n    readonly displayMode: boolean,\n  ) {\n    super();\n  }\n\n  override eq(other: MathWidget): boolean {\n    return other.tex === this.tex && other.displayMode === this.displayMode;\n  }\n\n  override toDOM(_view: EditorView): HTMLElement {\n    const span = document.createElement(this.displayMode ? \"div\" : \"span\");\n    span.className = this.displayMode ? \"cm-math-block\" : \"cm-math-inline\";\n    renderMathInto(span, this.tex, this.displayMode);\n    return span;\n  }\n\n  override ignoreEvent(): boolean {\n    return false;\n  }\n}\n"],"mappings":";;;AAAA,OAAO,WAAW;AAClB,SAAqB,kBAAkB;AAIhC,SAAS,eAAe,IAAiB,KAAa,aAA4B;AACvF,MAAI;AACF,UAAM,OAAO,KAAK,IAAI,EAAE,aAAa,cAAc,OAAO,QAAQ,OAAO,CAAC;AAAA,EAC5E,QAAQ;AACN,OAAG,cAAc;AAAA,EACnB;AACF;AAEO,MAAM,mBAAmB,WAAW;AAAA,EACzC,YACW,KACA,aACT;AACA,UAAM;AAHG;AACA;AAAA,EAGX;AAAA,EAES,GAAG,OAA4B;AACtC,WAAO,MAAM,QAAQ,KAAK,OAAO,MAAM,gBAAgB,KAAK;AAAA,EAC9D;AAAA,EAES,MAAM,OAAgC;AAC7C,UAAM,OAAO,SAAS,cAAc,KAAK,cAAc,QAAQ,MAAM;AACrE,SAAK,YAAY,KAAK,cAAc,kBAAkB;AACtD,mBAAe,MAAM,KAAK,KAAK,KAAK,WAAW;AAC/C,WAAO;AAAA,EACT;AAAA,EAES,cAAuB;AAC9B,WAAO;AAAA,EACT;AACF;","names":[]}

package/dist/codemirror/mermaid/index.d.ts

@@ -0,0 +1,4 @@
+export { MermaidFence, mermaidField } from './mermaidPlugin.js';
+export { MermaidRenderResult, getCachedMermaidPng, getCachedMermaidSvg, isMermaidFenceInfo, rasterizeSvgToPngDataUri, renderMermaidToSvg, warmMermaidPng } from './mermaidRender.js';
+import '@codemirror/state';
+import '@codemirror/view';

package/dist/codemirror/mermaid/index.js

@@ -0,0 +1,3 @@
+export * from "./mermaidPlugin.js";
+export * from "./mermaidRender.js";
+//# sourceMappingURL=index.js.map

package/dist/codemirror/mermaid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/codemirror/mermaid/index.ts"],"sourcesContent":["/**\n * Mermaid diagrams: the fence-to-diagram StateField and the CodeMirror-free\n * renderer (SVG + rasterized PNG caches) shared with export and clipboard.\n */\nexport * from \"./mermaidPlugin\";\nexport * from \"./mermaidRender\";\n"],"mappings":"AAIA,cAAc;AACd,cAAc;","names":[]}

package/dist/codemirror/mermaid/mermaidPlugin.d.ts

@@ -0,0 +1,25 @@
+import { StateField } from '@codemirror/state';
+import { DecorationSet } from '@codemirror/view';
+
+/**
+ * Mermaid fences (#125) — a CLOSED ```mermaid fence renders as a diagram
+ * block while the caret is outside it; a caret or selection touching the
+ * fence reveals the source (the code-block contract), and leaving re-renders.
+ *
+ * A StateField, not a ViewPlugin: the replacement spans line breaks, and CM6
+ * only honours block-level multi-line replaces delivered via a field (same
+ * constraint as tableField/mathPlugin).
+ */
+
+interface MermaidFence {
+    from: number;
+    to: number;
+    source: string;
+}
+interface MermaidFieldValue {
+    fences: MermaidFence[];
+    decorations: DecorationSet;
+}
+declare const mermaidField: StateField<MermaidFieldValue>;
+
+export { type MermaidFence, mermaidField };

package/dist/codemirror/mermaid/mermaidPlugin.js

@@ -0,0 +1,78 @@
+import "../../chunk-V6TY7KAL.js";
+import { isMermaidFenceInfo } from "./mermaidRender.js";
+import { syntaxTree } from "@codemirror/language";
+import { StateField } from "@codemirror/state";
+import { Decoration, EditorView } from "@codemirror/view";
+import { MermaidWidget } from "./mermaidWidget.js";
+function mermaidFenceAt(state, node) {
+  const info = node.getChild("CodeInfo");
+  if (!info || !isMermaidFenceInfo(state.sliceDoc(info.from, info.to))) return null;
+  if (node.getChildren("CodeMark").length < 2) return null;
+  const opener = state.doc.lineAt(node.from);
+  const closer = state.doc.lineAt(node.to);
+  if (node.from !== opener.from || node.to !== closer.to) return null;
+  const text = node.getChild("CodeText");
+  return {
+    from: node.from,
+    to: node.to,
+    source: text ? state.sliceDoc(text.from, text.to) : ""
+  };
+}
+function findFences(state) {
+  const fences = [];
+  syntaxTree(state).iterate({
+    enter(node) {
+      if (node.name !== "FencedCode") return;
+      const fence = mermaidFenceAt(state, node.node);
+      if (fence) fences.push(fence);
+    }
+  });
+  return fences;
+}
+function selectionReveals(state, fence) {
+  const inside = (pos) => pos > fence.from && pos < fence.to;
+  return state.selection.ranges.some((range) => inside(range.anchor) || inside(range.head));
+}
+function selectionCovers(state, fence) {
+  return state.selection.ranges.some(
+    (range) => !range.empty && range.from <= fence.from && range.to >= fence.to
+  );
+}
+function build(state, fences) {
+  const ranges = [];
+  for (const fence of fences) {
+    if (selectionReveals(state, fence)) continue;
+    ranges.push(
+      Decoration.replace({
+        widget: new MermaidWidget(fence.source, selectionCovers(state, fence)),
+        block: true
+      }).range(fence.from, fence.to)
+    );
+  }
+  return { fences, decorations: Decoration.set(ranges, true) };
+}
+const mermaidField = StateField.define({
+  create: (state) => build(state, findFences(state)),
+  update(value, tr) {
+    if (tr.docChanged || syntaxTree(tr.state) !== syntaxTree(tr.startState)) {
+      return build(tr.state, findFences(tr.state));
+    }
+    if (tr.selection) {
+      return build(tr.state, value.fences);
+    }
+    return value;
+  },
+  provide: (field) => [
+    EditorView.decorations.from(field, (value) => value.decorations),
+    // The replaced span is atomic: the caret skips over the widget instead
+    // of stepping through hidden fence source. Revealed fences carry no
+    // replace decoration, so caret motion inside them stays free.
+    EditorView.atomicRanges.of(
+      (view) => view.state.field(field, false)?.decorations ?? Decoration.none
+    )
+  ]
+});
+export {
+  mermaidField
+};
+//# sourceMappingURL=mermaidPlugin.js.map

package/dist/codemirror/mermaid/mermaidPlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/codemirror/mermaid/mermaidPlugin.ts"],"sourcesContent":["/**\n * Mermaid fences (#125) — a CLOSED ```mermaid fence renders as a diagram\n * block while the caret is outside it; a caret or selection touching the\n * fence reveals the source (the code-block contract), and leaving re-renders.\n *\n * A StateField, not a ViewPlugin: the replacement spans line breaks, and CM6\n * only honours block-level multi-line replaces delivered via a field (same\n * constraint as tableField/mathPlugin).\n */\n\nimport { isMermaidFenceInfo } from \"./mermaidRender\";\nimport { syntaxTree } from \"@codemirror/language\";\nimport { type EditorState, type Range, StateField } from \"@codemirror/state\";\nimport { Decoration, type DecorationSet, EditorView } from \"@codemirror/view\";\n\nimport { MermaidWidget } from \"./mermaidWidget\";\n\n// Structural stand-in for a Lezer node — `@lezer/common` is a transitive\n// dep this package deliberately doesn't import from (same convention as\n// tableModel's SyntaxNodeLike).\ntype FenceNodeLike = {\n  readonly from: number;\n  readonly to: number;\n  getChild(type: string): { readonly from: number; readonly to: number } | null;\n  getChildren(type: string): readonly unknown[];\n};\n\nexport interface MermaidFence {\n  from: number;\n  to: number;\n  source: string;\n}\n\n\nfunction mermaidFenceAt(state: EditorState, node: FenceNodeLike): MermaidFence | null {\n  const info = node.getChild(\"CodeInfo\");\n  if (!info || !isMermaidFenceInfo(state.sliceDoc(info.from, info.to))) return null;\n  // Closed fences only (opener AND closer CodeMark). An unclosed fence runs\n  // to the end of the doc — rendering it while the user is still typing\n  // lines would yank the block out from under the caret.\n  if (node.getChildren(\"CodeMark\").length < 2) return null;\n  // A block replace must cover whole lines. A fence indented inside a list\n  // item starts mid-line, so it stays as source instead.\n  const opener = state.doc.lineAt(node.from);\n  const closer = state.doc.lineAt(node.to);\n  if (node.from !== opener.from || node.to !== closer.to) return null;\n  const text = node.getChild(\"CodeText\");\n  return {\n    from: node.from,\n    to: node.to,\n    source: text ? state.sliceDoc(text.from, text.to) : \"\",\n  };\n}\n\nfunction findFences(state: EditorState): MermaidFence[] {\n  const fences: MermaidFence[] = [];\n  syntaxTree(state).iterate({\n    enter(node) {\n      if (node.name !== \"FencedCode\") return;\n      const fence = mermaidFenceAt(state, node.node);\n      if (fence) fences.push(fence);\n    },\n  });\n  return fences;\n}\n\n/** A fence reveals its source only when a selection ENDPOINT sits strictly\n *  inside it — click-to-edit places the caret there, and selecting within the\n *  revealed source keeps it revealed. A selection merely SPANNING the fence\n *  (drag-across, select-all, copying a region) keeps the diagram rendered:\n *  flipping to source mid-drag read as \"copying turns it back into code\",\n *  and the height jump made the drag jumpy. */\nfunction selectionReveals(state: EditorState, fence: MermaidFence): boolean {\n  const inside = (pos: number) => pos > fence.from && pos < fence.to;\n  return state.selection.ranges.some((range) => inside(range.anchor) || inside(range.head));\n}\n\ninterface MermaidFieldValue {\n  fences: MermaidFence[];\n  decorations: DecorationSet;\n}\n\n/** A selection fully covering the fence — the click-to-select state. The\n *  widget paints it (native selection can't draw over a block widget). */\nfunction selectionCovers(state: EditorState, fence: MermaidFence): boolean {\n  return state.selection.ranges.some(\n    (range) => !range.empty && range.from <= fence.from && range.to >= fence.to,\n  );\n}\n\nfunction build(state: EditorState, fences: MermaidFence[]): MermaidFieldValue {\n  const ranges: Range<Decoration>[] = [];\n  for (const fence of fences) {\n    if (selectionReveals(state, fence)) continue;\n    ranges.push(\n      Decoration.replace({\n        widget: new MermaidWidget(fence.source, selectionCovers(state, fence)),\n        block: true,\n      }).range(fence.from, fence.to),\n    );\n  }\n  return { fences, decorations: Decoration.set(ranges, true) };\n}\n\nexport const mermaidField = StateField.define<MermaidFieldValue>({\n  create: (state) => build(state, findFences(state)),\n  update(value, tr) {\n    // Fences re-extract on edits AND on parse progress — CM parses lazily,\n    // so fences far down a long doc only enter the tree as the user scrolls\n    // (the tableField lesson). Selection-only changes rebuild from the\n    // cached fence list: that's the cheap path that flips a fence between\n    // widget and source on every caret move.\n    if (tr.docChanged || syntaxTree(tr.state) !== syntaxTree(tr.startState)) {\n      return build(tr.state, findFences(tr.state));\n    }\n    if (tr.selection) {\n      return build(tr.state, value.fences);\n    }\n    return value;\n  },\n  provide: (field) => [\n    EditorView.decorations.from(field, (value) => value.decorations),\n    // The replaced span is atomic: the caret skips over the widget instead\n    // of stepping through hidden fence source. Revealed fences carry no\n    // replace decoration, so caret motion inside them stays free.\n    EditorView.atomicRanges.of(\n      (view) => view.state.field(field, false)?.decorations ?? Decoration.none,\n    ),\n  ],\n});\n"],"mappings":";AAUA,SAAS,0BAA0B;AACnC,SAAS,kBAAkB;AAC3B,SAAuC,kBAAkB;AACzD,SAAS,YAAgC,kBAAkB;AAE3D,SAAS,qBAAqB;AAmB9B,SAAS,eAAe,OAAoB,MAA0C;AACpF,QAAM,OAAO,KAAK,SAAS,UAAU;AACrC,MAAI,CAAC,QAAQ,CAAC,mBAAmB,MAAM,SAAS,KAAK,MAAM,KAAK,EAAE,CAAC,EAAG,QAAO;AAI7E,MAAI,KAAK,YAAY,UAAU,EAAE,SAAS,EAAG,QAAO;AAGpD,QAAM,SAAS,MAAM,IAAI,OAAO,KAAK,IAAI;AACzC,QAAM,SAAS,MAAM,IAAI,OAAO,KAAK,EAAE;AACvC,MAAI,KAAK,SAAS,OAAO,QAAQ,KAAK,OAAO,OAAO,GAAI,QAAO;AAC/D,QAAM,OAAO,KAAK,SAAS,UAAU;AACrC,SAAO;AAAA,IACL,MAAM,KAAK;AAAA,IACX,IAAI,KAAK;AAAA,IACT,QAAQ,OAAO,MAAM,SAAS,KAAK,MAAM,KAAK,EAAE,IAAI;AAAA,EACtD;AACF;AAEA,SAAS,WAAW,OAAoC;AACtD,QAAM,SAAyB,CAAC;AAChC,aAAW,KAAK,EAAE,QAAQ;AAAA,IACxB,MAAM,MAAM;AACV,UAAI,KAAK,SAAS,aAAc;AAChC,YAAM,QAAQ,eAAe,OAAO,KAAK,IAAI;AAC7C,UAAI,MAAO,QAAO,KAAK,KAAK;AAAA,IAC9B;AAAA,EACF,CAAC;AACD,SAAO;AACT;AAQA,SAAS,iBAAiB,OAAoB,OAA8B;AAC1E,QAAM,SAAS,CAAC,QAAgB,MAAM,MAAM,QAAQ,MAAM,MAAM;AAChE,SAAO,MAAM,UAAU,OAAO,KAAK,CAAC,UAAU,OAAO,MAAM,MAAM,KAAK,OAAO,MAAM,IAAI,CAAC;AAC1F;AASA,SAAS,gBAAgB,OAAoB,OAA8B;AACzE,SAAO,MAAM,UAAU,OAAO;AAAA,IAC5B,CAAC,UAAU,CAAC,MAAM,SAAS,MAAM,QAAQ,MAAM,QAAQ,MAAM,MAAM,MAAM;AAAA,EAC3E;AACF;AAEA,SAAS,MAAM,OAAoB,QAA2C;AAC5E,QAAM,SAA8B,CAAC;AACrC,aAAW,SAAS,QAAQ;AAC1B,QAAI,iBAAiB,OAAO,KAAK,EAAG;AACpC,WAAO;AAAA,MACL,WAAW,QAAQ;AAAA,QACjB,QAAQ,IAAI,cAAc,MAAM,QAAQ,gBAAgB,OAAO,KAAK,CAAC;AAAA,QACrE,OAAO;AAAA,MACT,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,EAAE;AAAA,IAC/B;AAAA,EACF;AACA,SAAO,EAAE,QAAQ,aAAa,WAAW,IAAI,QAAQ,IAAI,EAAE;AAC7D;AAEO,MAAM,eAAe,WAAW,OAA0B;AAAA,EAC/D,QAAQ,CAAC,UAAU,MAAM,OAAO,WAAW,KAAK,CAAC;AAAA,EACjD,OAAO,OAAO,IAAI;AAMhB,QAAI,GAAG,cAAc,WAAW,GAAG,KAAK,MAAM,WAAW,GAAG,UAAU,GAAG;AACvE,aAAO,MAAM,GAAG,OAAO,WAAW,GAAG,KAAK,CAAC;AAAA,IAC7C;AACA,QAAI,GAAG,WAAW;AAChB,aAAO,MAAM,GAAG,OAAO,MAAM,MAAM;AAAA,IACrC;AACA,WAAO;AAAA,EACT;AAAA,EACA,SAAS,CAAC,UAAU;AAAA,IAClB,WAAW,YAAY,KAAK,OAAO,CAAC,UAAU,MAAM,WAAW;AAAA;AAAA;AAAA;AAAA,IAI/D,WAAW,aAAa;AAAA,MACtB,CAAC,SAAS,KAAK,MAAM,MAAM,OAAO,KAAK,GAAG,eAAe,WAAW;AAAA,IACtE;AAAA,EACF;AACF,CAAC;","names":[]}

package/dist/codemirror/mermaid/mermaidRender.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Mermaid rendering, decoupled from CodeMirror — shared by the editor widget,
+ * the document export (which ships the SVG to the backend), and the clipboard
+ * (which needs a PNG, since Google Docs/Word drop SVG on paste).
+ *
+ * The mermaid library is heavy (~2 MB minified), so it loads lazily on the
+ * first diagram — bundled with the app, never fetched at runtime, so diagrams
+ * work fully offline. Render results are cached by source text; PNGs are
+ * rasterised once per diagram in the background (see {@link warmMermaidPng})
+ * so the SYNCHRONOUS copy event can embed them from cache.
+ */
+type MermaidRenderResult = {
+    ok: true;
+    svg: string;
+} | {
+    ok: false;
+    message: string;
+};
+/** Whether a fence info string denotes a rendered mermaid diagram — the tag
+ *  alone, any casing, no trailing meta ("mermaid title=x" is source, not a
+ *  diagram). The one definition shared by the editor plugin, the export's SVG
+ *  collector, and the clipboard, so every surface classifies identically. */
+declare function isMermaidFenceInfo(info: string): boolean;
+/** The cached render for a source, or null — the SYNCHRONOUS path. The widget
+ *  uses it to fill a re-created diagram in the same task (no pending flash, no
+ *  measure churn on caret-in/out toggles). */
+declare function getCachedMermaidSvg(source: string): MermaidRenderResult | null;
+/** Render a mermaid diagram source to SVG, memoised by source. Never rejects —
+ *  a parse error resolves to `{ ok: false, message }`. */
+declare function renderMermaidToSvg(source: string): Promise<MermaidRenderResult>;
+/** The cached PNG data URI for a diagram source, if it has been rasterised. */
+declare function getCachedMermaidPng(source: string): string | null;
+/** Render + rasterise a diagram in the background so a LATER (synchronous)
+ *  clipboard copy can embed it from cache. Fire-and-forget: failures leave the
+ *  cache empty and the copy degrades to the source block. */
+declare function warmMermaidPng(source: string): Promise<void>;
+/** Rasterise an SVG string to a PNG data URI at `scale`× its intrinsic size
+ *  (2× by default, so the pasted image stays sharp on retina targets).
+ *  Resolves null when the SVG has no readable dimensions or drawing fails. */
+declare function rasterizeSvgToPngDataUri(svg: string, scale?: number): Promise<string | null>;
+
+export { type MermaidRenderResult, getCachedMermaidPng, getCachedMermaidSvg, isMermaidFenceInfo, rasterizeSvgToPngDataUri, renderMermaidToSvg, warmMermaidPng };

package/dist/codemirror/mermaid/mermaidRender.js

@@ -0,0 +1,136 @@
+import "../../chunk-V6TY7KAL.js";
+function isMermaidFenceInfo(info) {
+  return /^mermaid\s*$/i.test(info.trim());
+}
+let mermaidLoader = null;
+function loadMermaid() {
+  mermaidLoader ?? (mermaidLoader = import("mermaid").then((mod) => {
+    const mermaid = mod.default;
+    mermaid.initialize({
+      startOnLoad: false,
+      // "strict" escapes HTML in labels and blocks script/click directives —
+      // fence content is the user's own doc, but pasted diagrams shouldn't
+      // be able to inject markup either.
+      securityLevel: "strict",
+      theme: "neutral",
+      fontFamily: "inherit",
+      // SVG-native <text> labels, not <foreignObject> HTML: canvas refuses to
+      // rasterise foreignObject content (the clipboard PNG taints), and
+      // text-only SVGs travel better through the export paths. The root key
+      // is what mermaid 11.16 honours (`flowchart.htmlLabels` is deprecated
+      // and loses to the root's default).
+      htmlLabels: false,
+      flowchart: { htmlLabels: false },
+      class: { htmlLabels: false },
+      // On a parse error mermaid otherwise injects its own bomb-icon SVG
+      // into <body>; callers render their own error states.
+      suppressErrorRendering: true
+    });
+    return mermaid;
+  }));
+  return mermaidLoader;
+}
+let renderSeq = 0;
+const svgCache = /* @__PURE__ */ new Map();
+const SVG_CACHE_CAP = 100;
+function remember(source, result) {
+  if (svgCache.size >= SVG_CACHE_CAP) {
+    const oldest = svgCache.keys().next().value;
+    if (oldest !== void 0) svgCache.delete(oldest);
+  }
+  svgCache.set(source, result);
+}
+function getCachedMermaidSvg(source) {
+  return svgCache.get(source) ?? null;
+}
+async function renderMermaidToSvg(source) {
+  const cached = svgCache.get(source);
+  if (cached) return cached;
+  let result;
+  try {
+    const mermaid = await loadMermaid();
+    const { svg } = await mermaid.render(`cm-mermaid-${renderSeq++}`, source);
+    result = { ok: true, svg };
+  } catch (error) {
+    result = { ok: false, message: error instanceof Error ? error.message : String(error) };
+  }
+  remember(source, result);
+  return result;
+}
+const pngCache = /* @__PURE__ */ new Map();
+const pngPending = /* @__PURE__ */ new Set();
+const PNG_CACHE_CAP = 24;
+function getCachedMermaidPng(source) {
+  return pngCache.get(source.trim()) ?? null;
+}
+async function warmMermaidPng(source) {
+  const key = source.trim();
+  if (key === "" || pngCache.has(key) || pngPending.has(key)) return;
+  pngPending.add(key);
+  try {
+    const rendered = await renderMermaidToSvg(key);
+    if (!rendered.ok) return;
+    const png = await rasterizeSvgToPngDataUri(rendered.svg);
+    if (!png) return;
+    if (pngCache.size >= PNG_CACHE_CAP) {
+      const oldest = pngCache.keys().next().value;
+      if (oldest !== void 0) pngCache.delete(oldest);
+    }
+    pngCache.set(key, png);
+  } finally {
+    pngPending.delete(key);
+  }
+}
+async function rasterizeSvgToPngDataUri(svg, scale = 2) {
+  const dims = svgDimensions(svg);
+  if (!dims) return null;
+  const sized = withExplicitSize(svg, dims);
+  const url = URL.createObjectURL(new Blob([sized], { type: "image/svg+xml" }));
+  try {
+    const image = new Image();
+    await new Promise((resolve, reject) => {
+      image.onload = () => resolve();
+      image.onerror = () => reject(new Error("svg image failed to load"));
+      image.src = url;
+    });
+    const canvas = document.createElement("canvas");
+    canvas.width = Math.max(1, Math.round(dims.width * scale));
+    canvas.height = Math.max(1, Math.round(dims.height * scale));
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return null;
+    ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
+    return canvas.toDataURL("image/png");
+  } catch {
+    return null;
+  } finally {
+    URL.revokeObjectURL(url);
+  }
+}
+function svgDimensions(svg) {
+  const root = svg.match(/<svg[^>]*>/)?.[0];
+  if (!root) return null;
+  const viewBox = root.match(/viewBox\s*=\s*"([\d.\s+-]+)"/)?.[1]?.trim().split(/\s+/);
+  if (viewBox?.length === 4) {
+    const width2 = Number(viewBox[2]);
+    const height2 = Number(viewBox[3]);
+    if (width2 > 0 && height2 > 0) return { width: width2, height: height2 };
+  }
+  const width = Number(root.match(/\bwidth\s*=\s*"([\d.]+)"/)?.[1]);
+  const height = Number(root.match(/\bheight\s*=\s*"([\d.]+)"/)?.[1]);
+  return width > 0 && height > 0 ? { width, height } : null;
+}
+function withExplicitSize(svg, dims) {
+  return svg.replace(/<svg([^>]*)>/, (_match, attrs) => {
+    const cleaned = attrs.replace(/\swidth\s*=\s*"[^"]*"/, "").replace(/\sheight\s*=\s*"[^"]*"/, "");
+    return `<svg${cleaned} width="${dims.width}" height="${dims.height}">`;
+  });
+}
+export {
+  getCachedMermaidPng,
+  getCachedMermaidSvg,
+  isMermaidFenceInfo,
+  rasterizeSvgToPngDataUri,
+  renderMermaidToSvg,
+  warmMermaidPng
+};
+//# sourceMappingURL=mermaidRender.js.map

package/dist/codemirror/mermaid/mermaidRender.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/codemirror/mermaid/mermaidRender.ts"],"sourcesContent":["/**\n * Mermaid rendering, decoupled from CodeMirror — shared by the editor widget,\n * the document export (which ships the SVG to the backend), and the clipboard\n * (which needs a PNG, since Google Docs/Word drop SVG on paste).\n *\n * The mermaid library is heavy (~2 MB minified), so it loads lazily on the\n * first diagram — bundled with the app, never fetched at runtime, so diagrams\n * work fully offline. Render results are cached by source text; PNGs are\n * rasterised once per diagram in the background (see {@link warmMermaidPng})\n * so the SYNCHRONOUS copy event can embed them from cache.\n */\n\nexport type MermaidRenderResult = { ok: true; svg: string } | { ok: false; message: string };\n\n/** Whether a fence info string denotes a rendered mermaid diagram — the tag\n *  alone, any casing, no trailing meta (\"mermaid title=x\" is source, not a\n *  diagram). The one definition shared by the editor plugin, the export's SVG\n *  collector, and the clipboard, so every surface classifies identically. */\nexport function isMermaidFenceInfo(info: string): boolean {\n  return /^mermaid\\s*$/i.test(info.trim());\n}\n\nlet mermaidLoader: Promise<typeof import(\"mermaid\").default> | null = null;\n\nfunction loadMermaid(): Promise<typeof import(\"mermaid\").default> {\n  mermaidLoader ??= import(\"mermaid\").then((mod) => {\n    const mermaid = mod.default;\n    mermaid.initialize({\n      startOnLoad: false,\n      // \"strict\" escapes HTML in labels and blocks script/click directives —\n      // fence content is the user's own doc, but pasted diagrams shouldn't\n      // be able to inject markup either.\n      securityLevel: \"strict\",\n      theme: \"neutral\",\n      fontFamily: \"inherit\",\n      // SVG-native <text> labels, not <foreignObject> HTML: canvas refuses to\n      // rasterise foreignObject content (the clipboard PNG taints), and\n      // text-only SVGs travel better through the export paths. The root key\n      // is what mermaid 11.16 honours (`flowchart.htmlLabels` is deprecated\n      // and loses to the root's default).\n      htmlLabels: false,\n      flowchart: { htmlLabels: false },\n      class: { htmlLabels: false },\n      // On a parse error mermaid otherwise injects its own bomb-icon SVG\n      // into <body>; callers render their own error states.\n      suppressErrorRendering: true,\n    });\n    return mermaid;\n  });\n  return mermaidLoader;\n}\n\nlet renderSeq = 0;\n\n/** Render results by fence source. Bounded: a doc being actively rewritten\n *  produces a new key per keystroke-burst, and SVG strings are not small. */\nconst svgCache = new Map<string, MermaidRenderResult>();\nconst SVG_CACHE_CAP = 100;\n\nfunction remember(source: string, result: MermaidRenderResult): void {\n  if (svgCache.size >= SVG_CACHE_CAP) {\n    const oldest = svgCache.keys().next().value;\n    if (oldest !== undefined) svgCache.delete(oldest);\n  }\n  svgCache.set(source, result);\n}\n\n/** The cached render for a source, or null — the SYNCHRONOUS path. The widget\n *  uses it to fill a re-created diagram in the same task (no pending flash, no\n *  measure churn on caret-in/out toggles). */\nexport function getCachedMermaidSvg(source: string): MermaidRenderResult | null {\n  return svgCache.get(source) ?? null;\n}\n\n/** Render a mermaid diagram source to SVG, memoised by source. Never rejects —\n *  a parse error resolves to `{ ok: false, message }`. */\nexport async function renderMermaidToSvg(source: string): Promise<MermaidRenderResult> {\n  const cached = svgCache.get(source);\n  if (cached) return cached;\n  let result: MermaidRenderResult;\n  try {\n    const mermaid = await loadMermaid();\n    const { svg } = await mermaid.render(`cm-mermaid-${renderSeq++}`, source);\n    result = { ok: true, svg };\n  } catch (error) {\n    result = { ok: false, message: error instanceof Error ? error.message : String(error) };\n  }\n  remember(source, result);\n  return result;\n}\n\n// ── PNG side (clipboard) ─────────────────────────────────────────────────────\n//\n// Keys are the TRIMMED diagram source: the markdown pipeline hands the\n// clipboard a fence body with a trailing newline, the widget hands the warm\n// path the fence's inner text — trimming is the meeting point (the export's\n// SVG map uses the same convention).\n\nconst pngCache = new Map<string, string>();\nconst pngPending = new Set<string>();\nconst PNG_CACHE_CAP = 24;\n\n/** The cached PNG data URI for a diagram source, if it has been rasterised. */\nexport function getCachedMermaidPng(source: string): string | null {\n  return pngCache.get(source.trim()) ?? null;\n}\n\n/** Render + rasterise a diagram in the background so a LATER (synchronous)\n *  clipboard copy can embed it from cache. Fire-and-forget: failures leave the\n *  cache empty and the copy degrades to the source block. */\nexport async function warmMermaidPng(source: string): Promise<void> {\n  const key = source.trim();\n  if (key === \"\" || pngCache.has(key) || pngPending.has(key)) return;\n  pngPending.add(key);\n  try {\n    const rendered = await renderMermaidToSvg(key);\n    if (!rendered.ok) return;\n    const png = await rasterizeSvgToPngDataUri(rendered.svg);\n    if (!png) return;\n    if (pngCache.size >= PNG_CACHE_CAP) {\n      const oldest = pngCache.keys().next().value;\n      if (oldest !== undefined) pngCache.delete(oldest);\n    }\n    pngCache.set(key, png);\n  } finally {\n    pngPending.delete(key);\n  }\n}\n\n/** Rasterise an SVG string to a PNG data URI at `scale`× its intrinsic size\n *  (2× by default, so the pasted image stays sharp on retina targets).\n *  Resolves null when the SVG has no readable dimensions or drawing fails. */\nexport async function rasterizeSvgToPngDataUri(svg: string, scale = 2): Promise<string | null> {\n  const dims = svgDimensions(svg);\n  if (!dims) return null;\n  // WebKit refuses to draw an SVG image without explicit width/height (mermaid\n  // emits width=\"100%\" + a viewBox), so pin the intrinsic size first.\n  const sized = withExplicitSize(svg, dims);\n  const url = URL.createObjectURL(new Blob([sized], { type: \"image/svg+xml\" }));\n  try {\n    const image = new Image();\n    await new Promise<void>((resolve, reject) => {\n      image.onload = () => resolve();\n      image.onerror = () => reject(new Error(\"svg image failed to load\"));\n      image.src = url;\n    });\n    const canvas = document.createElement(\"canvas\");\n    canvas.width = Math.max(1, Math.round(dims.width * scale));\n    canvas.height = Math.max(1, Math.round(dims.height * scale));\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) return null;\n    ctx.drawImage(image, 0, 0, canvas.width, canvas.height);\n    return canvas.toDataURL(\"image/png\");\n  } catch {\n    return null;\n  } finally {\n    URL.revokeObjectURL(url);\n  }\n}\n\n/** Intrinsic diagram size from the root svg's viewBox (mermaid always emits\n *  one), falling back to numeric width/height attributes. */\nfunction svgDimensions(svg: string): { width: number; height: number } | null {\n  const root = svg.match(/<svg[^>]*>/)?.[0];\n  if (!root) return null;\n  const viewBox = root.match(/viewBox\\s*=\\s*\"([\\d.\\s+-]+)\"/)?.[1]?.trim().split(/\\s+/);\n  if (viewBox?.length === 4) {\n    const width = Number(viewBox[2]);\n    const height = Number(viewBox[3]);\n    if (width > 0 && height > 0) return { width, height };\n  }\n  const width = Number(root.match(/\\bwidth\\s*=\\s*\"([\\d.]+)\"/)?.[1]);\n  const height = Number(root.match(/\\bheight\\s*=\\s*\"([\\d.]+)\"/)?.[1]);\n  return width > 0 && height > 0 ? { width, height } : null;\n}\n\nfunction withExplicitSize(svg: string, dims: { width: number; height: number }): string {\n  return svg.replace(/<svg([^>]*)>/, (_match, attrs: string) => {\n    const cleaned = attrs\n      .replace(/\\swidth\\s*=\\s*\"[^\"]*\"/, \"\")\n      .replace(/\\sheight\\s*=\\s*\"[^\"]*\"/, \"\");\n    return `<svg${cleaned} width=\"${dims.width}\" height=\"${dims.height}\">`;\n  });\n}\n"],"mappings":"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","names":["width","height"]}

package/dist/codemirror/mermaid/mermaidWidget.d.ts

@@ -0,0 +1,42 @@
+import { WidgetType, EditorView } from '@codemirror/view';
+
+/**
+ * Mermaid diagram widget — a closed ```mermaid fence rendered as a diagram
+ * block. Clicking the diagram moves the caret into the fence, which flips the
+ * block back to source (mermaidPlugin owns that swap).
+ *
+ * Rendering itself (lazy mermaid load, SVG cache, clipboard PNG warm-up) lives
+ * in [mermaidRender](./mermaidRender.ts) — this file owns only the widget:
+ * measured heights are cached by source so `estimatedHeight` answers with the
+ * real height and re-created widgets never shift the scroll position (the
+ * #120 contract).
+ */
+
+/** Pre-measure estimate: diagram height doesn't map cleanly onto source
+ *  lines, but ~a node-row per line is the right order of magnitude, and the
+ *  measured cache replaces the guess after the first real render. */
+declare function estimateMermaidHeight(source: string): number;
+declare class MermaidWidget extends WidgetType {
+    readonly source: string;
+    /** The fence is covered by a (spanning) selection — native selection
+     *  paints nothing over a block widget, so the widget shows its own
+     *  selected state. */
+    readonly selected: boolean;
+    constructor(source: string, 
+    /** The fence is covered by a (spanning) selection — native selection
+     *  paints nothing over a block widget, so the widget shows its own
+     *  selected state. */
+    selected?: boolean);
+    /** Identity = source + selected. Edits elsewhere shift the fence's position
+     *  but must not tear down the diagram DOM; a selected flip alone updates
+     *  the class in place via {@link updateDOM}. */
+    eq(other: MermaidWidget): boolean;
+    updateDOM(dom: HTMLElement): boolean;
+    toDOM(view: EditorView): HTMLElement;
+    private fill;
+    /** The widget owns its events (click-to-edit); CM must not also react. */
+    ignoreEvent(): boolean;
+    get estimatedHeight(): number;
+}
+
+export { MermaidWidget, estimateMermaidHeight };