Is there a way to use react components as nodes ?

[iongion]

There is this canvas ability to render html and then use that in SVG using foreign object interface.

https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas

I have something like this in my code, using svg.js:

        const nodeElement = document.createElement('div');
        // nodeElement servers as outlet
        foreignObject.appendChild(nodeElement);
        const props = { ...node, id: key };
        const element = React.createElement(NodeElement, props);
        ReactDOM.render(element, nodeElement, () => {
          foreignObject.draggy((x, y) => {
            const res = {
              x: Math.max(x, 0),
              y: Math.max(y, 0),
            };
            return res;
          });
          const item = { node, element, foreignObject };
          done(null, item);
        });

This helps me render the objects, that sick enough can be redux aware and data aware, which is awesome!

Do you think you could add this type of functionality ? To recognize react components as nodes ? Would be ok even if you need to enforce an interface. This is just a question, what do you think ?