[Flyout System] Resizable Flyout Issues

[tsullivan]

Reported by @kelvtanv @PhilippeOberti

Describe the bug

Resizable flyouts come with side effects where the parent/child presentation of flyouts goes to "stacked" mode unexpectedly when the flyout's container size changes.

Impact and severity

Workarounds are not user friendly. The stacked mode only shows the child flyout and doesn't show the user that there is a main (aka parent) flyout below that. The user would have to close their child flyout in order to see the main flyout, or just work on a larger viewport.

Environment and versions

Minimum reproducible sandbox

1. Use a desktop browser with a viewport width of 1920 pixels
2. Render a resizable "main" flyout, use either m or s size
3. Render child flyout, any size, doesn't have to be resizable

To Reproduce

1. Resize the main flyout to a large size
2. Open the child flyout
3. Issue: the flyout system uses "stacked" mode, which is designed for smaller screens

Expected behavior

Expectation: flyouts that have been manually resized should be "unresized" when:

1. a new child flyout appears
2. the viewport / container size changes

"Unresized" means the flyout size should be reverted to the s or m size in the code.

Screenshots (Optional)

See video above

Additional context (Optional)

[tsullivan]

Expected behavior
Expectation: flyouts that have been manually resized should be "unresized" when:
the viewport / container size changes

This is the specific piece that matters for Kibana: when a Kibana sidebar appears in the viewport, any resized flyouts should be unresized. Otherwise, a main-child flyout pair will jump to stacked mode when the sidebar appears. This is the specific bug that was reported