PLANET-7539: Add button to convert the ToC block into a List block

[mardelnet]

Ref: https://jira.greenpeace.org/browse/PLANET-7539

---

DESCRIPTION:
This PR adds a "Convert to static list" button to the Table of Content block (formerly the Submenu block).
Editors can click on it to convert the Table of Content block into a native List block and edit the block content.
This is the first step in investigating how to add WYSIWYG features to the Table of Content block.

Additionally, some JSDocs were added to make our future selves' work lighter.

[planet-4]

Test instance is ready 🚀

🌑 venus | admin | blocks report | CircleCI | composer-local.json

⌚ 2024.10.07 10:29:08

[mleray]

Hey @mardelnet, are we meant to completely lose the CSS styles when converting to a static list? I see that currently clicking on that option makes the block look like this both in backend and frontend, but I think this block shouldn't be using our typical link styles.

[mardelnet]

Hey @mardelnet, are we meant to completely lose the CSS styles when converting to a static list? I see that currently clicking on that option makes the block look like this both in backend and frontend, but I think this block shouldn't be using our typical link styles.

Thanks, @mleray
Maybe @comzeradd can help us answer that question.
I don't know how far should we go with this PR since it's more like an investigation.

[comzeradd]

are we meant to completely lose the CSS styles when converting to a static list?

Ideally we should preserve our block styling. I see that after the conversion it's just a list with a .wp-block-list class. Maybe there is a way to add an extra css class on conversion to overwrite styles?

For the scope of this PR/ticket, we would just need to check that it's feasible. Then we can check with the design team if they are fine with the "Convert to static" workflow.

[mardelnet]

For the scope of this PR/ticket, we would just need to check that it's feasible. Then we can check with the design team if they are fine with the "Convert to static" workflow.

@mleray @comzeradd
It is feasible to keep the styles and you can check it with the last changes introduced to this PR (check the attached image, too).
The only visual element not yet migrated is the multiple-column arrangement.
This is not going to be very easy to mimic, since the native List block is not ready for using more than one column.
Please, let me know if you want me to keep working on introducing the multi-columns feature, or not, if that's out of this PR scope.

[mleray]

@mardelnet I personally think it looks good enough like this, except maybe the fact that it's full width!

[comzeradd]

This is not going to be very easy to mimic, since the native List block is not ready for using more than one column.
Please, let me know if you want me to keep working on introducing the multi-columns feature, or not, if that's out of this PR scope.

Maybe there is a way to have a flex wrapper for that list to be able to use something like column-count. But let's put this on hold till we consult with the design team to see if the overall solution is what we want to do.

[mardelnet]

Closing this PR since the secondary navigation will be a different block.