Description

We've had a few reports of Kibana modal headers that have stopped rendering a proper H1 title. This regression is related to the following items:

• Wrapping header in H1 if a string is returned #5494
• Emotion conversion to return a clonedElementWithCss
• The EuiConfirmModal calls for a title prop that's a React Node. This prop goes directly into the modal title header component and if it's a React Node, doesn't get the H1 wrapper.

During a Slack discussion with @cee-chen and @jen-huang we determined it would be worthwhile to automatically wrap the children prop with an H1 tag unless developers passed an escape hatch prop to render children exactly as they've written it.

WCAG guidance

• SC 1.3.1: Info and Relationships (Level A)

Tasks

• Write an escape hatch prop to add to EuiModalHeaderTitle logic for overriding the H1 wrapper for children
• Add unit tests to evaluate standard modal, confirmation modal with and without H1 wrapper
• Update the Confirm Modal documentation to provide awareness of this logic

Kibana confirmation modals with H1 not rendered

EUI Docs for Confirmation Modal