Skip to content

[Flyout System] Resizable Flyout Issues #9683

Description

@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
Image

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)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    Fields

    No fields configured for Bug.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions