@type32/codemirror-rich-obsidian-editor 0.0.3

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseLatexCodemirrorViewPlugin.js

@@ -0,0 +1,160 @@
+import { EditorView, ViewPlugin, Decoration } from "@codemirror/view";
+import { syntaxTree } from "@codemirror/language";
+import { StateField } from "@codemirror/state";
+import { BlockLatexWidget, InlineLatexWidget } from "../codemirror-widgets/proseLatexWidgets.js";
+import { cursorSelectionCoveredNode, toCursorNodePositions } from "../../utility/tools.js";
+function decorate(state) {
+  const decorations = [];
+  const tree = syntaxTree(state);
+  const cursor = state.selection.main;
+  tree.iterate({
+    enter: (node) => {
+      if (node.name === "TexBlock") {
+        const isNodeRangeActive = (nodeFrom, nodeTo) => {
+          if (cursor.empty) {
+            return cursor.from >= nodeFrom && cursor.from <= nodeTo;
+          } else {
+            return Math.max(nodeFrom, cursor.from) < Math.min(nodeTo, cursor.to);
+          }
+        };
+        const poses = toCursorNodePositions(state, node);
+        if (isNodeRangeActive(node.from, node.to) || cursorSelectionCoveredNode(poses.cursorFrom, poses.cursorTo, poses.nodeFrom, poses.nodeTo)) {
+          return;
+        }
+        const content = state.doc.sliceString(node.from + 2, node.to - 2);
+        const nodeText = state.doc.sliceString(node.from, node.to);
+        const hasLineBreaks = nodeText.includes("\n");
+        if (hasLineBreaks) {
+          decorations.push(Decoration.mark({ class: "cm-hidden-latex" }).range(node.from, node.to));
+          const line = state.doc.lineAt(node.to);
+          const widget = Decoration.widget({
+            widget: new BlockLatexWidget(content),
+            block: true,
+            side: 1
+          });
+          decorations.push(widget.range(line.to));
+        } else {
+          const deco = Decoration.replace({
+            widget: new BlockLatexWidget(content)
+          });
+          decorations.push(deco.range(node.from, node.to));
+        }
+      }
+    }
+  });
+  return Decoration.set(decorations);
+}
+function decorateInline(view) {
+  const decorations = [];
+  const tree = syntaxTree(view.state);
+  const cursor = view.state.selection.main;
+  tree.iterate({
+    enter: (node) => {
+      if (node.name === "TexInline") {
+        const isNodeRangeActive = (nodeFrom, nodeTo) => {
+          if (cursor.empty) {
+            return cursor.from >= nodeFrom && cursor.from <= nodeTo;
+          } else {
+            return Math.max(nodeFrom, cursor.from) < Math.min(nodeTo, cursor.to);
+          }
+        };
+        if (isNodeRangeActive(node.from, node.to)) {
+          return;
+        }
+        const content = view.state.doc.sliceString(node.from + 1, node.to - 1);
+        const deco = Decoration.replace({
+          widget: new InlineLatexWidget(content)
+        });
+        decorations.push(deco.range(node.from, node.to));
+      }
+    }
+  });
+  return Decoration.set(decorations);
+}
+const latexBlockPlugin = StateField.define({
+  create(state) {
+    return decorate(state);
+  },
+  update(value, tr) {
+    if (tr.docChanged || tr.selection) {
+      return decorate(tr.state);
+    }
+    return value.map(tr.changes);
+  },
+  provide: (f) => EditorView.decorations.from(f)
+});
+const latexInlinePlugin = ViewPlugin.fromClass(
+  class {
+    decorations;
+    constructor(view) {
+      this.decorations = this.buildDecorations(view);
+    }
+    update(update) {
+      if (update.docChanged) {
+        this.decorations = this.decorations.map(update.changes);
+        update.changes.iterChangedRanges((fromA, toA, fromB, toB) => {
+          const newWidgets = this.buildDecorationsForRange(
+            update.view,
+            fromB,
+            toB
+          );
+          this.decorations = this.decorations.update({
+            filter: (f, t) => f < fromB || t > toB,
+            add: newWidgets,
+            sort: true
+          });
+        });
+      } else if (update.viewportChanged || update.selectionSet) {
+        this.decorations = this.buildDecorations(update.view);
+      }
+    }
+    buildDecorations(view) {
+      const decorations = [];
+      for (const { from, to } of view.visibleRanges) {
+        decorations.push(...this.buildDecorationsForRange(view, from, to));
+      }
+      return Decoration.set(decorations);
+    }
+    buildDecorationsForRange(view, from, to) {
+      const decorations = [];
+      const tree = syntaxTree(view.state);
+      const cursor = view.state.selection.main;
+      tree.iterate({
+        from,
+        to,
+        enter: (node) => {
+          if (node.name === "TexInline") {
+            const isNodeRangeActive = (nodeFrom, nodeTo) => {
+              if (cursor.empty) {
+                return cursor.from >= nodeFrom && cursor.from <= nodeTo;
+              } else {
+                return Math.max(nodeFrom, cursor.from) < Math.min(nodeTo, cursor.to);
+              }
+            };
+            if (isNodeRangeActive(node.from, node.to)) {
+              return;
+            }
+            const content = view.state.doc.sliceString(
+              node.from + 1,
+              node.to - 1
+            );
+            const deco = Decoration.replace({
+              widget: new InlineLatexWidget(content)
+            });
+            decorations.push(deco.range(node.from, node.to));
+          }
+        }
+      });
+      return decorations;
+    }
+  },
+  {
+    decorations: (v) => v.decorations
+  }
+);
+export function proseLatexCodemirrorViewPlugin() {
+  return [
+    latexBlockPlugin,
+    latexInlinePlugin
+  ];
+}

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseLinkCodemirrorViewPlugin.d.ts

@@ -0,0 +1,3 @@
+import { type DecorationSet } from '@codemirror/view';
+import { StateField } from '@codemirror/state';
+export declare const proseLinkCodemirrorViewPlugin: StateField<DecorationSet>;

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseLinkCodemirrorViewPlugin.js

@@ -0,0 +1,98 @@
+import { Decoration, EditorView } from "@codemirror/view";
+import { StateField, RangeSet } from "@codemirror/state";
+import { syntaxTree } from "@codemirror/language";
+import { cursorSelectionCoveredNode, isNodeRangeActive, toCursorNodePositions } from "../../utility/tools.js";
+import { ProseVueComponentEmbedWidget } from "../codemirror-widgets/proseVueComponentEmbedWidget.js";
+import ImageEmbedComponent from "../../../components/Editor/ImageEmbedComponent.vue";
+function buildLinkDecorations(state) {
+  const decorations = [];
+  const widgets = [];
+  syntaxTree(state).iterate({
+    enter({ node }) {
+      if (node.name === "Image") {
+        const poses = toCursorNodePositions(state, node);
+        const isActive = isNodeRangeActive(state, node.from, node.to) || cursorSelectionCoveredNode(poses.cursorFrom, poses.cursorTo, poses.nodeFrom, poses.nodeTo);
+        if (!isActive) {
+          const urlNode = node.getChild("URL");
+          if (urlNode) {
+            const url = state.doc.sliceString(urlNode.from, urlNode.to);
+            decorations.push(Decoration.replace({
+              widget: new ProseVueComponentEmbedWidget(ImageEmbedComponent, { filePath: url }, node.from),
+              block: true
+            }).range(node.from, node.to));
+          }
+        }
+        return false;
+      }
+      if (node.name === "Link") {
+        const poses = toCursorNodePositions(state, node);
+        const isActive = isNodeRangeActive(state, node.from, node.to) || cursorSelectionCoveredNode(poses.cursorFrom, poses.cursorTo, poses.nodeFrom, poses.nodeTo);
+        if (!isActive) {
+          const allMarks = node.getChildren("LinkMark");
+          const urlNode = node.getChild("URL");
+          const openBracket = allMarks.find((m) => state.doc.sliceString(m.from, m.to) === "[");
+          const closeBracket = allMarks.find((m) => state.doc.sliceString(m.from, m.to) === "]");
+          if (urlNode && openBracket && closeBracket) {
+            const linkTextStart = openBracket.to;
+            const linkTextEnd = closeBracket.from;
+            const url = state.doc.sliceString(urlNode.from, urlNode.to);
+            const text = state.doc.sliceString(linkTextStart, linkTextEnd);
+            const linkAttributes = {
+              "href": url,
+              "target": "_blank",
+              "class": "cm-clickable-link",
+              "data-external-link": "true",
+              "data-url": url,
+              "data-text": text
+            };
+            decorations.push(Decoration.replace({}).range(node.from, linkTextStart));
+            decorations.push(Decoration.replace({}).range(linkTextEnd, node.to));
+            decorations.push(Decoration.mark({
+              tagName: "a",
+              attributes: linkAttributes
+            }).range(linkTextStart, linkTextEnd));
+            return false;
+          }
+        }
+        return false;
+      }
+      if (node.name === "URL") {
+        const url = state.doc.sliceString(node.from, node.to);
+        const isImage = /\.(png|jpg|jpeg|gif|svg|webp)$/i.test(url) || url.includes("picsum.photos");
+        if (isImage) {
+          const line = state.doc.lineAt(node.from);
+          widgets.push(Decoration.widget({
+            widget: new ProseVueComponentEmbedWidget(ImageEmbedComponent, { filePath: url }, node.from),
+            block: true,
+            side: 1
+          }).range(line.to));
+        }
+        if (!isNodeRangeActive(state, node.from, node.to)) {
+          decorations.push(Decoration.mark({
+            tagName: "a",
+            attributes: {
+              href: url,
+              target: "_blank",
+              class: "cm-clickable-link",
+              "data-external-link": "true",
+              "data-url": url
+            }
+          }).range(node.from, node.to));
+        }
+      }
+    }
+  });
+  return [...decorations, ...widgets];
+}
+export const proseLinkCodemirrorViewPlugin = StateField.define({
+  create(state) {
+    return RangeSet.of(buildLinkDecorations(state), true);
+  },
+  update(value, tr) {
+    if (tr.docChanged || tr.selection) {
+      return RangeSet.of(buildLinkDecorations(tr.state), true);
+    }
+    return value.map(tr.changes);
+  },
+  provide: (f) => EditorView.decorations.from(f)
+});

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseQuoteblockCodemirrorViewPlugin.d.ts

@@ -0,0 +1,3 @@
+import { StateField } from '@codemirror/state';
+import type { DecorationSet } from '@codemirror/view';
+export declare const proseQuoteblockCodemirrorViewPlugin: StateField<DecorationSet>;

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseQuoteblockCodemirrorViewPlugin.js

@@ -0,0 +1,76 @@
+import { Decoration, EditorView } from "@codemirror/view";
+import { StateField, RangeSet } from "@codemirror/state";
+import { syntaxTree } from "@codemirror/language";
+import { cursorSelectionCoveredNode } from "../../utility/tools.js";
+function isCursorOnLine(state, lineStart, lineEnd) {
+  const cursor = state.selection.main;
+  return cursor.from >= lineStart && cursor.from <= lineEnd;
+}
+function buildQuoteblockDecorations(state) {
+  const decorations = [];
+  syntaxTree(state).iterate({
+    enter(node) {
+      if (node.name === "Blockquote") {
+        const firstLine = state.doc.lineAt(node.from);
+        const lastLine = state.doc.lineAt(node.to);
+        const lineCount = lastLine.number - firstLine.number + 1;
+        const [cursor] = state.selection.ranges;
+        const cursorFrom = cursor?.from || 0, cursorTo = cursor?.to || 0, nodeFrom = node.from || 0, nodeTo = node.to || 0;
+        for (let i = firstLine.number; i <= lastLine.number; i++) {
+          const line = state.doc.line(i);
+          let lineClass = "cm-quoteblock";
+          if (lineCount === 1) {
+            lineClass += " cm-quoteblock-single";
+          } else if (i === firstLine.number) {
+            lineClass += " cm-quoteblock-start";
+          } else if (i === lastLine.number) {
+            lineClass += " cm-quoteblock-end";
+          } else {
+            lineClass += " cm-quoteblock-middle";
+          }
+          decorations.push(
+            Decoration.line({
+              attributes: { class: lineClass }
+            }).range(line.from)
+          );
+          const isCursorActive = isCursorOnLine(state, line.from, line.to) || cursorSelectionCoveredNode(cursorFrom, cursorTo, nodeFrom, nodeTo);
+          const lineText = line.text;
+          const markMatch = lineText.match(/^(\s*>+)/);
+          if (markMatch) {
+            const markEnd = line.from + markMatch[0].length;
+            let markClass = "cm-formatting cm-formatting-quote cm-meta";
+            if (isCursorActive) {
+              markClass += " cm-formatting-quote-active";
+            }
+            decorations.push(
+              Decoration.mark({
+                class: markClass
+              }).range(line.from, markEnd)
+            );
+            if (markEnd < line.to) {
+              decorations.push(
+                Decoration.mark({
+                  class: "cm-quote"
+                }).range(markEnd, line.to)
+              );
+            }
+          }
+        }
+        return false;
+      }
+    }
+  });
+  return decorations;
+}
+export const proseQuoteblockCodemirrorViewPlugin = StateField.define({
+  create(state) {
+    return RangeSet.of(buildQuoteblockDecorations(state), true);
+  },
+  update(value, tr) {
+    if (tr.docChanged || tr.selection) {
+      return RangeSet.of(buildQuoteblockDecorations(tr.state), true);
+    }
+    return value.map(tr.changes);
+  },
+  provide: (f) => EditorView.decorations.from(f)
+});

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseTaskListPlugin.d.ts

@@ -0,0 +1,8 @@
+import { EditorView, ViewPlugin, ViewUpdate } from '@codemirror/view';
+import { StateField } from '@codemirror/state';
+export declare const editorLivePreviewField: StateField<boolean>;
+export declare const proseTaskListPlugin: ViewPlugin<{
+    decorations: import("@codemirror/view").DecorationSet;
+    update(update: ViewUpdate): void;
+    buildDecorations(view: EditorView): import("@codemirror/view").DecorationSet;
+}, undefined>;

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseTaskListPlugin.js

@@ -0,0 +1,106 @@
+import { Decoration, ViewPlugin, WidgetType } from "@codemirror/view";
+import { StateField } from "@codemirror/state";
+import { syntaxTree } from "@codemirror/language";
+import { isCursorInRange } from "../../utility/tools.js";
+export const editorLivePreviewField = StateField.define({
+  create: () => true,
+  update: (value) => value
+});
+class CheckboxWidget extends WidgetType {
+  constructor(checked, from, to) {
+    super();
+    this.checked = checked;
+    this.from = from;
+    this.to = to;
+  }
+  eq(other) {
+    return other.checked === this.checked && other.from === this.from && other.to === this.to;
+  }
+  toDOM(view) {
+    const checkbox = document.createElement("div");
+    checkbox.classList.add("cm-task-checkbox-wrapper");
+    if (this.checked && this.checked.toLowerCase() === "x") {
+      checkbox.dataset.checked = "true";
+    } else if (this.checked && this.checked !== " ") {
+      checkbox.dataset.special = this.checked;
+      checkbox.innerText = this.checked;
+    } else {
+      checkbox.dataset.checked = "false";
+    }
+    checkbox.onclick = (event) => {
+      event.preventDefault();
+      const isChecked = checkbox.dataset.checked === "true";
+      const char = checkbox.dataset.special ? " " : !isChecked ? "x" : " ";
+      view.dispatch({
+        changes: {
+          from: this.from + 1,
+          to: this.to - 1,
+          insert: char
+        }
+      });
+    };
+    return checkbox;
+  }
+}
+export const proseTaskListPlugin = ViewPlugin.fromClass(
+  class {
+    decorations = Decoration.none;
+    constructor(view) {
+      this.decorations = this.buildDecorations(view);
+    }
+    update(update) {
+      if (update.docChanged || update.viewportChanged || update.selectionSet) {
+        this.decorations = this.buildDecorations(update.view);
+      }
+    }
+    buildDecorations(view) {
+      const decorations = /* @__PURE__ */ new Set();
+      const { state } = view;
+      const isLivePreview = state.field(editorLivePreviewField);
+      for (const { from, to } of view.visibleRanges) {
+        syntaxTree(state).iterate({
+          from,
+          to,
+          enter: (node) => {
+            if (node.type.name !== "Task") return;
+            const { from: nodeFrom, to: nodeTo } = node;
+            const listItem = node.node.parent;
+            if (!listItem || listItem.type.name !== "ListItem") return;
+            const listMark = listItem.getChild("ListMark");
+            if (!listMark) return;
+            const taskMarker = node.node.getChild("TaskMarker");
+            if (!taskMarker) return;
+            const checkedChar = state.doc.sliceString(
+              taskMarker.from + 1,
+              taskMarker.to - 1
+            );
+            const isChecked = checkedChar && checkedChar.toLowerCase() === "x";
+            if (isChecked) {
+              const line = state.doc.lineAt(listItem.from);
+              decorations.add(
+                Decoration.line({
+                  attributes: { class: "cm-task-checked" }
+                }).range(line.from)
+              );
+            }
+            if (isLivePreview && (isCursorInRange(state, [listMark.from, listMark.to]) || isCursorInRange(state, [taskMarker.from, taskMarker.to])))
+              return;
+            decorations.add(
+              Decoration.replace({
+                widget: new CheckboxWidget(
+                  state.doc.sliceString(taskMarker.from + 1, taskMarker.to - 1),
+                  taskMarker.from,
+                  taskMarker.to
+                )
+              }).range(listMark.from, taskMarker.to)
+            );
+          }
+        });
+      }
+      return Decoration.set([...decorations]);
+    }
+  },
+  {
+    decorations: (value) => value.decorations
+  }
+);

package/dist/runtime/editor/plugins/codemirror-widgets/proseCalloutWidget.d.ts

@@ -0,0 +1,13 @@
+import { WidgetType } from '@codemirror/view';
+import type { EditorView } from '@codemirror/view';
+export declare class CalloutWidget extends WidgetType {
+    private sourceNodeFrom;
+    private sourceNodeTo;
+    private rawContent;
+    constructor(sourceNodeFrom: number, sourceNodeTo: number);
+    private findParentBlockquote;
+    private extractDetails;
+    toDOM(view: EditorView): HTMLElement;
+    eq(other: CalloutWidget): boolean;
+    ignoreEvent(event: Event): boolean;
+}

package/dist/runtime/editor/plugins/codemirror-widgets/proseCalloutWidget.js

@@ -0,0 +1,87 @@
+import { WidgetType } from "@codemirror/view";
+import { syntaxTree } from "@codemirror/language";
+import MarkdownIt from "markdown-it";
+import markdownItObsidianCallouts from "markdown-it-obsidian-callouts";
+const md = new MarkdownIt({ html: true }).use(markdownItObsidianCallouts);
+export class CalloutWidget extends WidgetType {
+  constructor(sourceNodeFrom, sourceNodeTo) {
+    super();
+    this.sourceNodeFrom = sourceNodeFrom;
+    this.sourceNodeTo = sourceNodeTo;
+  }
+  rawContent = "";
+  findParentBlockquote(node) {
+    let current = node;
+    while (current) {
+      if (current.name === "Blockquote") {
+        return current;
+      }
+      current = current.parent;
+    }
+    return null;
+  }
+  extractDetails(view) {
+    const state = view.state;
+    const calloutNode = syntaxTree(state).resolve(this.sourceNodeFrom, 1);
+    const parentBlockquote = this.findParentBlockquote(calloutNode);
+    if (parentBlockquote) {
+      this.rawContent = view.state.doc.sliceString(parentBlockquote.from, parentBlockquote.to);
+    }
+  }
+  toDOM(view) {
+    this.extractDetails(view);
+    const renderedHtml = md.render(this.rawContent);
+    const tempDiv = document.createElement("div");
+    tempDiv.innerHTML = renderedHtml;
+    const calloutEl = tempDiv.querySelector(".callout");
+    if (!calloutEl) {
+      const fallback = document.createElement("div");
+      fallback.className = `cm-callout-widget callout callout-error`;
+      fallback.textContent = "Error rendering callout";
+      return fallback;
+    }
+    calloutEl.classList.add("cm-callout-widget");
+    calloutEl.setAttribute("contenteditable", "false");
+    const editButton = document.createElement("div");
+    editButton.className = "edit-block-button";
+    editButton.setAttribute("aria-label", "Edit this block");
+    editButton.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m18 16 4-4-4-4"></path><path d="m6 8-4 4 4 4"></path><path d="m14.5 4-5 16"></path></svg>`;
+    editButton.onmousedown = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+    };
+    editButton.onclick = (e) => {
+      e.stopPropagation();
+      const parentBlockquote = this.findParentBlockquote(syntaxTree(view.state).resolve(this.sourceNodeFrom, 1));
+      if (parentBlockquote) {
+        view.dispatch({ selection: { anchor: parentBlockquote.from } });
+        view.focus();
+      }
+    };
+    const titleDiv = calloutEl.querySelector(".callout-title");
+    if (titleDiv) {
+      const foldDiv = calloutEl.querySelector(".callout-fold");
+      if (foldDiv) {
+        const foldIcon = document.createElement("svg");
+        foldIcon.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-left-icon lucide-chevron-left"><path d="m15 18-6-6 6-6"/></svg>`;
+        foldDiv.appendChild(foldIcon);
+      }
+      titleDiv.appendChild(editButton);
+    } else {
+      calloutEl.prepend(editButton);
+    }
+    return calloutEl;
+  }
+  eq(other) {
+    return other.sourceNodeFrom === this.sourceNodeFrom && other.sourceNodeTo === this.sourceNodeTo && other.rawContent === this.rawContent;
+  }
+  ignoreEvent(event) {
+    if (event.type === "click" || event.type === "mousedown") {
+      const target = event.target;
+      if (target.closest(".edit-block-button") || target.closest(".callout-fold")) {
+        return true;
+      }
+    }
+    return false;
+  }
+}

package/dist/runtime/editor/plugins/codemirror-widgets/proseCodeBlockWidgets.d.ts

@@ -0,0 +1,15 @@
+import { WidgetType } from '@codemirror/view';
+import type { EditorView } from '@codemirror/view';
+export declare class LanguageFlairWidget extends WidgetType {
+    private lang;
+    private codeContent;
+    private button;
+    constructor(lang: string, codeContent: string);
+    toDOM(view: EditorView): HTMLElement;
+    eq(other: LanguageFlairWidget): boolean;
+    ignoreEvent(event: Event): boolean;
+}
+export declare class EndFenceWidget extends WidgetType {
+    toDOM(view: EditorView): HTMLElement;
+    ignoreEvent(): boolean;
+}

package/dist/runtime/editor/plugins/codemirror-widgets/proseCodeBlockWidgets.js

@@ -0,0 +1,53 @@
+import { WidgetType } from "@codemirror/view";
+export class LanguageFlairWidget extends WidgetType {
+  constructor(lang, codeContent) {
+    super();
+    this.lang = lang;
+    this.codeContent = codeContent;
+  }
+  button = null;
+  toDOM(view) {
+    const widgetRoot = document.createElement("div");
+    widgetRoot.className = "cm-codeblock-flair-container";
+    widgetRoot.setAttribute("contenteditable", "false");
+    this.button = document.createElement("button");
+    this.button.className = "cm-codeblock-copy-button";
+    this.button.textContent = this.lang || "";
+    this.button.onclick = (event) => {
+      event.stopPropagation();
+      navigator.clipboard.writeText(this.codeContent).then(() => {
+        if (this.button) {
+          this.button.disabled = true;
+          setTimeout(() => {
+            if (this.button) {
+              this.button.disabled = false;
+            }
+          }, 1500);
+        }
+      }).catch((err) => {
+        console.error("Failed to copy code to clipboard:", err);
+      });
+    };
+    widgetRoot.appendChild(this.button);
+    return widgetRoot;
+  }
+  eq(other) {
+    return other.lang === this.lang && other.codeContent === this.codeContent;
+  }
+  ignoreEvent(event) {
+    if ((event.type === "mousedown" || event.type === "click") && this.button && this.button.contains(event.target)) {
+      return true;
+    }
+    return false;
+  }
+}
+export class EndFenceWidget extends WidgetType {
+  toDOM(view) {
+    const div = document.createElement("div");
+    div.className = "hidden";
+    return div;
+  }
+  ignoreEvent() {
+    return true;
+  }
+}

package/dist/runtime/editor/plugins/codemirror-widgets/proseLatexWidgets.d.ts

@@ -0,0 +1,11 @@
+import { type EditorView, WidgetType } from "@codemirror/view";
+export declare class InlineLatexWidget extends WidgetType {
+    private readonly content;
+    constructor(content: string);
+    toDOM(view: EditorView): HTMLElement;
+}
+export declare class BlockLatexWidget extends WidgetType {
+    private readonly content;
+    constructor(content: string);
+    toDOM(view: EditorView): HTMLElement;
+}