Fix InputRule regex matcher ignoring non-text leaflets in textBefore

demos/src/Nodes/Mention/React/index.jsx

@@ -1,18 +1,17 @@
+import './styles.scss'
+
 import React from 'react'
-import { useEditor, EditorContent } from '@tiptap/react'
-import Document from '@tiptap/extension-document'
-import Paragraph from '@tiptap/extension-paragraph'
-import Text from '@tiptap/extension-text'
+
 import Mention from '@tiptap/extension-mention'
+import { EditorContent, useEditor } from '@tiptap/react'
+import StarterKit from '@tiptap/starter-kit'
+
 import suggestion from './suggestion'
-import './styles.scss'
 
 export default () => {
   const editor = useEditor({
     extensions: [
-      Document,
-      Paragraph,
-      Text,
+      StarterKit,
       Mention.configure({
         HTMLAttributes: {
           class: 'mention',

demos/src/Nodes/Mention/Vue/index.vue

@@ -6,9 +6,7 @@
 
 <script>
 import { Editor, EditorContent } from '@tiptap/vue-3'
-import Document from '@tiptap/extension-document'
-import Paragraph from '@tiptap/extension-paragraph'
-import Text from '@tiptap/extension-text'
+import StarterKit from '@tiptap/starter-kit'
 import Mention from '@tiptap/extension-mention'
 import suggestion from './suggestion'
 
@@ -26,9 +24,7 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document,
-        Paragraph,
-        Text,
+        StarterKit,
         Mention.configure({
           HTMLAttributes: {
             class: 'mention',

packages/core/src/InputRule.ts

@@ -1,15 +1,17 @@
 import { EditorState, Plugin, TextSelection } from 'prosemirror-state'
-import { Editor } from './Editor'
+
 import { CommandManager } from './CommandManager'
+import { Editor } from './Editor'
 import { createChainableState } from './helpers/createChainableState'
-import { isRegExp } from './utilities/isRegExp'
+import { getTextContentFromNodes } from './helpers/getTextContentFromNodes'
 import {
-  Range,
+  CanCommands,
+  ChainedCommands,
   ExtendedRegExpMatchArray,
+  Range,
   SingleCommands,
-  ChainedCommands,
-  CanCommands,
 } from './types'
+import { isRegExp } from './utilities/isRegExp'
 
 export type InputRuleMatch = {
   index: number,
@@ -114,13 +116,8 @@ function run(config: {
   }
 
   let matched = false
-  const maxMatch = 500
-  const textBefore = $from.parent.textBetween(
-    Math.max(0, $from.parentOffset - maxMatch),
-    $from.parentOffset,
-    undefined,
-    ' ',
-  ) + text
+
+  const textBefore = getTextContentFromNodes($from) + text
 
   rules.forEach(rule => {
     if (matched) {

packages/core/src/helpers/getTextContentFromNodes.ts

@@ -0,0 +1,17 @@
+import { ResolvedPos } from 'prosemirror-model'
+
+export const getTextContentFromNodes = ($from: ResolvedPos<any>, maxMatch = 500) => {
+  let textBefore = ''
+
+  $from.parent.nodesBetween(
+    Math.max(0, $from.parentOffset - maxMatch),
+    $from.parentOffset,
+    (node, pos, parent, index) => {
+      textBefore += node.type.spec.toText?.({
+        node, pos, parent, index,
+      }) || node.textContent || '%leaf%'
+    },
+  )
+
+  return textBefore
+}