@tiptap/core 3.0.0 → 3.0.1

package/src/commands/toggleList.ts

@@ -1,11 +1,11 @@
-import { NodeType } from '@tiptap/pm/model'
-import { Transaction } from '@tiptap/pm/state'
+import type { NodeType } from '@tiptap/pm/model'
+import type { Transaction } from '@tiptap/pm/state'
 import { canJoin } from '@tiptap/pm/transform'
 
 import { findParentNode } from '../helpers/findParentNode.js'
 import { getNodeType } from '../helpers/getNodeType.js'
 import { isList } from '../helpers/isList.js'
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 const joinListBackwards = (tr: Transaction, listType: NodeType): boolean => {
   const list = findParentNode(node => node.type === listType)(tr.selection)
@@ -68,90 +68,92 @@ declare module '@tiptap/core' {
        * @param attributes Attributes for the new list.
        * @example editor.commands.toggleList('bulletList', 'listItem')
        */
-      toggleList: (listTypeOrName: string | NodeType, itemTypeOrName: string | NodeType, keepMarks?: boolean, attributes?: Record<string, any>) => ReturnType;
+      toggleList: (
+        listTypeOrName: string | NodeType,
+        itemTypeOrName: string | NodeType,
+        keepMarks?: boolean,
+        attributes?: Record<string, any>,
+      ) => ReturnType
     }
   }
 }
 
-export const toggleList: RawCommands['toggleList'] = (listTypeOrName, itemTypeOrName, keepMarks, attributes = {}) => ({
-  editor, tr, state, dispatch, chain, commands, can,
-}) => {
-  const { extensions, splittableMarks } = editor.extensionManager
-  const listType = getNodeType(listTypeOrName, state.schema)
-  const itemType = getNodeType(itemTypeOrName, state.schema)
-  const { selection, storedMarks } = state
-  const { $from, $to } = selection
-  const range = $from.blockRange($to)
+export const toggleList: RawCommands['toggleList'] =
+  (listTypeOrName, itemTypeOrName, keepMarks, attributes = {}) =>
+  ({ editor, tr, state, dispatch, chain, commands, can }) => {
+    const { extensions, splittableMarks } = editor.extensionManager
+    const listType = getNodeType(listTypeOrName, state.schema)
+    const itemType = getNodeType(itemTypeOrName, state.schema)
+    const { selection, storedMarks } = state
+    const { $from, $to } = selection
+    const range = $from.blockRange($to)
 
-  const marks = storedMarks || (selection.$to.parentOffset && selection.$from.marks())
+    const marks = storedMarks || (selection.$to.parentOffset && selection.$from.marks())
 
-  if (!range) {
-    return false
-  }
-
-  const parentList = findParentNode(node => isList(node.type.name, extensions))(selection)
+    if (!range) {
+      return false
+    }
 
-  if (range.depth >= 1 && parentList && range.depth - parentList.depth <= 1) {
-    // remove list
-    if (parentList.node.type === listType) {
-      return commands.liftListItem(itemType)
+    const parentList = findParentNode(node => isList(node.type.name, extensions))(selection)
+
+    if (range.depth >= 1 && parentList && range.depth - parentList.depth <= 1) {
+      // remove list
+      if (parentList.node.type === listType) {
+        return commands.liftListItem(itemType)
+      }
+
+      // change list type
+      if (isList(parentList.node.type.name, extensions) && listType.validContent(parentList.node.content) && dispatch) {
+        return chain()
+          .command(() => {
+            tr.setNodeMarkup(parentList.pos, listType)
+
+            return true
+          })
+          .command(() => joinListBackwards(tr, listType))
+          .command(() => joinListForwards(tr, listType))
+          .run()
+      }
+    }
+    if (!keepMarks || !marks || !dispatch) {
+      return (
+        chain()
+          // try to convert node to default node if needed
+          .command(() => {
+            const canWrapInList = can().wrapInList(listType, attributes)
+
+            if (canWrapInList) {
+              return true
+            }
+
+            return commands.clearNodes()
+          })
+          .wrapInList(listType, attributes)
+          .command(() => joinListBackwards(tr, listType))
+          .command(() => joinListForwards(tr, listType))
+          .run()
+      )
     }
 
-    // change list type
-    if (
-      isList(parentList.node.type.name, extensions)
-        && listType.validContent(parentList.node.content)
-        && dispatch
-    ) {
-      return chain()
+    return (
+      chain()
+        // try to convert node to default node if needed
         .command(() => {
-          tr.setNodeMarkup(parentList.pos, listType)
+          const canWrapInList = can().wrapInList(listType, attributes)
 
-          return true
+          const filteredMarks = marks.filter(mark => splittableMarks.includes(mark.type.name))
+
+          tr.ensureMarks(filteredMarks)
+
+          if (canWrapInList) {
+            return true
+          }
+
+          return commands.clearNodes()
         })
+        .wrapInList(listType, attributes)
         .command(() => joinListBackwards(tr, listType))
         .command(() => joinListForwards(tr, listType))
         .run()
-    }
+    )
   }
-  if (!keepMarks || !marks || !dispatch) {
-
-    return chain()
-      // try to convert node to default node if needed
-      .command(() => {
-        const canWrapInList = can().wrapInList(listType, attributes)
-
-        if (canWrapInList) {
-          return true
-        }
-
-        return commands.clearNodes()
-      })
-      .wrapInList(listType, attributes)
-      .command(() => joinListBackwards(tr, listType))
-      .command(() => joinListForwards(tr, listType))
-      .run()
-  }
-
-  return (
-    chain()
-    // try to convert node to default node if needed
-      .command(() => {
-        const canWrapInList = can().wrapInList(listType, attributes)
-
-        const filteredMarks = marks.filter(mark => splittableMarks.includes(mark.type.name))
-
-        tr.ensureMarks(filteredMarks)
-
-        if (canWrapInList) {
-          return true
-        }
-
-        return commands.clearNodes()
-      })
-      .wrapInList(listType, attributes)
-      .command(() => joinListBackwards(tr, listType))
-      .command(() => joinListForwards(tr, listType))
-      .run()
-  )
-}

package/src/commands/toggleMark.ts

@@ -1,8 +1,8 @@
-import { MarkType } from '@tiptap/pm/model'
+import type { MarkType } from '@tiptap/pm/model'
 
 import { getMarkType } from '../helpers/getMarkType.js'
 import { isMarkActive } from '../helpers/isMarkActive.js'
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
@@ -36,14 +36,16 @@ declare module '@tiptap/core' {
   }
 }
 
-export const toggleMark: RawCommands['toggleMark'] = (typeOrName, attributes = {}, options = {}) => ({ state, commands }) => {
-  const { extendEmptyMarkRange = false } = options
-  const type = getMarkType(typeOrName, state.schema)
-  const isActive = isMarkActive(state, type, attributes)
+export const toggleMark: RawCommands['toggleMark'] =
+  (typeOrName, attributes = {}, options = {}) =>
+  ({ state, commands }) => {
+    const { extendEmptyMarkRange = false } = options
+    const type = getMarkType(typeOrName, state.schema)
+    const isActive = isMarkActive(state, type, attributes)
 
-  if (isActive) {
-    return commands.unsetMark(type, { extendEmptyMarkRange })
-  }
+    if (isActive) {
+      return commands.unsetMark(type, { extendEmptyMarkRange })
+    }
 
-  return commands.setMark(type, attributes)
-}
+    return commands.setMark(type, attributes)
+  }

package/src/commands/toggleNode.ts

@@ -1,8 +1,8 @@
-import { NodeType } from '@tiptap/pm/model'
+import type { NodeType } from '@tiptap/pm/model'
 
 import { getNodeType } from '../helpers/getNodeType.js'
 import { isNodeActive } from '../helpers/isNodeActive.js'
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
@@ -23,14 +23,25 @@ declare module '@tiptap/core' {
   }
 }
 
-export const toggleNode: RawCommands['toggleNode'] = (typeOrName, toggleTypeOrName, attributes = {}) => ({ state, commands }) => {
-  const type = getNodeType(typeOrName, state.schema)
-  const toggleType = getNodeType(toggleTypeOrName, state.schema)
-  const isActive = isNodeActive(state, type, attributes)
+export const toggleNode: RawCommands['toggleNode'] =
+  (typeOrName, toggleTypeOrName, attributes = {}) =>
+  ({ state, commands }) => {
+    const type = getNodeType(typeOrName, state.schema)
+    const toggleType = getNodeType(toggleTypeOrName, state.schema)
+    const isActive = isNodeActive(state, type, attributes)
 
-  if (isActive) {
-    return commands.setNode(toggleType)
-  }
+    let attributesToCopy: Record<string, any> | undefined
 
-  return commands.setNode(type, attributes)
-}
+    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, attributesToCopy)
+    }
+
+    // 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 })
+  }

package/src/commands/toggleWrap.ts

@@ -1,8 +1,8 @@
-import { NodeType } from '@tiptap/pm/model'
+import type { NodeType } from '@tiptap/pm/model'
 
 import { getNodeType } from '../helpers/getNodeType.js'
 import { isNodeActive } from '../helpers/isNodeActive.js'
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
@@ -18,13 +18,15 @@ declare module '@tiptap/core' {
   }
 }
 
-export const toggleWrap: RawCommands['toggleWrap'] = (typeOrName, attributes = {}) => ({ state, commands }) => {
-  const type = getNodeType(typeOrName, state.schema)
-  const isActive = isNodeActive(state, type, attributes)
+export const toggleWrap: RawCommands['toggleWrap'] =
+  (typeOrName, attributes = {}) =>
+  ({ state, commands }) => {
+    const type = getNodeType(typeOrName, state.schema)
+    const isActive = isNodeActive(state, type, attributes)
 
-  if (isActive) {
-    return commands.lift(type)
-  }
+    if (isActive) {
+      return commands.lift(type)
+    }
 
-  return commands.wrapIn(type, attributes)
-}
+    return commands.wrapIn(type, attributes)
+  }

package/src/commands/undoInputRule.ts

@@ -1,4 +1,4 @@
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
@@ -7,41 +7,43 @@ declare module '@tiptap/core' {
        * Undo an input rule.
        * @example editor.commands.undoInputRule()
        */
-      undoInputRule: () => ReturnType,
+      undoInputRule: () => ReturnType
     }
   }
 }
 
-export const undoInputRule: RawCommands['undoInputRule'] = () => ({ state, dispatch }) => {
-  const plugins = state.plugins
-
-  for (let i = 0; i < plugins.length; i += 1) {
-    const plugin = plugins[i]
-    let undoable
-
-    // @ts-ignore
-    // eslint-disable-next-line
-    if (plugin.spec.isInputRules && (undoable = plugin.getState(state))) {
-      if (dispatch) {
-        const tr = state.tr
-        const toUndo = undoable.transform
-
-        for (let j = toUndo.steps.length - 1; j >= 0; j -= 1) {
-          tr.step(toUndo.steps[j].invert(toUndo.docs[j]))
+export const undoInputRule: RawCommands['undoInputRule'] =
+  () =>
+  ({ state, dispatch }) => {
+    const plugins = state.plugins
+
+    for (let i = 0; i < plugins.length; i += 1) {
+      const plugin = plugins[i]
+      let undoable
+
+      // @ts-ignore
+      // eslint-disable-next-line
+      if (plugin.spec.isInputRules && (undoable = plugin.getState(state))) {
+        if (dispatch) {
+          const tr = state.tr
+          const toUndo = undoable.transform
+
+          for (let j = toUndo.steps.length - 1; j >= 0; j -= 1) {
+            tr.step(toUndo.steps[j].invert(toUndo.docs[j]))
+          }
+
+          if (undoable.text) {
+            const marks = tr.doc.resolve(undoable.from).marks()
+
+            tr.replaceWith(undoable.from, undoable.to, state.schema.text(undoable.text, marks))
+          } else {
+            tr.delete(undoable.from, undoable.to)
+          }
         }
 
-        if (undoable.text) {
-          const marks = tr.doc.resolve(undoable.from).marks()
-
-          tr.replaceWith(undoable.from, undoable.to, state.schema.text(undoable.text, marks))
-        } else {
-          tr.delete(undoable.from, undoable.to)
-        }
+        return true
       }
-
-      return true
     }
-  }
 
-  return false
-}
+    return false
+  }

package/src/commands/unsetAllMarks.ts

@@ -1,4 +1,4 @@
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
@@ -7,24 +7,26 @@ declare module '@tiptap/core' {
        * Remove all marks in the current selection.
        * @example editor.commands.unsetAllMarks()
        */
-      unsetAllMarks: () => ReturnType,
+      unsetAllMarks: () => ReturnType
     }
   }
 }
 
-export const unsetAllMarks: RawCommands['unsetAllMarks'] = () => ({ tr, dispatch }) => {
-  const { selection } = tr
-  const { empty, ranges } = selection
+export const unsetAllMarks: RawCommands['unsetAllMarks'] =
+  () =>
+  ({ tr, dispatch }) => {
+    const { selection } = tr
+    const { empty, ranges } = selection
 
-  if (empty) {
-    return true
-  }
+    if (empty) {
+      return true
+    }
 
-  if (dispatch) {
-    ranges.forEach(range => {
-      tr.removeMark(range.$from.pos, range.$to.pos)
-    })
-  }
+    if (dispatch) {
+      ranges.forEach(range => {
+        tr.removeMark(range.$from.pos, range.$to.pos)
+      })
+    }
 
-  return true
-}
+    return true
+  }

package/src/commands/unsetMark.ts

@@ -1,8 +1,8 @@
-import { MarkType } from '@tiptap/pm/model'
+import type { MarkType } from '@tiptap/pm/model'
 
 import { getMarkRange } from '../helpers/getMarkRange.js'
 import { getMarkType } from '../helpers/getMarkType.js'
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
@@ -30,34 +30,36 @@ declare module '@tiptap/core' {
   }
 }
 
-export const unsetMark: RawCommands['unsetMark'] = (typeOrName, options = {}) => ({ tr, state, dispatch }) => {
-  const { extendEmptyMarkRange = false } = options
-  const { selection } = tr
-  const type = getMarkType(typeOrName, state.schema)
-  const { $from, empty, ranges } = selection
+export const unsetMark: RawCommands['unsetMark'] =
+  (typeOrName, options = {}) =>
+  ({ tr, state, dispatch }) => {
+    const { extendEmptyMarkRange = false } = options
+    const { selection } = tr
+    const type = getMarkType(typeOrName, state.schema)
+    const { $from, empty, ranges } = selection
 
-  if (!dispatch) {
-    return true
-  }
+    if (!dispatch) {
+      return true
+    }
 
-  if (empty && extendEmptyMarkRange) {
-    let { from, to } = selection
-    const attrs = $from.marks().find(mark => mark.type === type)?.attrs
-    const range = getMarkRange($from, type, attrs)
+    if (empty && extendEmptyMarkRange) {
+      let { from, to } = selection
+      const attrs = $from.marks().find(mark => mark.type === type)?.attrs
+      const range = getMarkRange($from, type, attrs)
 
-    if (range) {
-      from = range.from
-      to = range.to
-    }
+      if (range) {
+        from = range.from
+        to = range.to
+      }
 
-    tr.removeMark(from, to, type)
-  } else {
-    ranges.forEach(range => {
-      tr.removeMark(range.$from.pos, range.$to.pos, type)
-    })
-  }
+      tr.removeMark(from, to, type)
+    } else {
+      ranges.forEach(range => {
+        tr.removeMark(range.$from.pos, range.$to.pos, type)
+      })
+    }
 
-  tr.removeStoredMark(type)
+    tr.removeStoredMark(type)
 
-  return true
-}
+    return true
+  }

package/src/commands/updateAttributes.ts

@@ -1,9 +1,10 @@
-import { MarkType, NodeType } from '@tiptap/pm/model'
+import type { Mark, MarkType, Node, NodeType } from '@tiptap/pm/model'
+import type { SelectionRange } from '@tiptap/pm/state'
 
 import { getMarkType } from '../helpers/getMarkType.js'
 import { getNodeType } from '../helpers/getNodeType.js'
 import { getSchemaTypeNameByName } from '../helpers/getSchemaTypeNameByName.js'
-import { RawCommands } from '../types.js'
+import type { RawCommands } from '../types.js'
 
 declare module '@tiptap/core' {
   interface Commands<ReturnType> {
@@ -29,60 +30,111 @@ declare module '@tiptap/core' {
   }
 }
 
-export const updateAttributes: RawCommands['updateAttributes'] = (typeOrName, attributes = {}) => ({ tr, state, dispatch }) => {
-  let nodeType: NodeType | null = null
-  let markType: MarkType | null = null
+export const updateAttributes: RawCommands['updateAttributes'] =
+  (typeOrName, attributes = {}) =>
+  ({ tr, state, dispatch }) => {
+    let nodeType: NodeType | null = null
+    let markType: MarkType | null = null
 
-  const schemaType = getSchemaTypeNameByName(
-    typeof typeOrName === 'string' ? typeOrName : typeOrName.name,
-    state.schema,
-  )
+    const schemaType = getSchemaTypeNameByName(
+      typeof typeOrName === 'string' ? typeOrName : typeOrName.name,
+      state.schema,
+    )
 
-  if (!schemaType) {
-    return false
-  }
+    if (!schemaType) {
+      return false
+    }
 
-  if (schemaType === 'node') {
-    nodeType = getNodeType(typeOrName as NodeType, state.schema)
-  }
+    if (schemaType === 'node') {
+      nodeType = getNodeType(typeOrName as NodeType, state.schema)
+    }
 
-  if (schemaType === 'mark') {
-    markType = getMarkType(typeOrName as MarkType, state.schema)
-  }
+    if (schemaType === 'mark') {
+      markType = getMarkType(typeOrName as MarkType, state.schema)
+    }
+
+    if (dispatch) {
+      tr.selection.ranges.forEach((range: SelectionRange) => {
+        const from = range.$from.pos
+        const to = range.$to.pos
 
-  if (dispatch) {
-    tr.selection.ranges.forEach(range => {
-      const from = range.$from.pos
-      const to = range.$to.pos
+        let lastPos: number | undefined
+        let lastNode: Node | undefined
+        let trimmedFrom: number
+        let trimmedTo: number
 
-      state.doc.nodesBetween(from, to, (node, pos) => {
-        if (nodeType && nodeType === node.type) {
-          tr.setNodeMarkup(pos, undefined, {
-            ...node.attrs,
-            ...attributes,
+        if (tr.selection.empty) {
+          state.doc.nodesBetween(from, to, (node: Node, pos: number) => {
+            if (nodeType && nodeType === node.type) {
+              trimmedFrom = Math.max(pos, from)
+              trimmedTo = Math.min(pos + node.nodeSize, to)
+              lastPos = pos
+              lastNode = node
+            }
           })
-        }
+        } else {
+          state.doc.nodesBetween(from, to, (node: Node, pos: number) => {
+            if (pos < from && nodeType && nodeType === node.type) {
+              trimmedFrom = Math.max(pos, from)
+              trimmedTo = Math.min(pos + node.nodeSize, to)
+              lastPos = pos
+              lastNode = node
+            }
 
-        if (markType && node.marks.length) {
-          node.marks.forEach(mark => {
-            if (markType === mark.type) {
-              const trimmedFrom = Math.max(pos, from)
-              const trimmedTo = Math.min(pos + node.nodeSize, to)
-
-              tr.addMark(
-                trimmedFrom,
-                trimmedTo,
-                markType.create({
-                  ...mark.attrs,
+            if (pos >= from && pos <= to) {
+              if (nodeType && nodeType === node.type) {
+                tr.setNodeMarkup(pos, undefined, {
+                  ...node.attrs,
                   ...attributes,
-                }),
-              )
+                })
+              }
+
+              if (markType && node.marks.length) {
+                node.marks.forEach((mark: Mark) => {
+                  if (markType === mark.type) {
+                    const trimmedFrom2 = Math.max(pos, from)
+                    const trimmedTo2 = Math.min(pos + node.nodeSize, to)
+
+                    tr.addMark(
+                      trimmedFrom2,
+                      trimmedTo2,
+                      markType.create({
+                        ...mark.attrs,
+                        ...attributes,
+                      }),
+                    )
+                  }
+                })
+              }
             }
           })
         }
+
+        if (lastNode) {
+          if (lastPos !== undefined) {
+            tr.setNodeMarkup(lastPos, undefined, {
+              ...lastNode.attrs,
+              ...attributes,
+            })
+          }
+
+          if (markType && lastNode.marks.length) {
+            lastNode.marks.forEach((mark: Mark) => {
+              if (markType === mark.type) {
+                tr.addMark(
+                  trimmedFrom,
+                  trimmedTo,
+                  markType.create({
+                    ...mark.attrs,
+                    ...attributes,
+                  }),
+                )
+              }
+            })
+          }
+        }
       })
-    })
-  }
+    }
 
-  return true
-}
+    return true
+  }