Duotone/Filters: Presets only in block toolbar, advanced filtering in inspector

[jasmussen]

This ticket extracts and builds upon initial work in #38556 (comment).

There are some issues with the Duotone filter dropdown, mainly that it covers content. For simplicity, we could change the block toolbar to only show duotone/filter presets, giving trivial access without covering the image:

Note a suggested new Filter icon for the toolbar.

We would still need (as tracked in #38556) an explicit button to toggle off a filter, for example when a theme has set a duotone filter by default:

When a theme sets a default duotone, how should the "Clear" button work? With an explicit "no filter" button, and the theme's intent of showing images duotoned by default, arguably it should reset the image to theme defaults. But we should make that clearer. In this case, the image was explicitly set to "no filter", and clearing reverts to the red/blue theme default:

Shown also, the ability to select the filter palette from the dropdown.

How would you customize a duotone filter? To be able to customize duotone presets in Global Styles, there needs to be an inspector interface regardless (#34574), and in that vein, it makes sense to use the same interface here:

A flyout is used when in the Post Editor context, as the block inspector doesn't use a drilldown, but the contents of the flyout is the same as the panel in Global Styles:

At some point in the future, we'd want to consider new filters, and even let you combine multiple, such as duotone plus dithering. Inspired by #39427 from @javierarce, this uses a similar ItemGroup based layer interface:

See also:

• Image: Improve the inspector, adopt the unified dimensions panel #38068
• Make it easier to quickly turn duotone on/off #38556
• Duotone: Duotone filter button should always be at the end #31373
• Image Tools: Add dedicated toolbar section #38988

[ajlende]

Since there are some accessibility issues with completely replacing the toolbar, maybe we could do something like this for the time being when the detailed controls move to the sidebar.

The goal of replacing the toolbar was to not obscure the image so you could see the filter being applied fully. Removing the custom filter makes the dropdown a little smaller to help a little bit. And updating the copy for the clear button, I think, is also a small improvement.

[jasmussen]

We can probably skip the inline buttons in the toolbar for now, yes. They seem valuable to me still, but if it's onerous to implement the value proposition may not be that clear.

I still think it's valuable to surface them in the inspector 👍 👍