@openmarkdown-dev/editor 0.1.0 → 0.1.1

package/README.md

@@ -16,8 +16,8 @@ const editor = mountEditor(document.getElementById("editor")!, createEditorState
 const bytes = saveMarkdownFile(editor.getDoc(), file); // unedited: the file's own bytes
 ```
 
+- **Lossless round-trip:** open a Markdown file and save it without editing, and the file is byte-for-byte what it was. What an edit may rewrite is listed under [Fidelity](#fidelity), and the [fidelity page](https://openmarkdown.dev/editor/docs/fidelity/) has a check you can run yourself.
 - **Live preview:** headings, lists, tables, math, Mermaid diagrams, callouts and YAML properties render in place; the Markdown shows under the caret.
-- **Your file stays yours:** open and save without editing, and the file is byte-for-byte what it was.
 - **Tables in place:** edit a cell where it is drawn.
 - **Images:** paste or drop them in, drag a corner to resize.
 - **Framework-free:** plain TypeScript and DOM. Works with React, Vue, Svelte or nothing. Not build-free: with no bundler, [self-host it](https://github.com/OpenMarkdown-dev/OpenMarkdown-editor/blob/main/docs/guides/self-hosting.md).

package/dist/editor.js

@@ -1377,6 +1377,16 @@ function tableArrowNav(p, row, col, dir) {
 function flattenCellInsert(text) {
   return text.replace(/\r?\n/g, " ");
 }
+function tableCellInsert(text, before) {
+  let run = /\\*$/.exec(before)[0].length;
+  let out = "";
+  for (const ch of flattenCellInsert(text)) {
+    if (ch === "|" && run % 2 === 0) out += "\\";
+    out += ch;
+    run = ch === "\\" ? run + 1 : 0;
+  }
+  return out;
+}
 function tableRangeAt(state, pos) {
   for (const bias of [-1, 1]) {
     let node = treeUpTo(state, pos).resolveInner(pos, bias);
@@ -3930,18 +3940,7 @@ function buildPartEditor(outer, text, hooks, opts = {}) {
             }
           })
         ),
-        opts.singleLine ? EditorState.transactionFilter.of((tr) => {
-          let broken = false;
-          tr.changes.iterChanges((_a, _b, _c, _d, inserted) => {
-            if (/\r?\n/.test(inserted.toString())) broken = true;
-          });
-          if (!broken) return tr;
-          const changes = [];
-          tr.changes.iterChanges((fromA, toA, _b, _c, inserted) => {
-            changes.push({ from: fromA, to: toA, insert: flattenCellInsert(inserted.toString()) });
-          });
-          return { changes, selection: tr.selection, userEvent: tr.annotation(Transaction.userEvent) };
-        }) : [],
+        opts.accept ? acceptFilter(opts.accept) : [],
         EditorView.updateListener.of((u) => {
           if (!u.docChanged) return;
           if (u.transactions.some((t) => t.annotation(reseed))) return;
@@ -3966,7 +3965,7 @@ function buildPartEditor(outer, text, hooks, opts = {}) {
     })
   });
   parts.set(host, view);
-  setTimeout(() => {
+  queueMicrotask(() => {
     if (!host.isConnected) return;
     const selection = entrySelection(opts.caret, view.state.doc.length, pointerPlaced);
     if (!selection) return;
@@ -3993,6 +3992,29 @@ function reseedPart(view, text) {
     annotations: reseed.of(true)
   });
 }
+function acceptFilter(accept) {
+  return EditorState.transactionFilter.of((tr) => {
+    if (!tr.docChanged) return tr;
+    const changes = [];
+    let rewritten = false;
+    tr.changes.iterChanges((fromA, toA, _b, _c, inserted) => {
+      const text = inserted.toString();
+      const ok = accept(text, tr.startState.sliceDoc(0, fromA));
+      if (ok !== text) rewritten = true;
+      changes.push({ from: fromA, to: toA, insert: ok });
+    });
+    if (!rewritten) return tr;
+    const next = tr.startState.changes(changes);
+    const back = tr.changes.invert(tr.startState.doc);
+    const selection = tr.selection ? EditorSelection.create(
+      tr.selection.ranges.map(
+        (r) => EditorSelection.range(next.mapPos(back.mapPos(r.anchor, -1), 1), next.mapPos(back.mapPos(r.head, -1), 1))
+      ),
+      tr.selection.mainIndex
+    ) : void 0;
+    return { changes: next, selection, userEvent: tr.annotation(Transaction.userEvent) };
+  });
+}
 function headText(doc) {
   const n = Math.min(doc.lines, 100);
   return doc.sliceString(0, doc.line(n).to);
@@ -4198,7 +4220,7 @@ class PropertiesWidget extends WidgetType {
         },
         onKey: (e) => this.onKey(e, view, index, part)
       },
-      { singleLine: true, caret: view.state.field(activePropField, false)?.caret }
+      { accept: flattenCellInsert, caret: view.state.field(activePropField, false)?.caret }
     );
     return host;
   }
@@ -4408,6 +4430,29 @@ const undoLanding = ViewPlugin.define((view) => ({
     if (land) queueMicrotask(() => settleLanding(view, u.state, land));
   }
 }));
+function strandedIn(state) {
+  const hooks = state.facet(blockCaret);
+  if (!hooks) return null;
+  const sel = state.selection.main;
+  if (!sel.empty) return null;
+  const pos = sel.head;
+  const block = hooks.editable(state).find((b) => b.from < pos && pos < b.to);
+  if (!block || hooks.leave(state).length > 0) return null;
+  return { block, pos };
+}
+const strandedCaret = ViewPlugin.define((view) => ({
+  update(u) {
+    if (!u.docChanged && !u.selectionSet) return;
+    if (u.transactions.some((tr) => tr.isUserEvent("undo") || tr.isUserEvent("redo"))) return;
+    if (!strandedIn(u.state)) return;
+    queueMicrotask(() => {
+      if (!view.dom.isConnected || view.state !== u.state || view.composing) return;
+      const hit = strandedIn(view.state);
+      const hooks = view.state.facet(blockCaret);
+      if (hit && hooks) hooks.enterAt(view, hit.block, hit.pos);
+    });
+  }
+}));
 function navigateTo(view, pos) {
   const line = view.state.doc.lineAt(Math.max(0, Math.min(pos, view.state.doc.length)));
   view.dispatch({
@@ -4876,7 +4921,7 @@ class TableWidget extends WidgetType {
         },
         onKey: (e, part) => this.onCellKey(e, view, part, row, col)
       },
-      { singleLine: true, caret }
+      { accept: tableCellInsert, caret }
     );
     if (align && align !== "none") host.style.textAlign = align;
     return host;
@@ -7295,6 +7340,7 @@ function buildEditorState(options, loadMermaid2) {
       // Undo / redo land at the change, not at history's old caret (spec:
       // caret-rules R2 / R2a / R2b) — one filter for every undo entry point.
       undoLanding,
+      strandedCaret,
       drawSelection(),
       // Drop caret: draws a cursor at the drop position while dragging over the
       // editor, so a sidebar file drag (sidebar-drag-link) shows exactly where

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmarkdown-dev/editor",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "A live-preview Markdown editor on CodeMirror 6 that edits the Markdown source itself, for a lossless round-trip: open and save without editing, and the file is byte-for-byte what it was.",
   "license": "MIT",
   "type": "module",
@@ -33,6 +33,7 @@
     "markdown-editor",
     "editor",
     "codemirror",
+    "codemirror-6",
     "live-preview",
     "wysiwyg",
     "embeddable",