@handlewithcare/react-prosemirror 2.0.0

package/dist/cjs/props.js

@@ -0,0 +1,269 @@
+"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, {
+    cssToStyles: function() {
+        return cssToStyles;
+    },
+    htmlAttrsToReactProps: function() {
+        return htmlAttrsToReactProps;
+    },
+    kebabCaseToCamelCase: function() {
+        return kebabCaseToCamelCase;
+    },
+    mergeReactProps: function() {
+        return mergeReactProps;
+    }
+});
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function kebabCaseToCamelCase(str) {
+    return str.replaceAll(/-[a-z]/g, (g)=>g[1]?.toUpperCase() ?? "");
+}
+function cssToStyles(css) {
+    const stylesheet = new CSSStyleSheet();
+    stylesheet.insertRule(`* { ${css} }`);
+    const insertedRule = stylesheet.cssRules[0];
+    const declaration = insertedRule.style;
+    const styles = {};
+    for(let i = 0; i < declaration.length; i++){
+        const property = declaration.item(i);
+        const value = declaration.getPropertyValue(property);
+        const camelCasePropertyName = property.startsWith("--") ? property : kebabCaseToCamelCase(property);
+        styles[camelCasePropertyName] = value;
+    }
+    return styles;
+}
+function mergeReactProps(a, b) {
+    return {
+        ...a,
+        ...b,
+        className: (0, _classnames.default)(a.className, b.className),
+        style: {
+            ...a.style,
+            ...b.style
+        }
+    };
+}
+function htmlAttrsToReactProps(attrs) {
+    const props = {};
+    for (const [attrName, attrValue] of Object.entries(attrs)){
+        switch(attrName.toLowerCase()){
+            case "class":
+                {
+                    props.className = attrValue;
+                    break;
+                }
+            case "style":
+                {
+                    props.style = cssToStyles(attrValue);
+                    break;
+                }
+            case "autocapitalize":
+                {
+                    props.autoCapitalize = attrValue;
+                    break;
+                }
+            case "contenteditable":
+                {
+                    if (attrValue === "" || attrValue === "true") {
+                        props.contentEditable = true;
+                        break;
+                    }
+                    if (attrValue === "false") {
+                        props.contentEditable = false;
+                        break;
+                    }
+                    if (attrValue === "plaintext-only") {
+                        props.contentEditable = "plaintext-only";
+                        break;
+                    }
+                    props.contentEditable = null;
+                    break;
+                }
+            case "draggable":
+                {
+                    props.draggable = attrValue != null;
+                    break;
+                }
+            case "enterkeyhint":
+                {
+                    props.enterKeyHint = attrValue;
+                    break;
+                }
+            case "for":
+                {
+                    props.htmlFor = attrValue;
+                    break;
+                }
+            case "hidden":
+                {
+                    props.hidden = attrValue;
+                    break;
+                }
+            case "inputmode":
+                {
+                    props.inputMode = attrValue;
+                    break;
+                }
+            case "itemprop":
+                {
+                    props.itemProp = attrValue;
+                    break;
+                }
+            case "spellcheck":
+                {
+                    if (attrValue === "" || attrValue === "true") {
+                        props.spellCheck = true;
+                        break;
+                    }
+                    if (attrValue === "false") {
+                        props.spellCheck = false;
+                        break;
+                    }
+                    props.spellCheck = null;
+                    break;
+                }
+            case "tabindex":
+                {
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue)) {
+                        props.tabIndex = numValue;
+                    }
+                    break;
+                }
+            case "autocomplete":
+                {
+                    props.autoComplete = attrValue;
+                    break;
+                }
+            case "autofocus":
+                {
+                    props.autoFocus = attrValue != null;
+                    break;
+                }
+            case "formaction":
+                {
+                    props.formAction = attrValue;
+                    break;
+                }
+            case "formenctype":
+                {
+                    props.formEnctype = attrValue;
+                    break;
+                }
+            case "formmethod":
+                {
+                    props.formMethod = attrValue;
+                    break;
+                }
+            case "formnovalidate":
+                {
+                    props.formNoValidate = attrValue;
+                    break;
+                }
+            case "formtarget":
+                {
+                    props.formTarget = attrValue;
+                    break;
+                }
+            case "maxlength":
+                {
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue)) {
+                        props.maxLength = attrValue;
+                    }
+                    break;
+                }
+            case "minlength":
+                {
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue)) {
+                        props.minLength = attrValue;
+                    }
+                    break;
+                }
+            case "max":
+                {
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue)) {
+                        props.max = attrValue;
+                    }
+                    break;
+                }
+            case "min":
+                {
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue)) {
+                        props.min = attrValue;
+                    }
+                    break;
+                }
+            case "multiple":
+                {
+                    props.multiple = attrValue != null;
+                    break;
+                }
+            case "readonly":
+                {
+                    props.readOnly = attrValue != null;
+                    break;
+                }
+            case "required":
+                {
+                    props.required = attrValue != null;
+                    break;
+                }
+            case "size":
+                {
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue)) {
+                        props.size = attrValue;
+                    }
+                    break;
+                }
+            case "step":
+                {
+                    if (attrValue === "any") {
+                        props.step = attrValue;
+                        break;
+                    }
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue) && numValue > 0) {
+                        props.step = attrValue;
+                    }
+                    break;
+                }
+            case "disabled":
+                {
+                    props.disabled = attrValue != null;
+                    break;
+                }
+            case "rows":
+                {
+                    const numValue = parseInt(attrValue, 10);
+                    if (!Number.isNaN(numValue)) {
+                        props.rows = attrValue;
+                    }
+                    break;
+                }
+            default:
+                {
+                    props[attrName] = attrValue;
+                    break;
+                }
+        }
+    }
+    return props;
+}

package/dist/cjs/selection/SelectionDOMObserver.js

@@ -0,0 +1,174 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "SelectionDOMObserver", {
+    enumerable: true,
+    get: function() {
+        return SelectionDOMObserver;
+    }
+});
+const _prosemirrorstate = require("prosemirror-state");
+const _browser = require("../browser.js");
+const _dom = require("../dom.js");
+const _hasFocusAndSelection = require("./hasFocusAndSelection.js");
+const _selectionFromDOM = require("./selectionFromDOM.js");
+const _selectionToDOM = require("./selectionToDOM.js");
+let SelectionState = class SelectionState {
+    anchorNode = null;
+    anchorOffset = 0;
+    focusNode = null;
+    focusOffset = 0;
+    set(sel) {
+        this.anchorNode = sel.anchorNode;
+        this.anchorOffset = sel.anchorOffset;
+        this.focusNode = sel.focusNode;
+        this.focusOffset = sel.focusOffset;
+    }
+    clear() {
+        this.anchorNode = this.focusNode = null;
+    }
+    eq(sel) {
+        return sel.anchorNode == this.anchorNode && sel.anchorOffset == this.anchorOffset && sel.focusNode == this.focusNode && sel.focusOffset == this.focusOffset;
+    }
+};
+let SelectionDOMObserver = class SelectionDOMObserver {
+    view;
+    flushingSoon;
+    currentSelection;
+    suppressingSelectionUpdates;
+    constructor(view){
+        this.view = view;
+        this.flushingSoon = -1;
+        this.currentSelection = new SelectionState();
+        this.suppressingSelectionUpdates = false;
+        this.view = view;
+        this.onSelectionChange = this.onSelectionChange.bind(this);
+    }
+    connectSelection() {
+        this.view.dom.ownerDocument.addEventListener("selectionchange", this.onSelectionChange);
+    }
+    disconnectSelection() {
+        this.view.dom.ownerDocument.removeEventListener("selectionchange", this.onSelectionChange);
+    }
+    stop() {
+        this.disconnectSelection();
+    }
+    start() {
+        this.connectSelection();
+    }
+    suppressSelectionUpdates() {
+        this.suppressingSelectionUpdates = true;
+        setTimeout(()=>this.suppressingSelectionUpdates = false, 50);
+    }
+    setCurSelection() {
+        // @ts-expect-error Internal method
+        this.currentSelection.set(this.view.domSelectionRange());
+    }
+    ignoreSelectionChange(sel) {
+        if (!sel.focusNode) return true;
+        const ancestors = new Set();
+        let container;
+        for(let scan = sel.focusNode; scan; scan = (0, _dom.parentNode)(scan))ancestors.add(scan);
+        for(let scan = sel.anchorNode; scan; scan = (0, _dom.parentNode)(scan))if (ancestors.has(scan)) {
+            container = scan;
+            break;
+        }
+        // @ts-expect-error Internal property (docView)
+        const desc = container && this.view.docView.nearestDesc(container);
+        if (desc && desc.ignoreMutation({
+            type: "selection",
+            target: container?.nodeType == 3 ? container?.parentNode : container
+        })) {
+            this.setCurSelection();
+            return true;
+        }
+        return;
+    }
+    registerMutation() {
+    // pass
+    }
+    flushSoon() {
+        if (this.flushingSoon < 0) this.flushingSoon = window.setTimeout(()=>{
+            this.flushingSoon = -1;
+            this.flush();
+        }, 20);
+    }
+    updateSelection() {
+        const { view } = this;
+        const compositionID = // @ts-expect-error Internal property (input)
+        view.input.compositionPendingChanges || // @ts-expect-error Internal property (input)
+        (view.composing ? view.input.compositionID : 0);
+        // @ts-expect-error Internal property (input)
+        view.input.compositionPendingChanges = 0;
+        const origin = // @ts-expect-error Internal property (input)
+        view.input.lastSelectionTime > Date.now() - 50 ? view.input.lastSelectionOrigin : null;
+        const newSel = (0, _selectionFromDOM.selectionFromDOM)(view, origin);
+        if (newSel && !view.state.selection.eq(newSel)) {
+            const tr = view.state.tr.setSelection(newSel);
+            if (origin == "pointer") tr.setMeta("pointer", true);
+            else if (origin == "key") tr.scrollIntoView();
+            if (compositionID) tr.setMeta("composition", compositionID);
+            view.dispatch(tr);
+        }
+    }
+    selectionToDOM() {
+        const { view } = this;
+        (0, _selectionToDOM.selectionToDOM)(view);
+        // @ts-expect-error Internal property (domSelectionRange)
+        const sel = view.domSelectionRange();
+        this.currentSelection.set(sel);
+    }
+    flush() {
+        const { view } = this;
+        // @ts-expect-error Internal property (docView)
+        if (!view.docView || this.flushingSoon > -1) return;
+        // @ts-expect-error Internal property (domSelectionRange)
+        const sel = view.domSelectionRange();
+        const newSel = !this.suppressingSelectionUpdates && !this.currentSelection.eq(sel) && (0, _hasFocusAndSelection.hasFocusAndSelection)(view) && !this.ignoreSelectionChange(sel);
+        let readSel = null;
+        // If it looks like the browser has reset the selection to the
+        // start of the document after focus, restore the selection from
+        // the state
+        if (newSel && // @ts-expect-error Internal property (input)
+        view.input.lastFocus > Date.now() - 200 && // @ts-expect-error Internal property (input)
+        Math.max(view.input.lastTouch, view.input.lastClick.time) < Date.now() - 300 && (0, _dom.selectionCollapsed)(sel) && (readSel = (0, _selectionFromDOM.selectionFromDOM)(view)) && readSel.eq(_prosemirrorstate.Selection.near(view.state.doc.resolve(0), 1))) {
+            // @ts-expect-error Internal property (input)
+            view.input.lastFocus = 0;
+            (0, _selectionToDOM.selectionToDOM)(view);
+            this.currentSelection.set(sel);
+            // @ts-expect-error Internal property (scrollToSelection)
+            view.scrollToSelection();
+        } else if (newSel) {
+            this.updateSelection();
+            if (!this.currentSelection.eq(sel)) (0, _selectionToDOM.selectionToDOM)(view);
+            this.currentSelection.set(sel);
+        }
+    }
+    selectionChanged(sel) {
+        return !this.suppressingSelectionUpdates && !this.currentSelection.eq(sel) && (0, _hasFocusAndSelection.hasFocusAndSelection)(this.view) && !this.ignoreSelectionChange(sel);
+    }
+    forceFlush() {
+        if (this.flushingSoon > -1) {
+            window.clearTimeout(this.flushingSoon);
+            this.flushingSoon = -1;
+            this.flush();
+        }
+    }
+    onSelectionChange() {
+        if (!(0, _hasFocusAndSelection.hasFocusAndSelection)(this.view)) return;
+        if (this.view.composing) return;
+        if (this.suppressingSelectionUpdates) return (0, _selectionToDOM.selectionToDOM)(this.view);
+        // Deletions on IE11 fire their events in the wrong order, giving
+        // us a selection change event before the DOM changes are
+        // reported.
+        if (_browser.browser.ie && _browser.browser.ie_version <= 11 && !this.view.state.selection.empty) {
+            // @ts-expect-error Internal method
+            const sel = this.view.domSelectionRange();
+            // Selection.isCollapsed isn't reliable on IE
+            if (sel.focusNode && (0, _selectionToDOM.isEquivalentPosition)(sel.focusNode, sel.focusOffset, // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            sel.anchorNode, sel.anchorOffset)) return this.flushSoon();
+        }
+        this.flush();
+    }
+};

package/dist/cjs/selection/hasFocusAndSelection.js

@@ -0,0 +1,35 @@
+"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, {
+    hasFocusAndSelection: function() {
+        return hasFocusAndSelection;
+    },
+    hasSelection: function() {
+        return hasSelection;
+    }
+});
+function hasFocusAndSelection(view) {
+    if (view.editable && !view.hasFocus()) return false;
+    return hasSelection(view);
+}
+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/cjs/selection/selectionFromDOM.js

@@ -0,0 +1,77 @@
+"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, {
+    selectionBetween: function() {
+        return selectionBetween;
+    },
+    selectionFromDOM: function() {
+        return selectionFromDOM;
+    }
+});
+const _prosemirrorstate = require("prosemirror-state");
+const _dom = require("../dom.js");
+function selectionBetween(view, $anchor, $head, bias) {
+    return view.someProp("createSelectionBetween", (f)=>f(view, $anchor, $head)) || _prosemirrorstate.TextSelection.between($anchor, $head, bias);
+}
+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 ((0, _dom.selectionCollapsed)(domSel)) {
+        anchor = head;
+        while(nearestDesc && !nearestDesc.node)nearestDesc = nearestDesc.parent;
+        const nearestDescNode = nearestDesc.node;
+        if (nearestDesc && nearestDescNode.isAtom && _prosemirrorstate.NodeSelection.isSelectable(nearestDescNode) && nearestDesc.parent && !(nearestDescNode.isInline && (0, _dom.isOnEdge)(domSel.focusNode, domSel.focusOffset, nearestDesc.dom))) {
+            const pos = nearestDesc.posBefore;
+            selection = new _prosemirrorstate.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;
+}