Block conversion update: ability to convert objects with advanced configuration

[VolgaIgor]

Hello! Right now block conversions are performed using a string only, which does not allow for complex conversions. For example, it will not be possible to convert text blocks separately and image blocks separately, like this:

Right now it is not possible to send a complex configuration from an image block to a gallery block (file data + caption) via string. In addition, there is no conversion filtering now, so if a block exports something, it will be listed for import in all blocks, even if it is not suitable for conversion.

I made a few changes to make it all possible:

• The conversion menu is not displayed for blocks that do not have the "export" option (which do not export anything): https://github.com/codex-team/editor.js/pull/2799
• A block can now return for export not only a string, but also a data object
• The conversion result is now computed when the conversion menu is opened. so if a block returns an empty object or undefined when importing from another block, it will not be suggested for conversion
• Backwards compatibility with past mechanics has been preserved as much as possible

[neSpecc]

Thanks for the PR. Could you show the example of the conversion configs in Image Tool and Gallery tools?

[VolgaIgor]

Thanks for the PR. Could you show the example of the conversion configs in Image Tool and Gallery tools?

For example, the SimpleImage export I did it this way:

export: function (blockData) {
  return {
    'url': blockData.url,
    'caption': blockData.caption
  }
}

And for ImageTool this way:

export: function (blockData) {
  return {
    'file': blockData.file,
    'caption': blockData.caption
  }
}

And for Gallery I made a universal way to handle both variants, otherwise returning undefined:

import: function (exportData) {
  if (typeof exportData !== 'object') return;

  let blockData = {};
  if (exportData.url) {
    blockData.files = [{ url: exportData.url }];
  } else if (exportData.file) {
    blockData.files = [exportData.file];
  } else {
    return;
  }

  if (exportData.caption) {
    blockData.caption = exportData.caption;
  }
  return blockData;
}

[neSpecc]

The problem now is that Gallery tool in your example knows about other tools: SimpleImage and ImageTool. It is a bad practice for our design. That is why we designed conversion through the string data.

As a solution, we can improve ImageTool by supporting multiple images in a gallery-view.

[VolgaIgor]

I interpret this not as the block knows about these tools, but that this block is ready to accept data in a certain format. And Image blocks give their data in a more structured format.

So it doesn't mean that Gallery only works with these Image blocks, and that Image blocks will only work with Gallery. They will only be able to have more extended interfaces for sharing structured data.

[VolgaIgor]

Or maybe do something similar to Clipboard, allowing export to text/plain and text/html. HTML5 is advanced enough that it can be used to explicitly deliver various data structures, including lists, image galleries, etc. @neSpecc

[neSpecc]

Or maybe do something similar to Clipboard, allowing export to text/plain and text/html. HTML5 is advanced enough that it can be used to explicitly deliver various data structures, including lists, image galleries, etc. @neSpecc

I don't see any options at the moment. Transferring data should be abstracted away from any tool's data format. Maybe markdown would work better that just simple strings. We'll think about it when we'll design a markdown support (in Tools API first of all)