@stesura/react-prosemirror 3.2.11-stesura.1

package/dist/cjs/tiptap/tiptapNodeView.js

@@ -0,0 +1,245 @@
+"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");
+const _refs = require("../refs.js");
+const _ReactProseMirrorNodeView = require("./ReactProseMirrorNodeView.js");
+const _useTiptapEditorEventCallback = require("./hooks/useTiptapEditorEventCallback.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, 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, contentDOMRef } = nodeProps;
+        const OuterTag = as ?? (node.type.isInline ? "span" : "div");
+        const { editor } = (0, _react.useCurrentEditor)();
+        const extensionManager = editor?.extensionManager ?? null;
+        const extensions = extensionManager?.extensions ?? null;
+        const selected = (0, _useIsNodeSelected.useIsNodeSelected)();
+        const isDraggingRef = (0, _react1.useRef)(false);
+        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
+        ]);
+        (0, _useStopEvent.useStopEvent)(function(_, event) {
+            if (!editor || !(this.dom instanceof HTMLElement)) return false;
+            const nodeView = new _ReactProseMirrorNodeView.ReactProseMirrorNodeView(WrappedComponent, {
+                extension,
+                decorations,
+                editor,
+                getPos,
+                HTMLAttributes: htmlAttributes,
+                innerDecorations,
+                node,
+                view: editor.view
+            }, this.dom, this.contentDOM ?? null);
+            nodeView.isDragging = isDraggingRef.current;
+            if (stopEvent) {
+                const result = stopEvent.call({
+                    name: extension.name,
+                    editor,
+                    type: node.type
+                }, {
+                    event,
+                    defaultStopEvent: nodeView.stopEvent.bind(nodeView)
+                });
+                isDraggingRef.current = nodeView.isDragging;
+                return result;
+            }
+            const result = nodeView.stopEvent(event) ?? false;
+            isDraggingRef.current = nodeView.isDragging;
+            return result;
+        });
+        (0, _useIgnoreMutation.useIgnoreMutation)(function(_, mutation) {
+            if (!editor || !(this.dom instanceof HTMLElement)) return false;
+            const nodeView = new _ReactProseMirrorNodeView.ReactProseMirrorNodeView(WrappedComponent, {
+                extension,
+                decorations,
+                editor,
+                getPos,
+                HTMLAttributes: htmlAttributes,
+                innerDecorations,
+                node,
+                view: editor.view
+            }, this.dom, this.contentDOM ?? null);
+            if (ignoreMutation) {
+                return ignoreMutation.call({
+                    name: extension.name,
+                    editor,
+                    type: node.type
+                }, {
+                    mutation,
+                    defaultIgnoreMutation: nodeView.ignoreMutation.bind(nodeView)
+                });
+            }
+            return nodeView.ignoreMutation(mutation) ?? false;
+        });
+        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}`, props.className, className, extraClassName, {
+            "ProseMirror-selectednode": selected
+        });
+        const updateAttributes = (0, _useEditorEventCallback.useEditorEventCallback)((_, attributes)=>{
+            if (!editor) {
+                return;
+            }
+            editor.commands.command((param)=>{
+                let { tr } = param;
+                const pos = getPos();
+                Object.keys(attributes).forEach((key)=>{
+                    tr.setNodeAttribute(pos, key, attributes[key]);
+                });
+                return true;
+            });
+        });
+        const deleteNode = (0, _useEditorEventCallback.useEditorEventCallback)(()=>{
+            if (!editor) {
+                return;
+            }
+            const from = getPos();
+            const to = from + node.nodeSize;
+            editor.commands.deleteRange({
+                from,
+                to
+            });
+        });
+        const nodeViewContent = (0, _react1.useMemo)(()=>/*#__PURE__*/ _react1.default.createElement(InnerTag, {
+                ref: contentDOMRef,
+                "data-node-view-content-inner": node.type.name,
+                style: {
+                    whitespace: "inherit"
+                }
+            }, children), [
+            children,
+            contentDOMRef,
+            node.type.name
+        ]);
+        const innerRef = (0, _react1.useRef)(null);
+        const finalRef = (0, _refs.useMergedDOMRefs)(ref, innerRef);
+        const onDragStart = (0, _useTiptapEditorEventCallback.useTiptapEditorEventCallback)((editor, event)=>{
+            const dom = innerRef.current;
+            if (!dom) return;
+            const viewDesc = dom.pmViewDesc;
+            if (!viewDesc) return;
+            const nodeView = new _ReactProseMirrorNodeView.ReactProseMirrorNodeView(WrappedComponent, {
+                extension,
+                decorations,
+                editor,
+                getPos,
+                HTMLAttributes: htmlAttributes,
+                innerDecorations,
+                node,
+                view: editor.view
+            }, viewDesc.dom, viewDesc.contentDOM);
+            return nodeView.onDragStart(event);
+        });
+        const nodeViewContext = (0, _react1.useMemo)(()=>({
+                nodeViewContentChildren: nodeViewContent,
+                onDragStart
+            }), [
+            nodeViewContent,
+            onDragStart
+        ]);
+        if (!editor) return null;
+        return /*#__PURE__*/ _react1.default.createElement(_react.ReactNodeViewContext.Provider, {
+            value: nodeViewContext
+        }, /*#__PURE__*/ _react1.default.createElement(OuterTag, {
+            ref: finalRef,
+            ...props,
+            ...htmlProps,
+            className: finalClassName
+        }, /*#__PURE__*/ _react1.default.createElement(WrappedComponent, {
+            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;
+}