Summary

Adds a new fullHeight prop to EuiFlyoutBody that applies display: flex, flex-direction: column, and height: 100% to the inner .euiFlyoutBody__overflowContent container, fixing height-dependent content (e.g. EuiSelectable height="full") rendering with zero height inside a flyout body.

Why are we making this change?

Fixes #8691.

EuiSelectable with height="full" (virtualized list) renders with a height of 0 when placed inside EuiFlyoutBody. The .euiFlyoutBody__overflowContent wrapper lacks display: flex and full height, preventing flex-based height resolution from propagating to children.

The existing workaround required consumers to manually apply custom CSS:

<EuiFlyoutBody css={css`
  .euiFlyoutBody__overflowContent { display: flex; height: 100%; }
`}>

This PR exposes a first-class fullHeight prop instead:

<EuiFlyoutBody fullHeight>
  <EuiSelectable height="full" options={options}>
    {list => list}
  </EuiSelectable>
</EuiFlyoutBody>

Screenshots

N/A — this is a layout/CSS fix. The visual result is that EuiSelectable (and other height-dependent virtualized components) now renders correctly at full height inside EuiFlyoutBody when fullHeight is set.

Impact to users

Low impact, additive change only. The new fullHeight prop defaults to false, so there is no change in behaviour for existing consumers. Users who need virtualized or height-dependent content inside EuiFlyoutBody can now opt in with fullHeight.

QA

Can be tested here -> http://localhost:6006/?path=/story/layout-euiflyout-euiflyoutbody--full-height

Remove or strikethrough items that do not apply to your PR.

General checklist

• Browser QA
  • Checked in both light and dark modes
  • Checked in both MacOS and Windows high contrast modes
  • Checked in mobile
  • Checked in Chrome, Safari, Edge, and Firefox
  • Checked for accessibility including keyboard-only and screenreader modes
• Docs site QA
  • Added documentation
  • Props have proper autodocs (using @default if default values are missing) and playground toggles
  • Checked Code Sandbox works for any docs examples
• Code quality checklist
  • Added or updated jest tests
  • Updated visual regression tests
• Release checklist
  • A changelog entry exists and is marked appropriately
  • If applicable, added the breaking change issue label (and filled out the breaking change checklist)
  • If the changes unblock an issue in a different repo, smoke tested carefully
• Designer checklist
  • If applicable, file an issue to update EUI's Figma library with any corresponding UI changes