Add classNames / extendability to GlobalStyle components for Dimensions, Border, and Background

[0verscore]

What problem does this address?

Currently, there is no clear selector or slot fill to extend the BlockStyle components for Dimensions, Border, and Background at the GlobalStyle settings level.
This makes it difficult to add additional styling or specific customizations seamlessly within the existing framework.

In contrast to the GlobalStyle components, the components used on Single BlockStyle Settings (e.g., for margin and padding under Dimensions) already have class names that distinguish them. These class names make it easier to identify and target these components for further customization, such as injecting React Portals. However, the absence of such class names on the GlobalStyle components prevents similar flexibility.

What is your proposed solution?

Introduce the following enhancements:

1. Assign unique class names to the Dimensions, Border, and Background components under GlobalStyle, similar to how the BlockEditor components implement them. See PR:
   Added missing classNames on global-styles ToolsPanels #68478

2. Provide a clear selector or mechanism to allow developers to target and extend these components consistently.
   These improvements would bring GlobalStyle components in line with the BlockEditor components in terms of extensibility and ease of customization.

Use case

I am currently implementing a responsive-control button for the Dimensions, Border, and Background components. To achieve this, I need a clear selector to extend these components and integrate a React Portal.

Here is a playground instance of how this is already working at the level of an individual block:
https://quantum-press.com/en/playground/
(You need to select a block and check its style settings)

Having a similar mechanism at the GlobalStyle level would enable the same level of extensibility and customization.

[Mamaduka]

@0verscore, have you tried using InspectorControls with group prop? It should allow you to add fills to these areas and use ToolsPanelItem to match core behavior. Here's an example of a Cover block. You can find all available inspector control groups in this file.

The class names in the editors aren't considered part of the public API and can be modified or removed. While removals aren't intentional, they can't be avoided when doing significant redesigns. This makes them unreliable for extending hacks like React Portals.

Extensibility for the Global Styles sidebar is being tracked in the following issues: #47990 and #48068.