@ai-matrx/rich-editor 0.1.3 → 0.2.1

package/dist/visual/shortcut-handlers.d.ts

@@ -0,0 +1,27 @@
+import type { Editor } from "@tiptap/core";
+import type { DeclaredVariable } from "../core/variables.js";
+/** What the keymap and menus reach outside the document for. */
+export interface RichShellActions {
+    save: () => void;
+    find: () => void;
+    replace: () => void;
+    toggleOutline: () => void;
+    toggleFocus: () => void;
+    /** Leave focus mode; false when it was not on (so Escape stays free for others). */
+    exitFocus: () => boolean;
+    cycleView: () => void;
+    showHelp: () => void;
+    showWordCount: () => void;
+    editLink: () => void;
+    pickKind: () => Promise<string | null>;
+    pickImage: () => void;
+    uploadImage: (file: File) => Promise<string | null>;
+    variables: () => readonly DeclaredVariable[] | null;
+    declareVariable: (name: string) => void;
+    /** Approve a deliberate change to an island whose stored bytes are `raw`. */
+    approveIsland: (raw: string) => void;
+}
+type Handler = (editor: Editor, shell: RichShellActions) => boolean;
+/** Every shortcut id in the table → what it does. Exported so a test proves none is unbound. */
+export declare const SHORTCUT_HANDLERS: Record<string, Handler>;
+export {};

package/dist/visual/shortcut-handlers.js

@@ -0,0 +1,43 @@
+import { insertCodeBlock, insertInlineMath, moveBlock, toggleTaskList } from "../core/commands.js";
+import { markAutoEdit } from "./auto-edit.js";
+const SHORTCUT_HANDLERS = {
+  bold: (e) => e.chain().focus().toggleBold().run(),
+  italic: (e) => e.chain().focus().toggleItalic().run(),
+  strike: (e) => e.chain().focus().toggleStrike().run(),
+  code: (e) => e.chain().focus().toggleCode().run(),
+  link: (_e, shell) => (shell.editLink(), true),
+  paragraph: (e) => e.chain().focus().setParagraph().run(),
+  heading1: (e) => e.chain().focus().toggleHeading({ level: 1 }).run(),
+  heading2: (e) => e.chain().focus().toggleHeading({ level: 2 }).run(),
+  heading3: (e) => e.chain().focus().toggleHeading({ level: 3 }).run(),
+  heading4: (e) => e.chain().focus().toggleHeading({ level: 4 }).run(),
+  heading5: (e) => e.chain().focus().toggleHeading({ level: 5 }).run(),
+  heading6: (e) => e.chain().focus().toggleHeading({ level: 6 }).run(),
+  orderedList: (e) => e.chain().focus().toggleOrderedList().run(),
+  bulletList: (e) => e.chain().focus().toggleBulletList().run(),
+  taskList: (e) => toggleTaskList(e),
+  quote: (e) => e.chain().focus().toggleBlockquote().run(),
+  moveUp: (e) => moveBlock(e, "up"),
+  moveDown: (e) => moveBlock(e, "down"),
+  codeBlock: (e) => {
+    markAutoEdit(e, insertCodeBlock(e));
+    return true;
+  },
+  inlineMath: (e) => {
+    const { from, to } = e.state.selection;
+    return insertInlineMath(e, from === to ? "x" : e.state.doc.textBetween(from, to));
+  },
+  undo: (e) => e.commands.undo(),
+  redo: (e) => e.commands.redo(),
+  find: (_e, shell) => (shell.find(), true),
+  replace: (_e, shell) => (shell.replace(), true),
+  save: (_e, shell) => (shell.save(), true),
+  wordCount: (_e, shell) => (shell.showWordCount(), true),
+  outline: (_e, shell) => (shell.toggleOutline(), true),
+  focus: (_e, shell) => (shell.toggleFocus(), true),
+  cycleView: (_e, shell) => (shell.cycleView(), true),
+  help: (_e, shell) => (shell.showHelp(), true)
+};
+export {
+  SHORTCUT_HANDLERS
+};

package/dist/visual/slash-items.d.ts

@@ -0,0 +1,18 @@
+import type { Editor } from "@tiptap/core";
+import { type LucideIcon } from "lucide-react";
+export interface SlashHost {
+    pickKind: () => Promise<string | null>;
+    pickImage: () => void;
+}
+export interface SlashItem {
+    id: string;
+    title: string;
+    description: string;
+    group: string;
+    icon: LucideIcon;
+    keywords: string[];
+    run: (editor: Editor, host: SlashHost) => void;
+}
+export declare const SLASH_ITEMS: readonly SlashItem[];
+/** Filter by title and keywords, best matches first. */
+export declare function filterSlashItems(query: string): SlashItem[];

package/dist/visual/slash-items.js

@@ -0,0 +1,152 @@
+import {
+  AlertTriangle,
+  Braces,
+  CheckSquare,
+  Code,
+  FileText,
+  Footprints,
+  Heading1,
+  Heading2,
+  Heading3,
+  ImagePlus,
+  Info,
+  Lightbulb,
+  List,
+  ListOrdered,
+  Minus,
+  Quote,
+  SeparatorHorizontal,
+  Shapes,
+  Sigma,
+  Table
+} from "lucide-react";
+import {
+  insertCodeBlock,
+  insertFootnote,
+  insertInlineMath,
+  insertIsland,
+  insertMathBlock,
+  insertPageBreak,
+  setCallout,
+  toggleTaskList
+} from "../core/commands.js";
+import { markAutoEdit } from "./auto-edit.js";
+const callout = (type, icon, title) => ({
+  id: `callout-${type.toLowerCase()}`,
+  title,
+  description: `${/^[aeiou]/i.test(title) ? "An" : "A"} ${title.toLowerCase()} callout (> [!${type}])`,
+  group: "Callouts",
+  icon,
+  keywords: ["callout", "admonition", "alert", type.toLowerCase()],
+  run: (editor) => {
+    setCallout(editor, type);
+  }
+});
+const SLASH_ITEMS = [
+  { id: "text", title: "Text", description: "Plain paragraph", group: "Basic", icon: FileText, keywords: ["paragraph", "normal"], run: (e) => void e.chain().focus().setParagraph().run() },
+  { id: "h1", title: "Heading 1", description: "Big section heading", group: "Basic", icon: Heading1, keywords: ["title", "#"], run: (e) => void e.chain().focus().setHeading({ level: 1 }).run() },
+  { id: "h2", title: "Heading 2", description: "Medium section heading", group: "Basic", icon: Heading2, keywords: ["subtitle", "##"], run: (e) => void e.chain().focus().setHeading({ level: 2 }).run() },
+  { id: "h3", title: "Heading 3", description: "Small section heading", group: "Basic", icon: Heading3, keywords: ["###"], run: (e) => void e.chain().focus().setHeading({ level: 3 }).run() },
+  { id: "bullets", title: "Bulleted list", description: "A simple list", group: "Basic", icon: List, keywords: ["ul", "unordered", "-"], run: (e) => void e.chain().focus().toggleBulletList().run() },
+  { id: "numbers", title: "Numbered list", description: "Steps in order", group: "Basic", icon: ListOrdered, keywords: ["ol", "ordered", "1."], run: (e) => void e.chain().focus().toggleOrderedList().run() },
+  { id: "todo", title: "Checklist", description: "Tasks with checkboxes", group: "Basic", icon: CheckSquare, keywords: ["task", "todo", "checkbox", "[ ]"], run: (e) => void toggleTaskList(e) },
+  { id: "quote", title: "Quote", description: "A quoted passage", group: "Basic", icon: Quote, keywords: ["blockquote", ">"], run: (e) => void e.chain().focus().toggleBlockquote().run() },
+  { id: "table", title: "Table", description: "Rows and columns", group: "Basic", icon: Table, keywords: ["grid", "columns"], run: (e) => void e.chain().focus().insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run() },
+  { id: "divider", title: "Divider", description: "A horizontal rule", group: "Basic", icon: Minus, keywords: ["hr", "rule", "line", "---"], run: (e) => void e.chain().focus().setHorizontalRule().run() },
+  callout("NOTE", Info, "Note"),
+  callout("TIP", Lightbulb, "Tip"),
+  callout("IMPORTANT", Info, "Important"),
+  callout("WARNING", AlertTriangle, "Warning"),
+  callout("CAUTION", AlertTriangle, "Caution"),
+  {
+    id: "code",
+    title: "Code block",
+    description: "Code with a language",
+    group: "Insert",
+    icon: Code,
+    keywords: ["```", "snippet", "program"],
+    run: (e) => markAutoEdit(e, insertCodeBlock(e))
+  },
+  {
+    id: "equation",
+    title: "Equation",
+    description: "Display math ($$\u2026$$) with live preview",
+    group: "Insert",
+    icon: Sigma,
+    keywords: ["math", "latex", "katex", "formula", "$$"],
+    run: (e) => markAutoEdit(e, insertMathBlock(e))
+  },
+  {
+    id: "inline-equation",
+    title: "Inline equation",
+    description: "Math inside a sentence ($\u2026$)",
+    group: "Insert",
+    icon: Sigma,
+    keywords: ["math", "inline", "latex", "$"],
+    run: (e) => void insertInlineMath(e, "x")
+  },
+  {
+    id: "variable",
+    title: "Variable",
+    description: "A {{variable}} filled in at run time",
+    group: "Insert",
+    icon: Braces,
+    keywords: ["{{", "placeholder", "field", "input"],
+    run: (e) => void e.chain().focus().insertContent("{{").run()
+  },
+  {
+    id: "kind",
+    title: "Structured block",
+    description: "A kind from the shape registry",
+    group: "Insert",
+    icon: Shapes,
+    keywords: ["kind", "shape", "component", "json", "block"],
+    run: (e, host) => {
+      void host.pickKind().then((raw) => {
+        if (raw) insertIsland(e, raw, "json");
+      });
+    }
+  },
+  {
+    id: "image",
+    title: "Image",
+    description: "Upload a picture",
+    group: "Insert",
+    icon: ImagePlus,
+    keywords: ["picture", "photo", "upload", "img"],
+    run: (_e, host) => host.pickImage()
+  },
+  {
+    id: "footnote",
+    title: "Footnote",
+    description: "A numbered note at the end",
+    group: "Insert",
+    icon: Footprints,
+    keywords: ["reference", "note", "[^1]"],
+    run: (e) => void insertFootnote(e)
+  },
+  {
+    id: "page-break",
+    title: "Page break",
+    description: "Start a new page when printed",
+    group: "Insert",
+    icon: SeparatorHorizontal,
+    keywords: ["print", "pdf", "new page", "pagebreak"],
+    run: (e) => void insertPageBreak(e)
+  }
+];
+function filterSlashItems(query) {
+  const q = query.trim().toLowerCase();
+  if (!q) return [...SLASH_ITEMS];
+  const scored = SLASH_ITEMS.map((item) => {
+    const title = item.title.toLowerCase();
+    const score = title.startsWith(q) ? 3 : title.includes(q) ? 2 : item.keywords.some((keyword) => keyword.toLowerCase().includes(q)) ? 1 : 0;
+    return { item, score };
+  }).filter((entry) => entry.score > 0);
+  scored.sort((a, b) => b.score - a.score);
+  return scored.map((entry) => entry.item);
+}
+export {
+  SLASH_ITEMS,
+  filterSlashItems
+};

package/dist/visual/visual-extensions.d.ts

@@ -0,0 +1,10 @@
+import { type Extensions } from "@tiptap/core";
+import { type EditorState } from "@tiptap/pm/state";
+import { type RichShellActions } from "./shortcut-handlers.js";
+export type { RichShellActions } from "./shortcut-handlers.js";
+/** True while the `/` or `{{` menu is open. */
+export declare function suggestionOpen(state: EditorState): boolean;
+export declare function createVisualExtensions(options: {
+    placeholder?: string;
+    shell: RichShellActions;
+}): Extensions;

package/dist/visual/visual-extensions.js

@@ -0,0 +1,246 @@
+import { Extension } from "@tiptap/core";
+import { ReactNodeViewRenderer } from "@tiptap/react";
+import Suggestion from "@tiptap/suggestion";
+import { toast } from "@ai-matrx/rich-content/host/toast";
+import { NodeSelection, Plugin, PluginKey, TextSelection } from "@tiptap/pm/state";
+import { TrailingNode } from "@tiptap/extensions";
+import { createRichEditorExtensions } from "../core/extensions.js";
+import { islandsReleasedByHistory } from "../core/history-approval.js";
+import { fenceFromParagraph, insertInlineIsland, insertVariable, TASK_OPEN } from "../core/commands.js";
+import { RICH_EDITOR_SHORTCUTS, TYPED_TRIGGERS } from "../core/shortcuts.js";
+import { SHORTCUT_HANDLERS } from "./shortcut-handlers.js";
+import { variableName, variableSuggestions } from "../core/variables.js";
+import { IslandBlockView } from "./nodes/IslandBlockView.js";
+import { SourceLockedView } from "./nodes/SourceLockedView.js";
+import { InlineIslandView } from "./nodes/InlineIslandView.js";
+import { CalloutView } from "./nodes/CalloutView.js";
+import { RichDecorations } from "./decorations.js";
+import { ContextMenuCaret } from "./context-menu-caret.js";
+import { markAutoEdit } from "./auto-edit.js";
+import { filterSlashItems } from "./slash-items.js";
+import { suggestionRenderer } from "./menus/SuggestionMenu.js";
+const slashKey = new PluginKey("richEditorSlash");
+const variableKey = new PluginKey("richEditorVariable");
+function stopControlEvents({ event }) {
+  const target = event.target;
+  if (!(target instanceof Element)) return false;
+  return Boolean(target.closest("button, input, textarea, select, [role='button'], .cm-editor, [data-node-controls]"));
+}
+function suggestionOpen(state) {
+  const active = (key) => key.getState(state)?.active === true;
+  return active(slashKey) || active(variableKey);
+}
+function listItemDepth(editor) {
+  const { $from } = editor.state.selection;
+  for (let depth = $from.depth; depth > 0; depth -= 1) {
+    if ($from.node(depth).type.name === "listItem") return depth;
+  }
+  return -1;
+}
+function createVisualExtensions(options) {
+  const { shell } = options;
+  const base = createRichEditorExtensions({
+    placeholder: options.placeholder,
+    onPasteNotice: (message) => toast.info(message)
+  }).map((extension) => {
+    switch (extension.name) {
+      case "islandBlock":
+        return extension.extend({ addNodeView: () => ReactNodeViewRenderer(IslandBlockView, { stopEvent: stopControlEvents }) });
+      case "sourceLocked":
+        return extension.extend({ addNodeView: () => ReactNodeViewRenderer(SourceLockedView, { stopEvent: stopControlEvents }) });
+      case "inlineIsland":
+        return extension.extend({ addNodeView: () => ReactNodeViewRenderer(InlineIslandView, { stopEvent: stopControlEvents }) });
+      case "blockquote":
+        return extension.extend({ addNodeView: () => ReactNodeViewRenderer(CalloutView, { stopEvent: stopControlEvents }) });
+      default:
+        return extension;
+    }
+  });
+  const keymap = Extension.create({
+    name: "richEditorKeymap",
+    priority: 1e3,
+    addKeyboardShortcuts() {
+      const bindings = {};
+      for (const spec of RICH_EDITOR_SHORTCUTS) {
+        const handler = SHORTCUT_HANDLERS[spec.id];
+        if (!handler) continue;
+        for (const key of spec.keys) {
+          if (TYPED_TRIGGERS.has(key)) continue;
+          bindings[key] = () => handler(this.editor, shell);
+        }
+      }
+      bindings.Escape = () => shell.exitFocus();
+      bindings.Enter = () => {
+        if (suggestionOpen(this.editor.state)) return false;
+        if (fenceFromParagraph(this.editor)) {
+          const { from } = this.editor.state.selection;
+          markAutoEdit(this.editor, from);
+          return true;
+        }
+        const depth = listItemDepth(this.editor);
+        if (depth === -1) return false;
+        const item = this.editor.state.selection.$from.node(depth);
+        if (typeof item.attrs.mdTask !== "string") return false;
+        if (item.textContent.length === 0) return false;
+        if (!this.editor.commands.splitListItem("listItem")) return false;
+        this.editor.commands.updateAttributes("listItem", { mdTask: TASK_OPEN });
+        return true;
+      };
+      return bindings;
+    }
+  });
+  const slash = Extension.create({
+    name: "richEditorSlash",
+    priority: 1100,
+    addProseMirrorPlugins() {
+      const host = { pickKind: shell.pickKind, pickImage: shell.pickImage };
+      return [
+        Suggestion({
+          pluginKey: slashKey,
+          editor: this.editor,
+          char: "/",
+          // "/code block" keeps filtering past the space, like Notion.
+          allowSpaces: true,
+          items: ({ query }) => filterSlashItems(query).map((item) => ({
+            id: item.id,
+            title: item.title,
+            description: item.description,
+            group: item.group,
+            icon: item.icon
+          })),
+          command: ({ editor, range, props }) => {
+            const item = filterSlashItems("").find((candidate) => candidate.id === props.id);
+            editor.chain().focus().deleteRange(range).run();
+            item?.run(editor, host);
+          },
+          // With spaces allowed, "/ then prose" that matches nothing must not eat Enter.
+          render: suggestionRenderer({ emptyText: "Nothing matches \u2014 keep typing or press Escape.", label: "Insert", holdEnterWhenEmpty: false })
+        })
+      ];
+    }
+  });
+  const variables = Extension.create({
+    name: "richEditorVariables",
+    priority: 1100,
+    addProseMirrorPlugins() {
+      return [
+        Suggestion({
+          pluginKey: variableKey,
+          editor: this.editor,
+          char: "{{",
+          allowedPrefixes: null,
+          items: ({ query, editor }) => {
+            const inDocument = [];
+            editor.state.doc.descendants((node) => {
+              if (node.type.name !== "inlineIsland") return true;
+              const name = variableName(String(node.attrs.raw ?? ""))?.trim();
+              if (name && !inDocument.includes(name)) inDocument.push(name);
+              return false;
+            });
+            return variableSuggestions(shell.variables() ?? [], inDocument, query).map(
+              (suggestion) => suggestion.source === "new" ? { id: `new:${suggestion.name}`, title: `Add \u201C${suggestion.name}\u201D`, description: "A new variable", group: "New" } : {
+                id: `var:${suggestion.name}`,
+                title: suggestion.name,
+                description: suggestion.description,
+                hint: suggestion.type,
+                group: suggestion.source === "declared" ? "Declared variables" : "In this document"
+              }
+            );
+          },
+          command: ({ editor, range, props }) => {
+            const name = props.id.replace(/^(var|new):/, "");
+            editor.chain().focus().deleteRange(range).run();
+            insertVariable(editor, name);
+            if (props.id.startsWith("new:")) shell.declareVariable(name);
+          },
+          render: suggestionRenderer({
+            emptyText: "Type a name for the variable.",
+            label: "Variables"
+          })
+        })
+      ];
+    }
+  });
+  const imagePaste = Extension.create({
+    name: "richEditorImagePaste",
+    addProseMirrorPlugins() {
+      const editor = this.editor;
+      const upload = (files) => {
+        for (const file of files) {
+          void shell.uploadImage(file).then((markdown) => {
+            if (markdown) insertInlineIsland(editor, markdown, "md_image");
+          });
+        }
+      };
+      const images = (list) => Array.from(list ?? []).filter((file) => file.type.startsWith("image/"));
+      return [
+        new Plugin({
+          key: new PluginKey("richEditorImagePaste"),
+          props: {
+            handlePaste: (_view, event) => {
+              const files = images(event.clipboardData?.files);
+              if (!files.length) return false;
+              event.preventDefault();
+              upload(files);
+              return true;
+            },
+            handleDrop: (_view, event) => {
+              const files = images(event.dataTransfer?.files);
+              if (!files.length) return false;
+              event.preventDefault();
+              upload(files);
+              return true;
+            }
+          }
+        })
+      ];
+    }
+  });
+  const protectSelectedIslands = Extension.create({
+    name: "richEditorProtectSelectedIslands",
+    addProseMirrorPlugins() {
+      return [
+        new Plugin({
+          key: new PluginKey("richEditorProtectSelectedIslands"),
+          props: {
+            handleTextInput: (view, _from, _to, text) => {
+              const { selection } = view.state;
+              if (!(selection instanceof NodeSelection)) return false;
+              const name = selection.node.type.name;
+              if (name !== "islandBlock" && name !== "sourceLocked") return false;
+              const paragraph = view.state.schema.nodes.paragraph;
+              if (!paragraph) return false;
+              const at = selection.to;
+              const tr = view.state.tr.insert(at, paragraph.create(null, view.state.schema.text(text)));
+              tr.setSelection(TextSelection.create(tr.doc, at + 1 + text.length));
+              view.dispatch(tr.scrollIntoView());
+              return true;
+            }
+          }
+        })
+      ];
+    }
+  });
+  const historyApproval = Extension.create({
+    name: "richEditorHistoryApproval",
+    onTransaction({ transaction }) {
+      for (const raw of islandsReleasedByHistory(transaction)) shell.approveIsland(raw);
+    }
+  });
+  return [
+    ...base,
+    historyApproval,
+    keymap,
+    slash,
+    variables,
+    imagePaste,
+    protectSelectedIslands,
+    TrailingNode.configure({ node: "paragraph" }),
+    RichDecorations,
+    ContextMenuCaret
+  ];
+}
+export {
+  createVisualExtensions,
+  suggestionOpen
+};

package/dist/visual/visual-format-target.d.ts

@@ -0,0 +1,9 @@
+import type { Editor } from "@tiptap/core";
+import type { FormatCommandId } from "../core/markdown-format.js";
+import type { FormatTarget } from "../format/format-target.js";
+/**
+ * The visual engine. `overrides` carries the verbs the editor implements in
+ * its own shell (link field, checklist, code-block island) — the same handlers
+ * its keyboard shortcuts run, so a button and a chord can never differ.
+ */
+export declare function visualFormatTarget(editor: Editor, overrides?: Partial<Record<FormatCommandId, () => boolean>>): FormatTarget;

package/dist/visual/visual-format-target.js

@@ -0,0 +1,43 @@
+import { NodeSelection } from "@tiptap/pm/state";
+const VISUAL = {
+  bold: { run: (e) => e.chain().focus().toggleBold().run(), active: (e) => e.isActive("bold") },
+  italic: { run: (e) => e.chain().focus().toggleItalic().run(), active: (e) => e.isActive("italic") },
+  strike: { run: (e) => e.chain().focus().toggleStrike().run(), active: (e) => e.isActive("strike") },
+  code: { run: (e) => e.chain().focus().toggleCode().run(), active: (e) => e.isActive("code") },
+  // Link opens the editor's own link field — the host passes it in.
+  link: { run: () => false, active: (e) => e.isActive("link") },
+  heading1: { run: (e) => e.chain().focus().toggleHeading({ level: 1 }).run(), active: (e) => e.isActive("heading", { level: 1 }) },
+  heading2: { run: (e) => e.chain().focus().toggleHeading({ level: 2 }).run(), active: (e) => e.isActive("heading", { level: 2 }) },
+  heading3: { run: (e) => e.chain().focus().toggleHeading({ level: 3 }).run(), active: (e) => e.isActive("heading", { level: 3 }) },
+  bulletList: { run: (e) => e.chain().focus().toggleBulletList().run(), active: (e) => e.isActive("bulletList") },
+  orderedList: { run: (e) => e.chain().focus().toggleOrderedList().run(), active: (e) => e.isActive("orderedList") },
+  taskList: { run: () => false, active: (e) => e.isActive("taskList") },
+  quote: { run: (e) => e.chain().focus().toggleBlockquote().run(), active: (e) => e.isActive("blockquote") },
+  codeBlock: { run: () => false, active: () => false }
+};
+function visualFormatTarget(editor, overrides = {}) {
+  return {
+    engine: "visual",
+    run: (command) => {
+      if (editor.isDestroyed || !editor.isEditable) return false;
+      const own = overrides[command];
+      return own ? own() : VISUAL[command].run(editor);
+    },
+    isActive: (command) => !editor.isDestroyed && VISUAL[command].active(editor),
+    canFormat: () => {
+      if (editor.isDestroyed || !editor.isEditable) return false;
+      const { selection, doc } = editor.state;
+      if (selection.empty || selection instanceof NodeSelection) return false;
+      return doc.textBetween(selection.from, selection.to).trim().length > 0;
+    },
+    subscribe: (onChange) => {
+      editor.on("transaction", onChange);
+      return () => {
+        editor.off("transaction", onChange);
+      };
+    }
+  };
+}
+export {
+  visualFormatTarget
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-matrx/rich-editor",
-  "version": "0.1.3",
+  "version": "0.2.1",
   "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",
@@ -19,7 +19,9 @@
     "LICENSE",
     "CHANGELOG.md"
   ],
-  "sideEffects": false,
+  "sideEffects": [
+    "**/*.css"
+  ],
   "exports": {
     "./core/*": {
       "types": "./dist/core/*.d.ts",
@@ -33,9 +35,38 @@
       "types": "./dist/format/*.d.ts",
       "import": "./dist/format/*.js"
     },
+    "./islands/*": {
+      "types": "./dist/islands/*.d.ts",
+      "import": "./dist/islands/*.js"
+    },
+    "./panels/*": {
+      "types": "./dist/panels/*.d.ts",
+      "import": "./dist/panels/*.js"
+    },
+    "./source/*": {
+      "types": "./dist/source/*.d.ts",
+      "import": "./dist/source/*.js"
+    },
+    "./visual/*": {
+      "types": "./dist/visual/*.d.ts",
+      "import": "./dist/visual/*.js"
+    },
+    "./editor/*": {
+      "types": "./dist/editor/*.d.ts",
+      "import": "./dist/editor/*.js"
+    },
+    "./rich-editor.css": "./dist/editor/rich-editor.css",
     "./package.json": "./package.json"
   },
   "dependencies": {
+    "@codemirror/autocomplete": "^6.20.3",
+    "@codemirror/commands": "^6.11.1",
+    "@codemirror/lang-json": "^6.0.2",
+    "@codemirror/language": "^6.12.4",
+    "@codemirror/state": "^6.7.6",
+    "@codemirror/view": "^6.43.13",
+    "@lezer/highlight": "^1.2.4",
+    "@lezer/markdown": "^1.7.2",
     "@tiptap/core": "^3.31.3",
     "@tiptap/extension-blockquote": "^3.31.3",
     "@tiptap/extension-bold": "^3.31.3",
@@ -53,10 +84,17 @@
     "@tiptap/extension-text": "^3.31.3",
     "@tiptap/extensions": "^3.31.3",
     "@tiptap/pm": "^3.31.3",
+    "@tiptap/react": "^3.31.3",
+    "@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/rich-content": "latest",
-    "@ai-matrx/print": "latest"
+    "@ai-matrx/design-system": "latest",
+    "@ai-matrx/kit": "latest",
+    "@ai-matrx/print": "latest",
+    "@ai-matrx/rich-content": "latest"
   },
   "peerDependencies": {
     "react": ">=19.0.0",
@@ -87,7 +125,7 @@
     "node": ">=20"
   },
   "scripts": {
-    "build": "pnpm --filter @ai-matrx/rich-content build && node -e \"require('node:fs').rmSync('dist',{recursive:true,force:true})\" && tsup && node ./scripts/tsc-own.mjs -p tsconfig.build.json && node ./scripts/finish-build.mjs",
+    "build": "pnpm --filter @ai-matrx/rich-content build && node -e \"require('node:fs').rmSync('dist',{recursive:true,force:true})\" && tsup && node -e \"require('node:fs').cpSync('src/editor/rich-editor.css','dist/editor/rich-editor.css')\" && node ./scripts/tsc-own.mjs -p tsconfig.build.json && node ./scripts/finish-build.mjs",
     "check:package": "pnpm build && publint && pnpm verify:modules-tarball && pnpm verify:tarball && pnpm check:host-boundary",
     "check:host-boundary": "node ./scripts/check-host-boundary.mjs && node ./scripts/check-host-boundary.mjs --self-test",
     "deps:write": "node ./scripts/finish-build.mjs --write-deps",