@latentic/live-markdown 0.0.1 → 0.1.1

package/dist/index.js

@@ -356,7 +356,7 @@ var verbatimPasteKeymap = keymap.of([
   }
 ]);
 var markdownPaste = [pasteHandler, verbatimPasteKeymap];
-var PARSE_BUDGET_MS = 50;
+var PARSE_BUDGET_MS = 150;
 function treeAt(state, pos) {
   return ensureSyntaxTree(state, pos + 1, PARSE_BUDGET_MS) ?? syntaxTree(state);
 }
@@ -1514,6 +1514,38 @@ var nodeRulesFacet = Facet.define({
     return Object.assign({}, ...values);
   }
 });
+var inlineScanRulesFacet = Facet.define({
+  combine: (values) => values
+});
+function scanInline(rules, text, at = 0) {
+  const found = [];
+  for (const rule of rules) {
+    rule.pattern.lastIndex = 0;
+    let match;
+    while ((match = rule.pattern.exec(text)) !== null) {
+      found.push({
+        from: at + match.index,
+        to: at + match.index + match[0].length,
+        html: rule.render(match)
+      });
+    }
+  }
+  found.sort((a, b) => a.from - b.from || b.to - a.to);
+  const kept = [];
+  for (const span of found) {
+    const last = kept[kept.length - 1];
+    if (!last || span.from >= last.to) kept.push(span);
+  }
+  return kept;
+}
+
+// src/codemirror/core/htmlEscape.ts
+function escapeText(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+function escapeAttr(value) {
+  return escapeText(value).replace(/"/g, "&quot;");
+}
 var SLICE_MS = 10;
 var GAP_MS = 25;
 var parseToEnd = ViewPlugin.fromClass(
@@ -1955,6 +1987,73 @@ var imageRule = (ctx) => {
     })
   };
 };
+var CODE_NODES = /* @__PURE__ */ new Set(["FencedCode", "CodeBlock", "InlineCode"]);
+function viewportTree(view) {
+  return ensureSyntaxTree(view.state, view.viewport.to, 100) ?? syntaxTree(view.state);
+}
+function docTree(state) {
+  return ensureSyntaxTree(state, state.doc.length, 20) ?? syntaxTree(state);
+}
+function inCode(tree, pos) {
+  let node = tree.resolveInner(pos, 1);
+  for (; node; node = node.parent) {
+    if (CODE_NODES.has(node.name)) return true;
+  }
+  return false;
+}
+
+// src/codemirror/core/linkResolution.ts
+var DEFINITION_CONTAINERS = /* @__PURE__ */ new Set([
+  "Document",
+  "Blockquote",
+  "BulletList",
+  "OrderedList",
+  "ListItem"
+]);
+function normalizeLabel(label) {
+  return label.trim().replace(/\s+/g, " ").toLowerCase();
+}
+function labelInner(state, label) {
+  return state.sliceDoc(label.from + 1, label.to - 1);
+}
+var definedLabels = /* @__PURE__ */ new WeakMap();
+function definitions(state) {
+  const cached = definedLabels.get(state);
+  if (cached) return cached;
+  const labels = /* @__PURE__ */ new Set();
+  docTree(state).iterate({
+    enter: (node) => {
+      if (node.name !== "LinkReference") return DEFINITION_CONTAINERS.has(node.name);
+      const label = node.node.getChild("LinkLabel");
+      if (label) labels.add(normalizeLabel(labelInner(state, label)));
+      return false;
+    }
+  });
+  definedLabels.set(state, labels);
+  return labels;
+}
+function ownLabel(state, link) {
+  let open = null;
+  let close = null;
+  for (let child = link.firstChild; child; child = child.nextSibling) {
+    if (child.name !== "LinkMark") continue;
+    const mark2 = state.sliceDoc(child.from, child.to);
+    if (mark2 === "[" && !open) open = child;
+    else if (mark2 === "]" && !close) close = child;
+  }
+  if (!open || !close || close.from <= open.to) return null;
+  return state.sliceDoc(open.to, close.from);
+}
+function linkResolves(link, state) {
+  if (link.getChild("URL")) return true;
+  const reference = link.getChild("LinkLabel");
+  const explicit = reference ? labelInner(state, reference) : "";
+  const key = explicit.trim() === "" ? ownLabel(state, link) ?? "" : explicit;
+  return key.trim() !== "" && definitions(state).has(normalizeLabel(key));
+}
+function linkHasVisibleLabel(link, state) {
+  return (ownLabel(state, link) ?? "").trim() !== "";
+}
 var BulletWidget = class extends WidgetType {
   /**
    * Eq returns true if two widgets are interchangeable — when CM6
@@ -2068,19 +2167,8 @@ var taskMarkerRule = (ctx) => {
 };
 
 // src/codemirror/core/registry.ts
-function linkHasVisibleLabel(ctx) {
-  const link = ctx.node.parent;
-  if (!link) return false;
-  let bracketOpen = null;
-  let bracketClose = null;
-  for (let child = link.firstChild; child; child = child.nextSibling) {
-    if (child.name !== "LinkMark") continue;
-    const mark2 = ctx.state.sliceDoc(child.from, child.to);
-    if (mark2 === "[" && !bracketOpen) bracketOpen = child;
-    else if (mark2 === "]" && !bracketClose) bracketClose = child;
-  }
-  if (!bracketOpen || !bracketClose || bracketClose.from <= bracketOpen.to) return false;
-  return ctx.state.sliceDoc(bracketOpen.to, bracketClose.from).trim() !== "";
+function parentLink(ctx) {
+  return ctx.parentName === "Link" ? ctx.node.parent : null;
 }
 var NODE_RULES = {
   // ----- Structural wrappers (never directly styled) -----
@@ -2111,7 +2199,11 @@ var NODE_RULES = {
   Emphasis: mark("cm-emphasis"),
   StrongEmphasis: mark("cm-strong"),
   InlineCode: mark("cm-inline-code"),
-  Link: mark("cm-link"),
+  // A `Link` node is not yet a link: Lezer emits one for every `[…]`, and the
+  // reference lookup CommonMark requires is left to us. Unresolved, it is the
+  // literal brackets the author typed — most `[…]` in prose, and every optional
+  // argument in a LaTeX block.
+  Link: (ctx) => linkResolves(ctx.node, ctx.state) ? { paint: "mark", className: "cm-link" } : none,
   Image: imageRule,
   // `![alt](src)` → inline `<img>` widget
   // ----- Inline literal sub-nodes (rendered inside their parent) -----
@@ -2121,8 +2213,9 @@ var NODE_RULES = {
   // Bare GFM autolinks and <angle> autolinks emit the SAME node name, and
   // there the URL IS the content — same class of bug when hidden.
   URL: (ctx) => {
-    if (ctx.parentName !== "Link") return { paint: "mark", className: "cm-link" };
-    return linkHasVisibleLabel(ctx) ? { paint: "hide" } : { paint: "mark", className: "cm-link" };
+    const link = parentLink(ctx);
+    if (!link) return { paint: "mark", className: "cm-link" };
+    return linkHasVisibleLabel(link, ctx.state) ? { paint: "hide" } : { paint: "mark", className: "cm-link" };
   },
   LinkLabel: raw("visible inside Link; parent mark styles it"),
   LinkTitle: hideAlways(),
@@ -2153,8 +2246,12 @@ var NODE_RULES = {
   // `*` / `_`
   CodeMark: hideAlways(),
   // backticks for inline / fence pairs for blocks
-  LinkMark: hideAlways(),
-  // `[`/`]`/`(`/`)`
+  // `[`/`]`/`(`/`)` — chrome only where they really are chrome. An unresolved
+  // link's brackets are content, and hiding them rewrote the document on screen.
+  LinkMark: (ctx) => {
+    const link = parentLink(ctx);
+    return link && !linkResolves(link, ctx.state) ? none : { paint: "hide" };
+  },
   QuoteMark: hideAlways(),
   // `>`
   ListMark: listMarkRule,
@@ -2902,20 +2999,6 @@ function slugKey(value) {
   }
   return raw2.split("-").filter(Boolean).join("-");
 }
-var CODE_NODES = /* @__PURE__ */ new Set(["FencedCode", "CodeBlock", "InlineCode"]);
-function viewportTree(view) {
-  return ensureSyntaxTree(view.state, view.viewport.to, 100) ?? syntaxTree(view.state);
-}
-function docTree(state) {
-  return ensureSyntaxTree(state, state.doc.length, 20) ?? syntaxTree(state);
-}
-function inCode(tree, pos) {
-  let node = tree.resolveInner(pos, 1);
-  for (; node; node = node.parent) {
-    if (CODE_NODES.has(node.name)) return true;
-  }
-  return false;
-}
 var WIKILINK_RE = /\[\[([^\]\n]+?)\]\]/g;
 var HIDE = Decoration.replace({});
 var linkMark = Decoration.mark({ class: "cm-wikilink" });
@@ -3073,12 +3156,6 @@ var clickModel = EditorView.domEventHandlers({
 });
 
 // src/codemirror/table/tableInline.ts
-function escapeText(value) {
-  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
-}
-function escapeAttr(value) {
-  return escapeText(value).replace(/"/g, "&quot;");
-}
 function codeText(state, node) {
   let innerFrom = node.from;
   let innerTo = node.to;
@@ -3154,8 +3231,26 @@ function renderRange(state, parent, from, to) {
   if (pos < to) html += state.sliceDoc(pos, to);
   return html;
 }
+function straddlesChild(cell, from, to) {
+  for (let child = cell.firstChild; child; child = child.nextSibling) {
+    if (child.from < from && child.to > from) return true;
+    if (child.from < to && child.to > to) return true;
+  }
+  return false;
+}
 function renderInlineCell(state, cell) {
-  return renderRange(state, cell, cell.from, cell.to).trim();
+  const rules = state.facet(inlineScanRulesFacet);
+  const tree = docTree(state);
+  let html = "";
+  let pos = cell.from;
+  for (const span of scanInline(rules, state.sliceDoc(cell.from, cell.to), cell.from)) {
+    if (span.from < pos) continue;
+    if (inCode(tree, span.from) || inCode(tree, span.to - 1)) continue;
+    if (straddlesChild(cell, span.from, span.to)) continue;
+    html += renderRange(state, cell, pos, span.from) + span.html;
+    pos = span.to;
+  }
+  return (html + renderRange(state, cell, pos, cell.to)).trim();
 }
 
 // src/codemirror/table/tableModel.ts
@@ -3256,8 +3351,9 @@ var CELL_SANITIZE_CONFIG = {
   ALLOWED_ATTR: ["href", "class"],
   RETURN_TRUSTED_TYPE: false
 };
-function renderCellInto(el, source) {
+function renderCellInto(el, source, rules) {
   el.innerHTML = DOMPurify.sanitize(source, CELL_SANITIZE_CONFIG);
+  for (const rule of rules) rule.hydrate?.(el);
 }
 function tableV2Sync(surface) {
   return EditorView.updateListener.of((update) => {
@@ -3268,8 +3364,8 @@ function tableV2Sync(surface) {
 }
 
 // src/codemirror/tablev2/tableWidgetV2.ts
-function fillCell(el, cell, row, col) {
-  renderCellInto(el, cell.html);
+function fillCell(el, cell, row, col, rules) {
+  renderCellInto(el, cell.html, rules);
   el.dataset.row = String(row);
   el.dataset.col = String(col);
   el.dataset.cellFrom = String(cell.from);
@@ -3297,7 +3393,8 @@ var TableWidgetV2 = class extends WidgetType {
   eq(other) {
     return other.sourceFrom === this.sourceFrom && other.sourceTo === this.sourceTo && JSON.stringify(other.data) === JSON.stringify(this.data);
   }
-  toDOM() {
+  toDOM(view) {
+    const rules = view.state.facet(inlineScanRulesFacet);
     const wrap = document.createElement("div");
     wrap.className = "cm-tablev2-wrap cm-table-wrap";
     wrap.dataset.tablev2From = String(this.sourceFrom);
@@ -3308,7 +3405,7 @@ var TableWidgetV2 = class extends WidgetType {
     const headRow = document.createElement("tr");
     this.data.header.forEach((cell, col) => {
       const th = document.createElement("th");
-      fillCell(th, cell, 0, col);
+      fillCell(th, cell, 0, col, rules);
       const align = this.data.alignments[col];
       if (align) th.style.textAlign = align;
       headRow.appendChild(th);
@@ -3320,7 +3417,7 @@ var TableWidgetV2 = class extends WidgetType {
       const tr = document.createElement("tr");
       cells2.forEach((cell, col) => {
         const td = document.createElement("td");
-        fillCell(td, cell, r + 1, col);
+        fillCell(td, cell, r + 1, col, rules);
         const align = this.data.alignments[col];
         if (align) td.style.textAlign = align;
         tr.appendChild(td);
@@ -3331,7 +3428,8 @@ var TableWidgetV2 = class extends WidgetType {
     wrap.appendChild(table);
     return wrap;
   }
-  updateDOM(dom) {
+  updateDOM(dom, view) {
+    const rules = view.state.facet(inlineScanRulesFacet);
     if (dom.dataset.tablev2From === void 0) return false;
     const rows = dom.querySelectorAll("tr");
     if (rows.length !== 1 + this.data.rows.length) return false;
@@ -3345,7 +3443,7 @@ var TableWidgetV2 = class extends WidgetType {
     for (let r = 0; r < grid.length; r++) {
       const cells2 = rows[r].children;
       grid[r].forEach((cell, col) => {
-        fillCell(cells2[col], cell, r, col);
+        fillCell(cells2[col], cell, r, col, rules);
       });
     }
     return true;
@@ -4293,12 +4391,19 @@ var highlightPlugin = ViewPlugin.fromClass(
   }
 );
 
+// src/codemirror/highlight/highlightScanRule.ts
+var highlightScanRule = {
+  name: "highlight",
+  pattern: HIGHLIGHT_RE,
+  render: (match) => `<span class="cm-highlight">${escapeText(match[1] ?? "")}</span>`
+};
+
 // src/codemirror/extensions/highlightExtension.ts
 var highlightExtension = {
   name: "@compose/highlight",
   version: "0.1.0",
   description: "Renders `==text==` with a yellow highlight background.",
-  extensions: [highlightPlugin]
+  extensions: [highlightPlugin, inlineScanRulesFacet.of(highlightScanRule)]
 };
 var FOOTNOTE_REF_RE = /(?<!\])\[\^([^\]\s]+)\](?!:)/g;
 var FOOTNOTE_DEF_LINE_RE = /^\[\^([^\]\s]+)\]:\s/;
@@ -4365,13 +4470,27 @@ var footnotePlugin = ViewPlugin.fromClass(
   }
 );
 
+// src/codemirror/footnote/footnoteScanRule.ts
+var footnoteScanRule = {
+  name: "footnote",
+  pattern: FOOTNOTE_REF_RE,
+  render: (match) => `<span class="cm-footnote-ref">${escapeText(match[1] ?? "")}</span>`
+};
+
 // src/codemirror/extensions/footnoteExtension.ts
 var footnoteExtension = {
   name: "@compose/footnote",
   version: "0.1.0",
   description: "Renders `[^id]` references and `[^id]:` definitions with tooltip jump.",
-  extensions: [footnotePlugin]
+  extensions: [footnotePlugin, inlineScanRulesFacet.of(footnoteScanRule)]
 };
+function renderMathInto(el, tex, displayMode) {
+  try {
+    katex.render(tex, el, { displayMode, throwOnError: false, output: "html" });
+  } catch {
+    el.textContent = tex;
+  }
+}
 var MathWidget = class extends WidgetType {
   constructor(tex, displayMode) {
     super();
@@ -4384,15 +4503,7 @@ var MathWidget = class extends WidgetType {
   toDOM(_view) {
     const span = document.createElement(this.displayMode ? "div" : "span");
     span.className = this.displayMode ? "cm-math-block" : "cm-math-inline";
-    try {
-      katex.render(this.tex, span, {
-        displayMode: this.displayMode,
-        throwOnError: false,
-        output: "html"
-      });
-    } catch {
-      span.textContent = this.tex;
-    }
+    renderMathInto(span, this.tex, this.displayMode);
     return span;
   }
   ignoreEvent() {
@@ -4465,12 +4576,24 @@ var mathPlugin = StateField.define({
   ]
 });
 
+// src/codemirror/math/mathScanRule.ts
+var 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);
+    }
+  }
+};
+
 // src/codemirror/extensions/mathExtension.ts
 var mathExtension = {
   name: "@compose/math",
   version: "0.1.0",
   description: "Renders `$x$` inline and `$$x$$` block math via KaTeX.",
-  extensions: [mathPlugin]
+  extensions: [mathPlugin, inlineScanRulesFacet.of(mathScanRule)]
 };
 
 // src/codemirror/extensions/mermaidExtension.ts
@@ -4778,7 +4901,7 @@ var InlineCellSurface = class {
     }
     const model = modelAt(view.state, s.tableFrom);
     const cell = model ? cellAt(model, s.ref.row, s.ref.col) : null;
-    if (cell) renderCellInto(s.el, cell.html);
+    if (cell) renderCellInto(s.el, cell.html, view.state.facet(inlineScanRulesFacet));
   }
   cancel() {
     const s = this.edit;
@@ -5385,12 +5508,19 @@ function tableExtension() {
   };
 }
 
+// src/codemirror/wikilink/wikilinkScanRule.ts
+var wikilinkScanRule = {
+  name: "wikilink",
+  pattern: WIKILINK_RE,
+  render: (match) => `<span class="cm-wikilink">${escapeText(parseWikilinkBody(match[1] ?? "").label)}</span>`
+};
+
 // src/codemirror/extensions/wikilinkExtension.ts
 var wikilinkExtension = {
   name: "@compose/wikilink",
   version: "0.1.0",
   description: "Renders `[[target]]` / `[[target|alias]]` as clickable links.",
-  extensions: [wikilinkPlugin]
+  extensions: [wikilinkPlugin, inlineScanRulesFacet.of(wikilinkScanRule)]
 };
 var programmaticSwap = Annotation.define();
 var AUTOSAVE_DEBOUNCE_MS = 500;
@@ -5799,6 +5929,6 @@ function CodeMirrorMarkdownEditorInner({
 }
 var CodeMirrorMarkdownEditor = memo(CodeMirrorMarkdownEditorInner);
 
-export { CodeMirrorMarkdownEditor, IMAGE_EDIT_ALT_EVENT, blockCommands, buildImageMarkdown, composeExtensions, computeFileDir, defaultResolveImageSrc, dirnamePath, editorBaseTheme, extractImageBlobs, extractImageFiles, footnoteExtension, formatCommands, getCachedMermaidPng, hasUriScheme, headingLine, hideAlways, highlightExtension, highlightFenceSpans, imageInsertHandlers, insertImageBlob, isAbsolutePath, isMermaidFenceInfo, joinPath, line, mark, markdownDecorationsPlugin, mathExtension, mermaidExtension, nodeRulesFacet, onEditorUpdate, parseFrontmatter, parseWikilinkBody, pickImageFileForCaret, raw, renderMermaidToSvg, resolveWikilinkTarget, resolveWorkspaceLink, serializeMarkdown, setFrontmatterField, showImageActionMenu, structural, tableExtension, treeAt, warmMermaidPng, wikilinkExtension };
+export { CodeMirrorMarkdownEditor, IMAGE_EDIT_ALT_EVENT, blockCommands, buildImageMarkdown, composeExtensions, computeFileDir, defaultResolveImageSrc, dirnamePath, editorBaseTheme, escapeAttr, escapeText, extractImageBlobs, extractImageFiles, footnoteExtension, formatCommands, getCachedMermaidPng, hasUriScheme, headingLine, hideAlways, highlightExtension, highlightFenceSpans, imageInsertHandlers, inlineScanRulesFacet, insertImageBlob, isAbsolutePath, isMermaidFenceInfo, joinPath, line, mark, markdownDecorationsPlugin, mathExtension, mermaidExtension, nodeRulesFacet, onEditorUpdate, parseFrontmatter, parseWikilinkBody, pickImageFileForCaret, raw, renderMermaidToSvg, resolveWikilinkTarget, resolveWorkspaceLink, scanInline, serializeMarkdown, setFrontmatterField, showImageActionMenu, structural, tableExtension, treeAt, warmMermaidPng, wikilinkExtension };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map