Add multi select inspector

[ellatrix]

This is very much a WIP, but the idea is to add an inspector for multi-select as well. This could be useful for aligning multiple blocks at once, converting multiple paragraphs to a block quote or verse form...

Still needs some thinking around how the API would look like.

[aduth]

Note with #2172, these need to be updated to prefix the dependencies with @wordpress/. You will need to perform a rebase against the latest version of master and apply your changes:

git fetch origin
git rebase origin/master

[ellatrix]

Rebased this one. @jasmussen So I guess instead of adding stuff to the sidebar, I'll try to keep the toolbar inline and offer the same block switcher and alignment options for multiple paragraphs.

[codecov]

Codecov Report

Merging #1811 into master will decrease coverage by 0.19%.
The diff coverage is 1.72%.

@@            Coverage Diff            @@
##           master    #1811     +/-   ##
=========================================
- Coverage   34.07%   33.88%   -0.2%     
=========================================
  Files         192      193      +1     
  Lines        5675     5711     +36     
  Branches      996     1006     +10     
=========================================
+ Hits         1934     1935      +1     
- Misses       3165     3190     +25     
- Partials      576      586     +10

Impacted Files	Coverage Δ
editor/modes/visual-editor/block.js	0% <ø> (ø)	⬆️
editor/header/index.js	0% <0%> (ø)	⬆️
blocks/library/paragraph/index.js	28.57% <0%> (-4.77%)	⬇️
editor/sidebar/index.js	0% <0%> (ø)	⬆️
editor/sidebar/header.js	0% <0%> (ø)	⬆️
editor/block-toolbar/index.js	0% <0%> (ø)	⬆️
editor/block-switcher/index.js	0% <0%> (ø)	⬆️
editor/block-settings-menu/index.js	0% <0%> (ø)	⬆️
editor/sidebar/multi-block-inspector/index.js	0% <0%> (ø)
editor/selectors.js	93.16% <14.28%> (-3.59%)	⬇️
... and 2 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 1400611...0769a4f. Read the comment docs.

[ellatrix]

I also think we should remove the blue box on top entirely then. We can offer everything inline and more advanced things on the side. Would also be very nice on mobile with a "select" button to select multiple blocks.

[jasmussen]

Love the idea behind this 🌟 🌟 🌟 🌟 🌟

Also agree with this:

I also think we should remove the blue box on top entirely then. We can offer everything inline and more advanced things on the side. Would also be very nice on mobile with a "select" button to select multiple blocks.

I encountered a little flickering, though. Seemed to happen more often when the document tab was active. Tried to record a video:

[ellatrix]

Strange, this should not affect the multi selection itself. Anyway, there's still some how left here. I'll move it inline. :)

[ellatrix]

Redoing this whole thing so it's inline... WIP. Still need to add the formatting toolbar and allow the inspector to be the same for multi select.

[ellatrix]

@mtias @aduth @youknowriad This is going to become quite messy if we keep the current API that is a single edit method returning an array and filling in slots. I would need to force the focus props to true for the first selected block and reset setAttributes etc. to allow updating all blocks from this one edit method.

I see two solutions:

• We have separate methods, e.g. save(), edit(), blockControls() and inspectorControls(), or something like that.
• We have a separate method for multi-select outside the edit() method. This is an inferior solution though, as we're splitting it up only partially, and the block implementor needs to duplicate all inspector controls to this method if they are the same.

[ellatrix]

Okay, I'm going to split this up into two or three PR so we can move forward in the meantime with other improvements.

[gziolo]

@iseulde, can you confirm that this one is still relevant?

[ellatrix]

Yes! I'll redo it a bit.

[ZebulanStanphill]

Should this be closed since #3535 exists?

[gziolo]

I'm closing it in favor of #7635 which is more up to date. Let's iterate there.

[gziolo]

Actually, it's different than #7635. However, there is #3535 which is very similar and more up to date. In addition, we can easily reuse patterns which will come out of #7635 to apply to inspector controls, too as noted by @iseulde in this comment #7635 (comment) :)