samurai
samurai

Reputation: 49

Extending the link plugin in Tiptap editor and it works. but the issue comes when i tried to prevent openOnClick from occuring

I tried extending the link plugin in Tiptap editor and it works. but the issue comes when i tried to prevent openOnClick from happening. It used to work before i tried the below and now it doesn't. What can i do?

import Link from "@tiptap/extension-link";

export const CustomLink = Link.extend({
  addCommands() {
    return {
      ...this.parent?.(),
      addLink: function (options) {
        return ({ tr, commands }) => {
          commands.insertContent(
            `<a href='${options.href}' class="custom-link">${options.href}</a>`,
            {
              parseOptions: {
                preserveWhitespace: false,
              },
            }
          );
        };
      },
    };
  },
});

Tiptap.tsx:

const editor = useEditor({
    editable: false,
    extensions: [
            Link.configure({
        openOnClick: false,
        HTMLAttributes: {
          class: "custom-link",
        },
      }),
    ]
});

I tried to import the clickHandler in the extended but its not accepting it.

Upvotes: 1

Views: 1200

Answers (0)

Related Questions