@tiptap/core 3.21.0 → 3.22.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/core",
   "description": "headless rich text editor",
-  "version": "3.21.0",
+  "version": "3.22.0",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",
@@ -52,10 +52,10 @@
     "jsx-dev-runtime"
   ],
   "devDependencies": {
-    "@tiptap/pm": "^3.21.0"
+    "@tiptap/pm": "^3.22.0"
   },
   "peerDependencies": {
-    "@tiptap/pm": "^3.21.0"
+    "@tiptap/pm": "^3.22.0"
   },
   "repository": {
     "type": "git",

package/src/__tests__/htmlEntities.test.ts

@@ -0,0 +1,55 @@
+import { describe, expect, it } from 'vitest'
+
+import { decodeHtmlEntities, encodeHtmlEntities } from '../utilities/htmlEntities.js'
+
+describe('decodeHtmlEntities', () => {
+  it('decodes &lt; to <', () => {
+    expect(decodeHtmlEntities('&lt;div&gt;')).toBe('<div>')
+  })
+
+  it('decodes &amp; to &', () => {
+    expect(decodeHtmlEntities('a &amp; b')).toBe('a & b')
+  })
+
+  it('decodes &quot; to "', () => {
+    expect(decodeHtmlEntities('&quot;hello&quot;')).toBe('"hello"')
+  })
+
+  it('handles doubly-encoded sequences like &amp;lt;', () => {
+    expect(decodeHtmlEntities('&amp;lt;')).toBe('&lt;')
+  })
+
+  it('returns plain text unchanged', () => {
+    expect(decodeHtmlEntities('hello world')).toBe('hello world')
+  })
+})
+
+describe('encodeHtmlEntities', () => {
+  it('encodes < to &lt;', () => {
+    expect(encodeHtmlEntities('<div>')).toBe('&lt;div&gt;')
+  })
+
+  it('encodes & to &amp;', () => {
+    expect(encodeHtmlEntities('a & b')).toBe('a &amp; b')
+  })
+
+  it('does not encode " (quotes are valid in markdown)', () => {
+    expect(encodeHtmlEntities('"hello"')).toBe('"hello"')
+  })
+
+  it('returns plain text unchanged', () => {
+    expect(encodeHtmlEntities('hello world')).toBe('hello world')
+  })
+})
+
+describe('roundtrip', () => {
+  it.each(['<div>', 'a & b', 'x < y & y > z'])('encode then decode roundtrips: %s', input => {
+    expect(decodeHtmlEntities(encodeHtmlEntities(input))).toBe(input)
+  })
+
+  it('decode is a superset of encode – &quot; decodes but " is not encoded', () => {
+    // " passes through encode unchanged, &quot; decodes to "
+    expect(encodeHtmlEntities('"hello"')).toBe('"hello"')
+    expect(decodeHtmlEntities('&quot;hello&quot;')).toBe('"hello"')
+  })
+})

package/src/commands/extendMarkRange.ts

@@ -11,7 +11,8 @@ declare module '@tiptap/core' {
       /**
        * Extends the text selection to the current mark by type or name.
        * @param typeOrName The type or name of the mark.
-       * @param attributes The attributes of the mark.
+       * @param attributes The attributes to match against.
+       * If not provided, only the first mark at the position will be matched.
        * @example editor.commands.extendMarkRange('bold')
        * @example editor.commands.extendMarkRange('mention', { userId: "1" })
        */
@@ -31,7 +32,7 @@ declare module '@tiptap/core' {
 }
 
 export const extendMarkRange: RawCommands['extendMarkRange'] =
-  (typeOrName, attributes = {}) =>
+  (typeOrName, attributes) =>
   ({ tr, state, dispatch }) => {
     const type = getMarkType(typeOrName, state.schema)
     const { doc, selection } = tr

package/src/extensions/delete.ts

@@ -55,7 +55,8 @@ export const Delete = Extension.create({
           const oldStart = mapping.invert().map(newStart, -1)
           const oldEnd = mapping.invert().map(newEnd)
 
-          const foundBeforeMark = nextTransaction.doc.nodeAt(newStart - 1)?.marks.some(mark => mark.eq(step.mark))
+          const foundBeforeMark =
+            newStart > 0 ? nextTransaction.doc.nodeAt(newStart - 1)?.marks.some(mark => mark.eq(step.mark)) : false
           const foundAfterMark = nextTransaction.doc.nodeAt(newEnd)?.marks.some(mark => mark.eq(step.mark))
 
           this.editor.emit('delete', {

package/src/helpers/getMarkRange.ts

@@ -57,8 +57,13 @@ export function getMarkRange(
     return
   }
 
-  // Default to only matching against the first mark's attributes
-  attributes = attributes || start.node.marks[0]?.attrs
+  // Default to only matching against the attributes of the first mark with the given type
+  if (!attributes) {
+    const firstMark = start.node.marks.find(mark => mark.type === type)
+    if (firstMark) {
+      attributes = firstMark.attrs
+    }
+  }
 
   // We now know that the cursor is either at the start, middle or end of a text node with the specified mark
   // so we can look it up on the targeted mark

package/src/lib/ResizableNodeView.ts

@@ -548,7 +548,7 @@ export class ResizableNodeView {
     const element = document.createElement('div')
     element.dataset.resizeContainer = ''
     element.dataset.node = this.node.type.name
-    element.style.display = 'flex'
+    element.style.display = this.node.type.isInline ? 'inline-flex' : 'flex'
 
     if (this.classNames.container) {
       element.className = this.classNames.container

package/src/utilities/htmlEntities.ts

@@ -0,0 +1,26 @@
+/**
+ * Decode common HTML entities in text content so they display as literal
+ * characters inside the editor.  The decode order matters: `&` must be
+ * decoded **last** so that doubly-encoded sequences like `<` first
+ * survive the `&lt;` pass and then correctly become `&lt;` (not `<`).
+ */
+export function decodeHtmlEntities(text: string): string {
+  return text
+    .replace(/&lt;/g, '<')
+    .replace(/&gt;/g, '>')
+    .replace(/&quot;/g, '"')
+    .replace(/&amp;/g, '&')
+}
+
+/**
+ * Encode HTML special characters so they roundtrip safely through markdown.
+ * `&` is encoded **first** to avoid double-encoding the ampersand in other
+ * entities (e.g. `<` → `&lt;`, not `&amp;lt;`).
+ *
+ * Note: `"` is intentionally NOT encoded here because double quotes are
+ * ordinary characters in markdown and do not need escaping.  The decode
+ * function still handles `&quot;` because the markdown tokenizer may emit it.
+ */
+export function encodeHtmlEntities(text: string): string {
+  return text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
+}

package/src/utilities/index.ts

@@ -6,6 +6,7 @@ export * from './elementFromString.js'
 export * from './escapeForRegEx.js'
 export * from './findDuplicates.js'
 export * from './fromString.js'
+export * from './htmlEntities.js'
 export * from './isAndroid.js'
 export * from './isEmptyObject.js'
 export * from './isFirefox.js'