@tiptap/extension-mention 3.0.0-beta.17 → 3.0.0-beta.18

package/dist/index.cjs

@@ -83,29 +83,45 @@ function getSuggestionOptions({
 }
 
 // src/mention.ts
+function getSuggestions(options) {
+  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
+    })
+  );
+}
+function getSuggestionFromChar(options, char) {
+  const suggestions = getSuggestions(options);
+  const suggestion = suggestions.find((s) => s.char === char);
+  if (suggestion) {
+    return suggestion;
+  }
+  if (suggestions.length) {
+    return suggestions[0];
+  }
+  return null;
+}
 var Mention = import_core.Node.create({
   name: "mention",
   priority: 101,
-  addStorage() {
-    return {
-      suggestions: [],
-      getSuggestionFromChar: () => null
-    };
-  },
   addOptions() {
     return {
       HTMLAttributes: {},
       renderText({ node, suggestion }) {
-        var _a;
-        return `${suggestion == null ? void 0 : suggestion.char}${(_a = node.attrs.label) != null ? _a : node.attrs.id}`;
+        var _a, _b;
+        return `${(_a = suggestion == null ? void 0 : suggestion.char) != null ? _a : "@"}${(_b = node.attrs.label) != null ? _b : node.attrs.id}`;
       },
       deleteTriggerWithBackspace: false,
       renderHTML({ options, node, suggestion }) {
-        var _a;
+        var _a, _b;
         return [
           "span",
           (0, import_core.mergeAttributes)(this.HTMLAttributes, options.HTMLAttributes),
-          `${suggestion == null ? void 0 : suggestion.char}${(_a = node.attrs.label) != null ? _a : node.attrs.id}`
+          `${(_a = suggestion == null ? void 0 : suggestion.char) != null ? _a : "@"}${(_b = node.attrs.label) != null ? _b : node.attrs.id}`
         ];
       },
       suggestions: [],
@@ -162,8 +178,7 @@ var Mention = import_core.Node.create({
     ];
   },
   renderHTML({ node, HTMLAttributes }) {
-    var _a, _b, _c;
-    const suggestion = (_c = (_b = (_a = this.editor) == null ? void 0 : _a.extensionStorage) == null ? void 0 : _b[this.name]) == null ? void 0 : _c.getSuggestionFromChar(node.attrs.mentionSuggestionChar);
+    const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar);
     if (this.options.renderLabel !== void 0) {
       console.warn("renderLabel is deprecated use renderText and renderHTML instead");
       return [
@@ -193,11 +208,10 @@ var Mention = import_core.Node.create({
     return html;
   },
   renderText({ node }) {
-    var _a, _b, _c;
     const args = {
       options: this.options,
       node,
-      suggestion: (_c = (_b = (_a = this.editor) == null ? void 0 : _a.extensionStorage) == null ? void 0 : _b[this.name]) == null ? void 0 : _c.getSuggestionFromChar(node.attrs.mentionSuggestionChar)
+      suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar)
     };
     if (this.options.renderLabel !== void 0) {
       console.warn("renderLabel is deprecated use renderText and renderHTML instead");
@@ -236,27 +250,7 @@ var Mention = import_core.Node.create({
     };
   },
   addProseMirrorPlugins() {
-    return this.storage.suggestions.map(import_suggestion.default);
-  },
-  onBeforeCreate() {
-    this.storage.suggestions = (this.options.suggestions.length ? this.options.suggestions : [this.options.suggestion]).map(
-      (suggestion) => getSuggestionOptions({
-        editor: this.editor,
-        overrideSuggestionOptions: suggestion,
-        extensionName: this.name,
-        char: suggestion.char
-      })
-    );
-    this.storage.getSuggestionFromChar = (char) => {
-      const suggestion = this.storage.suggestions.find((s) => s.char === char);
-      if (suggestion) {
-        return suggestion;
-      }
-      if (this.storage.suggestions.length) {
-        return this.storage.suggestions[0];
-      }
-      return null;
-    };
+    return getSuggestions(this).map(import_suggestion.default);
   }
 });
 

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/mention.ts","../src/utils/get-default-suggestion-attributes.ts"],"sourcesContent":["import { Mention } from './mention.js'\n\nexport * from './mention.js'\n\nexport default Mention\n","import { mergeAttributes, Node } from '@tiptap/core'\nimport type { DOMOutputSpec } from '@tiptap/pm/model'\nimport { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\nimport Suggestion from '@tiptap/suggestion'\n\nimport { getSuggestionOptions } from './utils/get-default-suggestion-attributes.js'\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   * The character that triggers the suggestion, stored as\n   * `data-mention-suggestion-char` attribute.\n   */\n  mentionSuggestionChar?: string\n}\n\nexport interface 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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, when you want to support multiple triggers.\n   *\n   * With this parameter, you can define multiple types of mention. For example, you can use the `@` character\n   * to mention users and the `#` character to mention tags.\n   *\n   * @default [{ char: '@', pluginKey: MentionPluginKey }]\n   * @example [{ char: '@', pluginKey: MentionPluginKey }, { char: '#', pluginKey: new PluginKey('hashtag') }]\n   */\n  suggestions: Array<Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>>\n\n  /**\n   * The suggestion options, when you want to support only one trigger. To support multiple triggers, use the\n   * `suggestions` parameter instead.\n   *\n   * @default {}\n   * @example { char: '@', pluginKey: MentionPluginKey, command: ({ editor, range, props }) => { ... } }\n   */\n  suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>\n}\n\n/**\n * Storage properties or the Mention extension\n */\nexport interface MentionStorage<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> {\n  /**\n   * The list of suggestions that will trigger the mention.\n   */\n  suggestions: Array<SuggestionOptions<SuggestionItem, Attrs>>\n\n  /**\n   * Returns the suggestion options of the mention that has a given character trigger. If not\n   * found, it returns the first suggestion.\n   *\n   * @param char The character that triggers the mention\n   * @returns The suggestion options\n   */\n  getSuggestionFromChar: (char: string) => SuggestionOptions<SuggestionItem, Attrs> | null\n}\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, MentionStorage>({\n  name: 'mention',\n\n  priority: 101,\n\n  addStorage() {\n    return {\n      suggestions: [],\n      getSuggestionFromChar: () => null,\n    }\n  },\n\n  addOptions() {\n    return {\n      HTMLAttributes: {},\n      renderText({ node, suggestion }) {\n        return `${suggestion?.char}${node.attrs.label ?? node.attrs.id}`\n      },\n      deleteTriggerWithBackspace: false,\n      renderHTML({ options, node, suggestion }) {\n        return [\n          'span',\n          mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),\n          `${suggestion?.char}${node.attrs.label ?? node.attrs.id}`,\n        ]\n      },\n      suggestions: [],\n      suggestion: {},\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      // When there are multiple types of mentions, this attribute helps distinguish them\n      mentionSuggestionChar: {\n        default: '@',\n        parseHTML: element => element.getAttribute('data-mention-suggestion-char'),\n        renderHTML: attributes => {\n          return {\n            'data-mention-suggestion-char': attributes.mentionSuggestionChar,\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    // We cannot use the `this.storage` property here because, when accessed this method,\n    // it returns the initial value of the extension storage\n    const suggestion = (this.editor?.extensionStorage as unknown as Record<string, MentionStorage>)?.[\n      this.name\n    ]?.getSuggestionFromChar(node.attrs.mentionSuggestionChar)\n\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          suggestion,\n        }),\n      ]\n    }\n    const mergedOptions = { ...this.options }\n\n    mergedOptions.HTMLAttributes = mergeAttributes(\n      { 'data-type': this.name },\n      this.options.HTMLAttributes,\n      HTMLAttributes,\n    )\n\n    const html = this.options.renderHTML({\n      options: mergedOptions,\n      node,\n      suggestion,\n    })\n\n    if (typeof html === 'string') {\n      return ['span', mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes), html]\n    }\n    return html\n  },\n\n  renderText({ node }) {\n    const args = {\n      options: this.options,\n      node,\n      suggestion: (this.editor?.extensionStorage as unknown as Record<string, MentionStorage>)?.[\n        this.name\n      ]?.getSuggestionFromChar(node.attrs.mentionSuggestionChar),\n    }\n    if (this.options.renderLabel !== undefined) {\n      console.warn('renderLabel is deprecated use renderText and renderHTML instead')\n      return this.options.renderLabel(args)\n    }\n\n    return this.options.renderText(args)\n  },\n\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        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          // Store node and position for later use\n          let mentionNode = new ProseMirrorNode()\n          let mentionPos = 0\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true\n              mentionNode = node\n              mentionPos = pos\n              return false\n            }\n          })\n\n          if (isMention) {\n            tr.insertText(\n              this.options.deleteTriggerWithBackspace ? '' : mentionNode.attrs.mentionSuggestionChar,\n              mentionPos,\n              mentionPos + mentionNode.nodeSize,\n            )\n          }\n\n          return isMention\n        }),\n    }\n  },\n\n  addProseMirrorPlugins() {\n    // Create a plugin for each suggestion configuration\n    return this.storage.suggestions.map(Suggestion)\n  },\n\n  onBeforeCreate() {\n    this.storage.suggestions = (\n      this.options.suggestions.length ? this.options.suggestions : [this.options.suggestion]\n    ).map(suggestion =>\n      getSuggestionOptions({\n        editor: this.editor,\n        overrideSuggestionOptions: suggestion,\n        extensionName: this.name,\n        char: suggestion.char,\n      }),\n    )\n\n    this.storage.getSuggestionFromChar = char => {\n      const suggestion = this.storage.suggestions.find(s => s.char === char)\n      if (suggestion) {\n        return suggestion\n      }\n      if (this.storage.suggestions.length) {\n        return this.storage.suggestions[0]\n      }\n\n      return null\n    }\n  },\n})\n","import type { Editor } from '@tiptap/core'\nimport { PluginKey } from '@tiptap/pm/state'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\n\n/**\n * Arguments for the `getSuggestionOptions` function\n * @see getSuggestionOptions\n */\nexport interface GetSuggestionOptionsOptions {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor: Editor\n  /**\n   * The suggestion options configuration provided to the\n   * `Mention` extension.\n   */\n  overrideSuggestionOptions: Omit<SuggestionOptions, 'editor'>\n  /**\n   * The name of the Mention extension\n   */\n  extensionName: string\n  /**\n   * The character that triggers the suggestion.\n   * @default '@'\n   */\n  char?: string\n}\n\n/**\n * Returns the suggestion options for a trigger of the Mention extension. These\n * options are used to create a `Suggestion` ProseMirror plugin. Each plugin lets\n * you define a different trigger that opens the Mention menu. For example,\n * you can define a `@` trigger to mention users and a `#` trigger to mention\n * tags.\n *\n * @param param0 The configured options for the suggestion\n * @returns\n */\nexport function getSuggestionOptions({\n  editor: tiptapEditor,\n  overrideSuggestionOptions,\n  extensionName,\n  char = '@',\n}: GetSuggestionOptionsOptions): SuggestionOptions {\n  const pluginKey = new PluginKey()\n\n  return {\n    editor: tiptapEditor,\n    char,\n    pluginKey,\n    command: ({ editor, range, props }: { editor: any; range: any; props: any }) => {\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: extensionName,\n            attrs: { ...props, mentionSuggestionChar: char },\n          },\n          {\n            type: 'text',\n            text: ' ',\n          },\n        ])\n        .run()\n\n      // get reference to `window` object from editor element, to support cross-frame JS usage\n      editor.view.dom.ownerDocument.defaultView?.getSelection()?.collapseToEnd()\n    },\n    allow: ({ state, range }: { state: any; range: any }) => {\n      const $from = state.doc.resolve(range.from)\n      const type = state.schema.nodes[extensionName]\n      const allow = !!$from.parent.type.contentMatch.matchType(type)\n\n      return allow\n    },\n    ...overrideSuggestionOptions,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,kBAAsC;AAEtC,mBAAwC;AAExC,wBAAuB;;;ACHvB,mBAA0B;AAsCnB,SAAS,qBAAqB;AAAA,EACnC,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,OAAO;AACT,GAAmD;AACjD,QAAM,YAAY,IAAI,uBAAU;AAEhC,SAAO;AAAA,IACL,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,SAAS,CAAC,EAAE,QAAQ,OAAO,MAAM,MAA+C;AAnDpF;AAsDM,YAAM,YAAY,OAAO,KAAK,MAAM,UAAU,IAAI;AAClD,YAAM,iBAAgB,4CAAW,SAAX,mBAAiB,WAAW;AAElD,UAAI,eAAe;AACjB,cAAM,MAAM;AAAA,MACd;AAEA,aACG,MAAM,EACN,MAAM,EACN,gBAAgB,OAAO;AAAA,QACtB;AAAA,UACE,MAAM;AAAA,UACN,OAAO,EAAE,GAAG,OAAO,uBAAuB,KAAK;AAAA,QACjD;AAAA,QACA;AAAA,UACE,MAAM;AAAA,UACN,MAAM;AAAA,QACR;AAAA,MACF,CAAC,EACA,IAAI;AAGP,yBAAO,KAAK,IAAI,cAAc,gBAA9B,mBAA2C,mBAA3C,mBAA2D;AAAA,IAC7D;AAAA,IACA,OAAO,CAAC,EAAE,OAAO,MAAM,MAAkC;AACvD,YAAM,QAAQ,MAAM,IAAI,QAAQ,MAAM,IAAI;AAC1C,YAAM,OAAO,MAAM,OAAO,MAAM,aAAa;AAC7C,YAAM,QAAQ,CAAC,CAAC,MAAM,OAAO,KAAK,aAAa,UAAU,IAAI;AAE7D,aAAO;AAAA,IACT;AAAA,IACA,GAAG;AAAA,EACL;AACF;;;ADkCO,IAAM,UAAU,iBAAK,OAAuC;AAAA,EACjE,MAAM;AAAA,EAEN,UAAU;AAAA,EAEV,aAAa;AACX,WAAO;AAAA,MACL,aAAa,CAAC;AAAA,MACd,uBAAuB,MAAM;AAAA,IAC/B;AAAA,EACF;AAAA,EAEA,aAAa;AACX,WAAO;AAAA,MACL,gBAAgB,CAAC;AAAA,MACjB,WAAW,EAAE,MAAM,WAAW,GAAG;AAzIvC;AA0IQ,eAAO,GAAG,yCAAY,IAAI,IAAG,UAAK,MAAM,UAAX,YAAoB,KAAK,MAAM,EAAE;AAAA,MAChE;AAAA,MACA,4BAA4B;AAAA,MAC5B,WAAW,EAAE,SAAS,MAAM,WAAW,GAAG;AA7IhD;AA8IQ,eAAO;AAAA,UACL;AAAA,cACA,6BAAgB,KAAK,gBAAgB,QAAQ,cAAc;AAAA,UAC3D,GAAG,yCAAY,IAAI,IAAG,UAAK,MAAM,UAAX,YAAoB,KAAK,MAAM,EAAE;AAAA,QACzD;AAAA,MACF;AAAA,MACA,aAAa,CAAC;AAAA,MACd,YAAY,CAAC;AAAA,IACf;AAAA,EACF;AAAA,EAEA,OAAO;AAAA,EAEP,QAAQ;AAAA,EAER,YAAY;AAAA,EAEZ,MAAM;AAAA,EAEN,gBAAgB;AACd,WAAO;AAAA,MACL,IAAI;AAAA,QACF,SAAS;AAAA,QACT,WAAW,aAAW,QAAQ,aAAa,SAAS;AAAA,QACpD,YAAY,gBAAc;AACxB,cAAI,CAAC,WAAW,IAAI;AAClB,mBAAO,CAAC;AAAA,UACV;AAEA,iBAAO;AAAA,YACL,WAAW,WAAW;AAAA,UACxB;AAAA,QACF;AAAA,MACF;AAAA,MAEA,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW,aAAW,QAAQ,aAAa,YAAY;AAAA,QACvD,YAAY,gBAAc;AACxB,cAAI,CAAC,WAAW,OAAO;AACrB,mBAAO,CAAC;AAAA,UACV;AAEA,iBAAO;AAAA,YACL,cAAc,WAAW;AAAA,UAC3B;AAAA,QACF;AAAA,MACF;AAAA;AAAA,MAGA,uBAAuB;AAAA,QACrB,SAAS;AAAA,QACT,WAAW,aAAW,QAAQ,aAAa,8BAA8B;AAAA,QACzE,YAAY,gBAAc;AACxB,iBAAO;AAAA,YACL,gCAAgC,WAAW;AAAA,UAC7C;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,YAAY;AACV,WAAO;AAAA,MACL;AAAA,QACE,KAAK,mBAAmB,KAAK,IAAI;AAAA,MACnC;AAAA,IACF;AAAA,EACF;AAAA,EAEA,WAAW,EAAE,MAAM,eAAe,GAAG;AApNvC;AAuNI,UAAM,cAAc,sBAAK,WAAL,mBAAa,qBAAb,mBAClB,KAAK,UADa,mBAEjB,sBAAsB,KAAK,MAAM;AAEpC,QAAI,KAAK,QAAQ,gBAAgB,QAAW;AAC1C,cAAQ,KAAK,iEAAiE;AAC9E,aAAO;AAAA,QACL;AAAA,YACA,6BAAgB,EAAE,aAAa,KAAK,KAAK,GAAG,KAAK,QAAQ,gBAAgB,cAAc;AAAA,QACvF,KAAK,QAAQ,YAAY;AAAA,UACvB,SAAS,KAAK;AAAA,UACd;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AACA,UAAM,gBAAgB,EAAE,GAAG,KAAK,QAAQ;AAExC,kBAAc,qBAAiB;AAAA,MAC7B,EAAE,aAAa,KAAK,KAAK;AAAA,MACzB,KAAK,QAAQ;AAAA,MACb;AAAA,IACF;AAEA,UAAM,OAAO,KAAK,QAAQ,WAAW;AAAA,MACnC,SAAS;AAAA,MACT;AAAA,MACA;AAAA,IACF,CAAC;AAED,QAAI,OAAO,SAAS,UAAU;AAC5B,aAAO,CAAC,YAAQ,6BAAgB,EAAE,aAAa,KAAK,KAAK,GAAG,KAAK,QAAQ,gBAAgB,cAAc,GAAG,IAAI;AAAA,IAChH;AACA,WAAO;AAAA,EACT;AAAA,EAEA,WAAW,EAAE,KAAK,GAAG;AA3PvB;AA4PI,UAAM,OAAO;AAAA,MACX,SAAS,KAAK;AAAA,MACd;AAAA,MACA,aAAa,sBAAK,WAAL,mBAAa,qBAAb,mBACX,KAAK,UADM,mBAEV,sBAAsB,KAAK,MAAM;AAAA,IACtC;AACA,QAAI,KAAK,QAAQ,gBAAgB,QAAW;AAC1C,cAAQ,KAAK,iEAAiE;AAC9E,aAAO,KAAK,QAAQ,YAAY,IAAI;AAAA,IACtC;AAEA,WAAO,KAAK,QAAQ,WAAW,IAAI;AAAA,EACrC;AAAA,EAEA,uBAAuB;AACrB,WAAO;AAAA,MACL,WAAW,MACT,KAAK,OAAO,SAAS,QAAQ,CAAC,EAAE,IAAI,MAAM,MAAM;AAC9C,YAAI,YAAY;AAChB,cAAM,EAAE,UAAU,IAAI;AACtB,cAAM,EAAE,OAAO,OAAO,IAAI;AAE1B,YAAI,CAAC,OAAO;AACV,iBAAO;AAAA,QACT;AAGA,YAAI,cAAc,IAAI,aAAAA,KAAgB;AACtC,YAAI,aAAa;AAEjB,cAAM,IAAI,aAAa,SAAS,GAAG,QAAQ,CAAC,MAAM,QAAQ;AACxD,cAAI,KAAK,KAAK,SAAS,KAAK,MAAM;AAChC,wBAAY;AACZ,0BAAc;AACd,yBAAa;AACb,mBAAO;AAAA,UACT;AAAA,QACF,CAAC;AAED,YAAI,WAAW;AACb,aAAG;AAAA,YACD,KAAK,QAAQ,6BAA6B,KAAK,YAAY,MAAM;AAAA,YACjE;AAAA,YACA,aAAa,YAAY;AAAA,UAC3B;AAAA,QACF;AAEA,eAAO;AAAA,MACT,CAAC;AAAA,IACL;AAAA,EACF;AAAA,EAEA,wBAAwB;AAEtB,WAAO,KAAK,QAAQ,YAAY,IAAI,kBAAAC,OAAU;AAAA,EAChD;AAAA,EAEA,iBAAiB;AACf,SAAK,QAAQ,eACX,KAAK,QAAQ,YAAY,SAAS,KAAK,QAAQ,cAAc,CAAC,KAAK,QAAQ,UAAU,GACrF;AAAA,MAAI,gBACJ,qBAAqB;AAAA,QACnB,QAAQ,KAAK;AAAA,QACb,2BAA2B;AAAA,QAC3B,eAAe,KAAK;AAAA,QACpB,MAAM,WAAW;AAAA,MACnB,CAAC;AAAA,IACH;AAEA,SAAK,QAAQ,wBAAwB,UAAQ;AAC3C,YAAM,aAAa,KAAK,QAAQ,YAAY,KAAK,OAAK,EAAE,SAAS,IAAI;AACrE,UAAI,YAAY;AACd,eAAO;AAAA,MACT;AACA,UAAI,KAAK,QAAQ,YAAY,QAAQ;AACnC,eAAO,KAAK,QAAQ,YAAY,CAAC;AAAA,MACnC;AAEA,aAAO;AAAA,IACT;AAAA,EACF;AACF,CAAC;;;AD1UD,IAAO,gBAAQ;","names":["ProseMirrorNode","Suggestion"]}
+{"version":3,"sources":["../src/index.ts","../src/mention.ts","../src/utils/get-default-suggestion-attributes.ts"],"sourcesContent":["import { Mention } from './mention.js'\n\nexport * from './mention.js'\n\nexport default Mention\n","import type { Editor } from '@tiptap/core'\nimport { mergeAttributes, Node } from '@tiptap/core'\nimport type { DOMOutputSpec } from '@tiptap/pm/model'\nimport { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\nimport Suggestion from '@tiptap/suggestion'\n\nimport { getSuggestionOptions } from './utils/get-default-suggestion-attributes.js'\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   * The character that triggers the suggestion, stored as\n   * `data-mention-suggestion-char` attribute.\n   */\n  mentionSuggestionChar?: string\n}\n\nexport interface 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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, when you want to support multiple triggers.\n   *\n   * With this parameter, you can define multiple types of mention. For example, you can use the `@` character\n   * to mention users and the `#` character to mention tags.\n   *\n   * @default [{ char: '@', pluginKey: MentionPluginKey }]\n   * @example [{ char: '@', pluginKey: MentionPluginKey }, { char: '#', pluginKey: new PluginKey('hashtag') }]\n   */\n  suggestions: Array<Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>>\n\n  /**\n   * The suggestion options, when you want to support only one trigger. To support multiple triggers, use the\n   * `suggestions` parameter instead.\n   *\n   * @default {}\n   * @example { char: '@', pluginKey: MentionPluginKey, command: ({ editor, range, props }) => { ... } }\n   */\n  suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>\n}\n\ninterface GetSuggestionsOptions {\n  editor?: Editor\n  options: MentionOptions\n  name: string\n}\n\n/**\n * Returns the suggestions for the mention extension.\n *\n * @param options The extension options\n * @returns the suggestions\n */\nfunction getSuggestions(options: GetSuggestionsOptions) {\n  return (options.options.suggestions.length ? options.options.suggestions : [options.options.suggestion]).map(\n    suggestion =>\n      getSuggestionOptions({\n        // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility\n        editor: options.editor,\n        overrideSuggestionOptions: suggestion,\n        extensionName: options.name,\n        char: suggestion.char,\n      }),\n  )\n}\n\n/**\n * Returns the suggestion options of the mention that has a given character trigger. If not\n * found, it returns the first suggestion.\n *\n * @param options The extension options\n * @param char The character that triggers the mention\n * @returns The suggestion options\n */\nfunction getSuggestionFromChar(options: GetSuggestionsOptions, char: string) {\n  const suggestions = getSuggestions(options)\n\n  const suggestion = suggestions.find(s => s.char === char)\n  if (suggestion) {\n    return suggestion\n  }\n\n  if (suggestions.length) {\n    return suggestions[0]\n  }\n\n  return null\n}\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  priority: 101,\n\n  addOptions() {\n    return {\n      HTMLAttributes: {},\n      renderText({ node, suggestion }) {\n        return `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`\n      },\n      deleteTriggerWithBackspace: false,\n      renderHTML({ options, node, suggestion }) {\n        return [\n          'span',\n          mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),\n          `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`,\n        ]\n      },\n      suggestions: [],\n      suggestion: {},\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      // When there are multiple types of mentions, this attribute helps distinguish them\n      mentionSuggestionChar: {\n        default: '@',\n        parseHTML: element => element.getAttribute('data-mention-suggestion-char'),\n        renderHTML: attributes => {\n          return {\n            'data-mention-suggestion-char': attributes.mentionSuggestionChar,\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    const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar)\n\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          suggestion,\n        }),\n      ]\n    }\n    const mergedOptions = { ...this.options }\n\n    mergedOptions.HTMLAttributes = mergeAttributes(\n      { 'data-type': this.name },\n      this.options.HTMLAttributes,\n      HTMLAttributes,\n    )\n\n    const html = this.options.renderHTML({\n      options: mergedOptions,\n      node,\n      suggestion,\n    })\n\n    if (typeof html === 'string') {\n      return ['span', mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes), html]\n    }\n    return html\n  },\n\n  renderText({ node }) {\n    const args = {\n      options: this.options,\n      node,\n      suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar),\n    }\n    if (this.options.renderLabel !== undefined) {\n      console.warn('renderLabel is deprecated use renderText and renderHTML instead')\n      return this.options.renderLabel(args)\n    }\n\n    return this.options.renderText(args)\n  },\n\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        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          // Store node and position for later use\n          let mentionNode = new ProseMirrorNode()\n          let mentionPos = 0\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true\n              mentionNode = node\n              mentionPos = pos\n              return false\n            }\n          })\n\n          if (isMention) {\n            tr.insertText(\n              this.options.deleteTriggerWithBackspace ? '' : mentionNode.attrs.mentionSuggestionChar,\n              mentionPos,\n              mentionPos + mentionNode.nodeSize,\n            )\n          }\n\n          return isMention\n        }),\n    }\n  },\n\n  addProseMirrorPlugins() {\n    // Create a plugin for each suggestion configuration\n    return getSuggestions(this).map(Suggestion)\n  },\n})\n","import type { Editor } from '@tiptap/core'\nimport { PluginKey } from '@tiptap/pm/state'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\n\n/**\n * Arguments for the `getSuggestionOptions` function\n * @see getSuggestionOptions\n */\nexport interface GetSuggestionOptionsOptions {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor: Editor\n  /**\n   * The suggestion options configuration provided to the\n   * `Mention` extension.\n   */\n  overrideSuggestionOptions: Omit<SuggestionOptions, 'editor'>\n  /**\n   * The name of the Mention extension\n   */\n  extensionName: string\n  /**\n   * The character that triggers the suggestion.\n   * @default '@'\n   */\n  char?: string\n}\n\n/**\n * Returns the suggestion options for a trigger of the Mention extension. These\n * options are used to create a `Suggestion` ProseMirror plugin. Each plugin lets\n * you define a different trigger that opens the Mention menu. For example,\n * you can define a `@` trigger to mention users and a `#` trigger to mention\n * tags.\n *\n * @param param0 The configured options for the suggestion\n * @returns\n */\nexport function getSuggestionOptions({\n  editor: tiptapEditor,\n  overrideSuggestionOptions,\n  extensionName,\n  char = '@',\n}: GetSuggestionOptionsOptions): SuggestionOptions {\n  const pluginKey = new PluginKey()\n\n  return {\n    editor: tiptapEditor,\n    char,\n    pluginKey,\n    command: ({ editor, range, props }: { editor: any; range: any; props: any }) => {\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: extensionName,\n            attrs: { ...props, mentionSuggestionChar: char },\n          },\n          {\n            type: 'text',\n            text: ' ',\n          },\n        ])\n        .run()\n\n      // get reference to `window` object from editor element, to support cross-frame JS usage\n      editor.view.dom.ownerDocument.defaultView?.getSelection()?.collapseToEnd()\n    },\n    allow: ({ state, range }: { state: any; range: any }) => {\n      const $from = state.doc.resolve(range.from)\n      const type = state.schema.nodes[extensionName]\n      const allow = !!$from.parent.type.contentMatch.matchType(type)\n\n      return allow\n    },\n    ...overrideSuggestionOptions,\n  }\n}\n"],"mappings":"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","names":["ProseMirrorNode","Suggestion"]}

package/dist/index.d.cts

@@ -84,27 +84,10 @@ interface MentionOptions<SuggestionItem = any, Attrs extends Record<string, any>
      */
     suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>;
 }
-/**
- * Storage properties or the Mention extension
- */
-interface MentionStorage<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> {
-    /**
-     * The list of suggestions that will trigger the mention.
-     */
-    suggestions: Array<SuggestionOptions<SuggestionItem, Attrs>>;
-    /**
-     * Returns the suggestion options of the mention that has a given character trigger. If not
-     * found, it returns the first suggestion.
-     *
-     * @param char The character that triggers the mention
-     * @returns The suggestion options
-     */
-    getSuggestionFromChar: (char: string) => SuggestionOptions<SuggestionItem, Attrs> | null;
-}
 /**
  * This extension allows you to insert mentions into the editor.
  * @see https://www.tiptap.dev/api/extensions/mention
  */
-declare const Mention: Node$1<MentionOptions<any, MentionNodeAttrs>, MentionStorage<any, MentionNodeAttrs>>;
+declare const Mention: Node$1<MentionOptions<any, MentionNodeAttrs>, any>;
 
-export { Mention, type MentionNodeAttrs, type MentionOptions, type MentionStorage, Mention as default };
+export { Mention, type MentionNodeAttrs, type MentionOptions, Mention as default };

package/dist/index.d.ts

@@ -84,27 +84,10 @@ interface MentionOptions<SuggestionItem = any, Attrs extends Record<string, any>
      */
     suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>;
 }
-/**
- * Storage properties or the Mention extension
- */
-interface MentionStorage<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> {
-    /**
-     * The list of suggestions that will trigger the mention.
-     */
-    suggestions: Array<SuggestionOptions<SuggestionItem, Attrs>>;
-    /**
-     * Returns the suggestion options of the mention that has a given character trigger. If not
-     * found, it returns the first suggestion.
-     *
-     * @param char The character that triggers the mention
-     * @returns The suggestion options
-     */
-    getSuggestionFromChar: (char: string) => SuggestionOptions<SuggestionItem, Attrs> | null;
-}
 /**
  * This extension allows you to insert mentions into the editor.
  * @see https://www.tiptap.dev/api/extensions/mention
  */
-declare const Mention: Node$1<MentionOptions<any, MentionNodeAttrs>, MentionStorage<any, MentionNodeAttrs>>;
+declare const Mention: Node$1<MentionOptions<any, MentionNodeAttrs>, any>;
 
-export { Mention, type MentionNodeAttrs, type MentionOptions, type MentionStorage, Mention as default };
+export { Mention, type MentionNodeAttrs, type MentionOptions, Mention as default };

package/dist/index.js

@@ -46,29 +46,45 @@ function getSuggestionOptions({
 }
 
 // src/mention.ts
+function getSuggestions(options) {
+  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
+    })
+  );
+}
+function getSuggestionFromChar(options, char) {
+  const suggestions = getSuggestions(options);
+  const suggestion = suggestions.find((s) => s.char === char);
+  if (suggestion) {
+    return suggestion;
+  }
+  if (suggestions.length) {
+    return suggestions[0];
+  }
+  return null;
+}
 var Mention = Node.create({
   name: "mention",
   priority: 101,
-  addStorage() {
-    return {
-      suggestions: [],
-      getSuggestionFromChar: () => null
-    };
-  },
   addOptions() {
     return {
       HTMLAttributes: {},
       renderText({ node, suggestion }) {
-        var _a;
-        return `${suggestion == null ? void 0 : suggestion.char}${(_a = node.attrs.label) != null ? _a : node.attrs.id}`;
+        var _a, _b;
+        return `${(_a = suggestion == null ? void 0 : suggestion.char) != null ? _a : "@"}${(_b = node.attrs.label) != null ? _b : node.attrs.id}`;
       },
       deleteTriggerWithBackspace: false,
       renderHTML({ options, node, suggestion }) {
-        var _a;
+        var _a, _b;
         return [
           "span",
           mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),
-          `${suggestion == null ? void 0 : suggestion.char}${(_a = node.attrs.label) != null ? _a : node.attrs.id}`
+          `${(_a = suggestion == null ? void 0 : suggestion.char) != null ? _a : "@"}${(_b = node.attrs.label) != null ? _b : node.attrs.id}`
         ];
       },
       suggestions: [],
@@ -125,8 +141,7 @@ var Mention = Node.create({
     ];
   },
   renderHTML({ node, HTMLAttributes }) {
-    var _a, _b, _c;
-    const suggestion = (_c = (_b = (_a = this.editor) == null ? void 0 : _a.extensionStorage) == null ? void 0 : _b[this.name]) == null ? void 0 : _c.getSuggestionFromChar(node.attrs.mentionSuggestionChar);
+    const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar);
     if (this.options.renderLabel !== void 0) {
       console.warn("renderLabel is deprecated use renderText and renderHTML instead");
       return [
@@ -156,11 +171,10 @@ var Mention = Node.create({
     return html;
   },
   renderText({ node }) {
-    var _a, _b, _c;
     const args = {
       options: this.options,
       node,
-      suggestion: (_c = (_b = (_a = this.editor) == null ? void 0 : _a.extensionStorage) == null ? void 0 : _b[this.name]) == null ? void 0 : _c.getSuggestionFromChar(node.attrs.mentionSuggestionChar)
+      suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar)
     };
     if (this.options.renderLabel !== void 0) {
       console.warn("renderLabel is deprecated use renderText and renderHTML instead");
@@ -199,27 +213,7 @@ var Mention = Node.create({
     };
   },
   addProseMirrorPlugins() {
-    return this.storage.suggestions.map(Suggestion);
-  },
-  onBeforeCreate() {
-    this.storage.suggestions = (this.options.suggestions.length ? this.options.suggestions : [this.options.suggestion]).map(
-      (suggestion) => getSuggestionOptions({
-        editor: this.editor,
-        overrideSuggestionOptions: suggestion,
-        extensionName: this.name,
-        char: suggestion.char
-      })
-    );
-    this.storage.getSuggestionFromChar = (char) => {
-      const suggestion = this.storage.suggestions.find((s) => s.char === char);
-      if (suggestion) {
-        return suggestion;
-      }
-      if (this.storage.suggestions.length) {
-        return this.storage.suggestions[0];
-      }
-      return null;
-    };
+    return getSuggestions(this).map(Suggestion);
   }
 });
 

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/mention.ts","../src/utils/get-default-suggestion-attributes.ts","../src/index.ts"],"sourcesContent":["import { mergeAttributes, Node } from '@tiptap/core'\nimport type { DOMOutputSpec } from '@tiptap/pm/model'\nimport { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\nimport Suggestion from '@tiptap/suggestion'\n\nimport { getSuggestionOptions } from './utils/get-default-suggestion-attributes.js'\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   * The character that triggers the suggestion, stored as\n   * `data-mention-suggestion-char` attribute.\n   */\n  mentionSuggestionChar?: string\n}\n\nexport interface 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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, when you want to support multiple triggers.\n   *\n   * With this parameter, you can define multiple types of mention. For example, you can use the `@` character\n   * to mention users and the `#` character to mention tags.\n   *\n   * @default [{ char: '@', pluginKey: MentionPluginKey }]\n   * @example [{ char: '@', pluginKey: MentionPluginKey }, { char: '#', pluginKey: new PluginKey('hashtag') }]\n   */\n  suggestions: Array<Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>>\n\n  /**\n   * The suggestion options, when you want to support only one trigger. To support multiple triggers, use the\n   * `suggestions` parameter instead.\n   *\n   * @default {}\n   * @example { char: '@', pluginKey: MentionPluginKey, command: ({ editor, range, props }) => { ... } }\n   */\n  suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>\n}\n\n/**\n * Storage properties or the Mention extension\n */\nexport interface MentionStorage<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> {\n  /**\n   * The list of suggestions that will trigger the mention.\n   */\n  suggestions: Array<SuggestionOptions<SuggestionItem, Attrs>>\n\n  /**\n   * Returns the suggestion options of the mention that has a given character trigger. If not\n   * found, it returns the first suggestion.\n   *\n   * @param char The character that triggers the mention\n   * @returns The suggestion options\n   */\n  getSuggestionFromChar: (char: string) => SuggestionOptions<SuggestionItem, Attrs> | null\n}\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, MentionStorage>({\n  name: 'mention',\n\n  priority: 101,\n\n  addStorage() {\n    return {\n      suggestions: [],\n      getSuggestionFromChar: () => null,\n    }\n  },\n\n  addOptions() {\n    return {\n      HTMLAttributes: {},\n      renderText({ node, suggestion }) {\n        return `${suggestion?.char}${node.attrs.label ?? node.attrs.id}`\n      },\n      deleteTriggerWithBackspace: false,\n      renderHTML({ options, node, suggestion }) {\n        return [\n          'span',\n          mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),\n          `${suggestion?.char}${node.attrs.label ?? node.attrs.id}`,\n        ]\n      },\n      suggestions: [],\n      suggestion: {},\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      // When there are multiple types of mentions, this attribute helps distinguish them\n      mentionSuggestionChar: {\n        default: '@',\n        parseHTML: element => element.getAttribute('data-mention-suggestion-char'),\n        renderHTML: attributes => {\n          return {\n            'data-mention-suggestion-char': attributes.mentionSuggestionChar,\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    // We cannot use the `this.storage` property here because, when accessed this method,\n    // it returns the initial value of the extension storage\n    const suggestion = (this.editor?.extensionStorage as unknown as Record<string, MentionStorage>)?.[\n      this.name\n    ]?.getSuggestionFromChar(node.attrs.mentionSuggestionChar)\n\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          suggestion,\n        }),\n      ]\n    }\n    const mergedOptions = { ...this.options }\n\n    mergedOptions.HTMLAttributes = mergeAttributes(\n      { 'data-type': this.name },\n      this.options.HTMLAttributes,\n      HTMLAttributes,\n    )\n\n    const html = this.options.renderHTML({\n      options: mergedOptions,\n      node,\n      suggestion,\n    })\n\n    if (typeof html === 'string') {\n      return ['span', mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes), html]\n    }\n    return html\n  },\n\n  renderText({ node }) {\n    const args = {\n      options: this.options,\n      node,\n      suggestion: (this.editor?.extensionStorage as unknown as Record<string, MentionStorage>)?.[\n        this.name\n      ]?.getSuggestionFromChar(node.attrs.mentionSuggestionChar),\n    }\n    if (this.options.renderLabel !== undefined) {\n      console.warn('renderLabel is deprecated use renderText and renderHTML instead')\n      return this.options.renderLabel(args)\n    }\n\n    return this.options.renderText(args)\n  },\n\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        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          // Store node and position for later use\n          let mentionNode = new ProseMirrorNode()\n          let mentionPos = 0\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true\n              mentionNode = node\n              mentionPos = pos\n              return false\n            }\n          })\n\n          if (isMention) {\n            tr.insertText(\n              this.options.deleteTriggerWithBackspace ? '' : mentionNode.attrs.mentionSuggestionChar,\n              mentionPos,\n              mentionPos + mentionNode.nodeSize,\n            )\n          }\n\n          return isMention\n        }),\n    }\n  },\n\n  addProseMirrorPlugins() {\n    // Create a plugin for each suggestion configuration\n    return this.storage.suggestions.map(Suggestion)\n  },\n\n  onBeforeCreate() {\n    this.storage.suggestions = (\n      this.options.suggestions.length ? this.options.suggestions : [this.options.suggestion]\n    ).map(suggestion =>\n      getSuggestionOptions({\n        editor: this.editor,\n        overrideSuggestionOptions: suggestion,\n        extensionName: this.name,\n        char: suggestion.char,\n      }),\n    )\n\n    this.storage.getSuggestionFromChar = char => {\n      const suggestion = this.storage.suggestions.find(s => s.char === char)\n      if (suggestion) {\n        return suggestion\n      }\n      if (this.storage.suggestions.length) {\n        return this.storage.suggestions[0]\n      }\n\n      return null\n    }\n  },\n})\n","import type { Editor } from '@tiptap/core'\nimport { PluginKey } from '@tiptap/pm/state'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\n\n/**\n * Arguments for the `getSuggestionOptions` function\n * @see getSuggestionOptions\n */\nexport interface GetSuggestionOptionsOptions {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor: Editor\n  /**\n   * The suggestion options configuration provided to the\n   * `Mention` extension.\n   */\n  overrideSuggestionOptions: Omit<SuggestionOptions, 'editor'>\n  /**\n   * The name of the Mention extension\n   */\n  extensionName: string\n  /**\n   * The character that triggers the suggestion.\n   * @default '@'\n   */\n  char?: string\n}\n\n/**\n * Returns the suggestion options for a trigger of the Mention extension. These\n * options are used to create a `Suggestion` ProseMirror plugin. Each plugin lets\n * you define a different trigger that opens the Mention menu. For example,\n * you can define a `@` trigger to mention users and a `#` trigger to mention\n * tags.\n *\n * @param param0 The configured options for the suggestion\n * @returns\n */\nexport function getSuggestionOptions({\n  editor: tiptapEditor,\n  overrideSuggestionOptions,\n  extensionName,\n  char = '@',\n}: GetSuggestionOptionsOptions): SuggestionOptions {\n  const pluginKey = new PluginKey()\n\n  return {\n    editor: tiptapEditor,\n    char,\n    pluginKey,\n    command: ({ editor, range, props }: { editor: any; range: any; props: any }) => {\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: extensionName,\n            attrs: { ...props, mentionSuggestionChar: char },\n          },\n          {\n            type: 'text',\n            text: ' ',\n          },\n        ])\n        .run()\n\n      // get reference to `window` object from editor element, to support cross-frame JS usage\n      editor.view.dom.ownerDocument.defaultView?.getSelection()?.collapseToEnd()\n    },\n    allow: ({ state, range }: { state: any; range: any }) => {\n      const $from = state.doc.resolve(range.from)\n      const type = state.schema.nodes[extensionName]\n      const allow = !!$from.parent.type.contentMatch.matchType(type)\n\n      return allow\n    },\n    ...overrideSuggestionOptions,\n  }\n}\n","import { Mention } from './mention.js'\n\nexport * from './mention.js'\n\nexport default Mention\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/mention.ts","../src/utils/get-default-suggestion-attributes.ts","../src/index.ts"],"sourcesContent":["import type { Editor } from '@tiptap/core'\nimport { mergeAttributes, Node } from '@tiptap/core'\nimport type { DOMOutputSpec } from '@tiptap/pm/model'\nimport { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\nimport Suggestion from '@tiptap/suggestion'\n\nimport { getSuggestionOptions } from './utils/get-default-suggestion-attributes.js'\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   * The character that triggers the suggestion, stored as\n   * `data-mention-suggestion-char` attribute.\n   */\n  mentionSuggestionChar?: string\n}\n\nexport interface 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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: {\n    options: MentionOptions<SuggestionItem, Attrs>\n    node: ProseMirrorNode\n    suggestion: SuggestionOptions | null\n  }) => 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, when you want to support multiple triggers.\n   *\n   * With this parameter, you can define multiple types of mention. For example, you can use the `@` character\n   * to mention users and the `#` character to mention tags.\n   *\n   * @default [{ char: '@', pluginKey: MentionPluginKey }]\n   * @example [{ char: '@', pluginKey: MentionPluginKey }, { char: '#', pluginKey: new PluginKey('hashtag') }]\n   */\n  suggestions: Array<Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>>\n\n  /**\n   * The suggestion options, when you want to support only one trigger. To support multiple triggers, use the\n   * `suggestions` parameter instead.\n   *\n   * @default {}\n   * @example { char: '@', pluginKey: MentionPluginKey, command: ({ editor, range, props }) => { ... } }\n   */\n  suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>\n}\n\ninterface GetSuggestionsOptions {\n  editor?: Editor\n  options: MentionOptions\n  name: string\n}\n\n/**\n * Returns the suggestions for the mention extension.\n *\n * @param options The extension options\n * @returns the suggestions\n */\nfunction getSuggestions(options: GetSuggestionsOptions) {\n  return (options.options.suggestions.length ? options.options.suggestions : [options.options.suggestion]).map(\n    suggestion =>\n      getSuggestionOptions({\n        // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility\n        editor: options.editor,\n        overrideSuggestionOptions: suggestion,\n        extensionName: options.name,\n        char: suggestion.char,\n      }),\n  )\n}\n\n/**\n * Returns the suggestion options of the mention that has a given character trigger. If not\n * found, it returns the first suggestion.\n *\n * @param options The extension options\n * @param char The character that triggers the mention\n * @returns The suggestion options\n */\nfunction getSuggestionFromChar(options: GetSuggestionsOptions, char: string) {\n  const suggestions = getSuggestions(options)\n\n  const suggestion = suggestions.find(s => s.char === char)\n  if (suggestion) {\n    return suggestion\n  }\n\n  if (suggestions.length) {\n    return suggestions[0]\n  }\n\n  return null\n}\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  priority: 101,\n\n  addOptions() {\n    return {\n      HTMLAttributes: {},\n      renderText({ node, suggestion }) {\n        return `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`\n      },\n      deleteTriggerWithBackspace: false,\n      renderHTML({ options, node, suggestion }) {\n        return [\n          'span',\n          mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),\n          `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`,\n        ]\n      },\n      suggestions: [],\n      suggestion: {},\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      // When there are multiple types of mentions, this attribute helps distinguish them\n      mentionSuggestionChar: {\n        default: '@',\n        parseHTML: element => element.getAttribute('data-mention-suggestion-char'),\n        renderHTML: attributes => {\n          return {\n            'data-mention-suggestion-char': attributes.mentionSuggestionChar,\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    const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar)\n\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          suggestion,\n        }),\n      ]\n    }\n    const mergedOptions = { ...this.options }\n\n    mergedOptions.HTMLAttributes = mergeAttributes(\n      { 'data-type': this.name },\n      this.options.HTMLAttributes,\n      HTMLAttributes,\n    )\n\n    const html = this.options.renderHTML({\n      options: mergedOptions,\n      node,\n      suggestion,\n    })\n\n    if (typeof html === 'string') {\n      return ['span', mergeAttributes({ 'data-type': this.name }, this.options.HTMLAttributes, HTMLAttributes), html]\n    }\n    return html\n  },\n\n  renderText({ node }) {\n    const args = {\n      options: this.options,\n      node,\n      suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar),\n    }\n    if (this.options.renderLabel !== undefined) {\n      console.warn('renderLabel is deprecated use renderText and renderHTML instead')\n      return this.options.renderLabel(args)\n    }\n\n    return this.options.renderText(args)\n  },\n\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        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          // Store node and position for later use\n          let mentionNode = new ProseMirrorNode()\n          let mentionPos = 0\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true\n              mentionNode = node\n              mentionPos = pos\n              return false\n            }\n          })\n\n          if (isMention) {\n            tr.insertText(\n              this.options.deleteTriggerWithBackspace ? '' : mentionNode.attrs.mentionSuggestionChar,\n              mentionPos,\n              mentionPos + mentionNode.nodeSize,\n            )\n          }\n\n          return isMention\n        }),\n    }\n  },\n\n  addProseMirrorPlugins() {\n    // Create a plugin for each suggestion configuration\n    return getSuggestions(this).map(Suggestion)\n  },\n})\n","import type { Editor } from '@tiptap/core'\nimport { PluginKey } from '@tiptap/pm/state'\nimport type { SuggestionOptions } from '@tiptap/suggestion'\n\n/**\n * Arguments for the `getSuggestionOptions` function\n * @see getSuggestionOptions\n */\nexport interface GetSuggestionOptionsOptions {\n  /**\n   * The Tiptap editor instance.\n   */\n  editor: Editor\n  /**\n   * The suggestion options configuration provided to the\n   * `Mention` extension.\n   */\n  overrideSuggestionOptions: Omit<SuggestionOptions, 'editor'>\n  /**\n   * The name of the Mention extension\n   */\n  extensionName: string\n  /**\n   * The character that triggers the suggestion.\n   * @default '@'\n   */\n  char?: string\n}\n\n/**\n * Returns the suggestion options for a trigger of the Mention extension. These\n * options are used to create a `Suggestion` ProseMirror plugin. Each plugin lets\n * you define a different trigger that opens the Mention menu. For example,\n * you can define a `@` trigger to mention users and a `#` trigger to mention\n * tags.\n *\n * @param param0 The configured options for the suggestion\n * @returns\n */\nexport function getSuggestionOptions({\n  editor: tiptapEditor,\n  overrideSuggestionOptions,\n  extensionName,\n  char = '@',\n}: GetSuggestionOptionsOptions): SuggestionOptions {\n  const pluginKey = new PluginKey()\n\n  return {\n    editor: tiptapEditor,\n    char,\n    pluginKey,\n    command: ({ editor, range, props }: { editor: any; range: any; props: any }) => {\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: extensionName,\n            attrs: { ...props, mentionSuggestionChar: char },\n          },\n          {\n            type: 'text',\n            text: ' ',\n          },\n        ])\n        .run()\n\n      // get reference to `window` object from editor element, to support cross-frame JS usage\n      editor.view.dom.ownerDocument.defaultView?.getSelection()?.collapseToEnd()\n    },\n    allow: ({ state, range }: { state: any; range: any }) => {\n      const $from = state.doc.resolve(range.from)\n      const type = state.schema.nodes[extensionName]\n      const allow = !!$from.parent.type.contentMatch.matchType(type)\n\n      return allow\n    },\n    ...overrideSuggestionOptions,\n  }\n}\n","import { Mention } from './mention.js'\n\nexport * from './mention.js'\n\nexport default Mention\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/extension-mention",
   "description": "mention extension for tiptap",
-  "version": "3.0.0-beta.17",
+  "version": "3.0.0-beta.18",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",
@@ -31,14 +31,14 @@
     "dist"
   ],
   "devDependencies": {
-    "@tiptap/core": "3.0.0-beta.17",
-    "@tiptap/suggestion": "3.0.0-beta.17",
-    "@tiptap/pm": "3.0.0-beta.17"
+    "@tiptap/core": "3.0.0-beta.18",
+    "@tiptap/pm": "3.0.0-beta.18",
+    "@tiptap/suggestion": "3.0.0-beta.18"
   },
   "peerDependencies": {
-    "@tiptap/core": "3.0.0-beta.17",
-    "@tiptap/pm": "3.0.0-beta.17",
-    "@tiptap/suggestion": "3.0.0-beta.17"
+    "@tiptap/core": "3.0.0-beta.18",
+    "@tiptap/pm": "3.0.0-beta.18",
+    "@tiptap/suggestion": "3.0.0-beta.18"
   },
   "repository": {
     "type": "git",

package/src/mention.ts

@@ -1,3 +1,4 @@
+import type { Editor } from '@tiptap/core'
 import { mergeAttributes, Node } from '@tiptap/core'
 import type { DOMOutputSpec } from '@tiptap/pm/model'
 import { Node as ProseMirrorNode } from '@tiptap/pm/model'
@@ -97,53 +98,75 @@ export interface MentionOptions<SuggestionItem = any, Attrs extends Record<strin
   suggestion: Omit<SuggestionOptions<SuggestionItem, Attrs>, 'editor'>
 }
 
+interface GetSuggestionsOptions {
+  editor?: Editor
+  options: MentionOptions
+  name: string
+}
+
 /**
- * Storage properties or the Mention extension
+ * Returns the suggestions for the mention extension.
+ *
+ * @param options The extension options
+ * @returns the suggestions
  */
-export interface MentionStorage<SuggestionItem = any, Attrs extends Record<string, any> = MentionNodeAttrs> {
-  /**
-   * The list of suggestions that will trigger the mention.
-   */
-  suggestions: Array<SuggestionOptions<SuggestionItem, Attrs>>
+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 char The character that triggers the mention
-   * @returns The suggestion options
-   */
-  getSuggestionFromChar: (char: string) => SuggestionOptions<SuggestionItem, Attrs> | null
+/**
+ * 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.
  * @see https://www.tiptap.dev/api/extensions/mention
  */
-export const Mention = Node.create<MentionOptions, MentionStorage>({
+export const Mention = Node.create<MentionOptions>({
   name: 'mention',
 
   priority: 101,
 
-  addStorage() {
-    return {
-      suggestions: [],
-      getSuggestionFromChar: () => null,
-    }
-  },
-
   addOptions() {
     return {
       HTMLAttributes: {},
       renderText({ node, suggestion }) {
-        return `${suggestion?.char}${node.attrs.label ?? node.attrs.id}`
+        return `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`
       },
       deleteTriggerWithBackspace: false,
       renderHTML({ options, node, suggestion }) {
         return [
           'span',
           mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),
-          `${suggestion?.char}${node.attrs.label ?? node.attrs.id}`,
+          `${suggestion?.char ?? '@'}${node.attrs.label ?? node.attrs.id}`,
         ]
       },
       suggestions: [],
@@ -211,11 +234,7 @@ export const Mention = Node.create<MentionOptions, MentionStorage>({
   },
 
   renderHTML({ node, HTMLAttributes }) {
-    // We cannot use the `this.storage` property here because, when accessed this method,
-    // it returns the initial value of the extension storage
-    const suggestion = (this.editor?.extensionStorage as unknown as Record<string, MentionStorage>)?.[
-      this.name
-    ]?.getSuggestionFromChar(node.attrs.mentionSuggestionChar)
+    const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar)
 
     if (this.options.renderLabel !== undefined) {
       console.warn('renderLabel is deprecated use renderText and renderHTML instead')
@@ -253,9 +272,7 @@ export const Mention = Node.create<MentionOptions, MentionStorage>({
     const args = {
       options: this.options,
       node,
-      suggestion: (this.editor?.extensionStorage as unknown as Record<string, MentionStorage>)?.[
-        this.name
-      ]?.getSuggestionFromChar(node.attrs.mentionSuggestionChar),
+      suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar),
     }
     if (this.options.renderLabel !== undefined) {
       console.warn('renderLabel is deprecated use renderText and renderHTML instead')
@@ -305,31 +322,6 @@ export const Mention = Node.create<MentionOptions, MentionStorage>({
 
   addProseMirrorPlugins() {
     // Create a plugin for each suggestion configuration
-    return this.storage.suggestions.map(Suggestion)
-  },
-
-  onBeforeCreate() {
-    this.storage.suggestions = (
-      this.options.suggestions.length ? this.options.suggestions : [this.options.suggestion]
-    ).map(suggestion =>
-      getSuggestionOptions({
-        editor: this.editor,
-        overrideSuggestionOptions: suggestion,
-        extensionName: this.name,
-        char: suggestion.char,
-      }),
-    )
-
-    this.storage.getSuggestionFromChar = char => {
-      const suggestion = this.storage.suggestions.find(s => s.char === char)
-      if (suggestion) {
-        return suggestion
-      }
-      if (this.storage.suggestions.length) {
-        return this.storage.suggestions[0]
-      }
-
-      return null
-    }
+    return getSuggestions(this).map(Suggestion)
   },
 })