@ai-matrx/rich-editor 0.2.9 → 0.2.10

package/CHANGELOG.md

@@ -1,5 +1,10 @@
 # Changelog
 
+## 0.2.10
+### The caret survives a view switch
+
+- Switching Visual <-> Source (and back) carries the caret or selection: read from the leaving view as text around each end (`getCaret`, `CaretCarry`), placed in the new view once it is ready (`placeCaret(context, to)`). It used to land at offset 0.
+
 ## 0.2.9
 
 - Outline "Copy link" shows ONE toast (AP-2): the words ("Link to … copied.") ride the kit copy instead

package/dist/core/caret-context.d.ts

@@ -22,3 +22,17 @@ export declare function domPointAt(doc: Document, x: number, y: number): {
     node: Node;
     offset: number;
 } | null;
+/** The caret or selection of one view, as text around its two ends — carried across a view switch. */
+export interface CaretCarry {
+    from: CaretContext;
+    /** The selection's other end; null for a plain caret. */
+    to: CaretContext | null;
+}
+/** The text around `index` of `flat` (a view's own text). */
+export declare function contextAtIndex(flat: string, index: number): CaretContext;
+/**
+ * A context read from markdown SOURCE, made comparable with the rendered text: the markup characters a
+ * rendered view does not show (`**`, `_`, backticks, heading and quote marks) are dropped, so Source ->
+ * Visual finds the same words. (Visual -> Source needs no help: the locator falls back to the words.)
+ */
+export declare function withoutMarkup(context: CaretContext): CaretContext;

package/dist/core/caret-context.js

@@ -65,9 +65,19 @@ function domPointAt(doc, x, y) {
   if (range) return { node: range.startContainer, offset: range.startOffset };
   return null;
 }
+function contextAtIndex(flat, index) {
+  const at = Math.max(0, Math.min(index, flat.length));
+  return { before: flat.slice(Math.max(0, at - CONTEXT_CHARS), at), after: flat.slice(at, at + CONTEXT_CHARS) };
+}
+function withoutMarkup(context) {
+  const clean = (text) => text.replace(/[*_~`]+/g, "").replace(/^[ \t]*(?:#{1,6}|>|[-+*]|\d+[.)])[ \t]+/gm, "");
+  return { before: clean(context.before), after: clean(context.after) };
+}
 export {
   CONTEXT_CHARS,
   caretContextAt,
+  contextAtIndex,
   domPointAt,
-  locateCaret
+  locateCaret,
+  withoutMarkup
 };

package/dist/editor/RichEditorImpl.js

@@ -131,6 +131,7 @@ function RichEditorImpl({
   const [kindRequest, setKindRequest] = useState(null);
   const approved = useRef(/* @__PURE__ */ new Set());
   const handle = useRef(null);
+  const pendingCaret = useRef(null);
   const imageInput = useRef(null);
   const { upload } = useFileUpload();
   const lastValue = useRef(value);
@@ -183,10 +184,26 @@ function RichEditorImpl({
       return;
     }
     handle.current?.clearFind();
+    pendingCaret.current = handle.current?.getCaret?.() ?? null;
     setView(next);
     setMountKey((key) => key + 1);
     if (next !== controlledView) onViewChange?.(next);
   };
+  useEffect(() => {
+    const carry = pendingCaret.current;
+    if (!carry || view === "preview") return;
+    pendingCaret.current = null;
+    let tries = 0;
+    let timer = null;
+    const attempt = () => {
+      if (handle.current?.placeCaret(carry.from, carry.to) || ++tries > 20) return;
+      timer = setTimeout(attempt, 50);
+    };
+    timer = setTimeout(attempt, 0);
+    return () => {
+      if (timer) clearTimeout(timer);
+    };
+  }, [view, mountKey]);
   useEffect(() => {
     if (controlledView !== void 0 && controlledView !== view) switchView(controlledView);
   }, [controlledView]);

package/dist/source/SourceEditor.js

@@ -21,7 +21,7 @@ import { getSchema } from "@tiptap/core";
 import { cn } from "@ai-matrx/design-system";
 import { toast } from "@ai-matrx/rich-content/host/toast";
 import { createRichEditorExtensions } from "../core/extensions.js";
-import { locateCaret } from "../core/caret-context.js";
+import { contextAtIndex, locateCaret, withoutMarkup } from "../core/caret-context.js";
 import { htmlToMarkdown } from "../core/html-to-markdown.js";
 import { mergedCellsNotice, normalizePastedHtml } from "../core/paste-html.js";
 import { findMatches, replaceMatches } from "../core/find-replace.js";
@@ -314,15 +314,30 @@ ${text}`;
       const v = view.current;
       return v ? { undo: undoDepth(v.state), redo: redoDepth(v.state) } : { undo: 0, redo: 0 };
     },
-    placeCaret: (context2) => {
+    placeCaret: (context2, to) => {
       const v = view.current;
       if (!v) return false;
-      const index = locateCaret(v.state.doc.toString(), context2);
+      const text = v.state.doc.toString();
+      const index = locateCaret(text, context2);
       if (index === null) return false;
-      v.dispatch({ selection: { anchor: index }, effects: EditorView.scrollIntoView(index, { y: "center" }) });
+      const toIndex = to ? locateCaret(text, to) : null;
+      v.dispatch({
+        selection: toIndex !== null && toIndex !== index ? { anchor: index, head: toIndex } : { anchor: index },
+        effects: EditorView.scrollIntoView(index, { y: "center" })
+      });
       v.focus();
       return true;
     },
+    getCaret: () => {
+      const v = view.current;
+      if (!v) return null;
+      const text = v.state.doc.toString();
+      const { from, to, empty } = v.state.selection.main;
+      return {
+        from: withoutMarkup(contextAtIndex(text, from)),
+        to: empty ? null : withoutMarkup(contextAtIndex(text, to))
+      };
+    },
     scrollToHeading: (_slug, offset) => {
       const v = view.current;
       if (!v) return;

package/dist/visual/VisualEditor.d.ts

@@ -1,6 +1,6 @@
 import { type Ref } from "react";
 import { type VisualLoadStats } from "../core/visual-document.js";
-import { type CaretContext } from "../core/caret-context.js";
+import { type CaretCarry, type CaretContext } from "../core/caret-context.js";
 import type { FindOptions } from "../core/find-replace.js";
 import { type RichShellActions } from "./visual-extensions.js";
 import type { FormatTarget } from "../format/format-target.js";
@@ -32,7 +32,9 @@ export interface EditorViewHandle {
     };
     scrollToHeading: (slug: string, offset: number) => void;
     /** Put the caret at the text the person double-clicked in the rendered view; false when not found. */
-    placeCaret: (context: CaretContext) => boolean;
+    placeCaret: (context: CaretContext, to?: CaretContext | null) => boolean;
+    /** The caret or selection as text around it, to carry across a view switch; null when there is none. */
+    getCaret: () => CaretCarry | null;
     find: (query: string, options: FindOptions, step?: 1 | -1) => ViewFindState;
     replaceCurrent: (query: string, replacement: string, options: FindOptions) => string[];
     replaceAll: (query: string, replacement: string, options: FindOptions) => string[];

package/dist/visual/VisualEditor.js

@@ -17,7 +17,7 @@ import {
   serializeVisualDocument
 } from "../core/visual-document.js";
 import { findInDoc, replaceInDoc } from "../core/visual-find.js";
-import { locateCaret } from "../core/caret-context.js";
+import { contextAtIndex, locateCaret } from "../core/caret-context.js";
 import { createVisualExtensions } from "./visual-extensions.js";
 import { findHighlightKey } from "./decorations.js";
 import { BlockHandle } from "./BlockHandle.js";
@@ -26,6 +26,21 @@ import { RICH_EDITOR_HOST_KEY, islandSelectionOf, tableAnchorOf } from "./format
 import { useRichEditorContext } from "../editor/RichEditorContext.js";
 const HEADLESS_SCHEMA = getSchema(createRichEditorExtensions());
 const REPORT_DELAY_MS = 120;
+function flattenDoc(doc) {
+  let flat = "";
+  const positions = [];
+  doc.descendants((node, pos) => {
+    if (node.isText && node.text) {
+      for (let i = 0; i < node.text.length; i++) positions.push(pos + i);
+      flat += node.text;
+    } else if (node.isBlock && flat.length > 0 && !flat.endsWith("\n")) {
+      positions.push(pos);
+      flat += "\n";
+    }
+    return true;
+  });
+  return { flat, positions };
+}
 function VisualEditor({
   initialText,
   onChange,
@@ -180,31 +195,30 @@ function VisualEditor({
         editor.chain().setTextSelection(pos).focus(void 0, { scrollIntoView: false }).run();
       }
     },
-    placeCaret: (context2) => {
+    placeCaret: (context2, to) => {
       if (!editor) return false;
-      let flat = "";
-      const positions = [];
-      editor.state.doc.descendants((node, pos2) => {
-        if (node.isText && node.text) {
-          for (let i = 0; i < node.text.length; i++) positions.push(pos2 + i);
-          flat += node.text;
-        } else if (node.isBlock && flat.length > 0 && !flat.endsWith("\n")) {
-          positions.push(pos2);
-          flat += "\n";
-        }
-        return true;
-      });
+      const { flat, positions } = flattenDoc(editor.state.doc);
       const index = locateCaret(flat, context2);
       if (index === null) return false;
-      const pos = index > 0 && positions[index - 1] !== void 0 ? positions[index - 1] + 1 : positions[index] ?? editor.state.doc.content.size - 1;
+      const posOf = (i) => i > 0 && positions[i - 1] !== void 0 ? positions[i - 1] + 1 : positions[i] ?? editor.state.doc.content.size - 1;
+      const toIndex = to ? locateCaret(flat, to) : null;
       try {
-        editor.view.dispatch(editor.state.tr.setSelection(TextSelection.near(editor.state.doc.resolve(pos))).scrollIntoView());
+        const doc = editor.state.doc;
+        const selection = toIndex !== null && toIndex !== index ? TextSelection.between(doc.resolve(posOf(index)), doc.resolve(posOf(toIndex))) : TextSelection.near(doc.resolve(posOf(index)));
+        editor.view.dispatch(editor.state.tr.setSelection(selection).scrollIntoView());
         editor.view.focus();
         return true;
       } catch {
         return false;
       }
     },
+    getCaret: () => {
+      if (!editor) return null;
+      const { flat, positions } = flattenDoc(editor.state.doc);
+      const indexOf = (pos) => positions.filter((p) => p < pos).length;
+      const { from, to, empty } = editor.state.selection;
+      return { from: contextAtIndex(flat, indexOf(from)), to: empty ? null : contextAtIndex(flat, indexOf(to)) };
+    },
     find: (query, options, step) => {
       if (!editor) return { count: 0, current: -1, skippedProtected: 0, error: null };
       const result = findInDoc(editor.state.doc, query, options);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-matrx/rich-editor",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "description": "The AI Matrx editor: Visual (Tiptap), Source (CodeMirror), Preview, the markdown formatting command layer, and edit-in-place — over @ai-matrx/rich-content. Consumers that only render never install it.",
   "type": "module",
   "license": "MIT",
@@ -90,12 +90,12 @@
     "@tiptap/suggestion": "^3.31.3",
     "github-slugger": "^2.0.0",
     "lucide-react": "^1.48.0",
-    "@ai-matrx/agents": "latest",
-    "@ai-matrx/alchemy": "latest",
     "@ai-matrx/content-ir": "latest",
     "@ai-matrx/design-system": "latest",
-    "@ai-matrx/print": "latest",
+    "@ai-matrx/alchemy": "latest",
     "@ai-matrx/kit": "latest",
+    "@ai-matrx/agents": "latest",
+    "@ai-matrx/print": "latest",
     "@ai-matrx/rich-content": "latest"
   },
   "peerDependencies": {