This adds the code required for us to mention objects in rich text fields like team descriptions. The mentionSuggestion util fetches data from the server and serves it to MentionList for the user to select, then inserts it into the Editor as a token.
25 lines
621 B
TypeScript
25 lines
621 B
TypeScript
import { mergeAttributes, Node } from '@tiptap/core'
|
|
import Mention from '@tiptap/extension-mention'
|
|
|
|
export default Mention.extend({
|
|
renderHTML({ node, HTMLAttributes }) {
|
|
return [
|
|
'a',
|
|
mergeAttributes(
|
|
{
|
|
href: `https://gbf.wiki/${node.attrs.id.name.en}`,
|
|
target: '_blank',
|
|
},
|
|
{ 'data-type': this.name },
|
|
{ 'data-element': node.attrs.id.element.slug },
|
|
{ tabindex: -1 },
|
|
this.options.HTMLAttributes,
|
|
HTMLAttributes
|
|
),
|
|
this.options.renderLabel({
|
|
options: this.options,
|
|
node,
|
|
}),
|
|
]
|
|
},
|
|
})
|