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

package/src/hooks/useEditorView.ts

@@ -3,27 +3,29 @@
 //
 
 import { type EditorView } from '@codemirror/view';
-import { type RefCallback, useState } from 'react';
+import { type MutableRefObject, useRef, useState } from 'react';
 
 /**
  * Hook for accessing the editor view.
  *
  * ```tsx
  * const Test = () => {
- *   const [editorRef, editorView] = useEditorView();
+ *   const [editorRef, viewInvalidated] = useEditorView();
  *   useEffect(() => {
- *     editorView?.focus();
+ *     if (editorRef.current && !viewInvalidated) {
+ *       editorView?.focus();
+ *     }
  *   }, [editorView]);
  *   return <TextEditor ref={editorRef} />;
  * };
  * ```
  */
-export const useEditorView = (): [RefCallback<EditorView | null>, EditorView | null] => {
-  const [view, setView] = useState<EditorView | null>(null);
-  return [
-    (ref: EditorView | null) => {
-      setView(ref);
-    },
-    view,
-  ];
+export const useEditorView = (id: string): [MutableRefObject<EditorView | null>, boolean] => {
+  const editorRef = useRef<EditorView | null>(null);
+  const [prev, setPrev] = useState<[EditorView | null, string]>([null, '']);
+  if (prev[0] !== editorRef.current) {
+    setPrev([editorRef.current, id]);
+  }
+
+  return [editorRef, prev[1] !== id];
 };

package/src/hooks/useTextModel.ts

@@ -3,7 +3,7 @@
 //
 
 import get from 'lodash.get';
-import { type Dispatch, type SetStateAction, useEffect, useState } from 'react';
+import { type Dispatch, type SetStateAction, useState, useMemo } from 'react';
 
 import { generateName } from '@dxos/display-name';
 import { type AutomergeTextCompat, getRawDoc } from '@dxos/echo-schema';
@@ -27,14 +27,8 @@ export type UseTextModelProps = {
  * @deprecated
  */
 // TODO(burdon): Remove once automerge lands.
-export const useTextModel = (props: UseTextModelProps): EditorModel | undefined => {
-  const [model, setModel] = useState<EditorModel>();
-  const { identity, space, text } = props;
-  useEffect(() => {
-    setModel(createModel(props));
-  }, [identity, space, text]);
-  return model;
-};
+export const useTextModel = (props: UseTextModelProps): EditorModel | undefined =>
+  useMemo(() => createModel(props), Object.values(props));
 
 /**
  * For use primarily in stories & tests so the dependence on TextObject can be avoided.