Make ticket mention extension override link parsing
This commit is contained in:
parent
6702811f4a
commit
2a9170f7dd
1 changed files with 23 additions and 9 deletions
|
|
@ -14,6 +14,7 @@ import type { Editor } from "@tiptap/react"
|
||||||
import StarterKit from "@tiptap/starter-kit"
|
import StarterKit from "@tiptap/starter-kit"
|
||||||
import Placeholder from "@tiptap/extension-placeholder"
|
import Placeholder from "@tiptap/extension-placeholder"
|
||||||
import Mention from "@tiptap/extension-mention"
|
import Mention from "@tiptap/extension-mention"
|
||||||
|
import TiptapLink from "@tiptap/extension-link"
|
||||||
import { ReactRenderer } from "@tiptap/react"
|
import { ReactRenderer } from "@tiptap/react"
|
||||||
import tippy, { type Instance, type Props as TippyProps } from "tippy.js"
|
import tippy, { type Instance, type Props as TippyProps } from "tippy.js"
|
||||||
// Nota: o CSS do Tippy não é obrigatório, mas melhora muito a renderização
|
// Nota: o CSS do Tippy não é obrigatório, mas melhora muito a renderização
|
||||||
|
|
@ -455,8 +456,16 @@ const TicketMentionListComponent = (props: TicketMentionSuggestionProps) => (
|
||||||
<TicketMentionList {...props} />
|
<TicketMentionList {...props} />
|
||||||
)
|
)
|
||||||
|
|
||||||
|
const SafeLinkExtension = TiptapLink.extend({
|
||||||
|
priority: 90,
|
||||||
|
parseHTML() {
|
||||||
|
return [{ tag: 'a[href]:not([data-ticket-mention="true"])' }]
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
const TicketMentionExtension = Mention.extend({
|
const TicketMentionExtension = Mention.extend({
|
||||||
name: "ticketMention",
|
name: "ticketMention",
|
||||||
|
priority: 1000,
|
||||||
group: "inline",
|
group: "inline",
|
||||||
inline: true,
|
inline: true,
|
||||||
draggable: false,
|
draggable: false,
|
||||||
|
|
@ -515,6 +524,7 @@ const TicketMentionExtension = Mention.extend({
|
||||||
return [
|
return [
|
||||||
{
|
{
|
||||||
tag: `a[data-ticket-mention="true"]`,
|
tag: `a[data-ticket-mention="true"]`,
|
||||||
|
priority: 1000,
|
||||||
getAttrs: (dom: HTMLElement | string) => {
|
getAttrs: (dom: HTMLElement | string) => {
|
||||||
if (dom instanceof HTMLElement) {
|
if (dom instanceof HTMLElement) {
|
||||||
return {
|
return {
|
||||||
|
|
@ -531,6 +541,7 @@ const TicketMentionExtension = Mention.extend({
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
tag: "a.ticket-mention",
|
tag: "a.ticket-mention",
|
||||||
|
priority: 1000,
|
||||||
getAttrs: (dom: HTMLElement | string) => {
|
getAttrs: (dom: HTMLElement | string) => {
|
||||||
if (dom instanceof HTMLElement) {
|
if (dom instanceof HTMLElement) {
|
||||||
const href = dom.getAttribute("href") ?? null
|
const href = dom.getAttribute("href") ?? null
|
||||||
|
|
@ -765,21 +776,24 @@ export function RichTextEditor({
|
||||||
}, [ticketMention?.enabled, value])
|
}, [ticketMention?.enabled, value])
|
||||||
|
|
||||||
const extensions = useMemo(() => {
|
const extensions = useMemo(() => {
|
||||||
const baseExtensions = [
|
const mentionExtensions = ticketMention?.enabled ? [TicketMentionExtension] : []
|
||||||
|
|
||||||
|
const coreExtensions = [
|
||||||
StarterKit.configure({
|
StarterKit.configure({
|
||||||
bulletList: { keepMarks: true },
|
bulletList: { keepMarks: true },
|
||||||
orderedList: { keepMarks: true },
|
orderedList: { keepMarks: true },
|
||||||
// Configure built-in link from StarterKit to avoid duplicate extension
|
link: false,
|
||||||
link: {
|
}),
|
||||||
|
SafeLinkExtension.configure({
|
||||||
openOnClick: true,
|
openOnClick: true,
|
||||||
autolink: true,
|
autolink: true,
|
||||||
protocols: ["http", "https", "mailto"],
|
protocols: ["http", "https", "mailto"],
|
||||||
HTMLAttributes: { rel: "noopener noreferrer", target: "_blank" },
|
HTMLAttributes: { rel: "noopener noreferrer", target: "_blank" },
|
||||||
},
|
|
||||||
}),
|
}),
|
||||||
Placeholder.configure({ placeholder }),
|
Placeholder.configure({ placeholder }),
|
||||||
]
|
]
|
||||||
return ticketMention?.enabled ? [...baseExtensions, TicketMentionExtension] : baseExtensions
|
|
||||||
|
return [...mentionExtensions, ...coreExtensions]
|
||||||
}, [placeholder, ticketMention?.enabled])
|
}, [placeholder, ticketMention?.enabled])
|
||||||
|
|
||||||
const editor = useEditor({
|
const editor = useEditor({
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue