[6.x] Add a way to opt out of popper z-index control - #15227
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Description of the Problem
When a modal, stack, live preview, or fullscreen code editor is open, we pull the Reka popper
z-indexup so things like Comboboxes and DatePickers inside those overlays still appear on top.We need to do this because Reka sets
z-index: auto;and we can't programmatically override it. So instead we use CSS's:hasto test if the DOM has certain things. Not ideal, but there we go.That blanket rule also elevates poppers that were already open behind an unrelated overlay. For example, a compact array popover can stay open when its “Delete Row” confirmation modal appears — and because both portal to the body, we can't query the DOM structure to understand if the popper belongs to the modal. The popover ends up stacking above the confirmation.
What this PR Does
Adds an opt-out for that z-index rule:
excludeManipulationZdata-ui-exclude-manipulation-zbase.css,stacks.css, and SetPicker skip wrappers that contain that attributeConsumers that can remain open behind an unrelated overlay can opt out; poppers that belong inside the overlay keep the default elevate behavior.
How to Reproduce
cp/sites→ Custom Attributes → delete a filled row).excludeManipulationZ, the popper sits above the confirmation modal.excludeManipulationZon that Popover/Combobox, the confirmation modal stacks above the popper as expected.