@panphora/clayjs 1.25.0 → 1.26.0

package/src/page/editor.js

@@ -707,6 +707,11 @@ function checkboxClick(view, event) {
   return true;
 }
 
+function pageTopInset(doc, least) {
+  const padding = parseFloat(doc.defaultView?.getComputedStyle(doc.documentElement).scrollPaddingTop);
+  return Number.isFinite(padding) ? Math.max(least, padding) : least;
+}
+
 // Mounts the editor in `mount`, inside a .blockeditor-shell wrapper (the surface a
 // theme styles). `onChange(record)` gets the block record (blockMap) after
 // every transaction that changed the document.
@@ -743,10 +748,11 @@ export function createPageEditor(mount, { blocks = null, onChange = null, upload
   view = new pmView.EditorView(shell, {
     state: blockeditorState(blocks, { upload, highlight, doc: initialDoc, history: useHistory, undo, redo, onAiTool, mediaNote, toolHost, features, commandHost }),
     attributes: { class: "blockeditor-editor" },
-    // The phone keeps a fixed bar and the plus and grip at the bottom: a caret scrolled into
-    // view stops clear of them.
-    scrollMargin: { top: 16, bottom: 96, left: 5, right: 5 },
-    scrollThreshold: { top: 16, bottom: 96, left: 0, right: 0 },
+    // The phone keeps a fixed bar and the plus and grip at the bottom, and a page with a
+    // sticky header declares its height as scroll-padding-top: a caret scrolled into view
+    // stops clear of both.
+    scrollMargin: { get top() { return pageTopInset(doc, 16); }, bottom: 96, left: 5, right: 5 },
+    scrollThreshold: { get top() { return pageTopInset(doc, 16); }, bottom: 96, left: 0, right: 0 },
     editable: () => editable,
     nodeViews,
     handleDOMEvents: {

package/src/page/history-intent.js

@@ -1,5 +1,5 @@
-// Typing joins one undo item the way it does in other editors: Mod-z removes the last
-// word typed, not the last letter. Only the editor's own input path marks a
+// Typing joins one undo item per sentence, the same as every other field on the page:
+// Mod-z removes the last sentence typed, not the last letter or word. Only the editor's own input path marks a
 // transaction; a command or a programmatic dispatch stays one undo item by itself.
 import { state } from "../vendor/prosemirror.vendor.js";
 import { STEP } from "./blocks.js";
@@ -14,15 +14,28 @@ const blockIdAt = (doc, pos) => {
 
 const markKey = (st) => (st.storedMarks ?? st.selection.$from.marks()).map((m) => `${m.type.name}:${JSON.stringify(m.attrs)}`).sort().join(",");
 
+// A sentence ends at a space typed right after ., ? or ! (closing quotes and brackets
+// allowed between). The space belongs to the sentence it ends, so the step closes after it.
+// A second space, or a space after a space, is not a new sentence. The rule is hyper-undo's
+// `endsSentence`, kept here so the block editor does not load the engine.
+const SENTENCE_END = /[.?!]["'\u201D\u2019)\]]*$/;
+
+const endsSentence = (st, from, text) => {
+  if (!/\s$/.test(text)) return false;
+  const $from = st.doc.resolve(from);
+  const head = $from.parent.textBetween(0, $from.parentOffset) + text.replace(/\s+$/, "");
+  return !/\s$/.test(head) && SENTENCE_END.test(head);
+};
+
 export function typingIntent(st, from, to, text) {
-  return { kind: "insert", blockId: blockIdAt(st.doc, from), from, end: from + text.length, replaced: from !== to, text, marks: markKey(st), at: Date.now() };
+  return { kind: "insert", blockId: blockIdAt(st.doc, from), from, end: from + text.length, replaced: from !== to, text, marks: markKey(st), breakAfter: endsSentence(st, from, text), at: Date.now() };
 }
 
 export function continuesGroup(prev, next) {
   if (!prev || !next || prev.kind !== next.kind) return false;
   if (next.kind === "compose") return prev.id === next.id;
   if (prev.blockId !== next.blockId || next.at - prev.at > GROUP_MS) return false;
-  if (next.kind === "insert") return !next.replaced && next.from === prev.end && next.marks === prev.marks && !(/\s$/.test(prev.text) && /^\S/.test(next.text));
+  if (next.kind === "insert") return !prev.breakAfter && !next.replaced && next.from === prev.end && next.marks === prev.marks;
   return next.direction === prev.direction && (next.direction < 0 ? next.to === prev.from : next.from === prev.from);
 }
 
@@ -76,3 +89,97 @@ export function historyIntentPlugin() {
     },
   });
 }
+
+// Each page entry owns one current Yjs StackItem, replaced by its inverse after replay.
+export function createHistoryBridge({ um, undo, redo, article, focus }) {
+  const page = () => window.clay?.undo
+  const epoch = Math.random().toString(36).slice(2)
+  let next = 0
+  let running = false
+  let recording = false
+  let disposed = false
+
+  const replay = (entry, direction) => {
+    const fromKey = direction === 'undo' ? 'undoStack' : 'redoStack'
+    const toKey = direction === 'undo' ? 'redoStack' : 'undoStack'
+    const source = um[fromKey], destination = um[toKey]
+    const index = source.indexOf(entry.item)
+    if (index < 0) throw new Error('blockeditor: history item is no longer available')
+    const remaining = source.filter((_, at) => at !== index)
+    // Yjs scans BOTH stacks' deletion sets when checking map conflicts. Keep those
+    // sets visible on the opposite stack while limiting the pop loop to one item.
+    const temporary = [...destination, ...remaining]
+    const boundary = temporary.length
+    um[fromKey] = [entry.item]
+    um[toKey] = temporary
+    running = true
+    let changed
+    let inverse
+    try {
+      changed = direction === 'undo' ? undo() : redo()
+    } finally {
+      inverse = temporary.slice(boundary)
+      um[fromKey] = remaining
+      um[toKey] = [...destination, ...inverse]
+      running = false
+      um.stopCapturing()
+    }
+    if (!changed || !inverse.length) {
+      entry.item = null
+      throw new Error('blockeditor: history item was emptied by another edit')
+    }
+    entry.item = inverse[0]
+    entry.applied = direction === 'redo'
+  }
+
+  const onAdded = (event) => {
+    if (running || event.origin === um || event.type !== 'undo' || page()?.pageHistory !== true) return
+    const entry = { item: event.stackItem, applied: true }
+    const id = `${epoch}:${++next}`
+    const oldValue = `${id}:undone`, newValue = `${id}:applied`
+    const primitive = {
+      kind: 'value',
+      target: article,
+      prop: `blockeditor-step:${id}`,
+      oldValue,
+      newValue,
+      read: () => !disposed && entry.item && (entry.applied ? um.undoStack : um.redoStack).includes(entry.item)
+        ? entry.applied ? newValue : oldValue
+        : null,
+      write: (target, wanted) => {
+        const typing = !!document.activeElement?.closest?.('[contenteditable]:not([contenteditable="false"])')
+        const before = article.textContent
+        replay(entry, wanted === oldValue ? 'undo' : 'redo')
+        if (typing && article.textContent !== before && typeof focus === 'function') focus()
+      },
+    }
+    recording = true
+    try {
+      try { page().recordStep('Edit', primitive) } catch { page().record(primitive) }
+    } finally {
+      recording = false
+    }
+  }
+
+  const onCommit = () => { if (!recording) um.stopCapturing() }
+  um.on('stack-item-added', onAdded)
+  let subscribed = null
+  const subscribe = () => {
+    const current = page()?.pageHistory === true ? page() : null
+    if (current === subscribed) return
+    subscribed?.off?.('commit', onCommit)
+    subscribed = current
+    subscribed?.on?.('commit', onCommit)
+  }
+  subscribe()
+  document.addEventListener('clay:undo-session', subscribe)
+
+  return {
+    dispose() {
+      disposed = true
+      um.off('stack-item-added', onAdded)
+      subscribed?.off?.('commit', onCommit)
+      document.removeEventListener('clay:undo-session', subscribe)
+    },
+  }
+}

package/src/page/import-markdown.js

@@ -17,8 +17,8 @@ import { safeHref, safeSrc } from "./address.js";
 const EMBEDS = "iframe, frame, frameset, object, embed, applet, meta, base, link, form, style, animate, set, animateMotion, animateTransform, portal";
 const LOADERS = /^(srcdoc|data|formaction|codebase|archive|ping|background|poster|lowsrc|dynsrc)$/i;
 const SCRIPTED = /^\s*(javascript|vbscript|data):/i;
-function cleanImported(html) {
-  const t = document.createElement("template");
+function cleanImported(html, doc) {
+  const t = doc.createElement("template");
   t.innerHTML = html;
   for (const el of t.content.querySelectorAll(EMBEDS)) el.remove();
   for (const el of t.content.querySelectorAll("*")) {
@@ -57,7 +57,19 @@ function added(marks, name, attrs) {
 // One text block's inline content as the record keeps it: c, and m as runs (one
 // key per UTF-16 unit, packed), exactly as flatten and runsOf write it; `parts`
 // splits around an image, which the schema only carries as a block of its own.
-function inlineOf(tokens, { images = true, refused = [], unsupported = [] } = {}) {
+// A link or image written as a relative path (`other.md`, `setup.sh`, `shot.png`) names a
+// file beside the Markdown it came from. It never becomes a web address: `setup.sh` read
+// as a host name is someone else's site, and an image there would make every reader's
+// browser ask that site for it. The host may map it (`resolveLink`, `resolveImage`).
+const RELATIVE = /^(?![a-z][a-z0-9+.-]*:|[/#?])\S/i;
+
+function linkHref(raw, resolveLink) {
+  const resolved = typeof resolveLink === "function" ? resolveLink(raw) : null;
+  if (typeof resolved === "string" && resolved) return safeHref(resolved);
+  return RELATIVE.test(raw.trim()) ? null : safeHref(raw);
+}
+
+function inlineOf(tokens, { images = true, refused = [], unsupported = [], resolveLink = null } = {}) {
   const parts = [];
   let c = "";
   let m = [];
@@ -91,7 +103,7 @@ function inlineOf(tokens, { images = true, refused = [], unsupported = [] } = {}
         case "codespan": text(token.text, added(marks, "code")); break;
         case "br": atom(BREAK); break;
         case "link": {
-          const href = safeHref(token.href);
+          const href = linkHref(String(token.href ?? ""), resolveLink);
           if (href) walk(token.tokens, added(marks, "link", { href }));
           else {
             refused.push({ type: "link", href: String(token.href ?? "") });
@@ -121,7 +133,7 @@ function inlineOf(tokens, { images = true, refused = [], unsupported = [] } = {}
   return { parts };
 }
 
-export function importMarkdownTokens(tokens) {
+export function importMarkdownTokens(tokens, { document: doc = globalThis.document, resolveImage = null, resolveLink = null } = {}) {
   if (!Array.isArray(tokens)) throw new MarkdownImportError("malformed-input", "Markdown import needs the lexer's token list.");
   let size = 0;
   for (const token of tokens) {
@@ -155,7 +167,9 @@ export function importMarkdownTokens(tokens) {
     return value;
   };
   const imageOf = (image) => {
-    const src = safeSrc(image.src);
+    const resolved = typeof resolveImage === "function" ? resolveImage(image.src) : null;
+    const mapped = typeof resolved === "string" && resolved ? resolved : null;
+    const src = mapped ? safeSrc(mapped) : RELATIVE.test(String(image.src).trim()) ? null : safeSrc(image.src);
     if (src) return { t: "image", src, ...(image.alt ? { alt: image.alt } : {}), ...(image.title ? { caption: image.title } : {}) };
     refused.push({ type: "image", href: image.src });
     return image.alt ? block("paragraph", {}, { c: image.alt, m: [] }) : null;
@@ -168,7 +182,7 @@ export function importMarkdownTokens(tokens) {
     }
   };
   const paragraph = (inline, ctx) => textBlocks(ctx.quote ? "quote" : "paragraph", {}, inline);
-  const inline = (tokens, options = {}) => inlineOf(tokens, { refused, unsupported, ...options });
+  const inline = (tokens, options = {}) => inlineOf(tokens, { refused, unsupported, resolveLink, ...options });
   const literal = (token) => {
     const raw = String(token.raw ?? token.text ?? "");
     unsupported.push({ type: token.type, text: raw });
@@ -193,7 +207,7 @@ export function importMarkdownTokens(tokens) {
         case "html": {
           const raw = String(token.text ?? token.raw ?? "");
           unsupported.push({ type: "HTML block cleaned", text: raw });
-          push({ t: "preserved", html: cleanImported(fragmentCleaner(document).fallback(raw)) });
+          push({ t: "preserved", html: cleanImported(fragmentCleaner(doc).fallback(raw), doc) });
           break;
         }
         case "blockquote": {

package/src/page/save-projection.js

@@ -120,4 +120,4 @@ export function acceptedPageState(html) {
   }
 }
 
-addDocumentTransform(projectInto);
+addDocumentTransform(projectInto, { required: true });

package/src/page/ybind/bridge.js

@@ -10,7 +10,7 @@ import { state as pmState } from "../../vendor/prosemirror.vendor.js";
 import { repairSiblings, isKey } from "../model.js";
 import { createOriginIndex, installUndoOrigins } from "./origins.js";
 import { reduceRecovery, reduceRecoverable, canonicalRevision, restoreKey, physicalKeyOf, authorKey, RECOVERED_PREFIX, parsePhysicalKey, parseGoneIntents } from "./recovery.js";
-import { moveBlocks } from "./moves.js";
+import { moveBlocks, createMoveCarry } from "./moves.js";
 import { createBoardCommands } from "./board-commands.js";
 import { continuesGroup, intentOf } from "../history-intent.js";
 import { MOVE, BlockSelection } from "../blocks.js";
@@ -320,7 +320,9 @@ export function createBridge({ pd, onNotice = () => {}, ownedTokens = [], author
     if (!d) { adopt(view.state.doc); return; }
     const tr = view.state.tr.replace(d.start, d.endA, derived.slice(d.start, d.endB)).setMeta(REMOTE_META, true).setMeta("addToHistory", false);
     if (own) tr.setMeta("yundo", true);
-    if (keep) {
+    if (own && view.state.doc.textContent !== derived.textContent && document.activeElement?.closest?.('[contenteditable]:not([contenteditable="false"])')) {
+      tr.setSelection(pmState.Selection.near(tr.doc.resolve(Math.min(d.endB, tr.doc.content.size)), -1));
+    } else if (keep) {
       const hiddenUnit = (y) => y >= 0 && w.holes.some((hole) => y >= yBefore(w.holes, hole.at) && y < yAfter(w.holes, hole.at));
       const placeIn = (id, offset) => {
         let found = null;
@@ -359,12 +361,14 @@ export function createBridge({ pd, onNotice = () => {}, ownedTokens = [], author
     return true;
   };
   const stale = (t) => { began.set(t, docVersion); docVersion++; };
+  const carry = createMoveCarry({ pd, origins, um, walked: () => currentWalk() ?? walk(pd, origins) });
   const onTransaction = (t) => {
     if (unchanged(t)) {
       idle.add(t);
       if (walkedAt === began.get(t) && docVersion === walkedAt + 1) walkedAt = docVersion;
       return;
     }
+    if (t.origin === um) carry.note(t);
     deltas++;
     delta = deltas === 1 ? captureDelta(pd, t, w) : null;
   };
@@ -385,7 +389,9 @@ export function createBridge({ pd, onNotice = () => {}, ownedTokens = [], author
     saved = { anchor: end(sel.$anchor), head: end(sel.$head) };
   };
   const onAfter = (t) => {
-    if (t.origin !== LOCAL) { lastIntent = null; groupOpen = false; }
+    // A transaction that wrote nothing (Yjs's cleanup after an undo) is no peer's edit, so
+    // it leaves an open typing run open.
+    if (t.origin !== LOCAL && !unchanged(t)) { lastIntent = null; groupOpen = false; }
   };
   // One render per batch Yjs settles (a transaction and those its observers queued), after
   // its garbage collection and merges, so the walk it leaves is current for the next keystroke.
@@ -398,9 +404,10 @@ export function createBridge({ pd, onNotice = () => {}, ownedTokens = [], author
       else if (t.origin === um) own = true;
     }
     if (!changed) { saved = null; return; }
-    if (!view) { bumpRecovery(); return; }
+    if (!view) { bumpRecovery(); carry.received(transactions); return; }
     if (local) { saved = null; return; }
     render(own);
+    carry.received(transactions);
   };
   const portMove = (tr, move) => {
     const result = moveBlocks({ pd, view, um, origins, render, walked: currentWalk() }, move);
@@ -486,7 +493,7 @@ export function createBridge({ pd, onNotice = () => {}, ownedTokens = [], author
       registerAuthor = null;
       const intent = history ? intentOf(local, view) : null;
       const join = groupOpen && continuesGroup(lastIntent, intent);
-      lastIntent = intent;
+      lastIntent = !join && intent?.breakAfter && !intent.text.trim() ? { ...intent, breakAfter: false } : intent;
       joining = join;
       try {
         localGroup(pd, local, w, stats, um, history, register, { join, open: intent !== null });
@@ -546,7 +553,7 @@ export function createBridge({ pd, onNotice = () => {}, ownedTokens = [], author
     moveBlocks(args) {
       return moveBlocks({ pd, view, um, origins, render, walked: currentWalk() }, args);
     },
-    undo() { return um.undo() !== null; },
-    redo() { return um.redo() !== null; },
+    undo() { return carry.replay("undo"); },
+    redo() { return carry.replay("redo"); },
   };
 }