Skip to content

fix(dismissable): Preserve target z-index when updating layer stack - #3208

Open
Hwacc wants to merge 3 commits into
chakra-ui:mainfrom
Hwacc:fix/dialog-layer-stack
Open

fix(dismissable): Preserve target z-index when updating layer stack#3208
Hwacc wants to merge 3 commits into
chakra-ui:mainfrom
Hwacc:fix/dialog-layer-stack

Conversation

@Hwacc

@Hwacc Hwacc commented Jul 10, 2026

Copy link
Copy Markdown
Contributor

This PR is aimed to address #3207

💣 Is this a breaking change (Yes/No): No

@changeset-bot

changeset-bot Bot commented Jul 10, 2026

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: e5bf8a2

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel

vercel Bot commented Jul 10, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
zag-nextjs Ready Ready Preview Jul 15, 2026 5:45am
zag-solid Ready Ready Preview Jul 15, 2026 5:45am
zag-svelte Ready Ready Preview Jul 15, 2026 5:45am
zag-vue Ready Ready Preview Jul 15, 2026 5:45am
zag-website Ready Ready Preview Jul 15, 2026 5:45am

Request Review

Store each style target's prior z-index before freezing it, then
restore that exact value on cleanup instead of always removing the
inline property. This prevents clobbering consumer-defined z-index
styles.
@kalisaNkevin

Copy link
Copy Markdown
Member

Traced through why this happens: Dialog registers its positioner as a style target, not the primary layer node (layerStyleTargets: [getBackdropEl, getPositionerEl] in dialog.machine.ts), and remove() only clears the style-mirror on style targets — the primary content node's own --layer-index is untouched. So the positioner's z-index: var(--z-index) rule goes dead the instant --z-index is stripped, collapsing to auto mid-exit-animation. That matches the reported symptom exactly.

Freezing the resolved z-index as a literal inline z-index (which wins on specificity over the now-broken var() rule) is the right fix, and the second commit's removeProperty("z-index") in syncLayers correctly handles the case where the same node re-enters the stack later — without it a stale frozen z-index would override the real one on reopen. Three commits, but they read as one coherent fix.

Two things still missing, same gap as #3177:

One sequencing note: this and #3177 both touch the same two forEach blocks in remove()/syncLayers(). No logical conflict — one freezes z-index, the other manages a MutationObserver — but whichever merges second will need a rebase.

CI-wise: same story as #3177. Checked the Actions API — there's exactly one workflow run (Quality), status action_required. Needs a maintainer to approve it before there's any real signal; the unstable mergeable state reflects that pending approval, not an actual conflict.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants