@handlewithcare/react-prosemirror 2.8.0 → 2.8.2

package/dist/cjs/commands/reorderSiblings.js

@@ -1,57 +1,72 @@
-"use strict";
+/* eslint-disable @typescript-eslint/no-non-null-assertion */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "reorderSiblings", {
-    enumerable: true,
-    get: function() {
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    reorderSiblings: function() {
         return reorderSiblings;
+    },
+    reorderSiblingsOnTransaction: function() {
+        return reorderSiblingsOnTransaction;
     }
 });
 const _reactKeys = require("../plugins/reactKeys.js");
 function reorderSiblings(pos, order) {
     return function reorderSiblingsCommand(state, dispatch) {
-        const $pos = state.doc.resolve(pos);
-        if ($pos.start() !== pos) {
-            return false;
-        }
-        if (!dispatch) return true;
-        const nodes = $pos.parent.children;
-        const reordered = nodes.map((node, i)=>[
-                node,
-                i
-            ]).sort((param, param1)=>{
-            let [, a] = param, [, b] = param1;
-            return order[a] - order[b];
-        }).map((param)=>{
-            let [node] = param;
-            return node;
-        });
         const tr = state.tr;
-        tr.replaceWith(pos, $pos.parent.content.size + pos, reordered);
-        const meta = {
-            overrides: {}
-        };
-        const oldPositions = [];
-        let start = pos;
-        for (const node of nodes){
-            oldPositions.push(start);
-            start += node.nodeSize;
-        }
-        start = pos;
-        const newPositions = [];
-        for(let i = 0; i < reordered.length; i++){
-            const node = reordered[i];
-            newPositions[order[i]] = start;
-            start += node.nodeSize;
-        }
-        for(let i = 0; i < oldPositions.length; i++){
-            const oldPosition = oldPositions[i];
-            const newPosition = newPositions[i];
-            meta.overrides[oldPosition] = newPosition;
-        }
-        tr.setMeta(_reactKeys.reactKeysPluginKey, meta);
-        dispatch(tr);
-        return true;
+        return reorderSiblingsOnTransaction(pos, order, tr, state, dispatch);
+    };
+}
+function reorderSiblingsOnTransaction(pos, order, tr, state, dispatch) {
+    const orderLookup = order.reduce((acc, oldIndex, newIndex)=>{
+        acc[oldIndex] = newIndex;
+        return acc;
+    }, []);
+    const $pos = state.doc.resolve(pos);
+    if ($pos.start() !== pos) {
+        return false;
+    }
+    if (!dispatch) return true;
+    const nodes = $pos.parent.children;
+    const reordered = nodes.map((node, i)=>[
+            node,
+            i
+        ]).sort((param, param1)=>{
+        let [, a] = param, [, b] = param1;
+        return orderLookup[a] - orderLookup[b];
+    }).map((param)=>{
+        let [node] = param;
+        return node;
+    });
+    tr.replaceWith(pos, $pos.parent.content.size + pos, reordered);
+    const meta = {
+        overrides: {}
     };
+    const oldPositions = [];
+    let start = pos;
+    for (const node of nodes){
+        oldPositions.push(start);
+        start += node.nodeSize;
+    }
+    start = pos;
+    const newPositions = [];
+    for(let i = 0; i < reordered.length; i++){
+        const node = reordered[i];
+        newPositions[order[i]] = start;
+        start += node.nodeSize;
+    }
+    for(let i = 0; i < oldPositions.length; i++){
+        const oldPosition = oldPositions[i];
+        const newPosition = newPositions[i];
+        meta.overrides[oldPosition] = newPosition;
+    }
+    tr.setMeta(_reactKeys.reactKeysPluginKey, meta);
+    dispatch(tr);
+    return true;
 }

package/dist/cjs/components/nodes/CustomNodeView.js

@@ -114,7 +114,7 @@ const CustomNodeView = /*#__PURE__*/ (0, _react.memo)(function CustomNodeView(pa
             stopEvent: nodeView.stopEvent?.bind(nodeView),
             ignoreMutation: nodeView.ignoreMutation?.bind(nodeView)
         };
-    }, nodeProps);
+    }, (source)=>source?.contentDOM ?? null, nodeProps);
     const Component = node.isInline ? "span" : "div";
     const props = {
         ref: innerRef

package/dist/cjs/components/nodes/DocNodeView.js

@@ -78,7 +78,7 @@ const DocNodeView = /*#__PURE__*/ (0, _react.memo)(/*#__PURE__*/ (0, _react.forw
                 return true;
             }
         };
-    }, nodeProps);
+    }, ()=>innerRef.current, nodeProps);
     const children = /*#__PURE__*/ _react.default.createElement(_ChildDescriptorsContext.ChildDescriptorsContext.Provider, {
         value: childContextValue
     }, /*#__PURE__*/ _react.default.createElement(_ChildNodeViews.ChildNodeViews, {

package/dist/cjs/components/nodes/ReactNodeView.js

@@ -10,6 +10,7 @@ Object.defineProperty(exports, "ReactNodeView", {
 });
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _ChildDescriptorsContext = require("../../contexts/ChildDescriptorsContext.js");
+const _EditorContext = require("../../contexts/EditorContext.js");
 const _IgnoreMutationContext = require("../../contexts/IgnoreMutationContext.js");
 const _SelectNodeContext = require("../../contexts/SelectNodeContext.js");
 const _StopEventContext = require("../../contexts/StopEventContext.js");
@@ -58,6 +59,7 @@ function _interop_require_wildcard(obj, nodeInterop) {
 }
 const ReactNodeView = /*#__PURE__*/ (0, _react.memo)(function ReactNodeView(param) {
     let { component: Component, outerDeco, getPos, node, innerDeco } = param;
+    const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
     const [hasCustomSelectNode, setHasCustomSelectNode] = (0, _react.useState)(false);
     const [selected, setSelected] = (0, _react.useState)(false);
     const ref = (0, _react.useRef)(null);
@@ -139,7 +141,7 @@ const ReactNodeView = /*#__PURE__*/ (0, _react.memo)(function ReactNodeView(para
                 return false;
             }
         };
-    }, nodeProps);
+    }, (source, children)=>view.composing ? source?.contentDOM ?? null : children[0]?.dom.parentElement ?? null, nodeProps);
     const props = {
         nodeProps,
         ...!contentDOM && !nodeProps.node.isText && nodeDOM?.nodeName !== "BR" ? {

package/dist/cjs/hooks/useMarkViewDescription.js

@@ -41,7 +41,7 @@ function useMarkViewDescription(ref, constructor, props) {
         const parent = parentRef.current;
         const children = childrenRef.current;
         const contentDOM = findContentDOM(markView, children, ref.current);
-        const viewDesc = new _viewdesc.MarkViewDesc(parent, children, getPos, mark, dom, contentDOM, markView);
+        const viewDesc = new _viewdesc.ReactMarkViewDesc(parent, children, getPos, mark, dom, contentDOM, markView);
         setDOM(dom);
         setContentDOM(contentDOM);
         return viewDesc;

package/dist/cjs/hooks/useNodeViewDescriptor.js

@@ -15,10 +15,7 @@ const _EditorContext = require("../contexts/EditorContext.js");
 const _viewdesc = require("../viewdesc.js");
 const _useClientLayoutEffect = require("./useClientLayoutEffect.js");
 const _useEffectEvent = require("./useEffectEvent.js");
-function findContentDOM(source, children) {
-    return source?.contentDOM ?? children[0]?.dom?.parentElement ?? null;
-}
-function useNodeViewDescriptor(ref, constructor, props) {
+function useNodeViewDescriptor(ref, constructor, findContentDOM, props) {
     const { view } = (0, _react.useContext)(_EditorContext.EditorContext);
     const { parentRef, siblingsRef } = (0, _react.useContext)(_ChildDescriptorsContext.ChildDescriptorsContext);
     const [dom, setDOM] = (0, _react.useState)(null);

package/dist/cjs/viewdesc.js

@@ -18,6 +18,9 @@ _export(exports, {
     NodeViewDesc: function() {
         return NodeViewDesc;
     },
+    ReactMarkViewDesc: function() {
+        return ReactMarkViewDesc;
+    },
     ReactNodeViewDesc: function() {
         return ReactNodeViewDesc;
     },
@@ -743,6 +746,13 @@ let CustomNodeViewDesc = class CustomNodeViewDesc extends NodeViewDesc {
         return this.spec.ignoreMutation ? this.spec.ignoreMutation(mutation) : super.ignoreMutation(mutation);
     }
 };
+let ReactMarkViewDesc = class ReactMarkViewDesc extends MarkViewDesc {
+    destroy() {
+        // React has already destroyed the children (if needed).
+        this.children = [];
+        super.destroy();
+    }
+};
 let ReactNodeViewDesc = class ReactNodeViewDesc extends CustomNodeViewDesc {
     updateChildren(_view, _pos) {
     // React has already updated the children.

package/dist/esm/commands/reorderSiblings.js

@@ -1,4 +1,4 @@
-import { reactKeysPluginKey } from "../plugins/reactKeys.js";
+/* eslint-disable @typescript-eslint/no-non-null-assertion */ import { reactKeysPluginKey } from "../plugins/reactKeys.js";
 /**
  * Create a command function that reorders the adjacent nodes starting
  * at the provided position.
@@ -10,47 +10,54 @@ import { reactKeysPluginKey } from "../plugins/reactKeys.js";
  *                and keep the other two in relative order, set `order` to `[1, 2, 0]`.
  */ export function reorderSiblings(pos, order) {
     return function reorderSiblingsCommand(state, dispatch) {
-        const $pos = state.doc.resolve(pos);
-        if ($pos.start() !== pos) {
-            return false;
-        }
-        if (!dispatch) return true;
-        const nodes = $pos.parent.children;
-        const reordered = nodes.map((node, i)=>[
-                node,
-                i
-            ]).sort((param, param1)=>{
-            let [, a] = param, [, b] = param1;
-            return order[a] - order[b];
-        }).map((param)=>{
-            let [node] = param;
-            return node;
-        });
         const tr = state.tr;
-        tr.replaceWith(pos, $pos.parent.content.size + pos, reordered);
-        const meta = {
-            overrides: {}
-        };
-        const oldPositions = [];
-        let start = pos;
-        for (const node of nodes){
-            oldPositions.push(start);
-            start += node.nodeSize;
-        }
-        start = pos;
-        const newPositions = [];
-        for(let i = 0; i < reordered.length; i++){
-            const node = reordered[i];
-            newPositions[order[i]] = start;
-            start += node.nodeSize;
-        }
-        for(let i = 0; i < oldPositions.length; i++){
-            const oldPosition = oldPositions[i];
-            const newPosition = newPositions[i];
-            meta.overrides[oldPosition] = newPosition;
-        }
-        tr.setMeta(reactKeysPluginKey, meta);
-        dispatch(tr);
-        return true;
+        return reorderSiblingsOnTransaction(pos, order, tr, state, dispatch);
     };
 }
+export function reorderSiblingsOnTransaction(pos, order, tr, state, dispatch) {
+    const orderLookup = order.reduce((acc, oldIndex, newIndex)=>{
+        acc[oldIndex] = newIndex;
+        return acc;
+    }, []);
+    const $pos = state.doc.resolve(pos);
+    if ($pos.start() !== pos) {
+        return false;
+    }
+    if (!dispatch) return true;
+    const nodes = $pos.parent.children;
+    const reordered = nodes.map((node, i)=>[
+            node,
+            i
+        ]).sort((param, param1)=>{
+        let [, a] = param, [, b] = param1;
+        return orderLookup[a] - orderLookup[b];
+    }).map((param)=>{
+        let [node] = param;
+        return node;
+    });
+    tr.replaceWith(pos, $pos.parent.content.size + pos, reordered);
+    const meta = {
+        overrides: {}
+    };
+    const oldPositions = [];
+    let start = pos;
+    for (const node of nodes){
+        oldPositions.push(start);
+        start += node.nodeSize;
+    }
+    start = pos;
+    const newPositions = [];
+    for(let i = 0; i < reordered.length; i++){
+        const node = reordered[i];
+        newPositions[order[i]] = start;
+        start += node.nodeSize;
+    }
+    for(let i = 0; i < oldPositions.length; i++){
+        const oldPosition = oldPositions[i];
+        const newPosition = newPositions[i];
+        meta.overrides[oldPosition] = newPosition;
+    }
+    tr.setMeta(reactKeysPluginKey, meta);
+    dispatch(tr);
+    return true;
+}

package/dist/esm/components/nodes/CustomNodeView.js

@@ -63,7 +63,7 @@ export const CustomNodeView = /*#__PURE__*/ memo(function CustomNodeView(param)
             stopEvent: nodeView.stopEvent?.bind(nodeView),
             ignoreMutation: nodeView.ignoreMutation?.bind(nodeView)
         };
-    }, nodeProps);
+    }, (source)=>source?.contentDOM ?? null, nodeProps);
     const Component = node.isInline ? "span" : "div";
     const props = {
         ref: innerRef

package/dist/esm/components/nodes/DocNodeView.js

@@ -27,7 +27,7 @@ export const DocNodeView = /*#__PURE__*/ memo(/*#__PURE__*/ forwardRef(function
                 return true;
             }
         };
-    }, nodeProps);
+    }, ()=>innerRef.current, nodeProps);
     const children = /*#__PURE__*/ React.createElement(ChildDescriptorsContext.Provider, {
         value: childContextValue
     }, /*#__PURE__*/ React.createElement(ChildNodeViews, {

package/dist/esm/components/nodes/ReactNodeView.js

@@ -1,5 +1,6 @@
-import React, { cloneElement, memo, useCallback, useMemo, useRef, useState } from "react";
+import React, { cloneElement, memo, useCallback, useContext, useMemo, useRef, useState } from "react";
 import { ChildDescriptorsContext } from "../../contexts/ChildDescriptorsContext.js";
+import { EditorContext } from "../../contexts/EditorContext.js";
 import { IgnoreMutationContext } from "../../contexts/IgnoreMutationContext.js";
 import { SelectNodeContext } from "../../contexts/SelectNodeContext.js";
 import { StopEventContext } from "../../contexts/StopEventContext.js";
@@ -7,6 +8,7 @@ import { useNodeViewDescriptor } from "../../hooks/useNodeViewDescriptor.js";
 import { ChildNodeViews, wrapInDeco } from "../ChildNodeViews.js";
 export const ReactNodeView = /*#__PURE__*/ memo(function ReactNodeView(param) {
     let { component: Component, outerDeco, getPos, node, innerDeco } = param;
+    const { view } = useContext(EditorContext);
     const [hasCustomSelectNode, setHasCustomSelectNode] = useState(false);
     const [selected, setSelected] = useState(false);
     const ref = useRef(null);
@@ -88,7 +90,7 @@ export const ReactNodeView = /*#__PURE__*/ memo(function ReactNodeView(param) {
                 return false;
             }
         };
-    }, nodeProps);
+    }, (source, children)=>view.composing ? source?.contentDOM ?? null : children[0]?.dom.parentElement ?? null, nodeProps);
     const props = {
         nodeProps,
         ...!contentDOM && !nodeProps.node.isText && nodeDOM?.nodeName !== "BR" ? {

package/dist/esm/hooks/useMarkViewDescription.js

@@ -2,7 +2,7 @@ import { useContext, useMemo, useRef, useState } from "react";
 import { ReactEditorView } from "../ReactEditorView.js";
 import { ChildDescriptorsContext } from "../contexts/ChildDescriptorsContext.js";
 import { EditorContext } from "../contexts/EditorContext.js";
-import { MarkViewDesc, sortViewDescs } from "../viewdesc.js";
+import { ReactMarkViewDesc, sortViewDescs } from "../viewdesc.js";
 import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
 import { useEffectEvent } from "./useEffectEvent.js";
 function findContentDOM(source, children, dom) {
@@ -31,7 +31,7 @@ export function useMarkViewDescription(ref, constructor, props) {
         const parent = parentRef.current;
         const children = childrenRef.current;
         const contentDOM = findContentDOM(markView, children, ref.current);
-        const viewDesc = new MarkViewDesc(parent, children, getPos, mark, dom, contentDOM, markView);
+        const viewDesc = new ReactMarkViewDesc(parent, children, getPos, mark, dom, contentDOM, markView);
         setDOM(dom);
         setContentDOM(contentDOM);
         return viewDesc;

package/dist/esm/hooks/useNodeViewDescriptor.js

@@ -5,10 +5,7 @@ import { EditorContext } from "../contexts/EditorContext.js";
 import { CompositionViewDesc, ReactNodeViewDesc, sortViewDescs } from "../viewdesc.js";
 import { useClientLayoutEffect } from "./useClientLayoutEffect.js";
 import { useEffectEvent } from "./useEffectEvent.js";
-function findContentDOM(source, children) {
-    return source?.contentDOM ?? children[0]?.dom?.parentElement ?? null;
-}
-export function useNodeViewDescriptor(ref, constructor, props) {
+export function useNodeViewDescriptor(ref, constructor, findContentDOM, props) {
     const { view } = useContext(EditorContext);
     const { parentRef, siblingsRef } = useContext(ChildDescriptorsContext);
     const [dom, setDOM] = useState(null);

package/dist/esm/viewdesc.js

@@ -730,6 +730,13 @@ let CustomNodeViewDesc = class CustomNodeViewDesc extends NodeViewDesc {
         return this.spec.ignoreMutation ? this.spec.ignoreMutation(mutation) : super.ignoreMutation(mutation);
     }
 };
+export class ReactMarkViewDesc extends MarkViewDesc {
+    destroy() {
+        // React has already destroyed the children (if needed).
+        this.children = [];
+        super.destroy();
+    }
+}
 export class ReactNodeViewDesc extends CustomNodeViewDesc {
     updateChildren(_view, _pos) {
     // React has already updated the children.