@dxos/react-ui-editor 0.6.14-main.7bd9c89 → 0.6.14-main.f49f251

package/dist/lib/node/index.cjs

@@ -28,7 +28,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var node_exports = {};
 __export(node_exports, {
-  Cursor: () => import_chunk_GZWIENFM.Cursor,
+  Cursor: () => Cursor,
   EditorInputModes: () => EditorInputModes,
   EditorViewModes: () => EditorViewModes,
   Inline: () => Inline,
@@ -50,6 +50,7 @@ __export(node_exports, {
   awarenessProvider: () => awarenessProvider,
   blast: () => blast,
   callbackWrapper: () => callbackWrapper,
+  clientRectsFor: () => clientRectsFor,
   command: () => command,
   comments: () => comments,
   commentsState: () => commentsState,
@@ -57,7 +58,9 @@ __export(node_exports, {
   createBasicExtensions: () => createBasicExtensions,
   createComment: () => createComment,
   createDataExtensions: () => createDataExtensions,
-  createEditorStateTransaction: () => import_chunk_GZWIENFM.createEditorStateTransaction,
+  createEditorStateStore: () => createEditorStateStore,
+  createEditorStateTransaction: () => createEditorStateTransaction,
+  createElement: () => createElement,
   createExternalCommentSync: () => createExternalCommentSync,
   createMarkdownExtensions: () => createMarkdownExtensions,
   createThemeExtensions: () => createThemeExtensions,
@@ -66,7 +69,7 @@ __export(node_exports, {
   debugTree: () => debugTree,
   decorateMarkdown: () => decorateMarkdown,
   defaultOptions: () => defaultOptions,
-  documentId: () => import_chunk_GZWIENFM.documentId,
+  documentId: () => documentId,
   dropFile: () => dropFile,
   editorContent: () => editorContent,
   editorFullWidth: () => editorFullWidth,
@@ -74,23 +77,25 @@ __export(node_exports, {
   editorInputMode: () => editorInputMode,
   editorMonospace: () => editorMonospace,
   editorWithToolbarLayout: () => editorWithToolbarLayout,
+  flattenRect: () => flattenRect,
+  focus: () => focus,
   focusEvent: () => focusEvent,
+  focusField: () => focusField,
   folding: () => folding,
   formattingEquals: () => formattingEquals,
   formattingKeymap: () => formattingKeymap,
   getFormatting: () => getFormatting,
   image: () => image,
-  imageUpload: () => imageUpload,
   insertTable: () => insertTable,
   keymap: () => import_view.keymap,
   linkTooltip: () => linkTooltip,
   listener: () => listener,
-  localStorageStateStoreAdapter: () => import_chunk_GZWIENFM.localStorageStateStoreAdapter,
   logChanges: () => logChanges,
   markdownHighlightStyle: () => markdownHighlightStyle,
   markdownTags: () => markdownTags,
   markdownTagsExtensions: () => markdownTagsExtensions,
   mention: () => mention,
+  overlap: () => overlap,
   preventNewline: () => preventNewline,
   processAction: () => processAction,
   removeBlockquote: () => removeBlockquote,
@@ -98,17 +103,19 @@ __export(node_exports, {
   removeLink: () => removeLink,
   removeList: () => removeList,
   removeStyle: () => removeStyle,
+  renderRoot: () => renderRoot,
   scrollThreadIntoView: () => scrollThreadIntoView,
   selectionOverlapsComment: () => selectionOverlapsComment,
+  selectionState: () => selectionState,
   setBlockquote: () => setBlockquote,
   setComments: () => setComments,
   setHeading: () => setHeading,
   setSelection: () => setSelection,
   setStyle: () => setStyle,
-  singleValueFacet: () => import_chunk_GZWIENFM.singleValueFacet,
-  state: () => import_chunk_GZWIENFM.state,
+  singleValueFacet: () => singleValueFacet,
   table: () => table,
   tags: () => import_highlight.tags,
+  textRange: () => textRange,
   toggleBlockquote: () => toggleBlockquote,
   toggleCodeblock: () => toggleCodeblock,
   toggleEmphasis: () => toggleEmphasis,
@@ -125,10 +132,10 @@ __export(node_exports, {
   useComments: () => useComments,
   useFormattingState: () => useFormattingState,
   useTextEditor: () => useTextEditor,
-  useToolbarContext: () => useToolbarContext
+  useToolbarContext: () => useToolbarContext,
+  wrapWithCatch: () => wrapWithCatch
 });
 module.exports = __toCommonJS(node_exports);
-var import_chunk_GZWIENFM = require("./chunk-GZWIENFM.cjs");
 var import_view = require("@codemirror/view");
 var import_highlight = require("@lezer/highlight");
 var import_text = require("@dxos/protocols/proto/dxos/echo/model/text");
@@ -141,76 +148,83 @@ var import_react_ui_theme = require("@dxos/react-ui-theme");
 var import_state = require("@codemirror/state");
 var import_view2 = require("@codemirror/view");
 var import_util = require("@dxos/util");
+var import_state2 = require("@codemirror/state");
+var import_log = require("@dxos/log");
+var import_react3 = __toESM(require("react"));
+var import_client = require("react-dom/client");
+var import_react_ui2 = require("@dxos/react-ui");
+var import_react_ui_theme2 = require("@dxos/react-ui-theme");
 var import_autocomplete = require("@codemirror/autocomplete");
 var import_lang_markdown = require("@codemirror/lang-markdown");
 var import_view3 = require("@codemirror/view");
-var import_state2 = require("@codemirror/state");
+var import_state3 = require("@codemirror/state");
 var import_view4 = require("@codemirror/view");
 var import_automerge = require("@dxos/automerge/automerge");
-var import_log = require("@dxos/log");
+var import_log2 = require("@dxos/log");
 var import_echo = require("@dxos/react-client/echo");
-var import_state3 = require("@codemirror/state");
+var import_state4 = require("@codemirror/state");
 var import_automerge2 = require("@dxos/automerge/automerge");
 var import_automerge3 = require("@dxos/automerge/automerge");
-var import_state4 = require("@codemirror/state");
 var import_state5 = require("@codemirror/state");
+var import_state6 = require("@codemirror/state");
 var import_view5 = require("@codemirror/view");
 var import_async = require("@dxos/async");
 var import_context = require("@dxos/context");
 var import_async2 = require("@dxos/async");
 var import_context2 = require("@dxos/context");
 var import_invariant = require("@dxos/invariant");
-var import_log2 = require("@dxos/log");
+var import_log3 = require("@dxos/log");
 var import_view6 = require("@codemirror/view");
 var import_lodash = __toESM(require("lodash.defaultsdeep"));
 var import_invariant2 = require("@dxos/invariant");
 var import_view7 = require("@codemirror/view");
-var import_state6 = require("@codemirror/state");
-var import_view8 = require("@codemirror/view");
 var import_state7 = require("@codemirror/state");
+var import_view8 = require("@codemirror/view");
+var import_state8 = require("@codemirror/state");
 var import_view9 = require("@codemirror/view");
-var import_log3 = require("@dxos/log");
-var import_react3 = __toESM(require("react"));
-var import_client = require("react-dom/client");
-var import_react_ui2 = require("@dxos/react-ui");
-var import_react_ui_theme2 = require("@dxos/react-ui-theme");
 var import_commands = require("@codemirror/commands");
-var import_state8 = require("@codemirror/state");
+var import_state9 = require("@codemirror/state");
 var import_view10 = require("@codemirror/view");
 var import_lodash2 = __toESM(require("lodash.sortby"));
 var import_react4 = require("react");
 var import_async3 = require("@dxos/async");
 var import_log4 = require("@dxos/log");
 var import_util2 = require("@dxos/util");
-var import_log5 = require("@dxos/log");
-var import_language = require("@codemirror/language");
-var import_state9 = require("@codemirror/state");
+var import_state10 = require("@codemirror/state");
 var import_view11 = require("@codemirror/view");
+var import_async4 = require("@dxos/async");
+var import_invariant3 = require("@dxos/invariant");
+var import_util3 = require("@dxos/util");
+var import_language = require("@codemirror/language");
+var import_state11 = require("@codemirror/state");
+var import_view12 = require("@codemirror/view");
 var import_autocomplete2 = require("@codemirror/autocomplete");
 var import_commands2 = require("@codemirror/commands");
 var import_language2 = require("@codemirror/language");
 var import_search = require("@codemirror/search");
-var import_state10 = require("@codemirror/state");
+var import_state12 = require("@codemirror/state");
 var import_theme_one_dark = require("@codemirror/theme-one-dark");
-var import_view12 = require("@codemirror/view");
+var import_view13 = require("@codemirror/view");
 var import_lodash3 = __toESM(require("lodash.defaultsdeep"));
 var import_lodash4 = __toESM(require("lodash.merge"));
 var import_display_name = require("@dxos/display-name");
-var import_log6 = require("@dxos/log");
+var import_log5 = require("@dxos/log");
 var import_react_ui_theme3 = require("@dxos/react-ui-theme");
-var import_util3 = require("@dxos/util");
+var import_util4 = require("@dxos/util");
+var import_state13 = require("@codemirror/state");
+var import_view14 = require("@codemirror/view");
 var import_react_ui_theme4 = require("@dxos/react-ui-theme");
 var import_lodash5 = __toESM(require("lodash.get"));
 var import_react_ui_theme5 = require("@dxos/react-ui-theme");
 var import_language3 = require("@codemirror/language");
-var import_view13 = require("@codemirror/view");
+var import_view15 = require("@codemirror/view");
 var import_react5 = __toESM(require("react"));
 var import_react_ui3 = require("@dxos/react-ui");
-var import_view14 = require("@codemirror/view");
+var import_view16 = require("@codemirror/view");
 var import_autocomplete3 = require("@codemirror/autocomplete");
 var import_language4 = require("@codemirror/language");
-var import_state11 = require("@codemirror/state");
-var import_view15 = require("@codemirror/view");
+var import_state14 = require("@codemirror/state");
+var import_view17 = require("@codemirror/view");
 var import_react6 = require("react");
 var import_autocomplete4 = require("@codemirror/autocomplete");
 var import_commands3 = require("@codemirror/commands");
@@ -218,45 +232,45 @@ var import_lang_markdown2 = require("@codemirror/lang-markdown");
 var import_language5 = require("@codemirror/language");
 var import_language_data = require("@codemirror/language-data");
 var import_lint = require("@codemirror/lint");
-var import_view16 = require("@codemirror/view");
+var import_view18 = require("@codemirror/view");
 var import_lang_markdown3 = require("@codemirror/lang-markdown");
 var import_language6 = require("@codemirror/language");
 var import_highlight2 = require("@lezer/highlight");
 var import_markdown = require("@lezer/markdown");
 var import_language7 = require("@codemirror/language");
-var import_state12 = require("@codemirror/state");
+var import_state15 = require("@codemirror/state");
 var import_language8 = require("@codemirror/language");
-var import_state13 = require("@codemirror/state");
-var import_view17 = require("@codemirror/view");
-var import_invariant3 = require("@dxos/invariant");
+var import_state16 = require("@codemirror/state");
+var import_view19 = require("@codemirror/view");
+var import_invariant4 = require("@dxos/invariant");
 var import_react_ui_theme6 = require("@dxos/react-ui-theme");
 var import_language9 = require("@codemirror/language");
-var import_state14 = require("@codemirror/state");
-var import_view18 = require("@codemirror/view");
-var import_language10 = require("@codemirror/language");
-var import_state15 = require("@codemirror/state");
-var import_view19 = require("@codemirror/view");
+var import_state17 = require("@codemirror/state");
 var import_view20 = require("@codemirror/view");
-var import_language11 = require("@codemirror/language");
-var import_state16 = require("@codemirror/state");
+var import_language10 = require("@codemirror/language");
+var import_state18 = require("@codemirror/state");
 var import_view21 = require("@codemirror/view");
-var import_language12 = require("@codemirror/language");
 var import_view22 = require("@codemirror/view");
+var import_language11 = require("@codemirror/language");
+var import_state19 = require("@codemirror/state");
+var import_view23 = require("@codemirror/view");
+var import_language12 = require("@codemirror/language");
+var import_view24 = require("@codemirror/view");
 var import_react_ui_theme7 = require("@dxos/react-ui-theme");
 var import_autocomplete5 = require("@codemirror/autocomplete");
-var import_log7 = require("@dxos/log");
-var import_view23 = require("@codemirror/view");
+var import_log6 = require("@dxos/log");
+var import_view25 = require("@codemirror/view");
 var import_codemirror_vim = require("@replit/codemirror-vim");
 var import_codemirror_vscode_keymap = require("@replit/codemirror-vscode-keymap");
-var import_view24 = require("@codemirror/view");
-var import_view25 = require("@codemirror/view");
-var import_react_ui_theme8 = require("@dxos/react-ui-theme");
-var import_state17 = require("@codemirror/state");
 var import_view26 = require("@codemirror/view");
+var import_view27 = require("@codemirror/view");
+var import_react_ui_theme8 = require("@dxos/react-ui-theme");
+var import_state20 = require("@codemirror/state");
+var import_view28 = require("@codemirror/view");
 var import_react_tabster = require("@fluentui/react-tabster");
 var import_react7 = require("react");
-var import_log8 = require("@dxos/log");
-var import_util4 = require("@dxos/util");
+var import_log7 = require("@dxos/log");
+var import_util5 = require("@dxos/util");
 var translationKey = "react-ui-editor";
 var translations_default = [
   {
@@ -290,19 +304,158 @@ var translations_default = [
     }
   }
 ];
+var singleValueFacet = (defaultValue) => import_state2.Facet.define({
+  // Called immediately.
+  combine: (providers) => {
+    return providers[0] ?? defaultValue;
+  }
+});
+var overlap = (a, b) => a.from <= b.to && a.to >= b.from;
+var defaultCursorConverter = {
+  toCursor: (position) => position.toString(),
+  fromCursor: (cursor) => parseInt(cursor)
+};
+var Cursor = class _Cursor {
+  static {
+    this.converter = singleValueFacet(defaultCursorConverter);
+  }
+  static {
+    this.getCursorFromRange = (state, range) => {
+      const cursorConverter2 = state.facet(_Cursor.converter);
+      const from = cursorConverter2.toCursor(range.from);
+      const to = cursorConverter2.toCursor(range.to, -1);
+      return [
+        from,
+        to
+      ].join(":");
+    };
+  }
+  static {
+    this.getRangeFromCursor = (state, cursor) => {
+      const cursorConverter2 = state.facet(_Cursor.converter);
+      const parts = cursor.split(":");
+      const from = cursorConverter2.fromCursor(parts[0]);
+      const to = cursorConverter2.fromCursor(parts[1]);
+      return from !== void 0 && to !== void 0 ? {
+        from,
+        to
+      } : void 0;
+    };
+  }
+};
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/util/debug.ts";
+var wrapWithCatch = (fn) => {
+  return (...args) => {
+    try {
+      return fn(...args);
+    } catch (err) {
+      import_log.log.catch(err, void 0, {
+        F: __dxlog_file,
+        L: 15,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
+    }
+  };
+};
+var callbackWrapper = (fn) => (...args) => {
+  try {
+    return fn(...args);
+  } catch (err) {
+    import_log.log.catch(err, void 0, {
+      F: __dxlog_file,
+      L: 29,
+      S: void 0,
+      C: (f, a) => f(...a)
+    });
+  }
+};
+var debugDispatcher = (trs, view) => {
+  logChanges(trs);
+  view.update(trs);
+};
+var logChanges = (trs) => {
+  const changes = trs.flatMap((tr) => {
+    if (tr.changes.empty) {
+      return void 0;
+    }
+    const changes2 = [];
+    tr.changes.iterChanges((fromA, toA, fromB, toB, inserted) => changes2.push(JSON.stringify({
+      fromA,
+      toA,
+      fromB,
+      toB,
+      inserted: inserted.toString()
+    })));
+    return changes2;
+  }).filter(Boolean);
+  if (changes.length) {
+    import_log.log.info("changes", {
+      changes
+    }, {
+      F: __dxlog_file,
+      L: 62,
+      S: void 0,
+      C: (f, a) => f(...a)
+    });
+  }
+};
+var flattenRect = (rect, left) => {
+  const x = left ? rect.left : rect.right;
+  return {
+    left: x,
+    right: x,
+    top: rect.top,
+    bottom: rect.bottom
+  };
+};
+var scratchRange;
+var textRange = (node, from, to = from) => {
+  const range = scratchRange || (scratchRange = document.createRange());
+  range.setEnd(node, to);
+  range.setStart(node, from);
+  return range;
+};
+var clientRectsFor = (dom) => {
+  if (dom.nodeType === 3) {
+    return textRange(dom, 0, dom.nodeValue.length).getClientRects();
+  } else if (dom.nodeType === 1) {
+    return dom.getClientRects();
+  } else {
+    return [];
+  }
+};
+var createElement = (tag, options, children) => {
+  const el = document.createElement(tag);
+  if (options?.className) {
+    el.className = options.className;
+  }
+  if (children) {
+    el.append(...Array.isArray(children) ? children : [
+      children
+    ]);
+  }
+  return el;
+};
+var renderRoot = (root, node) => {
+  (0, import_client.createRoot)(root).render(/* @__PURE__ */ import_react3.default.createElement(import_react_ui2.ThemeProvider, {
+    tx: import_react_ui_theme2.defaultTx
+  }, node));
+  return root;
+};
 var annotationMark = import_view2.Decoration.mark({
   class: "cm-annotation"
 });
 var annotations = (options = {}) => {
-  const match = (state2) => {
+  const match = (state) => {
     const annotations2 = [];
-    const text = state2.doc.toString();
+    const text = state.doc.toString();
     if (options.match) {
       const matches = text.matchAll(options.match);
       for (const match2 of matches) {
         const from = match2.index;
         const to = from + match2[0].length;
-        const cursor = import_chunk_GZWIENFM.Cursor.getCursorFromRange(state2, {
+        const cursor = Cursor.getCursorFromRange(state, {
           from,
           to
         });
@@ -314,8 +467,8 @@ var annotations = (options = {}) => {
     return annotations2;
   };
   const annotationsState = import_state.StateField.define({
-    create: (state2) => {
-      return match(state2);
+    create: (state) => {
+      return match(state);
     },
     update: (value, tr) => {
       if (!tr.changes.empty) {
@@ -328,10 +481,10 @@ var annotations = (options = {}) => {
     annotationsState,
     import_view2.EditorView.decorations.compute([
       annotationsState
-    ], (state2) => {
-      const annotations2 = state2.field(annotationsState);
+    ], (state) => {
+      const annotations2 = state.field(annotationsState);
       const decorations = annotations2.map((annotation) => {
-        const range = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(state2, annotation.cursor);
+        const range = Cursor.getRangeFromCursor(state, annotation.cursor);
         return range && annotationMark.range(range.from, range.to);
       }).filter(import_util.isNotFalsy);
       return import_view2.Decoration.set(decorations);
@@ -382,14 +535,14 @@ var autocomplete = ({ activateOnTyping, override, onSearch } = {}) => {
   }
   return extensions;
 };
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/automerge/cursor.ts";
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/automerge/cursor.ts";
 var cursorConverter = (accessor) => ({
   toCursor: (pos, assoc) => {
     try {
       return (0, import_echo.toCursor)(accessor, pos, assoc);
     } catch (err) {
-      import_log.log.catch(err, void 0, {
-        F: __dxlog_file,
+      import_log2.log.catch(err, void 0, {
+        F: __dxlog_file2,
         L: 15,
         S: void 0,
         C: (f, a) => f(...a)
@@ -401,8 +554,8 @@ var cursorConverter = (accessor) => ({
     try {
       return (0, import_echo.fromCursor)(accessor, cursor);
     } catch (err) {
-      import_log.log.catch(err, void 0, {
-        F: __dxlog_file,
+      import_log2.log.catch(err, void 0, {
+        F: __dxlog_file2,
         L: 24,
         S: void 0,
         C: (f, a) => f(...a)
@@ -411,18 +564,18 @@ var cursorConverter = (accessor) => ({
     }
   }
 });
-var getPath = (state2, field) => state2.field(field).path;
-var getLastHeads = (state2, field) => state2.field(field).lastHeads;
-var updateHeadsEffect = import_state3.StateEffect.define({});
+var getPath = (state, field) => state.field(field).path;
+var getLastHeads = (state, field) => state.field(field).lastHeads;
+var updateHeadsEffect = import_state4.StateEffect.define({});
 var updateHeads = (newHeads) => updateHeadsEffect.of({
   newHeads
 });
-var reconcileAnnotation = import_state3.Annotation.define();
+var reconcileAnnotation = import_state4.Annotation.define();
 var isReconcile = (tr) => {
   return !!tr.annotation(reconcileAnnotation);
 };
-var updateAutomerge = (field, handle, transactions, state2) => {
-  const { lastHeads, path } = state2.field(field);
+var updateAutomerge = (field, handle, transactions, state) => {
+  const { lastHeads, path } = state.field(field);
   let hasChanges = false;
   for (const tr of transactions) {
     tr.changes.iterChanges(() => {
@@ -453,7 +606,7 @@ var updateCodeMirror = (view, selection, target, patches) => {
   for (const patch of patches) {
     const changeSpec = handlePatch(patch, target, view.state);
     if (changeSpec != null) {
-      const changeSet = import_state4.ChangeSet.of(changeSpec, view.state.doc.length, "\n");
+      const changeSet = import_state5.ChangeSet.of(changeSpec, view.state.doc.length, "\n");
       selection = selection.map(changeSet, 1);
       view.dispatch({
         changes: changeSet,
@@ -466,7 +619,7 @@ var updateCodeMirror = (view, selection, target, patches) => {
     annotations: reconcileAnnotation.of(false)
   });
 };
-var handlePatch = (patch, target, state2) => {
+var handlePatch = (patch, target, state) => {
   if (patch.action === "insert") {
     return handleInsert(target, patch);
   } else if (patch.action === "splice") {
@@ -474,7 +627,7 @@ var handlePatch = (patch, target, state2) => {
   } else if (patch.action === "del") {
     return handleDel(target, patch);
   } else if (patch.action === "put") {
-    return handlePut(target, patch, state2);
+    return handlePut(target, patch, state);
   } else {
     return null;
   }
@@ -518,7 +671,7 @@ var handleDel = (target, patch) => {
     }
   ];
 };
-var handlePut = (target, patch, state2) => {
+var handlePut = (target, patch, state) => {
   const index = charPath(target, [
     ...patch.path,
     0
@@ -526,7 +679,7 @@ var handlePut = (target, patch, state2) => {
   if (index == null) {
     return [];
   }
-  const length = state2.doc.length;
+  const length = state.doc.length;
   if (typeof patch.value !== "string") {
     return [];
   }
@@ -596,7 +749,7 @@ var Syncer = class {
   }
 };
 var automerge = (accessor) => {
-  const syncState = import_state2.StateField.define({
+  const syncState = import_state3.StateField.define({
     create: () => ({
       path: accessor.path.slice(),
       lastHeads: import_automerge.next.getHeads(accessor.handle.docSync()),
@@ -627,7 +780,7 @@ var automerge = (accessor) => {
   });
   const syncer = new Syncer(accessor.handle, syncState);
   return [
-    import_chunk_GZWIENFM.Cursor.converter.of(cursorConverter(accessor)),
+    Cursor.converter.of(cursorConverter(accessor)),
     // Track heads.
     syncState,
     // Reconcile external updates.
@@ -651,7 +804,7 @@ var automerge = (accessor) => {
     })
   ];
 };
-var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/awareness/awareness.ts";
+var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/awareness/awareness.ts";
 var dummyProvider = {
   remoteStateChange: new import_async.Event(),
   open: () => {
@@ -662,8 +815,8 @@ var dummyProvider = {
   update: () => {
   }
 };
-var awarenessProvider = (0, import_chunk_GZWIENFM.singleValueFacet)(dummyProvider);
-var RemoteSelectionChangedAnnotation = import_state5.Annotation.define();
+var awarenessProvider = singleValueFacet(dummyProvider);
+var RemoteSelectionChangedAnnotation = import_state6.Annotation.define();
 var awareness = (provider = dummyProvider) => {
   return [
     awarenessProvider.of(provider),
@@ -676,11 +829,11 @@ var awareness = (provider = dummyProvider) => {
 var RemoteSelectionsDecorator = class {
   constructor(view) {
     this._ctx = new import_context.Context(void 0, {
-      F: __dxlog_file2,
+      F: __dxlog_file3,
       L: 80
     });
-    this.decorations = import_state5.RangeSet.of([]);
-    this._cursorConverter = view.state.facet(import_chunk_GZWIENFM.Cursor.converter);
+    this.decorations = import_state6.RangeSet.of([]);
+    this._cursorConverter = view.state.facet(Cursor.converter);
     this._provider = view.state.facet(awarenessProvider);
     this._provider.open();
     this._provider.remoteStateChange.on(this._ctx, () => {
@@ -715,9 +868,9 @@ var RemoteSelectionsDecorator = class {
   _updateRemoteSelections(view) {
     const decorations = [];
     const awarenessStates = this._provider.getRemoteStates();
-    for (const state2 of awarenessStates) {
-      const anchor = state2.position?.anchor ? this._cursorConverter.fromCursor(state2.position.anchor) : null;
-      const head = state2.position?.head ? this._cursorConverter.fromCursor(state2.position.head) : null;
+    for (const state of awarenessStates) {
+      const anchor = state.position?.anchor ? this._cursorConverter.fromCursor(state.position.anchor) : null;
+      const head = state.position?.head ? this._cursorConverter.fromCursor(state.position.head) : null;
       if (anchor == null || head == null) {
         continue;
       }
@@ -725,8 +878,8 @@ var RemoteSelectionsDecorator = class {
       const end = Math.min(Math.max(anchor, head), view.state.doc.length);
       const startLine = view.state.doc.lineAt(start);
       const endLine = view.state.doc.lineAt(end);
-      const darkColor = state2.info.darkColor;
-      const lightColor = state2.info.lightColor;
+      const darkColor = state.info.darkColor;
+      const lightColor = state.info.lightColor;
       if (startLine.number === endLine.number) {
         decorations.push({
           from: start,
@@ -779,7 +932,7 @@ var RemoteSelectionsDecorator = class {
         value: import_view5.Decoration.widget({
           side: head - anchor > 0 ? -1 : 1,
           block: false,
-          widget: new RemoteCaretWidget(state2.info.displayName ?? "Anonymous", darkColor)
+          widget: new RemoteCaretWidget(state.info.displayName ?? "Anonymous", darkColor)
         })
       });
     }
@@ -879,7 +1032,7 @@ var styles2 = import_view5.EditorView.theme({
     transitionDelay: "0s"
   }
 });
-var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/awareness/awareness-provider.ts";
+var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/awareness/awareness-provider.ts";
 var DEBOUNCE_INTERVAL = 100;
 var SpaceAwarenessProvider = class {
   constructor(params) {
@@ -892,7 +1045,7 @@ var SpaceAwarenessProvider = class {
   }
   open() {
     this._ctx = new import_context2.Context(void 0, {
-      F: __dxlog_file3,
+      F: __dxlog_file4,
       L: 57
     });
     this._postTask = new import_async2.DeferredTask(this._ctx, async () => {
@@ -919,10 +1072,10 @@ var SpaceAwarenessProvider = class {
     void this._space.postMessage(this._channel, {
       kind: "query"
     }).catch((err) => {
-      import_log2.log.debug("failed to query awareness", {
+      import_log3.log.debug("failed to query awareness", {
         err
       }, {
-        F: __dxlog_file3,
+        F: __dxlog_file4,
         L: 91,
         S: this,
         C: (f, a) => f(...a)
@@ -939,7 +1092,7 @@ var SpaceAwarenessProvider = class {
   }
   update(position) {
     (0, import_invariant.invariant)(this._postTask, void 0, {
-      F: __dxlog_file3,
+      F: __dxlog_file4,
       L: 106,
       S: this,
       A: [
@@ -956,7 +1109,7 @@ var SpaceAwarenessProvider = class {
   }
   _handleQueryMessage() {
     (0, import_invariant.invariant)(this._postTask, void 0, {
-      F: __dxlog_file3,
+      F: __dxlog_file4,
       L: 117,
       S: this,
       A: [
@@ -968,7 +1121,7 @@ var SpaceAwarenessProvider = class {
   }
   _handlePostMessage(message) {
     (0, import_invariant.invariant)(message.kind === "post", void 0, {
-      F: __dxlog_file3,
+      F: __dxlog_file4,
       L: 122,
       S: this,
       A: [
@@ -980,7 +1133,7 @@ var SpaceAwarenessProvider = class {
     this.remoteStateChange.emit();
   }
 };
-var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/blast.ts";
+var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/blast.ts";
 var defaultOptions = {
   effect: 2,
   maxParticles: 200,
@@ -1107,7 +1260,7 @@ var Blaster = class {
   }
   initialize() {
     (0, import_invariant2.invariant)(!this._canvas && !this._ctx, void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file5,
       L: 141,
       S: this,
       A: [
@@ -1144,7 +1297,7 @@ var Blaster = class {
   }
   start() {
     (0, import_invariant2.invariant)(this._canvas && this._ctx, void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file5,
       L: 180,
       S: this,
       A: [
@@ -1285,10 +1438,10 @@ var random = (min, max) => {
   }
   return min + ~~(Math.random() * (max - min + 1));
 };
-var commandConfig = (0, import_chunk_GZWIENFM.singleValueFacet)();
-var commandState = import_state7.StateField.define({
+var commandConfig = singleValueFacet();
+var commandState = import_state8.StateField.define({
   create: () => ({}),
-  update: (state2, tr) => {
+  update: (state, tr) => {
     for (const effect of tr.effects) {
       if (effect.is(closeEffect)) {
         return {};
@@ -1339,14 +1492,14 @@ var commandState = import_state7.StateField.define({
         };
       }
     }
-    return state2;
+    return state;
   },
   provide: (field) => [
     import_view9.showTooltip.from(field, (value) => value.tooltip ?? null)
   ]
 });
-var openEffect = import_state7.StateEffect.define();
-var closeEffect = import_state7.StateEffect.define();
+var openEffect = import_state8.StateEffect.define();
+var closeEffect = import_state8.StateEffect.define();
 var openCommand = (view) => {
   if (view.state.field(commandState, false)) {
     const selection = view.state.selection.main;
@@ -1382,65 +1535,6 @@ var commandKeyBindings = [
     run: closeCommand
   }
 ];
-var flattenRect = (rect, left) => {
-  const x = left ? rect.left : rect.right;
-  return {
-    left: x,
-    right: x,
-    top: rect.top,
-    bottom: rect.bottom
-  };
-};
-var scratchRange;
-var textRange = (node, from, to = from) => {
-  const range = scratchRange || (scratchRange = document.createRange());
-  range.setEnd(node, to);
-  range.setStart(node, from);
-  return range;
-};
-var clientRectsFor = (dom) => {
-  if (dom.nodeType === 3) {
-    return textRange(dom, 0, dom.nodeValue.length).getClientRects();
-  } else if (dom.nodeType === 1) {
-    return dom.getClientRects();
-  } else {
-    return [];
-  }
-};
-var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/util/error.ts";
-var wrapWithCatch = (fn) => {
-  return (...args) => {
-    try {
-      return fn(...args);
-    } catch (err) {
-      import_log3.log.catch(err, void 0, {
-        F: __dxlog_file5,
-        L: 12,
-        S: void 0,
-        C: (f, a) => f(...a)
-      });
-    }
-  };
-};
-var overlap = (a, b) => a.from <= b.to && a.to >= b.from;
-var createElement = (tag, options, children) => {
-  const el = document.createElement(tag);
-  if (options?.className) {
-    el.className = options.className;
-  }
-  if (children) {
-    el.append(...Array.isArray(children) ? children : [
-      children
-    ]);
-  }
-  return el;
-};
-var renderRoot = (root, node) => {
-  (0, import_client.createRoot)(root).render(/* @__PURE__ */ import_react3.default.createElement(import_react_ui2.ThemeProvider, {
-    tx: import_react_ui_theme2.defaultTx
-  }, node));
-  return root;
-};
 var CommandHint = class extends import_view8.WidgetType {
   constructor(content) {
     super();
@@ -1485,7 +1579,7 @@ var hintViewPlugin = ({ onHint }) => import_view8.ViewPlugin.fromClass(class {
     this.deco = import_view8.Decoration.none;
   }
   update(update2) {
-    const builder = new import_state6.RangeSetBuilder();
+    const builder = new import_state7.RangeSetBuilder();
     const cState = update2.view.state.field(commandState, false);
     if (!cState?.tooltip) {
       const selection = update2.view.state.selection.main;
@@ -1517,56 +1611,99 @@ var command = (options) => {
     })
   ];
 };
-var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/util.ts";
-var callbackWrapper = (fn) => (...args) => {
-  try {
-    return fn(...args);
-  } catch (err) {
-    import_log5.log.catch(err, void 0, {
+var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/selection.ts";
+var documentId = singleValueFacet();
+var stateRestoreAnnotation = "dxos.org/cm/state-restore";
+var createEditorStateTransaction = ({ scrollTo, selection }) => {
+  return {
+    selection,
+    scrollIntoView: !scrollTo,
+    effects: scrollTo ? import_view11.EditorView.scrollIntoView(scrollTo, {
+      yMargin: 96
+    }) : void 0,
+    annotations: import_state10.Transaction.userEvent.of(stateRestoreAnnotation)
+  };
+};
+var createEditorStateStore = (keyPrefix) => ({
+  getState: (id) => {
+    (0, import_invariant3.invariant)(id, void 0, {
       F: __dxlog_file6,
-      L: 19,
+      L: 47,
       S: void 0,
-      C: (f, a) => f(...a)
+      A: [
+        "id",
+        ""
+      ]
     });
-  }
-};
-var debugDispatcher = (trs, view) => {
-  logChanges(trs);
-  view.update(trs);
-};
-var logChanges = (trs) => {
-  const changes = trs.flatMap((tr) => {
-    if (tr.changes.empty) {
-      return void 0;
-    }
-    const changes2 = [];
-    tr.changes.iterChanges((fromA, toA, fromB, toB, inserted) => changes2.push(JSON.stringify({
-      fromA,
-      toA,
-      fromB,
-      toB,
-      inserted: inserted.toString()
-    })));
-    return changes2;
-  }).filter(Boolean);
-  if (changes.length) {
-    import_log5.log.info("changes", {
-      changes
-    }, {
+    const state = localStorage.getItem(`${keyPrefix}/${id}`);
+    return state ? JSON.parse(state) : void 0;
+  },
+  setState: (id, state) => {
+    (0, import_invariant3.invariant)(id, void 0, {
       F: __dxlog_file6,
-      L: 49,
+      L: 53,
       S: void 0,
-      C: (f, a) => f(...a)
+      A: [
+        "id",
+        ""
+      ]
     });
+    localStorage.setItem(`${keyPrefix}/${id}`, JSON.stringify(state));
   }
+});
+var selectionState = ({ getState, setState } = {}) => {
+  const setStateDebounced = (0, import_async4.debounce)(setState, 1e3);
+  return [
+    // TODO(burdon): Track scrolling (currently only updates when cursor moves).
+    // EditorView.domEventHandlers({
+    //   scroll: (event) => {
+    //     setStateDebounced(id, {});
+    //   },
+    // }),
+    import_view11.EditorView.updateListener.of(({ view, transactions }) => {
+      const id = view.state.facet(documentId);
+      if (!id || transactions.some((tr) => tr.isUserEvent(stateRestoreAnnotation))) {
+        return;
+      }
+      if (setState) {
+        const { scrollTop } = view.scrollDOM;
+        const pos = view.posAtCoords({
+          x: 0,
+          y: scrollTop
+        });
+        if (pos !== null) {
+          const { anchor, head } = view.state.selection.main;
+          setStateDebounced(id, {
+            scrollTo: pos,
+            selection: {
+              anchor,
+              head
+            }
+          });
+        }
+      }
+    }),
+    getState && import_view11.keymap.of([
+      {
+        key: "ctrl-r",
+        run: (view) => {
+          const state = getState(view.state.facet(documentId));
+          if (state) {
+            view.dispatch(createEditorStateTransaction(state));
+          }
+          return true;
+        }
+      }
+    ])
+  ].filter(import_util3.isNotFalsy);
 };
 var __dxlog_file7 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/comments.ts";
-var setComments = import_state8.StateEffect.define();
-var setSelection = import_state8.StateEffect.define();
-var setCommentState = import_state8.StateEffect.define();
-var commentsState = import_state8.StateField.define({
-  create: (state2) => ({
-    id: state2.facet(import_chunk_GZWIENFM.documentId),
+var setComments = import_state9.StateEffect.define();
+var setSelection = import_state9.StateEffect.define();
+var setCommentState = import_state9.StateEffect.define();
+var commentsState = import_state9.StateField.define({
+  create: (state) => ({
+    id: state.facet(documentId),
     comments: [],
     selection: {}
   }),
@@ -1584,7 +1721,7 @@ var commentsState = import_state8.StateField.define({
           if (!comment.cursor) {
             return void 0;
           }
-          const range = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(tr.state, comment.cursor);
+          const range = Cursor.getRangeFromCursor(tr.state, comment.cursor);
           return range && {
             comment,
             range
@@ -1624,14 +1761,14 @@ var createCommentMark = (id, isCurrent) => import_view10.Decoration.mark({
 });
 var commentsDecorations = import_view10.EditorView.decorations.compute([
   commentsState
-], (state2) => {
-  const { selection: { current }, comments: comments2 } = state2.field(commentsState);
+], (state) => {
+  const { selection: { current }, comments: comments2 } = state.field(commentsState);
   const decorations = (0, import_lodash2.default)(comments2 ?? [], (range) => range.range.from)?.flatMap((comment) => {
     const range = comment.range;
     if (!range) {
       import_log4.log.warn("Invalid range:", range, {
         F: __dxlog_file7,
-        L: 143,
+        L: 142,
         S: void 0,
         C: (f, a) => f(...a)
       });
@@ -1644,7 +1781,7 @@ var commentsDecorations = import_view10.EditorView.decorations.compute([
   }).filter(import_util2.nonNullable);
   return import_view10.Decoration.set(decorations);
 });
-var commentClickedEffect = import_state8.StateEffect.define();
+var commentClickedEffect = import_state9.StateEffect.define();
 var handleCommentClick = import_view10.EditorView.domEventHandlers({
   click: (event, view) => {
     let target = event.target;
@@ -1747,7 +1884,7 @@ var trackPastedComments = (onUpdate) => {
         const { comments: comments2 } = update2.startState.field(commentsState);
         const exists = comments2.some((c) => c.comment.id === comment.id && c.range.from < c.range.to);
         if (!exists) {
-          const cursor = import_chunk_GZWIENFM.Cursor.getCursorFromRange(update2.state, comment);
+          const cursor = Cursor.getCursorFromRange(update2.state, comment);
           onUpdate({
             id: comment.id,
             cursor
@@ -1762,7 +1899,7 @@ var mapTrackedComment = (comment, changes) => ({
   from: changes.mapPos(comment.from, 1),
   to: changes.mapPos(comment.to, 1)
 });
-var restoreCommentEffect = import_state8.StateEffect.define({
+var restoreCommentEffect = import_state9.StateEffect.define({
   map: mapTrackedComment
 });
 var createComment = (view) => {
@@ -1779,7 +1916,7 @@ var createComment = (view) => {
       }
     });
   }
-  const cursor = import_chunk_GZWIENFM.Cursor.getCursorFromRange(view.state, {
+  const cursor = Cursor.getCursorFromRange(view.state, {
     from,
     to
   });
@@ -1793,13 +1930,13 @@ var createComment = (view) => {
   }
   return false;
 };
-var optionsFacet = (0, import_chunk_GZWIENFM.singleValueFacet)();
+var optionsFacet = singleValueFacet();
 var comments = (options = {}) => {
   const { key: shortcut = "meta-'" } = options;
-  const handleSelect = (0, import_async3.debounce)((state2) => options.onSelect?.(state2), 200);
+  const handleSelect = (0, import_async3.debounce)((state) => options.onSelect?.(state), 200);
   return [
     optionsFacet.of(options),
-    options.id ? import_chunk_GZWIENFM.documentId.of(options.id) : void 0,
+    options.id ? documentId.of(options.id) : void 0,
     commentsState,
     commentsDecorations,
     handleCommentClick,
@@ -1846,13 +1983,13 @@ var comments = (options = {}) => {
     //
     // Track deleted ranges and update ranges for decorations.
     //
-    import_view10.EditorView.updateListener.of(({ view, state: state2, changes }) => {
+    import_view10.EditorView.updateListener.of(({ view, state, changes }) => {
       let mod = false;
-      const { comments: comments2, ...value } = state2.field(commentsState);
+      const { comments: comments2, ...value } = state.field(commentsState);
       changes.iterChanges((from, to, from2, to2) => {
         comments2.forEach(({ comment, range }) => {
           if (from2 === to2) {
-            const newRange = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(view.state, comment.cursor);
+            const newRange = Cursor.getRangeFromCursor(view.state, comment.cursor);
             if (!newRange || newRange.to - newRange.from === 0) {
               options.onDelete?.({
                 id: comment.id
@@ -1860,7 +1997,7 @@ var comments = (options = {}) => {
             }
           }
           if (from <= range.to) {
-            const newRange = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(view.state, comment.cursor);
+            const newRange = Cursor.getRangeFromCursor(view.state, comment.cursor);
             Object.assign(range, newRange);
             mod = true;
           }
@@ -1878,10 +2015,10 @@ var comments = (options = {}) => {
     //
     // Track selection/proximity.
     //
-    import_view10.EditorView.updateListener.of(({ view, state: state2 }) => {
+    import_view10.EditorView.updateListener.of(({ view, state }) => {
       let min = Infinity;
-      const { selection: { current, closest }, comments: comments2 } = state2.field(commentsState);
-      const { head } = state2.selection.main;
+      const { selection: { current, closest }, comments: comments2 } = state.field(commentsState);
+      const { head } = state.selection.main;
       const selection = {};
       comments2.forEach(({ comment, range }) => {
         if (head >= range.from && head <= range.to) {
@@ -1902,7 +2039,7 @@ var comments = (options = {}) => {
         });
         handleSelect({
           selection,
-          id: state2.facet(import_chunk_GZWIENFM.documentId),
+          id: state.facet(documentId),
           comments: comments2.map(({ comment, range }) => ({
             comment,
             range,
@@ -1919,7 +2056,7 @@ var scrollThreadIntoView = (view, id, center = true) => {
   if (!comment?.comment.cursor) {
     return;
   }
-  const range = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(view.state, comment.comment.cursor);
+  const range = Cursor.getRangeFromCursor(view.state, comment.comment.cursor);
   if (range) {
     const currentSelection = view.state.selection.main;
     const currentScrollPosition = view.scrollDOM.scrollTop;
@@ -1943,12 +2080,12 @@ var scrollThreadIntoView = (view, id, center = true) => {
     }
   }
 };
-var selectionOverlapsComment = (state2) => {
-  const commentState = state2.field(commentsState, false);
+var selectionOverlapsComment = (state) => {
+  const commentState = state.field(commentsState, false);
   if (commentState === void 0) {
     return false;
   }
-  const { selection } = state2;
+  const { selection } = state;
   for (const range of selection.ranges) {
     if (commentState.comments.some(({ range: commentRange }) => overlap(commentRange, range))) {
       return true;
@@ -1956,8 +2093,8 @@ var selectionOverlapsComment = (state2) => {
   }
   return false;
 };
-var hasActiveSelection = (state2) => {
-  return state2.selection.ranges.some((range) => !range.empty);
+var hasActiveSelection = (state) => {
+  return state.selection.ranges.some((range) => !range.empty);
 };
 var ExternalCommentSync = class {
   constructor(view, id, subscribe, getComments) {
@@ -1966,7 +2103,7 @@ var ExternalCommentSync = class {
     };
     const updateComments = () => {
       const comments2 = getComments();
-      if (id === view.state.facet(import_chunk_GZWIENFM.documentId)) {
+      if (id === view.state.facet(documentId)) {
         queueMicrotask(() => view.dispatch({
           effects: setComments.of({
             id,
@@ -1984,7 +2121,7 @@ var createExternalCommentSync = (id, subscribe, getComments) => import_view10.Vi
   }
 });
 var useCommentState = () => {
-  const [state2, setState] = (0, import_react4.useState)({
+  const [state, setState] = (0, import_react4.useState)({
     comment: false,
     selection: false
   });
@@ -1997,14 +2134,14 @@ var useCommentState = () => {
     }
   }), []);
   return [
-    state2,
+    state,
     observer
   ];
 };
 var useComments = (view, id, comments2) => {
   (0, import_react4.useEffect)(() => {
     if (view) {
-      if (id === view.state.facet(import_chunk_GZWIENFM.documentId)) {
+      if (id === view.state.facet(documentId)) {
         view.dispatch({
           effects: setComments.of({
             id,
@@ -2028,16 +2165,16 @@ var useCommentClickListener = (onCommentClick) => {
     onCommentClick
   ]);
 };
-var debugNodeLogger = (log9 = console.log) => {
-  const logTokens = (state2) => (0, import_language.syntaxTree)(state2).iterate({
-    enter: (node) => log9(node.type)
+var debugNodeLogger = (log8 = console.log) => {
+  const logTokens = (state) => (0, import_language.syntaxTree)(state).iterate({
+    enter: (node) => log8(node.type)
   });
-  return import_state9.StateField.define({
-    create: (state2) => logTokens(state2),
+  return import_state11.StateField.define({
+    create: (state) => logTokens(state),
     update: (_, tr) => logTokens(tr.state)
   });
 };
-var styles4 = import_view11.EditorView.theme({
+var styles4 = import_view12.EditorView.theme({
   ".cm-dropCursor": {
     borderLeft: "2px solid var(--dx-accentText)",
     color: "var(--dx-accentText)",
@@ -2050,8 +2187,8 @@ var styles4 = import_view11.EditorView.theme({
 var dropFile = (options = {}) => {
   return [
     styles4,
-    (0, import_view11.dropCursor)(),
-    import_view11.EditorView.domEventHandlers({
+    (0, import_view12.dropCursor)(),
+    import_view12.EditorView.domEventHandlers({
       drop: (event, view) => {
         event.preventDefault();
         const files = event.dataTransfer?.files;
@@ -2070,6 +2207,33 @@ var dropFile = (options = {}) => {
     })
   ];
 };
+var focusEffect = import_state13.StateEffect.define();
+var focusField = import_state13.StateField.define({
+  create: () => false,
+  update: (value, tr) => {
+    for (const effect of tr.effects) {
+      if (effect.is(focusEffect)) {
+        return effect.value;
+      }
+    }
+    return value;
+  }
+});
+var focus = [
+  focusField,
+  import_view14.EditorView.domEventHandlers({
+    focus: (event, view) => {
+      setTimeout(() => view.dispatch({
+        effects: focusEffect.of(true)
+      }));
+    },
+    blur: (event, view) => {
+      setTimeout(() => view.dispatch({
+        effects: focusEffect.of(false)
+      }));
+    }
+  })
+];
 var headings = {
   1: "text-4xl",
   2: "text-3xl",
@@ -2290,13 +2454,14 @@ var defaultTheme = {
   }
 };
 var __dxlog_file8 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/factories.ts";
-var preventNewline = import_state10.EditorState.transactionFilter.of((tr) => tr.newDoc.lines > 1 ? [] : tr);
+var preventNewline = import_state12.EditorState.transactionFilter.of((tr) => tr.newDoc.lines > 1 ? [] : tr);
 var defaultBasicOptions = {
   allowMultipleSelections: true,
   bracketMatching: true,
   closeBrackets: true,
   drawSelection: true,
   editable: true,
+  focus: true,
   history: true,
   keymap: "standard",
   lineWrapping: true,
@@ -2312,34 +2477,35 @@ var createBasicExtensions = (_props) => {
   const props = (0, import_lodash3.default)({}, _props, defaultBasicOptions);
   return [
     // NOTE: Doesn't catch errors in keymap functions.
-    import_view12.EditorView.exceptionSink.of((err) => {
-      import_log6.log.catch(err, void 0, {
+    import_view13.EditorView.exceptionSink.of((err) => {
+      import_log5.log.catch(err, void 0, {
         F: __dxlog_file8,
-        L: 93,
+        L: 96,
         S: void 0,
         C: (f, a) => f(...a)
       });
     }),
-    props.allowMultipleSelections && import_state10.EditorState.allowMultipleSelections.of(true),
+    props.allowMultipleSelections && import_state12.EditorState.allowMultipleSelections.of(true),
     props.bracketMatching && (0, import_language2.bracketMatching)(),
     props.closeBrackets && (0, import_autocomplete2.closeBrackets)(),
-    props.dropCursor && (0, import_view12.dropCursor)(),
-    props.drawSelection && (0, import_view12.drawSelection)({
+    props.dropCursor && (0, import_view13.dropCursor)(),
+    props.drawSelection && (0, import_view13.drawSelection)({
       cursorBlinkRate: 1200
     }),
-    props.highlightActiveLine && (0, import_view12.highlightActiveLine)(),
+    props.focus && focus,
+    props.highlightActiveLine && (0, import_view13.highlightActiveLine)(),
     props.history && (0, import_commands2.history)(),
-    props.lineNumbers && (0, import_view12.lineNumbers)(),
-    props.lineWrapping && import_view12.EditorView.lineWrapping,
-    props.placeholder && (0, import_view12.placeholder)(props.placeholder),
+    props.lineNumbers && (0, import_view13.lineNumbers)(),
+    props.lineWrapping && import_view13.EditorView.lineWrapping,
+    props.placeholder && (0, import_view13.placeholder)(props.placeholder),
     props.readonly && [
-      import_state10.EditorState.readOnly.of(true),
-      import_view12.EditorView.editable.of(false)
+      import_state12.EditorState.readOnly.of(true),
+      import_view13.EditorView.editable.of(false)
     ],
-    props.scrollPastEnd && (0, import_view12.scrollPastEnd)(),
-    props.tabSize && import_state10.EditorState.tabSize.of(props.tabSize),
+    props.scrollPastEnd && (0, import_view13.scrollPastEnd)(),
+    props.tabSize && import_state12.EditorState.tabSize.of(props.tabSize),
     // https://codemirror.net/docs/ref/#view.KeyBinding
-    import_view12.keymap.of([
+    import_view13.keymap.of([
       ...(props.keymap && keymaps[props.keymap]) ?? [],
       // NOTE: Tabs are also configured by markdown extension.
       // https://codemirror.net/docs/ref/#commands.indentWithTab
@@ -2352,8 +2518,8 @@ var createBasicExtensions = (_props) => {
       ...props.history ? import_commands2.historyKeymap : [],
       // https://codemirror.net/docs/ref/#search.searchKeymap
       ...props.search ? import_search.searchKeymap : []
-    ].filter(import_util3.isNotFalsy))
-  ].filter(import_util3.isNotFalsy);
+    ].filter(import_util4.isNotFalsy))
+  ].filter(import_util4.isNotFalsy);
 };
 var defaultThemeSlots = {
   editor: {
@@ -2363,17 +2529,17 @@ var defaultThemeSlots = {
 var createThemeExtensions = ({ themeMode, styles: styles5, syntaxHighlighting: _syntaxHighlighting, slots: _slots } = {}) => {
   const slots = (0, import_lodash3.default)({}, _slots, defaultThemeSlots);
   return [
-    import_view12.EditorView.darkTheme.of(themeMode === "dark"),
-    import_view12.EditorView.baseTheme(styles5 ? (0, import_lodash4.default)({}, defaultTheme, styles5) : defaultTheme),
+    import_view13.EditorView.darkTheme.of(themeMode === "dark"),
+    import_view13.EditorView.baseTheme(styles5 ? (0, import_lodash4.default)({}, defaultTheme, styles5) : defaultTheme),
     // https://github.com/codemirror/theme-one-dark
     _syntaxHighlighting && (themeMode === "dark" ? (0, import_language2.syntaxHighlighting)(import_theme_one_dark.oneDarkHighlightStyle) : (0, import_language2.syntaxHighlighting)(import_language2.defaultHighlightStyle)),
-    slots.editor?.className && import_view12.EditorView.editorAttributes.of({
+    slots.editor?.className && import_view13.EditorView.editorAttributes.of({
       class: slots.editor.className
     }),
-    slots.content?.className && import_view12.EditorView.contentAttributes.of({
+    slots.content?.className && import_view13.EditorView.contentAttributes.of({
       class: slots.content.className
     })
-  ].filter(import_util3.isNotFalsy);
+  ].filter(import_util4.isNotFalsy);
 };
 var createDataExtensions = ({ id, text, space, identity }) => {
   const extensions = [];
@@ -2382,7 +2548,7 @@ var createDataExtensions = ({ id, text, space, identity }) => {
   }
   if (space && identity) {
     const peerId = identity?.identityKey.toHex();
-    const { cursorLightValue, cursorDarkValue } = import_react_ui_theme3.hueTokens[identity?.profile?.data?.hue ?? (0, import_util3.hexToHue)(peerId ?? "0")];
+    const { cursorLightValue, cursorDarkValue } = import_react_ui_theme3.hueTokens[identity?.profile?.data?.hue ?? (0, import_util4.hexToHue)(peerId ?? "0")];
     extensions.push(awareness(new SpaceAwarenessProvider({
       space,
       channel: `awareness.${id}`,
@@ -2417,7 +2583,7 @@ var folding = (_props = {}) => [
       }));
     }
   }),
-  import_view13.EditorView.theme({
+  import_view15.EditorView.theme({
     ".cm-foldGutter": {
       opacity: 0.3,
       transition: "opacity 0.3s",
@@ -2430,11 +2596,11 @@ var folding = (_props = {}) => [
 ];
 var listener = ({ onFocus, onChange }) => {
   const extensions = [];
-  onFocus && extensions.push(import_view14.EditorView.focusChangeEffect.of((_, focusing) => {
+  onFocus && extensions.push(import_view16.EditorView.focusChangeEffect.of((_, focusing) => {
     onFocus(focusing);
     return null;
   }));
-  onChange && extensions.push(import_view14.EditorView.updateListener.of((update2) => {
+  onChange && extensions.push(import_view16.EditorView.updateListener.of((update2) => {
     onChange(update2.state.doc.toString());
   }));
   return extensions;
@@ -2454,13 +2620,13 @@ var List;
   List2[List2["Task"] = 2] = "Task";
 })(List || (List = {}));
 var setHeading = (level) => {
-  return ({ state: state2, dispatch }) => {
-    const { selection: { ranges }, doc } = state2;
+  return ({ state, dispatch }) => {
+    const { selection: { ranges }, doc } = state;
     const changes = [];
     let prevBlock = -1;
     for (const range of ranges) {
       let sawBlock = false;
-      (0, import_language4.syntaxTree)(state2).iterate({
+      (0, import_language4.syntaxTree)(state).iterate({
         from: range.from,
         to: range.to,
         enter: (node) => {
@@ -2513,7 +2679,7 @@ var setHeading = (level) => {
         }
       });
       let line;
-      if (!sawBlock && range.empty && level > 0 && !/\S/.test((line = state2.doc.lineAt(range.from)).text)) {
+      if (!sawBlock && range.empty && level > 0 && !/\S/.test((line = state.doc.lineAt(range.from)).text)) {
         changes.push({
           from: line.from,
           to: line.to,
@@ -2524,10 +2690,10 @@ var setHeading = (level) => {
     if (!changes.length) {
       return false;
     }
-    const changeSet = state2.changes(changes);
-    dispatch(state2.update({
+    const changeSet = state.changes(changes);
+    dispatch(state.update({
       changes: changeSet,
-      selection: state2.selection.map(changeSet, 1),
+      selection: state.selection.map(changeSet, 1),
       userEvent: "format.setHeading",
       scrollIntoView: true
     }));
@@ -2535,14 +2701,14 @@ var setHeading = (level) => {
   };
 };
 var setStyle = (type, enable) => {
-  return ({ state: state2, dispatch }) => {
+  return ({ state, dispatch }) => {
     const marker = inlineMarkerText(type);
-    const changes = state2.changeByRange((range) => {
+    const changes = state.changeByRange((range) => {
       if (!enable && range.empty) {
-        const after = state2.doc.sliceString(range.head, range.head + 6);
+        const after = state.doc.sliceString(range.head, range.head + 6);
         const found = after.indexOf(marker);
         if (found >= 0 && /^[*~`]*$/.test(after.slice(0, found))) {
-          const before = state2.doc.sliceString(range.head - 6, range.head);
+          const before = state.doc.sliceString(range.head - 6, range.head);
           if (before.slice(before.length - found - marker.length, before.length - found) === marker && [
             ...before.slice(before.length - found)
           ].reverse().join("") === after.slice(0, found)) {
@@ -2557,7 +2723,7 @@ var setStyle = (type, enable) => {
                   to: range.head + found + marker.length
                 }
               ],
-              range: import_state11.EditorSelection.cursor(range.from - marker.length)
+              range: import_state14.EditorSelection.cursor(range.from - marker.length)
             };
           }
         }
@@ -2569,14 +2735,14 @@ var setStyle = (type, enable) => {
       let startCovered = false;
       let endCovered = false;
       let { from, to } = range;
-      (0, import_language4.syntaxTree)(state2).iterate({
+      (0, import_language4.syntaxTree)(state).iterate({
         from,
         to,
         enter: (node) => {
           const { name } = node;
           if (Object.hasOwn(Textblocks, name) && Textblocks[name] !== "codeblock") {
             blockStart = blockContentStart(node);
-            blockEnd = blockContentEnd(node, state2.doc);
+            blockEnd = blockContentEnd(node, state.doc);
             startCovered = endCovered = false;
           } else if (name === "Link" || name === "Image" && enable) {
             if (from < node.from && to > node.from && to <= node.to) {
@@ -2621,7 +2787,7 @@ var setStyle = (type, enable) => {
                 });
                 if (markType !== type && closeStart >= to) {
                   changesAtEnd.push({
-                    from: skipSpaces(Math.min(to, blockEnd), state2.doc, 1, blockEnd),
+                    from: skipSpaces(Math.min(to, blockEnd), state.doc, 1, blockEnd),
                     insert: inlineMarkerText(markType)
                   });
                 }
@@ -2633,7 +2799,7 @@ var setStyle = (type, enable) => {
                 });
                 if (markType !== type && openEnd <= from) {
                   changes2.push({
-                    from: skipSpaces(Math.max(from, blockStart), state2.doc, -1, blockStart),
+                    from: skipSpaces(Math.max(from, blockStart), state.doc, -1, blockStart),
                     insert: inlineMarkerText(markType)
                   });
                 }
@@ -2663,7 +2829,7 @@ var setStyle = (type, enable) => {
                 changes2.push(startCovered);
               } else if (startCovered) {
                 changes2.push({
-                  from: skipSpaces(rangeStart, state2.doc, -1, blockStart),
+                  from: skipSpaces(rangeStart, state.doc, -1, blockStart),
                   insert: marker
                 });
               }
@@ -2671,7 +2837,7 @@ var setStyle = (type, enable) => {
                 changes2.push(endCovered);
               } else if (endCovered) {
                 changes2.push({
-                  from: skipSpaces(rangeEnd, state2.doc, 1, blockEnd),
+                  from: skipSpaces(rangeEnd, state.doc, 1, blockEnd),
                   insert: marker
                 });
               }
@@ -2679,22 +2845,22 @@ var setStyle = (type, enable) => {
           }
         }
       });
-      if (blockStart < 0 && range.empty && enable && !/\S/.test(state2.doc.lineAt(range.from).text)) {
+      if (blockStart < 0 && range.empty && enable && !/\S/.test(state.doc.lineAt(range.from).text)) {
         return {
           changes: {
             from: range.head,
             insert: marker + marker
           },
-          range: import_state11.EditorSelection.cursor(range.head + marker.length)
+          range: import_state14.EditorSelection.cursor(range.head + marker.length)
         };
       }
-      const changeSet = state2.changes(changes2.concat(changesAtEnd));
+      const changeSet = state.changes(changes2.concat(changesAtEnd));
       return {
         changes: changeSet,
-        range: range.empty && !changeSet.empty ? import_state11.EditorSelection.cursor(range.head + marker.length) : import_state11.EditorSelection.range(changeSet.mapPos(range.from, 1), changeSet.mapPos(range.to, -1))
+        range: range.empty && !changeSet.empty ? import_state14.EditorSelection.cursor(range.head + marker.length) : import_state14.EditorSelection.range(changeSet.mapPos(range.from, 1), changeSet.mapPos(range.to, -1))
       };
     });
-    dispatch(state2.update(changes, {
+    dispatch(state.update(changes, {
       userEvent: enable ? "format.style.add" : "format.style.remove",
       scrollIntoView: true
     }));
@@ -2771,8 +2937,8 @@ var insertTable = (view) => {
   const { from } = doc.line(number);
   snippets.table(view, null, from, from);
 };
-var removeLinkInner = (from, to, changes, state2) => {
-  (0, import_language4.syntaxTree)(state2).iterate({
+var removeLinkInner = (from, to, changes, state) => {
+  (0, import_language4.syntaxTree)(state).iterate({
     from,
     to,
     enter: (node) => {
@@ -2786,8 +2952,8 @@ var removeLinkInner = (from, to, changes, state2) => {
             });
           } else if (name === "LinkTitle" || name === "URL") {
             changes.push({
-              from: skipSpaces(node2.from, state2.doc, -1),
-              to: skipSpaces(node2.to, state2.doc, 1)
+              from: skipSpaces(node2.from, state.doc, -1),
+              to: skipSpaces(node2.to, state.doc, 1)
             });
           }
         });
@@ -2796,15 +2962,15 @@ var removeLinkInner = (from, to, changes, state2) => {
     }
   });
 };
-var removeLink = ({ state: state2, dispatch }) => {
+var removeLink = ({ state, dispatch }) => {
   const changes = [];
-  for (const { from, to } of state2.selection.ranges) {
-    removeLinkInner(from, to, changes, state2);
+  for (const { from, to } of state.selection.ranges) {
+    removeLinkInner(from, to, changes, state);
   }
   if (!changes) {
     return false;
   }
-  dispatch(state2.update({
+  dispatch(state.update({
     changes,
     userEvent: "format.link.remove",
     scrollIntoView: true
@@ -2812,17 +2978,17 @@ var removeLink = ({ state: state2, dispatch }) => {
   return true;
 };
 var addLink = ({ url, image: image2 } = {}) => {
-  return ({ state: state2, dispatch }) => {
-    const changes = state2.changeByRange((range) => {
+  return ({ state, dispatch }) => {
+    const changes = state.changeByRange((range) => {
       let { from, to } = range;
       const cutStyles = [];
       let okay = null;
-      (0, import_language4.syntaxTree)(state2).iterate({
+      (0, import_language4.syntaxTree)(state).iterate({
         from,
         to,
         enter: (node) => {
           if (Object.hasOwn(Textblocks, node.name)) {
-            okay = Textblocks[node.name] !== "codeblock" && from >= blockContentStart(node) && to <= blockContentEnd(node, state2.doc);
+            okay = Textblocks[node.name] !== "codeblock" && from >= blockContentStart(node) && to <= blockContentEnd(node, state.doc);
           } else if (Object.hasOwn(InlineMarker, node.name)) {
             const sNode = node.node;
             if (node.from < from && node.to <= to) {
@@ -2842,7 +3008,7 @@ var addLink = ({ url, image: image2 } = {}) => {
         }
       });
       if (okay === null) {
-        const line = state2.doc.lineAt(from);
+        const line = state.doc.lineAt(from);
         okay = to <= line.to && !/\S/.test(line.text.slice(from - line.from));
       }
       if (!okay) {
@@ -2852,26 +3018,26 @@ var addLink = ({ url, image: image2 } = {}) => {
       }
       const changes2 = [];
       const changesAfter = [];
-      removeLinkInner(from, to, changesAfter, state2);
+      removeLinkInner(from, to, changesAfter, state);
       let cursorOffset = 1;
       for (const style of cutStyles) {
         const type = InlineMarker[style.name];
         const mark = inlineMarkerText(type);
         if (style.from < from) {
           changes2.push({
-            from: skipSpaces(from, state2.doc, -1),
+            from: skipSpaces(from, state.doc, -1),
             insert: mark
           });
           changesAfter.push({
-            from: skipSpaces(from, state2.doc, 1, to),
+            from: skipSpaces(from, state.doc, 1, to),
             insert: mark
           });
         } else {
           changes2.push({
-            from: skipSpaces(to, state2.doc, -1, from),
+            from: skipSpaces(to, state.doc, -1, from),
             insert: mark
           });
-          const after = skipSpaces(to, state2.doc, 1);
+          const after = skipSpaces(to, state.doc, 1);
           if (after === to) {
             cursorOffset += mark.length;
           }
@@ -2888,16 +3054,16 @@ var addLink = ({ url, image: image2 } = {}) => {
         from: to,
         insert: `](${url ?? ""})`
       });
-      const changeSet = state2.changes(changes2.concat(changesAfter));
+      const changeSet = state.changes(changes2.concat(changesAfter));
       return {
         changes: changeSet,
-        range: import_state11.EditorSelection.cursor(changeSet.mapPos(to, 1) - cursorOffset - (url ? url.length + 2 : 0))
+        range: import_state14.EditorSelection.cursor(changeSet.mapPos(to, 1) - cursorOffset - (url ? url.length + 2 : 0))
       };
     });
     if (changes.changes.empty) {
       return false;
     }
-    dispatch(state2.update(changes, {
+    dispatch(state.update(changes, {
       userEvent: "format.link.add",
       scrollIntoView: true
     }));
@@ -2905,14 +3071,14 @@ var addLink = ({ url, image: image2 } = {}) => {
   };
 };
 var addList = (type) => {
-  return ({ state: state2, dispatch }) => {
+  return ({ state, dispatch }) => {
     let lastBlock = -1;
     let counter = 1;
     let first = true;
     let parentColumn = null;
     const blocks = [];
-    for (const { from, to } of state2.selection.ranges) {
-      (0, import_language4.syntaxTree)(state2).iterate({
+    for (const { from, to } of state.selection.ranges) {
+      (0, import_language4.syntaxTree)(state).iterate({
         from,
         to,
         enter: (node) => {
@@ -2924,7 +3090,7 @@ var addList = (type) => {
               }
               if (before?.name === (type === 0 ? "OrderedList" : "BulletList")) {
                 const item = before.lastChild;
-                const itemLine = state2.doc.lineAt(item.from);
+                const itemLine = state.doc.lineAt(item.from);
                 const itemText = itemLine.text.slice(item.from - itemLine.from);
                 parentColumn = item.from - itemLine.from + /^\s*/.exec(itemText)[0].length;
                 if (type === 0) {
@@ -2959,10 +3125,10 @@ var addList = (type) => {
       });
     }
     if (!blocks.length) {
-      const { from, to } = state2.doc.lineAt(state2.selection.main.anchor);
+      const { from, to } = state.doc.lineAt(state.selection.main.anchor);
       if (from === to) {
         const insert = type === 1 ? "- " : type === 0 ? "1. " : "- [ ] ";
-        dispatch(state2.update({
+        dispatch(state.update({
           changes: [
             {
               from,
@@ -2983,11 +3149,11 @@ var addList = (type) => {
     for (let i = 0; i < blocks.length; i++) {
       const { node, counter: counter2, parentColumn: parentColumn2 } = blocks[i];
       const nodeFrom = node.name === "CodeBlock" ? node.from - 4 : node.from;
-      let padding = nodeFrom > 0 && !/\s/.test(state2.doc.sliceString(nodeFrom - 1, nodeFrom)) ? 1 : 0;
+      let padding = nodeFrom > 0 && !/\s/.test(state.doc.sliceString(nodeFrom - 1, nodeFrom)) ? 1 : 0;
       if (type === 0) {
         padding += String(counter2).length;
       }
-      let line = state2.doc.lineAt(nodeFrom);
+      let line = state.doc.lineAt(nodeFrom);
       const column = nodeFrom - line.from;
       if (parentColumn2 !== null && parentColumn2 > column) {
         padding = Math.max(padding, parentColumn2 - column);
@@ -3012,7 +3178,7 @@ var addList = (type) => {
         insert: mark
       });
       while (line.to < node.to) {
-        line = state2.doc.lineAt(line.to + 1);
+        line = state.doc.lineAt(line.to + 1);
         const open = /^[\s>]*/.exec(line.text)[0].length;
         changes.push({
           from: line.from + Math.min(open, column),
@@ -3027,13 +3193,13 @@ var addList = (type) => {
         next = next.nextSibling;
       }
       if (next?.name === "OrderedList") {
-        renumberListItems(next.firstChild, last.counter + 1, changes, state2.doc);
+        renumberListItems(next.firstChild, last.counter + 1, changes, state.doc);
       }
     }
-    const changeSet = state2.changes(changes);
-    dispatch(state2.update({
+    const changeSet = state.changes(changes);
+    dispatch(state.update({
       changes: changeSet,
-      selection: state2.selection.map(changeSet, 1),
+      selection: state.selection.map(changeSet, 1),
       userEvent: "format.list.add",
       scrollIntoView: true
     }));
@@ -3041,13 +3207,13 @@ var addList = (type) => {
   };
 };
 var removeList = (type) => {
-  return ({ state: state2, dispatch }) => {
+  return ({ state, dispatch }) => {
     let lastBlock = -1;
     const changes = [];
     const stack = [];
     const targetNodeType = type === 0 ? "OrderedList" : type === 1 ? "BulletList" : "TaskList";
-    for (const { from, to } of state2.selection.ranges) {
-      (0, import_language4.syntaxTree)(state2).iterate({
+    for (const { from, to } of state.selection.ranges) {
+      (0, import_language4.syntaxTree)(state).iterate({
         from,
         to,
         enter: (node) => {
@@ -3064,7 +3230,7 @@ var removeList = (type) => {
             stack.pop();
           } else if (name === "ListItem" && stack[stack.length - 1] === targetNodeType && node.from !== lastBlock) {
             lastBlock = node.from;
-            let line = state2.doc.lineAt(node.from);
+            let line = state.doc.lineAt(node.from);
             const mark = /^\s*(\d+[.)] |[-*+] (\[[ x]\] )?)/.exec(line.text.slice(node.from - line.from));
             if (!mark) {
               return false;
@@ -3075,7 +3241,7 @@ var removeList = (type) => {
               to: node.from + mark[0].length
             });
             while (line.to < node.to) {
-              line = state2.doc.lineAt(line.to + 1);
+              line = state.doc.lineAt(line.to + 1);
               const open = /^[\s>]*/.exec(line.text)[0].length;
               if (open > column) {
                 changes.push({
@@ -3085,7 +3251,7 @@ var removeList = (type) => {
               }
             }
             if (node.to >= to) {
-              renumberListItems(node.node.nextSibling, 1, changes, state2.doc);
+              renumberListItems(node.node.nextSibling, 1, changes, state.doc);
             }
             return false;
           }
@@ -3095,7 +3261,7 @@ var removeList = (type) => {
     if (!changes.length) {
       return false;
     }
-    dispatch(state2.update({
+    dispatch(state.update({
       changes,
       userEvent: "format.list.remove",
       scrollIntoView: true
@@ -3129,12 +3295,12 @@ var renumberListItems = (item, counter, changes, doc) => {
   }
 };
 var setBlockquote = (enable) => {
-  return ({ state: state2, dispatch }) => {
+  return ({ state, dispatch }) => {
     const lines = [];
     let lastBlock = -1;
-    for (const { from, to } of state2.selection.ranges) {
+    for (const { from, to } of state.selection.ranges) {
       const sawBlock = false;
-      (0, import_language4.syntaxTree)(state2).iterate({
+      (0, import_language4.syntaxTree)(state).iterate({
         from,
         to,
         enter: (node) => {
@@ -3143,9 +3309,9 @@ var setBlockquote = (enable) => {
               return false;
             }
             lastBlock = node.from;
-            let line2 = state2.doc.lineAt(node.from);
+            let line2 = state.doc.lineAt(node.from);
             if (line2.number > 1) {
-              const prevLine = state2.doc.line(line2.number - 1);
+              const prevLine = state.doc.line(line2.number - 1);
               if (/^[>\s]*$/.test(prevLine.text)) {
                 if (!enable || lines.length && lines[lines.length - 1].number === prevLine.number - 1) {
                   lines.push(prevLine);
@@ -3157,10 +3323,10 @@ var setBlockquote = (enable) => {
               if (line2.to >= node.to) {
                 break;
               }
-              line2 = state2.doc.line(line2.number + 1);
+              line2 = state.doc.line(line2.number + 1);
             }
-            if (!enable && line2.number < state2.doc.lines) {
-              const nextLine = state2.doc.line(line2.number + 1);
+            if (!enable && line2.number < state.doc.lines) {
+              const nextLine = state.doc.line(line2.number + 1);
               if (/^[>\s]*$/.test(nextLine.text)) {
                 lines.push(nextLine);
               }
@@ -3170,7 +3336,7 @@ var setBlockquote = (enable) => {
         }
       });
       let line;
-      if (!sawBlock && enable && from === to && !/\S/.test((line = state2.doc.lineAt(from)).text)) {
+      if (!sawBlock && enable && from === to && !/\S/.test((line = state.doc.lineAt(from)).text)) {
         lines.push(line);
       }
     }
@@ -3194,10 +3360,10 @@ var setBlockquote = (enable) => {
     if (!changes.length) {
       return false;
     }
-    const changeSet = state2.changes(changes);
-    dispatch(state2.update({
+    const changeSet = state.changes(changes);
+    dispatch(state.update({
       changes: changeSet,
-      selection: state2.selection.map(changeSet, 1),
+      selection: state.selection.map(changeSet, 1),
       userEvent: enable ? "format.blockquote.add" : "format.blockquote.remove",
       scrollIntoView: true
     }));
@@ -3210,11 +3376,11 @@ var toggleBlockquote = (target) => {
   return (getFormatting(target.state).blockQuote ? removeBlockquote : addBlockquote)(target);
 };
 var addCodeblock = (target) => {
-  const { state: state2, dispatch } = target;
-  const { selection } = state2;
+  const { state, dispatch } = target;
+  const { selection } = state;
   if (selection.ranges.length === 1 && selection.main.empty) {
     const { head } = selection.main;
-    const line = state2.doc.lineAt(head);
+    const line = state.doc.lineAt(head);
     if (!/\S/.test(line.text) && head === line.from) {
       snippets.codeblock(target, null, line.from, line.to);
       return true;
@@ -3224,7 +3390,7 @@ var addCodeblock = (target) => {
   for (const { from, to } of selection.ranges) {
     let blockFrom = from;
     let blockTo = to;
-    (0, import_language4.syntaxTree)(state2).iterate({
+    (0, import_language4.syntaxTree)(state).iterate({
       from,
       to,
       enter: (node) => {
@@ -3233,8 +3399,8 @@ var addCodeblock = (target) => {
             blockFrom = node.from;
             blockTo = node.to;
           } else {
-            blockFrom = Math.min(blockFrom, state2.doc.lineAt(node.from).from);
-            blockTo = Math.max(blockTo, state2.doc.lineAt(node.to).to);
+            blockFrom = Math.min(blockFrom, state.doc.lineAt(node.from).from);
+            blockTo = Math.max(blockTo, state.doc.lineAt(node.to).to);
           }
         }
       }
@@ -3252,7 +3418,7 @@ var addCodeblock = (target) => {
     return false;
   }
   const changes = ranges.map(({ from, to }) => {
-    const column = from - state2.doc.lineAt(from).from;
+    const column = from - state.doc.lineAt(from).from;
     return [
       {
         from,
@@ -3264,30 +3430,30 @@ var addCodeblock = (target) => {
       }
     ];
   });
-  dispatch(state2.update({
+  dispatch(state.update({
     changes,
     userEvent: "format.codeblock.add",
     scrollIntoView: true
   }));
   return true;
 };
-var removeCodeblock = ({ state: state2, dispatch }) => {
+var removeCodeblock = ({ state, dispatch }) => {
   let lastBlock = -1;
   const changes = [];
-  for (const { from, to } of state2.selection.ranges) {
-    (0, import_language4.syntaxTree)(state2).iterate({
+  for (const { from, to } of state.selection.ranges) {
+    (0, import_language4.syntaxTree)(state).iterate({
       from,
       to,
       enter: (node) => {
         if (Textblocks[node.name] === "codeblock" && lastBlock !== node.from) {
           lastBlock = node.from;
-          const firstLine = state2.doc.lineAt(node.from);
+          const firstLine = state.doc.lineAt(node.from);
           if (node.name === "FencedCode") {
             changes.push({
               from: node.from,
               to: firstLine.to + 1 + node.from - firstLine.from
             });
-            const lastLine = state2.doc.lineAt(node.to);
+            const lastLine = state.doc.lineAt(node.to);
             if (/^([\s>]|[-*+] |\d+[).])*`+$/.test(lastLine.text)) {
               changes.push({
                 from: lastLine.from - (lastLine.number === firstLine.number + 1 ? 0 : 1),
@@ -3296,7 +3462,7 @@ var removeCodeblock = ({ state: state2, dispatch }) => {
             }
           } else {
             const column = node.from - firstLine.from;
-            for (let line = firstLine; ; line = state2.doc.line(line.number + 1)) {
+            for (let line = firstLine; ; line = state.doc.line(line.number + 1)) {
               changes.push({
                 from: line.from + column - 4,
                 to: line.from + column
@@ -3313,7 +3479,7 @@ var removeCodeblock = ({ state: state2, dispatch }) => {
   if (!changes.length) {
     return false;
   }
-  dispatch(state2.update({
+  dispatch(state.update({
     changes,
     userEvent: "format.codeblock.remove",
     scrollIntoView: true
@@ -3325,7 +3491,7 @@ var toggleCodeblock = (target) => {
 };
 var formattingKeymap = (_options = {}) => {
   return [
-    import_view15.keymap.of([
+    import_view17.keymap.of([
       {
         key: "meta-b",
         run: toggleStrong
@@ -3376,7 +3542,7 @@ var Textblocks = {
   TableCell: "tablecell",
   Task: "paragraph"
 };
-var getFormatting = (state2) => {
+var getFormatting = (state) => {
   let blockType = null;
   const inline = [
     null,
@@ -3402,7 +3568,7 @@ var getFormatting = (state2) => {
         continue;
       } else if (currentBlock.active[i]) {
         inline[i] = true;
-      } else if (/\S/.test(state2.doc.sliceString(currentBlock.pos, upto))) {
+      } else if (/\S/.test(state.doc.sliceString(currentBlock.pos, upto))) {
         inline[i] = false;
       }
     }
@@ -3413,12 +3579,12 @@ var getFormatting = (state2) => {
       currentBlock.pos = Math.min(upto, currentBlock.end);
     }
   };
-  const { selection } = state2;
+  const { selection } = state;
   for (const range of selection.ranges) {
     if (range.empty && inline.some((v) => v === null)) {
       const contextSize = Math.min(range.head, 6);
-      const contextBefore = state2.doc.sliceString(range.head - contextSize, range.head);
-      let contextAfter = state2.doc.sliceString(range.head, range.head + contextSize);
+      const contextBefore = state.doc.sliceString(range.head - contextSize, range.head);
+      let contextAfter = state.doc.sliceString(range.head, range.head + contextSize);
       for (let i = 0; i < contextSize; i++) {
         const ch = contextAfter[i];
         if (ch !== contextBefore[contextBefore.length - 1 - i] || !/[~`*]/.test(ch)) {
@@ -3437,7 +3603,7 @@ var getFormatting = (state2) => {
         }
       }
     }
-    (0, import_language4.syntaxTree)(state2).iterate({
+    (0, import_language4.syntaxTree)(state).iterate({
       from: range.from,
       to: range.to,
       enter: (node) => {
@@ -3511,7 +3677,7 @@ var getFormatting = (state2) => {
       }
     });
   }
-  const { from, to } = state2.doc.lineAt(selection.main.anchor);
+  const { from, to } = state.doc.lineAt(selection.main.anchor);
   const blankLine = from === to;
   return {
     blankLine,
@@ -3526,8 +3692,8 @@ var getFormatting = (state2) => {
   };
 };
 var useFormattingState = () => {
-  const [state2, setState] = (0, import_react6.useState)();
-  const observer = (0, import_react6.useMemo)(() => import_view15.EditorView.updateListener.of((update2) => {
+  const [state, setState] = (0, import_react6.useState)();
+  const observer = (0, import_react6.useMemo)(() => import_view17.EditorView.updateListener.of((update2) => {
     if (update2.docChanged || update2.selectionSet) {
       setState((prevState) => {
         const newState = getFormatting(update2.state);
@@ -3539,7 +3705,7 @@ var useFormattingState = () => {
     }
   }), []);
   return [
-    state2,
+    state,
     observer
   ];
 };
@@ -3787,7 +3953,7 @@ var createMarkdownExtensions = ({ themeMode } = {}) => {
     }),
     // Custom styles.
     (0, import_language5.syntaxHighlighting)(markdownHighlightStyle()),
-    import_view16.keymap.of([
+    import_view18.keymap.of([
       // https://codemirror.net/docs/ref/#commands.indentWithTab
       import_commands3.indentWithTab,
       // https://codemirror.net/docs/ref/#commands.defaultKeymap
@@ -3797,17 +3963,17 @@ var createMarkdownExtensions = ({ themeMode } = {}) => {
     ])
   ];
 };
-var debugTree = (cb) => import_state12.StateField.define({
-  create: (state2) => cb(convertTreeToJson(state2)),
+var debugTree = (cb) => import_state15.StateField.define({
+  create: (state) => cb(convertTreeToJson(state)),
   update: (value, tr) => cb(convertTreeToJson(tr.state))
 });
-var convertTreeToJson = (state2) => {
+var convertTreeToJson = (state) => {
   const treeToJson = (cursor) => {
     const node = {
       type: cursor.type.name,
       from: cursor.from,
       to: cursor.to,
-      text: state2.doc.slice(cursor.from, cursor.to).toString(),
+      text: state.doc.slice(cursor.from, cursor.to).toString(),
       children: []
     };
     if (cursor.firstChild()) {
@@ -3818,15 +3984,15 @@ var convertTreeToJson = (state2) => {
     }
     return node;
   };
-  return treeToJson((0, import_language7.syntaxTree)(state2).cursor());
+  return treeToJson((0, import_language7.syntaxTree)(state).cursor());
 };
 var adjustChanges = () => {
-  return import_view18.ViewPlugin.fromClass(class {
+  return import_view20.ViewPlugin.fromClass(class {
     update(update2) {
       const tree = (0, import_language9.syntaxTree)(update2.state);
       const adjustments = [];
       for (const tr of update2.transactions) {
-        const event = tr.annotation(import_state14.Transaction.userEvent);
+        const event = tr.annotation(import_state17.Transaction.userEvent);
         switch (event) {
           //
           // Enter
@@ -3960,33 +4126,35 @@ var getValidUrl = (str) => {
   }
 };
 var image = (_options = {}) => {
-  return import_state15.StateField.define({
-    create: (state2) => {
-      return import_view19.Decoration.set(buildDecorations(0, state2.doc.length, state2));
-    },
-    update: (value, tr) => {
-      if (!tr.docChanged && !tr.selection) {
-        return value;
-      }
-      const cursor = tr.state.selection.main.head;
-      const oldCursor = tr.changes.mapPos(tr.startState.selection.main.head);
-      let from = Math.min(cursor, oldCursor);
-      let to = Math.max(cursor, oldCursor);
-      tr.changes.iterChangedRanges((fromA, toA, fromB, toB) => {
-        from = Math.min(from, fromB);
-        to = Math.max(to, toB);
-      });
-      from = tr.state.doc.lineAt(from).from;
-      to = tr.state.doc.lineAt(to).to;
-      return value.map(tr.changes).update({
-        filterFrom: from,
-        filterTo: to,
-        filter: () => false,
-        add: buildDecorations(from, to, tr.state)
-      });
-    },
-    provide: (field) => import_view19.EditorView.decorations.from(field)
-  });
+  return [
+    import_state18.StateField.define({
+      create: (state) => {
+        return import_view21.Decoration.set(buildDecorations(0, state.doc.length, state));
+      },
+      update: (value, tr) => {
+        if (!tr.docChanged && !tr.selection) {
+          return value;
+        }
+        const cursor = tr.state.selection.main.head;
+        const oldCursor = tr.changes.mapPos(tr.startState.selection.main.head);
+        let from = Math.min(cursor, oldCursor);
+        let to = Math.max(cursor, oldCursor);
+        tr.changes.iterChangedRanges((fromA, toA, fromB, toB) => {
+          from = Math.min(from, fromB);
+          to = Math.max(to, toB);
+        });
+        from = tr.state.doc.lineAt(from).from;
+        to = tr.state.doc.lineAt(to).to;
+        return value.map(tr.changes).update({
+          filterFrom: from,
+          filterTo: to,
+          filter: () => false,
+          add: buildDecorations(from, to, tr.state)
+        });
+      },
+      provide: (field) => import_view21.EditorView.decorations.from(field)
+    })
+  ];
 };
 var preloaded = /* @__PURE__ */ new Set();
 var preloadImage = (url) => {
@@ -3996,18 +4164,21 @@ var preloadImage = (url) => {
     preloaded.add(url);
   }
 };
-var buildDecorations = (from, to, state2) => {
+var buildDecorations = (from, to, state) => {
   const decorations = [];
-  const cursor = state2.selection.main.head;
-  (0, import_language10.syntaxTree)(state2).iterate({
+  const cursor = state.selection.main.head;
+  (0, import_language10.syntaxTree)(state).iterate({
     enter: (node) => {
       if (node.name === "Image") {
         const urlNode = node.node.getChild("URL");
         if (urlNode) {
-          const hide2 = state2.readOnly || cursor < node.from || cursor > node.to;
-          const url = state2.sliceDoc(urlNode.from, urlNode.to);
+          const hide2 = state.readOnly || cursor < node.from || cursor > node.to || !state.field(focusField);
+          const url = state.sliceDoc(urlNode.from, urlNode.to);
+          if (url.match(/^https?:\/\//) === null && url.match(/^file?:\/\//) === null) {
+            return;
+          }
           preloadImage(url);
-          decorations.push(import_view19.Decoration.replace({
+          decorations.push(import_view21.Decoration.replace({
             block: true,
             widget: new ImageWidget(url)
           }).range(hide2 ? node.from : node.to, node.to));
@@ -4019,7 +4190,7 @@ var buildDecorations = (from, to, state2) => {
   });
   return decorations;
 };
-var ImageWidget = class extends import_view19.WidgetType {
+var ImageWidget = class extends import_view21.WidgetType {
   constructor(_url) {
     super();
     this._url = _url;
@@ -4031,15 +4202,17 @@ var ImageWidget = class extends import_view19.WidgetType {
     const img = document.createElement("img");
     img.setAttribute("src", this._url);
     img.setAttribute("class", "cm-image");
-    img.onload = () => img.classList.add("cm-loaded-image");
+    if (view.state.field(focusField)) {
+      img.onload = () => img.classList.add("cm-loaded-image");
+    } else {
+      img.classList.add("cm-loaded-image");
+    }
     return img;
   }
 };
-var imageUpload = (options = {}) => {
-};
 var bulletListIndentationWidth = 24;
 var orderedListIndentationWidth = 36;
-var formattingStyles = import_view20.EditorView.theme({
+var formattingStyles = import_view22.EditorView.theme({
   /**
   * Horizontal rule.
   */
@@ -4136,22 +4309,22 @@ var formattingStyles = import_view20.EditorView.theme({
   }
 });
 var table = (options = {}) => {
-  return import_state16.StateField.define({
-    create: (state2) => update(state2, options),
+  return import_state19.StateField.define({
+    create: (state) => update(state, options),
     update: (_, tr) => update(tr.state, options),
-    provide: (field) => import_view21.EditorView.decorations.from(field)
+    provide: (field) => import_view23.EditorView.decorations.from(field)
   });
 };
-var update = (state2, _options) => {
-  const builder = new import_state16.RangeSetBuilder();
-  const cursor = state2.selection.main.head;
+var update = (state, _options) => {
+  const builder = new import_state19.RangeSetBuilder();
+  const cursor = state.selection.main.head;
   const tables = [];
   const getTable = () => tables[tables.length - 1];
   const getRow = () => {
     const table2 = getTable();
     return table2.rows?.[table2.rows.length - 1];
   };
-  (0, import_language11.syntaxTree)(state2).iterate({
+  (0, import_language11.syntaxTree)(state).iterate({
     enter: (node) => {
       switch (node.name) {
         case "Table": {
@@ -4172,9 +4345,9 @@ var update = (state2, _options) => {
         case "TableCell": {
           const row = getRow();
           if (row) {
-            row.push(state2.sliceDoc(node.from, node.to));
+            row.push(state.sliceDoc(node.from, node.to));
           } else {
-            getTable().header?.push(state2.sliceDoc(node.from, node.to));
+            getTable().header?.push(state.sliceDoc(node.from, node.to));
           }
           break;
         }
@@ -4182,21 +4355,21 @@ var update = (state2, _options) => {
     }
   });
   tables.forEach((table2) => {
-    const replace = state2.readOnly || cursor < table2.from || cursor > table2.to;
+    const replace = state.readOnly || cursor < table2.from || cursor > table2.to;
     if (replace) {
-      builder.add(table2.from, table2.to, import_view21.Decoration.replace({
+      builder.add(table2.from, table2.to, import_view23.Decoration.replace({
         block: true,
         widget: new TableWidget(table2)
       }));
     } else {
-      builder.add(table2.from, table2.to, import_view21.Decoration.mark({
+      builder.add(table2.from, table2.to, import_view23.Decoration.mark({
         class: "cm-table"
       }));
     }
   });
   return builder.finish();
 };
-var TableWidget = class extends import_view21.WidgetType {
+var TableWidget = class extends import_view23.WidgetType {
   constructor(_table) {
     super();
     this._table = _table;
@@ -4236,14 +4409,14 @@ var Unicode = {
   bulletSmall: "\u2219",
   bulletSquare: "\u2B1D"
 };
-var HorizontalRuleWidget = class extends import_view17.WidgetType {
+var HorizontalRuleWidget = class extends import_view19.WidgetType {
   toDOM() {
     const el = document.createElement("span");
     el.className = "cm-hr";
     return el;
   }
 };
-var LinkButton = class extends import_view17.WidgetType {
+var LinkButton = class extends import_view19.WidgetType {
   constructor(url, render) {
     super();
     this.url = url;
@@ -4259,7 +4432,7 @@ var LinkButton = class extends import_view17.WidgetType {
     return el;
   }
 };
-var CheckboxWidget = class extends import_view17.WidgetType {
+var CheckboxWidget = class extends import_view19.WidgetType {
   constructor(_checked) {
     super();
     this._checked = _checked;
@@ -4304,7 +4477,7 @@ var CheckboxWidget = class extends import_view17.WidgetType {
     return false;
   }
 };
-var TextWidget = class extends import_view17.WidgetType {
+var TextWidget = class extends import_view19.WidgetType {
   constructor(text, className) {
     super();
     this.text = text;
@@ -4319,34 +4492,34 @@ var TextWidget = class extends import_view17.WidgetType {
     return el;
   }
 };
-var hide = import_view17.Decoration.replace({});
-var blockQuote = import_view17.Decoration.line({
+var hide = import_view19.Decoration.replace({});
+var blockQuote = import_view19.Decoration.line({
   class: (0, import_react_ui_theme6.mx)("cm-blockquote")
 });
-var fencedCodeLine = import_view17.Decoration.line({
+var fencedCodeLine = import_view19.Decoration.line({
   class: (0, import_react_ui_theme6.mx)("cm-code cm-codeblock-line")
 });
-var fencedCodeLineFirst = import_view17.Decoration.line({
+var fencedCodeLineFirst = import_view19.Decoration.line({
   class: (0, import_react_ui_theme6.mx)("cm-code cm-codeblock-line", "cm-codeblock-first")
 });
-var fencedCodeLineLast = import_view17.Decoration.line({
+var fencedCodeLineLast = import_view19.Decoration.line({
   class: (0, import_react_ui_theme6.mx)("cm-code cm-codeblock-line", "cm-codeblock-last")
 });
 var commentBlockLine = fencedCodeLine;
 var commentBlockLineFirst = fencedCodeLineFirst;
 var commentBlockLineLast = fencedCodeLineLast;
-var horizontalRule = import_view17.Decoration.replace({
+var horizontalRule = import_view19.Decoration.replace({
   widget: new HorizontalRuleWidget()
 });
-var checkedTask = import_view17.Decoration.replace({
+var checkedTask = import_view19.Decoration.replace({
   widget: new CheckboxWidget(true)
 });
-var uncheckedTask = import_view17.Decoration.replace({
+var uncheckedTask = import_view19.Decoration.replace({
   widget: new CheckboxWidget(false)
 });
-var editingRange = (state2, range, focus) => {
-  const { readOnly, selection: { main: { head } } } = state2;
-  return focus && !readOnly && head >= range.from && head <= range.to;
+var editingRange = (state, range, focus2) => {
+  const { readOnly, selection: { main: { head } } } = state;
+  return focus2 && !readOnly && head >= range.from && head <= range.to;
 };
 var autoHideTags = /* @__PURE__ */ new Set([
   "CodeMark",
@@ -4356,13 +4529,13 @@ var autoHideTags = /* @__PURE__ */ new Set([
   "SubscriptMark",
   "SuperscriptMark"
 ]);
-var buildDecorations2 = (view, options, focus) => {
-  const deco = new import_state13.RangeSetBuilder();
-  const atomicDeco = new import_state13.RangeSetBuilder();
-  const { state: state2 } = view;
+var buildDecorations2 = (view, options, focus2) => {
+  const deco = new import_state16.RangeSetBuilder();
+  const atomicDeco = new import_state16.RangeSetBuilder();
+  const { state } = view;
   const headerLevels = [];
   const getHeaderLevels = (node, level) => {
-    (0, import_invariant3.invariant)(level > 0, void 0, {
+    (0, import_invariant4.invariant)(level > 0, void 0, {
       F: __dxlog_file9,
       L: 178,
       S: void 0,
@@ -4401,7 +4574,7 @@ var buildDecorations2 = (view, options, focus) => {
     listLevels.pop();
   };
   const getCurrentListLevel = () => {
-    (0, import_invariant3.invariant)(listLevels.length, void 0, {
+    (0, import_invariant4.invariant)(listLevels.length, void 0, {
       F: __dxlog_file9,
       L: 200,
       S: void 0,
@@ -4428,7 +4601,7 @@ var buildDecorations2 = (view, options, focus) => {
         if (options.numberedHeadings?.from !== void 0) {
           headers[level - 1].number++;
         }
-        const editing = editingRange(state2, node, focus);
+        const editing = editingRange(state, node, focus2);
         if (editing) {
           break;
         }
@@ -4442,7 +4615,7 @@ var buildDecorations2 = (view, options, focus) => {
           } else {
             const num = headers.slice(from - 1).map((level2) => level2?.number ?? 0).join(".") + " ";
             if (num.length) {
-              atomicDeco.add(mark.from, mark.from + len, import_view17.Decoration.replace({
+              atomicDeco.add(mark.from, mark.from + len, import_view19.Decoration.replace({
                 widget: new TextWidget(num, theme.heading(level))
               }));
             }
@@ -4460,14 +4633,14 @@ var buildDecorations2 = (view, options, focus) => {
         break;
       }
       case "ListItem": {
-        const line = state2.doc.lineAt(node.from);
+        const line = state.doc.lineAt(node.from);
         const list = getCurrentListLevel();
         const width = list.type === "OrderedList" ? orderedListIndentationWidth : bulletListIndentationWidth;
         const offset = ((list.level ?? 0) + 1) * width;
         if (node.from === line.to - 1) {
           return false;
         }
-        deco.add(line.from, line.from, import_view17.Decoration.line({
+        deco.add(line.from, line.from, import_view19.Decoration.line({
           class: "cm-list-item",
           attributes: {
             style: `padding-left: ${offset}px; text-indent: -${width}px;`
@@ -4482,17 +4655,17 @@ var buildDecorations2 = (view, options, focus) => {
           break;
         }
         const label = list.type === "OrderedList" ? `${++list.number}.` : Unicode.bulletSmall;
-        const line = state2.doc.lineAt(node.from);
-        const to = state2.doc.sliceString(node.to, node.to + 1) === " " ? node.to + 1 : node.to;
-        atomicDeco.add(line.from, to, import_view17.Decoration.replace({
+        const line = state.doc.lineAt(node.from);
+        const to = state.doc.sliceString(node.to, node.to + 1) === " " ? node.to + 1 : node.to;
+        atomicDeco.add(line.from, to, import_view19.Decoration.replace({
           widget: new TextWidget(label, list.type === "OrderedList" ? "cm-list-mark cm-list-mark-ordered" : "cm-list-mark cm-list-mark-bullet")
         }));
         break;
       }
       case "TaskMarker": {
-        const checked = state2.doc.sliceString(node.from + 1, node.to - 1) === "x";
-        const line = state2.doc.lineAt(node.from);
-        const to = state2.doc.sliceString(node.to, node.to + 1) === " " ? node.to + 1 : node.to;
+        const checked = state.doc.sliceString(node.from + 1, node.to - 1) === "x";
+        const line = state.doc.lineAt(node.from);
+        const to = state.doc.sliceString(node.to, node.to + 1) === " " ? node.to + 1 : node.to;
         atomicDeco.add(line.from, to, checked ? checkedTask : uncheckedTask);
         break;
       }
@@ -4500,7 +4673,7 @@ var buildDecorations2 = (view, options, focus) => {
       // Blockquote > QuoteMark > Paragraph
       //
       case "Blockquote": {
-        const editing = editingRange(state2, node, focus);
+        const editing = editingRange(state, node, focus2);
         const quoteMark = node.node.getChild("QuoteMark");
         const paragraph = node.node.getChild("Paragraph");
         if (!editing && quoteMark && paragraph) {
@@ -4521,7 +4694,7 @@ var buildDecorations2 = (view, options, focus) => {
       // CommentBlock
       //
       case "CommentBlock": {
-        const editing = editingRange(state2, node, focus);
+        const editing = editingRange(state, node, focus2);
         for (const block of view.viewportLineBlocks) {
           if (block.to < node.from) {
             continue;
@@ -4530,7 +4703,7 @@ var buildDecorations2 = (view, options, focus) => {
             break;
           }
           const isFirst = block.from <= node.from;
-          const isLast = block.to >= node.to && /^(\s>)*-->$/.test(state2.doc.sliceString(block.from, block.to));
+          const isLast = block.to >= node.to && /^(\s>)*-->$/.test(state.doc.sliceString(block.from, block.to));
           deco.add(block.from, block.from, isFirst ? commentBlockLineFirst : isLast ? commentBlockLineLast : commentBlockLine);
           if (!editing && (isFirst || isLast)) {
             atomicDeco.add(block.from, block.to, hide);
@@ -4550,9 +4723,9 @@ var buildDecorations2 = (view, options, focus) => {
             break;
           }
           const first = block.from <= node.from;
-          const last = block.to >= node.to && /^(\s>)*```$/.test(state2.doc.sliceString(block.from, block.to));
+          const last = block.to >= node.to && /^(\s>)*```$/.test(state.doc.sliceString(block.from, block.to));
           deco.add(block.from, block.from, first ? fencedCodeLineFirst : last ? fencedCodeLineLast : fencedCodeLine);
-          const editing = editingRange(state2, node, focus);
+          const editing = editingRange(state, node, focus2);
           if (!editing && (first || last)) {
             atomicDeco.add(block.from, block.to, hide);
           }
@@ -4565,13 +4738,13 @@ var buildDecorations2 = (view, options, focus) => {
       case "Link": {
         const marks = node.node.getChildren("LinkMark");
         const urlNode = node.node.getChild("URL");
-        const editing = editingRange(state2, node, focus);
+        const editing = editingRange(state, node, focus2);
         if (urlNode && marks.length >= 2) {
-          const url = state2.sliceDoc(urlNode.from, urlNode.to);
+          const url = state.sliceDoc(urlNode.from, urlNode.to);
           if (!editing) {
             atomicDeco.add(node.from, marks[0].to, hide);
           }
-          deco.add(marks[0].to, marks[1].from, import_view17.Decoration.mark({
+          deco.add(marks[0].to, marks[1].from, import_view19.Decoration.mark({
             tagName: "a",
             attributes: {
               class: "cm-link",
@@ -4581,7 +4754,7 @@ var buildDecorations2 = (view, options, focus) => {
             }
           }));
           if (!editing) {
-            atomicDeco.add(marks[1].from, node.to, options.renderLinkButton ? import_view17.Decoration.replace({
+            atomicDeco.add(marks[1].from, node.to, options.renderLinkButton ? import_view19.Decoration.replace({
               widget: new LinkButton(url, options.renderLinkButton)
             }) : hide);
           }
@@ -4592,14 +4765,14 @@ var buildDecorations2 = (view, options, focus) => {
       // HR
       //
       case "HorizontalRule": {
-        if (!editingRange(state2, node, focus)) {
+        if (!editingRange(state, node, focus2)) {
           deco.add(node.from, node.to, horizontalRule);
         }
         break;
       }
       default: {
         if (autoHideTags.has(node.name)) {
-          if (!editingRange(state2, node.node.parent, focus)) {
+          if (!editingRange(state, node.node.parent, focus2)) {
             atomicDeco.add(node.from, node.to, hide);
           }
         }
@@ -4615,7 +4788,7 @@ var buildDecorations2 = (view, options, focus) => {
       }
     }
   };
-  const tree = (0, import_language8.syntaxTree)(state2);
+  const tree = (0, import_language8.syntaxTree)(state);
   if (options.numberedHeadings?.from === void 0) {
     for (const { from, to } of view.visibleRanges) {
       tree.iterate({
@@ -4636,10 +4809,10 @@ var buildDecorations2 = (view, options, focus) => {
     atomicDeco: atomicDeco.finish()
   };
 };
-var forceUpdate = import_state13.StateEffect.define();
+var forceUpdate = import_state16.StateEffect.define();
 var decorateMarkdown = (options = {}) => {
   return [
-    import_view17.ViewPlugin.fromClass(class {
+    import_view19.ViewPlugin.fromClass(class {
       constructor(view) {
         ({ deco: this.deco, atomicDeco: this.atomicDeco } = buildDecorations2(view, options, view.hasFocus));
       }
@@ -4671,9 +4844,9 @@ var decorateMarkdown = (options = {}) => {
       }
     }, {
       provide: (plugin) => [
-        import_view17.EditorView.atomicRanges.of((view) => view.plugin(plugin)?.atomicDeco ?? import_view17.Decoration.none),
-        import_view17.EditorView.decorations.of((view) => view.plugin(plugin)?.atomicDeco ?? import_view17.Decoration.none),
-        import_view17.EditorView.decorations.of((view) => view.plugin(plugin)?.deco ?? import_view17.Decoration.none)
+        import_view19.EditorView.atomicRanges.of((view) => view.plugin(plugin)?.atomicDeco ?? import_view19.Decoration.none),
+        import_view19.EditorView.decorations.of((view) => view.plugin(plugin)?.atomicDeco ?? import_view19.Decoration.none),
+        import_view19.EditorView.decorations.of((view) => view.plugin(plugin)?.deco ?? import_view19.Decoration.none)
       ]
     }),
     image(),
@@ -4683,7 +4856,7 @@ var decorateMarkdown = (options = {}) => {
   ];
 };
 var linkTooltip = (render) => {
-  return (0, import_view22.hoverTooltip)((view, pos, side) => {
+  return (0, import_view24.hoverTooltip)((view, pos, side) => {
     const syntax = (0, import_language12.syntaxTree)(view.state).resolveInner(pos, side);
     let link = null;
     for (let i = 0, node = syntax; !link && node && i < 5; node = node.parent, i++) {
@@ -4725,7 +4898,7 @@ var mention = ({ onSearch }) => {
     icons: false,
     override: [
       (context) => {
-        import_log7.log.info("completion context", {
+        import_log6.log.info("completion context", {
           context
         }, {
           F: __dxlog_file10,
@@ -4758,7 +4931,7 @@ var EditorInputModes = [
   "vim",
   "vscode"
 ];
-var editorInputMode = (0, import_chunk_GZWIENFM.singleValueFacet)({});
+var editorInputMode = singleValueFacet({});
 var InputModeExtensions = {
   default: [],
   vscode: [
@@ -4766,7 +4939,7 @@ var InputModeExtensions = {
     editorInputMode.of({
       type: "vscode"
     }),
-    import_view23.keymap.of(import_codemirror_vscode_keymap.vscodeKeymap)
+    import_view25.keymap.of(import_codemirror_vscode_keymap.vscodeKeymap)
   ],
   vim: [
     // https://github.com/replit/codemirror-vim
@@ -4775,7 +4948,7 @@ var InputModeExtensions = {
       type: "vim",
       noTabster: true
     }),
-    import_view23.keymap.of([
+    import_view25.keymap.of([
       {
         key: "Alt-Escape",
         run: (view) => {
@@ -4797,7 +4970,7 @@ var typewriter = ({ delay = 75, items = defaultItems } = {}) => {
   let t;
   let idx = 0;
   return [
-    import_view24.keymap.of([
+    import_view26.keymap.of([
       {
         // Reset.
         key: "alt-meta-'",
@@ -4853,10 +5026,10 @@ var ToolbarSeparator = () => /* @__PURE__ */ import_react2.default.createElement
   className: "grow"
 });
 var [ToolbarContextProvider, useToolbarContext] = (0, import_react_context.createContext)("Toolbar");
-var ToolbarRoot = ({ children, onAction, classNames, state: state2 }) => {
+var ToolbarRoot = ({ children, onAction, classNames, state }) => {
   return /* @__PURE__ */ import_react2.default.createElement(ToolbarContextProvider, {
     onAction,
-    state: state2
+    state
   }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.ElevationProvider, {
     elevation: "chrome"
   }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Toolbar.Root, {
@@ -4906,8 +5079,8 @@ var HeadingIcons = {
 };
 var MarkdownHeading = () => {
   const { t } = (0, import_react_ui.useTranslation)(translationKey);
-  const { onAction, state: state2 } = useToolbarContext("MarkdownFormatting");
-  const blockType = state2 ? state2.blockType : "paragraph";
+  const { onAction, state } = useToolbarContext("MarkdownFormatting");
+  const blockType = state ? state.blockType : "paragraph";
   const header = blockType && /heading(\d)/.exec(blockType);
   const value = header ? header[1] : blockType === "paragraph" || !blockType ? "0" : void 0;
   const HeadingIcon = HeadingIcons[value ?? "0"];
@@ -4971,43 +5144,43 @@ var markdownStyles = [
   {
     type: "strong",
     Icon: import_react.TextB,
-    getState: (state2) => !!state2?.strong
+    getState: (state) => !!state?.strong
   },
   {
     type: "emphasis",
     Icon: import_react.TextItalic,
-    getState: (state2) => !!state2?.emphasis
+    getState: (state) => !!state?.emphasis
   },
   {
     type: "strikethrough",
     Icon: import_react.TextStrikethrough,
-    getState: (state2) => !!state2?.strikethrough
+    getState: (state) => !!state?.strikethrough
   },
   {
     type: "code",
     Icon: import_react.Code,
-    getState: (state2) => !!state2?.code
+    getState: (state) => !!state?.code
   },
   {
     type: "link",
     Icon: import_react.Link,
-    getState: (state2) => !!state2?.link
+    getState: (state) => !!state?.link
   }
 ];
 var MarkdownStyles = () => {
-  const { onAction, state: state2 } = useToolbarContext("MarkdownStyles");
+  const { onAction, state } = useToolbarContext("MarkdownStyles");
   const { t } = (0, import_react_ui.useTranslation)(translationKey);
   return /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Toolbar.ToggleGroup, {
     type: "multiple",
-    value: markdownStyles.filter(({ getState }) => state2 && getState(state2)).map(({ type }) => type)
+    value: markdownStyles.filter(({ getState }) => state && getState(state)).map(({ type }) => type)
   }, markdownStyles.map(({ type, getState, Icon: Icon2 }) => /* @__PURE__ */ import_react2.default.createElement(ToolbarToggleButton, {
     key: type,
     value: type,
     Icon: Icon2,
-    disabled: state2?.blockType === "codeblock",
-    onClick: state2 ? () => onAction?.({
+    disabled: state?.blockType === "codeblock",
+    onClick: state ? () => onAction?.({
       type,
-      data: !getState(state2)
+      data: !getState(state)
     }) : void 0
   }, t(`${type} label`))));
 };
@@ -5015,32 +5188,32 @@ var markdownLists = [
   {
     type: "list-bullet",
     Icon: import_react.ListBullets,
-    getState: (state2) => state2.listStyle === "bullet"
+    getState: (state) => state.listStyle === "bullet"
   },
   {
     type: "list-ordered",
     Icon: import_react.ListNumbers,
-    getState: (state2) => state2.listStyle === "ordered"
+    getState: (state) => state.listStyle === "ordered"
   },
   {
     type: "list-task",
     Icon: import_react.ListChecks,
-    getState: (state2) => state2.listStyle === "task"
+    getState: (state) => state.listStyle === "task"
   }
 ];
 var MarkdownLists = () => {
-  const { onAction, state: state2 } = useToolbarContext("MarkdownStyles");
+  const { onAction, state } = useToolbarContext("MarkdownStyles");
   const { t } = (0, import_react_ui.useTranslation)(translationKey);
   return /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Toolbar.ToggleGroup, {
     type: "single",
-    value: state2?.listStyle ? `list-${state2.listStyle}` : ""
+    value: state?.listStyle ? `list-${state.listStyle}` : ""
   }, markdownLists.map(({ type, getState, Icon: Icon2 }) => /* @__PURE__ */ import_react2.default.createElement(ToolbarToggleButton, {
     key: type,
     value: type,
     Icon: Icon2,
-    onClick: state2 ? () => onAction?.({
+    onClick: state ? () => onAction?.({
       type,
-      data: !getState(state2)
+      data: !getState(state)
     }) : void 0
   }, t(`${type} label`))));
 };
@@ -5048,24 +5221,24 @@ var markdownBlocks = [
   {
     type: "blockquote",
     Icon: import_react.Quotes,
-    getState: (state2) => !!state2?.blockQuote
+    getState: (state) => !!state?.blockQuote
   },
   {
     type: "codeblock",
     Icon: import_react.CodeBlock,
-    getState: (state2) => state2.blockType === "codeblock"
+    getState: (state) => state.blockType === "codeblock"
   },
   {
     type: "table",
     Icon: import_react.Table,
-    getState: (state2) => state2.blockType === "tablecell",
-    disabled: (state2) => !state2.blankLine
+    getState: (state) => state.blockType === "tablecell",
+    disabled: (state) => !state.blankLine
   }
 ];
 var MarkdownBlocks = () => {
-  const { onAction, state: state2 } = useToolbarContext("MarkdownStyles");
+  const { onAction, state } = useToolbarContext("MarkdownStyles");
   const { t } = (0, import_react_ui.useTranslation)(translationKey);
-  const value = markdownBlocks.find(({ getState }) => state2 && getState(state2));
+  const value = markdownBlocks.find(({ getState }) => state && getState(state));
   return /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Toolbar.ToggleGroup, {
     type: "single",
     value: value?.type ?? ""
@@ -5073,10 +5246,10 @@ var MarkdownBlocks = () => {
     key: type,
     value: type,
     Icon: Icon2,
-    disabled: !state2 || disabled?.(state2),
-    onClick: state2 ? () => onAction?.({
+    disabled: !state || disabled?.(state),
+    onClick: state ? () => onAction?.({
       type,
-      data: !getState(state2)
+      data: !getState(state)
     }) : void 0
   }, t(`${type} label`))));
 };
@@ -5189,12 +5362,12 @@ var MarkdownView = ({ mode }) => {
   })), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Arrow, null)))), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Tooltip.Portal, null, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Tooltip.Content, tooltipProps, t("view mode label"), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Tooltip.Arrow, null))));
 };
 var MarkdownActions = () => {
-  const { onAction, state: state2 } = useToolbarContext("MarkdownActions");
+  const { onAction, state } = useToolbarContext("MarkdownActions");
   const { t } = (0, import_react_ui.useTranslation)(translationKey);
   let commentToolTipKey = "comment label";
-  if (state2?.comment) {
+  if (state?.comment) {
     commentToolTipKey = "selection overlaps existing comment label";
-  } else if (state2?.selection === false) {
+  } else if (state?.selection === false) {
     commentToolTipKey = "select text to comment label";
   }
   return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(ToolbarButton, {
@@ -5210,7 +5383,7 @@ var MarkdownActions = () => {
     onClick: () => onAction?.({
       type: "comment"
     }),
-    disabled: !state2 || state2.comment || !state2.selection
+    disabled: !state || state.comment || !state.selection
   }, t(commentToolTipKey)));
 };
 var Toolbar = {
@@ -5226,14 +5399,14 @@ var margin = "!mt-[1rem]";
 var editorContent = (0, import_react_ui_theme8.mx)(margin, "!mli-auto w-full max-w-[min(50rem,100%-2rem)]");
 var editorFullWidth = (0, import_react_ui_theme8.mx)(margin);
 var editorWithToolbarLayout = "grid grid-cols-1 grid-rows-[min-content_1fr] data-[toolbar=disabled]:grid-rows-[1fr] justify-center content-start overflow-hidden";
-var editorGutter = import_view25.EditorView.theme({
+var editorGutter = import_view27.EditorView.theme({
   // Match margin from content.
   ".cm-gutters": {
     marginTop: "16px",
     paddingRight: "1rem"
   }
 });
-var editorMonospace = import_view25.EditorView.theme({
+var editorMonospace = import_view27.EditorView.theme({
   ".cm-content": {
     fontFamily: fontMono
   }
@@ -5244,20 +5417,20 @@ var useActionHandler = (view) => {
 var __dxlog_file11 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextEditor.ts";
 var instanceCount = 0;
 var useTextEditor = (props = {}, deps = []) => {
-  const { id, initialValue, extensions, autoFocus, scrollTo, selection, moveToEndOfLine, debug } = (0, import_react7.useMemo)(() => (0, import_util4.getProviderValue)(props), deps ?? []);
+  const { id, initialValue, extensions, autoFocus, scrollTo, selection, moveToEndOfLine, debug } = (0, import_react7.useMemo)(() => (0, import_util5.getProviderValue)(props), deps ?? []);
   const [instanceId] = (0, import_react7.useState)(() => `text-editor-${++instanceCount}`);
   const [view, setView] = (0, import_react7.useState)();
   const parentRef = (0, import_react7.useRef)(null);
   (0, import_react7.useEffect)(() => {
     let view2;
     if (parentRef.current) {
-      (0, import_log8.log)("create", {
+      (0, import_log7.log)("create", {
         id,
         instanceId,
         doc: initialValue?.length ?? 0
       }, {
         F: __dxlog_file11,
-        L: 76,
+        L: 75,
         S: void 0,
         C: (f, a) => f(...a)
       });
@@ -5273,27 +5446,27 @@ var useTextEditor = (props = {}, deps = []) => {
           anchor
         };
       }
-      const state2 = import_state17.EditorState.create({
+      const state = import_state20.EditorState.create({
         doc: initialValue,
         // selection: initialSelection,
         extensions: [
-          id && import_chunk_GZWIENFM.documentId.of(id),
+          id && documentId.of(id),
           extensions,
           // NOTE: This doesn't catch errors in keymap functions.
-          import_view26.EditorView.exceptionSink.of((err) => {
-            import_log8.log.catch(err, void 0, {
+          import_view28.EditorView.exceptionSink.of((err) => {
+            import_log7.log.catch(err, void 0, {
               F: __dxlog_file11,
-              L: 98,
+              L: 97,
               S: void 0,
               C: (f, a) => f(...a)
             });
           })
-        ].filter(import_util4.isNotFalsy)
+        ].filter(import_util5.isNotFalsy)
       });
-      view2 = new import_view26.EditorView({
+      view2 = new import_view28.EditorView({
         parent: parentRef.current,
-        state: state2,
-        scrollTo: scrollTo ? import_view26.EditorView.scrollIntoView(scrollTo, {
+        state,
+        scrollTo: scrollTo ? import_view28.EditorView.scrollIntoView(scrollTo, {
           yMargin: 96
         }) : void 0,
         dispatchTransactions: debug ? debugDispatcher : void 0
@@ -5311,11 +5484,11 @@ var useTextEditor = (props = {}, deps = []) => {
       setView(view2);
     }
     return () => {
-      (0, import_log8.log)("destroy", {
+      (0, import_log7.log)("destroy", {
         id
       }, {
         F: __dxlog_file11,
-        L: 135,
+        L: 134,
         S: void 0,
         C: (f, a) => f(...a)
       });
@@ -5329,19 +5502,19 @@ var useTextEditor = (props = {}, deps = []) => {
       }
       if (scrollTo || selection) {
         if (selection && selection.anchor > view.state.doc.length) {
-          import_log8.log.warn("invalid selection", {
+          import_log7.log.warn("invalid selection", {
             length: view.state.doc.length,
             scrollTo,
             selection
           }, {
             F: __dxlog_file11,
-            L: 149,
+            L: 148,
             S: void 0,
             C: (f, a) => f(...a)
           });
           return;
         }
-        view.dispatch((0, import_chunk_GZWIENFM.createEditorStateTransaction)(view.state, {
+        view.dispatch(createEditorStateTransaction({
           scrollTo,
           selection
         }));
@@ -5411,6 +5584,7 @@ var useTextEditor = (props = {}, deps = []) => {
   awarenessProvider,
   blast,
   callbackWrapper,
+  clientRectsFor,
   command,
   comments,
   commentsState,
@@ -5418,7 +5592,9 @@ var useTextEditor = (props = {}, deps = []) => {
   createBasicExtensions,
   createComment,
   createDataExtensions,
+  createEditorStateStore,
   createEditorStateTransaction,
+  createElement,
   createExternalCommentSync,
   createMarkdownExtensions,
   createThemeExtensions,
@@ -5435,23 +5611,25 @@ var useTextEditor = (props = {}, deps = []) => {
   editorInputMode,
   editorMonospace,
   editorWithToolbarLayout,
+  flattenRect,
+  focus,
   focusEvent,
+  focusField,
   folding,
   formattingEquals,
   formattingKeymap,
   getFormatting,
   image,
-  imageUpload,
   insertTable,
   keymap,
   linkTooltip,
   listener,
-  localStorageStateStoreAdapter,
   logChanges,
   markdownHighlightStyle,
   markdownTags,
   markdownTagsExtensions,
   mention,
+  overlap,
   preventNewline,
   processAction,
   removeBlockquote,
@@ -5459,17 +5637,19 @@ var useTextEditor = (props = {}, deps = []) => {
   removeLink,
   removeList,
   removeStyle,
+  renderRoot,
   scrollThreadIntoView,
   selectionOverlapsComment,
+  selectionState,
   setBlockquote,
   setComments,
   setHeading,
   setSelection,
   setStyle,
   singleValueFacet,
-  state,
   table,
   tags,
+  textRange,
   toggleBlockquote,
   toggleCodeblock,
   toggleEmphasis,
@@ -5486,6 +5666,7 @@ var useTextEditor = (props = {}, deps = []) => {
   useComments,
   useFormattingState,
   useTextEditor,
-  useToolbarContext
+  useToolbarContext,
+  wrapWithCatch
 });
 //# sourceMappingURL=index.cjs.map