react-native-reanimated 3.13.0-rc.2 → 3.13.0

package/android/src/reactNativeVersionPatch/RuntimeExecutor/73/com/swmansion/reanimated/NativeProxy.java

@@ -111,6 +111,12 @@ public class NativeProxy extends NativeProxyCommon {
             public void checkDuplicateSharedTag(int viewTag, int screenTag) {
                 // NOT IMPLEMENTED
             }
+
+            @Override
+            public int[] getSharedGroup(int viewTag) {
+                // NOT IMPLEMENTED
+                return new int[]{};
+            }
         };
     }
 }

package/android/src/reactNativeVersionPatch/RuntimeExecutor/latest/com/swmansion/reanimated/NativeProxy.java

@@ -138,6 +138,12 @@ public class NativeProxy extends NativeProxyCommon {
             public void checkDuplicateSharedTag(int viewTag, int screenTag) {
                 // NOT IMPLEMENTED
             }
+
+            @Override
+            public int[] getSharedGroup(int viewTag) {
+                // NOT IMPLEMENTED
+                return new int[]{};
+            }
         };
     }
 }

package/apple/LayoutReanimation/REAAnimationsManager.h

@@ -26,6 +26,7 @@ typedef void (^REACheckDuplicateSharedTagBlock)(REAUIView *view, NSNumber *_Nonn
 #endif
 typedef void (^REACancelAnimationBlock)(NSNumber *_Nonnull tag);
 typedef NSNumber *_Nullable (^REAFindPrecedingViewTagForTransitionBlock)(NSNumber *_Nonnull tag);
+typedef NSArray<NSNumber *> *_Nullable (^REAGetSharedGroupBlock)(NSNumber *_Nonnull tag);
 typedef int (^REATreeVisitor)(id<RCTComponent>);
 BOOL REANodeFind(id<RCTComponent> view, int (^block)(id<RCTComponent>));
 
@@ -45,6 +46,7 @@ BOOL REANodeFind(id<RCTComponent> view, int (^block)(id<RCTComponent>));
                       isSharedTransition:(BOOL)isSharedTransition;
 - (void)setFindPrecedingViewTagForTransitionBlock:
     (REAFindPrecedingViewTagForTransitionBlock)findPrecedingViewTagForTransition;
+- (void)setGetSharedGroupBlock:(REAGetSharedGroupBlock)getSharedGroupBlock;
 - (void)setCancelAnimationBlock:(REACancelAnimationBlock)animationCancellingBlock;
 - (void)endLayoutAnimationForTag:(NSNumber *_Nonnull)tag removeView:(BOOL)removeView;
 - (void)endAnimationsRecursive:(REAUIView *)view;

package/apple/LayoutReanimation/REAAnimationsManager.m

@@ -600,6 +600,11 @@ BOOL REANodeFind(id<RCTComponent> view, int (^block)(id<RCTComponent>))
   [_sharedTransitionManager setFindPrecedingViewTagForTransitionBlock:findPrecedingViewTagForTransition];
 }
 
+- (void)setGetSharedGroupBlock:(REAGetSharedGroupBlock)getSharedGroupBlock
+{
+  [_sharedTransitionManager setGetSharedGroupBlock:getSharedGroupBlock];
+}
+
 - (void)setCancelAnimationBlock:(REACancelAnimationBlock)animationCancellingBlock
 {
   [_sharedTransitionManager setCancelAnimationBlock:animationCancellingBlock];

package/apple/LayoutReanimation/REAScreensHelper.h

@@ -3,7 +3,9 @@
   || (RCT_NEW_ARCH_ENABLED && __has_include(<RNScreens/RNSScreen.h>) && __cplusplus))
 
 #if LOAD_SCREENS_HEADERS
+#import <RNScreens/RNSEnums.h>
 #import <RNScreens/RNSScreen.h>
+#import <RNScreens/RNSScreenNavigationContainer.h>
 #import <RNScreens/RNSScreenStack.h>
 #endif
 
@@ -17,5 +19,9 @@
 + (REAUIView *)getScreenWrapper:(REAUIView *)view;
 + (int)getScreenType:(REAUIView *)screen;
 + (bool)isRNSScreenType:(REAUIView *)screen;
++ (REAUIView *)findTopScreenInChildren:(REAUIView *)screen;
++ (REAUIView *)getActiveTabForTabNavigator:(REAUIView *)tabNavigator;
++ (bool)isView:(REAUIView *)view DescendantOfScreen:(REAUIView *)screen;
++ (bool)isViewOnTopOfScreenStack:(REAUIView *)view;
 
 @end

package/apple/LayoutReanimation/REAScreensHelper.m

@@ -18,6 +18,9 @@
 
 + (REAUIView *)getStackForView:(REAUIView *)view
 {
+  if (view == nil) {
+    return nil;
+  }
   if ([view isKindOfClass:[RNSScreenView class]]) {
     if (view.reactSuperview != nil) {
       if ([view.reactSuperview isKindOfClass:[RNSScreenStackView class]]) {
@@ -25,11 +28,19 @@
       }
     }
   }
-  while (view != nil && ![view isKindOfClass:[RNSScreenStackView class]] && view.superview != nil) {
-    view = view.superview;
+  REAUIView *currentView = view;
+  while (currentView.reactSuperview != nil) {
+    if ([currentView isKindOfClass:[RNSScreenStackView class]]) {
+      return currentView;
+    }
+    currentView = currentView.reactSuperview;
   }
-  if ([view isKindOfClass:[RNSScreenStackView class]]) {
-    return view;
+  currentView = view;
+  while (currentView.superview != nil) {
+    if ([currentView isKindOfClass:[RNSScreenStackView class]]) {
+      return currentView;
+    }
+    currentView = currentView.superview;
   }
   return nil;
 }
@@ -69,6 +80,83 @@
   return [view isKindOfClass:[RNSScreen class]] == YES;
 }
 
++ (REAUIView *)getActiveTabForTabNavigator:(REAUIView *)tabNavigator
+{
+  NSArray<REAUIView *> *screenTabs = tabNavigator.reactSubviews;
+  for (RNSScreenView *tab in screenTabs) {
+    if (tab.activityState == RNSActivityStateOnTop) {
+      return tab;
+    }
+  }
+  return nil;
+}
+
++ (REAUIView *)findTopScreenInChildren:(REAUIView *)view
+{
+  for (REAUIView *child in view.reactSubviews) {
+    if ([child isKindOfClass:[RNSScreenStackView class]]) {
+      int screenCount = [child.reactSubviews count];
+      if (screenCount != 0) {
+        REAUIView *topScreen = child.reactSubviews[[child.reactSubviews count] - 1];
+        REAUIView *maybeChildScreen = [REAScreensHelper findTopScreenInChildren:topScreen];
+        if (maybeChildScreen) {
+          return maybeChildScreen;
+        }
+        if (topScreen) {
+          return topScreen;
+        }
+      }
+    }
+    REAUIView *topScreen = [REAScreensHelper findTopScreenInChildren:child];
+    if (topScreen != nil) {
+      return topScreen;
+    }
+  }
+  if ([view isKindOfClass:[RNSScreenView class]]) {
+    return view;
+  }
+  return nil;
+}
+
++ (bool)isView:(REAUIView *)view DescendantOfScreen:(REAUIView *)screen
+{
+  REAUIView *currentView = view;
+  while (currentView.reactSuperview) {
+    if (currentView == screen) {
+      return true;
+    }
+    currentView = currentView.reactSuperview;
+  }
+  return false;
+}
+
++ (bool)isViewOnTopOfScreenStack:(REAUIView *)view
+{
+  NSMutableArray<REAUIView *> *screens = [NSMutableArray new];
+  REAUIView *currentView = view;
+  while (currentView.reactSuperview != nil) {
+    if ([currentView isKindOfClass:[RNSScreenView class]]) {
+      [screens addObject:currentView];
+    }
+    currentView = currentView.reactSuperview;
+  }
+  for (int i = 0; i < [screens count]; i++) {
+    REAUIView *screen = screens[i];
+    REAUIView *container = screen.reactSuperview;
+    if ([container isKindOfClass:[RNSScreenStackView class]]) {
+      if (screen.reactSuperview.reactSubviews.lastObject != screen) {
+        return false;
+      }
+    }
+    if ([container isKindOfClass:[RNSScreenNavigationContainerView class]]) {
+      if ([REAScreensHelper getActiveTabForTabNavigator:container] != screen) {
+        return false;
+      }
+    }
+  }
+  return true;
+}
+
 #else
 
 + (REAUIView *)getScreenForView:(REAUIView *)view

package/apple/LayoutReanimation/REASharedTransitionManager.h

@@ -10,6 +10,7 @@
 - (void)setFindPrecedingViewTagForTransitionBlock:
     (REAFindPrecedingViewTagForTransitionBlock)findPrecedingViewTagForTransition;
 - (void)setCancelAnimationBlock:(REACancelAnimationBlock)cancelAnimationBlock;
+- (void)setGetSharedGroupBlock:(REAGetSharedGroupBlock)getSharedGroupBlock;
 - (instancetype)initWithAnimationsManager:(REAAnimationsManager *)animationManager;
 - (REAUIView *)getTransitioningView:(NSNumber *)tag;
 - (NSDictionary *)prepareDataForWorklet:(NSMutableDictionary *)currentValues

package/apple/LayoutReanimation/REASharedTransitionManager.m

@@ -11,6 +11,7 @@
   NSMutableDictionary<NSNumber *, REAUIView *> *_currentSharedTransitionViews;
   REAFindPrecedingViewTagForTransitionBlock _findPrecedingViewTagForTransition;
   REACancelAnimationBlock _cancelLayoutAnimation;
+  REAGetSharedGroupBlock _getSharedGroupBlock;
   REAUIView *_transitionContainer;
   NSMutableArray<REAUIView *> *_addedSharedViews;
   BOOL _isSharedTransitionActive;
@@ -29,7 +30,8 @@
   BOOL _isAsyncSharedTransitionConfigured;
   BOOL _clearScreen;
   BOOL _isInteractive;
-  REAUIView *_disappearingScreen;
+  NSMutableArray<REAUIView *> *_disappearingScreens;
+  BOOL _isTabNavigator;
 }
 
 /*
@@ -68,6 +70,21 @@ static BOOL _isConfigured = NO;
     _reattachedViews = [NSMutableSet new];
     _isAsyncSharedTransitionConfigured = NO;
     _isConfigured = NO;
+    _disappearingScreens = [NSMutableArray new];
+    _isTabNavigator = NO;
+    _findPrecedingViewTagForTransition = ^NSNumber *(NSNumber *tag)
+    {
+      // default implementation, this block will be replaced by a setter
+      return nil;
+    };
+    _cancelLayoutAnimation = ^(NSNumber *tag) {
+      // default implementation, this block will be replaced by a setter
+    };
+    _getSharedGroupBlock = ^NSArray<NSNumber *> *(NSNumber *tag)
+    {
+      // default implementation, this block will be replaced by a setter
+      return nil;
+    };
     [self swizzleScreensMethods];
   }
   return self;
@@ -240,6 +257,8 @@ static BOOL _isConfigured = NO;
       }
     } while (siblingView == nil && siblingViewTag != nil);
 
+    siblingView = [self maybeOverrideSiblingForTabNavigator:sharedView siblingView:siblingView];
+
     if (siblingView == nil) {
       // the sibling of shared view doesn't exist yet
       continue;
@@ -276,14 +295,18 @@ static BOOL _isConfigured = NO;
     // check valid target screen configuration
     int screensCount = [stack.reactSubviews count];
     if (addedNewScreen && !isModal) {
-      // is under top
-      if (screensCount < 2) {
-        continue;
-      }
-      REAUIView *viewSourceParentScreen = [REAScreensHelper getScreenForView:viewSource];
-      REAUIView *screenUnderStackTop = stack.reactSubviews[screensCount - 2];
-      if (![screenUnderStackTop.reactTag isEqual:viewSourceParentScreen.reactTag] && !isInCurrentTransition) {
-        continue;
+      REAUIView *sourceStack = [REAScreensHelper getStackForView:viewSource];
+      REAUIView *targetStack = [REAScreensHelper getStackForView:viewTarget];
+      if (sourceStack == targetStack) {
+        // is under top
+        if (screensCount < 2) {
+          continue;
+        }
+        REAUIView *viewSourceParentScreen = [REAScreensHelper getScreenForView:viewSource];
+        REAUIView *screenUnderStackTop = stack.reactSubviews[screensCount - 2];
+        if (![screenUnderStackTop.reactTag isEqual:viewSourceParentScreen.reactTag] && !isInCurrentTransition) {
+          continue;
+        }
       }
     } else if (!addedNewScreen && !isModal) {
       // is on top
@@ -358,6 +381,49 @@ static BOOL _isConfigured = NO;
   return newSharedElements;
 }
 
+- (REAUIView *)maybeOverrideSiblingForTabNavigator:(REAUIView *)sharedView siblingView:(REAUIView *)siblingView
+{
+  REAUIView *maybeTabNavigatorForSharedView = [self getTabNavigator:sharedView];
+  REAUIView *maybeTabNavigatorForSiblingView = [self getTabNavigator:siblingView];
+
+  if (!(maybeTabNavigatorForSharedView && maybeTabNavigatorForSiblingView) ||
+      maybeTabNavigatorForSharedView != maybeTabNavigatorForSiblingView) {
+    return siblingView;
+  }
+
+  NSArray<NSNumber *> *sharedGroup = _getSharedGroupBlock(sharedView.reactTag);
+  int siblingIndex = [sharedGroup indexOfObject:siblingView.reactTag];
+  REAUIView *activeTab = [REAScreensHelper getActiveTabForTabNavigator:maybeTabNavigatorForSharedView];
+  for (int i = siblingIndex; i >= 0; i--) {
+    NSNumber *viewTag = sharedGroup[i];
+    REAUIView *view = [_animationManager viewForTag:viewTag];
+    if ([REAScreensHelper isView:view DescendantOfScreen:activeTab]) {
+      return view;
+    }
+  }
+  return nil;
+}
+
+- (REAUIView *)getTabNavigator:(REAUIView *)view
+{
+  REAUIView *currentView = view;
+  while (currentView.superview) {
+    if ([currentView isKindOfClass:NSClassFromString(@"RNSScreenNavigationContainerView")]) {
+      return currentView;
+    }
+    currentView = (REAUIView *)currentView.superview;
+  }
+
+  currentView = view;
+  while (currentView.reactSuperview) {
+    if ([currentView isKindOfClass:NSClassFromString(@"RNSScreenNavigationContainerView")]) {
+      return currentView;
+    }
+    currentView = (REAUIView *)currentView.reactSuperview;
+  }
+  return nil;
+}
+
 /*
   Method swizzling is used to get notification from react-native-screens
   about push or pop screen from stack.
@@ -365,19 +431,19 @@ static BOOL _isConfigured = NO;
 - (void)swizzleScreensMethods
 {
 #if LOAD_SCREENS_HEADERS
-  static dispatch_once_t onceToken;
-  dispatch_once(&onceToken, ^{
-    SEL viewDidLayoutSubviewsSelector = @selector(viewDidLayoutSubviews);
-    SEL notifyWillDisappearSelector = @selector(notifyWillDisappear);
-    SEL viewIsAppearingSelector = @selector(viewIsAppearing:);
-    Class screenClass = [RNSScreen class];
-    Class screenViewClass = [RNSScreenView class];
-    BOOL allSelectorsAreAvailable = [RNSScreen instancesRespondToSelector:viewDidLayoutSubviewsSelector] &&
-        [RNSScreenView instancesRespondToSelector:notifyWillDisappearSelector] &&
-        [RNSScreen instancesRespondToSelector:viewIsAppearingSelector] &&
-        [RNSScreenView instancesRespondToSelector:@selector(isModal)]; // used by REAScreenHelper
-
-    if (allSelectorsAreAvailable) {
+  SEL viewDidLayoutSubviewsSelector = @selector(viewDidLayoutSubviews);
+  SEL notifyWillDisappearSelector = @selector(notifyWillDisappear);
+  SEL viewIsAppearingSelector = @selector(viewIsAppearing:);
+  Class screenClass = [RNSScreen class];
+  Class screenViewClass = [RNSScreenView class];
+  BOOL allSelectorsAreAvailable = [RNSScreen instancesRespondToSelector:viewDidLayoutSubviewsSelector] &&
+      [RNSScreenView instancesRespondToSelector:notifyWillDisappearSelector] &&
+      [RNSScreen instancesRespondToSelector:viewIsAppearingSelector] &&
+      [RNSScreenView instancesRespondToSelector:@selector(isModal)]; // used by REAScreenHelper
+
+  if (allSelectorsAreAvailable) {
+    static dispatch_once_t onceToken;
+    dispatch_once(&onceToken, ^{
       [REAUtils swizzleMethod:viewDidLayoutSubviewsSelector
                      forClass:screenClass
                          with:@selector(reanimated_viewDidLayoutSubviews)
@@ -390,21 +456,46 @@ static BOOL _isConfigured = NO;
                      forClass:screenClass
                          with:@selector(reanimated_viewIsAppearing:)
                     fromClass:[self class]];
-      _isConfigured = YES;
-    }
-  });
+    });
+    _isConfigured = YES;
+  }
 #endif
 }
 
 - (void)setDisappearingScreen:(REAUIView *)view
 {
-  _disappearingScreen = view;
+  if (view == nil) {
+    [_disappearingScreens removeAllObjects];
+  } else {
+    [_disappearingScreens addObject:view];
+  }
   _isInteractive = [_sharedTransitionManager isInteractiveScreenChange:view];
 }
 
-- (REAUIView *)getDisappearingScreen
+- (REAUIView *)getLastDisappearingScreen
 {
-  return _disappearingScreen;
+  int count = [_disappearingScreens count];
+  if (count == 0) {
+    return nil;
+  } else {
+    return _disappearingScreens[count - 1];
+  }
+}
+
+- (NSMutableArray<REAUIView *> *)getDisappearingScreens
+{
+  return _disappearingScreens;
+}
+
+- (void)dismissAsyncTransition
+{
+  _isAsyncSharedTransitionConfigured = NO;
+  [_sharedElements removeAllObjects];
+}
+
+- (BOOL)isTabNavigator
+{
+  return _isTabNavigator;
 }
 
 - (void)setIsInteractive:(BOOL)isInteractive
@@ -422,7 +513,12 @@ static BOOL _isConfigured = NO;
   // call original method from react-native-screens, self == RNScreen
   [self reanimated_viewDidLayoutSubviews];
   REAUIView *screen = [self valueForKey:@"screenView"];
-  [_sharedTransitionManager screenAddedToStack:screen];
+  if ([_sharedTransitionManager isTabNavigator]) {
+    [_sharedTransitionManager dismissAsyncTransition];
+    [_sharedTransitionManager handleTabNavigatorChange:screen];
+  } else {
+    [_sharedTransitionManager screenAddedToStack:screen];
+  }
 }
 
 - (void)reanimated_notifyWillDisappear
@@ -443,20 +539,129 @@ static BOOL _isConfigured = NO;
 {
   // call original method from react-native-screens, self == RNSScreen
   [self reanimated_viewIsAppearing:animated];
-  REAUIView *disappearingScreen = [_sharedTransitionManager getDisappearingScreen];
+  REAUIView *disappearingScreen = [_sharedTransitionManager getLastDisappearingScreen];
   REAUIView *targetScreen = [self valueForKey:@"screenView"];
-  if (disappearingScreen != NULL) {
-    [_sharedTransitionManager screenRemovedFromStack:disappearingScreen
-                                         withOffsetX:-targetScreen.superview.frame.origin.x
-                                         withOffsetY:-targetScreen.superview.frame.origin.y];
+
+  if (disappearingScreen == nil) {
+    [_sharedTransitionManager setDisappearingScreen:nil];
+    return;
   }
-  [_sharedTransitionManager setDisappearingScreen:NULL];
+
+  NSArray *disappearingScreens = [_sharedTransitionManager getDisappearingScreens];
+  REAUIView *firstScreen = disappearingScreens[0];
+  if ([firstScreen.reactSuperview isKindOfClass:NSClassFromString(@"RNSScreenNavigationContainerView")]) {
+    [_sharedTransitionManager handleTabNavigatorChange:nil];
+    return;
+  }
+  float transitionViewOffsetX = 0;
+  if ([REAScreensHelper getStackForView:disappearingScreen] != [REAScreensHelper getStackForView:targetScreen]) {
+    transitionViewOffsetX = [_sharedTransitionManager getTransitionViewOffset:targetScreen];
+  }
+  [_sharedTransitionManager screenRemovedFromStack:disappearingScreen
+                                       withOffsetX:-(targetScreen.superview.frame.origin.x + transitionViewOffsetX)
+                                       withOffsetY:-(targetScreen.superview.frame.origin.y)];
+  [_sharedTransitionManager setDisappearingScreen:nil];
+}
+
+- (void)handleTabNavigatorChange:(REAUIView *)layoutedScreen
+{
+  if (_isAsyncSharedTransitionConfigured) {
+    // this is a new screen, let wait until header will be attached to a screen to make a proper snapshots
+    _isTabNavigator = YES;
+    return;
+  }
+
+  REAUIView *navTabScreen = _disappearingScreens[0];
+  REAUIView *sourceScreen = _disappearingScreens[[_disappearingScreens count] - 1];
+  REAUIView *targetTabScreen = [REAScreensHelper getActiveTabForTabNavigator:navTabScreen.reactSuperview];
+  REAUIView *targetScreen = [REAScreensHelper findTopScreenInChildren:targetTabScreen];
+  if (!layoutedScreen && _isTabNavigator) {
+    // just wait for the next layout computation for your screen
+    return;
+  }
+
+  NSMutableArray<REAUIView *> *sharedViews = [NSMutableArray new];
+  REANodeFind(sourceScreen, ^int(id<RCTComponent> view) {
+    if ([self->_animationManager hasAnimationForTag:view.reactTag type:SHARED_ELEMENT_TRANSITION]) {
+      [sharedViews addObject:(REAUIView *)view];
+    }
+    return false;
+  });
+  sharedViews = (NSMutableArray<REAUIView *> *)[self sortViewsByTags:sharedViews];
+
+  for (REAUIView *sharedView in sharedViews) {
+    NSArray<NSNumber *> *groupTags = _getSharedGroupBlock(sharedView.reactTag);
+    if (![groupTags containsObject:sharedView.reactTag]) {
+      continue;
+    }
+    REAUIView *siblingView;
+    for (NSNumber *tag in groupTags) {
+      REAUIView *currentView = [_animationManager viewForTag:tag];
+      if ([REAScreensHelper isView:currentView DescendantOfScreen:targetScreen]) {
+        siblingView = currentView;
+        REAUIView *siblingScreen = [REAScreensHelper getScreenForView:siblingView];
+        if (layoutedScreen && siblingScreen != layoutedScreen) {
+          // just wait for the next layout computation for your screen
+          return;
+        }
+        break;
+      }
+    }
+
+    if (siblingView == nil) {
+      return;
+    }
+
+    REAUIView *viewSource = sharedView;
+    REAUIView *viewTarget = siblingView;
+    REASnapshot *sourceViewSnapshot = _snapshotRegistry[viewSource.reactTag];
+    if (navTabScreen.superview) {
+      sourceViewSnapshot = [[REASnapshot alloc] initWithAbsolutePosition:viewSource];
+    }
+    REASnapshot *targetViewSnapshot = [[REASnapshot alloc] initWithAbsolutePosition:viewTarget];
+    REASharedElement *sharedElement = [[REASharedElement alloc] initWithSourceView:viewSource
+                                                                sourceViewSnapshot:sourceViewSnapshot
+                                                                        targetView:viewTarget
+                                                                targetViewSnapshot:targetViewSnapshot];
+    sharedElement.animationType = SHARED_ELEMENT_TRANSITION;
+    [_sharedElements addObject:sharedElement];
+
+    _snapshotRegistry[viewSource.reactTag] = sourceViewSnapshot;
+    _snapshotRegistry[viewTarget.reactTag] = targetViewSnapshot;
+    _sharedElementsLookup[viewSource.reactTag] = sharedElement;
+  }
+
+  [self setDisappearingScreen:nil];
+  _isTabNavigator = NO;
+
+  if ([_sharedElements count] == 0) {
+    return;
+  }
+
+  [self configureTransitionContainer];
+  [self reparentSharedViewsForCurrentTransition:_sharedElements];
+  [self startSharedTransition:_sharedElements];
+}
+
+- (float)getTransitionViewOffset:(REAUIView *)screen
+{
+  float x = 0;
+  REAUIView *currentView = screen;
+  while (currentView.superview != nil) {
+    REAUIView *maybeView = (REAUIView *)currentView.superview.superview;
+    if ([maybeView isKindOfClass:NSClassFromString(@"UINavigationTransitionView")]) {
+      CGPoint transitionViewOffset = currentView.frame.origin;
+      x += transitionViewOffset.x;
+    }
+    currentView = currentView.superview;
+  }
+  return x;
 }
 
 - (void)screenAddedToStack:(REAUIView *)screen
 {
   if (screen.superview != nil) {
-    [self runAsyncSharedTransition];
+    [self runAsyncSharedTransition:screen];
   }
 }
 
@@ -469,9 +674,9 @@ static BOOL _isConfigured = NO;
   bool isInteractive = [self getIsInteractive];
   if ((stack != nil || isModal) && !isRemovedInParentStack) {
     // screen is removed from React tree (navigation.navigate(<screenName>))
-    bool isScreenRemovedFromReactTree = [self isScreen:screen outsideStack:stack];
+    bool isScreenRemovedFromReactTree = screen.reactSuperview == nil;
     // click on button goBack on native header
-    bool isTriggeredByGoBackButton = [self isScreen:screen onTopOfStack:stack];
+    bool isTriggeredByGoBackButton = [REAScreensHelper isViewOnTopOfScreenStack:screen];
     bool shouldRunTransition = (isScreenRemovedFromReactTree || isTriggeredByGoBackButton) &&
         !(isInteractive && [_currentSharedTransitionViews count] > 0);
     if (shouldRunTransition) {
@@ -526,22 +731,6 @@ static BOOL _isConfigured = NO;
   }
 }
 
-- (BOOL)isScreen:(REAUIView *)screen outsideStack:(REAUIView *)stack
-{
-  for (REAUIView *child in stack.reactSubviews) {
-    if ([child.reactTag isEqual:screen.reactTag]) {
-      return NO;
-    }
-  }
-  return YES;
-}
-
-- (BOOL)isScreen:(REAUIView *)screen onTopOfStack:(REAUIView *)stack
-{
-  int screenCount = stack.reactSubviews.count;
-  return screenCount > 0 && screen == stack.reactSubviews.lastObject;
-}
-
 - (BOOL)isRemovedFromHigherStack:(REAUIView *)screen
 {
   REAUIView *stack = screen.reactSuperview;
@@ -588,13 +777,18 @@ static BOOL _isConfigured = NO;
   }
 }
 
-- (void)runAsyncSharedTransition
+- (void)runAsyncSharedTransition:(REAUIView *)screen
 {
   if ([_sharedElements count] == 0 || !_isAsyncSharedTransitionConfigured) {
     return;
   }
   for (REASharedElement *sharedElement in _sharedElements) {
     REAUIView *viewTarget = sharedElement.targetView;
+    REAUIView *viewScreen = [REAScreensHelper getScreenForView:viewTarget];
+    if (viewScreen != screen) {
+      // just wait for the next layout computation for your screen
+      return;
+    }
     REASnapshot *targetViewSnapshot = [[REASnapshot alloc] initWithAbsolutePosition:viewTarget];
     _snapshotRegistry[viewTarget.reactTag] = targetViewSnapshot;
     sharedElement.targetViewSnapshot = targetViewSnapshot;
@@ -743,6 +937,11 @@ static BOOL _isConfigured = NO;
   _cancelLayoutAnimation = cancelAnimationBlock;
 }
 
+- (void)setGetSharedGroupBlock:(REAGetSharedGroupBlock)getSharedGroupBlock
+{
+  _getSharedGroupBlock = getSharedGroupBlock;
+}
+
 - (void)clearAllSharedConfigsForViewTag:(NSNumber *)viewTag
 {
   if (viewTag != nil) {

package/apple/native/NativeProxy.mm

@@ -211,6 +211,18 @@ void setupLayoutAnimationCallbacks(
     }
     return nil;
   }];
+
+  [animationsManager setGetSharedGroupBlock:^NSArray<NSNumber *> *_Nullable(NSNumber *_Nonnull tag) {
+    if (auto nativeReanimatedModule = weakNativeReanimatedModule.lock()) {
+      const auto &results = nativeReanimatedModule->layoutAnimationsManager().getSharedGroup([tag intValue]);
+      NSMutableArray<NSNumber *> *convertedResult = [NSMutableArray new];
+      for (const int tag : results) {
+        [convertedResult addObject:@(tag)];
+      }
+      return convertedResult;
+    }
+    return nil;
+  }];
 #ifndef NDEBUG
   [animationsManager setCheckDuplicateSharedTagBlock:^(REAUIView *view, NSNumber *_Nonnull viewTag) {
     if (auto nativeReanimatedModule = weakNativeReanimatedModule.lock()) {

package/lib/module/Colors.js

@@ -433,7 +433,9 @@ export const rgbaColor = (r, g, b, alpha = 1) => {
   'worklet';
 
   if (IS_WEB || !_WORKLET) {
-    return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+    // Replace tiny values like 1.234e-11 with 0:
+    const safeAlpha = alpha < 0.001 ? 0 : alpha;
+    return `rgba(${r}, ${g}, ${b}, ${safeAlpha})`;
   }
   const c = Math.round(alpha * 255) * (1 << 24) + Math.round(r) * (1 << 16) + Math.round(g) * (1 << 8) + Math.round(b);
   if (IS_ANDROID) {
@@ -599,7 +601,8 @@ export function convertToRGBA(color) {
 export function rgbaArrayToRGBAColor(RGBA) {
   'worklet';
 
-  return `rgba(${Math.round(RGBA[0] * 255)}, ${Math.round(RGBA[1] * 255)}, ${Math.round(RGBA[2] * 255)}, ${RGBA[3]})`;
+  const alpha = RGBA[3] < 0.001 ? 0 : RGBA[3];
+  return `rgba(${Math.round(RGBA[0] * 255)}, ${Math.round(RGBA[1] * 255)}, ${Math.round(RGBA[2] * 255)}, ${alpha})`;
 }
 export function toLinearSpace(RGBA, gamma = 2.2) {
   'worklet';