Problem Statement

EuiModal currently does not support closing it on click on the EuiOverlayMask as described in our docs.

This was historically based on the assumption that modals should be used for blocking actions that require user input (guidelines). The current usages of EuiModal indicate that this usage has evolved and that modals are used beyond this initial purpose.

After alignments with design, we agreed that there is benefit in updating EuiModal to support closing it on outside click, same as other dialog component (e.g. EuiPopover or EuiFlyout).

Proposed Solution

Support closing the modal via onClickOutside on it's EuiFocusTrap. This should be optional.

Update the existing docs and guidelines.

Use Case

We currently don't have knowledge of existing use cases, but there has been a request via Slack recently that required a custom implementation as workaround.

Value / Impact

• Prevents consumers from having to implement custom solutions
• Removes the need to show a close button

Urgency

It's required as a part of Share plugin enhancements: elastic/kibana#229611

Do alternatives or workarounds exist?

• No real workaround, only building a custom modal with the same components that compose EuiModal