Multiple holes workaround / nested nodes

1

Hello. I want to implement nodes containing multiple holes for editable content. Simple example:

toDOM() { return [ "div", [ "div", 0 ], [ "hr" ], [ "div", 0 ] ] }

Because this is not possible, I am looking for alternative ways to implement it. My idea is that I can replace elements with holes ( [“div”, 0]) with another “hole wrapper” node, but I do not know how to do that. Is there a way to add a node to a nodeSpec.toDOM method? Or another way to represent the node in nodeSpec and the adding inner nodes when creating a node instance?

Thank you for your help.

2

You can give the outer node a fixed content sequence (say "title caption") and then define title and caption nodes with the appropriate content for the “holes”.

1 Like
3

While I don’t think this would work for my case, it helped me find an idea. What I am currently testing is something like this:

Schema has blockhtml node with “html” attribute and toDOM(node) { return [ “div”, node.attrs.html ] } and a blockslot node with toDOM() { return [“div”, 0] }. Outer node has content: (blockhtml | blockslot)+.

Inside the insert command for the outer node, I create an array of blockhtml and blockslot nodes (which can contain other blockhtml or blockslots nodes), and use them as content fragment when creating the outer node.

So I can create a large node with multiple slots and uneditable content. There are still a lot of quirks to figure out, but it kinda works, which is a step forward.

Thank for your help, as always.