@tiptap/core 2.1.0-rc.12 → 2.1.0-rc.13

package/dist/index.js

@@ -2,7 +2,7 @@ import { Plugin, PluginKey, TextSelection, Selection, NodeSelection, EditorState
 import { EditorView } from '@tiptap/pm/view';
 import { keymap } from '@tiptap/pm/keymap';
 import { Schema, Fragment, DOMParser, DOMSerializer, Node as Node$1, Slice } from '@tiptap/pm/model';
-import { liftTarget, ReplaceStep, ReplaceAroundStep, Transform, canSplit, canJoin, findWrapping } from '@tiptap/pm/transform';
+import { liftTarget, ReplaceStep, ReplaceAroundStep, joinPoint, Transform, canSplit, canJoin, findWrapping } from '@tiptap/pm/transform';
 import { createParagraphNear as createParagraphNear$1, deleteSelection as deleteSelection$1, exitCode as exitCode$1, joinUp as joinUp$1, joinDown as joinDown$1, joinBackward as joinBackward$1, joinForward as joinForward$1, lift as lift$1, liftEmptyBlock as liftEmptyBlock$1, newlineInCode as newlineInCode$1, selectNodeBackward as selectNodeBackward$1, selectNodeForward as selectNodeForward$1, selectParentNode as selectParentNode$1, selectTextblockEnd as selectTextblockEnd$1, selectTextblockStart as selectTextblockStart$1, setBlockType, wrapIn as wrapIn$1 } from '@tiptap/pm/commands';
 import { liftListItem as liftListItem$1, sinkListItem as sinkListItem$1, wrapInList as wrapInList$1 } from '@tiptap/pm/schema-list';
 
@@ -1305,17 +1305,14 @@ const createParagraphNear = () => ({ state, dispatch }) => {
     return createParagraphNear$1(state, dispatch);
 };
 
-const cut = (originRange, targetPos) => ({ editor }) => {
+const cut = (originRange, targetPos) => ({ editor, tr }) => {
     const { state } = editor;
     const contentSlice = state.doc.slice(originRange.from, originRange.to);
-    return editor
-        .chain()
-        .deleteRange(originRange)
-        .command(({ commands, tr }) => {
-        return commands.insertContentAt(tr.mapping.map(targetPos), contentSlice.content.toJSON());
-    })
-        .focus()
-        .run();
+    tr.deleteRange(originRange.from, originRange.to);
+    const newPos = tr.mapping.map(targetPos);
+    tr.insert(newPos, contentSlice.content);
+    tr.setSelection(new TextSelection(tr.doc.resolve(newPos - 1)));
+    return true;
 };
 
 const deleteCurrentNode = () => ({ tr, dispatch }) => {
@@ -1709,6 +1706,40 @@ const joinForward = () => ({ state, dispatch }) => {
     return joinForward$1(state, dispatch);
 };
 
+const joinItemBackward = () => ({ tr, state, dispatch, }) => {
+    try {
+        const point = joinPoint(state.doc, state.selection.$from.pos, -1);
+        if (point === null || point === undefined) {
+            return false;
+        }
+        tr.join(point, 2);
+        if (dispatch) {
+            dispatch(tr);
+        }
+        return true;
+    }
+    catch {
+        return false;
+    }
+};
+
+const joinItemForward = () => ({ state, dispatch, tr, }) => {
+    try {
+        const point = joinPoint(state.doc, state.selection.$from.pos, +1);
+        if (point === null || point === undefined) {
+            return false;
+        }
+        tr.join(point, 2);
+        if (dispatch) {
+            dispatch(tr);
+        }
+        return true;
+    }
+    catch (e) {
+        return false;
+    }
+};
+
 function isMacOS() {
     return typeof navigator !== 'undefined'
         ? /Mac/.test(navigator.platform)
@@ -1977,6 +2008,261 @@ function getMarkAttributes(state, typeOrName) {
     return { ...mark.attrs };
 }
 
+const findListItemPos = (typeOrName, state) => {
+    const { $from } = state.selection;
+    const nodeType = getNodeType(typeOrName, state.schema);
+    let currentNode = null;
+    let currentDepth = $from.depth;
+    let currentPos = $from.pos;
+    let targetDepth = null;
+    while (currentDepth > 0 && targetDepth === null) {
+        currentNode = $from.node(currentDepth);
+        if (currentNode.type === nodeType) {
+            targetDepth = currentDepth;
+        }
+        else {
+            currentDepth -= 1;
+            currentPos -= 1;
+        }
+    }
+    if (targetDepth === null) {
+        return null;
+    }
+    return { $pos: state.doc.resolve(currentPos), depth: targetDepth };
+};
+
+/**
+ * Finds the first node of a given type or name in the current selection.
+ * @param state The editor state.
+ * @param typeOrName The node type or name.
+ * @param pos The position to start searching from.
+ * @param maxDepth The maximum depth to search.
+ * @returns The node and the depth as an array.
+ */
+const getNodeAtPosition = (state, typeOrName, pos, maxDepth = 20) => {
+    const $pos = state.doc.resolve(pos);
+    let currentDepth = maxDepth;
+    let node = null;
+    while (currentDepth > 0 && node === null) {
+        const currentNode = $pos.node(currentDepth);
+        if ((currentNode === null || currentNode === void 0 ? void 0 : currentNode.type.name) === typeOrName) {
+            node = currentNode;
+        }
+        else {
+            currentDepth -= 1;
+        }
+    }
+    return [node, currentDepth];
+};
+
+const getNextListDepth = (typeOrName, state) => {
+    const listItemPos = findListItemPos(typeOrName, state);
+    if (!listItemPos) {
+        return false;
+    }
+    const [, depth] = getNodeAtPosition(state, typeOrName, listItemPos.$pos.pos + 4);
+    return depth;
+};
+
+const isAtStartOfNode = (state) => {
+    const { $from, $to } = state.selection;
+    if ($from.parentOffset > 0 || $from.pos !== $to.pos) {
+        return false;
+    }
+    return true;
+};
+
+const hasListBefore = (editorState, name, parentListTypes) => {
+    const { $anchor } = editorState.selection;
+    const previousNodePos = Math.max(0, $anchor.pos - 2);
+    const previousNode = editorState.doc.resolve(previousNodePos).node();
+    if (!previousNode || !parentListTypes.includes(previousNode.type.name)) {
+        return false;
+    }
+    return true;
+};
+
+const hasListItemBefore = (typeOrName, state) => {
+    var _a;
+    const { $anchor } = state.selection;
+    const $targetPos = state.doc.resolve($anchor.pos - 2);
+    if ($targetPos.index() === 0) {
+        return false;
+    }
+    if (((_a = $targetPos.nodeBefore) === null || _a === void 0 ? void 0 : _a.type.name) !== typeOrName) {
+        return false;
+    }
+    return true;
+};
+
+const listItemHasSubList = (typeOrName, state, node) => {
+    if (!node) {
+        return false;
+    }
+    const nodeType = getNodeType(typeOrName, state.schema);
+    let hasSubList = false;
+    node.descendants(child => {
+        if (child.type === nodeType) {
+            hasSubList = true;
+        }
+    });
+    return hasSubList;
+};
+
+const handleBackspace = (editor, name, parentListTypes) => {
+    // this is required to still handle the undo handling
+    if (editor.commands.undoInputRule()) {
+        return true;
+    }
+    // if the current item is NOT inside a list item &
+    // the previous item is a list (orderedList or bulletList)
+    // move the cursor into the list and delete the current item
+    if (!isNodeActive(editor.state, name) && hasListBefore(editor.state, name, parentListTypes)) {
+        const { $anchor } = editor.state.selection;
+        const $listPos = editor.state.doc.resolve($anchor.before() - 1);
+        const listDescendants = [];
+        $listPos.node().descendants((node, pos) => {
+            if (node.type.name === name) {
+                listDescendants.push({ node, pos });
+            }
+        });
+        const lastItem = listDescendants.at(-1);
+        if (!lastItem) {
+            return false;
+        }
+        const $lastItemPos = editor.state.doc.resolve($listPos.start() + lastItem.pos + 1);
+        return editor.chain().cut({ from: $anchor.start() - 1, to: $anchor.end() + 1 }, $lastItemPos.end()).joinForward().run();
+    }
+    // if the cursor is not inside the current node type
+    // do nothing and proceed
+    if (!isNodeActive(editor.state, name)) {
+        return false;
+    }
+    // if the cursor is not at the start of a node
+    // do nothing and proceed
+    if (!isAtStartOfNode(editor.state)) {
+        return false;
+    }
+    const listItemPos = findListItemPos(name, editor.state);
+    if (!listItemPos) {
+        return false;
+    }
+    const $prev = editor.state.doc.resolve(listItemPos.$pos.pos - 2);
+    const prevNode = $prev.node(listItemPos.depth);
+    const previousListItemHasSubList = listItemHasSubList(name, editor.state, prevNode);
+    // if the previous item is a list item and doesn't have a sublist, join the list items
+    if (hasListItemBefore(name, editor.state) && !previousListItemHasSubList) {
+        return editor.commands.joinItemBackward();
+    }
+    // otherwise in the end, a backspace should
+    // always just lift the list item if
+    // joining / merging is not possible
+    return editor.chain().liftListItem(name).run();
+};
+
+function findParentNodeClosestToPos($pos, predicate) {
+    for (let i = $pos.depth; i > 0; i -= 1) {
+        const node = $pos.node(i);
+        if (predicate(node)) {
+            return {
+                pos: i > 0 ? $pos.before(i) : 0,
+                start: $pos.start(i),
+                depth: i,
+                node,
+            };
+        }
+    }
+}
+
+function findParentNode(predicate) {
+    return (selection) => findParentNodeClosestToPos(selection.$from, predicate);
+}
+
+const isAtEndOfNode = (state, nodeType) => {
+    const { $from, $to, $anchor } = state.selection;
+    if (nodeType) {
+        const parentNode = findParentNode(node => node.type.name === nodeType)(state.selection);
+        if (!parentNode) {
+            return false;
+        }
+        const $parentPos = state.doc.resolve(parentNode.pos + 1);
+        if ($anchor.pos + 1 === $parentPos.end()) {
+            return true;
+        }
+        return false;
+    }
+    if ($to.parentOffset < $to.parent.nodeSize - 2 || $from.pos !== $to.pos) {
+        return false;
+    }
+    return true;
+};
+
+const nextListIsDeeper = (typeOrName, state) => {
+    const listDepth = getNextListDepth(typeOrName, state);
+    const listItemPos = findListItemPos(typeOrName, state);
+    if (!listItemPos || !listDepth) {
+        return false;
+    }
+    if (listDepth > listItemPos.depth) {
+        return true;
+    }
+    return false;
+};
+
+const nextListIsHigher = (typeOrName, state) => {
+    const listDepth = getNextListDepth(typeOrName, state);
+    const listItemPos = findListItemPos(typeOrName, state);
+    if (!listItemPos || !listDepth) {
+        return false;
+    }
+    if (listDepth < listItemPos.depth) {
+        return true;
+    }
+    return false;
+};
+
+const handleDelete = (editor, name) => {
+    // if the cursor is not inside the current node type
+    // do nothing and proceed
+    if (!isNodeActive(editor.state, name)) {
+        return false;
+    }
+    // if the cursor is not at the end of a node
+    // do nothing and proceed
+    if (!isAtEndOfNode(editor.state, name)) {
+        return false;
+    }
+    // check if the next node is a list with a deeper depth
+    if (nextListIsDeeper(name, editor.state)) {
+        return editor
+            .chain()
+            .focus(editor.state.selection.from + 4)
+            .lift(name)
+            .joinBackward()
+            .run();
+    }
+    if (nextListIsHigher(name, editor.state)) {
+        return editor.chain()
+            .joinForward()
+            .joinBackward()
+            .run();
+    }
+    return editor.commands.joinItemForward();
+};
+
+const hasListItemAfter = (typeOrName, state) => {
+    var _a;
+    const { $anchor } = state.selection;
+    const $targetPos = state.doc.resolve($anchor.pos - $anchor.parentOffset - 2);
+    if ($targetPos.index() === $targetPos.parent.childCount - 1) {
+        return false;
+    }
+    if (((_a = $targetPos.nodeAfter) === null || _a === void 0 ? void 0 : _a.type.name) !== typeOrName) {
+        return false;
+    }
+    return true;
+};
+
 /**
  * Returns a new `Transform` based on all steps of the passed transactions.
  */
@@ -2038,24 +2324,6 @@ function findChildrenInRange(node, range, predicate) {
     return nodesWithPos;
 }
 
-function findParentNodeClosestToPos($pos, predicate) {
-    for (let i = $pos.depth; i > 0; i -= 1) {
-        const node = $pos.node(i);
-        if (predicate(node)) {
-            return {
-                pos: i > 0 ? $pos.before(i) : 0,
-                start: $pos.start(i),
-                depth: i,
-                node,
-            };
-        }
-    }
-}
-
-function findParentNode(predicate) {
-    return (selection) => findParentNodeClosestToPos(selection.$from, predicate);
-}
-
 function getHTMLFromFragment(fragment, schema) {
     const documentFragment = DOMSerializer.fromSchema(schema).serializeFragment(fragment);
     const temporaryDocument = document.implementation.createHTMLDocument();
@@ -2273,30 +2541,6 @@ function getMarksBetween(from, to, doc) {
     return marks;
 }
 
-/**
- * Finds the first node of a given type or name in the current selection.
- * @param state The editor state.
- * @param typeOrName The node type or name.
- * @param pos The position to start searching from.
- * @param maxDepth The maximum depth to search.
- * @returns The node and the depth as an array.
- */
-const getNodeAtPosition = (state, typeOrName, pos, maxDepth = 20) => {
-    const $pos = state.doc.resolve(pos);
-    let currentDepth = maxDepth;
-    let node = null;
-    while (currentDepth > 0 && node === null) {
-        const currentNode = $pos.node(currentDepth);
-        if ((currentNode === null || currentNode === void 0 ? void 0 : currentNode.type.name) === typeOrName) {
-            node = currentNode;
-        }
-        else {
-            currentDepth -= 1;
-        }
-    }
-    return [node, currentDepth];
-};
-
 function getSplittedAttributes(extensionAttributes, typeName, attributes) {
     return Object.fromEntries(Object
         .entries(attributes)
@@ -2387,22 +2631,6 @@ function isActive(state, name, attributes = {}) {
     return false;
 }
 
-const istAtEndOfNode = (state) => {
-    const { $from, $to } = state.selection;
-    if ($to.parentOffset < $to.parent.nodeSize - 2 || $from.pos !== $to.pos) {
-        return false;
-    }
-    return true;
-};
-
-const isAtStartOfNode = (state) => {
-    const { $from, $to } = state.selection;
-    if ($from.parentOffset > 0 || $from.pos !== $to.pos) {
-        return false;
-    }
-    return true;
-};
-
 function isList(name, extensions) {
     const { nodeExtensions } = splitExtensions(extensions);
     const extension = nodeExtensions.find(item => item.name === name);
@@ -3027,6 +3255,8 @@ var commands = /*#__PURE__*/Object.freeze({
   joinDown: joinDown,
   joinBackward: joinBackward,
   joinForward: joinForward,
+  joinItemBackward: joinItemBackward,
+  joinItemForward: joinItemForward,
   keyboardShortcut: keyboardShortcut,
   lift: lift,
   liftEmptyBlock: liftEmptyBlock,
@@ -3328,8 +3558,8 @@ img.ProseMirror-separator {
   opacity: 0
 }`;
 
-function createStyleTag(style, nonce) {
-    const tiptapStyleTag = document.querySelector('style[data-tiptap-style]');
+function createStyleTag(style, nonce, suffix) {
+    const tiptapStyleTag = document.querySelector(`style[data-tiptap-style${suffix ? `-${suffix}` : ''}]`);
     if (tiptapStyleTag !== null) {
         return tiptapStyleTag;
     }
@@ -3337,7 +3567,7 @@ function createStyleTag(style, nonce) {
     if (nonce) {
         styleNode.setAttribute('nonce', nonce);
     }
-    styleNode.setAttribute('data-tiptap-style', '');
+    styleNode.setAttribute(`data-tiptap-style${suffix ? `-${suffix}` : ''}`, '');
     styleNode.innerHTML = style;
     document.getElementsByTagName('head')[0].appendChild(styleNode);
     return styleNode;
@@ -3750,10 +3980,12 @@ function nodeInputRule(config) {
     return new InputRule({
         find: config.find,
         handler: ({ state, range, match }) => {
+            var _a;
             const attributes = callOrReturn(config.getAttributes, undefined, match) || {};
             const { tr } = state;
-            const start = range.from;
+            const start = config.blockReplace ? range.from - 1 : range.from;
             let end = range.to;
+            const newNode = config.type.create(attributes);
             if (match[1]) {
                 const offset = match[0].lastIndexOf(match[1]);
                 let matchStart = start + offset;
@@ -3767,10 +3999,26 @@ function nodeInputRule(config) {
                 const lastChar = match[0][match[0].length - 1];
                 tr.insertText(lastChar, start + match[0].length - 1);
                 // insert node from input rule
-                tr.replaceWith(matchStart, end, config.type.create(attributes));
+                tr.replaceWith(matchStart, end, newNode);
             }
             else if (match[0]) {
-                tr.replaceWith(start, end, config.type.create(attributes));
+                tr.replaceWith(start, end, newNode);
+            }
+            if (config.blockReplace && config.addExtraNewline) {
+                const { $to } = tr.selection;
+                const posAfter = $to.end();
+                if ($to.nodeAfter) {
+                    tr.setSelection(TextSelection.create(tr.doc, $to.pos));
+                }
+                else {
+                    // add node after horizontal rule if it’s the end of the document
+                    const node = (_a = $to.parent.type.contentMatch.defaultType) === null || _a === void 0 ? void 0 : _a.create();
+                    if (node) {
+                        tr.insert(posAfter, node);
+                        tr.setSelection(TextSelection.create(tr.doc, posAfter));
+                    }
+                }
+                tr.scrollIntoView();
             }
         },
     });
@@ -4337,5 +4585,5 @@ class Tracker {
     }
 }
 
-export { CommandManager, Editor, Extension, InputRule, Mark, Node, NodeView, PasteRule, Tracker, callOrReturn, combineTransactionSteps, createChainableState, createDocument, createNodeFromContent, createStyleTag, defaultBlockAt, deleteProps, elementFromString, escapeForRegEx, 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, isAtStartOfNode, isEmptyObject, isExtensionRulesEnabled, isFunction, isList, isMacOS, isMarkActive, isNodeActive, isNodeEmpty, isNodeSelection, isNumber, isPlainObject, isRegExp, isString, isTextSelection, isiOS, istAtEndOfNode, markInputRule, markPasteRule, mergeAttributes, mergeDeep, minMax, nodeInputRule, nodePasteRule, objectIncludes, pasteRulesPlugin, posToDOMRect, removeDuplicates, resolveFocusPosition, selectionToInsertionEnd, splitExtensions, textInputRule, textPasteRule, textblockTypeInputRule, wrappingInputRule };
+export { CommandManager, Editor, Extension, InputRule, Mark, Node, NodeView, PasteRule, Tracker, callOrReturn, combineTransactionSteps, createChainableState, createDocument, createNodeFromContent, createStyleTag, defaultBlockAt, deleteProps, elementFromString, escapeForRegEx, extensions, findChildren, findChildrenInRange, findDuplicates, findListItemPos, findParentNode, findParentNodeClosestToPos, fromString, generateHTML, generateJSON, generateText, getAttributes, getAttributesFromExtensions, getChangedRanges, getDebugJSON, getExtensionField, getHTMLFromFragment, getMarkAttributes, getMarkRange, getMarkType, getMarksBetween, getNextListDepth, getNodeAtPosition, getNodeAttributes, getNodeType, getRenderedAttributes, getSchema, getSchemaByResolvedExtensions, getSchemaTypeByName, getSchemaTypeNameByName, getSplittedAttributes, getText, getTextBetween, getTextContentFromNodes, getTextSerializersFromSchema, handleBackspace, handleDelete, hasListBefore, hasListItemAfter, hasListItemBefore, injectExtensionAttributesToParseRule, inputRulesPlugin, isActive, isAtEndOfNode, isAtStartOfNode, isEmptyObject, isExtensionRulesEnabled, isFunction, isList, isMacOS, isMarkActive, isNodeActive, isNodeEmpty, isNodeSelection, isNumber, isPlainObject, isRegExp, isString, isTextSelection, isiOS, listItemHasSubList, markInputRule, markPasteRule, mergeAttributes, mergeDeep, minMax, nextListIsDeeper, nextListIsHigher, nodeInputRule, nodePasteRule, objectIncludes, pasteRulesPlugin, posToDOMRect, removeDuplicates, resolveFocusPosition, selectionToInsertionEnd, splitExtensions, textInputRule, textPasteRule, textblockTypeInputRule, wrappingInputRule };
 //# sourceMappingURL=index.js.map