[FR] Outline view

[leevigraham]

Description

Still fleshing this idea out but some kind of outline view could be very cool.

Webflow has a content navigator:

Combine this with a double click -> slide out editor for each block this could be a powerful editing experience.

[leevigraham]

@ttempleton I was going to have a crack as this as a plugin first.

I see there are some events on the field for addBlock and removeBlock but nothing like blocksChanged or some kind of event that covers other updates like dragging.

I was thinking if there was some kind of catch all change event then I could parse the tree and create the outline.

Then I started thinking about the idea of keeping an internal tree structure inside the input.js. Is there anything like that… I can see there's a blocks property.

[ttempleton]

The _blocks property is just an array of all the blocks in the field. I've made some changes today, for the next release, that would allow you to call an input's getBlocks(1) to get all top level blocks, then call the blocks' getChildren(), etc. to traverse the block structure, if that helps. Otherwise, happy to add anything you need.

[ttempleton]

Also just added an updateBlockOrder event, and will have a look at a general 'any change to the field' event later today.