@tiptap/extension-mention 3.0.0 → 3.0.1

package/src/mention.ts

@@ -1,7 +1,11 @@
+import type { Editor } from '@tiptap/core'
 import { mergeAttributes, Node } from '@tiptap/core'
-import { DOMOutputSpec, Node as ProseMirrorNode } from '@tiptap/pm/model'
-import { PluginKey } from '@tiptap/pm/state'
-import Suggestion, { SuggestionOptions } from '@tiptap/suggestion'
+import type { DOMOutputSpec } from '@tiptap/pm/model'
+import { Node as ProseMirrorNode } from '@tiptap/pm/model'
+import type { SuggestionOptions } from '@tiptap/suggestion'
+import Suggestion from '@tiptap/suggestion'
+
+import { getSuggestionOptions } from './utils/get-default-suggestion-attributes.js'
 
 // See `addAttributes` below
 export interface MentionNodeAttrs {
@@ -9,15 +13,20 @@ export interface MentionNodeAttrs {
    * The identifier for the selected item that was mentioned, stored as a `data-id`
    * attribute.
    */
-  id: string | null;
+  id: string | null
   /**
    * The label to be rendered by the editor as the displayed text for this mentioned
    * item, if provided. Stored as a `data-label` attribute. See `renderLabel`.
    */
-  label?: string | null;
+  label?: string | null
+  /**
+   * The character that triggers the suggestion, stored as
+   * `data-mention-suggestion-char` attribute.
+   */
+  mentionSuggestionChar?: string
 }
 
-export type MentionOptions<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> = {
+export interface MentionOptions<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> {
   /**
    * The HTML attributes for a mention node.
    * @default {}
@@ -32,7 +41,11 @@ export type MentionOptions<SuggestionItem = any, Attrs extends Record<string, an
    * @returns The label
    * @example ({ options, node }) => `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`
    */
-  renderLabel?: (props: { options: MentionOptions<SuggestionItem, Attrs>; node: ProseMirrorNode }) => string
+  renderLabel?: (props: {
+    options: MentionOptions<SuggestionItem, Attrs>
+    node: ProseMirrorNode
+    suggestion: SuggestionOptions | null
+  }) => string
 
   /**
    * A function to render the text of a mention.
@@ -40,7 +53,11 @@ export type MentionOptions<SuggestionItem = any, Attrs extends Record<string, an
    * @returns The text
    * @example ({ options, node }) => `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`
    */
-  renderText: (props: { options: MentionOptions<SuggestionItem, Attrs>; node: ProseMirrorNode }) => string
+  renderText: (props: {
+    options: MentionOptions<SuggestionItem, Attrs>
+    node: ProseMirrorNode
+    suggestion: SuggestionOptions | null
+  }) => string
 
   /**
    * A function to render the HTML of a mention.
@@ -48,7 +65,11 @@ export type MentionOptions<SuggestionItem = any, Attrs extends Record<string, an
    * @returns The HTML as a ProseMirror DOM Output Spec
    * @example ({ options, node }) => ['span', { 'data-type': 'mention' }, `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`]
    */
-  renderHTML: (props: { options: MentionOptions<SuggestionItem, Attrs>; node: ProseMirrorNode }) => DOMOutputSpec
+  renderHTML: (props: {
+    options: MentionOptions<SuggestionItem, Attrs>
+    node: ProseMirrorNode
+    suggestion: SuggestionOptions | null
+  }) => DOMOutputSpec
 
   /**
    * Whether to delete the trigger character with backspace.
@@ -57,18 +78,73 @@ export type MentionOptions<SuggestionItem = any, Attrs extends Record<string, an
   deleteTriggerWithBackspace: boolean
 
   /**
-   * The suggestion options.
+   * The suggestion options, when you want to support multiple triggers.
+   *
+   * With this parameter, you can define multiple types of mention. For example, you can use the `@` character
+   * to mention users and the `#` character to mention tags.
+   *
+   * @default [{ char: '@', pluginKey: MentionPluginKey }]
+   * @example [{ char: '@', pluginKey: MentionPluginKey }, { char: '#', pluginKey: new PluginKey('hashtag') }]
+   */
+  suggestions: Array<Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>>
+
+  /**
+   * The suggestion options, when you want to support only one trigger. To support multiple triggers, use the
+   * `suggestions` parameter instead.
+   *
    * @default {}
    * @example { char: '@', pluginKey: MentionPluginKey, command: ({ editor, range, props }) => { ... } }
    */
   suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>
 }
 
+interface GetSuggestionsOptions {
+  editor?: Editor
+  options: MentionOptions
+  name: string
+}
+
 /**
- * The plugin key for the mention plugin.
- * @default 'mention'
+ * Returns the suggestions for the mention extension.
+ *
+ * @param options The extension options
+ * @returns the suggestions
  */
-export const MentionPluginKey = new PluginKey('mention')
+function getSuggestions(options: GetSuggestionsOptions) {
+  return (options.options.suggestions.length ? options.options.suggestions : [options.options.suggestion]).map(
+    suggestion =>
+      getSuggestionOptions({
+        // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility
+        editor: options.editor,
+        overrideSuggestionOptions: suggestion,
+        extensionName: options.name,
+        char: suggestion.char,
+      }),
+  )
+}
+
+/**
+ * Returns the suggestion options of the mention that has a given character trigger. If not
+ * found, it returns the first suggestion.
+ *
+ * @param options The extension options
+ * @param char The character that triggers the mention
+ * @returns The suggestion options
+ */
+function getSuggestionFromChar(options: GetSuggestionsOptions, char: string) {
+  const suggestions = getSuggestions(options)
+
+  const suggestion = suggestions.find(s => s.char === char)
+  if (suggestion) {
+    return suggestion
+  }
+
+  if (suggestions.length) {
+    return suggestions[0]
+  }
+
+  return null
+}
 
 /**
  * This extension allows you to insert mentions into the editor.
@@ -77,58 +153,24 @@ export const MentionPluginKey = new PluginKey('mention')
 export const Mention = Node.create<MentionOptions>({
   name: 'mention',
 
+  priority: 101,
+
   addOptions() {
     return {
       HTMLAttributes: {},
-      renderText({ options, node }) {
-        return `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`
+      renderText({ node, suggestion }) {
+        return `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`
       },
       deleteTriggerWithBackspace: false,
-      renderHTML({ options, node }) {
+      renderHTML({ options, node, suggestion }) {
         return [
           'span',
           mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),
-          `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`,
+          `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`,
         ]
       },
-      suggestion: {
-        char: '@',
-        pluginKey: MentionPluginKey,
-        command: ({ editor, range, props }) => {
-          // increase range.to by one when the next node is of type "text"
-          // and starts with a space character
-          const nodeAfter = editor.view.state.selection.$to.nodeAfter
-          const overrideSpace = nodeAfter?.text?.startsWith(' ')
-
-          if (overrideSpace) {
-            range.to += 1
-          }
-
-          editor
-            .chain()
-            .focus()
-            .insertContentAt(range, [
-              {
-                type: this.name,
-                attrs: props,
-              },
-              {
-                type: 'text',
-                text: ' ',
-              },
-            ])
-            .run()
-
-          window.getSelection()?.collapseToEnd()
-        },
-        allow: ({ state, range }) => {
-          const $from = state.doc.resolve(range.from)
-          const type = state.schema.nodes[this.name]
-          const allow = !!$from.parent.type.contentMatch.matchType(type)
-
-          return allow
-        },
-      },
+      suggestions: [],
+      suggestion: {},
     }
   },
 
@@ -169,6 +211,17 @@ export const Mention = Node.create<MentionOptions>({
           }
         },
       },
+
+      // When there are multiple types of mentions, this attribute helps distinguish them
+      mentionSuggestionChar: {
+        default: '@',
+        parseHTML: element => element.getAttribute('data-mention-suggestion-char'),
+        renderHTML: attributes => {
+          return {
+            'data-mention-suggestion-char': attributes.mentionSuggestionChar,
+          }
+        },
+      },
     }
   },
 
@@ -181,6 +234,8 @@ export const Mention = Node.create<MentionOptions>({
   },
 
   renderHTML({ node, HTMLAttributes }) {
+    const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar)
+
     if (this.options.renderLabel !== undefined) {
       console.warn('renderLabel is deprecated use renderText and renderHTML instead')
       return [
@@ -189,76 +244,84 @@ export const Mention = Node.create<MentionOptions>({
         this.options.renderLabel({
           options: this.options,
           node,
+          suggestion,
         }),
       ]
     }
     const mergedOptions = { ...this.options }
 
-    mergedOptions.HTMLAttributes = mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes)
+    mergedOptions.HTMLAttributes = mergeAttributes(
+      { 'data-type': this.name },
+      this.options.HTMLAttributes,
+      HTMLAttributes,
+    )
+
     const html = this.options.renderHTML({
       options: mergedOptions,
       node,
+      suggestion,
     })
 
     if (typeof html === 'string') {
-      return [
-        'span',
-        mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes),
-        html,
-      ]
+      return ['span', mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes), html]
     }
     return html
   },
 
   renderText({ node }) {
+    const args = {
+      options: this.options,
+      node,
+      suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar),
+    }
     if (this.options.renderLabel !== undefined) {
       console.warn('renderLabel is deprecated use renderText and renderHTML instead')
-      return this.options.renderLabel({
-        options: this.options,
-        node,
-      })
+      return this.options.renderLabel(args)
     }
-    return this.options.renderText({
-      options: this.options,
-      node,
-    })
+
+    return this.options.renderText(args)
   },
 
   addKeyboardShortcuts() {
     return {
-      Backspace: () => this.editor.commands.command(({ tr, state }) => {
-        let isMention = false
-        const { selection } = state
-        const { empty, anchor } = selection
-
-        if (!empty) {
-          return false
-        }
-
-        state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
-          if (node.type.name === this.name) {
-            isMention = true
-            tr.insertText(
-              this.options.deleteTriggerWithBackspace ? '' : this.options.suggestion.char || '',
-              pos,
-              pos + node.nodeSize,
-            )
+      Backspace: () =>
+        this.editor.commands.command(({ tr, state }) => {
+          let isMention = false
+          const { selection } = state
+          const { empty, anchor } = selection
 
+          if (!empty) {
             return false
           }
-        })
 
-        return isMention
-      }),
+          // Store node and position for later use
+          let mentionNode = new ProseMirrorNode()
+          let mentionPos = 0
+
+          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
+            if (node.type.name === this.name) {
+              isMention = true
+              mentionNode = node
+              mentionPos = pos
+              return false
+            }
+          })
+
+          if (isMention) {
+            tr.insertText(
+              this.options.deleteTriggerWithBackspace ? '' : mentionNode.attrs.mentionSuggestionChar,
+              mentionPos,
+              mentionPos + mentionNode.nodeSize,
+            )
+          }
+
+          return isMention
+        }),
     }
   },
 
   addProseMirrorPlugins() {
-    return [
-      Suggestion({
-        editor: this.editor,
-        ...this.options.suggestion,
-      }),
-    ]
+    // Create a plugin for each suggestion configuration
+    return getSuggestions(this).map(Suggestion)
   },
 })

package/src/utils/get-default-suggestion-attributes.ts

@@ -0,0 +1,89 @@
+import type { Editor } from '@tiptap/core'
+import { PluginKey } from '@tiptap/pm/state'
+import type { SuggestionOptions } from '@tiptap/suggestion'
+
+/**
+ * Arguments for the `getSuggestionOptions` function
+ * @see getSuggestionOptions
+ */
+export interface GetSuggestionOptionsOptions {
+  /**
+   * The Tiptap editor instance.
+   */
+  editor: Editor
+  /**
+   * The suggestion options configuration provided to the
+   * `Mention` extension.
+   */
+  overrideSuggestionOptions: Omit<SuggestionOptions, 'editor'>
+  /**
+   * The name of the Mention extension
+   */
+  extensionName: string
+  /**
+   * The character that triggers the suggestion.
+   * @default '@'
+   */
+  char?: string
+}
+
+/**
+ * Returns the suggestion options for a trigger of the Mention extension. These
+ * options are used to create a `Suggestion` ProseMirror plugin. Each plugin lets
+ * you define a different trigger that opens the Mention menu. For example,
+ * you can define a `@` trigger to mention users and a `#` trigger to mention
+ * tags.
+ *
+ * @param param0 The configured options for the suggestion
+ * @returns
+ */
+export function getSuggestionOptions({
+  editor: tiptapEditor,
+  overrideSuggestionOptions,
+  extensionName,
+  char = '@',
+}: GetSuggestionOptionsOptions): SuggestionOptions {
+  const pluginKey = new PluginKey()
+
+  return {
+    editor: tiptapEditor,
+    char,
+    pluginKey,
+    command: ({ editor, range, props }: { editor: any; range: any; props: any }) => {
+      // increase range.to by one when the next node is of type "text"
+      // and starts with a space character
+      const nodeAfter = editor.view.state.selection.$to.nodeAfter
+      const overrideSpace = nodeAfter?.text?.startsWith(' ')
+
+      if (overrideSpace) {
+        range.to += 1
+      }
+
+      editor
+        .chain()
+        .focus()
+        .insertContentAt(range, [
+          {
+            type: extensionName,
+            attrs: { ...props, mentionSuggestionChar: char },
+          },
+          {
+            type: 'text',
+            text: ' ',
+          },
+        ])
+        .run()
+
+      // get reference to `window` object from editor element, to support cross-frame JS usage
+      editor.view.dom.ownerDocument.defaultView?.getSelection()?.collapseToEnd()
+    },
+    allow: ({ state, range }: { state: any; range: any }) => {
+      const $from = state.doc.resolve(range.from)
+      const type = state.schema.nodes[extensionName]
+      const allow = !!$from.parent.type.contentMatch.matchType(type)
+
+      return allow
+    },
+    ...overrideSuggestionOptions,
+  }
+}

package/dist/index.umd.js

@@ -1,187 +0,0 @@
-(function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@tiptap/core'), require('@tiptap/pm/state'), require('@tiptap/suggestion')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@tiptap/core', '@tiptap/pm/state', '@tiptap/suggestion'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@tiptap/extension-mention"] = {}, global.core, global.state, global.Suggestion));
-})(this, (function (exports, core, state, Suggestion) { 'use strict';
-
-  /**
-   * The plugin key for the mention plugin.
-   * @default 'mention'
-   */
-  const MentionPluginKey = new state.PluginKey('mention');
-  /**
-   * This extension allows you to insert mentions into the editor.
-   * @see https://www.tiptap.dev/api/extensions/mention
-   */
-  const Mention = core.Node.create({
-      name: 'mention',
-      addOptions() {
-          return {
-              HTMLAttributes: {},
-              renderText({ options, node }) {
-                  var _a;
-                  return `${options.suggestion.char}${(_a = node.attrs.label) !== null && _a !== void 0 ? _a : node.attrs.id}`;
-              },
-              deleteTriggerWithBackspace: false,
-              renderHTML({ options, node }) {
-                  var _a;
-                  return [
-                      'span',
-                      core.mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),
-                      `${options.suggestion.char}${(_a = node.attrs.label) !== null && _a !== void 0 ? _a : node.attrs.id}`,
-                  ];
-              },
-              suggestion: {
-                  char: '@',
-                  pluginKey: MentionPluginKey,
-                  command: ({ editor, range, props }) => {
-                      var _a, _b;
-                      // increase range.to by one when the next node is of type "text"
-                      // and starts with a space character
-                      const nodeAfter = editor.view.state.selection.$to.nodeAfter;
-                      const overrideSpace = (_a = nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.text) === null || _a === void 0 ? void 0 : _a.startsWith(' ');
-                      if (overrideSpace) {
-                          range.to += 1;
-                      }
-                      editor
-                          .chain()
-                          .focus()
-                          .insertContentAt(range, [
-                          {
-                              type: this.name,
-                              attrs: props,
-                          },
-                          {
-                              type: 'text',
-                              text: ' ',
-                          },
-                      ])
-                          .run();
-                      (_b = window.getSelection()) === null || _b === void 0 ? void 0 : _b.collapseToEnd();
-                  },
-                  allow: ({ state, range }) => {
-                      const $from = state.doc.resolve(range.from);
-                      const type = state.schema.nodes[this.name];
-                      const allow = !!$from.parent.type.contentMatch.matchType(type);
-                      return allow;
-                  },
-              },
-          };
-      },
-      group: 'inline',
-      inline: true,
-      selectable: false,
-      atom: true,
-      addAttributes() {
-          return {
-              id: {
-                  default: null,
-                  parseHTML: element => element.getAttribute('data-id'),
-                  renderHTML: attributes => {
-                      if (!attributes.id) {
-                          return {};
-                      }
-                      return {
-                          'data-id': attributes.id,
-                      };
-                  },
-              },
-              label: {
-                  default: null,
-                  parseHTML: element => element.getAttribute('data-label'),
-                  renderHTML: attributes => {
-                      if (!attributes.label) {
-                          return {};
-                      }
-                      return {
-                          'data-label': attributes.label,
-                      };
-                  },
-              },
-          };
-      },
-      parseHTML() {
-          return [
-              {
-                  tag: `span[data-type="${this.name}"]`,
-              },
-          ];
-      },
-      renderHTML({ node, HTMLAttributes }) {
-          if (this.options.renderLabel !== undefined) {
-              console.warn('renderLabel is deprecated use renderText and renderHTML instead');
-              return [
-                  'span',
-                  core.mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes),
-                  this.options.renderLabel({
-                      options: this.options,
-                      node,
-                  }),
-              ];
-          }
-          const mergedOptions = { ...this.options };
-          mergedOptions.HTMLAttributes = core.mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes);
-          const html = this.options.renderHTML({
-              options: mergedOptions,
-              node,
-          });
-          if (typeof html === 'string') {
-              return [
-                  'span',
-                  core.mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes),
-                  html,
-              ];
-          }
-          return html;
-      },
-      renderText({ node }) {
-          if (this.options.renderLabel !== undefined) {
-              console.warn('renderLabel is deprecated use renderText and renderHTML instead');
-              return this.options.renderLabel({
-                  options: this.options,
-                  node,
-              });
-          }
-          return this.options.renderText({
-              options: this.options,
-              node,
-          });
-      },
-      addKeyboardShortcuts() {
-          return {
-              Backspace: () => this.editor.commands.command(({ tr, state }) => {
-                  let isMention = false;
-                  const { selection } = state;
-                  const { empty, anchor } = selection;
-                  if (!empty) {
-                      return false;
-                  }
-                  state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
-                      if (node.type.name === this.name) {
-                          isMention = true;
-                          tr.insertText(this.options.deleteTriggerWithBackspace ? '' : this.options.suggestion.char || '', pos, pos + node.nodeSize);
-                          return false;
-                      }
-                  });
-                  return isMention;
-              }),
-          };
-      },
-      addProseMirrorPlugins() {
-          return [
-              Suggestion({
-                  editor: this.editor,
-                  ...this.options.suggestion,
-              }),
-          ];
-      },
-  });
-
-  exports.Mention = Mention;
-  exports.MentionPluginKey = MentionPluginKey;
-  exports.default = Mention;
-
-  Object.defineProperty(exports, '__esModule', { value: true });
-
-}));
-//# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.umd.js","sources":["../src/mention.ts"],"sourcesContent":["import { mergeAttributes, Node } from '@tiptap/core'\nimport { DOMOutputSpec, Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport { PluginKey } from '@tiptap/pm/state'\nimport Suggestion, { SuggestionOptions } from '@tiptap/suggestion'\n\n// See `addAttributes` below\nexport interface MentionNodeAttrs {\n  /**\n   * The identifier for the selected item that was mentioned, stored as a `data-id`\n   * attribute.\n   */\n  id: string | null;\n  /**\n   * The label to be rendered by the editor as the displayed text for this mentioned\n   * item, if provided. Stored as a `data-label` attribute. See `renderLabel`.\n   */\n  label?: string | null;\n}\n\nexport type MentionOptions<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> = {\n  /**\n   * The HTML attributes for a mention node.\n   * @default {}\n   * @example { class: 'foo' }\n   */\n  HTMLAttributes: Record<string, any>\n\n  /**\n   * A function to render the label of a mention.\n   * @deprecated use renderText and renderHTML instead\n   * @param props The render props\n   * @returns The label\n   * @example ({ options, node }) => `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`\n   */\n  renderLabel?: (props: { options: MentionOptions<SuggestionItem, Attrs>; node: ProseMirrorNode }) => string\n\n  /**\n   * A function to render the text of a mention.\n   * @param props The render props\n   * @returns The text\n   * @example ({ options, node }) => `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`\n   */\n  renderText: (props: { options: MentionOptions<SuggestionItem, Attrs>; node: ProseMirrorNode }) => string\n\n  /**\n   * A function to render the HTML of a mention.\n   * @param props The render props\n   * @returns The HTML as a ProseMirror DOM Output Spec\n   * @example ({ options, node }) => ['span', { 'data-type': 'mention' }, `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`]\n   */\n  renderHTML: (props: { options: MentionOptions<SuggestionItem, Attrs>; node: ProseMirrorNode }) => DOMOutputSpec\n\n  /**\n   * Whether to delete the trigger character with backspace.\n   * @default false\n   */\n  deleteTriggerWithBackspace: boolean\n\n  /**\n   * The suggestion options.\n   * @default {}\n   * @example { char: '@', pluginKey: MentionPluginKey, command: ({ editor, range, props }) => { ... } }\n   */\n  suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>\n}\n\n/**\n * The plugin key for the mention plugin.\n * @default 'mention'\n */\nexport const MentionPluginKey = new PluginKey('mention')\n\n/**\n * This extension allows you to insert mentions into the editor.\n * @see https://www.tiptap.dev/api/extensions/mention\n */\nexport const Mention = Node.create<MentionOptions>({\n  name: 'mention',\n\n  addOptions() {\n    return {\n      HTMLAttributes: {},\n      renderText({ options, node }) {\n        return `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`\n      },\n      deleteTriggerWithBackspace: false,\n      renderHTML({ options, node }) {\n        return [\n          'span',\n          mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),\n          `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`,\n        ]\n      },\n      suggestion: {\n        char: '@',\n        pluginKey: MentionPluginKey,\n        command: ({ editor, range, props }) => {\n          // increase range.to by one when the next node is of type \"text\"\n          // and starts with a space character\n          const nodeAfter = editor.view.state.selection.$to.nodeAfter\n          const overrideSpace = nodeAfter?.text?.startsWith(' ')\n\n          if (overrideSpace) {\n            range.to += 1\n          }\n\n          editor\n            .chain()\n            .focus()\n            .insertContentAt(range, [\n              {\n                type: this.name,\n                attrs: props,\n              },\n              {\n                type: 'text',\n                text: ' ',\n              },\n            ])\n            .run()\n\n          window.getSelection()?.collapseToEnd()\n        },\n        allow: ({ state, range }) => {\n          const $from = state.doc.resolve(range.from)\n          const type = state.schema.nodes[this.name]\n          const allow = !!$from.parent.type.contentMatch.matchType(type)\n\n          return allow\n        },\n      },\n    }\n  },\n\n  group: 'inline',\n\n  inline: true,\n\n  selectable: false,\n\n  atom: true,\n\n  addAttributes() {\n    return {\n      id: {\n        default: null,\n        parseHTML: element => element.getAttribute('data-id'),\n        renderHTML: attributes => {\n          if (!attributes.id) {\n            return {}\n          }\n\n          return {\n            'data-id': attributes.id,\n          }\n        },\n      },\n\n      label: {\n        default: null,\n        parseHTML: element => element.getAttribute('data-label'),\n        renderHTML: attributes => {\n          if (!attributes.label) {\n            return {}\n          }\n\n          return {\n            'data-label': attributes.label,\n          }\n        },\n      },\n    }\n  },\n\n  parseHTML() {\n    return [\n      {\n        tag: `span[data-type=\"${this.name}\"]`,\n      },\n    ]\n  },\n\n  renderHTML({ node, HTMLAttributes }) {\n    if (this.options.renderLabel !== undefined) {\n      console.warn('renderLabel is deprecated use renderText and renderHTML instead')\n      return [\n        'span',\n        mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes),\n        this.options.renderLabel({\n          options: this.options,\n          node,\n        }),\n      ]\n    }\n    const mergedOptions = { ...this.options }\n\n    mergedOptions.HTMLAttributes = mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes)\n    const html = this.options.renderHTML({\n      options: mergedOptions,\n      node,\n    })\n\n    if (typeof html === 'string') {\n      return [\n        'span',\n        mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes),\n        html,\n      ]\n    }\n    return html\n  },\n\n  renderText({ node }) {\n    if (this.options.renderLabel !== undefined) {\n      console.warn('renderLabel is deprecated use renderText and renderHTML instead')\n      return this.options.renderLabel({\n        options: this.options,\n        node,\n      })\n    }\n    return this.options.renderText({\n      options: this.options,\n      node,\n    })\n  },\n\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () => this.editor.commands.command(({ tr, state }) => {\n        let isMention = false\n        const { selection } = state\n        const { empty, anchor } = selection\n\n        if (!empty) {\n          return false\n        }\n\n        state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n          if (node.type.name === this.name) {\n            isMention = true\n            tr.insertText(\n              this.options.deleteTriggerWithBackspace ? '' : this.options.suggestion.char || '',\n              pos,\n              pos + node.nodeSize,\n            )\n\n            return false\n          }\n        })\n\n        return isMention\n      }),\n    }\n  },\n\n  addProseMirrorPlugins() {\n    return [\n      Suggestion({\n        editor: this.editor,\n        ...this.options.suggestion,\n      }),\n    ]\n  },\n})\n"],"names":["PluginKey","Node","mergeAttributes"],"mappings":"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"}