@tiptap/core 2.6.5 → 2.7.0-pre.0

package/dist/index.js

@@ -319,7 +319,18 @@ function mergeAttributes(...objects) {
                 mergedAttributes[key] = [...existingClasses, ...insertClasses].join(' ');
             }
             else if (key === 'style') {
-                mergedAttributes[key] = [mergedAttributes[key], value].join('; ');
+                const newStyles = value ? value.split(';').map((style) => style.trim()).filter(Boolean) : [];
+                const existingStyles = mergedAttributes[key] ? mergedAttributes[key].split(';').map((style) => style.trim()).filter(Boolean) : [];
+                const styleMap = new Map();
+                existingStyles.forEach(style => {
+                    const [property, val] = style.split(':').map(part => part.trim());
+                    styleMap.set(property, val);
+                });
+                newStyles.forEach(style => {
+                    const [property, val] = style.split(':').map(part => part.trim());
+                    styleMap.set(property, val);
+                });
+                mergedAttributes[key] = Array.from(styleMap.entries()).map(([property, val]) => `${property}: ${val}`).join('; ');
             }
             else {
                 mergedAttributes[key] = value;
@@ -713,16 +724,6 @@ function inputRulesPlugin(props) {
             },
         },
         props: {
-            handleTextInput(view, from, to, text) {
-                return run$1({
-                    editor,
-                    from,
-                    to,
-                    text,
-                    rules,
-                    plugin,
-                });
-            },
             handleDOMEvents: {
                 compositionend: view => {
                     setTimeout(() => {
@@ -740,6 +741,19 @@ function inputRulesPlugin(props) {
                     });
                     return false;
                 },
+                keyup(view, event) {
+                    if (event.key.length === 1) {
+                        return run$1({
+                            editor,
+                            from: view.state.selection.from,
+                            to: view.state.selection.from,
+                            text: '',
+                            rules,
+                            plugin,
+                        });
+                    }
+                    return false;
+                },
             },
             // add support for input rules to trigger on enter
             // this is useful for example for code blocks
@@ -1150,15 +1164,19 @@ class ExtensionManager {
             if (!addNodeView) {
                 return [];
             }
-            const nodeview = (node, view, getPos, decorations) => {
+            const nodeview = (node, view, getPos, decorations, innerDecorations) => {
                 const HTMLAttributes = getRenderedAttributes(node, extensionAttributes);
                 return addNodeView()({
-                    editor,
+                    // pass-through
                     node,
-                    getPos,
+                    view,
+                    getPos: getPos,
                     decorations,
-                    HTMLAttributes,
+                    innerDecorations,
+                    // tiptap-specific
+                    editor,
                     extension,
+                    HTMLAttributes,
                 });
             };
             return [extension.name, nodeview];
@@ -1766,7 +1784,11 @@ function createNodeFromContent(content, schema, options) {
             if (isArrayContent) {
                 return Fragment.fromArray(content.map(item => schema.nodeFromJSON(item)));
             }
-            return schema.nodeFromJSON(content);
+            const node = schema.nodeFromJSON(content);
+            if (options.errorOnInvalidContent) {
+                node.check();
+            }
+            return node;
         }
         catch (error) {
             if (options.errorOnInvalidContent) {
@@ -3312,10 +3334,17 @@ const toggleNode = (typeOrName, toggleTypeOrName, attributes = {}) => ({ state,
     const type = getNodeType(typeOrName, state.schema);
     const toggleType = getNodeType(toggleTypeOrName, state.schema);
     const isActive = isNodeActive(state, type, attributes);
+    let attributesToCopy;
+    if (state.selection.$anchor.sameParent(state.selection.$head)) {
+        // only copy attributes if the selection is pointing to a node of the same type
+        attributesToCopy = state.selection.$anchor.parent.attrs;
+    }
     if (isActive) {
-        return commands.setNode(toggleType);
+        return commands.setNode(toggleType, attributesToCopy);
     }
-    return commands.setNode(type, attributes);
+    // If the node is not active, we want to set the new node type with the given attributes
+    // Copying over the attributes from the current node if the selection is pointing to a node of the same type
+    return commands.setNode(type, { ...attributesToCopy, ...attributes });
 };
 
 const toggleWrap = (typeOrName, attributes = {}) => ({ state, commands }) => {
@@ -3649,7 +3678,8 @@ const Keymap = Extension.create({
                 appendTransaction: (transactions, oldState, newState) => {
                     const docChanges = transactions.some(transaction => transaction.docChanged)
                         && !oldState.doc.eq(newState.doc);
-                    if (!docChanges) {
+                    const ignoreTr = transactions.some(transaction => transaction.getMeta('preventClearDocument'));
+                    if (!docChanges || ignoreTr) {
                         return;
                     }
                     const { empty, from, to } = oldState.selection;
@@ -3659,7 +3689,7 @@ const Keymap = Extension.create({
                     if (empty || !allWasSelected) {
                         return;
                     }
-                    const isEmpty = newState.doc.textBetween(0, newState.doc.content.size, ' ', ' ').length === 0;
+                    const isEmpty = isNodeEmpty(newState.doc);
                     if (!isEmpty) {
                         return;
                     }
@@ -3883,6 +3913,28 @@ class NodePos {
     }
 }
 
+const DropPlugin = (onDrop) => {
+    return new Plugin({
+        key: new PluginKey('tiptapDrop'),
+        props: {
+            handleDrop: (_, e, slice, moved) => {
+                onDrop(e, slice, moved);
+            },
+        },
+    });
+};
+
+const PastePlugin = (onPaste) => {
+    return new Plugin({
+        key: new PluginKey('tiptapPaste'),
+        props: {
+            handlePaste: (_view, e, slice) => {
+                onPaste(e, slice);
+            },
+        },
+    });
+};
+
 const style = `.ProseMirror {
   position: relative;
 }
@@ -4007,6 +4059,8 @@ class Editor extends EventEmitter {
             onBlur: () => null,
             onDestroy: () => null,
             onContentError: ({ error }) => { throw error; },
+            onPaste: () => null,
+            onDrop: () => null,
         };
         this.isCapturingTransaction = false;
         this.capturedTransaction = null;
@@ -4026,6 +4080,12 @@ class Editor extends EventEmitter {
         this.on('focus', this.options.onFocus);
         this.on('blur', this.options.onBlur);
         this.on('destroy', this.options.onDestroy);
+        if (this.options.onPaste) {
+            this.registerPlugin(PastePlugin(this.options.onPaste));
+        }
+        if (this.options.onDrop) {
+            this.registerPlugin(DropPlugin(this.options.onDrop));
+        }
         window.setTimeout(() => {
             if (this.isDestroyed) {
                 return;
@@ -4153,7 +4213,12 @@ class Editor extends EventEmitter {
             FocusEvents,
             Keymap,
             Tabindex,
-        ] : [];
+        ].filter(ext => {
+            if (typeof this.options.enableCoreExtensions === 'object') {
+                return this.options.enableCoreExtensions[ext.name] !== false;
+            }
+            return true;
+        }) : [];
         const allExtensions = [...coreExtensions, ...this.options.extensions].filter(extension => {
             return ['extension', 'node', 'mark'].includes(extension === null || extension === void 0 ? void 0 : extension.type);
         });
@@ -4762,6 +4827,9 @@ class NodeView {
         this.extension = props.extension;
         this.node = props.node;
         this.decorations = props.decorations;
+        this.innerDecorations = props.innerDecorations;
+        this.view = props.view;
+        this.HTMLAttributes = props.HTMLAttributes;
         this.getPos = props.getPos;
         this.mount();
     }
@@ -4800,9 +4868,13 @@ class NodeView {
             y = handleBox.y - domBox.y + offsetY;
         }
         (_g = event.dataTransfer) === null || _g === void 0 ? void 0 : _g.setDragImage(this.dom, x, y);
+        const pos = this.getPos();
+        if (typeof pos !== 'number') {
+            return;
+        }
         // we need to tell ProseMirror that we want to move the whole node
         // so we create a NodeSelection
-        const selection = NodeSelection.create(view.state.doc, this.getPos());
+        const selection = NodeSelection.create(view.state.doc, pos);
         const transaction = view.state.tr.setSelection(selection);
         view.dispatch(transaction);
     }
@@ -4873,6 +4945,11 @@ class NodeView {
         }
         return true;
     }
+    /**
+     * Called when a DOM [mutation](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver) or a selection change happens within the view.
+     * @return `false` if the editor should re-read the selection or re-parse the range around the mutation
+     * @return `true` if it can safely be ignored.
+     */
     ignoreMutation(mutation) {
         if (!this.dom || !this.contentDOM) {
             return true;
@@ -4919,9 +4996,15 @@ class NodeView {
         }
         return true;
     }
+    /**
+     * Update the attributes of the prosemirror node.
+     */
     updateAttributes(attributes) {
         this.editor.commands.command(({ tr }) => {
             const pos = this.getPos();
+            if (typeof pos !== 'number') {
+                return false;
+            }
             tr.setNodeMarkup(pos, undefined, {
                 ...this.node.attrs,
                 ...attributes,
@@ -4929,8 +5012,14 @@ class NodeView {
             return true;
         });
     }
+    /**
+     * Delete the node.
+     */
     deleteNode() {
         const from = this.getPos();
+        if (typeof from !== 'number') {
+            return;
+        }
         const to = from + this.node.nodeSize;
         this.editor.commands.deleteRange({ from, to });
     }
@@ -5065,5 +5154,5 @@ class Tracker {
     }
 }
 
-export { CommandManager, Editor, Extension, InputRule, Mark, Node, NodePos, NodeView, PasteRule, Tracker, callOrReturn, combineTransactionSteps, createChainableState, createDocument, createNodeFromContent, createStyleTag, defaultBlockAt, deleteProps, elementFromString, escapeForRegEx, index as extensions, findChildren, findChildrenInRange, findDuplicates, findParentNode, findParentNodeClosestToPos, fromString, generateHTML, generateJSON, generateText, getAttributes, getAttributesFromExtensions, getChangedRanges, getDebugJSON, getExtensionField, getHTMLFromFragment, getMarkAttributes, getMarkRange, getMarkType, getMarksBetween, getNodeAtPosition, getNodeAttributes, getNodeType, getRenderedAttributes, getSchema, getSchemaByResolvedExtensions, getSchemaTypeByName, getSchemaTypeNameByName, getSplittedAttributes, getText, getTextBetween, getTextContentFromNodes, getTextSerializersFromSchema, injectExtensionAttributesToParseRule, inputRulesPlugin, isActive, isAtEndOfNode, isAtStartOfNode, isEmptyObject, isExtensionRulesEnabled, isFunction, isList, isMacOS, isMarkActive, isNodeActive, isNodeEmpty, isNodeSelection, isNumber, isPlainObject, isRegExp, isString, isTextSelection, isiOS, markInputRule, markPasteRule, mergeAttributes, mergeDeep, minMax, nodeInputRule, nodePasteRule, objectIncludes, pasteRulesPlugin, posToDOMRect, removeDuplicates, resolveFocusPosition, selectionToInsertionEnd, splitExtensions, textInputRule, textPasteRule, textblockTypeInputRule, wrappingInputRule };
+export { CommandManager, DropPlugin, Editor, Extension, InputRule, Mark, Node, NodePos, NodeView, PastePlugin, PasteRule, Tracker, callOrReturn, combineTransactionSteps, createChainableState, createDocument, createNodeFromContent, createStyleTag, defaultBlockAt, deleteProps, elementFromString, escapeForRegEx, index as extensions, findChildren, findChildrenInRange, findDuplicates, findParentNode, findParentNodeClosestToPos, fromString, generateHTML, generateJSON, generateText, getAttributes, getAttributesFromExtensions, getChangedRanges, getDebugJSON, getExtensionField, getHTMLFromFragment, getMarkAttributes, getMarkRange, getMarkType, getMarksBetween, getNodeAtPosition, getNodeAttributes, getNodeType, getRenderedAttributes, getSchema, getSchemaByResolvedExtensions, getSchemaTypeByName, getSchemaTypeNameByName, getSplittedAttributes, getText, getTextBetween, getTextContentFromNodes, getTextSerializersFromSchema, injectExtensionAttributesToParseRule, inputRulesPlugin, isActive, isAtEndOfNode, isAtStartOfNode, isEmptyObject, isExtensionRulesEnabled, isFunction, isList, isMacOS, isMarkActive, isNodeActive, isNodeEmpty, isNodeSelection, isNumber, isPlainObject, isRegExp, isString, isTextSelection, isiOS, markInputRule, markPasteRule, mergeAttributes, mergeDeep, minMax, nodeInputRule, nodePasteRule, objectIncludes, pasteRulesPlugin, posToDOMRect, removeDuplicates, resolveFocusPosition, selectionToInsertionEnd, splitExtensions, textInputRule, textPasteRule, textblockTypeInputRule, wrappingInputRule };
 //# sourceMappingURL=index.js.map