V2 animations (#2878)

* passProps to buttons

* push and pop custom transitions

* refactored defaultOptions

* custom animations support for show and dismiss modal

lib/ios/RNNAnimationOptions.m

@@ -7,10 +7,6 @@
 @implementation RNNAnimationOptions
 
 - (instancetype)initWithDict:(NSDictionary *)dict {
-	if (!dict[@"animations"]) {
-		return nil;
-	}
-	
 	return [super initWithDict:dict];
 }
 

lib/ios/RNNAnimator.m

@@ -12,7 +12,7 @@
 
 -(instancetype)initWithTransitionOptions:(RNNAnimationOptions *)transitionOptions {
 	self = [super init];
-	if (transitionOptions) {
+	if (transitionOptions.animations) {
 		[self setupTransition:transitionOptions];
 	} else {
 		return nil;
@@ -47,11 +47,7 @@
 
 -(void)animateTransitions:(NSArray*)transitions {
 	for (RNNTransition* transition in transitions ) {
-		[UIView animateWithDuration:transition.options.duration delay:transition.options.startDelay usingSpringWithDamping:transition.options.springDamping initialSpringVelocity:transition.options.springVelocity options:UIViewAnimationOptionCurveEaseOut  animations:^{
-			[transition setAnimatedViewFinalProperties];
-		} completion:^(BOOL finished) {
-
-		}];
+		[transition animate];
 	}
 }
 

lib/ios/RNNCommandsHandler.m

@@ -56,8 +56,7 @@
 
 -(void) setDefaultOptions:(NSDictionary*)optionsDict completion:(RNNTransitionCompletionBlock)completion {
 	[self assertReady];
-	RNNNavigationOptions* options = [[RNNNavigationOptions alloc] initWithDict:optionsDict];
-	[_controllerFactory setDefaultOptions:options];
+	[_controllerFactory setDefaultOptionsDict:optionsDict];
 }
 
 -(void) push:(NSString*)componentId layout:(NSDictionary*)layout completion:(RNNTransitionCompletionBlock)completion {
@@ -79,12 +78,8 @@
 	NSDictionary* animationData = options[@"customTransition"];
 	RNNAnimationOptions* transitionOptions = [[RNNAnimationOptions alloc] initWithDict:animationData];
 	
-	if (transitionOptions){
-		if (transitionOptions.animations) {
-			[_navigationStackManager pop:componentId withTransitionOptions:transitionOptions];
-		} else {
-			[[NSException exceptionWithName:NSInvalidArgumentException reason:@"unsupported transitionAnimation" userInfo:nil] raise];
-		}
+	if (transitionOptions.animations){
+		[_navigationStackManager pop:componentId withTransitionOptions:transitionOptions];
 	} else {
 		[_navigationStackManager pop:componentId withTransitionOptions:nil];
 	}

lib/ios/RNNControllerFactory.h

@@ -17,7 +17,7 @@
 
 - (UIViewController<RNNRootViewProtocol> *)createOverlay:(NSDictionary*)layout;
 
-@property (nonatomic, strong) RNNNavigationOptions* defaultOptions;
+@property (nonatomic, strong) NSDictionary* defaultOptionsDict;
 @property (nonatomic, strong) RNNEventEmitter *eventEmitter;
 
 @end

lib/ios/RNNControllerFactory.m

@@ -90,8 +90,9 @@
 
 - (UIViewController<RNNRootViewProtocol> *)createComponent:(RNNLayoutNode*)node nativeComponent:(BOOL)nativeComponent {
 	NSString* name = node.data[@"name"];
-	RNNNavigationOptions* options = [[RNNNavigationOptions alloc] initWithDict:node.data[@"options"]];
-	options.defaultOptions = _defaultOptions;
+	RNNNavigationOptions* options = [[RNNNavigationOptions alloc] initWithDict:_defaultOptionsDict];
+	[options mergeWith:node.data[@"options"]];
+
 	NSString* componentId = node.nodeId;
 	RNNRootViewController* component = [[RNNRootViewController alloc] initWithName:name withOptions:options withComponentId:componentId rootViewCreator:_creator eventEmitter:_eventEmitter isExternalComponent:nativeComponent];
 	if (!component.isCustomViewController) {

lib/ios/RNNModalAnimation.h

@@ -0,0 +1,11 @@
+#import <Foundation/Foundation.h>
+#import "RNNScreenTransition.h"
+
+@interface RNNModalAnimation : NSObject <UIViewControllerAnimatedTransitioning>
+
+@property (nonatomic, strong) RNNScreenTransition* screenTransition;
+@property (nonatomic) BOOL isDismiss;
+
+- (instancetype)initWithScreenTransition:(RNNScreenTransition *)screenTransition isDismiss:(BOOL)isDismiss;
+
+@end

lib/ios/RNNModalAnimation.m

@@ -0,0 +1,42 @@
+#import "RNNModalAnimation.h"
+
+@implementation RNNModalAnimation
+
+- (instancetype)initWithScreenTransition:(RNNScreenTransition *)screenTransition isDismiss:(BOOL)isDismiss {
+	self = [super init];
+	self.screenTransition = screenTransition;
+	self.isDismiss = isDismiss;
+	
+	return self;
+}
+
+- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext {
+	return self.screenTransition.content.duration;
+}
+
+- (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext {
+	UIViewController* toViewController = [transitionContext viewControllerForKey:self.isDismiss ? UITransitionContextFromViewControllerKey : UITransitionContextToViewControllerKey];
+	UIViewController* fromViewController = [transitionContext viewControllerForKey:self.isDismiss ? UITransitionContextToViewControllerKey : UITransitionContextFromViewControllerKey];
+	
+	if (self.isDismiss) {
+		[[transitionContext containerView] addSubview:fromViewController.view];
+		[[transitionContext containerView] addSubview:toViewController.view];
+	} else {
+		[[transitionContext containerView] addSubview:toViewController.view];
+	}
+	
+	[_screenTransition.content setupInitialTransitionForView:toViewController.view];
+	[_screenTransition.topBar setupInitialTransitionForView:toViewController.navigationController.navigationBar];
+	
+	
+	[UIView animateWithDuration:[self transitionDuration:transitionContext] animations:^{
+		[_screenTransition.content completeTransitionForView:toViewController.view];
+		[_screenTransition.topBar completeTransitionForView:toViewController.navigationController.navigationBar];
+	} completion:^(BOOL finished) {
+		[transitionContext completeTransition:![transitionContext transitionWasCancelled]];
+	}];
+}
+
+
+@end
+

lib/ios/RNNModalManager.m

@@ -21,7 +21,10 @@
 
 -(void)showModalAfterLoad:(NSDictionary*)notif {
 	[[NSNotificationCenter defaultCenter] removeObserver:self name:@"RCTContentDidAppearNotification" object:nil];
-	UIViewController *topVC = [self topPresentedVC];
+	RNNRootViewController *topVC = (RNNRootViewController*)[self topPresentedVC];
+	if (topVC.options.animations.showModal) {
+		self.toVC.transitioningDelegate = topVC;
+	}
 	[topVC presentViewController:self.toVC animated:self.toVC.isAnimated completion:^{
 		if (_completionBlock) {
 			_completionBlock();
@@ -61,6 +64,10 @@
 	
 	UIViewController* topPresentedVC = [self topPresentedVC];
 	
+	if (modalToDismiss.options.animations.showModal) {
+		modalToDismiss.transitioningDelegate = modalToDismiss;
+	}
+	
 	if (modalToDismiss == topPresentedVC || [[topPresentedVC childViewControllers] containsObject:modalToDismiss]) {
 		[modalToDismiss dismissViewControllerAnimated:modalToDismiss.isAnimated completion:^{
 			[[_store pendingModalIdsToDismiss] removeObject:componentId];
@@ -77,5 +84,10 @@
 	return root;
 }
 
+-(UIViewController*)topPresentedVCLeaf {
+	id root = [self topPresentedVC];
+	return [root topViewController] ? [root topViewController] : root;
+}
+
 
 @end

lib/ios/RNNNavigationController.m

@@ -1,5 +1,6 @@
 
 #import "RNNNavigationController.h"
+#import "RNNModalAnimation.h"
 
 @implementation RNNNavigationController
 
@@ -24,4 +25,16 @@
 	return ((UIViewController<RNNRootViewProtocol>*)self.topViewController).componentId;
 }
 
+- (nullable id <UIViewControllerAnimatedTransitioning>)animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source {
+	return [[RNNModalAnimation alloc] initWithScreenTransition:self.options.animations.showModal isDismiss:NO];
+}
+
+- (id<UIViewControllerAnimatedTransitioning>)animationControllerForDismissedController:(UIViewController *)dismissed {
+	return [[RNNModalAnimation alloc] initWithScreenTransition:self.options.animations.dismissModal isDismiss:YES];
+}
+
+- (RNNNavigationOptions *)options {
+	return ((UIViewController<RNNRootViewProtocol>*)self.topViewController).options;
+}
+
 @end

lib/ios/RNNNavigationOptions.h

@@ -7,6 +7,7 @@
 #import "RNNTopTabsOptions.h"
 #import "RNNOverlayOptions.h"
 #import "RNNAnimationOptions.h"
+#import "RNNTransitionsOptions.h"
 
 extern const NSInteger BLUR_STATUS_TAG;
 extern const NSInteger BLUR_TOPBAR_TAG;
@@ -22,8 +23,8 @@ extern const NSInteger TOP_BAR_TRANSPARENT_TAG;
 @property (nonatomic, strong) RNNSideMenuOptions* sideMenu;
 @property (nonatomic, strong) RNNOverlayOptions* overlay;
 @property (nonatomic, strong) RNNAnimationOptions* customTransition;
+@property (nonatomic, strong) RNNTransitionsOptions* animations;
 
-@property (nonatomic, strong) RNNNavigationOptions* defaultOptions;
 
 @property (nonatomic, strong) NSNumber* animated;
 @property (nonatomic, strong) NSNumber* statusBarHidden;

lib/ios/RNNNavigationOptions.m

@@ -33,6 +33,7 @@ const NSInteger TOP_BAR_TRANSPARENT_TAG = 78264803;
 	self.overlay = [[RNNOverlayOptions alloc] initWithDict:[options objectForKey:@"overlay"]];
 	self.animated = [options objectForKey:@"animated"];
 	self.customTransition = [[RNNAnimationOptions alloc] initWithDict:[options objectForKey:@"customTransition"]];
+	self.animations = [[RNNTransitionsOptions alloc] initWithDict:[options objectForKey:@"animations"]];
 	
 	return self;
 }
@@ -50,21 +51,8 @@ const NSInteger TOP_BAR_TRANSPARENT_TAG = 78264803;
 	}
 }
 
--(void)mergeIfEmptyWith:(NSDictionary *)otherOptions {
-	for (id key in otherOptions) {
-		if ([self hasProperty:key]) {
-			if ([[self valueForKey:key] isKindOfClass:[RNNOptions class]]) {
-				RNNOptions* options = [self valueForKey:key];
-				[options mergeIfEmptyWith:[otherOptions objectForKey:key]];
-			} else if (![self valueForKey:key]) {
-				[self setValue:[otherOptions objectForKey:key] forKey:key];
-			}
-		}
-	}
-}
-
 -(void)applyOn:(UIViewController*)viewController {
-	[_defaultOptions applyOn:viewController];
+//	[_defaultOptions applyOn:viewController];
 	
 	[self.topBar applyOn:viewController];
 	[self.bottomTabs applyOn:viewController];

lib/ios/RNNNavigationStackManager.h

@@ -5,7 +5,7 @@
 @interface RNNNavigationStackManager : NSObject
 
 @property (nonatomic, strong) UIViewController* fromVC;
-@property (nonatomic, strong) UIViewController<RNNRootViewProtocol>* toVC;
+@property (nonatomic, strong) RNNRootViewController* toVC;
 @property (nonatomic) int loadCount;
 -(instancetype)initWithStore:(RNNStore*)store;
 

lib/ios/RNNNavigationStackManager.m

@@ -26,10 +26,11 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 }
 
 -(void)preparePush:(UIViewController<RNNRootViewProtocol> *)newTop onTopVC:(UIViewController*)vc completion:(RNNTransitionCompletionBlock)completion {
-	self.toVC = newTop;
+	self.toVC = (RNNRootViewController*)newTop;
 	self.fromVC = vc;
 	
-	if (self.toVC.isCustomTransitioned) {
+	
+	if (self.toVC.options.animations.push) {
 		vc.navigationController.delegate = newTop;
 	} else {
 		vc.navigationController.delegate = nil;
@@ -65,13 +66,11 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 }
 
 -(void)pop:(NSString *)componentId withTransitionOptions:(RNNAnimationOptions *)transitionOptions {
-	UIViewController<RNNRootViewProtocol>* vc = (UIViewController<RNNRootViewProtocol>*)[_store findComponentForId:componentId];
+	RNNRootViewController* vc = (RNNRootViewController*)[_store findComponentForId:componentId];
 	UINavigationController* nvc = [vc navigationController];
 	if ([nvc topViewController] == vc) {
-		if (transitionOptions) {
-			RNNRootViewController* RNNVC = (RNNRootViewController*)vc;
-			nvc.delegate = RNNVC;
-			RNNVC.animator = [[RNNAnimator alloc] initWithTransitionOptions:transitionOptions];
+		if (vc.options.animations.pop) {
+			nvc.delegate = vc;
 			[nvc popViewControllerAnimated:vc.isAnimated];
 		} else {
 			nvc.delegate = nil;

lib/ios/RNNOptions.m

@@ -24,8 +24,13 @@
 
 -(void)mergeIfEmptyWith:(NSDictionary *)otherOptions {
 	for (id key in otherOptions) {
-		if ([self hasProperty:key] && ![self valueForKey:key]) {
-			[self setValue:[otherOptions objectForKey:key] forKey:key];
+		if ([self hasProperty:key]) {
+			if ([[self valueForKey:key] isKindOfClass:[RNNOptions class]]) {
+				RNNOptions* options = [self valueForKey:key];
+				[options mergeIfEmptyWith:[otherOptions objectForKey:key]];
+			} else if (![self valueForKey:key]) {
+				[self setValue:[otherOptions objectForKey:key] forKey:key];
+			}
 		}
 	}
 }

lib/ios/RNNPushAnimation.h

@@ -0,0 +1,9 @@
+#import <Foundation/Foundation.h>
+#import <UIKit/UIKit.h>
+#import "RNNModalAnimation.h"
+
+@interface RNNPushAnimation : RNNModalAnimation <UIViewControllerAnimatedTransitioning>
+
+- (instancetype)initWithScreenTransition:(RNNScreenTransition *)screenTransition;
+
+@end

lib/ios/RNNPushAnimation.m

@@ -0,0 +1,34 @@
+#import "RNNPushAnimation.h"
+
+@implementation RNNPushAnimation
+
+- (instancetype)initWithScreenTransition:(RNNScreenTransition *)screenTransition {
+	self = [super init];
+	self.screenTransition = screenTransition;
+	
+	return self;
+}
+
+- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext {
+	return 0.5;
+}
+
+- (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext {
+	UIViewController* toViewController = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
+	
+	[[transitionContext containerView] addSubview:toViewController.view];
+	
+	[self.screenTransition.content setupInitialTransitionForView:toViewController.view];
+	[self.screenTransition.topBar setupInitialTransitionForView:toViewController.navigationController.navigationBar];
+	
+	
+	[UIView animateWithDuration:[self transitionDuration:transitionContext] animations:^{
+		[self.screenTransition.content completeTransitionForView:toViewController.view];
+		[self.screenTransition.topBar completeTransitionForView:toViewController.navigationController.navigationBar];
+	} completion:^(BOOL finished) {
+		[transitionContext completeTransition:![transitionContext transitionWasCancelled]];
+	}];
+}
+
+
+@end

lib/ios/RNNRootViewController.m

@@ -3,6 +3,7 @@
 #import <React/RCTConvert.h>
 #import "RNNAnimator.h"
 #import "RNNCustomTitleView.h"
+#import "RNNPushAnimation.h"
 
 @interface RNNRootViewController()
 @property (nonatomic, strong) NSString* componentName;
@@ -37,7 +38,6 @@
 											 selector:@selector(onJsReload)
 												 name:RCTJavaScriptWillStartLoadingNotification
 											   object:nil];
-	self.navigationController.modalPresentationStyle = UIModalPresentationCustom;
 	self.navigationController.delegate = self;
 
 	return self;
@@ -91,7 +91,7 @@
 }
 
 -(BOOL)isCustomTransitioned {
-	return self.options.customTransition != nil;
+	return self.options.customTransition.animations != nil;
 }
 
 - (BOOL)isAnimated {
@@ -135,16 +135,25 @@
 											   fromViewController:(UIViewController*)fromVC
 												 toViewController:(UIViewController*)toVC {
 {
-	if (operation == UINavigationControllerOperationPush) {
-		return self.animator;
-	} else if (operation == UINavigationControllerOperationPop) {
+	if (self.animator) {
 		return self.animator;
+	} else if (operation == UINavigationControllerOperationPush && self.options.animations.push) {
+		return [[RNNPushAnimation alloc] initWithScreenTransition:self.options.animations.push];
+	} else if (operation == UINavigationControllerOperationPop && self.options.animations.pop) {
+		return [[RNNPushAnimation alloc] initWithScreenTransition:self.options.animations.pop];
 	} else {
 		return nil;
 	}
 }
 	return nil;
+}
+
+- (nullable id <UIViewControllerAnimatedTransitioning>)animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source {
+	return [[RNNModalAnimation alloc] initWithScreenTransition:self.options.animations.showModal isDismiss:NO];
+}
 
+- (id<UIViewControllerAnimatedTransitioning>)animationControllerForDismissedController:(UIViewController *)dismissed {
+	return [[RNNModalAnimation alloc] initWithScreenTransition:self.options.animations.dismissModal isDismiss:YES];
 }
 
 -(void)applyTabBarItem {

lib/ios/RNNRootViewProtocol.h

@@ -1,6 +1,6 @@
 #import "RNNNavigationOptions.h"
 
-@protocol RNNRootViewProtocol <NSObject, UINavigationControllerDelegate>
+@protocol RNNRootViewProtocol <NSObject, UINavigationControllerDelegate, UIViewControllerTransitioningDelegate>
 
 @optional
 - (void)mergeOptions:(NSDictionary*)options;
@@ -9,7 +9,7 @@
 @required
 - (BOOL)isCustomTransitioned;
 - (BOOL)isAnimated;
-
+- (RNNNavigationOptions*)options;
 - (NSString *)componentId;
 
 @end

lib/ios/RNNScreenTransition.h

@@ -0,0 +1,10 @@
+#import "RNNOptions.h"
+#import "RNNTransitionStateHolder.h"
+
+@interface RNNScreenTransition : RNNOptions
+
+@property (nonatomic, strong) RNNTransitionStateHolder* topBar;
+@property (nonatomic, strong) RNNTransitionStateHolder* content;
+@property (nonatomic, strong) RNNTransitionStateHolder* bottomTabs;
+
+@end

lib/ios/RNNScreenTransition.m

@@ -0,0 +1,14 @@
+#import "RNNScreenTransition.h"
+
+@implementation RNNScreenTransition
+
+- (instancetype)initWithDict:(NSDictionary *)dict {
+	self = [super init];
+	self.topBar = [[RNNTransitionStateHolder alloc] initWithTransition:dict[@"topBar"]];
+	self.content = [[RNNTransitionStateHolder alloc] initWithTransition:dict[@"content"]];
+	self.bottomTabs = [[RNNTransitionStateHolder alloc] initWithTransition:dict[@"bottomTabs"]];
+	
+	return self;
+}
+
+@end

lib/ios/RNNSideMenuChildVC.m

@@ -41,6 +41,10 @@
 	return YES;
 }
 
+- (RNNOptions *)options {
+	return nil;
+}
+
 - (NSString *)componentId {
 	return _child.componentId;
 }

lib/ios/RNNSideMenuController.m

@@ -80,6 +80,10 @@
 	return YES;
 }
 
+- (RNNOptions *)options {
+	return nil;
+}
+
 - (NSString *)componentId {
 	return _center.componentId;
 }

lib/ios/RNNTabBarController.m

@@ -41,6 +41,10 @@
 	return YES;
 }
 
+- (RNNOptions *)options {
+	return nil;
+}
+
 - (void)mergeOptions:(NSDictionary *)options {
 	[((UIViewController<RNNRootViewProtocol>*)self.selectedViewController) mergeOptions:options];
 }

lib/ios/RNNTopTabsViewController.m

@@ -80,6 +80,10 @@
 	return YES;
 }
 
+- (RNNOptions *)options {
+	return nil;
+}
+
 - (NSString *)componentId {
 	return _currentViewController.componentId;
 }

lib/ios/RNNTransition.h

@@ -9,6 +9,8 @@
 
 - (instancetype)initFromVC:(UIViewController*)fromVC toVC:(UIViewController*)toVC transitionOptions:(RNNTransitionStateHolder*)transitionOptions isBackButton:(BOOL)isBackButton;
 
+- (void)animate;
+
 - (void)setAnimatedViewFinalProperties;
 
 - (void)transitionCompleted;

lib/ios/RNNTransition.m

@@ -43,6 +43,14 @@
 	return self;
 }
 
+- (void)animate {
+	[UIView animateWithDuration:self.options.duration delay:self.options.startDelay usingSpringWithDamping:self.options.springDamping initialSpringVelocity:self.options.springVelocity options:UIViewAnimationOptionCurveEaseOut  animations:^{
+		[self setAnimatedViewFinalProperties];
+	} completion:^(BOOL finished) {
+		
+	}];
+}
+
 - (void)setAnimatedViewFinalProperties {
 	CGFloat alpha = _isBackButton ? self.options.startAlpha : self.options.endAlpha;
 	self.animatedView.alpha = alpha;

lib/ios/RNNTransitionStateHolder.h

@@ -1,6 +1,8 @@
 #import <Foundation/Foundation.h>
+#import <UIKit/UIKit.h>
+#import "RNNOptions.h"
 
-@interface RNNTransitionStateHolder : NSObject
+@interface RNNTransitionStateHolder : RNNOptions
 
 @property (nonatomic) double startAlpha;
 @property (nonatomic) double endAlpha;
@@ -9,7 +11,6 @@
 @property (nonatomic) double springVelocity;
 @property (nonatomic) double springDamping;
 @property (nonatomic) double startDelay;
-@property (nonatomic, strong) NSString* fromElementType;
 @property (nonatomic, strong) NSString* fromId;
 @property (nonatomic, strong) NSString* toId;
 @property (nonatomic) BOOL isSharedElementTransition;
@@ -20,4 +21,8 @@
 
 - (instancetype)initWithTransition:(NSDictionary*)transition;
 
+- (void)setupInitialTransitionForView:(UIView *)view;
+
+- (void)completeTransitionForView:(UIView*)view;
+
 @end

lib/ios/RNNTransitionStateHolder.m

@@ -1,10 +1,16 @@
 #import "RNNTransitionStateHolder.h"
 #import "RNNUtils.h"
 
+@interface RNNTransitionStateHolder() {
+	CGRect _initialFrame;
+}
+
+@end
 @implementation RNNTransitionStateHolder
 
 -(instancetype)initWithTransition:(NSDictionary *)transition {
 	self = [super init];
+	
 	self.springDamping = [RNNUtils getDoubleOrKey:transition withKey:@"springDamping" withDefault:0.85];
 	self.springVelocity = [RNNUtils getDoubleOrKey:transition withKey:@"springVelocity" withDefault:0.8];
 	self.startDelay = [RNNUtils getDoubleOrKey:transition withKey:@"startDelay" withDefault:0];
@@ -18,9 +24,21 @@
 	self.endY = [RNNUtils getDoubleOrKey:transition[@"y"] withKey:@"to" withDefault:0];
 	self.fromId = [transition objectForKey:@"fromId"];
 	self.toId = [transition objectForKey:@"toId"];
-	self.fromElementType = nil;
 	self.isSharedElementTransition = [[transition objectForKey:@"type"] isEqualToString:@"sharedElement"];
+	
 	return self;
 }
 
+- (void)setupInitialTransitionForView:(UIView*)view {
+	_initialFrame = view.frame;
+	view.alpha = self.startAlpha;
+	view.frame = CGRectMake(_initialFrame.origin.x + self.startX, _initialFrame.origin.y + self.startY, view.frame.size.width, view.frame.size.height);
+}
+
+- (void)completeTransitionForView:(UIView*)view {
+	view.alpha = self.endAlpha;
+	view.frame = CGRectMake(_initialFrame.origin.x + self.endX, _initialFrame.origin.y + self.endY, view.frame.size.width, view.frame.size.height);
+	[view layoutSubviews];
+}
+
 @end

lib/ios/RNNTransitionsOptions.h

@@ -0,0 +1,12 @@
+#import "RNNOptions.h"
+#import "RNNTransitionStateHolder.h"
+#import "RNNScreenTransition.h"
+
+@interface RNNTransitionsOptions : RNNOptions
+
+@property (nonatomic, strong) RNNScreenTransition* push;
+@property (nonatomic, strong) RNNScreenTransition* pop;
+@property (nonatomic, strong) RNNScreenTransition* showModal;
+@property (nonatomic, strong) RNNScreenTransition* dismissModal;
+
+@end

lib/ios/RNNTransitionsOptions.m

@@ -0,0 +1,20 @@
+#import "RNNTransitionsOptions.h"
+
+@implementation RNNTransitionsOptions
+
+- (instancetype)initWithDict:(NSDictionary *)dict {
+	self = [super init];
+
+	[self mergeWith:dict];
+	
+	return self;
+}
+
+- (void)mergeWith:(NSDictionary *)otherOptions {
+	self.push = otherOptions[@"push"] ? [[RNNScreenTransition alloc] initWithDict:otherOptions[@"push"]] : _push;
+	self.pop = otherOptions[@"pop"] ? [[RNNScreenTransition alloc] initWithDict:otherOptions[@"pop"]] : _pop;
+	self.showModal = otherOptions[@"showModal"] ? [[RNNScreenTransition alloc] initWithDict:otherOptions[@"showModal"]] : _showModal;
+	self.dismissModal = otherOptions[@"dismissModal"] ? [[RNNScreenTransition alloc] initWithDict:otherOptions[@"dismissModal"]] : _dismissModal;
+}
+
+@end

lib/ios/ReactNativeNavigation.xcodeproj/project.pbxproj

@@ -67,6 +67,12 @@
 		5032774F2015E86D00ECD75D /* RNNNavigationEvent.m in Sources */ = {isa = PBXBuildFile; fileRef = 5032774D2015E86D00ECD75D /* RNNNavigationEvent.m */; };
 		503277602016302900ECD75D /* RNNComponentLifecycleEvent.h in Headers */ = {isa = PBXBuildFile; fileRef = 5032775E2016302900ECD75D /* RNNComponentLifecycleEvent.h */; };
 		503277612016302900ECD75D /* RNNComponentLifecycleEvent.m in Sources */ = {isa = PBXBuildFile; fileRef = 5032775F2016302900ECD75D /* RNNComponentLifecycleEvent.m */; };
+		50415CBA20553B8E00BB682E /* RNNScreenTransition.h in Headers */ = {isa = PBXBuildFile; fileRef = 50415CB820553B8E00BB682E /* RNNScreenTransition.h */; };
+		50415CBB20553B8E00BB682E /* RNNScreenTransition.m in Sources */ = {isa = PBXBuildFile; fileRef = 50415CB920553B8E00BB682E /* RNNScreenTransition.m */; };
+		50451D052042DAEB00695F00 /* RNNPushAnimation.h in Headers */ = {isa = PBXBuildFile; fileRef = 50451D032042DAEB00695F00 /* RNNPushAnimation.h */; };
+		50451D062042DAEB00695F00 /* RNNPushAnimation.m in Sources */ = {isa = PBXBuildFile; fileRef = 50451D042042DAEB00695F00 /* RNNPushAnimation.m */; };
+		50451D092042E20600695F00 /* RNNTransitionsOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 50451D072042E20600695F00 /* RNNTransitionsOptions.h */; };
+		50451D0A2042E20600695F00 /* RNNTransitionsOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 50451D082042E20600695F00 /* RNNTransitionsOptions.m */; };
 		50451D0D2042F70900695F00 /* RNNTransition.h in Headers */ = {isa = PBXBuildFile; fileRef = 50451D0B2042F70900695F00 /* RNNTransition.h */; };
 		50451D0E2042F70900695F00 /* RNNTransition.m in Sources */ = {isa = PBXBuildFile; fileRef = 50451D0C2042F70900695F00 /* RNNTransition.m */; };
 		504AFE641FFE53070076E904 /* RNNOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 504AFE621FFE53070076E904 /* RNNOptions.h */; };
@@ -75,6 +81,8 @@
 		504AFE751FFFF0540076E904 /* RNNTopTabsOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 504AFE731FFFF0540076E904 /* RNNTopTabsOptions.m */; };
 		504AFE761FFFF1E00076E904 /* RNNNavigationOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = E83BAD691F27362500A9F3DD /* RNNNavigationOptions.h */; };
 		504AFE771FFFF1E20076E904 /* RNNTopBarOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = A7626BFE1FC2FB6700492FB8 /* RNNTopBarOptions.h */; };
+		50762D08205E96C200E3D18A /* RNNModalAnimation.h in Headers */ = {isa = PBXBuildFile; fileRef = 50762D06205E96C200E3D18A /* RNNModalAnimation.h */; };
+		50762D09205E96C200E3D18A /* RNNModalAnimation.m in Sources */ = {isa = PBXBuildFile; fileRef = 50762D07205E96C200E3D18A /* RNNModalAnimation.m */; };
 		507E7D57201DDD3000444E6C /* RNNAnimationOptions.h in Headers */ = {isa = PBXBuildFile; fileRef = 507E7D55201DDD3000444E6C /* RNNAnimationOptions.h */; };
 		507E7D58201DDD3000444E6C /* RNNAnimationOptions.m in Sources */ = {isa = PBXBuildFile; fileRef = 507E7D56201DDD3000444E6C /* RNNAnimationOptions.m */; };
 		507F43C51FF4F17C00D9425B /* RNNTopTabsViewController.h in Headers */ = {isa = PBXBuildFile; fileRef = 507F43C31FF4F17C00D9425B /* RNNTopTabsViewController.h */; };
@@ -248,12 +256,20 @@
 		5032774D2015E86D00ECD75D /* RNNNavigationEvent.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNNavigationEvent.m; sourceTree = "<group>"; };
 		5032775E2016302900ECD75D /* RNNComponentLifecycleEvent.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNComponentLifecycleEvent.h; sourceTree = "<group>"; };
 		5032775F2016302900ECD75D /* RNNComponentLifecycleEvent.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNComponentLifecycleEvent.m; sourceTree = "<group>"; };
+		50415CB820553B8E00BB682E /* RNNScreenTransition.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNScreenTransition.h; sourceTree = "<group>"; };
+		50415CB920553B8E00BB682E /* RNNScreenTransition.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNScreenTransition.m; sourceTree = "<group>"; };
+		50451D032042DAEB00695F00 /* RNNPushAnimation.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNPushAnimation.h; sourceTree = "<group>"; };
+		50451D042042DAEB00695F00 /* RNNPushAnimation.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNPushAnimation.m; sourceTree = "<group>"; };
+		50451D072042E20600695F00 /* RNNTransitionsOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTransitionsOptions.h; sourceTree = "<group>"; };
+		50451D082042E20600695F00 /* RNNTransitionsOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTransitionsOptions.m; sourceTree = "<group>"; };
 		50451D0B2042F70900695F00 /* RNNTransition.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTransition.h; sourceTree = "<group>"; };
 		50451D0C2042F70900695F00 /* RNNTransition.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTransition.m; sourceTree = "<group>"; };
 		504AFE621FFE53070076E904 /* RNNOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNOptions.h; sourceTree = "<group>"; };
 		504AFE631FFE53070076E904 /* RNNOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNOptions.m; sourceTree = "<group>"; };
 		504AFE721FFFF0540076E904 /* RNNTopTabsOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTopTabsOptions.h; sourceTree = "<group>"; };
 		504AFE731FFFF0540076E904 /* RNNTopTabsOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNTopTabsOptions.m; sourceTree = "<group>"; };
+		50762D06205E96C200E3D18A /* RNNModalAnimation.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNModalAnimation.h; sourceTree = "<group>"; };
+		50762D07205E96C200E3D18A /* RNNModalAnimation.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNModalAnimation.m; sourceTree = "<group>"; };
 		507E7D55201DDD3000444E6C /* RNNAnimationOptions.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNAnimationOptions.h; sourceTree = "<group>"; };
 		507E7D56201DDD3000444E6C /* RNNAnimationOptions.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = RNNAnimationOptions.m; sourceTree = "<group>"; };
 		507F43C31FF4F17C00D9425B /* RNNTopTabsViewController.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = RNNTopTabsViewController.h; sourceTree = "<group>"; };
@@ -483,6 +499,12 @@
 				50A00C36200F84D6000F01A6 /* RNNOverlayOptions.m */,
 				507E7D55201DDD3000444E6C /* RNNAnimationOptions.h */,
 				507E7D56201DDD3000444E6C /* RNNAnimationOptions.m */,
+				E8E5182C1F83A48B000467AC /* RNNTransitionStateHolder.h */,
+				E8E5182D1F83A48B000467AC /* RNNTransitionStateHolder.m */,
+				50451D072042E20600695F00 /* RNNTransitionsOptions.h */,
+				50451D082042E20600695F00 /* RNNTransitionsOptions.m */,
+				50415CB820553B8E00BB682E /* RNNScreenTransition.h */,
+				50415CB920553B8E00BB682E /* RNNScreenTransition.m */,
 			);
 			name = Options;
 			sourceTree = "<group>";
@@ -652,14 +674,16 @@
 				E8A5CD511F464F0400E89D0D /* RNNAnimator.m */,
 				E8AEDB481F5C0BAF000F5A6A /* RNNInteractivePopAnimator.h */,
 				E8AEDB491F5C0BAF000F5A6A /* RNNInteractivePopAnimator.m */,
-				E8E5182C1F83A48B000467AC /* RNNTransitionStateHolder.h */,
-				E8E5182D1F83A48B000467AC /* RNNTransitionStateHolder.m */,
 				50451D0B2042F70900695F00 /* RNNTransition.h */,
 				50451D0C2042F70900695F00 /* RNNTransition.m */,
 				E8E518341F83B94A000467AC /* RNNViewLocation.h */,
 				E8E518351F83B94A000467AC /* RNNViewLocation.m */,
 				E8DA243E1F97459B00CD552B /* RNNElementFinder.h */,
 				E8DA243F1F97459B00CD552B /* RNNElementFinder.m */,
+				50451D032042DAEB00695F00 /* RNNPushAnimation.h */,
+				50451D042042DAEB00695F00 /* RNNPushAnimation.m */,
+				50762D06205E96C200E3D18A /* RNNModalAnimation.h */,
+				50762D07205E96C200E3D18A /* RNNModalAnimation.m */,
 			);
 			name = Animations;
 			sourceTree = "<group>";
@@ -707,9 +731,11 @@
 				50CB3B691FDE911400AA153B /* RNNSideMenuOptions.h in Headers */,
 				263905BD1E4C6F440023D7D3 /* RCCDrawerProtocol.h in Headers */,
 				5016E8EF20209690009D4F7C /* RNNCustomTitleView.h in Headers */,
+				50415CBA20553B8E00BB682E /* RNNScreenTransition.h in Headers */,
 				263905C21E4C6F440023D7D3 /* SidebarAnimation.h in Headers */,
 				E8E518361F83B94A000467AC /* RNNViewLocation.h in Headers */,
 				263905B51E4C6F440023D7D3 /* MMExampleDrawerVisualStateManager.h in Headers */,
+				50451D052042DAEB00695F00 /* RNNPushAnimation.h in Headers */,
 				507F43C51FF4F17C00D9425B /* RNNTopTabsViewController.h in Headers */,
 				263905C61E4C6F440023D7D3 /* SidebarFeedlyAnimation.h in Headers */,
 				7B1126A31E2D2B6C00F9B03B /* RNNSplashScreen.h in Headers */,
@@ -734,11 +760,13 @@
 				E8E518321F83B3E0000467AC /* RNNUtils.h in Headers */,
 				507F44201FFA8A8800D9425B /* RNNRootViewProtocol.h in Headers */,
 				263905CA1E4C6F440023D7D3 /* SidebarLuvocracyAnimation.h in Headers */,
+				50762D08205E96C200E3D18A /* RNNModalAnimation.h in Headers */,
 				390AD477200F499D00A8250D /* RNNSwizzles.h in Headers */,
 				263905B11E4C6F440023D7D3 /* MMDrawerController.h in Headers */,
 				504AFE641FFE53070076E904 /* RNNOptions.h in Headers */,
 				263905B91E4C6F440023D7D3 /* RCCDrawerController.h in Headers */,
 				263905B31E4C6F440023D7D3 /* MMDrawerVisualState.h in Headers */,
+				50451D092042E20600695F00 /* RNNTransitionsOptions.h in Headers */,
 				E8A5CD621F49114F00E89D0D /* RNNElement.h in Headers */,
 				504AFE741FFFF0540076E904 /* RNNTopTabsOptions.h in Headers */,
 				E8E5182E1F83A48B000467AC /* RNNTransitionStateHolder.h in Headers */,
@@ -867,6 +895,7 @@
 				263905C51E4C6F440023D7D3 /* SidebarFacebookAnimation.m in Sources */,
 				50451D0E2042F70900695F00 /* RNNTransition.m in Sources */,
 				7BEF0D191E437684003E96B0 /* RNNRootViewController.m in Sources */,
+				50415CBB20553B8E00BB682E /* RNNScreenTransition.m in Sources */,
 				263905C31E4C6F440023D7D3 /* SidebarAnimation.m in Sources */,
 				E8A5CD531F464F0400E89D0D /* RNNAnimator.m in Sources */,
 				50CB3B6A1FDE911400AA153B /* RNNSideMenuOptions.m in Sources */,
@@ -908,8 +937,10 @@
 				263905CF1E4C6F440023D7D3 /* TheSidebarController.m in Sources */,
 				E8A430121F9CB87B00B61A20 /* RNNAnimatedView.m in Sources */,
 				507F43F51FF4FCFE00D9425B /* HMSegmentedControl.m in Sources */,
+				50451D0A2042E20600695F00 /* RNNTransitionsOptions.m in Sources */,
 				507F43C61FF4F17C00D9425B /* RNNTopTabsViewController.m in Sources */,
 				50A00C38200F84D6000F01A6 /* RNNOverlayOptions.m in Sources */,
+				50762D09205E96C200E3D18A /* RNNModalAnimation.m in Sources */,
 				50EB93421FE14A3E00BD8EEE /* RNNBottomTabOptions.m in Sources */,
 				E8367B811F7A8A4700675C05 /* VICMAImageView.m in Sources */,
 				A7626C011FC5796200492FB8 /* RNNBottomTabsOptions.m in Sources */,
@@ -923,6 +954,7 @@
 				E8E5182F1F83A48B000467AC /* RNNTransitionStateHolder.m in Sources */,
 				263905B61E4C6F440023D7D3 /* MMExampleDrawerVisualStateManager.m in Sources */,
 				E8E518331F83B3E0000467AC /* RNNUtils.m in Sources */,
+				50451D062042DAEB00695F00 /* RNNPushAnimation.m in Sources */,
 				50F5DFC61F407AA0001A00BC /* RNNNavigationController.m in Sources */,
 				21B85E5D1F44480200B314B5 /* RNNNavigationButtons.m in Sources */,
 				E8E518371F83B94A000467AC /* RNNViewLocation.m in Sources */,

lib/src/commands/Commands.ts

@@ -21,13 +21,13 @@ export class Commands {
 
   setDefaultOptions(options) {
     const input = _.cloneDeep(options);
-    OptionsProcessor.processOptions(input);
+    OptionsProcessor.processOptions(input, this.layoutTreeCrawler.store);
     this.nativeCommandsSender.setDefaultOptions(input);
   }
 
   setOptions(componentId, options) {
     const input = _.cloneDeep(options);
-    OptionsProcessor.processOptions(input);
+    OptionsProcessor.processOptions(input, this.layoutTreeCrawler.store);
     this.nativeCommandsSender.setOptions(componentId, input);
   }
 
@@ -48,7 +48,7 @@ export class Commands {
 
   push(onComponentId, componentData) {
     const input = _.cloneDeep(componentData);
-    OptionsProcessor.processOptions(input);
+    OptionsProcessor.processOptions(input, this.layoutTreeCrawler.store);
     const layout = this.layoutTreeParser.parse(input);
     this.layoutTreeCrawler.crawl(layout);
     return this.nativeCommandsSender.push(onComponentId, layout);
@@ -68,7 +68,7 @@ export class Commands {
 
   showOverlay(componentData) {
     const input = _.cloneDeep(componentData);
-    OptionsProcessor.processOptions(input);
+    OptionsProcessor.processOptions(input, this.layoutTreeCrawler.store);
 
     const layout = this.layoutTreeParser.parse(input);
     this.layoutTreeCrawler.crawl(layout);

lib/src/commands/LayoutTreeCrawler.ts

@@ -17,7 +17,7 @@ export interface LayoutNode {
 export class LayoutTreeCrawler {
   constructor(
     private readonly uniqueIdProvider: any,
-    private readonly store: any) {
+    public readonly store: any) {
     this.crawl = this.crawl.bind(this);
   }
 
@@ -29,7 +29,7 @@ export class LayoutTreeCrawler {
     if (node.type === LayoutType.Component) {
       this._handleComponent(node);
     }
-    OptionsProcessor.processOptions(node.data.options);
+    OptionsProcessor.processOptions(node.data.options, this.store);
     _.forEach(node.children, this.crawl);
   }
 

lib/src/commands/OptionsProcessor.test.ts

@@ -1,56 +1,58 @@
 import { OptionsProcessor } from './OptionsProcessor';
+import { Store } from '../components/Store.mock';
 
 describe('navigation options', () => {
   let options;
-
+  let store;
   beforeEach(() => {
     options = {};
+    store = new Store();
   });
 
   it('processes colors into numeric AARRGGBB', () => {
     options.someKeyColor = 'red';
     options.color = 'blue';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.someKeyColor).toEqual(0xffff0000);
     expect(options.color).toEqual(0xff0000ff);
 
     options.someKeyColor = 'yellow';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.someKeyColor).toEqual(0xffffff00);
   });
 
   it('processes numeric colors', () => {
     options.someKeyColor = '#123456';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.someKeyColor).toEqual(0xff123456);
 
     options.someKeyColor = 0x123456ff; // wut
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.someKeyColor).toEqual(0xff123456);
   });
 
   it('process colors with rgb functions', () => {
     options.someKeyColor = 'rgb(255, 0, 255)';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.someKeyColor).toEqual(0xffff00ff);
   });
 
   it('process colors with special words', () => {
     options.someKeyColor = 'fuchsia';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.someKeyColor).toEqual(0xffff00ff);
   });
 
   it('process colors with hsla functions', () => {
     options.someKeyColor = 'hsla(360, 100%, 100%, 1.0)';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
 
     expect(options.someKeyColor).toEqual(0xffffffff);
   });
 
   it('unknown colors return undefined', () => {
     options.someKeyColor = 'wut';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.someKeyColor).toEqual(undefined);
   });
 
@@ -58,7 +60,7 @@ describe('navigation options', () => {
     options.otherKeyColor = 'red';
     options.yetAnotherColor = 'blue';
     options.andAnotherColor = 'rgb(0, 255, 0)';
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.otherKeyColor).toEqual(0xffff0000);
     expect(options.yetAnotherColor).toEqual(0xff0000ff);
     expect(options.andAnotherColor).toEqual(0xff00ff00);
@@ -66,14 +68,14 @@ describe('navigation options', () => {
 
   it('keys ending with Color case sensitive', () => {
     options.otherKey_color = 'red'; // eslint-disable-line camelcase
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.otherKey_color).toEqual('red');
   });
 
   it('any nested recursive keys ending with Color', () => {
     options.topBar = { textColor: 'red' };
     options.topBar.innerMostObj = { anotherColor: 'yellow' };
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
     expect(options.topBar.textColor).toEqual(0xffff0000);
     expect(options.topBar.innerMostObj.anotherColor).toEqual(0xffffff00);
   });
@@ -86,7 +88,7 @@ describe('navigation options', () => {
       myIcon: 'require("https://wix.github.io/react-native-navigation/_images/logo.png");',
       myOtherValue: 'value'
     };
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
 
     // As we can't import external images and we don't want to add an image here
     // I assign the icons to strings (what the require would generally look like)
@@ -98,19 +100,28 @@ describe('navigation options', () => {
     expect(options.topBar.myOtherValue).toEqual('value');
   });
 
+  it('register props for button options', () => {
+    const passProps = { prop: 'prop' };
+    options.rightButtons = [{ passProps, id: '1' }];
+
+    OptionsProcessor.processOptions({ o: options }, store);
+
+    expect(store.setPropsForComponentId).toBeCalledWith('1', passProps);
+  });
+
   it('processes Options object', () => {
     options.someKeyColor = 'rgb(255, 0, 255)';
     options.topBar = { textColor: 'red' };
     options.topBar.innerMostObj = { anotherColor: 'yellow' };
 
-    OptionsProcessor.processOptions({ o: options });
+    OptionsProcessor.processOptions({ o: options }, store);
 
     expect(options.topBar.textColor).toEqual(0xffff0000);
   });
 
   it('undefined value return undefined ', () => {
     options.someImage = undefined;
-    OptionsProcessor.processOptions(options);
+    OptionsProcessor.processOptions(options, store);
 
     expect(options.someImage).toEqual(undefined);
   });

lib/src/commands/OptionsProcessor.ts

@@ -3,7 +3,7 @@ import { processColor } from 'react-native';
 import * as resolveAssetSource from 'react-native/Libraries/Image/resolveAssetSource';
 
 export class OptionsProcessor {
-  static processOptions(options) {
+  static processOptions(options, store) {
     _.forEach(options, (value, key) => {
       if (!value) { return; }
 
@@ -14,7 +14,16 @@ export class OptionsProcessor {
         options[key] = resolveAssetSource(options[key]);
       }
       if (_.isObject(value) || _.isArray(value)) {
-        OptionsProcessor.processOptions(value);
+        OptionsProcessor.processOptions(value, store);
+        OptionsProcessor.processArrayOptions(key, value, store);
+      }
+    });
+  }
+
+  static processArrayOptions(key, array, store) {
+    _.forEach(array, (value) => {
+      if (_.endsWith(key, 'Buttons') && value.passProps) {
+        store.setPropsForComponentId(value.id, value.passProps);
       }
     });
   }

lib/src/components/Store.mock.ts

@@ -0,0 +1 @@
+export const { Store } = jest.genMockFromModule('./Store');