Support nested ViewTransition enter/exit animations based on transition types behind flag#36135
Open
jackpope wants to merge 4 commits intofacebook:mainfrom
Open
Support nested ViewTransition enter/exit animations based on transition types behind flag#36135jackpope wants to merge 4 commits intofacebook:mainfrom
jackpope wants to merge 4 commits intofacebook:mainfrom
Conversation
|
Comparing: c0d218f...ed9e090 Critical size changesIncludes critical production bundles, as well as any change greater than 2%:
Significant size changesIncludes any change greater than 0.2%: Expand to show
|
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
2 participants
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.
Adds experimental support for firing
enterandexitanimations on nested<ViewTransition>components when they specify type-based (object map) transition configs.This is gated behind the
enableViewTransitionNestedfeature flag.Addresses the use case of animating individual items in a list (e.g. staggered fade-out of feed posts) when a parent ViewTransition is the one being mounted/unmounted.
Today,
exit/enteronly fire on the top-level ViewTransition that was directly mounted or unmounted. This is a good default. Cascading exit animations to every nested ViewTransition would cause unintended animations on simple list updates. But for intentional cases like staggered list exits during navigation, there's no way to opt in.This PR lets you opt in per-component by passing an object map:
When the parent ViewTransition exits, React walks into nested ViewTransitions and fires their exit/enter if a transition type matches. String-only configs (exit="fade") are ignored by the nested walk, preserving the current top-level-only behavior.
ViewTransitionStatic subtreeFlags are cleared in completeWork. To avoid a full traversal, I've added ViewTransitionStaticNested. Looking for feedback on that approach.