Animate query graph layout transitions - #171
Open
vogelsgesang wants to merge 2 commits into
Open
Conversation
vogelsgesang
force-pushed
the
fix-flicker
branch
4 times, most recently
from
September 4, 2026 12:53
7cc9e12 to
6065732
Compare
Compute the final layout once and interpolate node size and layout from a shared clock, avoiding intermediate relayout jumps. Animate subtree additions and removals from or toward their parent while fading nodes, edges, and labels. Delay entry animations until React Flow has measured the new nodes and preserve exit destinations across interrupted transitions. Disable pointer interaction for transient elements so they do not affect hover behavior.
vogelsgesang
force-pushed
the
fix-flicker
branch
3 times, most recently
from
September 4, 2026 14:50
b53c658 to
533a4f6
Compare
vogelsgesang
force-pushed
the
fix-flicker
branch
from
September 4, 2026 14:58
533a4f6 to
2c68f92
Compare
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
1 participant
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.
Compute the final layout once and interpolate node size and layout from a shared clock, avoiding intermediate relayout jumps.
Animate subtree additions and removals from or toward their parent while fading nodes, edges, and labels. Delay entry animations until React Flow has measured the new nodes and preserve exit destinations across interrupted transitions.
Also, disable pointer interaction for transient elements, to avoid hover animations being influenced by those transient elements.