@dxos/react-ui-editor 0.4.4-main.2a45fa8 → 0.4.4-main.3a00f69

package/dist/lib/browser/index.mjs

@@ -31,7 +31,9 @@ var defaultCursorConverter = {
 var Cursor = class _Cursor {
   static {
     this.converter = Facet.define({
-      combine: (providers) => providers[0] ?? defaultCursorConverter
+      combine: (providers) => {
+        return providers[0] ?? defaultCursorConverter;
+      }
     });
   }
   static {
@@ -130,7 +132,7 @@ var autocomplete = ({ onSearch }) => {
     // https://codemirror.net/examples/autocompletion
     // https://codemirror.net/docs/ref/#autocomplete.autocompletion
     autocompletion({
-      activateOnTyping: true,
+      activateOnTyping: false,
       // closeOnBlur: false,
       // defaultKeymap: false,
       // TODO(burdon): Styles/fragments.
@@ -172,7 +174,11 @@ var cursorConverter = (handle, path) => ({
     if (typeof value === "string" && value.length <= pos) {
       return "end";
     }
-    return A.getCursor(doc, path.slice(), pos);
+    try {
+      return A.getCursor(doc, path.slice(), pos);
+    } catch (err) {
+      return "";
+    }
   },
   fromCursor: (cursor) => {
     if (cursor === "") {
@@ -190,7 +196,11 @@ var cursorConverter = (handle, path) => ({
         return 0;
       }
     }
-    return A.getCursorPosition(doc, path.slice(), cursor);
+    try {
+      return A.getCursorPosition(doc, path.slice(), cursor);
+    } catch (err) {
+      return 0;
+    }
   }
 });
 
@@ -1132,68 +1142,15 @@ var logChanges = (trs) => {
 };
 
 // packages/ui/react-ui-editor/src/extensions/comments.ts
-var styles3 = EditorView6.baseTheme({
-  "&light .cm-comment, &light .cm-comment-current": {
-    mixBlendMode: "darken"
-  },
-  "&dark .cm-comment, &dark .cm-comment-current": {
-    mixBlendMode: "plus-lighter"
-  },
-  "&light .cm-comment": {
-    backgroundColor: getToken("extend.colors.yellow.50")
-  },
-  "&light .cm-comment-current": {
-    backgroundColor: getToken("extend.colors.yellow.100")
-  },
-  "&dark .cm-comment": {
-    color: getToken("extend.colors.yellow.50"),
-    backgroundColor: getToken("extend.colors.yellow.900")
-  },
-  "&dark .cm-comment-current": {
-    color: getToken("extend.colors.yellow.100"),
-    backgroundColor: getToken("extend.colors.yellow.950")
-  }
-});
-var commentMark = Decoration3.mark({
-  class: "cm-comment",
-  attributes: {
-    "data-testid": "cm-comment"
-  }
-});
-var commentCurrentMark = Decoration3.mark({
-  class: "cm-comment-current",
-  attributes: {
-    "data-testid": "cm-comment"
-  }
+var documentId = Facet3.define({
+  combine: (values) => values[0]
 });
-var focusComment = (view, id, center = true) => {
-  const comment = view.state.field(commentsState).comments.find((range2) => range2.comment.id === id);
-  if (!comment?.comment.cursor) {
-    return;
-  }
-  const range = Cursor.getRangeFromCursor(view.state, comment.comment.cursor);
-  if (range) {
-    view.dispatch({
-      selection: {
-        anchor: range.from
-      },
-      effects: [
-        //
-        EditorView6.scrollIntoView(range.from, center ? {
-          y: "center"
-        } : void 0),
-        setSelection.of({
-          current: id
-        })
-      ]
-    });
-  }
-};
 var setComments = StateEffect2.define();
 var setSelection = StateEffect2.define();
 var setCommentState = StateEffect2.define();
 var commentsState = StateField3.define({
-  create: () => ({
+  create: (state) => ({
+    id: state.facet(documentId),
     comments: [],
     selection: {}
   }),
@@ -1206,7 +1163,8 @@ var commentsState = StateField3.define({
         };
       }
       if (effect.is(setComments)) {
-        const comments2 = effect.value.map((comment) => {
+        const { comments: comments2 } = effect.value;
+        const commentStates = comments2.map((comment) => {
           if (!comment.cursor) {
             return void 0;
           }
@@ -1218,7 +1176,7 @@ var commentsState = StateField3.define({
         }).filter(nonNullable);
         return {
           ...value,
-          comments: comments2
+          comments: commentStates
         };
       }
       if (effect.is(setCommentState)) {
@@ -1228,6 +1186,40 @@ var commentsState = StateField3.define({
     return value;
   }
 });
+var styles3 = EditorView6.baseTheme({
+  "&light .cm-comment, &light .cm-comment-current": {
+    mixBlendMode: "darken"
+  },
+  "&dark .cm-comment, &dark .cm-comment-current": {
+    mixBlendMode: "plus-lighter"
+  },
+  "&light .cm-comment": {
+    backgroundColor: getToken("extend.colors.yellow.50")
+  },
+  "&light .cm-comment-current": {
+    backgroundColor: getToken("extend.colors.yellow.100")
+  },
+  "&dark .cm-comment": {
+    color: getToken("extend.colors.yellow.50"),
+    backgroundColor: getToken("extend.colors.yellow.900")
+  },
+  "&dark .cm-comment-current": {
+    color: getToken("extend.colors.yellow.100"),
+    backgroundColor: getToken("extend.colors.yellow.950")
+  }
+});
+var commentMark = Decoration3.mark({
+  class: "cm-comment",
+  attributes: {
+    "data-testid": "cm-comment"
+  }
+});
+var commentCurrentMark = Decoration3.mark({
+  class: "cm-comment-current",
+  attributes: {
+    "data-testid": "cm-comment"
+  }
+});
 var commentsDecorations = EditorView6.decorations.compute([
   commentsState
 ], (state) => {
@@ -1347,9 +1339,6 @@ var mapTrackedComment = (comment, changes) => ({
 var restoreCommentEffect = StateEffect2.define({
   map: mapTrackedComment
 });
-var optionsFacet = Facet3.define({
-  combine: (providers) => providers[0]
-});
 var createComment = (view) => {
   const options = view.state.facet(optionsFacet);
   const { from, to } = view.state.selection.main;
@@ -1388,11 +1377,15 @@ var createComment = (view) => {
   }
   return false;
 };
+var optionsFacet = Facet3.define({
+  combine: (providers) => providers[0]
+});
 var comments = (options = {}) => {
   const { key: shortcut = "meta-'" } = options;
   const handleSelect = debounce((state) => options.onSelect?.(state), 200);
   return [
     optionsFacet.of(options),
+    documentId.of(options.id),
     commentsState,
     commentsDecorations,
     styles3,
@@ -1494,6 +1487,7 @@ var comments = (options = {}) => {
         });
         handleSelect({
           selection,
+          id: state.facet(documentId),
           comments: comments2.map(({ comment, range }) => ({
             comment,
             range,
@@ -1505,14 +1499,41 @@ var comments = (options = {}) => {
     options.onUpdate ? trackPastedComments(options.onUpdate) : []
   ];
 };
-var useComments = (view, comments2 = []) => {
+var focusComment = (view, id, center = true) => {
+  const comment = view.state.field(commentsState).comments.find((range2) => range2.comment.id === id);
+  if (!comment?.comment.cursor) {
+    return;
+  }
+  const range = Cursor.getRangeFromCursor(view.state, comment.comment.cursor);
+  if (range) {
+    view.dispatch({
+      selection: {
+        anchor: range.from
+      },
+      effects: [
+        //
+        EditorView6.scrollIntoView(range.from, center ? {
+          y: "center"
+        } : void 0),
+        setSelection.of({
+          current: id
+        })
+      ]
+    });
+  }
+};
+var useComments = (view, id, comments2 = []) => {
   useEffect(() => {
     if (view) {
       view.dispatch({
-        effects: setComments.of(comments2)
+        effects: setComments.of({
+          id,
+          comments: comments2
+        })
       });
     }
   }, [
+    id,
     view,
     comments2
   ]);
@@ -4594,9 +4615,11 @@ import { invariant as invariant3 } from "@dxos/invariant";
 import { isAutomergeObject } from "@dxos/react-client/echo";
 var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextModel.ts";
 var useTextModel = (props) => {
-  const { identity, space, text } = props;
   const [model, setModel] = useState5();
-  useEffect4(() => setModel(createModel(props)), [
+  const { identity, space, text } = props;
+  useEffect4(() => {
+    setModel(createModel(props));
+  }, [
     identity,
     space,
     text
@@ -4618,7 +4641,7 @@ var createModel = ({ space, identity, text }) => {
   }
   invariant3(isAutomergeObject(text), void 0, {
     F: __dxlog_file6,
-    L: 54,
+    L: 60,
     S: void 0,
     A: [
       "isAutomergeObject(text)",