editor.js icon indicating copy to clipboard operation
editor.js copied to clipboard

[Bug] Multi-Line paste in custom datatable

Open nicolasprou opened this issue 3 years ago • 2 comments

I create an Excel/CSV datatable to integrate in EditorJS

bug paste

but when i paste an entire column (or text containing \n or \rn, i dont have the problem for inline copy containing only \t) editorjs creates me as many blocks as I have elements to copy. Is there a way to handle the "paste" event at the editorjs level to only handle the case of my table? I tried to put a condition at the paragraph level, it no longer displays text but the blocks are created. I think I regularly have columns of +1000 rows to copy. If someone has an idea..

i think same problem #1427

nicolasprou avatar Mar 22 '22 09:03 nicolasprou

If you're running a custom-build like me then this commit might be helpful: https://github.com/christoph-kluge/editor.js/commit/5f70f88f49d883ac6ee174cf5e7fab9e4d4cb797

This adds an additional type for the pasteConfig. This will allow full-regexp support on the "whole" paste and will stop further processing of other pasteConfig's. This can used inside your custom plugin like that:

  static get pasteConfig() {
    return {
      plainPatterns: {
        yourKey: /your-lovely-mulitline-regex-to-match/i
      }
    };
  }

christoph-kluge avatar Apr 06 '22 20:04 christoph-kluge

Additionally to my previous comment:

The existing "paste" functionality takes every line from your clipboard and tries find a tool where the pasteConfig: {patterns: /single-line-regex/} matches. If it does not match, it will pass the line into the first block which matches a pattern.

This might in most of the cases but does not if you expect more complicated inputs like tables, script-tags, iframes or other fancy things.

In my case I needed to circumvent this in order to transform multi-line <script>- or <iframe>-tags of 3rd party tools to support additional configration inside the editor. I use those blocks as wrapper-blocks with additional configuration. A very common scenario is the the google-suite. Almost all services support iframe embedding AND custom configurations. In most of the cases people can copy the spreadsheet link (like a youtube video) and paste it into the editor. Additionally I'm adding new tunes to toggle some features for the embed.

To make this work I usedplainPatterns config which works almost the same but it's executed before each line of the clipboard is inspected. If there's a match it will stop further processing.

In your case you could use a smart regex to detect if one, or every line contains a \t and pass it into you tool in order to convert it.

christoph-kluge avatar Apr 07 '22 14:04 christoph-kluge

same issue

zolotykh avatar Apr 20 '23 06:04 zolotykh