@tiptap/extension-mention 2.22.3 → 2.23.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -3,18 +3,100 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var core = require('@tiptap/core');
6
- var state = require('@tiptap/pm/state');
6
+ var model = require('@tiptap/pm/model');
7
7
  var Suggestion = require('@tiptap/suggestion');
8
+ var state = require('@tiptap/pm/state');
8
9
 
9
10
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
10
11
 
11
12
  var Suggestion__default = /*#__PURE__*/_interopDefaultCompat(Suggestion);
12
13
 
13
14
  /**
14
- * The plugin key for the mention plugin.
15
- * @default 'mention'
15
+ * Returns the suggestion options for a trigger of the Mention extension. These
16
+ * options are used to create a `Suggestion` ProseMirror plugin. Each plugin lets
17
+ * you define a different trigger that opens the Mention menu. For example,
18
+ * you can define a `@` trigger to mention users and a `#` trigger to mention
19
+ * tags.
20
+ *
21
+ * @param param0 The configured options for the suggestion
22
+ * @returns
23
+ */
24
+ function getSuggestionOptions({ editor: tiptapEditor, overrideSuggestionOptions, extensionName, char = '@', }) {
25
+ const pluginKey = new state.PluginKey();
26
+ return {
27
+ editor: tiptapEditor,
28
+ char,
29
+ pluginKey,
30
+ command: ({ editor, range, props }) => {
31
+ var _a, _b, _c;
32
+ // increase range.to by one when the next node is of type "text"
33
+ // and starts with a space character
34
+ const nodeAfter = editor.view.state.selection.$to.nodeAfter;
35
+ const overrideSpace = (_a = nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.text) === null || _a === void 0 ? void 0 : _a.startsWith(' ');
36
+ if (overrideSpace) {
37
+ range.to += 1;
38
+ }
39
+ editor
40
+ .chain()
41
+ .focus()
42
+ .insertContentAt(range, [
43
+ {
44
+ type: extensionName,
45
+ attrs: { ...props, mentionSuggestionChar: char },
46
+ },
47
+ {
48
+ type: 'text',
49
+ text: ' ',
50
+ },
51
+ ])
52
+ .run();
53
+ // get reference to `window` object from editor element, to support cross-frame JS usage
54
+ (_c = (_b = editor.view.dom.ownerDocument.defaultView) === null || _b === void 0 ? void 0 : _b.getSelection()) === null || _c === void 0 ? void 0 : _c.collapseToEnd();
55
+ },
56
+ allow: ({ state, range }) => {
57
+ const $from = state.doc.resolve(range.from);
58
+ const type = state.schema.nodes[extensionName];
59
+ const allow = !!$from.parent.type.contentMatch.matchType(type);
60
+ return allow;
61
+ },
62
+ ...overrideSuggestionOptions,
63
+ };
64
+ }
65
+
66
+ /**
67
+ * Returns the suggestions for the mention extension.
68
+ *
69
+ * @param options The extension options
70
+ * @returns the suggestions
71
+ */
72
+ function getSuggestions(options) {
73
+ return (options.options.suggestions.length ? options.options.suggestions : [options.options.suggestion]).map(suggestion => getSuggestionOptions({
74
+ // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility
75
+ editor: options.editor,
76
+ overrideSuggestionOptions: suggestion,
77
+ extensionName: options.name,
78
+ char: suggestion.char,
79
+ }));
80
+ }
81
+ /**
82
+ * Returns the suggestion options of the mention that has a given character trigger. If not
83
+ * found, it returns the first suggestion.
84
+ *
85
+ * @param options The extension options
86
+ * @param char The character that triggers the mention
87
+ * @returns The suggestion options
16
88
  */
17
- const MentionPluginKey = new state.PluginKey('mention');
89
+ function getSuggestionFromChar(options, char) {
90
+ const suggestions = getSuggestions(options);
91
+ const suggestion = suggestions.find(s => s.char === char);
92
+ if (suggestion) {
93
+ return suggestion;
94
+ }
95
+ if (suggestions.length) {
96
+ return suggestions[0];
97
+ }
98
+ return null;
99
+ }
18
100
  /**
19
101
  * This extension allows you to insert mentions into the editor.
20
102
  * @see https://www.tiptap.dev/api/extensions/mention
@@ -25,55 +107,21 @@ const Mention = core.Node.create({
25
107
  addOptions() {
26
108
  return {
27
109
  HTMLAttributes: {},
28
- renderText({ options, node }) {
29
- var _a;
30
- return `${options.suggestion.char}${(_a = node.attrs.label) !== null && _a !== void 0 ? _a : node.attrs.id}`;
110
+ renderText({ node, suggestion }) {
111
+ var _a, _b;
112
+ return `${(_a = suggestion === null || suggestion === void 0 ? void 0 : suggestion.char) !== null && _a !== void 0 ? _a : '@'}${(_b = node.attrs.label) !== null && _b !== void 0 ? _b : node.attrs.id}`;
31
113
  },
32
114
  deleteTriggerWithBackspace: false,
33
- renderHTML({ options, node }) {
34
- var _a;
115
+ renderHTML({ options, node, suggestion }) {
116
+ var _a, _b;
35
117
  return [
36
118
  'span',
37
119
  core.mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),
38
- `${options.suggestion.char}${(_a = node.attrs.label) !== null && _a !== void 0 ? _a : node.attrs.id}`,
120
+ `${(_a = suggestion === null || suggestion === void 0 ? void 0 : suggestion.char) !== null && _a !== void 0 ? _a : '@'}${(_b = node.attrs.label) !== null && _b !== void 0 ? _b : node.attrs.id}`,
39
121
  ];
40
122
  },
41
- suggestion: {
42
- char: '@',
43
- pluginKey: MentionPluginKey,
44
- command: ({ editor, range, props }) => {
45
- var _a, _b, _c;
46
- // increase range.to by one when the next node is of type "text"
47
- // and starts with a space character
48
- const nodeAfter = editor.view.state.selection.$to.nodeAfter;
49
- const overrideSpace = (_a = nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.text) === null || _a === void 0 ? void 0 : _a.startsWith(' ');
50
- if (overrideSpace) {
51
- range.to += 1;
52
- }
53
- editor
54
- .chain()
55
- .focus()
56
- .insertContentAt(range, [
57
- {
58
- type: this.name,
59
- attrs: props,
60
- },
61
- {
62
- type: 'text',
63
- text: ' ',
64
- },
65
- ])
66
- .run();
67
- // get reference to `window` object from editor element, to support cross-frame JS usage
68
- (_c = (_b = editor.view.dom.ownerDocument.defaultView) === null || _b === void 0 ? void 0 : _b.getSelection()) === null || _c === void 0 ? void 0 : _c.collapseToEnd();
69
- },
70
- allow: ({ state, range }) => {
71
- const $from = state.doc.resolve(range.from);
72
- const type = state.schema.nodes[this.name];
73
- const allow = !!$from.parent.type.contentMatch.matchType(type);
74
- return allow;
75
- },
76
- },
123
+ suggestions: [],
124
+ suggestion: {},
77
125
  };
78
126
  },
79
127
  group: 'inline',
@@ -106,6 +154,16 @@ const Mention = core.Node.create({
106
154
  };
107
155
  },
108
156
  },
157
+ // When there are multiple types of mentions, this attribute helps distinguish them
158
+ mentionSuggestionChar: {
159
+ default: '@',
160
+ parseHTML: element => element.getAttribute('data-mention-suggestion-char'),
161
+ renderHTML: attributes => {
162
+ return {
163
+ 'data-mention-suggestion-char': attributes.mentionSuggestionChar,
164
+ };
165
+ },
166
+ },
109
167
  };
110
168
  },
111
169
  parseHTML() {
@@ -116,6 +174,7 @@ const Mention = core.Node.create({
116
174
  ];
117
175
  },
118
176
  renderHTML({ node, HTMLAttributes }) {
177
+ const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar);
119
178
  if (this.options.renderLabel !== undefined) {
120
179
  console.warn('renderLabel is deprecated use renderText and renderHTML instead');
121
180
  return [
@@ -124,6 +183,7 @@ const Mention = core.Node.create({
124
183
  this.options.renderLabel({
125
184
  options: this.options,
126
185
  node,
186
+ suggestion,
127
187
  }),
128
188
  ];
129
189
  }
@@ -132,6 +192,7 @@ const Mention = core.Node.create({
132
192
  const html = this.options.renderHTML({
133
193
  options: mergedOptions,
134
194
  node,
195
+ suggestion,
135
196
  });
136
197
  if (typeof html === 'string') {
137
198
  return [
@@ -143,17 +204,16 @@ const Mention = core.Node.create({
143
204
  return html;
144
205
  },
145
206
  renderText({ node }) {
207
+ const args = {
208
+ options: this.options,
209
+ node,
210
+ suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar),
211
+ };
146
212
  if (this.options.renderLabel !== undefined) {
147
213
  console.warn('renderLabel is deprecated use renderText and renderHTML instead');
148
- return this.options.renderLabel({
149
- options: this.options,
150
- node,
151
- });
214
+ return this.options.renderLabel(args);
152
215
  }
153
- return this.options.renderText({
154
- options: this.options,
155
- node,
156
- });
216
+ return this.options.renderText(args);
157
217
  },
158
218
  addKeyboardShortcuts() {
159
219
  return {
@@ -171,21 +231,30 @@ const Mention = core.Node.create({
171
231
  return false;
172
232
  }
173
233
  });
234
+ // Store node and position for later use
235
+ let mentionNode = new model.Node();
236
+ let mentionPos = 0;
237
+ state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
238
+ if (node.type.name === this.name) {
239
+ isMention = true;
240
+ mentionNode = node;
241
+ mentionPos = pos;
242
+ return false;
243
+ }
244
+ });
245
+ if (isMention) {
246
+ tr.insertText(this.options.deleteTriggerWithBackspace ? '' : mentionNode.attrs.mentionSuggestionChar, mentionPos, mentionPos + mentionNode.nodeSize);
247
+ }
174
248
  return isMention;
175
249
  }),
176
250
  };
177
251
  },
178
252
  addProseMirrorPlugins() {
179
- return [
180
- Suggestion__default.default({
181
- editor: this.editor,
182
- ...this.options.suggestion,
183
- }),
184
- ];
253
+ // Create a plugin for each suggestion configuration
254
+ return getSuggestions(this).map(Suggestion__default.default);
185
255
  },
186
256
  });
187
257
 
188
258
  exports.Mention = Mention;
189
- exports.MentionPluginKey = MentionPluginKey;
190
259
  exports.default = Mention;
191
260
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","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 priority: 101,\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 // 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 }) => {\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","Suggestion"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs","sources":["../src/utils/get-default-suggestion-attributes.ts","../src/mention.ts"],"sourcesContent":["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 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 => 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\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 [\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 const args = {\n options: this.options,\n node,\n suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar),\n }\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: () => 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 // 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"],"names":["PluginKey","Node","mergeAttributes","ProseMirrorNode","Suggestion"],"mappings":";;;;;;;;;;;;;AA6BA;;;;;;;;;AASG;AACa,SAAA,oBAAoB,CAAC,EACnC,MAAM,EAAE,YAAY,EACpB,yBAAyB,EACzB,aAAa,EACb,IAAI,GAAG,GAAG,GACkB,EAAA;AAC5B,IAAA,MAAM,SAAS,GAAG,IAAIA,eAAS,EAAE;IAEjC,OAAO;AACL,QAAA,MAAM,EAAE,YAAY;QACpB,IAAI;QACJ,SAAS;QACT,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAA2C,KAAI;;;;AAG7E,YAAA,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS;AAC3D,YAAA,MAAM,aAAa,GAAG,CAAA,EAAA,GAAA,SAAS,aAAT,SAAS,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAT,SAAS,CAAE,IAAI,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,UAAU,CAAC,GAAG,CAAC;YAEtD,IAAI,aAAa,EAAE;AACjB,gBAAA,KAAK,CAAC,EAAE,IAAI,CAAC;;YAGf;AACG,iBAAA,KAAK;AACL,iBAAA,KAAK;iBACL,eAAe,CAAC,KAAK,EAAE;AACtB,gBAAA;AACE,oBAAA,IAAI,EAAE,aAAa;oBACnB,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,qBAAqB,EAAE,IAAI,EAAE;AACjD,iBAAA;AACD,gBAAA;AACE,oBAAA,IAAI,EAAE,MAAM;AACZ,oBAAA,IAAI,EAAE,GAAG;AACV,iBAAA;aACF;AACA,iBAAA,GAAG,EAAE;;AAGR,YAAA,CAAA,EAAA,GAAA,MAAA,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,WAAW,0CAAE,YAAY,EAAE,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,aAAa,EAAE;SAC3E;QACD,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAA8B,KAAI;AACtD,YAAA,MAAM,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;YAC3C,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,aAAa,CAAC;AAC9C,YAAA,MAAM,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC;AAE9D,YAAA,OAAO,KAAK;SACb;AACD,QAAA,GAAG,yBAAyB;KAC7B;AACH;;ACkBA;;;;;AAKG;AACH,SAAS,cAAc,CAAC,OAA8B,EAAA;AACpD,IAAA,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CAAC,MAAM,GAAG,OAAO,CAAC,OAAO,CAAC,WAAW,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE,GAAG,CAC1G,UAAU,IAAI,oBAAoB,CAAC;;QAEjC,MAAM,EAAE,OAAO,CAAC,MAAM;AACtB,QAAA,yBAAyB,EAAE,UAAU;QACrC,aAAa,EAAE,OAAO,CAAC,IAAI;QAC3B,IAAI,EAAE,UAAU,CAAC,IAAI;AACtB,KAAA,CAAC,CACH;AACH;AAEA;;;;;;;AAOG;AACH,SAAS,qBAAqB,CAAC,OAA8B,EAAE,IAAY,EAAA;AACzE,IAAA,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,CAAC;AAE3C,IAAA,MAAM,UAAU,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC;IAEzD,IAAI,UAAU,EAAE;AACd,QAAA,OAAO,UAAU;;AAGnB,IAAA,IAAI,WAAW,CAAC,MAAM,EAAE;AACtB,QAAA,OAAO,WAAW,CAAC,CAAC,CAAC;;AAGvB,IAAA,OAAO,IAAI;AACb;AAEA;;;AAGG;AACU,MAAA,OAAO,GAAGC,SAAI,CAAC,MAAM,CAAiB;AACjD,IAAA,IAAI,EAAE,SAAS;AAEf,IAAA,QAAQ,EAAE,GAAG;IAEb,UAAU,GAAA;QACR,OAAO;AACL,YAAA,cAAc,EAAE,EAAE;AAClB,YAAA,UAAU,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,EAAA;;gBAC7B,OAAO,CAAA,EAAG,CAAA,EAAA,GAAA,UAAU,KAAV,IAAA,IAAA,UAAU,uBAAV,UAAU,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,GAAG,CAAA,EAAG,MAAA,IAAI,CAAC,KAAK,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,IAAI,CAAC,KAAK,CAAC,EAAE,CAAA,CAAE;aACxE;AACD,YAAA,0BAA0B,EAAE,KAAK;AACjC,YAAA,UAAU,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,EAAA;;gBACtC,OAAO;oBACL,MAAM;oBACNC,oBAAe,CAAC,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,cAAc,CAAC;oBAC5D,CAAG,EAAA,CAAA,EAAA,GAAA,UAAU,KAAV,IAAA,IAAA,UAAU,uBAAV,UAAU,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,GAAG,CAAA,EAAG,MAAA,IAAI,CAAC,KAAK,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,IAAI,CAAC,KAAK,CAAC,EAAE,CAAE,CAAA;iBACjE;aACF;AACD,YAAA,WAAW,EAAE,EAAE;AACf,YAAA,UAAU,EAAE,EAAE;SACf;KACF;AAED,IAAA,KAAK,EAAE,QAAQ;AAEf,IAAA,MAAM,EAAE,IAAI;AAEZ,IAAA,UAAU,EAAE,KAAK;AAEjB,IAAA,IAAI,EAAE,IAAI;IAEV,aAAa,GAAA;QACX,OAAO;AACL,YAAA,EAAE,EAAE;AACF,gBAAA,OAAO,EAAE,IAAI;gBACb,SAAS,EAAE,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,SAAS,CAAC;gBACrD,UAAU,EAAE,UAAU,IAAG;AACvB,oBAAA,IAAI,CAAC,UAAU,CAAC,EAAE,EAAE;AAClB,wBAAA,OAAO,EAAE;;oBAGX,OAAO;wBACL,SAAS,EAAE,UAAU,CAAC,EAAE;qBACzB;iBACF;AACF,aAAA;AAED,YAAA,KAAK,EAAE;AACL,gBAAA,OAAO,EAAE,IAAI;gBACb,SAAS,EAAE,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,YAAY,CAAC;gBACxD,UAAU,EAAE,UAAU,IAAG;AACvB,oBAAA,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE;AACrB,wBAAA,OAAO,EAAE;;oBAGX,OAAO;wBACL,YAAY,EAAE,UAAU,CAAC,KAAK;qBAC/B;iBACF;AACF,aAAA;;AAGD,YAAA,qBAAqB,EAAE;AACrB,gBAAA,OAAO,EAAE,GAAG;gBACZ,SAAS,EAAE,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,8BAA8B,CAAC;gBAC1E,UAAU,EAAE,UAAU,IAAG;oBACvB,OAAO;wBACL,8BAA8B,EAAE,UAAU,CAAC,qBAAqB;qBACjE;iBACF;AACF,aAAA;SACF;KACF;IAED,SAAS,GAAA;QACP,OAAO;AACL,YAAA;AACE,gBAAA,GAAG,EAAE,CAAA,gBAAA,EAAmB,IAAI,CAAC,IAAI,CAAI,EAAA,CAAA;AACtC,aAAA;SACF;KACF;AAED,IAAA,UAAU,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE,EAAA;AACjC,QAAA,MAAM,UAAU,GAAG,qBAAqB,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC;QAEhF,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,KAAK,SAAS,EAAE;AAC1C,YAAA,OAAO,CAAC,IAAI,CAAC,iEAAiE,CAAC;YAC/E,OAAO;gBACL,MAAM;AACN,gBAAAA,oBAAe,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,cAAc,EAAE,cAAc,CAAC;AACxF,gBAAA,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC;oBACvB,OAAO,EAAE,IAAI,CAAC,OAAO;oBACrB,IAAI;oBACJ,UAAU;iBACX,CAAC;aACH;;QAEH,MAAM,aAAa,GAAG,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE;QAEzC,aAAa,CAAC,cAAc,GAAGA,oBAAe,CAC5C,EAAE,WAAW,EAAE,IAAI,CAAC,IAAI,EAAE,EAC1B,IAAI,CAAC,OAAO,CAAC,cAAc,EAC3B,cAAc,CACf;AAED,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC;AACnC,YAAA,OAAO,EAAE,aAAa;YACtB,IAAI;YACJ,UAAU;AACX,SAAA,CAAC;AAEF,QAAA,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;YAC5B,OAAO;gBACL,MAAM;AACN,gBAAAA,oBAAe,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,cAAc,EAAE,cAAc,CAAC;gBACxF,IAAI;aACL;;AAEH,QAAA,OAAO,IAAI;KACZ;IAED,UAAU,CAAC,EAAE,IAAI,EAAE,EAAA;AACjB,QAAA,MAAM,IAAI,GAAG;YACX,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,IAAI;YACJ,UAAU,EAAE,qBAAqB,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC;SAC1E;QAED,IAAI,IAAI,CAAC,OAAO,CAAC,WAAW,KAAK,SAAS,EAAE;AAC1C,YAAA,OAAO,CAAC,IAAI,CAAC,iEAAiE,CAAC;YAC/E,OAAO,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC;;QAGvC,OAAO,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC;KACrC;IAED,oBAAoB,GAAA;QAClB,OAAO;AACL,YAAA,SAAS,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,KAAI;gBAC9D,IAAI,SAAS,GAAG,KAAK;AACrB,gBAAA,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK;AAC3B,gBAAA,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,SAAS;gBAEnC,IAAI,CAAC,KAAK,EAAE;AACV,oBAAA,OAAO,KAAK;;AAGd,gBAAA,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,IAAI,EAAE,GAAG,KAAI;oBACvD,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;wBAChC,SAAS,GAAG,IAAI;AAChB,wBAAA,EAAE,CAAC,UAAU,CACX,IAAI,CAAC,OAAO,CAAC,0BAA0B,GAAG,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,IAAI,EAAE,EACjF,GAAG,EACH,GAAG,GAAG,IAAI,CAAC,QAAQ,CACpB;AAED,wBAAA,OAAO,KAAK;;AAEhB,iBAAC,CAAC;;AAGF,gBAAA,IAAI,WAAW,GAAG,IAAIC,UAAe,EAAE;gBACvC,IAAI,UAAU,GAAG,CAAC;AAElB,gBAAA,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,IAAI,EAAE,GAAG,KAAI;oBACvD,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;wBAChC,SAAS,GAAG,IAAI;wBAChB,WAAW,GAAG,IAAI;wBAClB,UAAU,GAAG,GAAG;AAChB,wBAAA,OAAO,KAAK;;AAEhB,iBAAC,CAAC;gBAEF,IAAI,SAAS,EAAE;AACb,oBAAA,EAAE,CAAC,UAAU,CACX,IAAI,CAAC,OAAO,CAAC,0BAA0B,GAAG,EAAE,GAAG,WAAW,CAAC,KAAK,CAAC,qBAAqB,EACtF,UAAU,EACV,UAAU,GAAG,WAAW,CAAC,QAAQ,CAClC;;AAGH,gBAAA,OAAO,SAAS;AAClB,aAAC,CAAC;SACH;KACF;IAED,qBAAqB,GAAA;;QAEnB,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC,GAAG,CAACC,2BAAU,CAAC;KAC5C;AACF,CAAA;;;;;"}
package/dist/index.js CHANGED
@@ -1,12 +1,94 @@
1
1
  import { Node, mergeAttributes } from '@tiptap/core';
2
- import { PluginKey } from '@tiptap/pm/state';
2
+ import { Node as Node$1 } from '@tiptap/pm/model';
3
3
  import Suggestion from '@tiptap/suggestion';
4
+ import { PluginKey } from '@tiptap/pm/state';
4
5
 
5
6
  /**
6
- * The plugin key for the mention plugin.
7
- * @default 'mention'
7
+ * Returns the suggestion options for a trigger of the Mention extension. These
8
+ * options are used to create a `Suggestion` ProseMirror plugin. Each plugin lets
9
+ * you define a different trigger that opens the Mention menu. For example,
10
+ * you can define a `@` trigger to mention users and a `#` trigger to mention
11
+ * tags.
12
+ *
13
+ * @param param0 The configured options for the suggestion
14
+ * @returns
15
+ */
16
+ function getSuggestionOptions({ editor: tiptapEditor, overrideSuggestionOptions, extensionName, char = '@', }) {
17
+ const pluginKey = new PluginKey();
18
+ return {
19
+ editor: tiptapEditor,
20
+ char,
21
+ pluginKey,
22
+ command: ({ editor, range, props }) => {
23
+ var _a, _b, _c;
24
+ // increase range.to by one when the next node is of type "text"
25
+ // and starts with a space character
26
+ const nodeAfter = editor.view.state.selection.$to.nodeAfter;
27
+ const overrideSpace = (_a = nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.text) === null || _a === void 0 ? void 0 : _a.startsWith(' ');
28
+ if (overrideSpace) {
29
+ range.to += 1;
30
+ }
31
+ editor
32
+ .chain()
33
+ .focus()
34
+ .insertContentAt(range, [
35
+ {
36
+ type: extensionName,
37
+ attrs: { ...props, mentionSuggestionChar: char },
38
+ },
39
+ {
40
+ type: 'text',
41
+ text: ' ',
42
+ },
43
+ ])
44
+ .run();
45
+ // get reference to `window` object from editor element, to support cross-frame JS usage
46
+ (_c = (_b = editor.view.dom.ownerDocument.defaultView) === null || _b === void 0 ? void 0 : _b.getSelection()) === null || _c === void 0 ? void 0 : _c.collapseToEnd();
47
+ },
48
+ allow: ({ state, range }) => {
49
+ const $from = state.doc.resolve(range.from);
50
+ const type = state.schema.nodes[extensionName];
51
+ const allow = !!$from.parent.type.contentMatch.matchType(type);
52
+ return allow;
53
+ },
54
+ ...overrideSuggestionOptions,
55
+ };
56
+ }
57
+
58
+ /**
59
+ * Returns the suggestions for the mention extension.
60
+ *
61
+ * @param options The extension options
62
+ * @returns the suggestions
63
+ */
64
+ function getSuggestions(options) {
65
+ return (options.options.suggestions.length ? options.options.suggestions : [options.options.suggestion]).map(suggestion => getSuggestionOptions({
66
+ // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility
67
+ editor: options.editor,
68
+ overrideSuggestionOptions: suggestion,
69
+ extensionName: options.name,
70
+ char: suggestion.char,
71
+ }));
72
+ }
73
+ /**
74
+ * Returns the suggestion options of the mention that has a given character trigger. If not
75
+ * found, it returns the first suggestion.
76
+ *
77
+ * @param options The extension options
78
+ * @param char The character that triggers the mention
79
+ * @returns The suggestion options
8
80
  */
9
- const MentionPluginKey = new PluginKey('mention');
81
+ function getSuggestionFromChar(options, char) {
82
+ const suggestions = getSuggestions(options);
83
+ const suggestion = suggestions.find(s => s.char === char);
84
+ if (suggestion) {
85
+ return suggestion;
86
+ }
87
+ if (suggestions.length) {
88
+ return suggestions[0];
89
+ }
90
+ return null;
91
+ }
10
92
  /**
11
93
  * This extension allows you to insert mentions into the editor.
12
94
  * @see https://www.tiptap.dev/api/extensions/mention
@@ -17,55 +99,21 @@ const Mention = Node.create({
17
99
  addOptions() {
18
100
  return {
19
101
  HTMLAttributes: {},
20
- renderText({ options, node }) {
21
- var _a;
22
- return `${options.suggestion.char}${(_a = node.attrs.label) !== null && _a !== void 0 ? _a : node.attrs.id}`;
102
+ renderText({ node, suggestion }) {
103
+ var _a, _b;
104
+ return `${(_a = suggestion === null || suggestion === void 0 ? void 0 : suggestion.char) !== null && _a !== void 0 ? _a : '@'}${(_b = node.attrs.label) !== null && _b !== void 0 ? _b : node.attrs.id}`;
23
105
  },
24
106
  deleteTriggerWithBackspace: false,
25
- renderHTML({ options, node }) {
26
- var _a;
107
+ renderHTML({ options, node, suggestion }) {
108
+ var _a, _b;
27
109
  return [
28
110
  'span',
29
111
  mergeAttributes(this.HTMLAttributes, options.HTMLAttributes),
30
- `${options.suggestion.char}${(_a = node.attrs.label) !== null && _a !== void 0 ? _a : node.attrs.id}`,
112
+ `${(_a = suggestion === null || suggestion === void 0 ? void 0 : suggestion.char) !== null && _a !== void 0 ? _a : '@'}${(_b = node.attrs.label) !== null && _b !== void 0 ? _b : node.attrs.id}`,
31
113
  ];
32
114
  },
33
- suggestion: {
34
- char: '@',
35
- pluginKey: MentionPluginKey,
36
- command: ({ editor, range, props }) => {
37
- var _a, _b, _c;
38
- // increase range.to by one when the next node is of type "text"
39
- // and starts with a space character
40
- const nodeAfter = editor.view.state.selection.$to.nodeAfter;
41
- const overrideSpace = (_a = nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.text) === null || _a === void 0 ? void 0 : _a.startsWith(' ');
42
- if (overrideSpace) {
43
- range.to += 1;
44
- }
45
- editor
46
- .chain()
47
- .focus()
48
- .insertContentAt(range, [
49
- {
50
- type: this.name,
51
- attrs: props,
52
- },
53
- {
54
- type: 'text',
55
- text: ' ',
56
- },
57
- ])
58
- .run();
59
- // get reference to `window` object from editor element, to support cross-frame JS usage
60
- (_c = (_b = editor.view.dom.ownerDocument.defaultView) === null || _b === void 0 ? void 0 : _b.getSelection()) === null || _c === void 0 ? void 0 : _c.collapseToEnd();
61
- },
62
- allow: ({ state, range }) => {
63
- const $from = state.doc.resolve(range.from);
64
- const type = state.schema.nodes[this.name];
65
- const allow = !!$from.parent.type.contentMatch.matchType(type);
66
- return allow;
67
- },
68
- },
115
+ suggestions: [],
116
+ suggestion: {},
69
117
  };
70
118
  },
71
119
  group: 'inline',
@@ -98,6 +146,16 @@ const Mention = Node.create({
98
146
  };
99
147
  },
100
148
  },
149
+ // When there are multiple types of mentions, this attribute helps distinguish them
150
+ mentionSuggestionChar: {
151
+ default: '@',
152
+ parseHTML: element => element.getAttribute('data-mention-suggestion-char'),
153
+ renderHTML: attributes => {
154
+ return {
155
+ 'data-mention-suggestion-char': attributes.mentionSuggestionChar,
156
+ };
157
+ },
158
+ },
101
159
  };
102
160
  },
103
161
  parseHTML() {
@@ -108,6 +166,7 @@ const Mention = Node.create({
108
166
  ];
109
167
  },
110
168
  renderHTML({ node, HTMLAttributes }) {
169
+ const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar);
111
170
  if (this.options.renderLabel !== undefined) {
112
171
  console.warn('renderLabel is deprecated use renderText and renderHTML instead');
113
172
  return [
@@ -116,6 +175,7 @@ const Mention = Node.create({
116
175
  this.options.renderLabel({
117
176
  options: this.options,
118
177
  node,
178
+ suggestion,
119
179
  }),
120
180
  ];
121
181
  }
@@ -124,6 +184,7 @@ const Mention = Node.create({
124
184
  const html = this.options.renderHTML({
125
185
  options: mergedOptions,
126
186
  node,
187
+ suggestion,
127
188
  });
128
189
  if (typeof html === 'string') {
129
190
  return [
@@ -135,17 +196,16 @@ const Mention = Node.create({
135
196
  return html;
136
197
  },
137
198
  renderText({ node }) {
199
+ const args = {
200
+ options: this.options,
201
+ node,
202
+ suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar),
203
+ };
138
204
  if (this.options.renderLabel !== undefined) {
139
205
  console.warn('renderLabel is deprecated use renderText and renderHTML instead');
140
- return this.options.renderLabel({
141
- options: this.options,
142
- node,
143
- });
206
+ return this.options.renderLabel(args);
144
207
  }
145
- return this.options.renderText({
146
- options: this.options,
147
- node,
148
- });
208
+ return this.options.renderText(args);
149
209
  },
150
210
  addKeyboardShortcuts() {
151
211
  return {
@@ -163,19 +223,29 @@ const Mention = Node.create({
163
223
  return false;
164
224
  }
165
225
  });
226
+ // Store node and position for later use
227
+ let mentionNode = new Node$1();
228
+ let mentionPos = 0;
229
+ state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
230
+ if (node.type.name === this.name) {
231
+ isMention = true;
232
+ mentionNode = node;
233
+ mentionPos = pos;
234
+ return false;
235
+ }
236
+ });
237
+ if (isMention) {
238
+ tr.insertText(this.options.deleteTriggerWithBackspace ? '' : mentionNode.attrs.mentionSuggestionChar, mentionPos, mentionPos + mentionNode.nodeSize);
239
+ }
166
240
  return isMention;
167
241
  }),
168
242
  };
169
243
  },
170
244
  addProseMirrorPlugins() {
171
- return [
172
- Suggestion({
173
- editor: this.editor,
174
- ...this.options.suggestion,
175
- }),
176
- ];
245
+ // Create a plugin for each suggestion configuration
246
+ return getSuggestions(this).map(Suggestion);
177
247
  },
178
248
  });
179
249
 
180
- export { Mention, MentionPluginKey, Mention as default };
250
+ export { Mention, Mention as default };
181
251
  //# sourceMappingURL=index.js.map