@handlewithcare/react-prosemirror 2.0.0

package/dist/esm/selection/hasFocusAndSelection.js

@@ -0,0 +1,17 @@
+export function hasFocusAndSelection(view) {
+    if (view.editable && !view.hasFocus()) return false;
+    return hasSelection(view);
+}
+export function hasSelection(view) {
+    // @ts-expect-error Internal method
+    const sel = view.domSelectionRange();
+    if (!sel.anchorNode) return false;
+    try {
+        // Firefox will raise 'permission denied' errors when accessing
+        // properties of `sel.anchorNode` when it's in a generated CSS
+        // element.
+        return view.dom.contains(sel.anchorNode.nodeType == 3 ? sel.anchorNode.parentNode : sel.anchorNode) && (view.editable || view.dom.contains(sel.focusNode?.nodeType == 3 ? sel.focusNode?.parentNode : sel.focusNode));
+    } catch (_) {
+        return false;
+    }
+}

package/dist/esm/selection/selectionFromDOM.js

@@ -0,0 +1,59 @@
+import { NodeSelection, TextSelection } from "prosemirror-state";
+import { isOnEdge, selectionCollapsed } from "../dom.js";
+export function selectionBetween(view, $anchor, $head, bias) {
+    return view.someProp("createSelectionBetween", (f)=>f(view, $anchor, $head)) || TextSelection.between($anchor, $head, bias);
+}
+export function selectionFromDOM(view) {
+    let origin = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : null;
+    // @ts-expect-error Internal method
+    const domSel = view.domSelectionRange(), doc = view.state.doc;
+    if (!domSel.focusNode) return null;
+    // @ts-expect-error Internal method
+    let nearestDesc = view.docView.nearestDesc(domSel.focusNode);
+    const inWidget = nearestDesc && nearestDesc.size == 0;
+    // @ts-expect-error Internal method
+    let head = view.docView.posFromDOM(domSel.focusNode, domSel.focusOffset, 1);
+    if (head < 0) return null;
+    let $head = doc.resolve(head), anchor, selection;
+    if (selectionCollapsed(domSel)) {
+        anchor = head;
+        while(nearestDesc && !nearestDesc.node)nearestDesc = nearestDesc.parent;
+        const nearestDescNode = nearestDesc.node;
+        if (nearestDesc && nearestDescNode.isAtom && NodeSelection.isSelectable(nearestDescNode) && nearestDesc.parent && !(nearestDescNode.isInline && isOnEdge(domSel.focusNode, domSel.focusOffset, nearestDesc.dom))) {
+            const pos = nearestDesc.posBefore;
+            selection = new NodeSelection(head == pos ? $head : doc.resolve(pos));
+        }
+    } else {
+        if (// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        domSel instanceof view.dom.ownerDocument.defaultView.Selection && domSel.rangeCount > 1) {
+            let min = head, max = head;
+            for(let i = 0; i < domSel.rangeCount; i++){
+                const range = domSel.getRangeAt(i);
+                min = Math.min(min, // @ts-expect-error Internal method
+                view.docView.posFromDOM(range.startContainer, range.startOffset, 1));
+                max = Math.max(max, // @ts-expect-error Internal method
+                view.docView.posFromDOM(range.endContainer, range.endOffset, -1));
+            }
+            if (min < 0) return null;
+            [anchor, head] = max == view.state.selection.anchor ? [
+                max,
+                min
+            ] : [
+                min,
+                max
+            ];
+            $head = doc.resolve(head);
+        } else {
+            // @ts-expect-error Internal method
+            anchor = view.docView.posFromDOM(// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            domSel.anchorNode, domSel.anchorOffset, 1);
+        }
+        if (anchor < 0) return null;
+    }
+    const $anchor = doc.resolve(anchor);
+    if (!selection) {
+        const bias = origin == "pointer" || view.state.selection.head < $head.pos && !inWidget ? 1 : -1;
+        selection = selectionBetween(view, $anchor, $head, bias);
+    }
+    return selection;
+}

package/dist/esm/selection/selectionToDOM.js

@@ -0,0 +1,196 @@
+import { NodeSelection, TextSelection } from "prosemirror-state";
+import { browser } from "../browser.js";
+// Scans forward and backward through DOM positions equivalent to the
+// given one to see if the two are in the same place (i.e. after a
+// text node vs at the end of that text node)
+export const isEquivalentPosition = function(node, off, targetNode, targetOff) {
+    return targetNode && (scanFor(node, off, targetNode, targetOff, -1) || scanFor(node, off, targetNode, targetOff, 1));
+};
+export function hasBlockDesc(dom) {
+    let desc;
+    for(let cur = dom; cur; cur = cur.parentNode)if (desc = cur.pmViewDesc) break;
+    return desc && desc.node && desc.node.isBlock && (desc.dom == dom || desc.contentDOM == dom);
+}
+const atomElements = /^(img|br|input|textarea|hr)$/i;
+function scanFor(node, off, targetNode, targetOff, dir) {
+    for(;;){
+        if (node == targetNode && off == targetOff) return true;
+        if (off == (dir < 0 ? 0 : nodeSize(node))) {
+            const parent = node.parentNode;
+            if (!parent || parent.nodeType != 1 || hasBlockDesc(node) || atomElements.test(node.nodeName) || node.contentEditable == "false") return false;
+            off = domIndex(node) + (dir < 0 ? 0 : 1);
+            node = parent;
+        } else if (node.nodeType == 1) {
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            node = node.childNodes[off + (dir < 0 ? -1 : 0)];
+            if (node.contentEditable == "false") return false;
+            off = dir < 0 ? nodeSize(node) : 0;
+        } else {
+            return false;
+        }
+    }
+}
+export const domIndex = function(node) {
+    let n = node;
+    for(let index = 0;; index++){
+        n = n.previousSibling;
+        if (!n) return index;
+    }
+};
+export function nodeSize(node) {
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    return node.nodeType == 3 ? node.nodeValue.length : node.childNodes.length;
+}
+export function syncNodeSelection(view, sel) {
+    const v = view;
+    if (sel instanceof NodeSelection) {
+        const desc = v.docView.descAt(sel.from);
+        if (desc != v.lastSelectedViewDesc) {
+            clearNodeSelection(v);
+            if (desc) desc.selectNode();
+            v.lastSelectedViewDesc = desc;
+        }
+    } else {
+        clearNodeSelection(v);
+    }
+}
+// Clear all DOM statefulness of the last node selection.
+function clearNodeSelection(view) {
+    const v = view;
+    if (v.lastSelectedViewDesc) {
+        if (v.lastSelectedViewDesc.parent) v.lastSelectedViewDesc.deselectNode();
+        v.lastSelectedViewDesc = undefined;
+    }
+}
+export function hasSelection(view) {
+    const v = view;
+    const sel = v.domSelectionRange();
+    if (!sel.anchorNode) return false;
+    try {
+        // Firefox will raise 'permission denied' errors when accessing
+        // properties of `sel.anchorNode` when it's in a generated CSS
+        // element.
+        return v.dom.contains(sel.anchorNode.nodeType == 3 ? sel.anchorNode.parentNode : sel.anchorNode) && (v.editable || v.dom.contains(// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        sel.focusNode.nodeType == 3 ? sel.focusNode.parentNode : sel.focusNode));
+    } catch (_) {
+        return false;
+    }
+}
+function editorOwnsSelection(view) {
+    return view.editable ? view.hasFocus() : hasSelection(view) && document.activeElement && document.activeElement.contains(view.dom);
+}
+function selectCursorWrapper(view) {
+    const v = view;
+    const domSel = v.domSelection(), range = document.createRange();
+    if (!domSel) return;
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    const node = v.cursorWrapper.dom, img = node.nodeName == "IMG";
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    if (img) range.setStart(node.parentNode, domIndex(node) + 1);
+    else range.setStart(node, 0);
+    range.collapse(true);
+    domSel.removeAllRanges();
+    domSel.addRange(range);
+    // Kludge to kill 'control selection' in IE11 when selecting an
+    // invisible cursor wrapper, since that would result in those weird
+    // resize handles and a selection that considers the absolutely
+    // positioned wrapper, rather than the root editable node, the
+    // focused element.
+    if (!img && !v.state.selection.visible && browser.ie && browser.ie_version <= 11) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        node.disabled = true;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        node.disabled = false;
+    }
+}
+function temporarilyEditableNear(view, pos) {
+    const v = view;
+    const { node, offset } = v.docView.domFromPos(pos, 0);
+    const after = offset < node.childNodes.length ? node.childNodes[offset] : null;
+    const before = offset ? node.childNodes[offset - 1] : null;
+    if (browser.safari && after && after.contentEditable == "false") return setEditable(after);
+    if ((!after || after.contentEditable == "false") && (!before || before.contentEditable == "false")) {
+        if (after) return setEditable(after);
+        else if (before) return setEditable(before);
+    }
+    return;
+}
+function setEditable(element) {
+    element.contentEditable = "true";
+    if (browser.safari && element.draggable) {
+        element.draggable = false;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        element.wasDraggable = true;
+    }
+    return element;
+}
+function resetEditable(element) {
+    element.contentEditable = "false";
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    if (element.wasDraggable) {
+        element.draggable = true;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        element.wasDraggable = null;
+    }
+}
+function removeClassOnSelectionChange(view) {
+    const v = view;
+    const doc = v.dom.ownerDocument;
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    doc.removeEventListener("selectionchange", v.input.hideSelectionGuard);
+    const domSel = v.domSelectionRange();
+    const node = domSel.anchorNode, offset = domSel.anchorOffset;
+    doc.addEventListener("selectionchange", v.input.hideSelectionGuard = ()=>{
+        if (domSel.anchorNode != node || domSel.anchorOffset != offset) {
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            doc.removeEventListener("selectionchange", v.input.hideSelectionGuard);
+            setTimeout(()=>{
+                if (!editorOwnsSelection(v) || v.state.selection.visible) v.dom.classList.remove("ProseMirror-hideselection");
+            }, 20);
+        }
+    });
+}
+const brokenSelectBetweenUneditable = browser.safari || browser.chrome && browser.chrome_version < 63;
+export function selectionToDOM(view) {
+    let force = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
+    const v = view;
+    const sel = v.state.selection;
+    syncNodeSelection(v, sel);
+    if (!editorOwnsSelection(v)) return;
+    // The delayed drag selection causes issues with Cell Selections
+    // in Safari. And the drag selection delay is to workarond issues
+    // which only present in Chrome.
+    if (!force && v.input.mouseDown && v.input.mouseDown.allowDefault && browser.chrome) {
+        const domSel = v.domSelectionRange(), curSel = v.domObserver.currentSelection;
+        if (domSel.anchorNode && curSel.anchorNode && isEquivalentPosition(domSel.anchorNode, domSel.anchorOffset, curSel.anchorNode, curSel.anchorOffset)) {
+            v.input.mouseDown.delayedSelectionSync = true;
+            v.domObserver.setCurSelection();
+            return;
+        }
+    }
+    v.domObserver.disconnectSelection();
+    if (v.cursorWrapper) {
+        selectCursorWrapper(v);
+    } else {
+        const { anchor, head } = sel;
+        let resetEditableFrom;
+        let resetEditableTo;
+        if (brokenSelectBetweenUneditable && !(sel instanceof TextSelection)) {
+            if (!sel.$from.parent.inlineContent) resetEditableFrom = temporarilyEditableNear(v, sel.from);
+            if (!sel.empty && !sel.$from.parent.inlineContent) resetEditableTo = temporarilyEditableNear(v, sel.to);
+        }
+        v.docView.setSelection(anchor, head, v.root, force);
+        if (brokenSelectBetweenUneditable) {
+            if (resetEditableFrom) resetEditable(resetEditableFrom);
+            if (resetEditableTo) resetEditable(resetEditableTo);
+        }
+        if (sel.visible) {
+            v.dom.classList.remove("ProseMirror-hideselection");
+        } else {
+            v.dom.classList.add("ProseMirror-hideselection");
+            if ("onselectionchange" in document) removeClassOnSelectionChange(v);
+        }
+    }
+    v.domObserver.setCurSelection();
+    v.domObserver.connectSelection();
+}

package/dist/esm/ssr.js

@@ -0,0 +1,82 @@
+/* eslint-disable @typescript-eslint/no-empty-function */ /**
+ * @fileoverview
+ *
+ * Stubs for ProseMirror View during SSR. These are extremely
+ * barebones, because they _do not need to actually work_. They
+ * just need to prevent errors from being thrown when ProseMirror
+ * View attemps to access these APIs while constructing the
+ * initial EditorView. None of these APIs are necessary for SSR to
+ * work properly, so it's fine that they're all no-ops.
+ */ let ClassList = class ClassList {
+    add() {}
+    remove() {}
+};
+let ElementStub = class ElementStub {
+    get parent() {
+        return new ElementStub();
+    }
+    get parentNode() {
+        return new ElementStub();
+    }
+    nodeName = "div";
+    appendChild() {
+        return new ElementStub();
+    }
+    setAttribute() {}
+    hasAttribute() {
+        return false;
+    }
+    insertBefore() {}
+    get classList() {
+        return new ClassList();
+    }
+    get ownerDocument() {
+        return new DocumentStub();
+    }
+    style = {};
+    addEventListener() {}
+    removeEventListener() {}
+    replaceChildren() {}
+};
+let DocumentStub = class DocumentStub {
+    createElement() {
+        return new ElementStub();
+    }
+    addEventListener() {}
+    removeEventListener() {}
+    get documentElement() {
+        return new ElementStub();
+    }
+};
+/**
+ * Sets up tiny no-op stubs for the global window and document.
+ * These are used to prevent errors from being thrown when ProseMirror's
+ * EditorView attempts to access the DOM in its constructor during SSR.
+ *
+ * Returns a cleanup function that resets the window and document back
+ * to their original values (undefined).
+ */ export function setSsrStubs() {
+    const prevWindow = globalThis.window;
+    // @ts-expect-error HACK - EditorView checks for window.MutationObserver
+    // in its constructor, which breaks SSR. We temporarily set window
+    // to an empty object to prevent an error from being thrown, and then
+    // clean it up so that other isomorphic code doesn't get confused about
+    // whether there's a functioning global window object
+    globalThis.window ??= {
+        visualViewport: null
+    };
+    const prevDocument = globalThis.document;
+    // @ts-expect-error HACK: This is only used during SSR, and only
+    // to prevent outright errors when ProseMirror View attempts to
+    // access document properties either on import or when constructing
+    // the EditorView.
+    globalThis.document ??= new DocumentStub();
+    return function cleanupSsrStubs() {
+        if (globalThis.window !== prevWindow) {
+            globalThis.window = prevWindow;
+        }
+        if (globalThis.document !== prevDocument) {
+            globalThis.document = prevDocument;
+        }
+    };
+}

package/dist/esm/testing/editorViewTestHelpers.js

@@ -0,0 +1,88 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */ import { render } from "@testing-library/react";
+import { expect } from "expect";
+import { Node } from "prosemirror-model";
+import { EditorState, TextSelection } from "prosemirror-state";
+import { doc, eq, p, schema } from "prosemirror-test-builder";
+import React from "react";
+import { ProseMirror } from "../components/ProseMirror.js";
+import { ProseMirrorDoc } from "../components/ProseMirrorDoc.js";
+import { useEditorEffect } from "../hooks/useEditorEffect.js";
+import { reactKeys } from "../plugins/reactKeys.js";
+const toEqualNode = function(actual, expected) {
+    if (!(actual instanceof Node && expected instanceof Node)) {
+        throw new Error("Must be comparing nodes");
+    }
+    const pass = eq(actual, expected);
+    return {
+        message: ()=>// `this` context will have correct typings
+            `expected ${this.utils.printReceived(actual)} ${pass ? "not " : ""}to equal ${this.utils.printExpected(expected)}`,
+        pass
+    };
+};
+expect.extend({
+    toEqualNode
+});
+export function tempEditor(param) {
+    let { doc: startDoc, selection, controlled, plugins, ...props } = param;
+    startDoc = startDoc ?? doc(p());
+    const state = EditorState.create({
+        doc: startDoc,
+        schema,
+        selection: selection ?? startDoc.tag?.a ? TextSelection.create(startDoc, startDoc.tag.a, startDoc.tag?.b) : undefined,
+        plugins: [
+            ...plugins ?? [],
+            reactKeys()
+        ]
+    });
+    let view = null;
+    function Test() {
+        useEditorEffect((v)=>{
+            view = v;
+        });
+        return null;
+    }
+    const { rerender, unmount } = render(/*#__PURE__*/ React.createElement(ProseMirror, {
+        ...controlled ? {
+            state
+        } : {
+            defaultState: state
+        },
+        ...props
+    }, /*#__PURE__*/ React.createElement(Test, null), /*#__PURE__*/ React.createElement(ProseMirrorDoc, null)));
+    function rerenderEditor() {
+        let { ...newProps } = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
+        rerender(/*#__PURE__*/ React.createElement(ProseMirror, {
+            ...controlled ? {
+                state
+            } : {
+                defaultState: state
+            },
+            ...props,
+            ...newProps
+        }, /*#__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,
+        unmount
+    };
+}
+function findTextNodeInner(node, text) {
+    if (node.nodeType == 3) {
+        if (node.nodeValue == text) return node;
+    } else if (node.nodeType == 1) {
+        for(let ch = node.firstChild; ch; ch = ch.nextSibling){
+            const found = findTextNodeInner(ch, text);
+            if (found) return found;
+        }
+    }
+    return undefined;
+}
+export function findTextNode(node, text) {
+    const found = findTextNodeInner(node, text);
+    if (found) return found;
+    throw new Error("Unable to find matching text node");
+}

package/dist/esm/testing/setupProseMirrorView.js

@@ -0,0 +1,76 @@
+/* Copyright (c) The New York Times Company */ let oldElementFromPoint;
+let oldGetClientRects;
+let oldGetBoundingClientRect;
+const mockElementFromPoint = ()=>globalThis.document.body;
+const mockGetBoundingClientRect = ()=>{
+    return {
+        bottom: 0,
+        height: 0,
+        left: 0,
+        right: 0,
+        top: 0,
+        width: 0,
+        x: 0,
+        y: 0,
+        toJSON () {
+            return {
+                bottom: 0,
+                height: 0,
+                left: 0,
+                right: 0,
+                top: 0,
+                width: 0,
+                x: 0,
+                y: 0
+            };
+        }
+    };
+};
+const mockGetClientRects = ()=>{
+    const list = [
+        {
+            bottom: 0,
+            height: 0,
+            left: 0,
+            right: 0,
+            top: 0,
+            width: 0,
+            x: 0,
+            y: 0,
+            toJSON () {
+                return {
+                    bottom: 0,
+                    height: 0,
+                    left: 0,
+                    right: 0,
+                    top: 0,
+                    width: 0,
+                    x: 0,
+                    y: 0
+                };
+            }
+        }
+    ];
+    const domRectList = Object.assign(list, {
+        item (index) {
+            return list[index] ?? null;
+        }
+    });
+    return domRectList;
+};
+export function setupProseMirrorView() {
+    oldElementFromPoint = Document.prototype.elementFromPoint;
+    Document.prototype.elementFromPoint = mockElementFromPoint;
+    oldGetClientRects = Range.prototype.getClientRects;
+    Range.prototype.getClientRects = mockGetClientRects;
+    oldGetBoundingClientRect = Range.prototype.getBoundingClientRect;
+    Range.prototype.getBoundingClientRect = mockGetBoundingClientRect;
+}
+export function teardownProseMirrorView() {
+    // @ts-expect-error jsdom actually doesn't implement these, so they might be undefined
+    Document.prototype.elementFromPoint = oldElementFromPoint;
+    // @ts-expect-error jsdom actually doesn't implement these, so they might be undefined
+    Range.prototype.getClientRects = oldGetClientRects;
+    // @ts-expect-error jsdom actually doesn't implement these, so they might be undefined
+    Range.prototype.getBoundingClientRect = oldGetBoundingClientRect;
+}