From 558daf1f7be99fb5ecdf958308bba66214c32e6a Mon Sep 17 00:00:00 2001
From: Cee Chen <549407+cee-chen@users.noreply.github.com>
Date: Tue, 9 Jan 2024 08:44:09 -0800
Subject: [PATCH] [EuiFlyout] Add resizable flyout docs section copy (#7451)

---
 website/docs/02_components/layout/flyout/overview.mdx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/website/docs/02_components/layout/flyout/overview.mdx b/website/docs/02_components/layout/flyout/overview.mdx
index 507788ba601d..f3c3f014757d 100644
--- a/website/docs/02_components/layout/flyout/overview.mdx
+++ b/website/docs/02_components/layout/flyout/overview.mdx
@@ -79,3 +79,9 @@ To stop this growth at an ideal width, set `maxWidth` to `true`, or pass your ow
 Note that there are some caveats to providing a maxWidth that is smaller than the minWidth.
 
 :::
+
+## Resizable flyouts
+
+You can use **EuiFlyoutResizable** to render a flyout that users can drag with their mouse or use arrow keys to resize. This may be useful for scenarios where the space the user needs can be unpredictable, if content is dynamic. Resizable flyouts allow users to adjust content to better fit their individual screens and workflows.
+
+We strongly recommend setting reasonable numerical `minWidth` and `maxWidth` props based on the flyout content and page content that you _can_ predict.