Focus mode: Allow on any container block from the ellipsis menu

[jasmussen]

At the moment, you can edit a template part in isolation (aka focus mode) by clicking the edit button on the block toolbar:

This is a valuable feature, worth bringing to more blocks. Can we add it to every container block, by adding an "Edit" menu item in the ellipsis menu? Like so:

[jameskoster]

Seems like a good idea to me.

I wonder if there's a way we can communicate the nature of the focussed edit experience before clicking the button? Otherwise it may be a bit strange to see an 'edit' action for something you are already editing. A different label, or description could be enough.

A couple of ideas:

Focussed edit

Edit [block name]

Edit
Zoom in and edit just this block

[jasmussen]

I like to reduce text whenever possible, I find that more text is rarely that helpful when glancing. I wonder if a better icon could work?

[jameskoster]

It's definitely a minor point, and may not even be an issue. A different icon might work, but I don't have any bright ideas just yet. We can probably evaluate this detail during implementation.

[talldan]

I think this is a good idea, but I have some questions.

At the moment when you launch focus mode, it launches the site editor but using the wp_template_part post type as the entitiy instead of a wp_template. It's not really that different to using the post editor to edit a reusable blocks. We call it 'focus' mode, but technically it's opening a different document in the site editor.

If it were to work on blocks that don't have entities (columns, group etc.), I imagine it would work completely differently. Maybe something closer to the spotlight mode option. The surrounding document would still be present in the background (and things like background colors could still be visible), but the blocks surrounding the one being focused would be hidden and not editable.

It becomes complicated when you consider that you can also edit a template part in isolation from the list screen:

But maybe that continues to work as it does today, while focusing a template part from within a template works differently?

[jasmussen]

If it were to work on blocks that don't have entities (columns, group etc.), I imagine it would work completely differently. Maybe something closer to the spotlight mode option. The surrounding document would still be present in the background (and things like background colors could still be visible), but the blocks surrounding the one being focused would be hidden and not editable.

Just to make sure I'm understanding right, are you suggesting this should work differently to intentionally preserve the surrounding context, or is there a technical limitation due to how focus mode works at the moment?

If it's the former, I like to think that the main benefit of focus mode is exactly that you can work on a piece of the page in isolation, with a wider canvas and separate resize/responsive preview controls. That also well balances the presence of the invokation method in the ellipsis menu. Spotlight mode can still exist as a separate option, to be sure. What do you think?

But maybe that continues to work as it does today, while focusing a template part from within a template works differently?

Again I want to be careful to understand right, is there a technical limitation?

Some of the initial inspiration for focus mode was from Illustrator, which I think is called "edit in isolation", invoked by double click and can take you as deep into the hierarchy as you can, to the point that you get breadcrumbs:

[talldan]

I wouldn't say there are limitations, I'm trying to get an idea of the scope of the dev work and also share my understanding of the scope. In terms of the way focus mode works right now, it isn't something that can be switched on for any block, so what's being proposed here is more like a completely new block editor feature (focusing any block).

Definitely no overlap with spotlight mode either, but there are some conceptual similarities between the two things, which is why I mentioned it.

Again I want to be careful to understand right, is there a technical limitation?

More of a question. Could opening a template part from the listing page work differently to focusing a template part while editing a template? For the former you can really only edit the inner blocks of the template part (as that's all that exists in the entity), for the latter there are more possibilities, it'd also be possible to edit the template part block as well.

To put this in the perspective of other blocks, if it were possible to focus a group block you may not want to only edit the inner blocks, but also have access to the main group block settings too. It'd be good to hear your thoughts from a design perspective on that.

Other things I mentioned, like the background colors being visible don't necessarily have to work that way, but they would be possibilities (there could be an option to toggle between showing the real background color, and a plain white background).

[jasmussen]

More of a question. Could opening a template part from the listing page work differently to focusing a template part while editing a template? For the former you can really only edit the inner blocks of the template part (as that's all that exists in the entity), for the latter there are more possibilities, it'd also be possible to edit the template part block as well.

To put this in the perspective of other blocks, if it were possible to focus a group block you may not want to only edit the inner blocks, but also have access to the main group block settings too. It'd be good to hear your thoughts from a design perspective on that.

Yes, excellent point. My instinct would be that it's fine to not be able to edit the group itself and only what's inside, if nothing else then just to keep the scope smaller. But it might also be nice if when you are editing a group in isolation, and have nothing selected, then effectively you are seeing the block inspector for the group, kind of like you'd see the inspector for the document when no block is selected.

@jameskoster I'd love your input here as well, I feel like your grasp of some of these mechanics is deep.

[jameskoster]

My feeling (which may very well be wrong) is that the experience editing a template part in isolation and editing a group in isolation should feel the same from the user perspective. Whether that means using the same 'stuff' under the hood or not is most likely a question of ease-of-execution / maintenance. Obviously I defer to @talldan on that!

My instinct would be that it's fine to not be able to edit the group itself and only what's inside

This would prohibit you from switching between row/stack orientations, adding a background, or adjusting padding, which might be a shame? Conceptually it might make sense for the first Inspector tab to be the block type, and contain the associated options:

Obviously something to do later/separately, but it might be nice to use the logic from #44581 to surface patterns based on the 'content' blocks in the container.