[Flyout System] Add the flyout overlay mask back #9077
Draft
+78
−31
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
Resolves #8989
This PR reintroduces the previously removed overlay mask to the flyout component. The
EuiOverlayMask
was temporarily removed to simplify the development of other features and to be able to fix its buggy behavior separately.The flyout elements are now rendered outside the overlay mask, which allows managed flyouts to render without unexpected flashes when updating the
ownFocus
prop or rerendering for other business logic reasons.Note that this PR is marked as draft as the change to
z-index
values needs to be tested against Kibana. Other than a slight change to that value this PR should not change much.Why are we making this change?
It's part of the Flyout System M1 work. See the issue this resolves and the epic for more details.
Screenshots #
Impact to users
The change may affect
z-index
positioning of custom consumer-created elements if using values that aren't in line with what EUI expects.The old logic included a behavior I was unaware of that used
z-index: 6000
for flyouts when they were rendered with the overlay mask. The usualz-index
value for flyouts is1000
. We're testing if changing theflyout
z-index
/level would have any negative impact on Kibana as this value would make way more sense semantically.QA
Remove or strikethrough items that do not apply to your PR.
General checklist