@dxos/react-ui-editor 0.6.12-staging.e11e696 → 0.6.13-main.041e8aa

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_5RSKGJRI.Cursor,
+  Cursor: () => import_chunk_GZWIENFM.Cursor,
   EditorInputModes: () => EditorInputModes,
   EditorViewModes: () => EditorViewModes,
   Inline: () => Inline,
@@ -57,15 +57,16 @@ __export(node_exports, {
   createBasicExtensions: () => createBasicExtensions,
   createComment: () => createComment,
   createDataExtensions: () => createDataExtensions,
-  createEditorStateTransaction: () => import_chunk_5RSKGJRI.createEditorStateTransaction,
+  createEditorStateTransaction: () => import_chunk_GZWIENFM.createEditorStateTransaction,
   createExternalCommentSync: () => createExternalCommentSync,
   createMarkdownExtensions: () => createMarkdownExtensions,
   createThemeExtensions: () => createThemeExtensions,
+  debugDispatcher: () => debugDispatcher,
   debugNodeLogger: () => debugNodeLogger,
   debugTree: () => debugTree,
   decorateMarkdown: () => decorateMarkdown,
   defaultOptions: () => defaultOptions,
-  documentId: () => import_chunk_5RSKGJRI.documentId,
+  documentId: () => import_chunk_GZWIENFM.documentId,
   dropFile: () => dropFile,
   editorContent: () => editorContent,
   editorFullWidth: () => editorFullWidth,
@@ -84,7 +85,7 @@ __export(node_exports, {
   keymap: () => import_view.keymap,
   linkTooltip: () => linkTooltip,
   listener: () => listener,
-  localStorageStateStoreAdapter: () => import_chunk_5RSKGJRI.localStorageStateStoreAdapter,
+  localStorageStateStoreAdapter: () => import_chunk_GZWIENFM.localStorageStateStoreAdapter,
   logChanges: () => logChanges,
   markdownHighlightStyle: () => markdownHighlightStyle,
   markdownTags: () => markdownTags,
@@ -104,8 +105,8 @@ __export(node_exports, {
   setHeading: () => setHeading,
   setSelection: () => setSelection,
   setStyle: () => setStyle,
-  singleValueFacet: () => import_chunk_5RSKGJRI.singleValueFacet,
-  state: () => import_chunk_5RSKGJRI.state,
+  singleValueFacet: () => import_chunk_GZWIENFM.singleValueFacet,
+  state: () => import_chunk_GZWIENFM.state,
   table: () => table,
   tags: () => import_highlight.tags,
   toggleBlockquote: () => toggleBlockquote,
@@ -127,7 +128,7 @@ __export(node_exports, {
   useToolbarContext: () => useToolbarContext
 });
 module.exports = __toCommonJS(node_exports);
-var import_chunk_5RSKGJRI = require("./chunk-5RSKGJRI.cjs");
+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");
@@ -168,19 +169,19 @@ var import_state6 = require("@codemirror/state");
 var import_view8 = require("@codemirror/view");
 var import_state7 = 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_view10 = require("@codemirror/view");
 var import_lodash2 = __toESM(require("lodash.sortby"));
-var import_react3 = require("react");
+var import_react4 = require("react");
 var import_async3 = require("@dxos/async");
-var import_log3 = require("@dxos/log");
-var import_util2 = require("@dxos/util");
 var import_log4 = require("@dxos/log");
-var import_react4 = __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_util2 = require("@dxos/util");
 var import_log5 = require("@dxos/log");
 var import_language = require("@codemirror/language");
 var import_state9 = require("@codemirror/state");
@@ -302,7 +303,7 @@ var annotations = (options = {}) => {
       for (const match2 of matches) {
         const from = match2.index;
         const to = from + match2[0].length;
-        const cursor = import_chunk_5RSKGJRI.Cursor.getCursorFromRange(state2, {
+        const cursor = import_chunk_GZWIENFM.Cursor.getCursorFromRange(state2, {
           from,
           to
         });
@@ -331,7 +332,7 @@ var annotations = (options = {}) => {
     ], (state2) => {
       const annotations2 = state2.field(annotationsState);
       const decorations = annotations2.map((annotation) => {
-        const range = import_chunk_5RSKGJRI.Cursor.getRangeFromCursor(state2, annotation.cursor);
+        const range = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(state2, annotation.cursor);
         return range && annotationMark.range(range.from, range.to);
       }).filter(import_util.isNotFalsy);
       return import_view2.Decoration.set(decorations);
@@ -627,7 +628,7 @@ var automerge = (accessor) => {
   });
   const syncer = new Syncer(accessor.handle, syncState);
   return [
-    import_chunk_5RSKGJRI.Cursor.converter.of(cursorConverter(accessor)),
+    import_chunk_GZWIENFM.Cursor.converter.of(cursorConverter(accessor)),
     // Track heads.
     syncState,
     // Reconcile external updates.
@@ -662,7 +663,7 @@ var dummyProvider = {
   update: () => {
   }
 };
-var awarenessProvider = (0, import_chunk_5RSKGJRI.singleValueFacet)(dummyProvider);
+var awarenessProvider = (0, import_chunk_GZWIENFM.singleValueFacet)(dummyProvider);
 var RemoteSelectionChangedAnnotation = import_state5.Annotation.define();
 var awareness = (provider = dummyProvider) => {
   return [
@@ -680,7 +681,7 @@ var RemoteSelectionsDecorator = class {
       L: 80
     });
     this.decorations = import_state5.RangeSet.of([]);
-    this._cursorConverter = view.state.facet(import_chunk_5RSKGJRI.Cursor.converter);
+    this._cursorConverter = view.state.facet(import_chunk_GZWIENFM.Cursor.converter);
     this._provider = view.state.facet(awarenessProvider);
     this._provider.open();
     this._provider.remoteStateChange.on(this._ctx, () => {
@@ -1285,7 +1286,7 @@ var random = (min, max) => {
   }
   return min + ~~(Math.random() * (max - min + 1));
 };
-var commandConfig = (0, import_chunk_5RSKGJRI.singleValueFacet)();
+var commandConfig = (0, import_chunk_GZWIENFM.singleValueFacet)();
 var commandState = import_state7.StateField.define({
   create: () => ({}),
   update: (state2, tr) => {
@@ -1407,6 +1408,40 @@ var clientRectsFor = (dom) => {
     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();
@@ -1483,40 +1518,6 @@ var command = (options) => {
     })
   ];
 };
-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_log4.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_react4.default.createElement(import_react_ui2.ThemeProvider, {
-    tx: import_react_ui_theme2.defaultTx
-  }, node));
-  return root;
-};
 var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/util.ts";
 var callbackWrapper = (fn) => (...args) => {
   try {
@@ -1524,12 +1525,16 @@ var callbackWrapper = (fn) => (...args) => {
   } catch (err) {
     import_log5.log.catch(err, void 0, {
       F: __dxlog_file6,
-      L: 18,
+      L: 19,
       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) {
@@ -1550,7 +1555,7 @@ var logChanges = (trs) => {
       changes
     }, {
       F: __dxlog_file6,
-      L: 39,
+      L: 49,
       S: void 0,
       C: (f, a) => f(...a)
     });
@@ -1562,7 +1567,7 @@ 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_5RSKGJRI.documentId),
+    id: state2.facet(import_chunk_GZWIENFM.documentId),
     comments: [],
     selection: {}
   }),
@@ -1580,7 +1585,7 @@ var commentsState = import_state8.StateField.define({
           if (!comment.cursor) {
             return void 0;
           }
-          const range = import_chunk_5RSKGJRI.Cursor.getRangeFromCursor(tr.state, comment.cursor);
+          const range = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(tr.state, comment.cursor);
           return range && {
             comment,
             range
@@ -1625,7 +1630,7 @@ var commentsDecorations = import_view10.EditorView.decorations.compute([
   const decorations = (0, import_lodash2.default)(comments2 ?? [], (range) => range.range.from)?.flatMap((comment) => {
     const range = comment.range;
     if (!range) {
-      import_log3.log.warn("Invalid range:", range, {
+      import_log4.log.warn("Invalid range:", range, {
         F: __dxlog_file7,
         L: 143,
         S: void 0,
@@ -1743,7 +1748,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_5RSKGJRI.Cursor.getCursorFromRange(update2.state, comment);
+          const cursor = import_chunk_GZWIENFM.Cursor.getCursorFromRange(update2.state, comment);
           onUpdate({
             id: comment.id,
             cursor
@@ -1775,7 +1780,7 @@ var createComment = (view) => {
       }
     });
   }
-  const cursor = import_chunk_5RSKGJRI.Cursor.getCursorFromRange(view.state, {
+  const cursor = import_chunk_GZWIENFM.Cursor.getCursorFromRange(view.state, {
     from,
     to
   });
@@ -1789,13 +1794,13 @@ var createComment = (view) => {
   }
   return false;
 };
-var optionsFacet = (0, import_chunk_5RSKGJRI.singleValueFacet)();
+var optionsFacet = (0, import_chunk_GZWIENFM.singleValueFacet)();
 var comments = (options = {}) => {
   const { key: shortcut = "meta-'" } = options;
   const handleSelect = (0, import_async3.debounce)((state2) => options.onSelect?.(state2), 200);
   return [
     optionsFacet.of(options),
-    options.id ? import_chunk_5RSKGJRI.documentId.of(options.id) : void 0,
+    options.id ? import_chunk_GZWIENFM.documentId.of(options.id) : void 0,
     commentsState,
     commentsDecorations,
     handleCommentClick,
@@ -1848,7 +1853,7 @@ var comments = (options = {}) => {
       changes.iterChanges((from, to, from2, to2) => {
         comments2.forEach(({ comment, range }) => {
           if (from2 === to2) {
-            const newRange = import_chunk_5RSKGJRI.Cursor.getRangeFromCursor(view.state, comment.cursor);
+            const newRange = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(view.state, comment.cursor);
             if (!newRange || newRange.to - newRange.from === 0) {
               options.onDelete?.({
                 id: comment.id
@@ -1856,7 +1861,7 @@ var comments = (options = {}) => {
             }
           }
           if (from <= range.to) {
-            const newRange = import_chunk_5RSKGJRI.Cursor.getRangeFromCursor(view.state, comment.cursor);
+            const newRange = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(view.state, comment.cursor);
             Object.assign(range, newRange);
             mod = true;
           }
@@ -1898,7 +1903,7 @@ var comments = (options = {}) => {
         });
         handleSelect({
           selection,
-          id: state2.facet(import_chunk_5RSKGJRI.documentId),
+          id: state2.facet(import_chunk_GZWIENFM.documentId),
           comments: comments2.map(({ comment, range }) => ({
             comment,
             range,
@@ -1915,7 +1920,7 @@ var scrollThreadIntoView = (view, id, center = true) => {
   if (!comment?.comment.cursor) {
     return;
   }
-  const range = import_chunk_5RSKGJRI.Cursor.getRangeFromCursor(view.state, comment.comment.cursor);
+  const range = import_chunk_GZWIENFM.Cursor.getRangeFromCursor(view.state, comment.comment.cursor);
   if (range) {
     const currentSelection = view.state.selection.main;
     const currentScrollPosition = view.scrollDOM.scrollTop;
@@ -1940,8 +1945,11 @@ var scrollThreadIntoView = (view, id, center = true) => {
   }
 };
 var selectionOverlapsComment = (state2) => {
+  const commentState = state2.field(commentsState, false);
+  if (commentState === void 0) {
+    return false;
+  }
   const { selection } = state2;
-  const commentState = state2.field(commentsState);
   for (const range of selection.ranges) {
     if (commentState.comments.some(({ range: commentRange }) => overlap(commentRange, range))) {
       return true;
@@ -1959,7 +1967,7 @@ var ExternalCommentSync = class {
     };
     const updateComments = () => {
       const comments2 = getComments();
-      if (id === view.state.facet(import_chunk_5RSKGJRI.documentId)) {
+      if (id === view.state.facet(import_chunk_GZWIENFM.documentId)) {
         queueMicrotask(() => view.dispatch({
           effects: setComments.of({
             id,
@@ -1977,11 +1985,11 @@ var createExternalCommentSync = (id, subscribe, getComments) => import_view10.Vi
   }
 });
 var useCommentState = () => {
-  const [state2, setState] = (0, import_react3.useState)({
+  const [state2, setState] = (0, import_react4.useState)({
     comment: false,
     selection: false
   });
-  const observer = (0, import_react3.useMemo)(() => import_view10.EditorView.updateListener.of((update2) => {
+  const observer = (0, import_react4.useMemo)(() => import_view10.EditorView.updateListener.of((update2) => {
     if (update2.docChanged || update2.selectionSet) {
       setState({
         comment: selectionOverlapsComment(update2.state),
@@ -1995,9 +2003,9 @@ var useCommentState = () => {
   ];
 };
 var useComments = (view, id, comments2) => {
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (view) {
-      if (id === view.state.facet(import_chunk_5RSKGJRI.documentId)) {
+      if (id === view.state.facet(import_chunk_GZWIENFM.documentId)) {
         view.dispatch({
           effects: setComments.of({
             id,
@@ -2009,7 +2017,7 @@ var useComments = (view, id, comments2) => {
   });
 };
 var useCommentClickListener = (onCommentClick) => {
-  return (0, import_react3.useMemo)(() => import_view10.EditorView.updateListener.of((update2) => {
+  return (0, import_react4.useMemo)(() => import_view10.EditorView.updateListener.of((update2) => {
     update2.transactions.forEach((transaction) => {
       transaction.effects.forEach((effect) => {
         if (effect.is(commentClickedEffect)) {
@@ -4750,7 +4758,7 @@ var EditorInputModes = [
   "vim",
   "vscode"
 ];
-var editorInputMode = (0, import_chunk_5RSKGJRI.singleValueFacet)({});
+var editorInputMode = (0, import_chunk_GZWIENFM.singleValueFacet)({});
 var InputModeExtensions = {
   default: [],
   vscode: [
@@ -5240,7 +5248,6 @@ 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 [instanceId] = (0, import_react7.useState)(() => `text-editor-${++instanceCount}`);
-  const onUpdate = (0, import_react7.useRef)();
   const [view, setView] = (0, import_react7.useState)();
   const parentRef = (0, import_react7.useRef)(null);
   (0, import_react7.useEffect)(() => {
@@ -5252,7 +5259,7 @@ var useTextEditor = (props = {}, deps = []) => {
         doc: initialValue?.length ?? 0
       }, {
         F: __dxlog_file11,
-        L: 78,
+        L: 76,
         S: void 0,
         C: (f, a) => f(...a)
       });
@@ -5272,43 +5279,36 @@ var useTextEditor = (props = {}, deps = []) => {
         doc: initialValue,
         selection: initialSelection,
         extensions: [
-          id && import_chunk_5RSKGJRI.documentId.of(id),
-          // NOTE: Doesn't catch errors in keymap functions.
+          id && import_chunk_GZWIENFM.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, {
               F: __dxlog_file11,
-              L: 100,
+              L: 98,
               S: void 0,
               C: (f, a) => f(...a)
             });
-          }),
-          extensions,
-          import_view26.EditorView.updateListener.of(() => {
-            setTimeout(() => {
-              onUpdate.current?.();
-            });
           })
         ].filter(import_util4.isNotFalsy)
       });
       view2 = new import_view26.EditorView({
         parent: parentRef.current,
         state: state2,
-        // NOTE: Uncomment to debug/monitor all transactions.
-        // https://codemirror.net/docs/ref/#view.EditorView.dispatch
-        dispatchTransactions: (trs, view3) => {
-          if (debug) {
-            logChanges(trs);
-          }
-          view3.update(trs);
-        }
+        scrollTo: scrollTo ? import_view26.EditorView.scrollIntoView(scrollTo, {
+          yMargin: 96
+        }) : void 0,
+        dispatchTransactions: debug ? debugDispatcher : void 0
       });
-      if (!initialValue && moveToEndOfLine) {
+      if (moveToEndOfLine && !initialSelection) {
         const { to } = view2.state.doc.lineAt(0);
-        view2.dispatch({
-          selection: {
-            anchor: to
-          }
-        });
+        if (to) {
+          view2.dispatch({
+            selection: {
+              anchor: to
+            }
+          });
+        }
       }
       setView(view2);
     }
@@ -5326,21 +5326,20 @@ var useTextEditor = (props = {}, deps = []) => {
   }, deps);
   (0, import_react7.useEffect)(() => {
     if (view) {
-      onUpdate.current = () => {
-        onUpdate.current = void 0;
-        view.dispatch((0, import_chunk_5RSKGJRI.createEditorStateTransaction)({
+      if (view.state.facet(editorInputMode).noTabster) {
+        parentRef.current?.removeAttribute("data-tabster");
+      }
+      if (scrollTo || selection) {
+        view.dispatch((0, import_chunk_GZWIENFM.createEditorStateTransaction)(view.state, {
           scrollTo,
           selection
         }));
-      };
-      if (view.state.facet(editorInputMode).noTabster) {
-        parentRef.current?.removeAttribute("data-tabster");
       }
     }
   }, [
     view,
-    selection,
-    scrollTo
+    scrollTo,
+    selection
   ]);
   (0, import_react7.useEffect)(() => {
     if (view && autoFocus) {
@@ -5412,6 +5411,7 @@ var useTextEditor = (props = {}, deps = []) => {
   createExternalCommentSync,
   createMarkdownExtensions,
   createThemeExtensions,
+  debugDispatcher,
   debugNodeLogger,
   debugTree,
   decorateMarkdown,