@handlewithcare/react-prosemirror 2.4.11 → 2.5.0

package/dist/cjs/components/ProseMirror.js

@@ -8,7 +8,6 @@ Object.defineProperty(exports, "ProseMirror", {
         return ProseMirror;
     }
 });
-const _prosemirrorview = require("prosemirror-view");
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _EditorContext = require("../contexts/EditorContext.js");
 const _EditorStateContext = require("../contexts/EditorStateContext.js");
@@ -59,7 +58,6 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-const EMPTY_OUTER_DECOS = [];
 function ProseMirrorInner(param) {
     let { className, children, nodeViews, customNodeViews, ...props } = param;
     const [mount, setMount] = (0, _react.useState)(null);
@@ -67,26 +65,25 @@ function ProseMirrorInner(param) {
         ...props,
         nodeViews: customNodeViews
     });
-    const innerDecos = editor.view ? (0, _viewDecorations.viewDecorations)(editor.view, editor.cursorWrapper) : _prosemirrorview.DecorationSet.empty;
-    const outerDecos = editor.view ? (0, _computeDocDeco.computeDocDeco)(editor.view) : EMPTY_OUTER_DECOS;
     const nodeViewContextValue = (0, _react.useMemo)(()=>({
             nodeViews: nodeViews ?? {}
         }), [
         nodeViews
     ]);
+    const node = state.doc;
+    const innerDeco = (0, _viewDecorations.viewDecorations)(editor.view, editor.cursorWrapper);
+    const outerDeco = (0, _computeDocDeco.computeDocDeco)(editor.view);
     const docNodeViewContextValue = (0, _react.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.default.createElement(_EditorContext.EditorContext.Provider, {
         value: editor

package/dist/cjs/components/ReactNodeView.js

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

package/dist/cjs/components/SeparatorHackView.js

@@ -83,11 +83,10 @@ function SeparatorHackView(param) {
         }
         if (!ref.current) return;
         if (!viewDescRef.current) {
-            viewDescRef.current = new _viewdesc.TrailingHackViewDesc(parentRef.current, [], ()=>getPos.current(), ref.current, null);
+            viewDescRef.current = new _viewdesc.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/cjs/components/TextNodeView.js

@@ -47,8 +47,8 @@ let TextNodeView = class TextNodeView extends _react.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 _viewdesc.CompositionViewDesc(parentRef.current, ()=>getPos.current(), // These are just placeholders/dummies. We can't
+            if (!view.composing) return;
+            this.viewDescRef = new _viewdesc.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
@@ -61,12 +61,11 @@ let TextNodeView = class TextNodeView extends _react.Component {
             textNode = textNode.firstChild;
         }
         if (!this.viewDescRef || this.viewDescRef instanceof _viewdesc.CompositionViewDesc) {
-            this.viewDescRef = new _viewdesc.TextViewDesc(undefined, [], ()=>getPos.current(), node, decorations, _prosemirrorview.DecorationSet.empty, dom, textNode);
+            this.viewDescRef = new _viewdesc.TextViewDesc(undefined, [], getPos, node, decorations, _prosemirrorview.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 = _prosemirrorview.DecorationSet.empty;
             this.viewDescRef.dom = dom;
@@ -102,7 +101,7 @@ let TextNodeView = class TextNodeView extends _react.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(_ChildNodeViews.wrapInDeco, node.text);

package/dist/cjs/components/TrailingHackView.js

@@ -73,11 +73,10 @@ function TrailingHackView(param) {
     (0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
         if (!ref.current) return;
         if (!viewDescRef.current) {
-            viewDescRef.current = new _viewdesc.TrailingHackViewDesc(parentRef.current, [], ()=>getPos.current(), ref.current, null);
+            viewDescRef.current = new _viewdesc.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/cjs/components/WidgetView.js

@@ -57,7 +57,6 @@ function WidgetView(param) {
     let { widget, getPos } = param;
     const { siblingsRef, parentRef } = (0, _react.useContext)(_ChildDescriptorsContext.ChildDescriptorsContext);
     const viewDescRef = (0, _react.useRef)(null);
-    const getPosFunc = (0, _react.useRef)(()=>getPos.current()).current;
     const domRef = (0, _react.useRef)(null);
     (0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
         const siblings = siblingsRef.current;
@@ -74,11 +73,10 @@ function WidgetView(param) {
     (0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
         if (!domRef.current) return;
         if (!viewDescRef.current) {
-            viewDescRef.current = new _viewdesc.WidgetViewDesc(parentRef.current, ()=>getPos.current(), widget, domRef.current);
+            viewDescRef.current = new _viewdesc.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)) {
@@ -90,7 +88,7 @@ function WidgetView(param) {
     return Component && /*#__PURE__*/ _react.default.createElement(Component, {
         ref: domRef,
         widget: widget,
-        getPos: getPosFunc,
+        getPos: getPos,
         contentEditable: false
     });
 }

package/dist/cjs/constants.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    EMPTY_SCHEMA: function() {
+        return EMPTY_SCHEMA;
+    },
+    EMPTY_STATE: function() {
+        return EMPTY_STATE;
+    }
+});
+const _prosemirrormodel = require("prosemirror-model");
+const _prosemirrorstate = require("prosemirror-state");
+const EMPTY_SCHEMA = new _prosemirrormodel.Schema({
+    nodes: {
+        doc: {
+            content: "text*"
+        },
+        text: {
+            inline: true
+        }
+    }
+});
+const EMPTY_STATE = _prosemirrorstate.EditorState.create({
+    schema: EMPTY_SCHEMA
+});

package/dist/cjs/hooks/useEditor.js

@@ -2,196 +2,21 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    ReactEditorView: function() {
-        return ReactEditorView;
-    },
-    useEditor: function() {
+Object.defineProperty(exports, "useEditor", {
+    enumerable: true,
+    get: function() {
         return useEditor;
     }
 });
-const _prosemirrormodel = require("prosemirror-model");
-const _prosemirrorstate = require("prosemirror-state");
-const _prosemirrorview = require("prosemirror-view");
 const _react = require("react");
 const _reactdom = require("react-dom");
+const _ReactEditorView = require("../ReactEditorView.js");
+const _StaticEditorView = require("../StaticEditorView.js");
+const _constants = require("../constants.js");
 const _beforeInputPlugin = require("../plugins/beforeInputPlugin.js");
-const _SelectionDOMObserver = require("../selection/SelectionDOMObserver.js");
-const _ssr = require("../ssr.js");
-const _viewdesc = require("../viewdesc.js");
 const _useClientLayoutEffect = require("./useClientLayoutEffect.js");
 const _useComponentEventListeners = require("./useComponentEventListeners.js");
 const _useForceUpdate = require("./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);
-}
-let ReactEditorView = class ReactEditorView extends _prosemirrorview.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 = (0, _ssr.setSsrStubs)();
-        super(place, {
-            state: _prosemirrorstate.EditorState.create({
-                schema: props.state.schema,
-                plugins: props.state.plugins
-            }),
-            plugins: props.plugins
-        });
-        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.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 _prosemirrormodel.Schema({
-    nodes: {
-        doc: {
-            content: "text*"
-        },
-        text: {
-            inline: true
-        }
-    }
-});
-const EMPTY_STATE = _prosemirrorstate.EditorState.create({
-    schema: EMPTY_SCHEMA
-});
 let didWarnValueDefaultValue = false;
 function useEditor(mount, options) {
     if (process.env.NODE_ENV !== "production") {
@@ -203,7 +28,7 @@ function useEditor(mount, options) {
     const flushSyncRef = (0, _react.useRef)(true);
     const [cursorWrapper, _setCursorWrapper] = (0, _react.useState)(null);
     const forceUpdate = (0, _useForceUpdate.useForceUpdate)();
-    const defaultState = options.defaultState ?? EMPTY_STATE;
+    const defaultState = options.defaultState ?? _constants.EMPTY_STATE;
     const [_state, setState] = (0, _react.useState)(defaultState);
     const state = options.state ?? _state;
     const { componentEventListenersPlugin, registerEventListener, unregisterEventListener } = (0, _useComponentEventListeners.useComponentEventListeners)();
@@ -243,30 +68,18 @@ function useEditor(mount, options) {
         options.dispatchTransaction,
         options.state
     ]);
-    const cleanup = (0, _ssr.setSsrStubs)();
-    const tempDom = document.createElement("div");
-    cleanup();
-    const docViewDescRef = (0, _react.useRef)(new _viewdesc.NodeViewDesc(undefined, [], ()=>-1, state.doc, [], _prosemirrorview.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] = (0, _react.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] = (0, _react.useState)(()=>{
+        return new _StaticEditorView.StaticEditorView(directEditorProps);
+    });
     (0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
         return ()=>{
-            view?.destroy();
+            view.destroy();
         };
     }, [
         view
@@ -276,44 +89,33 @@ function useEditor(mount, options) {
     // so this is not a concern.
     // eslint-disable-next-line react-hooks/exhaustive-deps
     (0, _useClientLayoutEffect.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.ReactEditorView({
+                    mount
+                }, directEditorProps);
+                view.dom.addEventListener("compositionend", forceUpdate);
+                setView(view);
+            } else {
+                const view = new _StaticEditorView.StaticEditorView(directEditorProps);
+                setView(view);
+            }
+        } else if (view instanceof _ReactEditorView.ReactEditorView) {
+            view.commitPendingEffects();
         }
-        // @ts-expect-error Internal property - domObserver
-        view?.domObserver.selectionToDOM();
-        view?.runPendingEffects();
     });
-    view?.pureSetProps(directEditorProps);
+    view.update(directEditorProps);
     const editor = (0, _react.useMemo)(()=>({
-            view: view,
-            registerEventListener,
-            unregisterEventListener,
+            view,
             cursorWrapper,
-            docViewDescRef,
-            flushSyncRef
+            flushSyncRef,
+            registerEventListener,
+            unregisterEventListener
         }), [
-        view,
+        cursorWrapper,
         registerEventListener,
         unregisterEventListener,
-        cursorWrapper
+        view
     ]);
     return {
         editor,

package/dist/cjs/hooks/useEditorEffect.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "useEditorEffect", {
     }
 });
 const _react = require("react");
+const _ReactEditorView = require("../ReactEditorView.js");
 const _EditorContext = require("../contexts/EditorContext.js");
 const _useLayoutGroupEffect = require("./useLayoutGroupEffect.js");
 function useEditorEffect(effect, dependencies) {
@@ -21,8 +22,7 @@ function useEditorEffect(effect, dependencies) {
     // every time it changes, because it will most likely
     // be defined inline and run on every re-render.
     (0, _useLayoutGroupEffect.useLayoutGroupEffect)(()=>{
-        // @ts-expect-error We're making use of knowledge of internal attributes here
-        if (view?.docView && view.ready) {
+        if (view instanceof _ReactEditorView.ReactEditorView) {
             flushSyncRef.current = false;
             const result = effect(view);
             flushSyncRef.current = true;

package/dist/cjs/hooks/useEditorEventCallback.js

@@ -9,8 +9,15 @@ Object.defineProperty(exports, "useEditorEventCallback", {
     }
 });
 const _react = require("react");
+const _ReactEditorView = require("../ReactEditorView.js");
 const _EditorContext = require("../contexts/EditorContext.js");
 const _useEditorEffect = require("./useEditorEffect.js");
+function assertIsReactEditorView(view) {
+    if (view instanceof _ReactEditorView.ReactEditorView) {
+        return;
+    }
+    throw new DOMException("ProseMirror document is not mounted", "InvalidStateError");
+}
 function useEditorEventCallback(callback) {
     const ref = (0, _react.useRef)(callback);
     const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
@@ -23,11 +30,7 @@ function useEditorEventCallback(callback) {
         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/cjs/hooks/useNodeViewDescriptor.js

@@ -13,10 +13,10 @@ const _ChildDescriptorsContext = require("../contexts/ChildDescriptorsContext.js
 const _EditorContext = require("../contexts/EditorContext.js");
 const _viewdesc = require("../viewdesc.js");
 const _useClientLayoutEffect = require("./useClientLayoutEffect.js");
-function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDecorations, outerDecorations, viewDesc, contentDOMRef) {
+function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDecorations, outerDecorations, contentDOMRef) {
     const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
     const [hasContentDOM, setHasContentDOM] = (0, _react.useState)(true);
-    const nodeViewDescRef = (0, _react.useRef)(viewDesc);
+    const nodeViewDescRef = (0, _react.useRef)();
     const stopEvent = (0, _react.useRef)(()=>false);
     const setStopEvent = (0, _react.useCallback)((newStopEvent)=>{
         stopEvent.current = newStopEvent;
@@ -26,12 +26,12 @@ function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDecoration
         ignoreMutation.current = newIgnoreMutation;
     }, []);
     const selectNode = (0, _react.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 = (0, _react.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");
@@ -57,15 +57,14 @@ function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDecoration
     ]);
     // eslint-disable-next-line react-hooks/exhaustive-deps
     (0, _useClientLayoutEffect.useClientLayoutEffect)(()=>{
-        if (!node || !nodeDomRef.current) return;
+        if (!nodeDomRef.current) return;
         const firstChildDesc = childDescriptors.current[0];
         if (!nodeViewDescRef.current) {
-            nodeViewDescRef.current = new _viewdesc.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 _viewdesc.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;
@@ -98,12 +97,13 @@ function useNodeViewDescriptor(node, getPos, domRef, nodeDomRef, innerDecoration
                 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 _viewdesc.CompositionViewDesc && !view?.composing) {
+            if (nodeViewDescRef.current?.children[0] instanceof _viewdesc.CompositionViewDesc && !view.composing) {
                 nodeViewDescRef.current?.children[0].dom.parentNode?.removeChild(nodeViewDescRef.current?.children[0].dom);
             }
         };

package/dist/cjs/hooks/useReactKeys.js

@@ -13,5 +13,5 @@ const _EditorContext = require("../contexts/EditorContext.js");
 const _reactKeys = require("../plugins/reactKeys.js");
 function useReactKeys() {
     const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
-    return view && _reactKeys.reactKeysPluginKey.getState(view.state);
+    return _reactKeys.reactKeysPluginKey.getState(view.state);
 }

package/dist/cjs/testing/editorViewTestHelpers.js

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