@handlewithcare/react-prosemirror 2.5.3 → 2.6.0-tiptap.0

package/dist/cjs/tiptap/TiptapEditorContent.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TiptapEditorContent", {
+    enumerable: true,
+    get: function() {
+        return TiptapEditorContent;
+    }
+});
+const _react = require("@tiptap/react");
+const _react1 = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _ProseMirrorDoc = require("../components/ProseMirrorDoc.js");
+const _useEditorEffect = require("../hooks/useEditorEffect.js");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function TiptapEditorContent(param) {
+    let { editor, ...props } = param;
+    (0, _useEditorEffect.useEditorEffect)((view)=>{
+        if (editor.view === view) {
+            return;
+        }
+        Object.defineProperty(editor, "editorView", {
+            value: view,
+            configurable: true,
+            enumerable: true,
+            writable: true
+        });
+        // @ts-expect-error private method
+        editor.injectCSS();
+        const dom = view.dom;
+        dom.editor = editor;
+        setTimeout(()=>{
+            if (editor.isDestroyed) {
+                return;
+            }
+            editor.commands.focus(editor.options.autofocus);
+            editor.emit("create", {
+                editor
+            });
+            editor.isInitialized = true;
+        });
+    }, [
+        editor
+    ]);
+    const contextValue = (0, _react1.useMemo)(()=>({
+            editor
+        }), [
+        editor
+    ]);
+    return /*#__PURE__*/ _react1.default.createElement(_react.EditorContext.Provider, {
+        value: contextValue
+    }, /*#__PURE__*/ _react1.default.createElement(_ProseMirrorDoc.ProseMirrorDoc, props));
+}

package/dist/cjs/tiptap/TiptapEditorView.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TiptapEditorView", {
+    enumerable: true,
+    get: function() {
+        return TiptapEditorView;
+    }
+});
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _ProseMirror = require("../components/ProseMirror.js");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function TiptapEditorView(param) {
+    let { editor, nodeViews, children } = param;
+    const dispatchTransaction = (0, _react.useCallback)((tr)=>{
+        // @ts-expect-error calling private method
+        editor.dispatchTransaction(tr);
+    }, [
+        editor
+    ]);
+    const initialEditorProps = {
+        ...editor.options.editorProps,
+        attributes: {
+            role: "textbox",
+            ...editor.options.editorProps?.attributes
+        }
+    };
+    const { nodeViews: customNodeViews, markViews } = editor.isDestroyed ? {
+        nodeViews: undefined,
+        markViews: undefined
+    } : editor.view.props;
+    return /*#__PURE__*/ _react.default.createElement(_ProseMirror.ProseMirror, {
+        className: "tiptap",
+        ...initialEditorProps,
+        markViews: markViews,
+        nodeViews: nodeViews,
+        customNodeViews: customNodeViews,
+        state: editor.isDestroyed || editor.state.plugins.length ? editor.state : editor.state.reconfigure({
+            plugins: editor.extensionManager.plugins
+        }),
+        dispatchTransaction: dispatchTransaction
+    }, children);
+}

package/dist/cjs/tiptap/hooks/useTiptapEditorEffect.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useTiptapEditorEffect", {
+    enumerable: true,
+    get: function() {
+        return useTiptapEditorEffect;
+    }
+});
+const _react = require("@tiptap/react");
+const _useEditorEffect = require("../../hooks/useEditorEffect.js");
+function useTiptapEditorEffect(effect, dependencies) {
+    const { editor } = (0, _react.useCurrentEditor)();
+    (0, _useEditorEffect.useEditorEffect)(()=>{
+        if (editor) {
+            return effect(editor);
+        }
+    // The rules of hooks want to be able to statically
+    // verify the dependencies for the effect, but this will
+    // have already happened at the call-site.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, dependencies && [
+        editor,
+        ...dependencies
+    ]);
+}

package/dist/cjs/tiptap/hooks/useTiptapEditorEventCallback.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useTiptapEditorEventCallback", {
+    enumerable: true,
+    get: function() {
+        return useTiptapEditorEventCallback;
+    }
+});
+const _react = require("@tiptap/react");
+const _useEditorEventCallback = require("../../hooks/useEditorEventCallback.js");
+function assertEditor(editor) {
+    if (editor) return;
+    throw new DOMException("Tiptap Editor is not initialized", "InvalidStateError");
+}
+function useTiptapEditorEventCallback(callback) {
+    const { editor } = (0, _react.useCurrentEditor)();
+    return (0, _useEditorEventCallback.useEditorEventCallback)(function(_) {
+        for(var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++){
+            args[_key - 1] = arguments[_key];
+        }
+        assertEditor(editor);
+        return callback(editor, ...args);
+    });
+}

package/dist/cjs/tiptap/index.js

@@ -0,0 +1,32 @@
+"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, {
+    TiptapEditorContent: function() {
+        return _TiptapEditorContent.TiptapEditorContent;
+    },
+    TiptapEditorView: function() {
+        return _TiptapEditorView.TiptapEditorView;
+    },
+    tiptapNodeView: function() {
+        return _tiptapNodeView.tiptapNodeView;
+    },
+    useTiptapEditorEffect: function() {
+        return _useTiptapEditorEffect.useTiptapEditorEffect;
+    },
+    useTiptapEditorEventCallback: function() {
+        return _useTiptapEditorEventCallback.useTiptapEditorEventCallback;
+    }
+});
+const _tiptapNodeView = require("./tiptapNodeView.js");
+const _TiptapEditorView = require("./TiptapEditorView.js");
+const _TiptapEditorContent = require("./TiptapEditorContent.js");
+const _useTiptapEditorEffect = require("./hooks/useTiptapEditorEffect.js");
+const _useTiptapEditorEventCallback = require("./hooks/useTiptapEditorEventCallback.js");

package/dist/cjs/tiptap/tiptapNodeView.js

@@ -0,0 +1,181 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "tiptapNodeView", {
+    enumerable: true,
+    get: function() {
+        return tiptapNodeView;
+    }
+});
+const _core = require("@tiptap/core");
+const _react = require("@tiptap/react");
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _react1 = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _useEditorEventCallback = require("../hooks/useEditorEventCallback.js");
+const _useIgnoreMutation = require("../hooks/useIgnoreMutation.js");
+const _useIsNodeSelected = require("../hooks/useIsNodeSelected.js");
+const _useStopEvent = require("../hooks/useStopEvent.js");
+const _props = require("../props.js");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function tiptapNodeView(param) {
+    let { component: WrappedComponent, extension, as: OuterTag = "div", className = "", attrs, contentDOMElementTag: InnerTag = "div", stopEvent, ignoreMutation } = param;
+    const TiptapNodeView = /*#__PURE__*/ (0, _react1.memo)(/*#__PURE__*/ (0, _react1.forwardRef)(function TiptapNodeView(param, ref) {
+        let { children, nodeProps, ...props } = param;
+        const { node, getPos, decorations, innerDecorations } = nodeProps;
+        const { editor } = (0, _react.useCurrentEditor)();
+        const extensionManager = editor?.extensionManager ?? null;
+        const extensions = extensionManager?.extensions ?? null;
+        const selected = (0, _useIsNodeSelected.useIsNodeSelected)();
+        (0, _useStopEvent.useStopEvent)((_, event)=>{
+            if (stopEvent) {
+                return stopEvent({
+                    event
+                });
+            }
+            return false;
+        });
+        (0, _useIgnoreMutation.useIgnoreMutation)((_, mutation)=>{
+            if (ignoreMutation) {
+                return ignoreMutation({
+                    mutation
+                });
+            }
+            return false;
+        });
+        // This is just a dummy ref to satisfy Tiptap's types
+        const innerRef = (0, _react1.useRef)(null);
+        const htmlAttributes = (0, _react1.useMemo)(()=>{
+            if (!extensions) return {};
+            const attributes = (0, _core.getAttributesFromExtensions)(extensions);
+            const extensionAttributes = attributes.filter((attribute)=>attribute.type === extension.name);
+            return (0, _core.getRenderedAttributes)(node, extensionAttributes);
+        }, [
+            extensions,
+            node
+        ]);
+        const { extraClassName, htmlProps } = (0, _react1.useMemo)(()=>{
+            if (!attrs) return {};
+            const resolvedAttrs = typeof attrs === "function" ? attrs({
+                node,
+                HTMLAttributes: htmlAttributes
+            }) : attrs;
+            const { className: extraClassName, ...htmlProps } = (0, _props.htmlAttrsToReactProps)(resolvedAttrs);
+            return {
+                extraClassName,
+                htmlProps
+            };
+        }, [
+            htmlAttributes,
+            node
+        ]);
+        const finalClassName = (0, _classnames.default)("react-renderer", `node-${node.type.name}`, className, extraClassName, {
+            "ProseMirror-selectednode": selected
+        });
+        const updateAttributes = (0, _useEditorEventCallback.useEditorEventCallback)((_, attributes)=>{
+            if (!editor) {
+                return;
+            }
+            editor.commands.command((param)=>{
+                let { tr } = param;
+                const pos = getPos();
+                tr.setNodeMarkup(pos, undefined, {
+                    ...node.attrs,
+                    ...attributes
+                });
+                return true;
+            });
+        });
+        const deleteNode = (0, _useEditorEventCallback.useEditorEventCallback)(()=>{
+            if (!editor) {
+                return;
+            }
+            const from = getPos();
+            const to = from + node.nodeSize;
+            editor.commands.deleteRange({
+                from,
+                to
+            });
+        });
+        const nodeViewContext = (0, _react1.useMemo)(()=>({
+                nodeViewContentChildren: /*#__PURE__*/ _react1.default.createElement(InnerTag, {
+                    "data-node-view-content-inner": node.type.name,
+                    style: {
+                        whitespace: "inherit"
+                    }
+                }, children)
+            }), [
+            children,
+            node.type.name
+        ]);
+        if (!editor) return null;
+        return /*#__PURE__*/ _react1.default.createElement(_react.ReactNodeViewContext.Provider, {
+            value: nodeViewContext
+        }, /*#__PURE__*/ _react1.default.createElement(OuterTag, {
+            ref: ref,
+            className: finalClassName,
+            ...props,
+            ...htmlProps
+        }, /*#__PURE__*/ _react1.default.createElement(WrappedComponent, {
+            ref: innerRef,
+            node: node,
+            getPos: getPos,
+            view: editor.view,
+            editor: editor,
+            decorations: decorations,
+            innerDecorations: innerDecorations,
+            extension: extension,
+            HTMLAttributes: htmlAttributes,
+            selected: selected,
+            updateAttributes: updateAttributes,
+            deleteNode: deleteNode
+        })));
+    }));
+    TiptapNodeView.displayName = `TiptapNodeView(${WrappedComponent.displayName ?? "Anonymous"})`;
+    return TiptapNodeView;
+}