@handlewithcare/react-prosemirror 2.4.12 → 2.5.1

package/dist/esm/viewdesc.js

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */ /* eslint-disable @typescript-eslint/no-non-null-assertion */ import { Fragment } from "prosemirror-model";
 import { browser } from "./browser.js";
-import { domIndex, isEquivalentPosition } from "./selection/selectionToDOM.js";
+import { domIndex, isEquivalentPosition } from "./dom.js";
 // View descriptions are data structures that describe the DOM that is
 // used to represent the editor's content. They are used for:
 //
@@ -82,7 +82,9 @@ export class ViewDesc {
         return 0;
     }
     destroy() {
-    // pass
+        this.parent = undefined;
+        if (this.dom.pmViewDesc == this) this.dom.pmViewDesc = undefined;
+        for(let i = 0; i < this.children.length; i++)this.children[i].destroy();
     }
     posBeforeChild(child) {
         for(let i = 0, pos = this.posAtStart;; i++){
@@ -332,7 +334,6 @@ export class ViewDesc {
         let anchorDOM = this.domFromPos(anchor, anchor ? -1 : 1);
         let headDOM = head == anchor ? anchorDOM : this.domFromPos(head, head ? -1 : 1);
         const domSel = view.root.getSelection();
-        // @ts-expect-error - Internal method domSelectionRange
         const selRange = view.domSelectionRange();
         let brKludge = false;
         // On Firefox, using Selection.collapse to put the cursor after a
@@ -542,15 +543,8 @@ export class NodeViewDesc extends ViewDesc {
     outerDeco;
     innerDeco;
     nodeDOM;
-    stopEvent;
-    selectNode;
-    deselectNode;
-    ignoreMutation;
-    constructor(parent, children, getPos, node, outerDeco, innerDeco, dom, contentDOM, nodeDOM, stopEvent, selectNode, deselectNode, ignoreMutation){
-        super(parent, children, getPos, dom, contentDOM), this.node = node, this.outerDeco = outerDeco, this.innerDeco = innerDeco, this.nodeDOM = nodeDOM, this.stopEvent = stopEvent, this.selectNode = selectNode, this.deselectNode = deselectNode, this.ignoreMutation = ignoreMutation;
-    }
-    updateOuterDeco() {
-    // pass
+    constructor(parent, children, getPos, node, outerDeco, innerDeco, dom, contentDOM, nodeDOM){
+        super(parent, children, getPos, dom, contentDOM), this.node = node, this.outerDeco = outerDeco, this.innerDeco = innerDeco, this.nodeDOM = nodeDOM;
     }
     parseRule() {
         // Experimental kludge to allow opt-in re-parsing of nodes
@@ -594,22 +588,46 @@ export class NodeViewDesc extends ViewDesc {
     get border() {
         return this.node.isLeaf ? 0 : 1;
     }
+    updateChildren(_view, _pos) {
+    // Omitted to avoid reproducing lots of unused code.
+    // Overidden elsewhere in case this is ever vendored.
+    }
     // If this desc must be updated to match the given node decoration,
     // do so and return true.
-    update(_node, _outerDeco, _innerDeco, _view) {
+    update(node, outerDeco, innerDeco, view) {
+        if (this.dirty == NODE_DIRTY || !node.sameMarkup(this.node)) return false;
+        this.updateInner(node, outerDeco, innerDeco, view);
         return true;
     }
+    updateInner(node, outerDeco, innerDeco, view) {
+        this.updateOuterDeco(outerDeco);
+        this.node = node;
+        this.innerDeco = innerDeco;
+        if (this.contentDOM) this.updateChildren(view, this.posAtStart);
+        this.dirty = NOT_DIRTY;
+    }
+    updateOuterDeco(outerDeco) {
+        this.outerDeco = outerDeco;
+    }
+    // Mark this node as being the selected node.
+    selectNode() {
+        if (this.nodeDOM.nodeType == 1) this.nodeDOM.classList.add("ProseMirror-selectednode");
+        if (this.contentDOM || !this.node.type.spec.draggable) this.dom.draggable = true;
+    }
+    // Remove selected node marking from this node.
+    deselectNode() {
+        if (this.nodeDOM.nodeType == 1) {
+            this.nodeDOM.classList.remove("ProseMirror-selectednode");
+            if (this.contentDOM || !this.node.type.spec.draggable) this.dom.removeAttribute("draggable");
+        }
+    }
     get domAtom() {
         return this.node.isAtom;
     }
 }
 export class TextViewDesc extends NodeViewDesc {
     constructor(parent, children, getPos, node, outerDeco, innerDeco, dom, nodeDOM){
-        super(parent, children, getPos, node, outerDeco, innerDeco, dom, null, nodeDOM, ()=>false, ()=>{
-        /* Text nodes can't have node selections */ }, ()=>{
-        /* Text nodes can't have node selections */ }, (mutation)=>{
-            return mutation.type != "characterData" && mutation.type != "selection";
-        });
+        super(parent, children, getPos, node, outerDeco, innerDeco, dom, null, nodeDOM);
     }
     parseRule() {
         let skip = this.nodeDOM.parentNode;
@@ -619,6 +637,7 @@ export class TextViewDesc extends NodeViewDesc {
         };
     }
     update(_node, _outerDeco, _innerDeco, _view) {
+        this.dirty = NOT_DIRTY;
         return true;
     }
     inParent() {
@@ -662,6 +681,63 @@ export class TrailingHackViewDesc extends ViewDesc {
         return this.dom.nodeName == "IMG";
     }
 }
+// A separate subclass is used for customized node views, so that the
+// extra checks only have to be made for nodes that are actually
+// customized.
+let CustomNodeViewDesc = class CustomNodeViewDesc extends NodeViewDesc {
+    spec;
+    constructor(parent, children, getPos, node, outerDeco, innerDeco, dom, contentDOM, nodeDOM, spec){
+        super(parent, children, getPos, node, outerDeco, innerDeco, dom, contentDOM, nodeDOM), this.spec = spec;
+    }
+    // A custom `update` method gets to decide whether the update goes
+    // through. If it does, and there's a `contentDOM` node, our logic
+    // updates the children.
+    update(node, outerDeco, innerDeco, view) {
+        if (this.dirty == NODE_DIRTY) return false;
+        if (this.spec.update && (this.node.type == node.type || this.spec.multiType)) {
+            const result = this.spec.update(node, outerDeco, innerDeco);
+            if (result) this.updateInner(node, outerDeco, innerDeco, view);
+            return result;
+        } else if (!this.contentDOM && !node.isLeaf) {
+            return false;
+        } else {
+            return super.update(node, outerDeco, innerDeco, view);
+        }
+    }
+    selectNode() {
+        this.spec.selectNode ? this.spec.selectNode() : super.selectNode();
+    }
+    deselectNode() {
+        this.spec.deselectNode ? this.spec.deselectNode() : super.deselectNode();
+    }
+    setSelection(anchor, head, view, force) {
+        this.spec.setSelection ? this.spec.setSelection(anchor, head, view.root) : super.setSelection(anchor, head, view, force);
+    }
+    destroy() {
+        if (this.spec.destroy) this.spec.destroy();
+        super.destroy();
+    }
+    stopEvent(event) {
+        return this.spec.stopEvent ? this.spec.stopEvent(event) : false;
+    }
+    ignoreMutation(mutation) {
+        return this.spec.ignoreMutation ? this.spec.ignoreMutation(mutation) : super.ignoreMutation(mutation);
+    }
+};
+export class ReactNodeViewDesc extends CustomNodeViewDesc {
+    updateChildren(_view, _pos) {
+    // React has already updated the children.
+    }
+    updateOuterDeco(outerDeco) {
+        // React has already updated the decorations.
+        this.outerDeco = outerDeco;
+    }
+    destroy() {
+        // React has already destroyed the children (if needed).
+        this.children = [];
+        super.destroy();
+    }
+}
 function sameOuterDeco(a, b) {
     if (a.length != b.length) return false;
     // @ts-expect-error ...