Problem Statement

By their nature of showing side-by-side flyouts, parent+child (aka grouped) flyouts tend to be content rich and demand varying degrees of viewport real estate. To provide users more control over the display, add a resizing capability similar to what exists with EuiFlyoutResizable (docs)

Proposed Solution

• Allow users to resize the grouped flyout within the max / min values.
• Put another way, support the use of EuiFlyoutChild within EuiFlyoutResizable (?)

Use Case

• Security user is viewing an alert flyout alongside an Analyzer graph and desire to make the grouped flyout larger (to view more of the graph) or smaller (to view underlying page content)

Value / Impact

• This is already provided by Security's custom flyout workflow. They have shared that their users find this functionality valuable, so the new flyout system would need to support it in order for internal adoption / feature parity.

Urgency

• High but not critical (?)
• Likely a blocker for adoption of the new flyout system by Security; at least a requirement for the mid-term solution.

Do alternatives or workarounds exist?

• Part of the custom Security flyout though the new flyout system aims to replace this

Related code or customizations

• See the implementation in the Alerts page of the Security solution, for one example
• Note: they are currently using a single 'two column' flyout and not the new grouped flyout which is still under development; given this, the code may not be very relevant, but this does demonstrate the desired behavior.

Additional context (Optional)

• Verify whether or not we need to store the resized width. I presume we do want to at least store this in localStorage.

Designs or Specs (Optional)

• Recording of custom Security flyout below