Can't add description to ToolsPanel as per readme example

[tellthemachines]

Description

When adding a description inside the ToolsPanel component, using the syntax provided in the component readme example, the layout appears broken:

ToolsPanel is defining a 2 col grid style, with ToolsPanelItems styled to span both columns, but any other element inserted in the ToolsPanel will automatically be assigned to a single column. I came across this while working on #42309, in which I'm also using a Flex component to wrap a couple of ToolsPanelItems so they stay on the same line. That works as long as Flex is the only child of ToolsPanel; once I add the paragraph the layout breaks as shown above. But it still looks broken even if the other children span both cols:

Ideally, the ToolsPanel should provide a way to render a semantic description for the controls. Could we perhaps leverage fieldset and legend here?

But the styling issue should also be looked into: do we really need it to be a grid if its contents always span both columns?

Step-by-step reproduction instructions

1. Add a paragraph directly inside a ToolsPanel component with one or more ToolsPanelItems.
2. Verify that layout appears broken.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[aaronrobertshaw]

I believe the readme issue was addressed in #42615, so closing this.

The two-column grid was desired to allow layouts such as that in the typography panel as the most common case. The ToolsPanel design is being revisited so any changes to the default layout would be wrapped up in that if needed.