@handlewithcare/react-prosemirror 2.4.12 → 2.5.0

package/dist/esm/components/MarkView.js

@@ -32,7 +32,7 @@ export const MarkView = /*#__PURE__*/ memo(/*#__PURE__*/ forwardRef(function Mar
         if (!domRef.current) return;
         const firstChildDesc = childDescriptors.current[0];
         if (!viewDescRef.current) {
-            viewDescRef.current = new MarkViewDesc(parentRef.current, childDescriptors.current, ()=>getPos.current(), mark, domRef.current, firstChildDesc?.dom.parentElement ?? domRef.current, {
+            viewDescRef.current = new MarkViewDesc(parentRef.current, childDescriptors.current, getPos, mark, domRef.current, firstChildDesc?.dom.parentElement ?? domRef.current, {
                 dom: domRef.current,
                 contentDOM: firstChildDesc?.dom.parentElement ?? domRef.current
             });
@@ -42,7 +42,6 @@ export const MarkView = /*#__PURE__*/ memo(/*#__PURE__*/ forwardRef(function Mar
             viewDescRef.current.children = childDescriptors.current;
             viewDescRef.current.spec.contentDOM = viewDescRef.current.contentDOM = firstChildDesc?.dom.parentElement ?? domRef.current;
             viewDescRef.current.mark = mark;
-            viewDescRef.current.getPos = ()=>getPos.current();
         }
         if (!siblingsRef.current.includes(viewDescRef.current)) {
             siblingsRef.current.push(viewDescRef.current);

package/dist/esm/components/NativeWidgetView.js

@@ -24,7 +24,7 @@ export function NativeWidgetView(param) {
         if (!rootDomRef.current) return;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const toDOM = widget.type.toDOM;
-        let dom = typeof toDOM === "function" ? toDOM(view, ()=>getPos.current()) : toDOM;
+        let dom = typeof toDOM === "function" ? toDOM(view, getPos) : toDOM;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         if (!widget.type.spec.raw) {
             if (dom.nodeType != 1) {
@@ -41,11 +41,10 @@ export function NativeWidgetView(param) {
     useClientLayoutEffect(()=>{
         if (!rootDomRef.current) return;
         if (!viewDescRef.current) {
-            viewDescRef.current = new WidgetViewDesc(parentRef.current, ()=>getPos.current(), widget, rootDomRef.current);
+            viewDescRef.current = new WidgetViewDesc(parentRef.current, getPos, widget, rootDomRef.current);
         } else {
             viewDescRef.current.parent = parentRef.current;
             viewDescRef.current.widget = widget;
-            viewDescRef.current.getPos = ()=>getPos.current();
             viewDescRef.current.dom = rootDomRef.current;
         }
         if (!siblingsRef.current.includes(viewDescRef.current)) {

package/dist/esm/components/NodeView.js

@@ -5,7 +5,7 @@ import { ReactNodeView } from "./ReactNodeView.js";
 export const NodeView = /*#__PURE__*/ memo(function NodeView(param) {
     let { outerDeco, getPos, node, innerDeco, ...props } = param;
     const { view } = useContext(EditorContext);
-    const customNodeView = view?.someProp("nodeViews", (nodeViews)=>nodeViews?.[node.type.name]);
+    const customNodeView = view.nodeViews[node.type.name];
     if (customNodeView) {
         return /*#__PURE__*/ React.createElement(CustomNodeView, {
             customNodeView: customNodeView,

package/dist/esm/components/ProseMirror.js

@@ -1,4 +1,3 @@
-import { DecorationSet } from "prosemirror-view";
 import React, { useMemo, useState } from "react";
 import { EditorContext } from "../contexts/EditorContext.js";
 import { EditorStateContext } from "../contexts/EditorStateContext.js";
@@ -8,7 +7,6 @@ import { viewDecorations } from "../decorations/viewDecorations.js";
 import { useEditor } from "../hooks/useEditor.js";
 import { LayoutGroup } from "./LayoutGroup.js";
 import { DocNodeViewContext } from "./ProseMirrorDoc.js";
-const EMPTY_OUTER_DECOS = [];
 function ProseMirrorInner(param) {
     let { className, children, nodeViews, customNodeViews, ...props } = param;
     const [mount, setMount] = useState(null);
@@ -16,26 +14,25 @@ function ProseMirrorInner(param) {
         ...props,
         nodeViews: customNodeViews
     });
-    const innerDecos = editor.view ? viewDecorations(editor.view, editor.cursorWrapper) : DecorationSet.empty;
-    const outerDecos = editor.view ? computeDocDeco(editor.view) : EMPTY_OUTER_DECOS;
     const nodeViewContextValue = useMemo(()=>({
             nodeViews: nodeViews ?? {}
         }), [
         nodeViews
     ]);
+    const node = state.doc;
+    const innerDeco = viewDecorations(editor.view, editor.cursorWrapper);
+    const outerDeco = computeDocDeco(editor.view);
     const docNodeViewContextValue = useMemo(()=>({
-            className: className,
-            setMount: setMount,
-            node: editor.view?.state.doc,
-            innerDeco: innerDecos,
-            outerDeco: outerDecos,
-            viewDesc: editor.docViewDescRef.current
+            className,
+            setMount,
+            node,
+            innerDeco,
+            outerDeco
         }), [
         className,
-        editor.docViewDescRef,
-        editor.view?.state.doc,
-        innerDecos,
-        outerDecos
+        node,
+        innerDeco,
+        outerDeco
     ]);
     return /*#__PURE__*/ React.createElement(EditorContext.Provider, {
         value: editor

package/dist/esm/components/ReactNodeView.js

@@ -12,14 +12,13 @@ export const ReactNodeView = /*#__PURE__*/ memo(function ReactNodeView(param) {
     const domRef = useRef(null);
     const nodeDomRef = useRef(null);
     const contentDomRef = useRef(null);
-    const getPosFunc = useRef(()=>getPos.current()).current;
     const { nodeViews } = useContext(NodeViewContext);
     let element = null;
     const Component = nodeViews[node.type.name];
     const outputSpec = useMemo(()=>node.type.spec.toDOM?.(node), [
         node
     ]);
-    const { hasContentDOM, childDescriptors, setStopEvent, setSelectNode, setIgnoreMutation, nodeViewDescRef } = useNodeViewDescriptor(node, ()=>getPos.current(), domRef, nodeDomRef, innerDeco, outerDeco, undefined, contentDomRef);
+    const { hasContentDOM, childDescriptors, setStopEvent, setSelectNode, setIgnoreMutation, nodeViewDescRef } = useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDeco, outerDeco, contentDomRef);
     const finalProps = {
         ...props,
         ...!hasContentDOM && nodeDomRef.current?.tagName !== "BR" && {
@@ -28,11 +27,11 @@ export const ReactNodeView = /*#__PURE__*/ memo(function ReactNodeView(param) {
     };
     const nodeProps = useMemo(()=>({
             node: node,
-            getPos: getPosFunc,
+            getPos: getPos,
             decorations: outerDeco,
             innerDecorations: innerDeco
         }), [
-        getPosFunc,
+        getPos,
         innerDeco,
         node,
         outerDeco

package/dist/esm/components/SeparatorHackView.js

@@ -32,11 +32,10 @@ export function SeparatorHackView(param) {
         }
         if (!ref.current) return;
         if (!viewDescRef.current) {
-            viewDescRef.current = new TrailingHackViewDesc(parentRef.current, [], ()=>getPos.current(), ref.current, null);
+            viewDescRef.current = new TrailingHackViewDesc(parentRef.current, [], getPos, ref.current, null);
         } else {
             viewDescRef.current.parent = parentRef.current;
             viewDescRef.current.dom = ref.current;
-            viewDescRef.current.getPos = ()=>getPos.current();
         }
         if (!siblingsRef.current.includes(viewDescRef.current)) {
             siblingsRef.current.push(viewDescRef.current);

package/dist/esm/components/TextNodeView.js

@@ -37,8 +37,8 @@ export class TextNodeView extends Component {
         // when a composition was started that produces a new text node.
         // Otherwise we just rely on re-rendering the renderRef
         if (!dom) {
-            if (!view?.composing) return;
-            this.viewDescRef = new CompositionViewDesc(parentRef.current, ()=>getPos.current(), // These are just placeholders/dummies. We can't
+            if (!view.composing) return;
+            this.viewDescRef = new CompositionViewDesc(parentRef.current, getPos, // These are just placeholders/dummies. We can't
             // actually find the correct DOM nodes from here,
             // so we let our parent do it.
             // Passing a valid element here just so that the
@@ -51,12 +51,11 @@ export class TextNodeView extends Component {
             textNode = textNode.firstChild;
         }
         if (!this.viewDescRef || this.viewDescRef instanceof CompositionViewDesc) {
-            this.viewDescRef = new TextViewDesc(undefined, [], ()=>getPos.current(), node, decorations, DecorationSet.empty, dom, textNode);
+            this.viewDescRef = new TextViewDesc(undefined, [], getPos, node, decorations, DecorationSet.empty, dom, textNode);
         } else {
             this.viewDescRef.parent = parentRef.current;
             this.viewDescRef.children = [];
             this.viewDescRef.node = node;
-            this.viewDescRef.getPos = ()=>getPos.current();
             this.viewDescRef.outerDeco = decorations;
             this.viewDescRef.innerDeco = DecorationSet.empty;
             this.viewDescRef.dom = dom;
@@ -92,7 +91,7 @@ export class TextNodeView extends Component {
         // an active composition and the selection is in this node,
         // we freeze the DOM of this element so that it doesn't
         // interrupt the composition
-        if (view?.composing && view.state.selection.from >= getPos.current() && view.state.selection.from <= getPos.current() + node.nodeSize) {
+        if (view.composing && view.state.selection.from >= getPos() && view.state.selection.from <= getPos() + node.nodeSize) {
             return this.renderRef;
         }
         this.renderRef = decorations.reduce(wrapInDeco, node.text);

package/dist/esm/components/TrailingHackView.js

@@ -22,11 +22,10 @@ export function TrailingHackView(param) {
     useClientLayoutEffect(()=>{
         if (!ref.current) return;
         if (!viewDescRef.current) {
-            viewDescRef.current = new TrailingHackViewDesc(parentRef.current, [], ()=>getPos.current(), ref.current, null);
+            viewDescRef.current = new TrailingHackViewDesc(parentRef.current, [], getPos, ref.current, null);
         } else {
             viewDescRef.current.parent = parentRef.current;
             viewDescRef.current.dom = ref.current;
-            viewDescRef.current.getPos = ()=>getPos.current();
         }
         if (!siblingsRef.current.includes(viewDescRef.current)) {
             siblingsRef.current.push(viewDescRef.current);

package/dist/esm/components/WidgetView.js

@@ -6,7 +6,6 @@ export function WidgetView(param) {
     let { widget, getPos } = param;
     const { siblingsRef, parentRef } = useContext(ChildDescriptorsContext);
     const viewDescRef = useRef(null);
-    const getPosFunc = useRef(()=>getPos.current()).current;
     const domRef = useRef(null);
     useClientLayoutEffect(()=>{
         const siblings = siblingsRef.current;
@@ -23,11 +22,10 @@ export function WidgetView(param) {
     useClientLayoutEffect(()=>{
         if (!domRef.current) return;
         if (!viewDescRef.current) {
-            viewDescRef.current = new WidgetViewDesc(parentRef.current, ()=>getPos.current(), widget, domRef.current);
+            viewDescRef.current = new WidgetViewDesc(parentRef.current, getPos, widget, domRef.current);
         } else {
             viewDescRef.current.parent = parentRef.current;
             viewDescRef.current.widget = widget;
-            viewDescRef.current.getPos = ()=>getPos.current();
             viewDescRef.current.dom = domRef.current;
         }
         if (!siblingsRef.current.includes(viewDescRef.current)) {
@@ -39,7 +37,7 @@ export function WidgetView(param) {
     return Component && /*#__PURE__*/ React.createElement(Component, {
         ref: domRef,
         widget: widget,
-        getPos: getPosFunc,
+        getPos: getPos,
         contentEditable: false
     });
 }

package/dist/esm/constants.js

@@ -0,0 +1,15 @@
+import { Schema } from "prosemirror-model";
+import { EditorState } from "prosemirror-state";
+export const EMPTY_SCHEMA = new Schema({
+    nodes: {
+        doc: {
+            content: "text*"
+        },
+        text: {
+            inline: true
+        }
+    }
+});
+export const EMPTY_STATE = EditorState.create({
+    schema: EMPTY_SCHEMA
+});

package/dist/esm/hooks/useEditor.js

@@ -1,178 +1,12 @@
-import { Schema } from "prosemirror-model";
-import { EditorState } from "prosemirror-state";
-import { DecorationSet, EditorView } from "prosemirror-view";
 import { useCallback, useMemo, useRef, useState } from "react";
 import { flushSync } from "react-dom";
+import { ReactEditorView } from "../ReactEditorView.js";
+import { StaticEditorView } from "../StaticEditorView.js";
+import { EMPTY_STATE } from "../constants.js";
 import { beforeInputPlugin } from "../plugins/beforeInputPlugin.js";
-import { SelectionDOMObserver } from "../selection/SelectionDOMObserver.js";
-import { setSsrStubs } from "../ssr.js";
-import { NodeViewDesc } from "../viewdesc.js";
 import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
 import { useComponentEventListeners } from "./useComponentEventListeners.js";
 import { useForceUpdate } from "./useForceUpdate.js";
-function buildNodeViews(view) {
-    const result = Object.create(null);
-    function add(obj) {
-        for(const prop in obj)if (!Object.prototype.hasOwnProperty.call(result, prop)) // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-        result[prop] = obj[prop];
-    }
-    view.someProp("nodeViews", add);
-    view.someProp("markViews", add);
-    return result;
-}
-function changedNodeViews(a, b) {
-    let nA = 0, nB = 0;
-    for(const prop in a){
-        if (a[prop] != b[prop]) return true;
-        nA++;
-    }
-    for(const _ in b)nB++;
-    return nA != nB;
-}
-function changedProps(a, b) {
-    for (const prop of Object.keys(a)){
-        if (a[prop] !== b[prop]) return true;
-    }
-    return false;
-}
-function getEditable(view) {
-    return !view.someProp("editable", (value)=>value(view.state) === false);
-}
-// @ts-expect-error We're making use of knowledge of internal methods here
-export class ReactEditorView extends EditorView {
-    shouldUpdatePluginViews = false;
-    oldProps;
-    _props;
-    ready;
-    constructor(place, props){
-        // Call the superclass constructor with an empty
-        // document and limited props. We'll set everything
-        // else ourselves.
-        const cleanup = setSsrStubs();
-        super(place, {
-            state: EditorState.create({
-                schema: props.state.schema
-            })
-        });
-        cleanup();
-        this.ready = props.ready;
-        this.shouldUpdatePluginViews = true;
-        this._props = props;
-        this.oldProps = {
-            state: props.state
-        };
-        this.state = props.state;
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        this.domObserver.stop();
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        this.domObserver = new SelectionDOMObserver(this);
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        this.domObserver.start();
-        this.editable = getEditable(this);
-        // Destroy the DOM created by the default
-        // ProseMirror ViewDesc implementation; we
-        // have a NodeViewDesc from React instead.
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        this.docView.dom.replaceChildren();
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        this.nodeViews = buildNodeViews(this);
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        this.docView = props.docView;
-    }
-    /**
-   * Whether the EditorView's updateStateInner method thinks that the
-   * docView needs to be blown away and redrawn.
-   *
-   * @privateremarks
-   *
-   * When ProseMirror View detects that the EditorState has been reconfigured
-   * to provide new custom node views, it calls an internal function that
-   * we can't override in order to recreate the entire editor DOM.
-   *
-   * This property mimics that check, so that we can replace the EditorView
-   * with another of our own, preventing ProseMirror View from taking over
-   * DOM management responsibility.
-   */ get needsRedraw() {
-        if (this.oldProps.state.plugins === this._props.state.plugins && this._props.plugins === this.oldProps.plugins) {
-            return false;
-        }
-        const newNodeViews = buildNodeViews(this);
-        // @ts-expect-error Internal property
-        return changedNodeViews(this.nodeViews, newNodeViews);
-    }
-    /**
-   * Like setProps, but without executing any side effects.
-   * Safe to use in a component render method.
-   */ pureSetProps(props) {
-        // this.oldProps = this.props;
-        this._props = {
-            ...this._props,
-            ...props
-        };
-        this.state = this._props.state;
-        this.editable = getEditable(this);
-    }
-    /**
-   * Triggers any side effects that have been queued by previous
-   * calls to pureSetProps.
-   */ runPendingEffects() {
-        if (changedProps(this.props, this.oldProps)) {
-            const newProps = this.props;
-            this._props = this.oldProps;
-            this.state = this._props.state;
-            this.update(newProps);
-        }
-    }
-    update(props) {
-        super.update(props);
-        // Ensure that side effects aren't re-triggered until
-        // pureSetProps is called again
-        this.oldProps = props;
-    }
-    updatePluginViews(prevState) {
-        if (this.shouldUpdatePluginViews) {
-            // @ts-expect-error We're making use of knowledge of internal methods here
-            super.updatePluginViews(prevState);
-        }
-    }
-    // We want to trigger the default EditorView cleanup, but without
-    // the actual view.dom cleanup (which React will have already handled).
-    // So we give the EditorView a dummy DOM element and ask it to clean up
-    destroy() {
-        // If needsRedraw returns true, then we will destroy and recreate
-        // the EditorView, but will likely leave the ProseMirrorDoc node as-is.
-        // In this case, this.dom will still be connected when destroy runs, and
-        // it will be reused for the next EditorView, so we need to manually reset
-        // it.
-        if (this.dom.isConnected) {
-            // We need to manually execute this code from super.destroy(),
-            // because when super.destroy() runs, it will have been given a dummy
-            // dom node
-            // @ts-expect-error Internal property - input
-            for(const type in this.input.eventHandlers){
-                // @ts-expect-error Internal property - input
-                this.dom.removeEventListener(type, this.input.eventHandlers[type]);
-            }
-        }
-        // @ts-expect-error we're intentionally overwriting this property
-        // to prevent side effects
-        this.dom = document.createElement("div");
-        super.destroy();
-    }
-}
-const EMPTY_SCHEMA = new Schema({
-    nodes: {
-        doc: {
-            content: "text*"
-        },
-        text: {
-            inline: true
-        }
-    }
-});
-const EMPTY_STATE = EditorState.create({
-    schema: EMPTY_SCHEMA
-});
 let didWarnValueDefaultValue = false;
 /**
  * Creates, mounts, and manages a ProseMirror `EditorView`.
@@ -232,30 +66,18 @@ let didWarnValueDefaultValue = false;
         options.dispatchTransaction,
         options.state
     ]);
-    const cleanup = setSsrStubs();
-    const tempDom = document.createElement("div");
-    cleanup();
-    const docViewDescRef = useRef(new NodeViewDesc(undefined, [], ()=>-1, state.doc, [], DecorationSet.empty, tempDom, null, tempDom, ()=>false, ()=>{
-    /* The doc node can't have a node selection*/ }, ()=>{
-    /* The doc node can't have a node selection*/ }, ()=>false));
     const directEditorProps = {
         ...options,
         state,
         plugins,
-        dispatchTransaction,
-        docView: docViewDescRef.current,
-        ready: true
+        dispatchTransaction
     };
-    const [view, setView] = useState(// During the initial render, we create something of a dummy
-    // EditorView. This allows us to ensure that the first render actually
-    // renders the document, which is necessary for SSR.
-    ()=>new ReactEditorView(null, {
-            ...directEditorProps,
-            ready: false
-        }));
+    const [view, setView] = useState(()=>{
+        return new StaticEditorView(directEditorProps);
+    });
     useClientLayoutEffect(()=>{
         return ()=>{
-            view?.destroy();
+            view.destroy();
         };
     }, [
         view
@@ -265,44 +87,33 @@ let didWarnValueDefaultValue = false;
     // so this is not a concern.
     // eslint-disable-next-line react-hooks/exhaustive-deps
     useClientLayoutEffect(()=>{
-        if (!mount) {
-            setView(null);
-            return;
-        }
-        if (!view || view.dom !== mount) {
-            const newView = new ReactEditorView({
-                mount
-            }, directEditorProps);
-            setView(newView);
-            newView.dom.addEventListener("compositionend", forceUpdate);
-            return;
-        }
-        // TODO: We should be able to put this in previous branch,
-        // but we need to convince EditorView's constructor not to
-        // clear out the DOM when passed a mount that already has
-        // content in it, otherwise React blows up when it tries
-        // to clean up.
-        if (view.needsRedraw) {
-            setView(null);
-            return;
+        if (mount !== view.dom) {
+            if (mount) {
+                const view = new ReactEditorView({
+                    mount
+                }, directEditorProps);
+                view.dom.addEventListener("compositionend", forceUpdate);
+                setView(view);
+            } else {
+                const view = new StaticEditorView(directEditorProps);
+                setView(view);
+            }
+        } else if (view instanceof ReactEditorView) {
+            view.commitPendingEffects();
         }
-        // @ts-expect-error Internal property - domObserver
-        view?.domObserver.selectionToDOM();
-        view?.runPendingEffects();
     });
-    view?.pureSetProps(directEditorProps);
+    view.update(directEditorProps);
     const editor = useMemo(()=>({
-            view: view,
-            registerEventListener,
-            unregisterEventListener,
+            view,
             cursorWrapper,
-            docViewDescRef,
-            flushSyncRef
+            flushSyncRef,
+            registerEventListener,
+            unregisterEventListener
         }), [
-        view,
+        cursorWrapper,
         registerEventListener,
         unregisterEventListener,
-        cursorWrapper
+        view
     ]);
     return {
         editor,

package/dist/esm/hooks/useEditorEffect.js

@@ -1,4 +1,5 @@
 /* Copyright (c) The New York Times Company */ import { useContext } from "react";
+import { ReactEditorView } from "../ReactEditorView.js";
 import { EditorContext } from "../contexts/EditorContext.js";
 import { useLayoutGroupEffect } from "./useLayoutGroupEffect.js";
 /**
@@ -24,8 +25,7 @@ import { useLayoutGroupEffect } from "./useLayoutGroupEffect.js";
     // every time it changes, because it will most likely
     // be defined inline and run on every re-render.
     useLayoutGroupEffect(()=>{
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        if (view?.docView && view.ready) {
+        if (view instanceof ReactEditorView) {
             flushSyncRef.current = false;
             const result = effect(view);
             flushSyncRef.current = true;

package/dist/esm/hooks/useEditorEventCallback.js

@@ -1,6 +1,13 @@
 /* Copyright (c) The New York Times Company */ import { useCallback, useContext, useRef } from "react";
+import { ReactEditorView } from "../ReactEditorView.js";
 import { EditorContext } from "../contexts/EditorContext.js";
 import { useEditorEffect } from "./useEditorEffect.js";
+function assertIsReactEditorView(view) {
+    if (view instanceof ReactEditorView) {
+        return;
+    }
+    throw new DOMException("ProseMirror document is not mounted", "InvalidStateError");
+}
 /**
  * Returns a stable function reference to be used as an
  * event handler callback.
@@ -25,11 +32,7 @@ import { useEditorEffect } from "./useEditorEffect.js";
         for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
             args[_key] = arguments[_key];
         }
-        // It's not actually possible for an event handler to run
-        // while view is null, since view is only ever set to
-        // null in a layout effect that then immediately triggers
-        // a re-render which sets view to a new EditorView
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        assertIsReactEditorView(view);
         return ref.current(view, ...args);
     }, [
         view

package/dist/esm/hooks/useNodeViewDescriptor.js

@@ -3,10 +3,10 @@ import { ChildDescriptorsContext } from "../contexts/ChildDescriptorsContext.js"
 import { EditorContext } from "../contexts/EditorContext.js";
 import { CompositionViewDesc, NodeViewDesc, sortViewDescs } from "../viewdesc.js";
 import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
-export function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDecorations, outerDecorations, viewDesc, contentDOMRef) {
+export function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDecorations, outerDecorations, contentDOMRef) {
     const { view } = useContext(EditorContext);
     const [hasContentDOM, setHasContentDOM] = useState(true);
-    const nodeViewDescRef = useRef(viewDesc);
+    const nodeViewDescRef = useRef();
     const stopEvent = useRef(()=>false);
     const setStopEvent = useCallback((newStopEvent)=>{
         stopEvent.current = newStopEvent;
@@ -16,12 +16,12 @@ export function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDec
         ignoreMutation.current = newIgnoreMutation;
     }, []);
     const selectNode = useRef(()=>{
-        if (!nodeDomRef.current || !node) return;
+        if (!nodeDomRef.current) return;
         if (nodeDomRef.current.nodeType == 1) nodeDomRef.current.classList.add("ProseMirror-selectednode");
         if (contentDOMRef?.current || !node.type.spec.draggable) (domRef?.current ?? nodeDomRef.current).draggable = true;
     });
     const deselectNode = useRef(()=>{
-        if (!nodeDomRef.current || !node) return;
+        if (!nodeDomRef.current) return;
         if (nodeDomRef.current.nodeType == 1) {
             nodeDomRef.current.classList.remove("ProseMirror-selectednode");
             if (contentDOMRef?.current || !node.type.spec.draggable) (domRef?.current ?? nodeDomRef.current).removeAttribute("draggable");
@@ -47,15 +47,14 @@ export function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDec
     ]);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     useClientLayoutEffect(()=>{
-        if (!node || !nodeDomRef.current) return;
+        if (!nodeDomRef.current) return;
         const firstChildDesc = childDescriptors.current[0];
         if (!nodeViewDescRef.current) {
-            nodeViewDescRef.current = new NodeViewDesc(parentRef.current, childDescriptors.current, getPos, node, outerDecorations, innerDecorations, domRef?.current ?? nodeDomRef.current, firstChildDesc?.dom.parentElement ?? null, nodeDomRef.current, (event)=>!!stopEvent.current(event), ()=>selectNode.current(), ()=>deselectNode.current(), (mutation)=>ignoreMutation.current(mutation));
+            nodeViewDescRef.current = new NodeViewDesc(parentRef.current, childDescriptors.current, getPos, node, outerDecorations, innerDecorations, domRef?.current ?? nodeDomRef.current, contentDOMRef?.current ?? firstChildDesc?.dom.parentElement ?? null, nodeDomRef.current, (event)=>!!stopEvent.current(event), ()=>selectNode.current(), ()=>deselectNode.current(), (mutation)=>ignoreMutation.current(mutation));
         } else {
             nodeViewDescRef.current.parent = parentRef.current;
             nodeViewDescRef.current.children = childDescriptors.current;
             nodeViewDescRef.current.node = node;
-            nodeViewDescRef.current.getPos = getPos;
             nodeViewDescRef.current.outerDeco = outerDecorations;
             nodeViewDescRef.current.innerDeco = innerDecorations;
             nodeViewDescRef.current.dom = domRef?.current ?? nodeDomRef.current;
@@ -88,12 +87,13 @@ export function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDec
                 childDesc.textDOM = textDOM;
                 childDesc.text = textDOM.data;
                 childDesc.textDOM.pmViewDesc = childDesc;
-                // @ts-expect-error Internal property -- input
-                view?.input.compositionNodes.push(childDesc);
+                // It should not be possible to be in a composition because one could
+                // not start between the renders that switch the view type.
+                view.input.compositionNodes.push(childDesc);
             }
         }
         return ()=>{
-            if (nodeViewDescRef.current?.children[0] instanceof CompositionViewDesc && !view?.composing) {
+            if (nodeViewDescRef.current?.children[0] instanceof CompositionViewDesc && !view.composing) {
                 nodeViewDescRef.current?.children[0].dom.parentNode?.removeChild(nodeViewDescRef.current?.children[0].dom);
             }
         };

package/dist/esm/hooks/useReactKeys.js

@@ -3,5 +3,5 @@ import { EditorContext } from "../contexts/EditorContext.js";
 import { reactKeysPluginKey } from "../plugins/reactKeys.js";
 export function useReactKeys() {
     const { view } = useContext(EditorContext);
-    return view && reactKeysPluginKey.getState(view.state);
+    return reactKeysPluginKey.getState(view.state);
 }

package/dist/esm/testing/editorViewTestHelpers.js

@@ -62,8 +62,6 @@ export function tempEditor(param) {
         }, /*#__PURE__*/ React.createElement(Test, null), /*#__PURE__*/ React.createElement(ProseMirrorDoc, null)));
         return view;
     }
-    // We need two renders for the hasContentDOM state to settle
-    rerenderEditor();
     return {
         view: view,
         rerender: rerenderEditor,