@dxos/react-ui-editor 0.4.4-main.3a00f69 → 0.4.4-main.4dba395

package/dist/lib/browser/index.mjs

@@ -12,7 +12,7 @@ import { EditorView as EditorView15 } from "@codemirror/view";
 import { useFocusableGroup } from "@fluentui/react-tabster";
 import defaultsDeep2 from "lodash.defaultsdeep";
 import React, { forwardRef, useCallback, useEffect as useEffect2, useImperativeHandle, useRef, useState as useState2 } from "react";
-import { log as log2 } from "@dxos/log";
+import { log as log3 } from "@dxos/log";
 import { useThemeContext } from "@dxos/react-ui";
 import { focusRing } from "@dxos/react-ui-theme";
 import { isNotFalsy as isNotFalsy4 } from "@dxos/util";
@@ -163,6 +163,8 @@ import { next as A4 } from "@dxos/automerge/automerge";
 // packages/ui/react-ui-editor/src/extensions/automerge/cursor.ts
 import get from "lodash.get";
 import { next as A } from "@dxos/automerge/automerge";
+import { log } from "@dxos/log";
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/automerge/cursor.ts";
 var cursorConverter = (handle, path) => ({
   // TODO(burdon): Handle assoc to associate with a previous character.
   toCursor: (pos) => {
@@ -177,6 +179,12 @@ var cursorConverter = (handle, path) => ({
     try {
       return A.getCursor(doc, path.slice(), pos);
     } catch (err) {
+      log.catch(err, void 0, {
+        F: __dxlog_file,
+        L: 31,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
       return "";
     }
   },
@@ -199,6 +207,12 @@ var cursorConverter = (handle, path) => ({
     try {
       return A.getCursorPosition(doc, path.slice(), cursor);
     } catch (err) {
+      log.catch(err, void 0, {
+        F: __dxlog_file,
+        L: 59,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
       return 0;
     }
   }
@@ -701,10 +715,10 @@ import { bracketMatching, defaultHighlightStyle, syntaxHighlighting } from "@cod
 import { oneDarkHighlightStyle } from "@codemirror/theme-one-dark";
 import { drawSelection, EditorView as EditorView4, highlightActiveLine, placeholder } from "@codemirror/view";
 import { isNotFalsy as isNotFalsy2 } from "@dxos/util";
-var createBasicBundle = ({ themeMode, placeholder: _placeholder, lineWrapping = true } = {}) => [
+var createBasicBundle = ({ themeMode, placeholder: _placeholder, lineWrapping = true, bracketMatching: _bracketMatching = true } = {}) => [
   lineWrapping && EditorView4.lineWrapping,
   // https://codemirror.net/docs/ref/#codemirror.minimalSetup
-  bracketMatching(),
+  _bracketMatching && bracketMatching(),
   closeBrackets(),
   drawSelection(),
   highlightActiveLine(),
@@ -718,7 +732,7 @@ var createBasicBundle = ({ themeMode, placeholder: _placeholder, lineWrapping =
 import { EditorView as EditorView5, keymap as keymap2 } from "@codemirror/view";
 import defaultsDeep from "lodash.defaultsdeep";
 import { invariant } from "@dxos/invariant";
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/blast.ts";
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/extensions/blast.ts";
 var defaultOptions = {
   effect: 2,
   maxParticles: 200,
@@ -845,7 +859,7 @@ var Blaster = class {
   }
   initialize() {
     invariant(!this._canvas && !this._ctx, void 0, {
-      F: __dxlog_file,
+      F: __dxlog_file2,
       L: 141,
       S: this,
       A: [
@@ -882,7 +896,7 @@ var Blaster = class {
   }
   start() {
     invariant(this._canvas && this._ctx, void 0, {
-      F: __dxlog_file,
+      F: __dxlog_file2,
       L: 180,
       S: this,
       A: [
@@ -1107,14 +1121,14 @@ var editorFillLayoutEditor = "min-bs-full";
 var editorHalfViewportOverscrollContent = "after:block after:min-bs-[50dvh] after:pointer-events-none";
 
 // packages/ui/react-ui-editor/src/util.ts
-import { log } from "@dxos/log";
-var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/util.ts";
+import { log as log2 } from "@dxos/log";
+var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/util.ts";
 var callbackWrapper = (fn) => (...args) => {
   try {
     return fn(...args);
   } catch (err) {
-    log.catch(err, void 0, {
-      F: __dxlog_file2,
+    log2.catch(err, void 0, {
+      F: __dxlog_file3,
       L: 18,
       S: void 0,
       C: (f, a) => f(...a)
@@ -3892,7 +3906,7 @@ var codeTheme = {
 };
 
 // packages/ui/react-ui-editor/src/components/TextEditor/TextEditor.tsx
-var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/components/TextEditor/TextEditor.tsx";
+var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/components/TextEditor/TextEditor.tsx";
 var BaseTextEditor = /* @__PURE__ */ forwardRef(({ model, readonly, autoFocus, scrollTo, selection, theme, slots = defaultSlots, extensions = [], debug }, forwardedRef) => {
   const tabsterDOMAttribute = useFocusableGroup({
     tabBehavior: "limited"
@@ -3929,8 +3943,8 @@ var BaseTextEditor = /* @__PURE__ */ forwardRef(({ model, readonly, autoFocus, s
       extensions: [
         // TODO(burdon): Doesn't catch errors in keymap functions.
         EditorView15.exceptionSink.of((err) => {
-          log2.catch(err, void 0, {
-            F: __dxlog_file3,
+          log3.catch(err, void 0, {
+            F: __dxlog_file4,
             L: 112,
             S: void 0,
             C: (f, a) => f(...a)
@@ -4332,8 +4346,8 @@ var Toolbar = {
 import { DeferredTask, Event as Event2, sleep } from "@dxos/async";
 import { Context as Context2 } from "@dxos/context";
 import { invariant as invariant2 } from "@dxos/invariant";
-import { log as log3 } from "@dxos/log";
-var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/awareness-provider.ts";
+import { log as log4 } from "@dxos/log";
+var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/awareness-provider.ts";
 var DEBOUNCE_INTERVAL = 100;
 var SpaceAwarenessProvider = class {
   constructor(params) {
@@ -4370,10 +4384,10 @@ var SpaceAwarenessProvider = class {
     void this._space.postMessage(this._channel, {
       kind: "query"
     }).catch((err) => {
-      log3.debug("failed to query awareness", {
+      log4.debug("failed to query awareness", {
         err
       }, {
-        F: __dxlog_file4,
+        F: __dxlog_file5,
         L: 89,
         S: this,
         C: (f, a) => f(...a)
@@ -4390,7 +4404,7 @@ var SpaceAwarenessProvider = class {
   }
   update(position) {
     invariant2(this._postTask, void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file5,
       L: 104,
       S: this,
       A: [
@@ -4407,7 +4421,7 @@ var SpaceAwarenessProvider = class {
   }
   _handleQueryMessage() {
     invariant2(this._postTask, void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file5,
       L: 115,
       S: this,
       A: [
@@ -4419,7 +4433,7 @@ var SpaceAwarenessProvider = class {
   }
   _handlePostMessage(message) {
     invariant2(message.kind === "post", void 0, {
-      F: __dxlog_file4,
+      F: __dxlog_file5,
       L: 120,
       S: this,
       A: [
@@ -4488,28 +4502,36 @@ var useActionHandler = (view) => {
 };
 
 // packages/ui/react-ui-editor/src/hooks/useEditorView.ts
-import { useState as useState3 } from "react";
-var useEditorView = () => {
-  const [view, setView] = useState3(null);
+import { useRef as useRef2, useState as useState3 } from "react";
+var useEditorView = (id) => {
+  const editorRef = useRef2(null);
+  const [prev, setPrev] = useState3([
+    null,
+    ""
+  ]);
+  if (prev[0] !== editorRef.current) {
+    setPrev([
+      editorRef.current,
+      id
+    ]);
+  }
   return [
-    (ref) => {
-      setView(ref);
-    },
-    view
+    editorRef,
+    prev[1] !== id
   ];
 };
 
 // packages/ui/react-ui-editor/src/hooks/useTextEditor.ts
 import { EditorSelection as EditorSelection2, EditorState as EditorState3 } from "@codemirror/state";
 import { EditorView as EditorView16 } from "@codemirror/view";
-import { useEffect as useEffect3, useRef as useRef2, useState as useState4 } from "react";
-import { log as log4 } from "@dxos/log";
+import { useEffect as useEffect3, useRef as useRef3, useState as useState4 } from "react";
+import { log as log5 } from "@dxos/log";
 import { isNotFalsy as isNotFalsy5 } from "@dxos/util";
-var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextEditor.ts";
+var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextEditor.ts";
 var useTextEditor = ({ autoFocus, scrollTo, debug, doc, selection, extensions } = {}) => {
-  const onUpdate = useRef2();
+  const onUpdate = useRef3();
   const [view, setView] = useState4();
-  const parentRef = useRef2(null);
+  const parentRef = useRef3(null);
   useEffect3(() => {
     if (parentRef.current) {
       const state = EditorState3.create({
@@ -4518,8 +4540,8 @@ var useTextEditor = ({ autoFocus, scrollTo, debug, doc, selection, extensions }
         extensions: [
           // TODO(burdon): Doesn't catch errors in keymap functions.
           EditorView16.exceptionSink.of((err) => {
-            log4.catch(err, void 0, {
-              F: __dxlog_file5,
+            log5.catch(err, void 0, {
+              F: __dxlog_file6,
               L: 57,
               S: void 0,
               C: (f, a) => f(...a)
@@ -4608,24 +4630,13 @@ var createThemeExtensions = ({ theme, themeMode, slots } = {}) => {
 
 // packages/ui/react-ui-editor/src/hooks/useTextModel.ts
 import get4 from "lodash.get";
-import { useEffect as useEffect4, useState as useState5 } from "react";
+import { useState as useState5, useMemo as useMemo2 } from "react";
 import { generateName } from "@dxos/display-name";
 import { getRawDoc } from "@dxos/echo-schema";
 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 [model, setModel] = useState5();
-  const { identity, space, text } = props;
-  useEffect4(() => {
-    setModel(createModel(props));
-  }, [
-    identity,
-    space,
-    text
-  ]);
-  return model;
-};
+var __dxlog_file7 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-editor/src/hooks/useTextModel.ts";
+var useTextModel = (props) => useMemo2(() => createModel(props), Object.values(props));
 var useInMemoryTextModel = ({ id, defaultContent }) => {
   const [content, setContent] = useState5(defaultContent ?? "");
   return {
@@ -4640,8 +4651,8 @@ var createModel = ({ space, identity, text }) => {
     return void 0;
   }
   invariant3(isAutomergeObject(text), void 0, {
-    F: __dxlog_file6,
-    L: 60,
+    F: __dxlog_file7,
+    L: 54,
     S: void 0,
     A: [
       "isAutomergeObject(text)",