How to intercept paste event??

[moby-101]

Summary

A clear and concise description of what the question is.

There are ways to intercept keyup and keydown events, but I haven't found a way to intercept paste events. when do paste. if clipboard text to follow a URL pattern then i want add link to selected text.

not use key down(ctrl + v, cmd + v) <- this is just keydown. not paste.

i try use ref.current.getRootElement().addEventListener('paste', fun) but it call after paste. any other solution?

Screenshots

If applicable, add screenshots to help explain your question.

Version

Write the version of the Editor you are currently using.

"@toast-ui/editor": "3.1.3",
"@toast-ui/react-editor": "3.1.3",

Additional context

Add any other context about the problem here.

[aaronvegh]

I can't believe I was coming here with the same question and this post is only three hours old! 🤯

[moby-101]

@aaronvegh

i found how to intercept it. useCapture set true then pasteEvent function run before editor paste event.

  const pasteEvent = (event: ClipboardEvent) => {
    const clipboardText = (event.clipboardData || window.clipboardData).getData('text');

    const selectedText = editor.getSelectedText();

    if (URL_REGEX.test(clipboardText)) {
      event.preventDefault();

      editor.exec('addLink', { linkUrl: clipboardText, linkText: selectedText });
    }
  };

ref.current.getRootElement().addEventListener('paste', pasteEvent, true /*<- this set true*/)

But it would be nice if TUI provided it.