Add support for variation styling

[g-elwell]

What problem does this address?

It's possible within theme.json to add styling specific to block variations, users should be able to do this via the UI as well. See: https://developer.wordpress.org/news/2023/05/26/customizing-core-block-style-variations-via-theme-json/

Note, this currently only applies to core block variations. There is an open issue for extending this to custom variations.

With this limitation in place, the functionality may be limited. I'm also interested in what might be the most common use-case for this, styling outline button states.

Since the variation styles would be applied at the block level, not element level, it may not be possible to use the variation capability to style outline button hover/active states.

What is your proposed solution?

Extend the UI to include variations as a nested option within blocks. So rather than expanding a block and seeing elements listed individually, you would see elements and variations, which can each be expanded to show the available options within them. Eg:

Button
-- Elements
---- Link
---- H1
-- Style Variations
---- Outline

It looks as though the theme.json schema supports both elements and blocks nested within variations. Elements makes sense but I am wondering whether blocks being there is an error, as you can't style nested blocks in other contexts.