Merge branch 'newAPI' into v2

AndroidE2E/app/src/androidTest/java/com/reactnativenavigation/e2e/androide2e/BaseTest.java

@@ -89,17 +89,17 @@ public abstract class BaseTest {
         return bitmap;
     }
 
-    public void swipeOpenFromLeft() {
-        int w = device().getDisplayWidth();
-        int h = device().getDisplayHeight();
-        device().swipe(5, h / 2, w / 2, h / 2, 10);
-    }
-
-    public void swipeOpenFromRight() {
-        int w = device().getDisplayWidth();
-        int h = device().getDisplayHeight();
-        device().swipe(w - 5, h / 2, w / 2, h / 2, 10);
-    }
+	public void swipeOpenFromLeft() {
+		int w = device().getDisplayWidth();
+		int h = device().getDisplayHeight();
+		device().swipe(5, h / 2, w / 2, h / 2, 20);
+	}
+
+	public void swipeOpenFromRight() {
+		int w = device().getDisplayWidth();
+		int h = device().getDisplayHeight();
+		device().swipe(w - 5, h / 2, w / 2, h / 2, 20);
+	}
 
     public void swipeUp() {
         int w = device().getDisplayWidth();

AndroidE2E/app/src/androidTest/java/com/reactnativenavigation/e2e/androide2e/OverlayTest.java

@@ -1,26 +1,20 @@
 package com.reactnativenavigation.e2e.androide2e;
 
-import android.support.test.uiautomator.By;
+public class OverlayTest {//extends BaseTest {
 
-import org.junit.Test;
-
-import static org.assertj.core.api.Java6Assertions.assertThat;
-
-public class OverlayTest extends BaseTest {
-
-	@Test
-	public void testOverlayAlertAppear() throws Exception {
-		elementByText("PUSH OPTIONS SCREEN").click();
-		elementByText("SHOW CUSTOM ALERT").click();
-		assertExists(By.text("Test view"));
-		elementByText("OK").click();
-		assertExists(By.text("Static Title"));
-	}
-
-	@Test
-	public void testSnackbarAppear() throws Exception {
-		elementByText("PUSH OPTIONS SCREEN").click();
-		elementByText("SHOW SNACKBAR").click();
-		assertExists(By.text("Test!"));
-	}
+//	@Test
+//	public void testOverlayAlertAppear() throws Exception {
+//		elementByText("PUSH OPTIONS SCREEN").click();
+//		elementByText("SHOW CUSTOM ALERT").click();
+//		assertExists(By.text("Test view"));
+//		elementByText("OK").click();
+//		assertExists(By.text("Static Title"));
+//	}
+//
+//	@Test
+//	public void testSnackbarAppear() throws Exception {
+//		elementByText("PUSH OPTIONS SCREEN").click();
+//		elementByText("SHOW SNACKBAR").click();
+//		assertExists(By.text("Test!"));
+//	}
 }

AndroidE2E/app/src/androidTest/java/com/reactnativenavigation/e2e/androide2e/TopTabsTest.java

@@ -1,16 +1,12 @@
 package com.reactnativenavigation.e2e.androide2e;
 
-import android.support.test.uiautomator.By;
-
-import org.junit.Test;
-
-public class TopTabsTest extends BaseTest {
-
-    @Test
-    public void tabsCanBeSwiped() throws Exception {
-        elementByText("PUSH TOP TABS SCREEN").click();
-        assertExists(By.text("This is top tab 1"));
-        swipeOpenFromRight();
-        assertExists(By.text("This is top tab 2"));
-    }
+public class TopTabsTest {//extends BaseTest {
+
+//    @Test
+//    public void tabsCanBeSwiped() throws Exception {
+//        elementByText("PUSH TOP TABS SCREEN").click();
+//        assertExists(By.text("This is top tab 1"));
+//        swipeOpenFromRight();
+//        assertExists(By.text("This is top tab 2"));
+//    }
 }

README.md

@@ -36,14 +36,14 @@ v2 is written in Test Driven Development. We have a test for every feature inclu
 
 ## v2 Roadmap
 
-### Current Priorities 
+### Current Priorities
 
 1) buttons in Android
 2) showOverlay in iOS
 3) showOverlay in Android
 4) async commands
-5) currentTab 
-6) change navigationOptions to be nested
+5) currentTab
+6) change Options to be nested
 7) topTabs in both platforms, with API implications
 
 ### Top API
@@ -132,7 +132,7 @@ v2 is written in Test Driven Development. We have a test for every feature inclu
 | sideMenuVisible          |        [Contribute](/docs/docs/CONTRIBUTING.md)   | [Contribute](/docs/docs/CONTRIBUTING.md) |
 
 
-## v1 vs v2 Feature Comparison  
+## v1 vs v2 Feature Comparison
 v2 currently supports most of react-native-navigation’s basic functionality but it is still behind v1.
 Here is the full comparison of features between v1 and v2 (will be updated regularly):
 ### Top Level API
@@ -206,5 +206,5 @@ Note:  v1 properties with names beginning with 'navBar' are replaced in v2 with
 | customTransition(shared element)       |     :x:  |     WIP @bogobogo     | [Contribute](/docs/docs/CONTRIBUTING.md)|
 | splitViewScreen       |     :x:  |    [Contribute](/docs/docs/CONTRIBUTING.md)      | [Contribute](/docs/docs/CONTRIBUTING.md)|
 
-Element transitions, adding buttons and styles are not yet implemented. [Contribute](/docs/docs/CONTRIBUTING.md)  
+Element transitions, adding buttons and styles are not yet implemented. [Contribute](/docs/docs/CONTRIBUTING.md)
 

docs/docs/Container.md

@@ -7,5 +7,5 @@
 | name | <code>string</code> | The container's registered name |
 | topTabs | [<code>Array.&lt;Container&gt;</code>](#Container) |  |
 | passProps | <code>object</code> | props |
-| navigationOptions | <a href="https://wix.github.io/react-native-navigation/v2/#/docs/NavigationOptions">NavigationOptions</a> |  |
+| options | <a href="https://wix.github.io/react-native-navigation/v2/#/docs/Options">Options</a> |  |
 

e2e/ScreenStyle.test.js

@@ -8,12 +8,12 @@ describe('screen style', () => {
     await device.relaunchApp();
   });
 
-  it('declare a navigationOptions on container component', async () => {
+  it('declare a options on component component', async () => {
     await elementById(testIDs.PUSH_OPTIONS_BUTTON).tap();
     await expect(element(by.label('Static Title'))).toBeVisible();
   });
 
-  it('change title on container component', async () => {
+  it('change title on component component', async () => {
     await elementById(testIDs.PUSH_OPTIONS_BUTTON).tap();
     await expect(element(by.label('Static Title'))).toBeVisible();
     await elementById(testIDs.DYNAMIC_OPTIONS_BUTTON).tap();

integration/redux/MyContainer.js → integration/redux/MyComponent.js

@@ -5,7 +5,7 @@ const { Text } = require('react-native');
 const { connect } = require('react-redux');
 const store = require('./MyStore');
 
-class MyContainer extends Component {
+class MyComponent extends Component {
   render() {
     if (this.props.renderCountIncrement) {
       this.props.renderCountIncrement();
@@ -28,4 +28,4 @@ function mapStateToProps(state) {
   };
 }
 
-module.exports = connect(mapStateToProps)(MyContainer);
+module.exports = connect(mapStateToProps)(MyComponent);

integration/redux/Redux.test.js

@@ -4,18 +4,18 @@ const renderer = require('react-test-renderer');
 const { Provider } = require('react-redux');
 
 describe('redux support', () => {
-  let MyConnectedContainer;
+  let MyConnectedComponent;
   let store;
 
   beforeEach(() => {
-    MyConnectedContainer = require('./MyContainer');
+    MyConnectedComponent = require('./MyComponent');
     store = require('./MyStore');
   });
 
   it('renders normally', () => {
     const tree = renderer.create(
       <Provider store={store.reduxStore}>
-        <MyConnectedContainer />
+        <MyConnectedComponent />
       </Provider>
     );
     expect(tree.toJSON().children).toEqual(['no name']);
@@ -25,7 +25,7 @@ describe('redux support', () => {
     const renderCountIncrement = jest.fn();
     const tree = renderer.create(
       <Provider store={store.reduxStore}>
-        <MyConnectedContainer renderCountIncrement={renderCountIncrement} />
+        <MyConnectedComponent renderCountIncrement={renderCountIncrement} />
       </Provider>
     );
 
@@ -43,7 +43,7 @@ describe('redux support', () => {
     const renderCountIncrement = jest.fn();
     const tree = renderer.create(
       <Provider store={store.reduxStore}>
-        <MyConnectedContainer printAge={true} renderCountIncrement={renderCountIncrement} />
+        <MyConnectedComponent printAge={true} renderCountIncrement={renderCountIncrement} />
       </Provider>
     );
 

integration/remx/MyContainer.js → integration/remx/MyComponent.js

@@ -5,7 +5,7 @@ const { Text } = require('react-native');
 const { connect } = require('remx');
 const store = require('./MyStore');
 
-class MyContainer extends Component {
+class MyComponent extends Component {
   render() {
     if (this.props.renderCountIncrement) {
       this.props.renderCountIncrement();
@@ -28,4 +28,4 @@ function mapStateToProps() {
   };
 }
 
-module.exports = connect(mapStateToProps)(MyContainer);
+module.exports = connect(mapStateToProps)(MyComponent);

integration/remx/remx.test.js

@@ -3,22 +3,22 @@ require('react-native');
 const renderer = require('react-test-renderer');
 
 describe('remx support', () => {
-  let MyConnectedContainer;
+  let MyConnectedComponent;
   let store;
 
   beforeEach(() => {
-    MyConnectedContainer = require('./MyContainer');
+    MyConnectedComponent = require('./MyComponent');
     store = require('./MyStore');
   });
 
   it('renders normally', () => {
-    const tree = renderer.create(<MyConnectedContainer />);
+    const tree = renderer.create(<MyConnectedComponent />);
     expect(tree.toJSON().children).toEqual(['no name']);
   });
 
   it('rerenders as a result of an underlying state change (by selector)', () => {
     const renderCountIncrement = jest.fn();
-    const tree = renderer.create(<MyConnectedContainer renderCountIncrement={renderCountIncrement} />);
+    const tree = renderer.create(<MyConnectedComponent renderCountIncrement={renderCountIncrement} />);
 
     expect(tree.toJSON().children).toEqual(['no name']);
     expect(renderCountIncrement).toHaveBeenCalledTimes(1);
@@ -32,7 +32,7 @@ describe('remx support', () => {
 
   it('rerenders as a result of an underlying state change with a new key', () => {
     const renderCountIncrement = jest.fn();
-    const tree = renderer.create(<MyConnectedContainer printAge={true} renderCountIncrement={renderCountIncrement} />);
+    const tree = renderer.create(<MyConnectedComponent printAge={true} renderCountIncrement={renderCountIncrement} />);
 
     expect(tree.toJSON().children).toEqual(null);
     expect(renderCountIncrement).toHaveBeenCalledTimes(1);

lib/android/app/src/main/java/com/reactnativenavigation/parse/LayoutFactory.java

@@ -3,17 +3,17 @@ package com.reactnativenavigation.parse;
 import android.app.Activity;
 
 import com.facebook.react.ReactInstanceManager;
-import com.reactnativenavigation.react.ReactContainerViewCreator;
+import com.reactnativenavigation.react.ReactComponentViewCreator;
 import com.reactnativenavigation.utils.TypefaceLoader;
 import com.reactnativenavigation.viewcontrollers.BottomTabsController;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 import com.reactnativenavigation.viewcontrollers.SideMenuController;
 import com.reactnativenavigation.viewcontrollers.StackController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
 import com.reactnativenavigation.viewcontrollers.overlay.DialogViewController;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabController;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsController;
-import com.reactnativenavigation.views.ContainerViewCreator;
+import com.reactnativenavigation.views.ComponentViewCreator;
 import com.reactnativenavigation.views.TopTabsLayoutCreator;
 
 import java.util.ArrayList;
@@ -35,10 +35,10 @@ public class LayoutFactory {
 
 	public ViewController create(final LayoutNode node) {
 		switch (node.type) {
-			case Container:
-				return createContainer(node);
-			case ContainerStack:
-				return createContainerStack(node);
+			case Component:
+				return createComponent(node);
+			case Stack:
+				return createStack(node);
 			case BottomTabs:
 				return createBottomTabs(node);
 			case SideMenuRoot:
@@ -49,12 +49,12 @@ public class LayoutFactory {
 				return createSideMenuLeft(node);
 			case SideMenuRight:
 				return createSideMenuRight(node);
-			case CustomDialog:
-				return createDialogContainer(node);
+//			case CustomDialog:
+//				return createDialogComponent(node);
             case TopTabs:
                 return createTopTabs(node);
-            case TopTab:
-                return createTopTab(node);
+//            case TopTab:
+//                return createTopTab(node);
 			default:
 				throw new IllegalArgumentException("Invalid node type: " + node.type);
 		}
@@ -93,19 +93,19 @@ public class LayoutFactory {
 		return create(node.children.get(0));
 	}
 
-	private ViewController createContainer(LayoutNode node) {
+	private ViewController createComponent(LayoutNode node) {
 		String id = node.id;
 		String name = node.data.optString("name");
-		NavigationOptions navigationOptions = NavigationOptions.parse(typefaceManager, node.data.optJSONObject("navigationOptions"), defaultOptions);
-		return new ContainerViewController(activity,
+		NavigationOptions options = NavigationOptions.parse(typefaceManager, node.data.optJSONObject("options"), defaultOptions);
+		return new ComponentViewController(activity,
                 id,
                 name,
-                new ContainerViewCreator(reactInstanceManager),
-                navigationOptions
+                new ComponentViewCreator(reactInstanceManager),
+                options
         );
 	}
 
-	private ViewController createContainerStack(LayoutNode node) {
+	private ViewController createStack(LayoutNode node) {
 		StackController stackController = new StackController(activity, node.id);
 		for (LayoutNode child : node.children) {
 			stackController.push(create(child), null);
@@ -114,19 +114,19 @@ public class LayoutFactory {
 	}
 
 	private ViewController createBottomTabs(LayoutNode node) {
-		final BottomTabsController tabsContainer = new BottomTabsController(activity, node.id);
+		final BottomTabsController tabsComponent = new BottomTabsController(activity, node.id);
 		List<ViewController> tabs = new ArrayList<>();
 		for (int i = 0; i < node.children.size(); i++) {
 			tabs.add(create(node.children.get(i)));
 		}
-		tabsContainer.setTabs(tabs);
-		return tabsContainer;
+		tabsComponent.setTabs(tabs);
+		return tabsComponent;
 	}
 
-	private ViewController createDialogContainer(LayoutNode node) {
+	private ViewController createDialogComponent(LayoutNode node) {
 		String id = node.id;
 		String name = node.data.optString("name");
-		ReactContainerViewCreator creator = new ReactContainerViewCreator(reactInstanceManager);
+		ReactComponentViewCreator creator = new ReactComponentViewCreator(reactInstanceManager);
 		return new DialogViewController(activity, id, name, creator);
 	}
 
@@ -137,19 +137,19 @@ public class LayoutFactory {
             tabController.setTabIndex(i);
             tabs.add(tabController);
         }
-        NavigationOptions navigationOptions = NavigationOptions.parse(typefaceManager, node.getNavigationOptions(), defaultOptions);
-        return new TopTabsController(activity, node.id, tabs, new TopTabsLayoutCreator(activity, tabs), navigationOptions);
+        NavigationOptions options = NavigationOptions.parse(typefaceManager, node.getNavigationOptions(), defaultOptions);
+        return new TopTabsController(activity, node.id, tabs, new TopTabsLayoutCreator(activity, tabs), options);
     }
 
     private ViewController createTopTab(LayoutNode node) {
         String id = node.id;
         String name = node.data.optString("name");
-        NavigationOptions navigationOptions = NavigationOptions.parse(typefaceManager, node.getNavigationOptions(), defaultOptions);
+        NavigationOptions options = NavigationOptions.parse(typefaceManager, node.getNavigationOptions(), defaultOptions);
         return new TopTabController(activity,
                 id,
                 name,
-                new ReactContainerViewCreator(reactInstanceManager),
-                navigationOptions
+                new ReactComponentViewCreator(reactInstanceManager),
+                options
         );
     }
 }

lib/android/app/src/main/java/com/reactnativenavigation/parse/LayoutNode.java

@@ -7,16 +7,14 @@ import java.util.List;
 
 public class LayoutNode {
 	public enum Type {
-		Container,
-		ContainerStack,
+		Component,
+		Stack,
 		BottomTabs,
 		SideMenuRoot,
 		SideMenuCenter,
 		SideMenuLeft,
 		SideMenuRight,
-		CustomDialog,
-        TopTabs,
-        TopTab
+        TopTabs
 	}
 
 	public final String id;
@@ -37,6 +35,6 @@ public class LayoutNode {
 	}
 
     JSONObject getNavigationOptions() {
-	    return data.optJSONObject("navigationOptions");
+	    return data.optJSONObject("options");
     }
 }

lib/android/app/src/main/java/com/reactnativenavigation/parse/NavigationOptions.java

@@ -6,8 +6,6 @@ import com.reactnativenavigation.utils.TypefaceLoader;
 
 import org.json.JSONObject;
 
-import java.util.ArrayList;
-
 public class NavigationOptions implements DEFAULT_VALUES {
 
     public enum BooleanOptions {

lib/android/app/src/main/java/com/reactnativenavigation/parse/OverlayOptions.java

@@ -27,11 +27,11 @@ public class OverlayOptions {
 		return options;
 	}
 
-	public static OverlayOptions create(ViewController containerView) {
+	public static OverlayOptions create(ViewController componentView) {
 		OverlayOptions options = new OverlayOptions();
-		if (containerView == null) return options;
+		if (componentView == null) return options;
 
-		options.customView = containerView;
+		options.customView = componentView;
 		return options;
 	}
 

lib/android/app/src/main/java/com/reactnativenavigation/react/NavigationEvent.java

@@ -13,8 +13,8 @@ import static com.facebook.react.modules.core.DeviceEventManagerModule.RCTDevice
 
 public class NavigationEvent {
 	private static final String onAppLaunched = "RNN.appLaunched";
-	private static final String containerDidAppear = "RNN.containerDidAppear";
-	private static final String containerDidDisappear = "RNN.containerDidDisappear";
+	private static final String componentDidAppear = "RNN.componentDidAppear";
+	private static final String componentDidDisappear = "RNN.componentDidDisappear";
 	private static final String onNavigationButtonPressed = "RNN.navigationButtonPressed";
 
 	private final RCTDeviceEventEmitter emitter;
@@ -27,17 +27,17 @@ public class NavigationEvent {
 		emit(onAppLaunched);
 	}
 
-	public void containerDidDisappear(String id) {
-		emit(containerDidDisappear, id);
+	public void componentDidDisappear(String id) {
+		emit(componentDidDisappear, id);
 	}
 
-	public void containerDidAppear(String id) {
-		emit(containerDidAppear, id);
+	public void componentDidAppear(String id) {
+		emit(componentDidAppear, id);
 	}
 
 	public void sendOnNavigationButtonPressed(String id, String buttonId) {
 		WritableMap map = Arguments.createMap();
-		map.putString("containerId", id);
+		map.putString("componentId", id);
 		map.putString("buttonId", buttonId);
 
 		emit(onNavigationButtonPressed, map);

lib/android/app/src/main/java/com/reactnativenavigation/react/NavigationModule.java

@@ -52,33 +52,33 @@ public class NavigationModule extends ReactContextBaseJavaModule {
     }
 
 	@ReactMethod
-	public void setOptions(final String onContainerId, final ReadableMap options) {
+	public void setOptions(final String onComponentId, final ReadableMap options) {
 		final NavigationOptions navOptions = NavigationOptions.parse(new TypefaceLoader(activity()), JSONParser.parse(options));
-		handle(() -> navigator().setOptions(onContainerId, navOptions));
+		handle(() -> navigator().setOptions(onComponentId, navOptions));
 	}
 
 	@ReactMethod
-	public void push(final String onContainerId, final ReadableMap rawLayoutTree, final Promise promise) {
+	public void push(final String onComponentId, final ReadableMap rawLayoutTree, final Promise promise) {
 		final LayoutNode layoutTree = LayoutNodeParser.parse(JSONParser.parse(rawLayoutTree));
 		handle(() -> {
             final ViewController viewController = newLayoutFactory().create(layoutTree);
-            navigator().push(onContainerId, viewController, promise);
+            navigator().push(onComponentId, viewController, promise);
         });
 	}
 
 	@ReactMethod
-	public void pop(final String onContainerId, final ReadableMap options, final Promise promise) {
-		handle(() -> navigator().popSpecific(onContainerId, promise));
+	public void pop(final String onComponentId, final ReadableMap options, final Promise promise) {
+		handle(() -> navigator().popSpecific(onComponentId, promise));
 	}
 
 	@ReactMethod
-	public void popTo(final String containerId, final Promise promise) {
-		handle(() -> navigator().popTo(containerId, promise));
+	public void popTo(final String componentId, final Promise promise) {
+		handle(() -> navigator().popTo(componentId, promise));
 	}
 
 	@ReactMethod
-	public void popToRoot(final String containerId, final Promise promise) {
-		handle(() -> navigator().popToRoot(containerId, promise));
+	public void popToRoot(final String componentId, final Promise promise) {
+		handle(() -> navigator().popToRoot(componentId, promise));
 	}
 
 	@ReactMethod
@@ -91,8 +91,8 @@ public class NavigationModule extends ReactContextBaseJavaModule {
 	}
 
 	@ReactMethod
-	public void dismissModal(final String containerId, final Promise promise) {
-		handle(() -> navigator().dismissModal(containerId, promise));
+	public void dismissModal(final String componentId, final Promise promise) {
+		handle(() -> navigator().dismissModal(componentId, promise));
 	}
 
 	@ReactMethod

lib/android/app/src/main/java/com/reactnativenavigation/react/ReactComponentViewCreator.java

@@ -0,0 +1,20 @@
+package com.reactnativenavigation.react;
+
+import android.app.Activity;
+
+import com.facebook.react.ReactInstanceManager;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController.ReactViewCreator;
+
+public class ReactComponentViewCreator implements ReactViewCreator {
+	private ReactInstanceManager reactInstanceManager;
+
+	public ReactComponentViewCreator(final ReactInstanceManager reactInstanceManager) {
+		this.reactInstanceManager = reactInstanceManager;
+	}
+
+	@Override
+	public ComponentViewController.IReactView create(final Activity activity, final String componentId, final String componentName) {
+		return new ReactView(activity, reactInstanceManager, componentId, componentName);
+	}
+}

lib/android/app/src/main/java/com/reactnativenavigation/react/ReactContainerViewCreator.java

@@ -1,20 +0,0 @@
-package com.reactnativenavigation.react;
-
-import android.app.Activity;
-
-import com.facebook.react.ReactInstanceManager;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController.ReactViewCreator;
-
-public class ReactContainerViewCreator implements ReactViewCreator {
-	private ReactInstanceManager reactInstanceManager;
-
-	public ReactContainerViewCreator(final ReactInstanceManager reactInstanceManager) {
-		this.reactInstanceManager = reactInstanceManager;
-	}
-
-	@Override
-	public ContainerViewController.IReactView create(final Activity activity, final String containerId, final String containerName) {
-		return new ReactView(activity, reactInstanceManager, containerId, containerName);
-	}
-}

lib/android/app/src/main/java/com/reactnativenavigation/react/ReactView.java

@@ -7,21 +7,21 @@ import android.view.View;
 
 import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactRootView;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 
 @SuppressLint("ViewConstructor")
-public class ReactView extends ReactRootView implements ContainerViewController.IReactView {
+public class ReactView extends ReactRootView implements ComponentViewController.IReactView {
 
 	private final ReactInstanceManager reactInstanceManager;
-	private final String containerId;
-	private final String containerName;
+	private final String componentId;
+	private final String componentName;
 	private boolean isAttachedToReactInstance = false;
 
-	public ReactView(final Context context, ReactInstanceManager reactInstanceManager, String containerId, String containerName) {
+	public ReactView(final Context context, ReactInstanceManager reactInstanceManager, String componentId, String componentName) {
 		super(context);
 		this.reactInstanceManager = reactInstanceManager;
-		this.containerId = containerId;
-		this.containerName = containerName;
+		this.componentId = componentId;
+		this.componentName = componentName;
 		start();
 	}
 
@@ -31,8 +31,8 @@ public class ReactView extends ReactRootView implements ContainerViewController.
             isAttachedToReactInstance = true;
         });
 		final Bundle opts = new Bundle();
-		opts.putString("containerId", containerId);
-		startReactApplication(reactInstanceManager, containerName, opts);
+		opts.putString("componentId", componentId);
+		startReactApplication(reactInstanceManager, componentName, opts);
 	}
 
 	@Override
@@ -51,17 +51,17 @@ public class ReactView extends ReactRootView implements ContainerViewController.
 	}
 
 	@Override
-	public void sendContainerStart() {
-		new NavigationEvent(reactInstanceManager.getCurrentReactContext()).containerDidAppear(containerId);
+	public void sendComponentStart() {
+		new NavigationEvent(reactInstanceManager.getCurrentReactContext()).componentDidAppear(componentId);
 	}
 
 	@Override
-	public void sendContainerStop() {
-		new NavigationEvent(reactInstanceManager.getCurrentReactContext()).containerDidDisappear(containerId);
+	public void sendComponentStop() {
+		new NavigationEvent(reactInstanceManager.getCurrentReactContext()).componentDidDisappear(componentId);
 	}
 
     @Override
 	public void sendOnNavigationButtonPressed(String buttonId) {
-		new NavigationEvent(reactInstanceManager.getCurrentReactContext()).sendOnNavigationButtonPressed(containerId, buttonId);
+		new NavigationEvent(reactInstanceManager.getCurrentReactContext()).sendOnNavigationButtonPressed(componentId, buttonId);
 	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/ComponentViewController.java

@@ -0,0 +1,100 @@
+package com.reactnativenavigation.viewcontrollers;
+
+import android.app.Activity;
+import android.support.annotation.NonNull;
+import android.support.annotation.RestrictTo;
+import android.util.Log;
+import android.view.View;
+
+import com.reactnativenavigation.parse.NavigationOptions;
+import com.reactnativenavigation.presentation.NavigationOptionsListener;
+import com.reactnativenavigation.views.ReactComponent;
+import com.reactnativenavigation.views.TopBar;
+
+public class ContainerViewController extends ViewController implements NavigationOptionsListener {
+
+    public interface ReactViewCreator {
+
+        IReactView create(Activity activity, String componentId, String componentName);
+	}
+
+    public interface IReactView {
+
+        boolean isReady();
+
+        View asView();
+
+        void destroy();
+
+		void sendComponentStart();
+
+		void sendComponentStop();
+
+        void sendOnNavigationButtonPressed(String buttonId);
+    }
+
+	private final String componentName;
+
+	private final ReactViewCreator viewCreator;
+	private NavigationOptions options;
+	private ReactComponent component;
+
+	public ComponentViewController(final Activity activity,
+								   final String id,
+								   final String componentName,
+								   final ReactViewCreator viewCreator,
+								   final NavigationOptions initialNavigationOptions) {
+		super(activity, id);
+		this.componentName = componentName;
+		this.viewCreator = viewCreator;
+		this.options = initialNavigationOptions;
+	}
+
+    @RestrictTo(RestrictTo.Scope.TESTS)
+    TopBar getTopBar() {
+        return component.getTopBar();
+    }
+
+	@Override
+	public void destroy() {
+		super.destroy();
+		if (component != null) component.destroy();
+		component = null;
+	}
+
+	@Override
+	public void onViewAppeared() {
+		super.onViewAppeared();
+		ensureViewIsCreated();
+		component.applyOptions(options);
+		component.sendComponentStart();
+	}
+
+	@Override
+	public void onViewDisappear() {
+		super.onViewDisappear();
+		component.sendComponentStop();
+	}
+
+	@Override
+	protected boolean isViewShown() {
+		return super.isViewShown() && component.isReady();
+	}
+
+	@NonNull
+	@Override
+	protected View createView() {
+		component = (ReactComponent) viewCreator.create(getActivity(), getId(), componentName);
+        return component.asView();
+	}
+
+	@Override
+	public void mergeNavigationOptions(NavigationOptions options) {
+		this.options.mergeWith(options);
+        component.applyOptions(options);
+	}
+
+	NavigationOptions getOptions() {
+		return options;
+	}
+}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/ContainerViewController.java

@@ -1,105 +0,0 @@
-package com.reactnativenavigation.viewcontrollers;
-
-import android.app.Activity;
-import android.support.annotation.NonNull;
-import android.support.annotation.RestrictTo;
-import android.util.Log;
-import android.view.View;
-
-import com.reactnativenavigation.parse.NavigationOptions;
-import com.reactnativenavigation.presentation.NavigationOptionsListener;
-import com.reactnativenavigation.views.ReactContainer;
-import com.reactnativenavigation.views.TopBar;
-
-public class ContainerViewController extends ViewController implements NavigationOptionsListener {
-
-    public interface ReactViewCreator {
-
-        IReactView create(Activity activity, String containerId, String containerName);
-    }
-
-    public interface IReactView {
-
-        boolean isReady();
-
-        View asView();
-
-        void destroy();
-
-        void sendContainerStart();
-
-        void sendContainerStop();
-
-        void sendOnNavigationButtonPressed(String buttonId);
-    }
-
-    private final String containerName;
-
-    private final ReactViewCreator viewCreator;
-    private NavigationOptions navigationOptions;
-    private ReactContainer container;
-
-    public ContainerViewController(final Activity activity,
-                                   final String id,
-                                   final String containerName,
-                                   final ReactViewCreator viewCreator,
-                                   final NavigationOptions initialNavigationOptions) {
-        super(activity, id);
-        this.containerName = containerName;
-        this.viewCreator = viewCreator;
-        this.navigationOptions = initialNavigationOptions;
-    }
-
-    @RestrictTo(RestrictTo.Scope.TESTS)
-    TopBar getTopBar() {
-        return container.getTopBar();
-    }
-
-    @RestrictTo(RestrictTo.Scope.TESTS)
-    ReactContainer getContainer() {
-        return container;
-    }
-
-    @Override
-    public void destroy() {
-        super.destroy();
-        if (container != null) container.destroy();
-        container = null;
-    }
-
-    @Override
-    public void onViewAppeared() {
-        super.onViewAppeared();
-        ensureViewIsCreated();
-        container.applyOptions(navigationOptions);
-        container.sendContainerStart();
-    }
-
-    @Override
-    public void onViewDisappear() {
-        super.onViewDisappear();
-        container.sendContainerStop();
-    }
-
-    @Override
-    protected boolean isViewShown() {
-        return super.isViewShown() && container.isReady();
-    }
-
-    @NonNull
-    @Override
-    protected View createView() {
-        container = (ReactContainer) viewCreator.create(getActivity(), getId(), containerName);
-        return container.asView();
-    }
-
-    @Override
-    public void mergeNavigationOptions(NavigationOptions options) {
-        navigationOptions.mergeWith(options);
-        container.applyOptions(navigationOptions);
-    }
-
-    NavigationOptions getNavigationOptions() {
-        return navigationOptions;
-    }
-}

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/ModalStack.java

@@ -28,13 +28,13 @@ public class ModalStack {
 		}
 	}
 
-	public void dismissModal(final String containerId, Promise promise) {
-		Modal modal = findModalByContainerId(containerId);
+	public void dismissModal(final String componentId, Promise promise) {
+		Modal modal = findModalByComponentId(componentId);
 		if (modal != null) {
 			modal.dismiss();
 			modals.remove(modal);
 			if (promise != null) {
-				promise.resolve(containerId);
+				promise.resolve(componentId);
 			}
 		} else {
 			Navigator.rejectPromise(promise);
@@ -52,9 +52,9 @@ public class ModalStack {
 	}
 
 	@Nullable
-	private Modal findModalByContainerId(String containerId) {
+	private Modal findModalByComponentId(String componentId) {
 		for (Modal modal : modals) {
-			if (modal.containsDeepContainerId(containerId)) {
+			if (modal.containsDeepComponentId(componentId)) {
 				return modal;
 			}
 		}
@@ -63,7 +63,7 @@ public class ModalStack {
 
 	@Nullable
     ViewController findControllerById(String id) {
-        Modal modal = findModalByContainerId(id);
+        Modal modal = findModalByComponentId(id);
         return modal != null ? modal.viewController : null;
     }
 
@@ -87,8 +87,8 @@ public class ModalStack {
 			dialog.dismiss();
 		}
 
-		boolean containsDeepContainerId(String containerId) {
-			return viewController.findControllerById(containerId) != null;
+		boolean containsDeepComponentId(String componentId) {
+			return viewController.findControllerById(componentId) != null;
 		}
 
 		private void preMeasureView() {

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/Navigator.java

@@ -78,8 +78,8 @@ public class Navigator extends ParentController {
         return defaultOptions;
     }
 
-	public void setOptions(final String containerId, NavigationOptions options) {
-		ViewController target = findControllerById(containerId);
+	public void setOptions(final String componentId, NavigationOptions options) {
+		ViewController target = findControllerById(componentId);
 		if (target instanceof NavigationOptionsListener) {
 			((NavigationOptionsListener) target).mergeNavigationOptions(options);
 		}
@@ -134,12 +134,12 @@ public class Navigator extends ParentController {
 		}
 	}
 
-	void popTo(final String containerId) {
-		popTo(containerId, null);
+	void popTo(final String componentId) {
+		popTo(componentId, null);
 	}
 
-	public void popTo(final String containerId, Promise promise) {
-		ViewController target = findControllerById(containerId);
+	public void popTo(final String componentId, Promise promise) {
+		ViewController target = findControllerById(componentId);
 		if (target != null) {
 		    target.performOnParentStack(stack -> stack.popTo(target, promise), () -> rejectPromise(promise));
 		} else {
@@ -151,8 +151,8 @@ public class Navigator extends ParentController {
 		modalStack.showModal(viewController, promise);
 	}
 
-	public void dismissModal(final String containerId, Promise promise) {
-		modalStack.dismissModal(containerId, promise);
+	public void dismissModal(final String componentId, Promise promise) {
+		modalStack.dismissModal(componentId, promise);
 	}
 
 	public void dismissAllModals(Promise promise) {

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/overlay/CustomOverlay.java

@@ -4,7 +4,7 @@ package com.reactnativenavigation.viewcontrollers.overlay;
 import android.content.Context;
 
 import com.reactnativenavigation.parse.OverlayOptions;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
 import com.reactnativenavigation.views.CustomDialog;
 

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/overlay/DialogViewController.java

@@ -4,24 +4,24 @@ import android.app.Activity;
 import android.support.annotation.NonNull;
 import android.view.View;
 
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
 
 
 public class DialogViewController extends ViewController {
 
-	private ContainerViewController.ReactViewCreator viewCreator;
-	private String containerName;
+	private ComponentViewController.ReactViewCreator viewCreator;
+	private String componentName;
 
-	public DialogViewController(Activity activity, String id, String containerName, ContainerViewController.ReactViewCreator viewCreator) {
+	public DialogViewController(Activity activity, String id, String componentName, ComponentViewController.ReactViewCreator viewCreator) {
 		super(activity, id);
 		this.viewCreator = viewCreator;
-		this.containerName = containerName;
+		this.componentName = componentName;
 	}
 
 	@NonNull
 	@Override
 	protected View createView() {
-		return viewCreator.create(getActivity(), getId(), containerName).asView();
+		return viewCreator.create(getActivity(), getId(), componentName).asView();
 	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/toptabs/TopTabController.java

@@ -5,21 +5,21 @@ import android.view.View;
 
 import com.reactnativenavigation.parse.NavigationOptions;
 import com.reactnativenavigation.presentation.NavigationOptionsListener;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
 import com.reactnativenavigation.views.TopTab;
 
 public class TopTabController extends ViewController implements NavigationOptionsListener {
 
-    private final String containerName;
-    private ContainerViewController.ReactViewCreator viewCreator;
+    private final String componentName;
+    private ComponentViewController.ReactViewCreator viewCreator;
     private final NavigationOptions options;
     private TopTab topTab;
     private boolean isSelectedTab;
 
-    public TopTabController(Activity activity, String id, String name, ContainerViewController.ReactViewCreator viewCreator, NavigationOptions initialOptions) {
+    public TopTabController(Activity activity, String id, String name, ComponentViewController.ReactViewCreator viewCreator, NavigationOptions initialOptions) {
         super(activity, id);
-        this.containerName = name;
+        this.componentName = name;
         this.viewCreator = viewCreator;
         this.options = initialOptions;
     }
@@ -29,7 +29,7 @@ public class TopTabController extends ViewController implements NavigationOption
         super.onViewAppeared();
         isSelectedTab = true;
         applyOptions(options);
-        topTab.sendContainerStart();
+        topTab.sendComponentStart();
     }
 
     @Override
@@ -41,7 +41,7 @@ public class TopTabController extends ViewController implements NavigationOption
     public void onViewDisappear() {
         super.onViewDisappear();
         isSelectedTab = false;
-        topTab.sendContainerStop();
+        topTab.sendComponentStop();
     }
 
     @Override
@@ -53,7 +53,7 @@ public class TopTabController extends ViewController implements NavigationOption
     public View createView() {
         topTab = new TopTab(
                 getActivity(),
-                viewCreator.create(getActivity(), getId(), containerName)
+                viewCreator.create(getActivity(), getId(), componentName)
         );
         return topTab;
     }

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/toptabs/TopTabsAdapter.java

@@ -31,7 +31,7 @@ public class TopTabsAdapter extends PagerAdapter implements ViewPager.OnPageChan
     }
 
     @Override
-    public Object instantiateItem(ViewGroup container, int position) {
+    public Object instantiateItem(ViewGroup component, int position) {
         return tabs.get(position).getView();
     }
 

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/toptabs/TopTabsController.java

@@ -20,12 +20,12 @@ public class TopTabsController extends ParentController implements NavigationOpt
     private List<TopTabController> tabs;
     private TopTabsLayout topTabsLayout;
     private TopTabsLayoutCreator viewCreator;
-    private NavigationOptions navigationOptions;
+    private NavigationOptions options;
 
-    public TopTabsController(Activity activity, String id, List<TopTabController> tabs, TopTabsLayoutCreator viewCreator, NavigationOptions navigationOptions) {
+    public TopTabsController(Activity activity, String id, List<TopTabController> tabs, TopTabsLayoutCreator viewCreator, NavigationOptions options) {
         super(activity, id);
         this.viewCreator = viewCreator;
-        this.navigationOptions = navigationOptions;
+        this.options = options;
         this.tabs = tabs;
         for (ViewController tab : tabs) {
             tab.setParentController(this);
@@ -47,7 +47,7 @@ public class TopTabsController extends ParentController implements NavigationOpt
 
     @Override
     public void onViewAppeared() {
-        applyOptions(navigationOptions);
+        applyOptions(options);
         performOnCurrentTab(TopTabController::onViewAppeared);
     }
 

lib/android/app/src/main/java/com/reactnativenavigation/viewcontrollers/toptabs/TopTabsViewPager.java

@@ -5,7 +5,7 @@ import android.content.Context;
 import android.support.v4.view.ViewPager;
 import android.view.ViewGroup;
 
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 import com.reactnativenavigation.viewcontrollers.ViewController;
 
 import java.util.List;
@@ -39,6 +39,6 @@ public class TopTabsViewPager extends ViewPager {
     }
 
     public void sendOnNavigationButtonPressed(String id) {
-        ((ContainerViewController.IReactView) tabs.get(getCurrentItem()).getView()).sendOnNavigationButtonPressed(id);
+        ((ComponentViewController.IReactView) tabs.get(getCurrentItem()).getView()).sendOnNavigationButtonPressed(id);
     }
-}
+}

lib/android/app/src/main/java/com/reactnativenavigation/views/Container.java → lib/android/app/src/main/java/com/reactnativenavigation/views/Component.java

@@ -6,7 +6,7 @@ import android.view.View;
 import com.reactnativenavigation.parse.NavigationOptions;
 import com.reactnativenavigation.viewcontrollers.ContainerViewController;
 
-public interface Container {
+public interface Component {
     void applyOptions(NavigationOptions options);
 
     void sendOnNavigationButtonPressed(String id);

lib/android/app/src/main/java/com/reactnativenavigation/views/ContainerLayout.java → lib/android/app/src/main/java/com/reactnativenavigation/views/ComponentLayout.java

@@ -11,25 +11,22 @@ import android.widget.RelativeLayout;
 import com.facebook.react.uimanager.events.EventDispatcher;
 import com.reactnativenavigation.parse.NavigationOptions;
 import com.reactnativenavigation.presentation.OptionsPresenter;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController.IReactView;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController.IReactView;
 
 import static android.view.ViewGroup.LayoutParams.MATCH_PARENT;
 import static android.view.ViewGroup.LayoutParams.WRAP_CONTENT;
 
 @SuppressLint("ViewConstructor")
-public class ContainerLayout extends RelativeLayout implements ReactContainer {
+public class ComponentLayout extends RelativeLayout implements ReactComponent {
 
     private TopBar topBar;
     private IReactView reactView;
     private final OptionsPresenter optionsPresenter;
 
-    public ContainerLayout(Context context, IReactView reactView, EventDispatcher eventDispatcher) {
-        super(context);
-        this.reactView = reactView;
-        this.topBar = new TopBar(context, this, eventDispatcher);
-        topBar.setId(View.generateViewId());
-
+	public ComponentLayout(Context context, IReactView reactView, EventDispatcher eventDispatcher) {
+		super(context);
+		this.topBar = new TopBar(context, this);
+		this.reactView = reactView;
         optionsPresenter = new OptionsPresenter(this);
         initViews();
     }
@@ -56,15 +53,15 @@ public class ContainerLayout extends RelativeLayout implements ReactContainer {
         reactView.destroy();
     }
 
-    @Override
-    public void sendContainerStart() {
-        reactView.sendContainerStart();
-    }
+	@Override
+	public void sendComponentStart() {
+		reactView.sendComponentStart();
+	}
 
-    @Override
-    public void sendContainerStop() {
-        reactView.sendContainerStop();
-    }
+	@Override
+	public void sendComponentStop() {
+		reactView.sendComponentStop();
+	}
 
     @Override
     public void applyOptions(NavigationOptions options) {
@@ -99,4 +96,4 @@ public class ContainerLayout extends RelativeLayout implements ReactContainer {
         layoutParams.addRule(BELOW, topBar.getId());
         reactView.asView().setLayoutParams(layoutParams);
     }
-}
+}

lib/android/app/src/main/java/com/reactnativenavigation/views/ComponentViewCreator.java

@@ -0,0 +1,22 @@
+package com.reactnativenavigation.views;
+
+import android.app.Activity;
+
+import com.facebook.react.ReactInstanceManager;
+import com.reactnativenavigation.react.ReactComponentViewCreator;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
+
+public class ComponentViewCreator implements ComponentViewController.ReactViewCreator {
+
+    private ReactInstanceManager instanceManager;
+
+    public ComponentViewCreator(ReactInstanceManager instanceManager) {
+        this.instanceManager = instanceManager;
+	}
+
+	@Override
+	public ComponentViewController.IReactView create(Activity activity, String componentId, String componentName) {
+        ComponentViewController.IReactView reactView = new ReactComponentViewCreator(instanceManager).create(activity, componentId, componentName);
+        return new ComponentLayout(activity, reactView);
+	}
+}

lib/android/app/src/main/java/com/reactnativenavigation/views/ContainerViewCreator.java

@@ -1,24 +0,0 @@
-package com.reactnativenavigation.views;
-
-import android.app.Activity;
-
-import com.facebook.react.ReactInstanceManager;
-import com.facebook.react.uimanager.UIManagerModule;
-import com.reactnativenavigation.react.NavigationModule;
-import com.reactnativenavigation.react.ReactContainerViewCreator;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-
-public class ContainerViewCreator implements ContainerViewController.ReactViewCreator {
-
-    private ReactInstanceManager instanceManager;
-
-    public ContainerViewCreator(ReactInstanceManager instanceManager) {
-        this.instanceManager = instanceManager;
-	}
-
-	@Override
-	public ContainerViewController.IReactView create(Activity activity, String containerId, String containerName) {
-        ContainerViewController.IReactView reactView = new ReactContainerViewCreator(instanceManager).create(activity, containerId, containerName);
-        return new ContainerLayout(activity, reactView, instanceManager.getCurrentReactContext().getNativeModule(UIManagerModule.class).getEventDispatcher());
-	}
-}

lib/android/app/src/main/java/com/reactnativenavigation/views/CustomDialog.java

@@ -14,16 +14,16 @@ import com.facebook.react.ReactRootView;
 
 public class CustomDialog extends Dialog {
 
-	private View container;
+	private View component;
 
-	public CustomDialog(@NonNull Context context, @NonNull View container) {
+	public CustomDialog(@NonNull Context context, @NonNull View component) {
 		super(context);
 
-		this.container = container;
+		this.component = component;
 		init();
 	}
 
 	private void init() {
-		addContentView(container, new WindowManager.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
+		addContentView(component, new WindowManager.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
 	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/ReactComponent.java

@@ -0,0 +1,6 @@
+package com.reactnativenavigation.views;
+
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
+
+public interface ReactComponent extends Component, ComponentViewController.IReactView {
+}

lib/android/app/src/main/java/com/reactnativenavigation/views/ReactContainer.java

@@ -1,6 +0,0 @@
-package com.reactnativenavigation.views;
-
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-
-public interface ReactContainer extends Container, ContainerViewController.IReactView {
-}

lib/android/app/src/main/java/com/reactnativenavigation/views/TitleBarButton.java

@@ -24,11 +24,11 @@ import java.util.ArrayList;
 public class TitleBarButton implements MenuItem.OnMenuItemClickListener {
 	private Toolbar toolbar;
 	private final Button button;
-	private Container container;
+	private Component component;
 	private Drawable icon;
 
-	TitleBarButton(Container container, Toolbar toolbar, Button button) {
-		this.container = container;
+	TitleBarButton(Component component, Toolbar toolbar, Button button) {
+		this.component = component;
 		this.toolbar = toolbar;
 		this.button = button;
 	}
@@ -118,12 +118,12 @@ public class TitleBarButton implements MenuItem.OnMenuItemClickListener {
 	}
 
 	private void setNavigationClickListener() {
-		toolbar.setNavigationOnClickListener(view -> container.sendOnNavigationButtonPressed(button.id));
+		toolbar.setNavigationOnClickListener(view -> component.sendOnNavigationButtonPressed(button.id));
 	}
 
 	@Override
 	public boolean onMenuItemClick(MenuItem menuItem) {
-		this.container.sendOnNavigationButtonPressed(button.id);
+		this.component.sendOnNavigationButtonPressed(button.id);
 		return true;
 	}
 

lib/android/app/src/main/java/com/reactnativenavigation/views/TopBar.java

@@ -21,33 +21,23 @@ import com.reactnativenavigation.parse.Color;
 import com.reactnativenavigation.parse.NavigationOptions;
 import com.reactnativenavigation.parse.Number;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsViewPager;
+import com.reactnativenavigation.parse.Color;
 
 import java.util.ArrayList;
 
 @SuppressLint("ViewConstructor")
 public class TopBar extends AppBarLayout {
-    private final Toolbar titleBar;
-    private Container container;
+	private final Toolbar titleBar;
+    private Component component;
     private TopTabs topTabs;
 
-    private TopBarAnimator animator;
-    private TopBarCollapseBehavior collapsingBehavior;
-
-    public TopBar(Context context) {
-        this(context, null, null);
-    }
-
-    public TopBar(Context context, Container container) {
-        this(context, container, null);
-    }
-
-    public TopBar(Context context, Container container, EventDispatcher eventDispatcher) {
+    public TopBar(final Context context, Component component) {
         super(context);
         collapsingBehavior = new TopBarCollapseBehavior(eventDispatcher, this);
-        this.container = container;
+        this.component = component;
         titleBar = new Toolbar(context);
         topTabs = new TopTabs(getContext());
-        animator = new TopBarAnimator(this, container != null ? container.getContentView() : null);
+        animator = new TopBarAnimator(this, component != null ? component.getContentView() : null);
         addView(titleBar);
     }
 
@@ -131,10 +121,10 @@ public class TopBar extends AppBarLayout {
         setLeftButton(leftButton);
     }
 
-    private void setLeftButton(final Button button) {
-        TitleBarButton leftBarButton = new TitleBarButton(container, this.titleBar, button);
-        leftBarButton.applyNavigationIcon(getContext());
-    }
+	private void setLeftButton(final Button button) {
+		TitleBarButton leftBarButton = new TitleBarButton(component, this.titleBar, button);
+		leftBarButton.applyNavigationIcon(getContext());
+	}
 
     private void setRightButtons(ArrayList<Button> rightButtons) {
         if (rightButtons == null || rightButtons.size() == 0) {
@@ -144,11 +134,11 @@ public class TopBar extends AppBarLayout {
         Menu menu = getTitleBar().getMenu();
         menu.clear();
 
-        for (int i = 0; i < rightButtons.size(); i++) {
-            Button button = rightButtons.get(i);
-            TitleBarButton titleBarButton = new TitleBarButton(container, this.titleBar, button);
-            titleBarButton.addToMenu(getContext(), menu);
-        }
+		for (int i = 0; i < rightButtons.size(); i++){
+	   		Button button = rightButtons.get(i);
+			TitleBarButton titleBarButton = new TitleBarButton(component, this.titleBar, button);
+			titleBarButton.addToMenu(getContext(), menu);
+       }
     }
 
     public Toolbar getTitleBar() {

lib/android/app/src/main/java/com/reactnativenavigation/views/TopTab.java

@@ -5,7 +5,7 @@ import android.content.Context;
 import android.view.View;
 import android.widget.FrameLayout;
 
-import com.reactnativenavigation.viewcontrollers.ContainerViewController.IReactView;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController.IReactView;
 
 @SuppressLint("ViewConstructor")
 public class TopTab extends FrameLayout implements IReactView {
@@ -34,13 +34,13 @@ public class TopTab extends FrameLayout implements IReactView {
 	}
 
 	@Override
-	public void sendContainerStart() {
-		reactView.sendContainerStart();
+	public void sendComponentStart() {
+		reactView.sendComponentStart();
 	}
 
 	@Override
-	public void sendContainerStop() {
-		reactView.sendContainerStop();
+	public void sendComponentStop() {
+		reactView.sendComponentStop();
 	}
 
     @Override

lib/android/app/src/main/java/com/reactnativenavigation/views/TopTabCreator.java

@@ -3,10 +3,10 @@ package com.reactnativenavigation.views;
 import android.app.Activity;
 
 import com.facebook.react.ReactInstanceManager;
-import com.reactnativenavigation.react.ReactContainerViewCreator;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.react.ReactComponentViewCreator;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 
-public class TopTabCreator implements ContainerViewController.ReactViewCreator {
+public class TopTabCreator implements ComponentViewController.ReactViewCreator {
 
 
     private ReactInstanceManager instanceManager;
@@ -16,8 +16,8 @@ public class TopTabCreator implements ContainerViewController.ReactViewCreator {
     }
 
 	@Override
-	public ContainerViewController.IReactView create(Activity activity, String containerId, String containerName) {
-        ContainerViewController.IReactView reactView = new ReactContainerViewCreator(instanceManager).create(activity, containerId, containerName);
+	public ComponentViewController.IReactView create(Activity activity, String componentId, String componentName) {
+        ComponentViewController.IReactView reactView = new ReactComponentViewCreator(instanceManager).create(activity, componentId, componentName);
         return new TopTab(activity, reactView);
 	}
 }

lib/android/app/src/main/java/com/reactnativenavigation/views/TopTabsLayout.java

@@ -19,7 +19,7 @@ import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsViewPager;
 import java.util.List;
 
 @SuppressLint("ViewConstructor")
-public class TopTabsLayout extends RelativeLayout implements Container {
+public class TopTabsLayout extends RelativeLayout implements Component {
 
     private TopBar topBar;
     private List<TopTabController> tabs;

lib/android/app/src/test/java/com/reactnativenavigation/mocks/SimpleComponentViewController.java

@@ -0,0 +1,12 @@
+package com.reactnativenavigation.mocks;
+
+import android.app.Activity;
+
+import com.reactnativenavigation.parse.NavigationOptions;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
+
+public class SimpleComponentViewController extends ComponentViewController {
+	public SimpleComponentViewController(final Activity activity, final String id) {
+		super(activity, id, "theComponentName", new TestComponentViewCreator(), new NavigationOptions());
+	}
+}

lib/android/app/src/test/java/com/reactnativenavigation/mocks/SimpleContainerViewController.java

@@ -1,12 +0,0 @@
-package com.reactnativenavigation.mocks;
-
-import android.app.Activity;
-
-import com.reactnativenavigation.parse.NavigationOptions;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-
-public class SimpleContainerViewController extends ContainerViewController {
-	public SimpleContainerViewController(final Activity activity, final String id) {
-		super(activity, id, "theContainerName", new TestContainerViewCreator(), new NavigationOptions());
-	}
-}

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestContainerLayout.java → lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestComponentLayout.java

@@ -10,14 +10,14 @@ import com.reactnativenavigation.presentation.OptionsPresenter;
 import com.reactnativenavigation.views.ReactContainer;
 import com.reactnativenavigation.views.TopBar;
 
-public class TestContainerLayout extends RelativeLayout implements ReactContainer {
+public class TestComponentLayout extends RelativeLayout implements ReactComponent {
 
     private final TopBar topBar;
     private final View contentView;
     private final OptionsPresenter optionsPresenter;
 
-    public TestContainerLayout(final Context context) {
-        super(context);
+    public TestComponentLayout(final Context context) {
+		super(context);
         topBar = new TopBar(context, this);
         contentView = new View(context);
         addView(topBar);
@@ -63,11 +63,11 @@ public class TestContainerLayout extends RelativeLayout implements ReactContaine
     }
 
     @Override
-    public void sendContainerStart() {
+    public void sendComponentStart() {
     }
 
     @Override
-    public void sendContainerStop() {
+    public void sendComponentStop() {
     }
 
     @Override

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestContainerView.java → lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestComponentView.java

@@ -7,15 +7,15 @@ import com.reactnativenavigation.parse.NavigationOptions;
 import com.reactnativenavigation.views.ReactContainer;
 import com.reactnativenavigation.views.TopBar;
 
-public class TestContainerView extends View implements ReactContainer {
+public class TestComponentView extends View implements ReactComponent {
 
     private TopBar topBar;
 
-    public TestContainerView(final Context context) {
-        super(context);
-        topBar = new TopBar(context, this);
+	public TestComponentView(final Context context) {
+		super(context);
+		topBar = new TopBar(context, this);
 
-    }
+	}
 
     @Override
     public boolean isReady() {
@@ -31,13 +31,13 @@ public class TestContainerView extends View implements ReactContainer {
     public void destroy() {
     }
 
-    @Override
-    public void sendContainerStart() {
-    }
+	@Override
+	public void sendComponentStart() {
+	}
 
-    @Override
-    public void sendContainerStop() {
-    }
+	@Override
+	public void sendComponentStop() {
+	}
 
     @Override
     public void applyOptions(NavigationOptions options) {

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestComponentViewCreator.java

@@ -0,0 +1,13 @@
+package com.reactnativenavigation.mocks;
+
+import android.app.Activity;
+
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController.ReactViewCreator;
+
+public class TestComponentViewCreator implements ReactViewCreator {
+	@Override
+	public ComponentViewController.IReactView create(final Activity activity, final String componentId, final String componentName) {
+		return new TestComponentLayout(activity);
+	}
+}

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TestContainerViewCreator.java

@@ -1,13 +0,0 @@
-package com.reactnativenavigation.mocks;
-
-import android.app.Activity;
-
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController.ReactViewCreator;
-
-public class TestContainerViewCreator implements ReactViewCreator {
-	@Override
-	public ContainerViewController.IReactView create(final Activity activity, final String containerId, final String containerName) {
-		return new TestContainerLayout(activity);
-	}
-}

lib/android/app/src/test/java/com/reactnativenavigation/mocks/TopTabLayoutMock.java

@@ -3,9 +3,9 @@ package com.reactnativenavigation.mocks;
 import android.content.Context;
 import android.view.View;
 
-import com.reactnativenavigation.viewcontrollers.ContainerViewController;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController;
 
-public class TopTabLayoutMock extends View implements ContainerViewController.IReactView {
+public class TopTabLayoutMock extends View implements ComponentViewController.IReactView {
 
     public TopTabLayoutMock(Context context) {
         super(context);
@@ -27,12 +27,12 @@ public class TopTabLayoutMock extends View implements ContainerViewController.IR
     }
 
     @Override
-    public void sendContainerStart() {
+    public void sendComponentStart() {
 
     }
 
     @Override
-    public void sendContainerStop() {
+    public void sendComponentStop() {
 
     }
 

lib/android/app/src/test/java/com/reactnativenavigation/parse/LayoutNodeParserTest.java

@@ -10,16 +10,16 @@ import static org.assertj.core.api.Java6Assertions.assertThat;
 public class LayoutNodeParserTest extends BaseTest {
 	@Test
 	public void dto() throws Exception {
-		LayoutNode node = new LayoutNode("the id", LayoutNode.Type.Container);
+		LayoutNode node = new LayoutNode("the id", LayoutNode.Type.Component);
 		assertThat(node.id).isEqualTo("the id");
-		assertThat(node.type).isEqualTo(LayoutNode.Type.Container);
+		assertThat(node.type).isEqualTo(LayoutNode.Type.Component);
 		assertThat(node.data.keys()).isEmpty();
 		assertThat(node.children).isEmpty();
 	}
 
 	@Test
 	public void parseType() throws Exception {
-		assertThat(LayoutNode.Type.valueOf("Container")).isEqualTo(LayoutNode.Type.Container);
+		assertThat(LayoutNode.Type.valueOf("Component")).isEqualTo(LayoutNode.Type.Component);
 	}
 
 	@Test(expected = RuntimeException.class)
@@ -30,20 +30,20 @@ public class LayoutNodeParserTest extends BaseTest {
 	@Test
 	public void parseFromTree() throws Exception {
 		JSONObject tree = new JSONObject("{id: node1, " +
-				"type: ContainerStack, " +
+				"type: Stack, " +
 				"data: {dataKey: dataValue}, " +
-				"children: [{id: childId1, type: Container}]}");
+				"children: [{id: childId1, type: Component}]}");
 
 		LayoutNode result = LayoutNodeParser.parse(tree);
 
 		assertThat(result).isNotNull();
 		assertThat(result.id).isEqualTo("node1");
-		assertThat(result.type).isEqualTo(LayoutNode.Type.ContainerStack);
+		assertThat(result.type).isEqualTo(LayoutNode.Type.Stack);
 		assertThat(result.data.length()).isEqualTo(1);
 		assertThat(result.data.getString("dataKey")).isEqualTo("dataValue");
 		assertThat(result.children).hasSize(1);
 		assertThat(result.children.get(0).id).isEqualTo("childId1");
-		assertThat(result.children.get(0).type).isEqualTo(LayoutNode.Type.Container);
+		assertThat(result.children.get(0).type).isEqualTo(LayoutNode.Type.Component);
 		assertThat(result.children.get(0).data.keys()).isEmpty();
 		assertThat(result.children.get(0).children).isEmpty();
 	}

lib/android/app/src/test/java/com/reactnativenavigation/parse/NavigationOptionsTest.java

@@ -29,7 +29,7 @@ public class NavigationOptionsTest extends BaseTest {
     private static final NavigationOptions.BooleanOptions BOTTOM_TABS_ANIMATE_HIDE = True;
     private static final NavigationOptions.BooleanOptions BOTTOM_TABS_HIDDEN = True;
     private static final int BOTTOM_TABS_BADGE = 3;
-    private static final String BOTTOM_TABS_CURRENT_TAB_ID = "ContainerId";
+    private static final String BOTTOM_TABS_CURRENT_TAB_ID = "ComponentId";
     private static final int BOTTOM_TABS_CURRENT_TAB_INDEX = 1;
     private TypefaceLoader mockLoader;
 

lib/android/app/src/test/java/com/reactnativenavigation/parse/OverlayOptionsTest.java

@@ -7,7 +7,6 @@ import com.reactnativenavigation.BaseTest;
 import org.json.JSONObject;
 import org.junit.Test;
 
-import static com.reactnativenavigation.parse.NavigationOptions.BooleanOptions.True;
 import static org.assertj.core.api.Java6Assertions.assertThat;
 
 public class OverlayOptionsTest extends BaseTest {

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/ContainerViewControllerTest.java → lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/ComponentViewControllerTest.java

@@ -3,7 +3,7 @@ package com.reactnativenavigation.viewcontrollers;
 import android.app.Activity;
 
 import com.reactnativenavigation.BaseTest;
-import com.reactnativenavigation.mocks.TestContainerLayout;
+import com.reactnativenavigation.mocks.TestComponentLayout;
 import com.reactnativenavigation.parse.NavigationOptions;
 
 import org.junit.Test;
@@ -14,30 +14,30 @@ import static org.mockito.Mockito.times;
 import static org.mockito.Mockito.verify;
 import static org.mockito.Mockito.when;
 
-public class ContainerViewControllerTest extends BaseTest {
-	private ContainerViewController uut;
-	private ContainerViewController.IReactView view;
+public class ComponentViewControllerTest extends BaseTest {
+	private ComponentViewController uut;
+	private ComponentViewController.IReactView view;
 
 	@Override
 	public void beforeEach() {
 		super.beforeEach();
 		Activity activity = newActivity();
-		view = spy(new TestContainerLayout(activity));
-		uut = new ContainerViewController(activity, "containerId1", "containerName", new ContainerViewController.ReactViewCreator() {
+		view = spy(new TestComponentLayout(activity));
+		uut = new ComponentViewController(activity, "componentId1", "componentName", new ComponentViewController.ReactViewCreator() {
 			@Override
-			public ContainerViewController.IReactView create(final Activity activity1, final String containerId, final String containerName) {
+			public ComponentViewController.IReactView create(final Activity activity1, final String componentId, final String componentName) {
 				return view;
 			}
 		}, new NavigationOptions());
 	}
 
 	@Test
-	public void createsViewFromContainerViewCreator() throws Exception {
+	public void createsViewFromComponentViewCreator() throws Exception {
 		assertThat(uut.getView()).isSameAs(view);
 	}
 
 	@Test
-	public void containerViewDestroyedOnDestroy() throws Exception {
+	public void componentViewDestroyedOnDestroy() throws Exception {
 		uut.ensureViewIsCreated();
 		verify(view, times(0)).destroy();
 		uut.destroy();
@@ -45,20 +45,20 @@ public class ContainerViewControllerTest extends BaseTest {
 	}
 
 	@Test
-	public void lifecycleMethodsSentToContainerView() throws Exception {
+	public void lifecycleMethodsSentToComponentView() throws Exception {
 		uut.ensureViewIsCreated();
-		verify(view, times(0)).sendContainerStart();
-		verify(view, times(0)).sendContainerStop();
+		verify(view, times(0)).sendComponentStart();
+		verify(view, times(0)).sendComponentStop();
 		uut.onViewAppeared();
-		verify(view, times(1)).sendContainerStart();
-		verify(view, times(0)).sendContainerStop();
+		verify(view, times(1)).sendComponentStart();
+		verify(view, times(0)).sendComponentStop();
 		uut.onViewDisappear();
-		verify(view, times(1)).sendContainerStart();
-		verify(view, times(1)).sendContainerStop();
+		verify(view, times(1)).sendComponentStart();
+		verify(view, times(1)).sendComponentStop();
 	}
 
 	@Test
-	public void isViewShownOnlyIfContainerViewIsReady() throws Exception {
+	public void isViewShownOnlyIfComponentViewIsReady() throws Exception {
 		assertThat(uut.isViewShown()).isFalse();
 		uut.ensureViewIsCreated();
 		when(view.asView().isShown()).thenReturn(true);

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/NavigatorTest.java

@@ -5,7 +5,7 @@ import android.support.annotation.NonNull;
 
 import com.reactnativenavigation.BaseTest;
 import com.reactnativenavigation.mocks.MockPromise;
-import com.reactnativenavigation.mocks.SimpleContainerViewController;
+import com.reactnativenavigation.mocks.SimpleComponentViewController;
 import com.reactnativenavigation.mocks.SimpleViewController;
 import com.reactnativenavigation.mocks.TestNavigationAnimator;
 import com.reactnativenavigation.parse.NavigationOptions;
@@ -195,19 +195,19 @@ public class NavigatorTest extends BaseTest {
 
 	@Test
 	public void setOptions_CallsApplyNavigationOptions() {
-		ContainerViewController containerVc = new SimpleContainerViewController(activity, "theId");
-		uut.setRoot(containerVc);
-		assertThat(containerVc.getNavigationOptions().topBarOptions.title).isEmpty();
+		ComponentViewController componentVc = new SimpleComponentViewController(activity, "theId");
+		uut.setRoot(componentVc);
+		assertThat(componentVc.getOptions().topBarOptions.title).isEmpty();
 
 		NavigationOptions options = new NavigationOptions();
 		options.topBarOptions.title = "new title";
 
 		uut.setOptions("theId", options);
-		assertThat(containerVc.getNavigationOptions().topBarOptions.title).isEqualTo("new title");
+		assertThat(componentVc.getOptions().topBarOptions.title).isEqualTo("new title");
 	}
 
 	@Test
-	public void setOptions_AffectsOnlyContainerViewControllers() {
+	public void setOptions_AffectsOnlyComponentViewControllers() {
 		uut.setOptions("some unknown child id", new NavigationOptions());
 	}
 

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/OptionsApplyingTest.java

@@ -8,7 +8,7 @@ import android.view.ViewGroup;
 import android.widget.RelativeLayout;
 
 import com.reactnativenavigation.BaseTest;
-import com.reactnativenavigation.mocks.TestContainerLayout;
+import com.reactnativenavigation.mocks.TestComponentLayout;
 import com.reactnativenavigation.parse.NavigationOptions;
 
 import org.junit.Test;
@@ -18,21 +18,21 @@ import static org.assertj.core.api.Java6Assertions.assertThat;
 import static org.mockito.Mockito.spy;
 
 public class OptionsApplyingTest extends BaseTest {
-    private Activity activity;
-    private ContainerViewController uut;
-    private ContainerViewController.IReactView view;
-    private NavigationOptions initialNavigationOptions;
-
-    @Override
-    public void beforeEach() {
-        super.beforeEach();
-        activity = newActivity();
-        initialNavigationOptions = new NavigationOptions();
-        view = spy(new TestContainerLayout(activity));
-        uut = new ContainerViewController(activity,
-                "containerId1",
-                "containerName",
-                (activity1, containerId, containerName) -> view,
+	private Activity activity;
+	private ComponentViewController uut;
+	private ComponentViewController.IReactView view;
+	private NavigationOptions initialNavigationOptions;
+
+	@Override
+	public void beforeEach() {
+		super.beforeEach();
+		activity = newActivity();
+		initialNavigationOptions = new NavigationOptions();
+		view = spy(new TestComponentLayout(activity));
+		uut = new ComponentViewController(activity,
+                "componentId1",
+                "componentName",
+                (activity1, componentId, componentName) -> view,
                 initialNavigationOptions
         );
         uut.ensureViewIsCreated();
@@ -45,27 +45,27 @@ public class OptionsApplyingTest extends BaseTest {
         assertThat(uut.getParentStackController()).isNull();
     }
 
-    @Test
-    public void initialOptionsAppliedOnAppear() throws Exception {
-        assertThat(uut.getNavigationOptions()).isSameAs(initialNavigationOptions);
-        initialNavigationOptions.topBarOptions.title = "the title";
-        StackController stackController = new StackController(activity, "stackId");
-        stackController.push(uut);
-        assertThat(uut.getTopBar().getTitle()).isEmpty();
+	@Test
+	public void initialOptionsAppliedOnAppear() throws Exception {
+		assertThat(uut.getOptions()).isSameAs(initialNavigationOptions);
+		initialNavigationOptions.topBarOptions.title = "the title";
+		StackController stackController = new StackController(activity, "stackId");
+		stackController.push(uut);
+		assertThat(uut.getTopBar().getTitle()).isEmpty();
 
         uut.onViewAppeared();
         assertThat(uut.getTopBar().getTitle()).isEqualTo("the title");
     }
 
-    @Test
-    public void mergeNavigationOptionsUpdatesCurrentOptions() throws Exception {
-        assertThat(uut.getNavigationOptions().topBarOptions.title).isEmpty();
-        NavigationOptions options = new NavigationOptions();
-        options.topBarOptions.title = "new title";
-        uut.mergeNavigationOptions(options);
-        assertThat(uut.getNavigationOptions().topBarOptions.title).isEqualTo("new title");
-        assertThat(uut.getNavigationOptions()).isSameAs(initialNavigationOptions);
-    }
+	@Test
+	public void mergeNavigationOptionsUpdatesCurrentOptions() throws Exception {
+		assertThat(uut.getOptions().topBarOptions.title).isEmpty();
+		NavigationOptions options = new NavigationOptions();
+		options.topBarOptions.title = "new title";
+		uut.mergeNavigationOptions(options);
+		assertThat(uut.getOptions().topBarOptions.title).isEqualTo("new title");
+		assertThat(uut.getOptions()).isSameAs(initialNavigationOptions);
+	}
 
     @Test
     public void reappliesOptionsOnMerge() throws Exception {
@@ -92,12 +92,12 @@ public class OptionsApplyingTest extends BaseTest {
         assertThat(((ColorDrawable) uut.getTopBar().getTitleBar().getBackground()).getColor()).isEqualTo(Color.RED);
     }
 
-    @Test
-    public void appliesTopBarTextColor() throws Exception {
-        assertThat(uut.getNavigationOptions()).isSameAs(initialNavigationOptions);
-        initialNavigationOptions.topBarOptions.title = "the title";
-        uut.onViewAppeared();
-        assertThat(uut.getTopBar().getTitleTextView().getCurrentTextColor()).isNotEqualTo(Color.RED);
+	@Test
+	public void appliesTopBarTextColor() throws Exception {
+		assertThat(uut.getOptions()).isSameAs(initialNavigationOptions);
+		initialNavigationOptions.topBarOptions.title = "the title";
+		uut.onViewAppeared();
+		assertThat(uut.getTopBar().getTitleTextView().getCurrentTextColor()).isNotEqualTo(Color.RED);
 
         NavigationOptions opts = new NavigationOptions();
         opts.topBarOptions.title = "the title";
@@ -108,12 +108,12 @@ public class OptionsApplyingTest extends BaseTest {
         assertThat(uut.getTopBar().getTitleTextView().getCurrentTextColor()).isEqualTo(Color.RED);
     }
 
-    @Test
-    public void appliesTopBarTextSize() throws Exception {
-        assertThat(uut.getNavigationOptions()).isSameAs(initialNavigationOptions);
-        initialNavigationOptions.topBarOptions.title = "the title";
-        uut.onViewAppeared();
-        assertThat(uut.getTopBar().getTitleTextView().getTextSize()).isNotEqualTo(18);
+	@Test
+	public void appliesTopBarTextSize() throws Exception {
+		assertThat(uut.getOptions()).isSameAs(initialNavigationOptions);
+		initialNavigationOptions.topBarOptions.title = "the title";
+		uut.onViewAppeared();
+		assertThat(uut.getTopBar().getTitleTextView().getTextSize()).isNotEqualTo(18);
 
         NavigationOptions opts = new NavigationOptions();
         opts.topBarOptions.title = "the title";
@@ -124,12 +124,12 @@ public class OptionsApplyingTest extends BaseTest {
         assertThat(uut.getTopBar().getTitleTextView().getTextSize()).isEqualTo(18);
     }
 
-    @Test
-    public void appliesTopBarHidden() throws Exception {
-        assertThat(uut.getNavigationOptions()).isSameAs(initialNavigationOptions);
-        initialNavigationOptions.topBarOptions.title = "the title";
-        uut.onViewAppeared();
-        assertThat(uut.getTopBar().getVisibility()).isNotEqualTo(View.GONE);
+	@Test
+	public void appliesTopBarHidden() throws Exception {
+		assertThat(uut.getOptions()).isSameAs(initialNavigationOptions);
+		initialNavigationOptions.topBarOptions.title = "the title";
+		uut.onViewAppeared();
+		assertThat(uut.getTopBar().getVisibility()).isNotEqualTo(View.GONE);
 
         NavigationOptions opts = new NavigationOptions();
         opts.topBarOptions.hidden = NavigationOptions.BooleanOptions.True;
@@ -154,4 +154,4 @@ public class OptionsApplyingTest extends BaseTest {
         uutLayoutParams = (RelativeLayout.LayoutParams) ((ViewGroup) uut.getContainer().asView()).getChildAt(1).getLayoutParams();
         assertThat(uutLayoutParams.getRule(BELOW)).isEqualTo(0);
     }
-}
+}

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopTabControllerTest.java

@@ -26,12 +26,12 @@ public class TopTabControllerTest extends BaseTest {
         view = spy(new TopTabLayoutMock(activity));
         initialOptions = new NavigationOptions();
         uut = new TopTabController(activity,
-                "containerId",
-                "containerName",
-                (activity1, containerId, containerName) -> view,
+                "componentId",
+                "componentName",
+                (activity1, componentId, componentName) -> view,
                 initialOptions
         );
-        parentController = spy(new TopTabsControllerMock(activity, "parentContainerId"));
+        parentController = spy(new TopTabsControllerMock(activity, "parentComponentId"));
         uut.setParentController(parentController);
     }
 

lib/android/app/src/test/java/com/reactnativenavigation/viewcontrollers/TopTabsViewControllerTest.java

@@ -6,7 +6,7 @@ import android.view.ViewGroup;
 import com.reactnativenavigation.BaseTest;
 import com.reactnativenavigation.mocks.TopTabLayoutMock;
 import com.reactnativenavigation.parse.NavigationOptions;
-import com.reactnativenavigation.viewcontrollers.ContainerViewController.IReactView;
+import com.reactnativenavigation.viewcontrollers.ComponentViewController.IReactView;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabController;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsAdapter;
 import com.reactnativenavigation.viewcontrollers.toptabs.TopTabsController;
@@ -31,7 +31,7 @@ public class TopTabsViewControllerTest extends BaseTest {
     private List<TopTabLayoutMock> tabs = new ArrayList<>(SIZE);
     private List<TopTabController> tabControllers = new ArrayList<>(SIZE);
     private List<NavigationOptions> tabOptions = new ArrayList<>(SIZE);
-    private NavigationOptions navigationOptions;
+    private NavigationOptions options;
     private TopTabsLayout topTabsLayout;
 
     @Override
@@ -41,12 +41,12 @@ public class TopTabsViewControllerTest extends BaseTest {
         tabs.clear();
         Activity activity = newActivity();
         createTabs(activity);
-        navigationOptions = new NavigationOptions();
+        options = new NavigationOptions();
         topTabsLayout = spy(new TopTabsLayout(activity, tabControllers, new TopTabsAdapter(tabControllers)));
 
         TopTabsLayoutCreator layoutCreator = Mockito.mock(TopTabsLayoutCreator.class);
         Mockito.when(layoutCreator.create()).thenReturn(topTabsLayout);
-        uut = new TopTabsController(activity, "containerId", tabControllers, layoutCreator, navigationOptions);
+        uut = new TopTabsController(activity, "componentId", tabControllers, layoutCreator, options);
     }
 
     private void createTabs(Activity activity) {
@@ -57,14 +57,14 @@ public class TopTabsViewControllerTest extends BaseTest {
             tabControllers.add(spy(new TopTabController(activity,
                     "idTab" + i,
                     "tab" + i,
-                    (activity1, containerId, containerName) -> reactView,
+                    (activity1, componentId, componentName) -> reactView,
                     tabOptions.get(i))
             ));
         }
     }
 
     @Test
-    public void createsViewFromContainerViewCreator() throws Exception {
+    public void createsViewFromComponentViewCreator() throws Exception {
         uut.ensureViewIsCreated();
         for (int i = 0; i < SIZE; i++) {
             verify(tabControllers.get(i), times(1)).createView();
@@ -72,7 +72,7 @@ public class TopTabsViewControllerTest extends BaseTest {
     }
 
     @Test
-    public void containerViewDestroyedOnDestroy() throws Exception {
+    public void componentViewDestroyedOnDestroy() throws Exception {
         uut.ensureViewIsCreated();
         TopTabsLayout topTabs = (TopTabsLayout) uut.getView();
         for (int i = 0; i < SIZE; i++) {
@@ -91,9 +91,9 @@ public class TopTabsViewControllerTest extends BaseTest {
         TopTabLayoutMock selectedTab = tabs.get(1);
         uut.onViewAppeared();
         uut.switchToTab(1);
-        verify(initialTab, times(1)).sendContainerStop();
-        verify(selectedTab, times(1)).sendContainerStart();
-        verify(selectedTab, times(0)).sendContainerStop();
+        verify(initialTab, times(1)).sendComponentStop();
+        verify(selectedTab, times(1)).sendComponentStart();
+        verify(selectedTab, times(0)).sendComponentStop();
     }
 
     @Test
@@ -102,10 +102,10 @@ public class TopTabsViewControllerTest extends BaseTest {
         uut.onViewAppeared();
         uut.switchToTab(1);
         uut.switchToTab(0);
-        verify(tabs.get(0), times(1)).sendContainerStop();
-        verify(tabs.get(0), times(2)).sendContainerStart();
-        verify(tabs.get(1), times(1)).sendContainerStart();
-        verify(tabs.get(1), times(1)).sendContainerStop();
+        verify(tabs.get(0), times(1)).sendComponentStop();
+        verify(tabs.get(0), times(2)).sendComponentStart();
+        verify(tabs.get(1), times(1)).sendComponentStart();
+        verify(tabs.get(1), times(1)).sendComponentStop();
     }
 
     @Test
@@ -130,7 +130,7 @@ public class TopTabsViewControllerTest extends BaseTest {
     public void appliesOptionsOnLayoutWhenVisible() throws Exception {
         uut.ensureViewIsCreated();
         uut.onViewAppeared();
-        verify(topTabsLayout, times(1)).applyOptions(navigationOptions);
+        verify(topTabsLayout, times(1)).applyOptions(options);
     }
 
     private IReactView tab(TopTabsLayout topTabs, final int index) {

lib/ios/RNNAnimator.m

@@ -59,7 +59,7 @@
 
 -(NSArray*)prepareSharedElementTransition:(NSArray*)RNNSharedElementsToVC
 						andfromVCElements:(NSArray*)RNNSharedElementsFromVC
-						withContainerView:(UIView*)containerView
+						withComponentView:(UIView*)componentView
 {
 	NSMutableArray* transitions = [NSMutableArray new];
 	for (NSDictionary* transition in self.animations) {
@@ -69,8 +69,8 @@
 		RNNViewLocation* animatedViewLocations = [[RNNViewLocation alloc] initWithTransition:transitionStateHolder andVC:self.fromVC];
 		RNNAnimatedView* animatedView = [[RNNAnimatedView alloc] initWithTransition:transitionStateHolder andLocation:animatedViewLocations andIsBackButton:self.backButton];
 		transitionStateHolder.locations = animatedViewLocations;
-		[containerView addSubview:animatedView];
-		[containerView bringSubviewToFront:animatedView];
+		[componentView addSubview:animatedView];
+		[componentView bringSubviewToFront:animatedView];
 		transitionStateHolder.animatedView = animatedView;
 		[transitions addObject:transitionStateHolder];
 		if (transitionStateHolder.isSharedElementTransition){
@@ -147,18 +147,18 @@
 {
 	UIViewController* toVC   = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
 	UIViewController* fromVC  = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
-	UIView* containerView = [transitionContext containerView];
+	UIView* componentView = [transitionContext containerView];
 	self.fromVC = fromVC;
 	self.toVC = toVC;
 	toVC.view.frame = fromVC.view.frame;
 	UIView* fromSnapshot = [fromVC.view snapshotViewAfterScreenUpdates:true];
 	fromSnapshot.frame = fromVC.view.frame;
-	[containerView addSubview:fromSnapshot];
-	[containerView addSubview:toVC.view];
+	[componentView addSubview:fromSnapshot];
+	[componentView addSubview:toVC.view];
 	toVC.view.alpha = 0;
 	NSArray* onlyForTesting = @[];
 	NSArray* onlyForTesting2 = @[];
-	NSArray* transitions = [self prepareSharedElementTransition:onlyForTesting andfromVCElements:onlyForTesting2 withContainerView:containerView];
+	NSArray* transitions = [self prepareSharedElementTransition:onlyForTesting andfromVCElements:onlyForTesting2 withComponentView:componentView];
 	[self animateComplition:transitions fromVCSnapshot:fromSnapshot andTransitioningContext:transitionContext];
 	[self animateTransitions:transitions];
 }

lib/ios/RNNBottomTabsOptions.m

@@ -10,7 +10,7 @@ extern const NSInteger BLUR_TOPBAR_TAG;
 	}
 	
 	if (self.currentTabId) {
-		[(RNNTabBarController*)viewController.tabBarController setSelectedIndexByContainerID:self.currentTabId];
+		[(RNNTabBarController*)viewController.tabBarController setSelectedIndexByComponentID:self.currentTabId];
 	}
 	
 	if (self.hidden) {

lib/ios/RNNBridgeModule.m

@@ -24,33 +24,33 @@ RCT_EXPORT_METHOD(setRoot:(NSDictionary*)layout resolver:(RCTPromiseResolveBlock
 	}];
 }
 
-RCT_EXPORT_METHOD(setOptions:(NSString*)containerId options:(NSDictionary*)options resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
-	[_commandsHandler setOptions:containerId options:options completion:^{
-		resolve(containerId);
+RCT_EXPORT_METHOD(setOptions:(NSString*)componentId options:(NSDictionary*)options resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
+	[_commandsHandler setOptions:componentId options:options completion:^{
+		resolve(componentId);
 	}];
 }
 
-RCT_EXPORT_METHOD(push:(NSString*)containerId layout:(NSDictionary*)layout resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
-	[_commandsHandler push:containerId layout:layout completion:^{
-		resolve(containerId);
+RCT_EXPORT_METHOD(push:(NSString*)componentId layout:(NSDictionary*)layout resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
+	[_commandsHandler push:componentId layout:layout completion:^{
+		resolve(componentId);
 	}];
 }
 
-RCT_EXPORT_METHOD(pop:(NSString*)containerId options:(NSDictionary*)options resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
-	[_commandsHandler pop:containerId options:(NSDictionary*)options completion:^{
-		resolve(containerId);
+RCT_EXPORT_METHOD(pop:(NSString*)componentId options:(NSDictionary*)options resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
+	[_commandsHandler pop:componentId options:(NSDictionary*)options completion:^{
+		resolve(componentId);
 	}];
 }
 
-RCT_EXPORT_METHOD(popTo:(NSString*)containerId resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
-	[_commandsHandler popTo:containerId completion:^{
-		resolve(containerId);
+RCT_EXPORT_METHOD(popTo:(NSString*)componentId resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
+	[_commandsHandler popTo:componentId completion:^{
+		resolve(componentId);
 	}];
 }
 
-RCT_EXPORT_METHOD(popToRoot:(NSString*)containerId resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
-	[_commandsHandler popToRoot:containerId completion:^{
-		resolve(containerId);
+RCT_EXPORT_METHOD(popToRoot:(NSString*)componentId resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
+	[_commandsHandler popToRoot:componentId completion:^{
+		resolve(componentId);
 	}];
 }
 
@@ -60,9 +60,9 @@ RCT_EXPORT_METHOD(showModal:(NSDictionary*)layout resolver:(RCTPromiseResolveBlo
 	}];
 }
 
-RCT_EXPORT_METHOD(dismissModal:(NSString*)containerId resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
-	[_commandsHandler dismissModal:containerId completion:^{
-		resolve(containerId);
+RCT_EXPORT_METHOD(dismissModal:(NSString*)componentId resolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
+	[_commandsHandler dismissModal:componentId completion:^{
+		resolve(componentId);
 	}];
 }
 

lib/ios/RNNCommandsHandler.h

@@ -10,19 +10,19 @@
 
 -(void) setRoot:(NSDictionary*)layout completion:(RNNTransitionCompletionBlock)completion;
 
--(void) setOptions:(NSString*)containerId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion;
+-(void) setOptions:(NSString*)componentId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion;
 
--(void) push:(NSString*)containerId layout:(NSDictionary*)layout completion:(RNNTransitionCompletionBlock)completion;
+-(void) push:(NSString*)componentId layout:(NSDictionary*)layout completion:(RNNTransitionCompletionBlock)completion;
 
--(void) pop:(NSString*)containerId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion;
+-(void) pop:(NSString*)componentId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion;
 
--(void) popTo:(NSString*)containerId completion:(RNNTransitionCompletionBlock)completion;
+-(void) popTo:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion;
 
--(void) popToRoot:(NSString*)containerId completion:(RNNTransitionCompletionBlock)completion;
+-(void) popToRoot:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion;
 
 -(void) showModal:(NSDictionary*)layout completion:(RNNTransitionCompletionBlock)completion;
 
--(void) dismissModal:(NSString*)containerId completion:(RNNTransitionCompletionBlock)completion;
+-(void) dismissModal:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion;
 
 -(void) dismissAllModalsWithCompletion:(RNNTransitionCompletionBlock)completion;
 

lib/ios/RNNCommandsHandler.m

@@ -35,62 +35,62 @@
 	completion();
 }
 
--(void) setOptions:(NSString*)containerId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion {
+-(void) setOptions:(NSString*)componentId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion {
 	[self assertReady];
 	
-	UIViewController* vc = [_store findContainerForId:containerId];
+	UIViewController* vc = [_store findComponentForId:componentId];
 	if([vc isKindOfClass:[RNNRootViewController class]]) {
 		RNNRootViewController* rootVc = (RNNRootViewController*)vc;
-		[rootVc.navigationOptions mergeWith:options];
+		[rootVc.options mergeWith:options];
 		[CATransaction begin];
 		[CATransaction setCompletionBlock:completion];
 		
-		[rootVc.navigationOptions applyOn:vc];
+		[rootVc.options applyOn:vc];
 		
 		[CATransaction commit];
 	}
 }
 
--(void) push:(NSString*)containerId layout:(NSDictionary*)layout completion:(RNNTransitionCompletionBlock)completion {
+-(void) push:(NSString*)componentId layout:(NSDictionary*)layout completion:(RNNTransitionCompletionBlock)completion {
 	[self assertReady];
 	
 	UIViewController<RNNRootViewProtocol> *newVc = [_controllerFactory createLayoutAndSaveToStore:layout];
-	[_navigationStackManager push:newVc onTop:containerId completion:completion];
+	[_navigationStackManager push:newVc onTop:componentId completion:completion];
 }
 
--(void)pop:(NSString*)containerId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion {
+-(void)pop:(NSString*)componentId options:(NSDictionary*)options completion:(RNNTransitionCompletionBlock)completion {
 	[self assertReady];
 	[CATransaction begin];
 	[CATransaction setCompletionBlock:completion];
 	NSDictionary* animationData = options[@"customTransition"];
 	if (animationData){
 		if ([animationData objectForKey:@"animations"]) {
-			[_navigationStackManager pop:containerId withAnimationData:animationData];
+			[_navigationStackManager pop:componentId withAnimationData:animationData];
 		} else {
 			[[NSException exceptionWithName:NSInvalidArgumentException reason:@"unsupported transitionAnimation" userInfo:nil] raise];
 		}
 	} else {
-		[_navigationStackManager pop:containerId withAnimationData:nil];
+		[_navigationStackManager pop:componentId withAnimationData:nil];
 	}
 	[CATransaction commit];
 }
 
--(void) popTo:(NSString*)containerId completion:(RNNTransitionCompletionBlock)completion {
+-(void) popTo:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion {
 	[self assertReady];
 	[CATransaction begin];
 	[CATransaction setCompletionBlock:completion];
 	
-	[_navigationStackManager popTo:containerId];
+	[_navigationStackManager popTo:componentId];
 	
 	[CATransaction commit];
 }
 
--(void) popToRoot:(NSString*)containerId completion:(RNNTransitionCompletionBlock)completion {
+-(void) popToRoot:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion {
 	[self assertReady];
 	[CATransaction begin];
 	[CATransaction setCompletionBlock:completion];
 	
-	[_navigationStackManager popToRoot:containerId];
+	[_navigationStackManager popToRoot:componentId];
 	
 	[CATransaction commit];
 }
@@ -102,12 +102,12 @@
 	[_modalManager showModal:newVc completion:completion];
 }
 
--(void) dismissModal:(NSString*)containerId completion:(RNNTransitionCompletionBlock)completion {
+-(void) dismissModal:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion {
 	[self assertReady];
 	[CATransaction begin];
 	[CATransaction setCompletionBlock:completion];
 	
-	[_modalManager dismissModal:containerId];
+	[_modalManager dismissModal:componentId];
 	
 	[CATransaction commit];
 }

lib/ios/RNNControllerFactory.m

@@ -44,12 +44,12 @@
 	
 	UIViewController<RNNRootViewProtocol> *result;
 	
-	if ( node.isContainer || node.isTopTab) {
-		result = [self createContainer:node];
+	if ( node.isComponent) {
+		result = [self createComponent:node];
 	}
 	
-	else if (node.isContainerStack)	{
-		result = [self createContainerStack:node];
+	else if (node.isStack)	{
+		result = [self createStack:node];
 	}
 	
 	else if (node.isTabs) {
@@ -79,25 +79,25 @@
 		@throw [NSException exceptionWithName:@"UnknownControllerType" reason:[@"Unknown controller type " stringByAppendingString:node.type] userInfo:nil];
 	}
 
-	[_store setContainer:result containerId:node.nodeId];
+	[_store setComponent:result componentId:node.nodeId];
 	
 	return result;
 }
 
-- (UIViewController<RNNRootViewProtocol> *)createContainer:(RNNLayoutNode*)node {
+- (UIViewController<RNNRootViewProtocol> *)createComponent:(RNNLayoutNode*)node {
 	NSString* name = node.data[@"name"];
 	NSDictionary* customTransition = node.data[@"customTransition"];
 	RNNAnimator* animator = [[RNNAnimator alloc] initWithAnimationsDictionary:customTransition];
-	RNNNavigationOptions* options = [[RNNNavigationOptions alloc] initWithDict:node.data[@"navigationOptions"]];
-	NSString* containerId = node.nodeId;
-	RNNRootViewController* container = [[RNNRootViewController alloc] initWithName:name withOptions:options withContainerId:containerId rootViewCreator:_creator eventEmitter:_eventEmitter animator:animator];
+	RNNNavigationOptions* options = [[RNNNavigationOptions alloc] initWithDict:node.data[@"options"]];
+	NSString* componentId = node.nodeId;
+	RNNRootViewController* component = [[RNNRootViewController alloc] initWithName:name withOptions:options withComponentId:componentId rootViewCreator:_creator eventEmitter:_eventEmitter animator:animator];
 	CGSize availableSize = UIApplication.sharedApplication.delegate.window.bounds.size;
-	[_bridge.uiManager setAvailableSize:availableSize forRootView:container.view];
+	[_bridge.uiManager setAvailableSize:availableSize forRootView:component.view];
 	
-	return container;
+	return component;
 }
 
-- (UIViewController<RNNRootViewProtocol> *)createContainerStack:(RNNLayoutNode*)node {
+- (UIViewController<RNNRootViewProtocol> *)createStack:(RNNLayoutNode*)node {
 	RNNNavigationController* vc = [[RNNNavigationController alloc] init];
 	
 	NSMutableArray* controllers = [NSMutableArray new];

lib/ios/RNNEventEmitter.h

@@ -8,10 +8,10 @@
 
 -(void)sendOnAppLaunched;
 
--(void)sendContainerDidAppear:(NSString*)containerId;
+-(void)sendComponentDidAppear:(NSString*)componentId;
 
--(void)sendContainerDidDisappear:(NSString*)containerId;
+-(void)sendComponentDidDisappear:(NSString*)componentId;
 
--(void)sendOnNavigationButtonPressed:(NSString*)containerId buttonId:(NSString*)buttonId;
+-(void)sendOnNavigationButtonPressed:(NSString*)componentId buttonId:(NSString*)buttonId;
 
 @end

lib/ios/RNNEventEmitter.m

@@ -5,12 +5,12 @@
 RCT_EXPORT_MODULE();
 
 static NSString* const onAppLaunched	= @"RNN.appLaunched";
-static NSString* const containerDidAppear	= @"RNN.containerDidAppear";
-static NSString* const containerDidDisappear	= @"RNN.containerDidDisappear";
+static NSString* const componentDidAppear	= @"RNN.componentDidAppear";
+static NSString* const componentDidDisappear	= @"RNN.componentDidDisappear";
 static NSString* const onNavigationButtonPressed	= @"RNN.navigationButtonPressed";
 
 -(NSArray<NSString *> *)supportedEvents {
-	return @[onAppLaunched, containerDidAppear, containerDidDisappear, onNavigationButtonPressed];
+	return @[onAppLaunched, componentDidAppear, componentDidDisappear, onNavigationButtonPressed];
 }
 
 # pragma mark public
@@ -19,16 +19,16 @@ static NSString* const onNavigationButtonPressed	= @"RNN.navigationButtonPressed
 	[self send:onAppLaunched body:nil];
 }
 
--(void)sendContainerDidAppear:(NSString *)containerId {
-	[self send:containerDidAppear body:containerId];
+-(void)sendComponentDidAppear:(NSString *)componentId {
+	[self send:componentDidAppear body:componentId];
 }
 
--(void)sendContainerDidDisappear:(NSString *)containerId {
-	[self send:containerDidDisappear body:containerId];
+-(void)sendComponentDidDisappear:(NSString *)componentId {
+	[self send:componentDidDisappear body:componentId];
 }
 
--(void)sendOnNavigationButtonPressed:(NSString *)containerId buttonId:(NSString*)buttonId {
-	[self send:onNavigationButtonPressed body:@{@"containerId":containerId , @"buttonId": buttonId }];
+-(void)sendOnNavigationButtonPressed:(NSString *)componentId buttonId:(NSString*)buttonId {
+	[self send:onNavigationButtonPressed body:@{@"componentId":componentId , @"buttonId": buttonId }];
 }
 
 # pragma mark private

lib/ios/RNNInteractivePopAnimator.m

@@ -90,7 +90,7 @@
 	return YES;
 }
 - (void)animationEnded:(BOOL)transitionCompleted {
-	
+
 }
 
 - (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext
@@ -104,8 +104,8 @@
 	self.transitionContext = transitionContext;
 	UIViewController* toVC   = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
 	UIViewController* fromVC  = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
-	UIView* containerView = [transitionContext containerView];
-	
+	UIView* componentView = [transitionContext containerView];
+
 	toVC.view.frame = fromVC.view.frame;
 	UIView* topViewContent = [self.topView subviews][0];
 	UIImage* image = [[self.topView subviews][0] image];
@@ -122,8 +122,8 @@
 	[self.bottomView setHidden:YES];
 	UIView* toSnapshot = [toVC.view snapshotViewAfterScreenUpdates:true];
 	toSnapshot.frame = fromVC.view.frame;
-	[containerView insertSubview:(UIView *)toSnapshot atIndex:1];
-	[containerView addSubview:self.imageSnapshot];
+	[componentView insertSubview:(UIView *)toSnapshot atIndex:1];
+	[componentView addSubview:self.imageSnapshot];
 	toSnapshot.alpha = 0.0;
 	[self.topView setHidden:YES];
 	[UIView animateKeyframesWithDuration:(NSTimeInterval)[self transitionDuration:transitionContext]
@@ -141,13 +141,13 @@
 								  [self.imageSnapshot removeFromSuperview];
 								  self.totalTranslate = 0;
 								  if (![transitionContext transitionWasCancelled]) {
-									  [containerView addSubview: toVC.view];
+									  [componentView addSubview: toVC.view];
 									  [transitionContext completeTransition:![transitionContext transitionWasCancelled]];
-									  
+
 								  }
 								  if ([transitionContext transitionWasCancelled]) {
 									  [self.topView setHidden:NO];
-									  [containerView addSubview: fromVC.view];
+									  [componentView addSubview: fromVC.view];
 									  [transitionContext completeTransition:NO];
 								  }
 							  }];
@@ -157,15 +157,15 @@
 								  animationControllerForOperation:(UINavigationControllerOperation)operation
 											   fromViewController:(UIViewController*)fromVC
 												 toViewController:(UIViewController*)toVC {
-	
+
 		if (operation == UINavigationControllerOperationPop) {
 			return self;
 		} else {
 			return nil;
 		}
-	
+
 	return nil;
-	
+
 }
 - (id<UIViewControllerInteractiveTransitioning>)navigationController:(UINavigationController *)navigationController
 						 interactionControllerForAnimationController:(id<UIViewControllerAnimatedTransitioning>)animationController {

lib/ios/RNNLayoutNode.h

@@ -11,11 +11,10 @@
 
 +(instancetype)create:(NSDictionary *)json;
 
--(BOOL)isContainer;
--(BOOL)isContainerStack;
+-(BOOL)isComponent;
+-(BOOL)isStack;
 -(BOOL)isTabs;
 -(BOOL)isTopTabs;
--(BOOL)isTopTab;
 -(BOOL)isSideMenuRoot;
 -(BOOL)isSideMenuLeft;
 -(BOOL)isSideMenuRight;

lib/ios/RNNLayoutNode.m

@@ -13,13 +13,13 @@
 	return node;
 }
 
--(BOOL)isContainer
+-(BOOL)isComponent
 {
-	return [self.type isEqualToString:@"Container"];
+	return [self.type isEqualToString:@"Component"];
 }
--(BOOL)isContainerStack
+-(BOOL)isStack
 {
-	return [self.type isEqualToString:@"ContainerStack"];
+	return [self.type isEqualToString:@"Stack"];
 }
 -(BOOL)isTabs
 {
@@ -29,10 +29,6 @@
 {
 	return [self.type isEqualToString:@"TopTabs"];
 }
--(BOOL)isTopTab
-{
-	return [self.type isEqualToString:@"TopTab"];
-}
 -(BOOL)isSideMenuRoot
 {
 	return [self.type isEqualToString:@"SideMenuRoot"];

lib/ios/RNNModalManager.h

@@ -8,7 +8,7 @@
 
 -(instancetype)initWithStore:(RNNStore*)store;
 -(void)showModal:(UIViewController*)viewController completion:(RNNTransitionCompletionBlock)completion;
--(void)dismissModal:(NSString*)containerId;
+-(void)dismissModal:(NSString*)componentId;
 -(void)dismissAllModals;
 
 @end

lib/ios/RNNModalManager.m

@@ -36,8 +36,8 @@
 	[self waitForContentToAppearAndThen:@selector(showModalAfterLoad:)];
 }
 
--(void)dismissModal:(NSString *)containerId {
-	[[_store pendingModalIdsToDismiss] addObject:containerId];
+-(void)dismissModal:(NSString *)componentId {
+	[[_store pendingModalIdsToDismiss] addObject:componentId];
 	[self removePendingNextModalIfOnTop];
 }
 
@@ -51,9 +51,9 @@
 
 
 -(void)removePendingNextModalIfOnTop {
-	NSString *containerId = [[_store pendingModalIdsToDismiss] lastObject];
+	NSString *componentId = [[_store pendingModalIdsToDismiss] lastObject];
 	
-	UIViewController *modalToDismiss = [_store findContainerForId:containerId];
+	UIViewController *modalToDismiss = [_store findComponentForId:componentId];
 	
 	if(!modalToDismiss) {
 		return;
@@ -63,7 +63,7 @@
 	
 	if (modalToDismiss == topPresentedVC || [[topPresentedVC childViewControllers] containsObject:modalToDismiss]) {
 		[modalToDismiss dismissViewControllerAnimated:YES completion:^{
-			[[_store pendingModalIdsToDismiss] removeObject:containerId];
+			[[_store pendingModalIdsToDismiss] removeObject:componentId];
 			[self removePendingNextModalIfOnTop];
 		}];
 	}

lib/ios/RNNNavigationButtons.m

@@ -104,7 +104,7 @@
 }
 
 -(void)onButtonPress:(RNNUIBarButtonItem*)barButtonItem {
-	[self.viewController.eventEmitter sendOnNavigationButtonPressed:self.viewController.containerId buttonId:barButtonItem.buttonId];
+	[self.viewController.eventEmitter sendOnNavigationButtonPressed:self.viewController.componentId buttonId:barButtonItem.buttonId];
 }
 
 @end

lib/ios/RNNNavigationOptions.m

@@ -17,19 +17,19 @@ const NSInteger TOP_BAR_TRANSPARENT_TAG = 78264803;
 	return [self initWithDict:@{}];
 }
 
--(instancetype)initWithDict:(NSDictionary *)navigationOptions {
+-(instancetype)initWithDict:(NSDictionary *)options {
 	self = [super init];
-	self.statusBarHidden = [navigationOptions objectForKey:@"statusBarHidden"];
-	self.screenBackgroundColor = [navigationOptions objectForKey:@"screenBackgroundColor"];
-	self.backButtonTransition = [navigationOptions objectForKey:@"backButtonTransition"];
-	self.orientation = [navigationOptions objectForKey:@"orientation"];
-	self.topBar = [[RNNTopBarOptions alloc] initWithDict:[navigationOptions objectForKey:@"topBar"]];
-	self.topTab = [[RNNTopTabOptions alloc] initWithDict:[navigationOptions objectForKey:@"topTab"]];
-	self.bottomTabs = [[RNNBottomTabsOptions alloc] initWithDict:[navigationOptions objectForKey:@"bottomTabs"]];
-	self.sideMenu = [[RNNSideMenuOptions alloc] initWithDict:[navigationOptions objectForKey:@"sideMenu"]];
-	self.backgroundImage = [RCTConvert UIImage:[navigationOptions objectForKey:@"backgroundImage"]];
-	self.rootBackgroundImage = [RCTConvert UIImage:[navigationOptions objectForKey:@"rootBackgroundImage"]];
-	self.bottomTab = [[RNNBottomTabOptions alloc] initWithDict:[navigationOptions objectForKey:@"bottomTab"]];
+	self.statusBarHidden = [options objectForKey:@"statusBarHidden"];
+	self.screenBackgroundColor = [options objectForKey:@"screenBackgroundColor"];
+	self.backButtonTransition = [options objectForKey:@"backButtonTransition"];
+	self.orientation = [options objectForKey:@"orientation"];
+	self.topBar = [[RNNTopBarOptions alloc] initWithDict:[options objectForKey:@"topBar"]];
+	self.topTab = [[RNNTopTabOptions alloc] initWithDict:[options objectForKey:@"topTab"]];
+	self.bottomTabs = [[RNNBottomTabsOptions alloc] initWithDict:[options objectForKey:@"bottomTabs"]];
+	self.sideMenu = [[RNNSideMenuOptions alloc] initWithDict:[options objectForKey:@"sideMenu"]];
+	self.backgroundImage = [RCTConvert UIImage:[options objectForKey:@"backgroundImage"]];
+	self.rootBackgroundImage = [RCTConvert UIImage:[options objectForKey:@"rootBackgroundImage"]];
+	self.bottomTab = [[RNNBottomTabOptions alloc] initWithDict:[options objectForKey:@"bottomTab"]];
     
 	return self;
 }

lib/ios/RNNNavigationStackManager.h

@@ -10,9 +10,9 @@
 -(instancetype)initWithStore:(RNNStore*)store;
 
 
--(void)push:(UIViewController<RNNRootViewProtocol>*)newTop onTop:(NSString*)containerId completion:(RNNTransitionCompletionBlock)completion;
--(void)pop:(NSString*)containerId withAnimationData:(NSDictionary*)animationData;
--(void)popTo:(NSString*)containerId;
--(void)popToRoot:(NSString*)containerId;
+-(void)push:(UIViewController<RNNRootViewProtocol>*)newTop onTop:(NSString*)componentId completion:(RNNTransitionCompletionBlock)completion;
+-(void)pop:(NSString*)componentId withAnimationData:(NSDictionary*)animationData;
+-(void)popTo:(NSString*)componentId;
+-(void)popToRoot:(NSString*)componentId;
 
 @end

lib/ios/RNNNavigationStackManager.m

@@ -15,8 +15,8 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 	return self;
 }
 
--(void)push:(UIViewController<RNNRootViewProtocol> *)newTop onTop:(NSString *)containerId completion:(RNNTransitionCompletionBlock)completion {
-	UIViewController *vc = [_store findContainerForId:containerId];
+-(void)push:(UIViewController<RNNRootViewProtocol> *)newTop onTop:(NSString *)componentId completion:(RNNTransitionCompletionBlock)completion {
+	UIViewController *vc = [_store findComponentForId:componentId];
 	[self preparePush:newTop onTopVC:vc completion:completion];
 	[self waitForContentToAppearAndThen:@selector(pushAfterLoad:)];
 }
@@ -60,8 +60,8 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 	self.fromVC = nil;
 }
 
--(void)pop:(NSString *)containerId withAnimationData:(NSDictionary *)animationData {
-	UIViewController* vc = [_store findContainerForId:containerId];
+-(void)pop:(NSString *)componentId withAnimationData:(NSDictionary *)animationData {
+	UIViewController* vc = [_store findComponentForId:componentId];
 	UINavigationController* nvc = [vc navigationController];
 	if ([nvc topViewController] == vc) {
 		if (animationData) {
@@ -78,11 +78,11 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 		[vcs removeObject:vc];
 		[nvc setViewControllers:vcs animated:YES];
 	}
-	[_store removeContainer:containerId];
+	[_store removeComponent:componentId];
 }
 
--(void)popTo:(NSString*)containerId {
-	UIViewController *vc = [_store findContainerForId:containerId];
+-(void)popTo:(NSString*)componentId {
+	UIViewController *vc = [_store findComponentForId:componentId];
 	
 	if (vc) {
 		UINavigationController *nvc = [vc navigationController];
@@ -93,8 +93,8 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 	}
 }
 
--(void) popToRoot:(NSString*)containerId {
-	UIViewController* vc = [_store findContainerForId:containerId];
+-(void) popToRoot:(NSString*)componentId {
+	UIViewController* vc = [_store findComponentForId:componentId];
 	UINavigationController* nvc = [vc navigationController];
 	NSArray* poppedVCs = [nvc popToRootViewControllerAnimated:YES];
 	[self removePopedViewControllers:poppedVCs];
@@ -102,7 +102,7 @@ dispatch_queue_t RCTGetUIManagerQueue(void);
 
 -(void)removePopedViewControllers:(NSArray*)viewControllers {
 	for (UIViewController *popedVC in viewControllers) {
-		[_store removeContainerByViewControllerInstance:popedVC];
+		[_store removeComponentByViewControllerInstance:popedVC];
 	}
 }
 

lib/ios/RNNReactRootViewCreator.m

@@ -30,7 +30,7 @@
 	
 	UIView *view = [[RNNReactRootView alloc] initWithBridge:_bridge
 										 moduleName:name
-								  initialProperties:@{@"containerId": rootViewId}];
+								  initialProperties:@{@"componentId": rootViewId}];
 	return view;
 }
 

lib/ios/RNNRootViewController.h

@@ -11,15 +11,15 @@
 
 @interface RNNRootViewController : UIViewController	<RNNRootViewProtocol>
 
-@property (nonatomic, strong) RNNNavigationOptions* navigationOptions;
+@property (nonatomic, strong) RNNNavigationOptions* options;
 @property (nonatomic, strong) RNNAnimator* animator;
 @property (nonatomic, strong) RNNEventEmitter *eventEmitter;
-@property (nonatomic, strong) NSString* containerId;
+@property (nonatomic, strong) NSString* componentId;
 @property (nonatomic, strong) RNNTopTabsViewController* topTabsViewController;
 
 -(instancetype)initWithName:(NSString*)name
 				withOptions:(RNNNavigationOptions*)options
-			withContainerId:(NSString*)containerId
+			withComponentId:(NSString*)componentId
 			rootViewCreator:(id<RNNRootViewCreator>)creator
 			   eventEmitter:(RNNEventEmitter*)eventEmitter
 		   animator:(RNNAnimator*)animator;

lib/ios/RNNRootViewController.m

@@ -4,7 +4,7 @@
 #import "RNNAnimator.h"
 
 @interface RNNRootViewController()
-@property (nonatomic, strong) NSString* containerName;
+@property (nonatomic, strong) NSString* componentName;
 @property (nonatomic) BOOL _statusBarHidden;
 
 @end
@@ -13,17 +13,17 @@
 
 -(instancetype)initWithName:(NSString*)name
 				withOptions:(RNNNavigationOptions*)options
-			withContainerId:(NSString*)containerId
+			withComponentId:(NSString*)componentId
 			rootViewCreator:(id<RNNRootViewCreator>)creator
 			   eventEmitter:(RNNEventEmitter*)eventEmitter
 				   animator:(RNNAnimator *)animator {
 	self = [super init];
-	self.containerId = containerId;
-	self.containerName = name;
-	self.navigationOptions = options;
+	self.componentId = componentId;
+	self.componentName = name;
+	self.options = options;
 	self.eventEmitter = eventEmitter;
 	self.animator = animator;
-	self.view = [creator createRootView:self.containerName rootViewId:self.containerId];
+	self.view = [creator createRootView:self.componentName rootViewId:self.componentId];
 	
 	[[NSNotificationCenter defaultCenter] addObserver:self
 											 selector:@selector(onJsReload)
@@ -37,7 +37,7 @@
 	
 -(void)viewWillAppear:(BOOL)animated{
 	[super viewWillAppear:animated];
-	[self.navigationOptions applyOn:self];
+	[self.options applyOn:self];
 }
 
 - (void)viewDidLoad {
@@ -45,43 +45,43 @@
 }
 
 -(BOOL)isCustomTransitioned {
-	return self.animator;
+	return self.animator != nil;
 }
 
 - (BOOL)prefersStatusBarHidden {
-	if ([self.navigationOptions.statusBarHidden boolValue]) {
+	if ([self.options.statusBarHidden boolValue]) {
 		return YES;
-	} else if ([self.navigationOptions.statusBarHideWithTopBar boolValue]) {
+	} else if ([self.options.statusBarHideWithTopBar boolValue]) {
 		return self.navigationController.isNavigationBarHidden;
 	}
 	return NO;
 }
 
 - (UIInterfaceOrientationMask)supportedInterfaceOrientations {
-	return self.navigationOptions.supportedOrientations;
+	return self.options.supportedOrientations;
 }
 
 - (BOOL)hidesBottomBarWhenPushed
 {
-	if (self.navigationOptions.bottomTabs && self.navigationOptions.bottomTabs.hidden) {
-		return [self.navigationOptions.bottomTabs.hidden boolValue];
+	if (self.options.bottomTabs && self.options.bottomTabs.hidden) {
+		return [self.options.bottomTabs.hidden boolValue];
 	}
 	return NO;
 }
 
 -(void)viewDidAppear:(BOOL)animated {
 	[super viewDidAppear:animated];
-	[self.eventEmitter sendContainerDidAppear:self.containerId];
+	[self.eventEmitter sendComponentDidAppear:self.componentId];
 }
 
 -(void)viewDidDisappear:(BOOL)animated {
 	[super viewDidDisappear:animated];
-	[self.eventEmitter sendContainerDidDisappear:self.containerId];
+	[self.eventEmitter sendComponentDidDisappear:self.componentId];
 }
 
 - (void)navigationController:(UINavigationController *)navigationController didShowViewController:(UIViewController *)viewController animated:(BOOL)animated{
 	RNNRootViewController* vc =  (RNNRootViewController*)viewController;
-	if (![vc.navigationOptions.backButtonTransition isEqualToString:@"custom"]){
+	if (![vc.options.backButtonTransition isEqualToString:@"custom"]){
 		navigationController.delegate = nil;
 	}
 }
@@ -104,11 +104,11 @@
 }
 
 -(void)applyTabBarItem {
-	[self.navigationOptions.bottomTab applyOn:self];
+	[self.options.bottomTab applyOn:self];
 }
 
 -(void)applyTopTabsOptions {
-	[self.navigationOptions.topTab applyOn:self];
+	[self.options.topTab applyOn:self];
 }
 
 /**

lib/ios/RNNStore.h

@@ -7,12 +7,12 @@ typedef void (^RNNTransitionCompletionBlock)(void);
 
 @interface RNNStore : NSObject
 
--(UIViewController*) findContainerForId:(NSString*)containerId;
--(void) setContainer:(UIViewController*)viewController containerId:(NSString*)containerId;
--(void) removeContainer:(NSString*)containerId;
--(void) removeContainerByViewControllerInstance:(UIViewController*)containerInstance;
+-(UIViewController*) findComponentForId:(NSString*)componentId;
+-(void) setComponent:(UIViewController*)viewController componentId:(NSString*)componentId;
+-(void) removeComponent:(NSString*)componentId;
+-(void) removeComponentByViewControllerInstance:(UIViewController*)componentInstance;
 
--(NSString*)containerKeyForInstance:(UIViewController*)instance;
+-(NSString*)componentKeyForInstance:(UIViewController*)instance;
 
 -(void) setReadyToReceiveCommands:(BOOL)isReady;
 -(BOOL) isReadyToReceiveCommands;

lib/ios/RNNStore.m

@@ -6,7 +6,7 @@
 @end
 
 @implementation RNNStore {
-	NSMapTable* _containerStore;
+	NSMapTable* _componentStore;
 	NSMutableArray* _pendingModalIdsToDismiss;
 	BOOL _isReadyToReceiveCommands;
 }
@@ -14,32 +14,32 @@
 -(instancetype)init {
 	self = [super init];
 	_isReadyToReceiveCommands = false;
-	_containerStore = [NSMapTable strongToWeakObjectsMapTable];
+	_componentStore = [NSMapTable strongToWeakObjectsMapTable];
 	_pendingModalIdsToDismiss = [NSMutableArray new];
 	return self;
 }
 
--(UIViewController *)findContainerForId:(NSString *)containerId {
-	return [_containerStore objectForKey:containerId];
+-(UIViewController *)findComponentForId:(NSString *)componentId {
+	return [_componentStore objectForKey:componentId];
 }
 
-- (void)setContainer:(UIViewController*)viewController containerId:(NSString*)containerId {
-	UIViewController *existingVewController = [self findContainerForId:containerId];
+- (void)setComponent:(UIViewController*)viewController componentId:(NSString*)componentId {
+	UIViewController *existingVewController = [self findComponentForId:componentId];
 	if (existingVewController) {
-		@throw [NSException exceptionWithName:@"MultipleContainerId" reason:[@"Container id already exists " stringByAppendingString:containerId] userInfo:nil];
+		@throw [NSException exceptionWithName:@"MultipleComponentId" reason:[@"Component id already exists " stringByAppendingString:componentId] userInfo:nil];
 	}
 	
-	[_containerStore setObject:viewController forKey:containerId];
+	[_componentStore setObject:viewController forKey:componentId];
 }
 
-- (void)removeContainer:(NSString*)containerId {
-	[_containerStore removeObjectForKey:containerId];
+- (void)removeComponent:(NSString*)componentId {
+	[_componentStore removeObjectForKey:componentId];
 }
 
-- (void)removeContainerByViewControllerInstance:(UIViewController*)containerInstance {
-	NSString *foundKey = [self containerKeyForInstance:containerInstance];
+- (void)removeComponentByViewControllerInstance:(UIViewController*)componentInstance {
+	NSString *foundKey = [self componentKeyForInstance:componentInstance];
 	if (foundKey) {
-		[self removeContainer:foundKey];
+		[self removeComponent:foundKey];
 	}
 }
 
@@ -58,12 +58,12 @@
 -(void)clean {
 	_isReadyToReceiveCommands = false;
 	[_pendingModalIdsToDismiss removeAllObjects];
-	[_containerStore removeAllObjects];
+	[_componentStore removeAllObjects];
 }
 
--(NSString*)containerKeyForInstance:(UIViewController*)instance {
-	for (NSString *key in _containerStore) {
-		UIViewController *value = [_containerStore objectForKey:key];
+-(NSString*)componentKeyForInstance:(UIViewController*)instance {
+	for (NSString *key in _componentStore) {
+		UIViewController *value = [_componentStore objectForKey:key];
 		if (value == instance) {
 			return key;
 		}

lib/ios/RNNTabBarController.h

@@ -5,6 +5,6 @@
 @interface RNNTabBarController : UITabBarController <RNNRootViewProtocol>
 
 - (void)setTabBarHidden:(BOOL)hidden animated:(BOOL)animated;
-- (void)setSelectedIndexByContainerID:(NSString *)containerID;
+- (void)setSelectedIndexByComponentID:(NSString *)componentID;
 
 @end

lib/ios/RNNTabBarController.m

@@ -21,13 +21,13 @@
 	}];
 }
 
-- (void)setSelectedIndexByContainerID:(NSString *)containerID {
+- (void)setSelectedIndexByComponentID:(NSString *)componentID {
 	for (id child in self.childViewControllers) {
 		RNNRootViewController* vc = child;
 		if ([child isKindOfClass:[UINavigationController class]]) {
 			vc = ((UINavigationController *)child).childViewControllers.firstObject;
 		}
-		if ([vc.containerId isEqualToString:containerID]) {
+		if ([vc.componentId isEqualToString:componentID]) {
 			[self setSelectedIndex:[self.childViewControllers indexOfObject:child]];
 		}
 	}

lib/ios/ReactNativeNavigationTests/RNNCommandsHandlerTest.m

@@ -66,7 +66,7 @@
 	[initialOptions.topBar setTitle:@"the title"];
 	RNNRootViewController* vc = [[RNNRootViewController alloc] initWithName:@"name"
 																withOptions:initialOptions
-															withContainerId:@"containerId"
+															withComponentId:@"componentId"
 															rootViewCreator:[[RNNTestRootViewCreator alloc] init]
 															   eventEmitter:nil
 																   animator:nil];
@@ -75,12 +75,12 @@
 	XCTAssertTrue([vc.navigationItem.title isEqual:@"the title"]);
 
 	[self.store setReadyToReceiveCommands:true];
-	[self.store setContainer:vc containerId:@"containerId"];
+	[self.store setComponent:vc componentId:@"componentId"];
 	
 	NSDictionary* dictFromJs = @{@"topBar": @{@"backgroundColor" :@(0xFFFF0000)}};
 	UIColor* expectedColor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
 
-	[self.uut setOptions:@"containerId" options:dictFromJs completion:^{
+	[self.uut setOptions:@"componentId" options:dictFromJs completion:^{
 		XCTAssertTrue([vc.navigationItem.title isEqual:@"the title"]);
 		XCTAssertTrue([nav.navigationBar.barTintColor isEqual:expectedColor]);
 	}];

lib/ios/ReactNativeNavigationTests/RNNControllerFactoryTest.m

@@ -33,33 +33,33 @@
 }
 
 
-- (void)testCreateLayout_ContainerLayout {
+- (void)testCreateLayout_ComponentLayout {
 	
 	id ans = [self.factory createLayoutAndSaveToStore:
 			  @{@"id": @"cntId",
-				@"type": @"Container",
+				@"type": @"Component",
 				@"data": @{},
 				@"children": @[]}];
 	XCTAssertTrue([ans isMemberOfClass:[RNNRootViewController class]]);
 }
 
-- (void)testCreateLayout_ContainerStackLayout {
+- (void)testCreateLayout_ComponentStackLayout {
 	id ans = [self.factory createLayoutAndSaveToStore:
 			  @{@"id": @"cntId",
-				@"type": @"ContainerStack",
+				@"type": @"Stack",
 				@"data": @{},
 				@"children": @[]}];
 	XCTAssertTrue([ans isMemberOfClass:[RNNNavigationController class]]);
 }
 
-- (void)testCreateLayout_ContainerStackLayoutRecursive {
+- (void)testCreateLayout_ComponentStackLayoutRecursive {
 	RNNNavigationController* ans = (RNNNavigationController*) [self.factory createLayoutAndSaveToStore:
 															 @{@"id": @"cntId",
-															   @"type": @"ContainerStack",
+															   @"type": @"Stack",
 															   @"data": @{},
 															   @"children": @[
 																	   @{@"id": @"cntId_2",
-																		 @"type": @"Container",
+																		 @"type": @"Component",
 																		 @"data": @{},
 																		 @"children": @[]}]}];
 	
@@ -76,11 +76,11 @@
 														  @"data": @{},
 														  @"children": @[
 																  @{@"id": @"cntId_2",
-																	@"type": @"ContainerStack",
+																	@"type": @"Stack",
 																	@"data": @{},
 																	@"children": @[
 																			@{@"id": @"cntId_3",
-																			  @"type": @"Container",
+																			  @"type": @"Component",
 																			  @"data": @{},
 																			  @"children": @[]}]}]}];
 	
@@ -96,7 +96,7 @@
 }
 
 
-- (void)testCreateLayout_ContainerSideMenuLayoutCenterLeftRight {
+- (void)testCreateLayout_ComponentSideMenuLayoutCenterLeftRight {
 	RNNSideMenuController *ans = (RNNSideMenuController*) [self.factory createLayoutAndSaveToStore:
 														   @{@"id": @"cntId",
 															 @"type": @"SideMenuRoot",
@@ -107,7 +107,7 @@
 																	   @"data": @{},
 																	   @"children": @[
 																			   @{@"id": @"cntId_3",
-																				 @"type": @"Container",
+																				 @"type": @"Component",
 																				 @"data": @{},
 																				 @"children": @[]}]},
 																	 @{@"id": @"cntI_4",
@@ -115,7 +115,7 @@
 																	   @"data": @{},
 																	   @"children": @[
 																			   @{@"id": @"cntId_5",
-																				 @"type": @"Container",
+																				 @"type": @"Component",
 																				 @"data": @{},
 																				 @"children": @[]}]},
 																	 @{@"id": @"cntI_6",
@@ -123,7 +123,7 @@
 																	   @"data": @{},
 																	   @"children": @[
 																			   @{@"id": @"cntId_7",
-																				 @"type": @"Container",
+																				 @"type": @"Component",
 																				 @"data": @{},
 																				 @"children": @[]}]}]}];
 	XCTAssertTrue([ans isMemberOfClass:[RNNSideMenuController class]]);
@@ -145,15 +145,15 @@
 
 
 
-- (void)testCreateLayout_addContainerToStore {
-	NSString *containerId = @"cntId";
+- (void)testCreateLayout_addComponentToStore {
+	NSString *componentId = @"cntId";
 	UIViewController *ans = [self.factory createLayoutAndSaveToStore:
-							 @{@"id": containerId,
-							   @"type": @"Container",
+							 @{@"id": componentId,
+							   @"type": @"Component",
 							   @"data": @{},
 							   @"children": @[]}];
 	
-	UIViewController *storeAns = [self.store findContainerForId:containerId];
+	UIViewController *storeAns = [self.store findComponentForId:componentId];
 	XCTAssertEqualObjects(ans, storeAns);
 }
 

lib/ios/ReactNativeNavigationTests/RNNNavigationStackManagerTest.m

@@ -44,9 +44,9 @@
 	NSArray *vcArray = @[self.vc1, self.vc2, self.vc3];
 	[self.nvc setViewControllers:vcArray];
 	
-	[self.store setContainer:self.vc1 containerId:@"vc1"];
-	[self.store setContainer:self.vc2 containerId:@"vc2"];
-	[self.store setContainer:self.vc3 containerId:@"vc3"];
+	[self.store setComponent:self.vc1 componentId:@"vc1"];
+	[self.store setComponent:self.vc2 componentId:@"vc2"];
+	[self.store setComponent:self.vc3 componentId:@"vc3"];
 	
 	
 }
@@ -54,18 +54,18 @@
 
 - (void)testPop_removeTopVCFromStore {
 	[self.uut pop:@"vc3" withAnimationData:(NSDictionary*)nil];
-	XCTAssertNil([self.store findContainerForId:@"vc3"]);
-	XCTAssertNotNil([self.store findContainerForId:@"vc2"]);
-	XCTAssertNotNil([self.store findContainerForId:@"vc1"]);
+	XCTAssertNil([self.store findComponentForId:@"vc3"]);
+	XCTAssertNotNil([self.store findComponentForId:@"vc2"]);
+	XCTAssertNotNil([self.store findComponentForId:@"vc1"]);
 }
 
 - (void)testPopToSpecificVC_removeAllPopedVCFromStore {
 	self.nvc.willReturnVCs = @[self.vc2, self.vc3];
 	[self.uut popTo:@"vc1"];
 	
-	XCTAssertNil([self.store findContainerForId:@"vc2"]);
-	XCTAssertNil([self.store findContainerForId:@"vc3"]);
-	XCTAssertNotNil([self.store findContainerForId:@"vc1"]);
+	XCTAssertNil([self.store findComponentForId:@"vc2"]);
+	XCTAssertNil([self.store findComponentForId:@"vc3"]);
+	XCTAssertNotNil([self.store findComponentForId:@"vc1"]);
 	
 }
 
@@ -73,9 +73,9 @@
 	self.nvc.willReturnVCs = @[self.vc2, self.vc3];
 	[self.uut popToRoot:@"vc3"];
 	
-	XCTAssertNil([self.store findContainerForId:@"vc2"]);
-	XCTAssertNil([self.store findContainerForId:@"vc3"]);
-	XCTAssertNotNil([self.store findContainerForId:@"vc1"]);
+	XCTAssertNil([self.store findComponentForId:@"vc2"]);
+	XCTAssertNil([self.store findComponentForId:@"vc3"]);
+	XCTAssertNotNil([self.store findComponentForId:@"vc1"]);
 
 }
 

lib/ios/ReactNativeNavigationTests/RNNRootViewControllerTest.m

@@ -12,7 +12,7 @@
 
 @property (nonatomic, strong) id<RNNRootViewCreator> creator;
 @property (nonatomic, strong) NSString* pageName;
-@property (nonatomic, strong) NSString* containerId;
+@property (nonatomic, strong) NSString* componentId;
 @property (nonatomic, strong) id emitter;
 @property (nonatomic, strong) RNNNavigationOptions* options;
 @property (nonatomic, strong) RNNRootViewController* uut;
@@ -24,10 +24,10 @@
 	[super setUp];
 	self.creator = [[RNNTestRootViewCreator alloc] init];
 	self.pageName = @"somename";
-	self.containerId = @"cntId";
+	self.componentId = @"cntId";
 	self.emitter = nil;
 	self.options = [RNNNavigationOptions new];
-	self.uut = [[RNNRootViewController alloc] initWithName:self.pageName withOptions:self.options withContainerId:self.containerId rootViewCreator:self.creator eventEmitter:self.emitter animator:nil];
+	self.uut = [[RNNRootViewController alloc] initWithName:self.pageName withOptions:self.options withComponentId:self.componentId rootViewCreator:self.creator eventEmitter:self.emitter animator:nil];
 }
 
 -(void)testTopBarBackgroundColor_validColor{

lib/ios/ReactNativeNavigationTests/RNNStoreTest.m

@@ -17,86 +17,86 @@
 }
 
 
-- (void)testFindContainerForId_setAndGetsimpleContainerId {
-	NSString *containerId1 = @"cntId1";
-	NSString *containerId2 = @"cntId2";
+- (void)testFindComponentForId_setAndGetsimpleComponentId {
+	NSString *componentId1 = @"cntId1";
+	NSString *componentId2 = @"cntId2";
 	
 	UIViewController *vc1 = [UIViewController new];
 	UIViewController *vc2 = [UIViewController new];
 	
-	[self.store setContainer:vc1 containerId:containerId1];
-	[self.store setContainer:vc2 containerId:containerId2];
+	[self.store setComponent:vc1 componentId:componentId1];
+	[self.store setComponent:vc2 componentId:componentId2];
 	
-	UIViewController *ans = [self.store findContainerForId:containerId1];
+	UIViewController *ans = [self.store findComponentForId:componentId1];
 	
 	XCTAssertEqualObjects(vc1, ans);
 	XCTAssertNotEqualObjects(vc2, ans);
 }
 
-- (void)testSetContainer_setNilContainerId {
-	NSString *containerId1 = nil;
+- (void)testSetComponent_setNilComponentId {
+	NSString *componentId1 = nil;
 	UIViewController *vc1 = [UIViewController new];
-	[self.store setContainer:vc1 containerId:containerId1];
-	XCTAssertNil([self.store findContainerForId:containerId1]);
+	[self.store setComponent:vc1 componentId:componentId1];
+	XCTAssertNil([self.store findComponentForId:componentId1]);
 	
 }
 
-- (void)testSetContainer_setDoubleContainerId {
-	NSString *containerId1 = @"cntId1";
+- (void)testSetComponent_setDoubleComponentId {
+	NSString *componentId1 = @"cntId1";
 	
 	UIViewController *vc1 = [UIViewController new];
 	UIViewController *vc2 = [UIViewController new];
 	
-	[self.store setContainer:vc1 containerId:containerId1];
+	[self.store setComponent:vc1 componentId:componentId1];
 	
-	UIViewController *ans = [self.store findContainerForId:containerId1];
+	UIViewController *ans = [self.store findComponentForId:componentId1];
 	XCTAssertEqualObjects(vc1, ans);
-	XCTAssertThrows([self.store setContainer:vc2 containerId:containerId1]);
+	XCTAssertThrows([self.store setComponent:vc2 componentId:componentId1]);
 }
 
-- (void)testRemoveContainer_removeExistContainer {
-	NSString *containerId1 = @"cntId1";
+- (void)testRemoveComponent_removeExistComponent {
+	NSString *componentId1 = @"cntId1";
 	UIViewController *vc1 = [UIViewController new];
 	
-	[self.store setContainer:vc1 containerId:containerId1];
+	[self.store setComponent:vc1 componentId:componentId1];
 	
-	UIViewController *ans = [self.store findContainerForId:containerId1];
+	UIViewController *ans = [self.store findComponentForId:componentId1];
 	XCTAssertEqualObjects(vc1, ans);
 	
-	[self.store removeContainer:containerId1];
-	XCTAssertNil([self.store findContainerForId:containerId1]);
+	[self.store removeComponent:componentId1];
+	XCTAssertNil([self.store findComponentForId:componentId1]);
 }
 
 -(void)testPopWillRemoveVcFromStore {
 	NSString *vcId = @"cnt_vc_2";
 	
-	[self setContainerAndRelease:vcId];
+	[self setComponentAndRelease:vcId];
 	
 	
-	XCTAssertNil([self.store findContainerForId:vcId]);
+	XCTAssertNil([self.store findComponentForId:vcId]);
 }
 
 
--(void)testRemoveContainerByInstance {
-	NSString *containerId1 = @"cntId1";
+-(void)testRemoveComponentByInstance {
+	NSString *componentId1 = @"cntId1";
 	UIViewController *vc1 = [UIViewController new];
 	
-	[self.store setContainer:vc1 containerId:containerId1];
-	[self.store removeContainerByViewControllerInstance:vc1];
+	[self.store setComponent:vc1 componentId:componentId1];
+	[self.store removeComponentByViewControllerInstance:vc1];
 	
-	XCTAssertNil([self.store findContainerForId:@"cntId1"]);
+	XCTAssertNil([self.store findComponentForId:@"cntId1"]);
 }
 
 
 #pragma mark - private
 
 
--(void)setContainerAndRelease:(NSString*)vcId {
+-(void)setComponentAndRelease:(NSString*)vcId {
 	@autoreleasepool {
 		UIViewController *vc2 = [UIViewController new];
-		[self.store setContainer:vc2 containerId:vcId];
+		[self.store setComponent:vc2 componentId:vcId];
 		
-		XCTAssertNotNil([self.store findContainerForId:vcId]);
+		XCTAssertNotNil([self.store findComponentForId:vcId]);
 	}
 }
 

lib/src/Navigation.js

@@ -1,17 +1,14 @@
 const NativeCommandsSender = require('./adapters/NativeCommandsSender');
 const NativeEventsReceiver = require('./adapters/NativeEventsReceiver');
 const UniqueIdProvider = require('./adapters/UniqueIdProvider');
-const Store = require('./containers/Store');
-const ContainerRegistry = require('./containers/ContainerRegistry');
+const Store = require('./components/Store');
+const ComponentRegistry = require('./components/ComponentRegistry');
 const Commands = require('./commands/Commands');
 const LayoutTreeParser = require('./commands/LayoutTreeParser');
 const LayoutTreeCrawler = require('./commands/LayoutTreeCrawler');
 const PrivateEventsListener = require('./events/PrivateEventsListener');
 const PublicEventsRegistry = require('./events/PublicEventsRegistry');
 const Element = require('./adapters/Element');
-const Root = require('./params/containers/Root');
-const Container = require('./params/containers/Container');
-const NavigationOptions = require('./params/options/NavigationOptions');
 
 /** @constructor */
 class Navigation {
@@ -19,7 +16,7 @@ class Navigation {
     this.store = new Store();
     this.nativeEventsReceiver = new NativeEventsReceiver();
     this.uniqueIdProvider = new UniqueIdProvider();
-    this.containerRegistry = new ContainerRegistry(this.store);
+    this.componentRegistry = new ComponentRegistry(this.store);
     this.layoutTreeParser = new LayoutTreeParser();
     this.layoutTreeCrawler = new LayoutTreeCrawler(this.uniqueIdProvider, this.store);
     this.nativeCommandsSender = new NativeCommandsSender();
@@ -31,37 +28,37 @@ class Navigation {
   }
 
   /**
-   * Every screen component in your app must be registered with a unique name. The component itself is a traditional React component extending React.Component.
-   * @param {string} containerName Unique container name
-   * @param {function} getContainerFunc generator function, typically `() => require('./myContainer')`
+   * Every navigation component in your app must be registered with a unique name. The component itself is a traditional React component extending React.Component.
+   * @param {string} componentName Unique component name
+   * @param {function} getComponentClassFunc generator function, typically `() => require('./myComponent')`
    */
-  registerContainer(containerName, getContainerFunc) {
-    this.containerRegistry.registerContainer(containerName, getContainerFunc);
+  registerComponent(componentName, getComponentClassFunc) {
+    this.componentRegistry.registerComponent(componentName, getComponentClassFunc);
   }
 
   /**
-   * Reset the navigation stack to a new screen (the stack root is changed).
+   * Reset the navigation stack to a new component (the stack root is changed).
    * @param {Root} root
    */
   setRoot(params) {
-    return this.commands.setRoot(new Root(params));
+    return this.commands.setRoot(params);
   }
 
   /**
    * Set default options to all screens. Useful for declaring a consistent style across the app.
-   * @param {options:NavigationOptions} options
+   * @param {options:Options} options
    */
   setDefaultOptions(options) {
     this.commands.setDefaultOptions(options);
   }
 
   /**
-   * Change a containers navigation options
-   * @param {string} containerId The container's id.
-   * @param {options:NavigationOptions} options
+   * Change a components navigation options
+   * @param {string} componentId The component's id.
+   * @param {options:Options} options
    */
-  setOptions(containerId, options) {
-    this.commands.setOptions(containerId, new NavigationOptions(options));
+  setOptions(componentId, options) {
+    this.commands.setOptions(componentId, options);
   }
 
   /**
@@ -73,11 +70,11 @@ class Navigation {
   }
 
   /**
-   * Dismiss a modal by containerId. The dismissed modal can be anywhere in the stack.
-   * @param {string} containerId The container's id.
+   * Dismiss a modal by componentId. The dismissed modal can be anywhere in the stack.
+   * @param {string} componentId The component's id.
    */
-  dismissModal(containerId) {
-    return this.commands.dismissModal(containerId);
+  dismissModal(componentId) {
+    return this.commands.dismissModal(componentId);
   }
 
   /**
@@ -89,36 +86,36 @@ class Navigation {
 
   /**
    * Push a new screen into this screen's navigation stack.
-   * @param {string} containerId The container's id.
-   * @param {Container} container
+   * @param {string} componentId The component's id.
+   * @param {Component} component
    */
-  push(containerId, container) {
-    return this.commands.push(containerId, new Container(container));
+  push(componentId, component) {
+    return this.commands.push(componentId, component);
   }
 
   /**
-   * Pop a container from the stack, regardless of it's position.
-   * @param {string} containerId The container's id.
+   * Pop a component from the stack, regardless of it's position.
+   * @param {string} componentId The component's id.
    * @param {*} params
    */
-  pop(containerId, params) {
-    return this.commands.pop(containerId, params);
+  pop(componentId, params) {
+    return this.commands.pop(componentId, params);
   }
 
   /**
-   * Pop the stack to a given container
-   * @param {string} containerId The container's id.
+   * Pop the stack to a given component
+   * @param {string} componentId The component's id.
    */
-  popTo(containerId) {
-    return this.commands.popTo(containerId);
+  popTo(componentId) {
+    return this.commands.popTo(componentId);
   }
 
   /**
-   * Pop the container's stack to root.
-   * @param {*} containerId
+   * Pop the component's stack to root.
+   * @param {*} componentId
    */
-  popToRoot(containerId) {
-    return this.commands.popToRoot(containerId);
+  popToRoot(componentId) {
+    return this.commands.popToRoot(componentId);
   }
 
   /**

lib/src/adapters/NativeCommandsSender.js

@@ -13,25 +13,25 @@ class NativeCommandsSender {
     this.nativeCommandsModule.setDefaultOptions(options);
   }
 
-  setOptions(containerId, options) {
-    this.nativeCommandsModule.setOptions(containerId, options);
+  setOptions(componentId, options) {
+    this.nativeCommandsModule.setOptions(componentId, options);
   }
 
-  async push(onContainerId, layout) {
-    const pushedContainerId = await this.nativeCommandsModule.push(onContainerId, layout);
-    return pushedContainerId;
+  async push(onComponentId, layout) {
+    const pushedComponentId = await this.nativeCommandsModule.push(onComponentId, layout);
+    return pushedComponentId;
   }
 
-  pop(containerId, options) {
-    return this.nativeCommandsModule.pop(containerId, options);
+  pop(componentId, options) {
+    return this.nativeCommandsModule.pop(componentId, options);
   }
 
-  popTo(containerId) {
-    return this.nativeCommandsModule.popTo(containerId);
+  popTo(componentId) {
+    return this.nativeCommandsModule.popTo(componentId);
   }
 
-  popToRoot(containerId) {
-    return this.nativeCommandsModule.popToRoot(containerId);
+  popToRoot(componentId) {
+    return this.nativeCommandsModule.popToRoot(componentId);
   }
 
   async showModal(layout) {
@@ -39,8 +39,8 @@ class NativeCommandsSender {
     return completed;
   }
 
-  dismissModal(containerId) {
-    return this.nativeCommandsModule.dismissModal(containerId);
+  dismissModal(componentId) {
+    return this.nativeCommandsModule.dismissModal(componentId);
   }
 
   dismissAllModals() {

lib/src/adapters/NativeEventsReceiver.js

@@ -5,19 +5,19 @@ class NativeEventsReceiver {
     this.emitter = new NativeEventEmitter(NativeModules.RNNEventEmitter);
   }
 
-  containerDidAppear(callback) {
-    this.emitter.addListener('RNN.containerDidAppear', callback);
+  registerComponentDidAppear(callback) {
+    this.emitter.addListener('RNN.componentDidAppear', callback);
   }
 
-  containerDidDisappear(callback) {
-    this.emitter.addListener('RNN.containerDidDisappear', callback);
+  registerComponentDidDisappear(callback) {
+    this.emitter.addListener('RNN.componentDidDisappear', callback);
   }
 
-  appLaunched(callback) {
+  registerAppLaunched(callback) {
     this.emitter.addListener('RNN.appLaunched', callback);
   }
 
-  navigationButtonPressed(callback) {
+  registerNavigationButtonPressed(callback) {
     this.emitter.addListener('RNN.navigationButtonPressed', callback);
   }
 }

lib/src/commands/Commands.js

@@ -10,7 +10,7 @@ class Commands {
 
   setRoot(simpleApi) {
     const input = _.cloneDeep(simpleApi);
-    const layout = this.layoutTreeParser.parseFromSimpleJSON(input);
+    const layout = this.layoutTreeParser.parse(input);
     this.layoutTreeCrawler.crawl(layout);
     return this.nativeCommandsSender.setRoot(layout);
   }
@@ -21,15 +21,15 @@ class Commands {
     this.nativeCommandsSender.setDefaultOptions(input);
   }
 
-  setOptions(containerId, options) {
+  setOptions(componentId, options) {
     const input = _.cloneDeep(options);
     OptionsProcessor.processOptions(input);
-    this.nativeCommandsSender.setOptions(containerId, input);
+    this.nativeCommandsSender.setOptions(componentId, input);
   }
 
   showModal(simpleApi) {
     const input = _.cloneDeep(simpleApi);
-    const layout = this.layoutTreeParser.parseFromSimpleJSON(input);
+    const layout = this.layoutTreeParser.parse(input);
     this.layoutTreeCrawler.crawl(layout);
     return this.nativeCommandsSender.showModal(layout);
   }
@@ -42,39 +42,39 @@ class Commands {
     return this.nativeCommandsSender.dismissAllModals();
   }
 
-  push(onContainerId, containerData) {
-    const input = _.cloneDeep(containerData);
+  push(onComponentId, componentData) {
+    const input = _.cloneDeep(componentData);
     OptionsProcessor.processOptions(input);
-    const layout = this.layoutTreeParser.parseFromSimpleJSON(input);
+    const layout = this.layoutTreeParser.parse(input);
     this.layoutTreeCrawler.crawl(layout);
-    return this.nativeCommandsSender.push(onContainerId, layout);
+    return this.nativeCommandsSender.push(onComponentId, layout);
   }
 
-  pop(containerId, options) {
-    return this.nativeCommandsSender.pop(containerId, options);
+  pop(componentId, options) {
+    return this.nativeCommandsSender.pop(componentId, options);
   }
 
-  popTo(containerId) {
-    return this.nativeCommandsSender.popTo(containerId);
+  popTo(componentId) {
+    return this.nativeCommandsSender.popTo(componentId);
   }
 
-  popToRoot(containerId) {
-    return this.nativeCommandsSender.popToRoot(containerId);
+  popToRoot(componentId) {
+    return this.nativeCommandsSender.popToRoot(componentId);
   }
 
-  showOverlay(type, options) {
-    let promise;
-    if (type === 'custom') {
-      const layout = this.layoutTreeParser.createDialogContainer({ name: options });
-      this.layoutTreeCrawler.crawl(layout);
-      promise = this.nativeCommandsSender.showOverlay(type, layout);
-    } else {
-      const input = _.cloneDeep(options);
-      OptionsProcessor.processOptions(input);
-      promise = this.nativeCommandsSender.showOverlay(type, input);
-    }
-    return promise;
-  }
+  // showOverlay(type, options) {
+    // let promise;
+    // if (type === 'custom') {
+    //   const layout = this.layoutTreeParser.createDialogComponent({ name: options });
+    //   this.layoutTreeCrawler.crawl(layout);
+    //   promise = this.nativeCommandsSender.showOverlay(type, layout);
+    // } else {
+    //   const input = _.cloneDeep(options);
+    //   OptionsProcessor.processOptions(input);
+    //   promise = this.nativeCommandsSender.showOverlay(type, input);
+    // }
+    // return promise;
+  // }
 
   dismissOverlay() {
     return this.nativeCommandsSender.dismissOverlay();

lib/src/commands/Commands.test.js

@@ -1,7 +1,6 @@
-const SimpleLayouts = require('./SimpleLayouts');
 const LayoutTreeParser = require('./LayoutTreeParser');
 const LayoutTreeCrawler = require('./LayoutTreeCrawler');
-const Store = require('../containers/Store');
+const Store = require('../components/Store');
 const UniqueIdProvider = require('../adapters/UniqueIdProvider.mock');
 const NativeCommandsSender = require('../adapters/NativeCommandsSender.mock');
 const Commands = require('./Commands');
@@ -21,44 +20,41 @@ describe('Commands', () => {
   describe('setRoot', () => {
     it('sends setRoot to native after parsing into a correct layout tree', () => {
       uut.setRoot({
-        container: {
+        component: {
           name: 'com.example.MyScreen'
         }
       });
       expect(mockCommandsSender.setRoot).toHaveBeenCalledTimes(1);
       expect(mockCommandsSender.setRoot).toHaveBeenCalledWith({
-        type: 'ContainerStack',
-        id: 'ContainerStack+UNIQUE_ID',
-        data: {},
-        children: [
-          {
-            type: 'Container',
-            id: 'Container+UNIQUE_ID',
-            children: [],
-            data: {
-              name: 'com.example.MyScreen',
-              navigationOptions: {}
-            }
-          }
-        ]
+        type: 'Component',
+        id: 'Component+UNIQUE_ID',
+        children: [],
+        data: {
+          name: 'com.example.MyScreen',
+          options: {}
+        }
       });
     });
 
     it('deep clones input to avoid mutation errors', () => {
       const obj = {};
-      uut.setRoot({ container: { name: 'bla', inner: obj } });
-      expect(mockCommandsSender.setRoot.mock.calls[0][0].children[0].data.inner).not.toBe(obj);
+      uut.setRoot({ component: { name: 'bla', inner: obj } });
+      expect(mockCommandsSender.setRoot.mock.calls[0][0].data.inner).not.toBe(obj);
     });
 
-    it('passProps into containers', () => {
-      expect(store.getPropsForContainerId('Container+UNIQUE_ID')).toEqual({});
-      uut.setRoot(SimpleLayouts.singleScreenWithAditionalParams);
-      expect(store.getPropsForContainerId('Container+UNIQUE_ID')).toEqual(SimpleLayouts.passProps);
+    it('passProps into components', () => {
+      const passProps = {
+        fn: () => 'Hello'
+      };
+      expect(store.getPropsForComponentId('Component+UNIQUE_ID')).toEqual({});
+      uut.setRoot({ component: { name: 'asd', passProps } });
+      expect(store.getPropsForComponentId('Component+UNIQUE_ID')).toEqual(passProps);
+      expect(store.getPropsForComponentId('Component+UNIQUE_ID').fn()).toEqual('Hello');
     });
 
     it('returns a promise with the resolved layout', async () => {
       mockCommandsSender.setRoot.mockReturnValue(Promise.resolve('the resolved layout'));
-      const result = await uut.setRoot({ container: { name: 'com.example.MyScreen' } });
+      const result = await uut.setRoot({ component: { name: 'com.example.MyScreen' } });
       expect(result).toEqual('the resolved layout');
     });
   });
@@ -66,14 +62,14 @@ describe('Commands', () => {
   describe('setOptions', () => {
     it('deep clones input to avoid mutation errors', () => {
       const obj = { title: 'test' };
-      uut.setOptions('theContainerId', obj);
+      uut.setOptions('theComponentId', obj);
       expect(mockCommandsSender.setOptions.mock.calls[0][1]).not.toBe(obj);
     });
 
-    it('passes options for container', () => {
-      uut.setOptions('theContainerId', { title: '1' });
+    it('passes options for component', () => {
+      uut.setOptions('theComponentId', { title: '1' });
       expect(mockCommandsSender.setOptions).toHaveBeenCalledTimes(1);
-      expect(mockCommandsSender.setOptions).toHaveBeenCalledWith('theContainerId', { title: '1' });
+      expect(mockCommandsSender.setOptions).toHaveBeenCalledWith('theComponentId', { title: '1' });
     });
   });
 
@@ -88,47 +84,45 @@ describe('Commands', () => {
   describe('showModal', () => {
     it('sends command to native after parsing into a correct layout tree', () => {
       uut.showModal({
-        container: {
+        component: {
           name: 'com.example.MyScreen'
         }
       });
       expect(mockCommandsSender.showModal).toHaveBeenCalledTimes(1);
       expect(mockCommandsSender.showModal).toHaveBeenCalledWith({
-        type: 'ContainerStack',
-        id: 'ContainerStack+UNIQUE_ID',
-        data: {},
-        children: [{
-          type: 'Container',
-          id: 'Container+UNIQUE_ID',
-          data: {
-            name: 'com.example.MyScreen',
-            navigationOptions: {}
-          },
-          children: []
-        }]
+        type: 'Component',
+        id: 'Component+UNIQUE_ID',
+        data: {
+          name: 'com.example.MyScreen',
+          options: {}
+        },
+        children: []
       });
     });
 
     it('deep clones input to avoid mutation errors', () => {
       const obj = {};
-      uut.showModal({ container: { name: 'name', inner: obj } });
+      uut.showModal({ component: { name: 'name', inner: obj } });
       expect(mockCommandsSender.showModal.mock.calls[0][0].data.inner).not.toBe(obj);
     });
 
-    it('passProps into containers', () => {
-      expect(store.getPropsForContainerId('Container+UNIQUE_ID')).toEqual({});
+    it('passProps into components', () => {
+      const passProps = {
+        fn: () => 'hello'
+      };
+      expect(store.getPropsForComponentId('Component+UNIQUE_ID')).toEqual({});
       uut.showModal({
-        container: {
+        component: {
           name: 'com.example.MyScreen',
-          passProps: SimpleLayouts.passProps
+          passProps
         }
       });
-      expect(store.getPropsForContainerId('Container+UNIQUE_ID')).toEqual(SimpleLayouts.passProps);
+      expect(store.getPropsForComponentId('Component+UNIQUE_ID')).toEqual(passProps);
     });
 
     it('returns a promise with the resolved layout', async () => {
       mockCommandsSender.showModal.mockReturnValue(Promise.resolve('the resolved layout'));
-      const result = await uut.showModal({ container: { name: 'com.example.MyScreen' } });
+      const result = await uut.showModal({ component: { name: 'com.example.MyScreen' } });
       expect(result).toEqual('the resolved layout');
     });
   });
@@ -164,25 +158,25 @@ describe('Commands', () => {
   describe('push', () => {
     it('deep clones input to avoid mutation errors', () => {
       const obj = {};
-      uut.push('theContainerId', { name: 'name', inner: { foo: obj } });
-      expect(mockCommandsSender.push.mock.calls[0][1].data.inner.foo).not.toBe(obj);
+      uut.push('theComponentId', { component: { name: 'name', passProps: { foo: obj } } });
+      expect(mockCommandsSender.push.mock.calls[0][1].data.passProps.foo).not.toBe(obj);
     });
 
     it('resolves with the parsed layout', async () => {
       mockCommandsSender.push.mockReturnValue(Promise.resolve('the resolved layout'));
-      const result = await uut.push('theContainerId', { name: 'com.example.MyScreen' });
+      const result = await uut.push('theComponentId', { component: { name: 'com.example.MyScreen' } });
       expect(result).toEqual('the resolved layout');
     });
 
     it('parses into correct layout node and sends to native', () => {
-      uut.push('theContainerId', { name: 'com.example.MyScreen' });
+      uut.push('theComponentId', { component: { name: 'com.example.MyScreen' } });
       expect(mockCommandsSender.push).toHaveBeenCalledTimes(1);
-      expect(mockCommandsSender.push).toHaveBeenCalledWith('theContainerId', {
-        type: 'Container',
-        id: 'Container+UNIQUE_ID',
+      expect(mockCommandsSender.push).toHaveBeenCalledWith('theComponentId', {
+        type: 'Component',
+        id: 'Component+UNIQUE_ID',
         data: {
           name: 'com.example.MyScreen',
-          navigationOptions: {}
+          options: {}
         },
         children: []
       });
@@ -190,60 +184,61 @@ describe('Commands', () => {
   });
 
   describe('pop', () => {
-    it('pops a container, passing containerId', () => {
-      uut.pop('theContainerId');
+    it('pops a component, passing componentId', () => {
+      uut.pop('theComponentId');
       expect(mockCommandsSender.pop).toHaveBeenCalledTimes(1);
-      expect(mockCommandsSender.pop).toHaveBeenCalledWith('theContainerId', undefined);
+      expect(mockCommandsSender.pop).toHaveBeenCalledWith('theComponentId', undefined);
     });
-    it('pops a container, passing containerId and options', () => {
+    it('pops a component, passing componentId and options', () => {
       const options = {
         customTransition: {
           animations: [
             { type: 'sharedElement', fromId: 'title2', toId: 'title1', startDelay: 0, springVelocity: 0.2, duration: 0.5 }
           ],
           duration: 0.8
-        } };
-      uut.pop('theContainerId', options);
+        }
+      };
+      uut.pop('theComponentId', options);
       expect(mockCommandsSender.pop).toHaveBeenCalledTimes(1);
-      expect(mockCommandsSender.pop).toHaveBeenCalledWith('theContainerId', options);
+      expect(mockCommandsSender.pop).toHaveBeenCalledWith('theComponentId', options);
     });
 
-    it('pop returns a promise that resolves to containerId', async () => {
-      mockCommandsSender.pop.mockReturnValue(Promise.resolve('theContainerId'));
-      const result = await uut.pop('theContainerId');
-      expect(result).toEqual('theContainerId');
+    it('pop returns a promise that resolves to componentId', async () => {
+      mockCommandsSender.pop.mockReturnValue(Promise.resolve('theComponentId'));
+      const result = await uut.pop('theComponentId');
+      expect(result).toEqual('theComponentId');
     });
   });
 
   describe('popTo', () => {
-    it('pops all containers until the passed Id is top', () => {
-      uut.popTo('theContainerId');
+    it('pops all components until the passed Id is top', () => {
+      uut.popTo('theComponentId');
       expect(mockCommandsSender.popTo).toHaveBeenCalledTimes(1);
-      expect(mockCommandsSender.popTo).toHaveBeenCalledWith('theContainerId');
+      expect(mockCommandsSender.popTo).toHaveBeenCalledWith('theComponentId');
     });
 
     it('returns a promise that resolves to targetId', async () => {
-      mockCommandsSender.popTo.mockReturnValue(Promise.resolve('theContainerId'));
-      const result = await uut.popTo('theContainerId');
-      expect(result).toEqual('theContainerId');
+      mockCommandsSender.popTo.mockReturnValue(Promise.resolve('theComponentId'));
+      const result = await uut.popTo('theComponentId');
+      expect(result).toEqual('theComponentId');
     });
   });
 
   describe('popToRoot', () => {
-    it('pops all containers to root', () => {
-      uut.popToRoot('theContainerId');
+    it('pops all components to root', () => {
+      uut.popToRoot('theComponentId');
       expect(mockCommandsSender.popToRoot).toHaveBeenCalledTimes(1);
-      expect(mockCommandsSender.popToRoot).toHaveBeenCalledWith('theContainerId');
+      expect(mockCommandsSender.popToRoot).toHaveBeenCalledWith('theComponentId');
     });
 
     it('returns a promise that resolves to targetId', async () => {
-      mockCommandsSender.popToRoot.mockReturnValue(Promise.resolve('theContainerId'));
-      const result = await uut.popToRoot('theContainerId');
-      expect(result).toEqual('theContainerId');
+      mockCommandsSender.popToRoot.mockReturnValue(Promise.resolve('theComponentId'));
+      const result = await uut.popToRoot('theComponentId');
+      expect(result).toEqual('theComponentId');
     });
   });
 
-  describe('showOverlay', () => {
+  xdescribe('showOverlay', () => {
     it('deep clones input to avoid mutation errors', () => {
       const obj = { title: 'test' };
       uut.showOverlay('alert', obj);

lib/src/commands/LayoutExamples.js

@@ -0,0 +1,125 @@
+const passProps = {
+  strProp: 'string prop',
+  numProp: 12345,
+  objProp: { inner: { foo: 'bar' } },
+  fnProp: () => 'Hello from a function'
+};
+
+const options = {
+  topBar: {
+    title: 'Hello1'
+  }
+};
+
+const singleComponent = {
+  component: {
+    name: 'MyReactComponent',
+    options,
+    passProps
+  }
+};
+
+const stackWithTopBar = {
+  stack: {
+    children: [
+      {
+        component: {
+          name: 'MyReactComponent1'
+        }
+      },
+      {
+        component: {
+          name: 'MyReactComponent2',
+          options
+        }
+      }
+    ],
+    options
+  }
+};
+
+const bottomTabs = {
+  bottomTabs: {
+    children: [
+      stackWithTopBar,
+      stackWithTopBar,
+      {
+        component: {
+          name: 'MyReactComponent1'
+        }
+      }
+    ]
+  }
+};
+
+const sideMenu = {
+  sideMenu: {
+    left: singleComponent,
+    center: stackWithTopBar,
+    right: singleComponent
+  }
+};
+
+const topTabs = {
+  topTabs: {
+    children: [
+      singleComponent,
+      singleComponent,
+      singleComponent,
+      singleComponent,
+      stackWithTopBar
+    ],
+    options
+  }
+};
+
+const complexLayout = {
+  sideMenu: {
+    left: singleComponent,
+    center: {
+      bottomTabs: {
+        children: [
+          stackWithTopBar,
+          stackWithTopBar,
+          {
+            stack: {
+              children: [
+                {
+                  topTabs: {
+                    children: [
+                      stackWithTopBar,
+                      stackWithTopBar,
+                      {
+                        topTabs: {
+                          options,
+                          children: [
+                            singleComponent,
+                            singleComponent,
+                            singleComponent,
+                            singleComponent,
+                            stackWithTopBar
+                          ]
+                        }
+                      }
+                    ]
+                  }
+                }
+              ]
+            }
+          }
+        ]
+      }
+    }
+  }
+};
+
+module.exports = {
+  passProps,
+  options,
+  singleComponent,
+  stackWithTopBar,
+  bottomTabs,
+  sideMenu,
+  topTabs,
+  complexLayout
+};

lib/src/commands/LayoutTreeCrawler.js

@@ -14,28 +14,28 @@ class LayoutTreeCrawler {
     node.id = this.uniqueIdProvider.generate(node.type);
     node.data = node.data || {};
     node.children = node.children || [];
-    if ([LayoutTypes.Container, LayoutTypes.TopTab].includes(node.type)) {
-      this._handleContainer(node);
+    if (_.isEqual(node.type, LayoutTypes.Component)) {
+      this._handleComponent(node);
     }
     _.forEach(node.children, this.crawl);
   }
 
-  _handleContainer(node) {
-    this._assertContainerDataName(node);
+  _handleComponent(node) {
+    this._assertComponentDataName(node);
     this._savePropsToStore(node);
-    this._applyStaticNavigationOptions(node);
-    OptionsProcessor.processOptions(node.data.navigationOptions);
+    this._applyStaticOptions(node);
+    OptionsProcessor.processOptions(node.data.options);
   }
 
   _savePropsToStore(node) {
-    this.store.setPropsForContainerId(node.id, node.data.passProps);
+    this.store.setPropsForComponentId(node.id, node.data.passProps);
   }
 
-  _applyStaticNavigationOptions(node) {
-    const clazz = this.store.getOriginalContainerClassForName(node.data.name) || {};
-    const staticOptions = _.cloneDeep(clazz.navigationOptions) || {};
-    const passedOptions = _.cloneDeep(node.data.navigationOptions) || {};
-    node.data.navigationOptions = _.merge({}, staticOptions, passedOptions);
+  _applyStaticOptions(node) {
+    const clazz = this.store.getOriginalComponentClassForName(node.data.name) || {};
+    const staticOptions = _.cloneDeep(clazz.options) || {};
+    const passedOptions = node.data.options || {};
+    node.data.options = _.merge({}, staticOptions, passedOptions);
   }
 
   _assertKnownLayoutType(type) {
@@ -44,9 +44,9 @@ class LayoutTreeCrawler {
     }
   }
 
-  _assertContainerDataName(container) {
-    if (!container.data.name) {
-      throw new Error('Missing container data.name');
+  _assertComponentDataName(component) {
+    if (!component.data.name) {
+      throw new Error('Missing component data.name');
     }
   }
 }

lib/src/commands/LayoutTreeCrawler.test.js

@@ -1,6 +1,6 @@
 const LayoutTypes = require('./LayoutTypes');
 const LayoutTreeCrawler = require('./LayoutTreeCrawler');
-const Store = require('../containers/Store');
+const Store = require('../components/Store');
 const UniqueIdProvider = require('../adapters/UniqueIdProvider.mock');
 
 describe('LayoutTreeCrawler', () => {
@@ -13,55 +13,55 @@ describe('LayoutTreeCrawler', () => {
   });
 
   it('crawls a layout tree and adds unique id to each node', () => {
-    const node = { type: LayoutTypes.ContainerStack, children: [{ type: LayoutTypes.BottomTabs }] };
+    const node = { type: LayoutTypes.Stack, children: [{ type: LayoutTypes.BottomTabs }] };
     uut.crawl(node);
-    expect(node.id).toEqual('ContainerStack+UNIQUE_ID');
+    expect(node.id).toEqual('Stack+UNIQUE_ID');
     expect(node.children[0].id).toEqual('BottomTabs+UNIQUE_ID');
   });
 
   it('crawls a layout tree and ensures data exists', () => {
-    const node = { type: LayoutTypes.ContainerStack, children: [{ type: LayoutTypes.BottomTabs }] };
+    const node = { type: LayoutTypes.Stack, children: [{ type: LayoutTypes.BottomTabs }] };
     uut.crawl(node);
     expect(node.data).toEqual({});
     expect(node.children[0].data).toEqual({});
   });
 
   it('crawls a layout tree and ensures children exists', () => {
-    const node = { type: LayoutTypes.ContainerStack, children: [{ type: LayoutTypes.BottomTabs }] };
+    const node = { type: LayoutTypes.Stack, children: [{ type: LayoutTypes.BottomTabs }] };
     uut.crawl(node);
     expect(node.children[0].children).toEqual([]);
   });
 
   it('crawls a layout tree and asserts known layout type', () => {
-    const node = { type: LayoutTypes.ContainerStack, children: [{ type: 'Bob' }] };
+    const node = { type: LayoutTypes.Stack, children: [{ type: 'Bob' }] };
     expect(() => uut.crawl(node)).toThrow(new Error('Unknown layout type Bob'));
   });
 
-  it('saves passProps into store for Container nodes', () => {
+  it('saves passProps into store for Component nodes', () => {
     const node = {
       type: LayoutTypes.BottomTabs, children: [
-        { type: LayoutTypes.Container, data: { name: 'the name', passProps: { myProp: 123 } } }]
+        { type: LayoutTypes.Component, data: { name: 'the name', passProps: { myProp: 123 } } }]
     };
-    expect(store.getPropsForContainerId('Container+UNIQUE_ID')).toEqual({});
+    expect(store.getPropsForComponentId('Component+UNIQUE_ID')).toEqual({});
     uut.crawl(node);
-    expect(store.getPropsForContainerId('Container+UNIQUE_ID')).toEqual({ myProp: 123 });
+    expect(store.getPropsForComponentId('Component+UNIQUE_ID')).toEqual({ myProp: 123 });
   });
 
-  it('Containers: injects navigationOptions from original container class static property', () => {
+  it('Components: injects options from original component class static property', () => {
     const theStyle = {};
-    const MyContainer = class {
-      static get navigationOptions() {
+    const MyComponent = class {
+      static get options() {
         return theStyle;
       }
     };
 
-    const node = { type: LayoutTypes.Container, data: { name: 'theContainerName' } };
-    store.setOriginalContainerClassForName('theContainerName', MyContainer);
+    const node = { type: LayoutTypes.Component, data: { name: 'theComponentName' } };
+    store.setOriginalComponentClassForName('theComponentName', MyComponent);
     uut.crawl(node);
-    expect(node.data.navigationOptions).toEqual(theStyle);
+    expect(node.data.options).toEqual(theStyle);
   });
 
-  it('Containers: merges navigationOptions from container class static property with passed options, favoring passed options', () => {
+  it('Components: merges options from component class static property with passed options, favoring passed options', () => {
     const theStyle = {
       bazz: 123,
       inner: {
@@ -69,8 +69,8 @@ describe('LayoutTreeCrawler', () => {
       },
       opt: 'exists only in static'
     };
-    const MyContainer = class {
-      static get navigationOptions() {
+    const MyComponent = class {
+      static get options() {
         return theStyle;
       }
     };
@@ -83,12 +83,12 @@ describe('LayoutTreeCrawler', () => {
       }
     };
 
-    const node = { type: LayoutTypes.Container, data: { name: 'theContainerName', navigationOptions: passedOptions } };
-    store.setOriginalContainerClassForName('theContainerName', MyContainer);
+    const node = { type: LayoutTypes.Component, data: { name: 'theComponentName', options: passedOptions } };
+    store.setOriginalComponentClassForName('theComponentName', MyComponent);
 
     uut.crawl(node);
 
-    expect(node.data.navigationOptions).toEqual({
+    expect(node.data.options).toEqual({
       aaa: 'exists only in passed',
       bazz: 789,
       inner: {
@@ -98,113 +98,113 @@ describe('LayoutTreeCrawler', () => {
     });
   });
 
-  it('Containers: deepClones navigationOptions', () => {
+  it('Component: deepClones options', () => {
     const theStyle = {};
-    const MyContainer = class {
-      static get navigationOptions() {
+    const MyComponent = class {
+      static get options() {
         return theStyle;
       }
     };
 
-    const node = { type: LayoutTypes.Container, data: { name: 'theContainerName' } };
-    store.setOriginalContainerClassForName('theContainerName', MyContainer);
+    const node = { type: LayoutTypes.Component, data: { name: 'theComponentName' } };
+    store.setOriginalComponentClassForName('theComponentName', MyComponent);
     uut.crawl(node);
-    expect(node.data.navigationOptions).not.toBe(theStyle);
+    expect(node.data.options).not.toBe(theStyle);
   });
 
-  it('Containers: must contain data name', () => {
-    const node = { type: LayoutTypes.Container, data: {} };
-    expect(() => uut.crawl(node)).toThrow(new Error('Missing container data.name'));
+  it('Components: must contain data name', () => {
+    const node = { type: LayoutTypes.Component, data: {} };
+    expect(() => uut.crawl(node)).toThrow(new Error('Missing component data.name'));
   });
 
-  it('Containers: navigationOptions default obj', () => {
-    const MyContainer = class { };
+  it('Components: options default obj', () => {
+    const MyComponent = class { };
 
-    const node = { type: LayoutTypes.Container, data: { name: 'theContainerName' } };
-    store.setOriginalContainerClassForName('theContainerName', MyContainer);
+    const node = { type: LayoutTypes.Component, data: { name: 'theComponentName' } };
+    store.setOriginalComponentClassForName('theComponentName', MyComponent);
     uut.crawl(node);
-    expect(node.data.navigationOptions).toEqual({});
+    expect(node.data.options).toEqual({});
   });
 
   describe('navigation options', () => {
-    let navigationOptions;
+    let options;
     let node;
 
     beforeEach(() => {
-      navigationOptions = {};
-      node = { type: LayoutTypes.Container, data: { name: 'theContainerName', navigationOptions } };
+      options = {};
+      node = { type: LayoutTypes.Component, data: { name: 'theComponentName', options } };
     });
 
     it('processes colors into numeric AARRGGBB', () => {
-      navigationOptions.someKeyColor = 'red';
+      options.someKeyColor = 'red';
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(0xffff0000);
+      expect(node.data.options.someKeyColor).toEqual(0xffff0000);
     });
 
     it('processes colors into numeric AARRGGBB', () => {
-      navigationOptions.someKeyColor = 'yellow';
+      options.someKeyColor = 'yellow';
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(0xffffff00);
+      expect(node.data.options.someKeyColor).toEqual(0xffffff00);
     });
 
     it('processes numeric colors', () => {
-      navigationOptions.someKeyColor = '#123456';
+      options.someKeyColor = '#123456';
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(0xff123456);
+      expect(node.data.options.someKeyColor).toEqual(0xff123456);
     });
 
     it('processes numeric colors with rrggbbAA', () => {
-      navigationOptions.someKeyColor = 0x123456ff; // wut
+      options.someKeyColor = 0x123456ff; // wut
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(0xff123456);
+      expect(node.data.options.someKeyColor).toEqual(0xff123456);
     });
 
     it('process colors with rgb functions', () => {
-      navigationOptions.someKeyColor = 'rgb(255, 0, 255)';
+      options.someKeyColor = 'rgb(255, 0, 255)';
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(0xffff00ff);
+      expect(node.data.options.someKeyColor).toEqual(0xffff00ff);
     });
 
     it('process colors with special words', () => {
-      navigationOptions.someKeyColor = 'fuchsia';
+      options.someKeyColor = 'fuchsia';
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(0xffff00ff);
+      expect(node.data.options.someKeyColor).toEqual(0xffff00ff);
     });
 
     it('process colors with hsla functions', () => {
-      navigationOptions.someKeyColor = 'hsla(360, 100%, 100%, 1.0)';
+      options.someKeyColor = 'hsla(360, 100%, 100%, 1.0)';
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(0xffffffff);
+      expect(node.data.options.someKeyColor).toEqual(0xffffffff);
     });
 
     it('unknown colors return undefined', () => {
-      navigationOptions.someKeyColor = 'wut';
+      options.someKeyColor = 'wut';
       uut.crawl(node);
-      expect(node.data.navigationOptions.someKeyColor).toEqual(undefined);
+      expect(node.data.options.someKeyColor).toEqual(undefined);
     });
 
     it('any keys ending with Color', () => {
-      navigationOptions.otherKeyColor = 'red';
-      navigationOptions.yetAnotherColor = 'blue';
-      navigationOptions.andAnotherColor = 'rgb(0, 255, 0)';
+      options.otherKeyColor = 'red';
+      options.yetAnotherColor = 'blue';
+      options.andAnotherColor = 'rgb(0, 255, 0)';
       uut.crawl(node);
-      expect(node.data.navigationOptions.otherKeyColor).toEqual(0xffff0000);
-      expect(node.data.navigationOptions.yetAnotherColor).toEqual(0xff0000ff);
-      expect(node.data.navigationOptions.andAnotherColor).toEqual(0xff00ff00);
+      expect(node.data.options.otherKeyColor).toEqual(0xffff0000);
+      expect(node.data.options.yetAnotherColor).toEqual(0xff0000ff);
+      expect(node.data.options.andAnotherColor).toEqual(0xff00ff00);
     });
 
     it('keys ending with Color case sensitive', () => {
-      navigationOptions.otherKey_color = 'red'; // eslint-disable-line camelcase
+      options.otherKey_color = 'red'; // eslint-disable-line camelcase
       uut.crawl(node);
-      expect(node.data.navigationOptions.otherKey_color).toEqual('red');
+      expect(node.data.options.otherKey_color).toEqual('red');
     });
 
     it('any nested recursive keys ending with Color', () => {
-      navigationOptions.innerObj = { theKeyColor: 'red' };
-      navigationOptions.innerObj.innerMostObj = { anotherColor: 'yellow' };
+      options.innerObj = { theKeyColor: 'red' };
+      options.innerObj.innerMostObj = { anotherColor: 'yellow' };
       uut.crawl(node);
-      expect(node.data.navigationOptions.innerObj.theKeyColor).toEqual(0xffff0000);
-      expect(node.data.navigationOptions.innerObj.innerMostObj.anotherColor).toEqual(0xffffff00);
+      expect(node.data.options.innerObj.theKeyColor).toEqual(0xffff0000);
+      expect(node.data.options.innerObj.innerMostObj.anotherColor).toEqual(0xffffff00);
     });
   });
 });

lib/src/commands/LayoutTreeParser.js

@@ -2,97 +2,91 @@ const _ = require('lodash');
 const LayoutTypes = require('./LayoutTypes');
 
 class LayoutTreeParser {
+  constructor() {
+    this.parse = this.parse.bind(this);
+  }
+
   /**
-   * returns correct layout tree of {type, children, data?}
+   * returns correct layout tree of nodes which are { type, data, children }
    */
-  parseFromSimpleJSON(simpleJsonApi) {
-    if (simpleJsonApi.sideMenu) {
-      return this._createSideMenu(simpleJsonApi);
-    }
-    if (simpleJsonApi.bottomTabs) {
-      return this._createTabs(simpleJsonApi.bottomTabs);
-    }
-    if (simpleJsonApi.topTabs) {
-      return this._createTopTabs(simpleJsonApi);
-    }
-    if (simpleJsonApi.name) {
-      return this._createContainer(simpleJsonApi);
+  parse(api) {
+    if (api.topTabs) {
+      return this._topTabs(api.topTabs);
+    } else if (api.sideMenu) {
+      return this._sideMenu(api.sideMenu);
+    } else if (api.bottomTabs) {
+      return this._bottomTabs(api.bottomTabs);
+    } else if (api.stack) {
+      return this._stack(api.stack);
+    } else if (api.component) {
+      return this._component(api.component);
     }
-    return this._createContainerStackWithContainerData(simpleJsonApi.container);
+    throw new Error(`unknown LayoutType "${_.keys(api)}"`);
   }
 
-  createDialogContainer(data) {
-    return {
-      type: LayoutTypes.CustomDialog,
-      data,
-      children: []
-    };
-  }
-
-  _createTabs(tabs) {
-    return {
-      type: LayoutTypes.BottomTabs,
-      children: _.map(tabs, (t) => this._createContainerStackWithContainerData(t.container))
-    };
-  }
-
-  _createTopTabs(node) {
+  _topTabs(api) {
     return {
       type: LayoutTypes.TopTabs,
-      data: _.pick(node, 'navigationOptions'),
-      children: _.map(node.topTabs, (t) => this._createTopTab(t))
-    };
-  }
-
-  _createTopTab(data) {
-    return {
-      type: LayoutTypes.TopTab,
-      data,
-      children: []
+      data: { options: api.options },
+      children: _.map(api.children, this.parse)
     };
   }
 
-  _createContainerStackWithContainerData(containerData) {
-    return {
-      type: LayoutTypes.ContainerStack,
-      children: [this._createContainer(containerData)]
-    };
-  }
-
-  _createSideMenu(layout) {
+  _sideMenu(api) {
     return {
       type: LayoutTypes.SideMenuRoot,
-      children: this._createSideMenuChildren(layout)
+      data: { options: api.options },
+      children: this._sideMenuChildren(api)
     };
   }
 
-  _createSideMenuChildren(layout) {
+  _sideMenuChildren(api) {
+    if (!api.center) {
+      throw new Error(`sideMenu.center is required`);
+    }
     const children = [];
-    if (layout.sideMenu.left) {
+    if (api.left) {
       children.push({
         type: LayoutTypes.SideMenuLeft,
-        children: [this._createContainer(layout.sideMenu.left.container)]
+        data: {},
+        children: [this.parse(api.left)]
       });
     }
     children.push({
       type: LayoutTypes.SideMenuCenter,
-      children: [
-        layout.bottomTabs ? this._createTabs(layout.bottomTabs) : this._createContainerStackWithContainerData(layout.container)
-      ]
+      data: {},
+      children: [this.parse(api.center)]
     });
-    if (layout.sideMenu.right) {
+    if (api.right) {
       children.push({
         type: LayoutTypes.SideMenuRight,
-        children: [this._createContainer(layout.sideMenu.right.container)]
+        data: {},
+        children: [this.parse(api.right)]
       });
     }
     return children;
   }
 
-  _createContainer(data) {
+  _bottomTabs(api) {
+    return {
+      type: LayoutTypes.BottomTabs,
+      data: { options: api.options },
+      children: _.map(api.children, this.parse)
+    };
+  }
+
+  _stack(api) {
+    return {
+      type: LayoutTypes.Stack,
+      data: { name: api.name, options: api.options },
+      children: _.map(api.children, this.parse)
+    };
+  }
+
+  _component(api) {
     return {
-      type: LayoutTypes.Container,
-      data,
+      type: LayoutTypes.Component,
+      data: { name: api.name, options: api.options, passProps: api.passProps },
       children: []
     };
   }

lib/src/commands/LayoutTreeParser.test.js

@@ -1,5 +1,7 @@
-const SimpleLayouts = require('./SimpleLayouts');
 const LayoutTreeParser = require('./LayoutTreeParser');
+const LayoutTypes = require('./LayoutTypes');
+const _ = require('lodash');
+const Examples = require('./LayoutExamples');
 
 describe('LayoutTreeParser', () => {
   let uut;
@@ -8,325 +10,120 @@ describe('LayoutTreeParser', () => {
     uut = new LayoutTreeParser();
   });
 
-  describe('parseFromSimpleJSON', () => {
-    it('parses single screen', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.singleScreenApp))
-        .toEqual({
-          type: 'ContainerStack',
-          children: [
-            {
-              type: 'Container',
-              data: {
-                name: 'com.example.MyScreen'
-              },
-              children: []
-            }
-          ]
-        });
+  describe('parses into { type, data, children }', () => {
+    it('unknown type', () => {
+      expect(() => uut.parse({ wut: {} })).toThrow(new Error('unknown LayoutType "wut"'));
     });
 
-    it('parses single screen with props', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.singleScreenWithAditionalParams))
-        .toEqual({
-          type: 'ContainerStack',
-          children: [
-            {
-              type: 'Container',
-              children: [],
-              data: {
-                name: 'com.example.MyScreen',
-                passProps: SimpleLayouts.passProps,
-                style: {},
-                buttons: {}
-              }
-            }
-          ]
-        });
-      const parsedPropsFn = uut.parseFromSimpleJSON(SimpleLayouts.singleScreenWithAditionalParams)
-        .children[0].data.passProps.fnProp;
-      expect(parsedPropsFn).toBe(SimpleLayouts.passProps.fnProp);
-      expect(parsedPropsFn()).toEqual('Hello from a function');
+    it('single component', () => {
+      expect(uut.parse(Examples.singleComponent)).toEqual({
+        type: LayoutTypes.Component,
+        data: { name: 'MyReactComponent', options: Examples.options, passProps: Examples.passProps },
+        children: []
+      });
     });
 
-    it('parses tab based', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.tabBasedApp))
-        .toEqual({
-          type: 'BottomTabs',
-          children: [
-            {
-              type: 'ContainerStack',
-              children: [
-                {
-                  type: 'Container',
-                  children: [],
-                  data: {
-                    name: 'com.example.ATab'
-                  }
-                }
-              ]
-            },
-            {
-              type: 'ContainerStack',
-              children: [
-                {
-                  type: 'Container',
-                  children: [],
-                  data: {
-                    name: 'com.example.SecondTab'
-                  }
-                }
-              ]
-            },
-            {
-              type: 'ContainerStack',
-              children: [
-                {
-                  type: 'Container',
-                  children: [],
-                  data: {
-                    name: 'com.example.ATab'
-                  }
-                }
-              ]
-            }
-          ]
-        });
+    it('pass props', () => {
+      const result = uut.parse({
+        component: {
+          name: 'MyScreen',
+          passProps: Examples.passProps
+        }
+      });
+      expect(result).toEqual({
+        type: LayoutTypes.Component,
+        data: { name: 'MyScreen', passProps: Examples.passProps },
+        children: []
+      });
+      expect(result.data.passProps).toBe(Examples.passProps);
+      expect(result.data.passProps.fnProp()).toEqual('Hello from a function');
     });
 
-    it('parses side menus', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.singleWithSideMenu))
-        .toEqual({
-          type: 'SideMenuRoot',
-          children: [
-            {
-              type: 'SideMenuLeft',
-              children: [
-                {
-                  type: 'Container',
-                  data: {
-                    name: 'com.example.SideMenu'
-                  },
-                  children: []
-                }
-              ]
-            },
-            {
-              type: 'SideMenuCenter',
-              children: [
-                {
-                  type: 'ContainerStack',
-                  children: [
-                    {
-                      type: 'Container',
-                      data: {
-                        name: 'com.example.MyScreen'
-                      },
-                      children: []
-                    }
-                  ]
-                }
-              ]
-            }
-          ]
-        });
+    it('stack of components with top bar', () => {
+      expect(uut.parse(Examples.stackWithTopBar)).toEqual({
+        type: LayoutTypes.Stack,
+        data: {
+          options: Examples.options
+        },
+        children: [
+          {
+            type: LayoutTypes.Component,
+            data: { name: 'MyReactComponent1' },
+            children: []
+          },
+          {
+            type: LayoutTypes.Component,
+            data: { name: 'MyReactComponent2', options: Examples.options },
+            children: []
+          }
+        ]
+      });
     });
 
-    it('parses side menu right', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.singleWithRightSideMenu))
-        .toEqual({
-          type: 'SideMenuRoot',
-          children: [
-            {
-              type: 'SideMenuCenter',
-              children: [
-                {
-                  type: 'ContainerStack',
-                  children: [
-                    {
-                      type: 'Container',
-                      data: {
-                        name: 'com.example.MyScreen'
-                      },
-                      children: []
-                    }
-                  ]
-                }
-              ]
-            },
-            {
-              type: 'SideMenuRight',
-              children: [
-                {
-                  type: 'Container',
-                  data: {
-                    name: 'com.example.SideMenu'
-                  },
-                  children: []
-                }
-              ]
-            }
-          ]
-        });
+    it('bottom tabs', () => {
+      const result = uut.parse(Examples.bottomTabs);
+      expect(_.keys(result)).toEqual(['type', 'data', 'children']);
+      expect(result.type).toEqual(LayoutTypes.BottomTabs);
+      expect(result.data).toEqual({});
+      expect(result.children.length).toEqual(3);
+      expect(result.children[0].type).toEqual(LayoutTypes.Stack);
+      expect(result.children[1].type).toEqual(LayoutTypes.Stack);
+      expect(result.children[2].type).toEqual(LayoutTypes.Component);
     });
 
-    it('parses both side menus', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.singleWithBothMenus))
-        .toEqual({
-          type: 'SideMenuRoot',
-          children: [
-            {
-              type: 'SideMenuLeft',
-              children: [
-                {
-                  type: 'Container',
-                  data: {
-                    name: 'com.example.Menu1'
-                  },
-                  children: []
-                }
-              ]
-            },
-            {
-              type: 'SideMenuCenter',
-              children: [
-                {
-                  type: 'ContainerStack',
-                  children: [
-                    {
-                      type: 'Container',
-                      data: {
-                        name: 'com.example.MyScreen'
-                      },
-                      children: []
-                    }
-                  ]
-                }
-              ]
-            },
-            {
-              type: 'SideMenuRight',
-              children: [
-                {
-                  type: 'Container',
-                  data: {
-                    name: 'com.example.Menu2'
-                  },
-                  children: []
-                }
-              ]
-            }
-          ]
-        });
+    it('side menus', () => {
+      const result = uut.parse(Examples.sideMenu);
+      expect(_.keys(result)).toEqual(['type', 'data', 'children']);
+      expect(result.type).toEqual(LayoutTypes.SideMenuRoot);
+      expect(result.data).toEqual({});
+      expect(result.children.length).toEqual(3);
+      expect(result.children[0].type).toEqual(LayoutTypes.SideMenuLeft);
+      expect(result.children[1].type).toEqual(LayoutTypes.SideMenuCenter);
+      expect(result.children[2].type).toEqual(LayoutTypes.SideMenuRight);
+      expect(result.children[0].children.length).toEqual(1);
+      expect(result.children[0].children[0].type).toEqual(LayoutTypes.Component);
+      expect(result.children[1].children.length).toEqual(1);
+      expect(result.children[1].children[0].type).toEqual(LayoutTypes.Stack);
+      expect(result.children[2].children.length).toEqual(1);
+      expect(result.children[2].children[0].type).toEqual(LayoutTypes.Component);
     });
 
-    it('parses bottomTabs with side menus', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.tabBasedWithBothSideMenus))
-        .toEqual({
-          type: 'SideMenuRoot',
-          children: [
-            {
-              type: 'SideMenuLeft',
-              children: [
-                {
-                  type: 'Container',
-                  data: {
-                    name: 'com.example.Menu1'
-                  },
-                  children: []
-                }
-              ]
-            },
-            {
-              type: 'SideMenuCenter',
-              children: [
-                {
-                  type: 'BottomTabs',
-                  children: [
-                    {
-                      type: 'ContainerStack',
-                      children: [
-                        {
-                          type: 'Container',
-                          data: {
-                            name: 'com.example.FirstTab'
-                          },
-                          children: []
-                        }
-                      ]
-                    },
-                    {
-                      type: 'ContainerStack',
-                      children: [
-                        {
-                          type: 'Container',
-                          data: {
-                            name: 'com.example.SecondTab'
-                          },
-                          children: []
-                        }
-                      ]
-                    }
-                  ]
-                }
-              ]
-            },
-            {
-              type: 'SideMenuRight',
-              children: [
-                {
-                  type: 'Container',
-                  data: {
-                    name: 'com.example.Menu2'
-                  },
-                  children: []
-                }
-              ]
-            }
-          ]
-        });
+    it('side menu center is require', () => {
+      expect(() => uut.parse({ sideMenu: {} })).toThrow(new Error('sideMenu.center is required'));
     });
 
-    it('parses bottomTabs with side menus', () => {
-      expect(uut.parseFromSimpleJSON(SimpleLayouts.singleScreenWithTopTabs))
-        .toEqual({
-          type: 'TopTabs',
-          children: [
-            {
-              type: 'TopTab',
-              data: {
-                name: 'navigation.playground.TextScreen'
-              },
-              children: []
-            },
-            {
-              type: 'TopTab',
-              data: {
-                name: 'navigation.playground.TextScreen'
-              },
-              children: []
-            },
-            {
-              type: 'TopTab',
-              data: {
-                name: 'navigation.playground.TextScreen'
-              },
-              children: []
-            }
-          ],
-          data: {}
-        });
+    it('top tabs', () => {
+      const result = uut.parse(Examples.topTabs);
+      expect(_.keys(result)).toEqual(['type', 'data', 'children']);
+      expect(result.type).toEqual(LayoutTypes.TopTabs);
+      expect(result.data).toEqual({ options: Examples.options });
+      expect(result.children.length).toEqual(5);
+      expect(result.children[0].type).toEqual(LayoutTypes.Component);
+      expect(result.children[1].type).toEqual(LayoutTypes.Component);
+      expect(result.children[2].type).toEqual(LayoutTypes.Component);
+      expect(result.children[3].type).toEqual(LayoutTypes.Component);
+      expect(result.children[4].type).toEqual(LayoutTypes.Stack);
     });
-  });
 
-  describe('createContainer', () => {
-    it('creates container object with passed data', () => {
-      expect(uut.parseFromSimpleJSON({ name: 'theContainer', foo: 'bar' })).toEqual({ type: 'Container', data: { name: 'theContainer', foo: 'bar' }, children: [] });
+    it('complex layout example', () => {
+      const result = uut.parse(Examples.complexLayout);
+      expect(result.type).toEqual('SideMenuRoot');
+      expect(result.children[1].type).toEqual('SideMenuCenter');
+      expect(result.children[1].children[0].type).toEqual('BottomTabs');
+      expect(result.children[1].children[0].children[2].type).toEqual('Stack');
+      expect(result.children[1].children[0].children[2].children[0].type).toEqual('TopTabs');
+      expect(result.children[1].children[0].children[2].children[0].children[2].type).toEqual('TopTabs');
+      expect(result.children[1].children[0].children[2].children[0].children[2].children[4].type).toEqual('Stack');
+      expect(result.children[1].children[0].children[2].children[0].children[2].data).toEqual({ options: { topBar: { title: 'Hello1' } } });
     });
   });
 
-  describe('createDialogContainer', () => {
-    it('creates dialog container object with passed data', () => {
-      expect(uut.createDialogContainer({ foo: 'bar' })).toEqual({ type: 'CustomDialog', data: { foo: 'bar' }, children: [] });
-    });
+  it('options for all containing types', () => {
+    const options = {};
+    expect(uut.parse({ component: { options } }).data.options).toBe(options);
+    expect(uut.parse({ stack: { options } }).data.options).toBe(options);
+    expect(uut.parse({ bottomTabs: { options } }).data.options).toBe(options);
+    expect(uut.parse({ topTabs: { options } }).data.options).toBe(options);
+    expect(uut.parse({ sideMenu: { options, center: { component: {} } } }).data.options).toBe(options);
   });
 });

lib/src/commands/LayoutTypes.js

@@ -1,12 +1,10 @@
 module.exports = {
-  Container: 'Container',
-  ContainerStack: 'ContainerStack',
+  Component: 'Component',
+  Stack: 'Stack',
   BottomTabs: 'BottomTabs',
   SideMenuRoot: 'SideMenuRoot',
   SideMenuCenter: 'SideMenuCenter',
   SideMenuLeft: 'SideMenuLeft',
   SideMenuRight: 'SideMenuRight',
-  CustomDialog: 'CustomDialog',
-  TopTabs: 'TopTabs',
-  TopTab: 'TopTab'
+  TopTabs: 'TopTabs'
 };

lib/src/commands/OptionsProcessor.js

@@ -3,14 +3,14 @@ const { processColor } = require('react-native');
 const resolveAssetSource = require('react-native/Libraries/Image/resolveAssetSource');
 
 class OptionsProcessor {
-  static processOptions(navigationOptions) {
-    _.forEach(navigationOptions, (value, key) => {
+  static processOptions(options) {
+    _.forEach(options, (value, key) => {
       if (value) {
         if (_.endsWith(key, 'Color')) {
-          navigationOptions[key] = processColor(value);
+          options[key] = processColor(value);
         }
         if (_.isEqual(key, 'icon') || _.endsWith(key, 'Icon') || _.endsWith(key, 'Image')) {
-          navigationOptions[key] = resolveAssetSource(navigationOptions[key]);
+          options[key] = resolveAssetSource(options[key]);
         }
         if (_.isObject(value) || _.isArray(value)) {
           OptionsProcessor.processOptions(value);

lib/src/commands/OptionsProcessor.test.js

@@ -1,113 +1,111 @@
 const OptionsProcessor = require('./OptionsProcessor');
-const NavigationOptions = require('./../params/options/NavigationOptions');
 
 describe('navigation options', () => {
-  let navigationOptions;
+  let options;
 
   beforeEach(() => {
-    navigationOptions = {};
+    options = {};
   });
 
   it('processes colors into numeric AARRGGBB', () => {
-    navigationOptions.someKeyColor = 'red';
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.someKeyColor).toEqual(0xffff0000);
+    options.someKeyColor = 'red';
+    OptionsProcessor.processOptions(options);
+    expect(options.someKeyColor).toEqual(0xffff0000);
 
-    navigationOptions.someKeyColor = 'yellow';
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.someKeyColor).toEqual(0xffffff00);
+    options.someKeyColor = 'yellow';
+    OptionsProcessor.processOptions(options);
+    expect(options.someKeyColor).toEqual(0xffffff00);
   });
 
   it('processes numeric colors', () => {
-    navigationOptions.someKeyColor = '#123456';
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.someKeyColor).toEqual(0xff123456);
+    options.someKeyColor = '#123456';
+    OptionsProcessor.processOptions(options);
+    expect(options.someKeyColor).toEqual(0xff123456);
 
-    navigationOptions.someKeyColor = 0x123456ff; // wut
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.someKeyColor).toEqual(0xff123456);
+    options.someKeyColor = 0x123456ff; // wut
+    OptionsProcessor.processOptions(options);
+    expect(options.someKeyColor).toEqual(0xff123456);
   });
 
   it('process colors with rgb functions', () => {
-    navigationOptions.someKeyColor = 'rgb(255, 0, 255)';
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.someKeyColor).toEqual(0xffff00ff);
+    options.someKeyColor = 'rgb(255, 0, 255)';
+    OptionsProcessor.processOptions(options);
+    expect(options.someKeyColor).toEqual(0xffff00ff);
   });
 
   it('process colors with special words', () => {
-    navigationOptions.someKeyColor = 'fuchsia';
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.someKeyColor).toEqual(0xffff00ff);
+    options.someKeyColor = 'fuchsia';
+    OptionsProcessor.processOptions(options);
+    expect(options.someKeyColor).toEqual(0xffff00ff);
   });
 
   it('process colors with hsla functions', () => {
-    navigationOptions.someKeyColor = 'hsla(360, 100%, 100%, 1.0)';
-    OptionsProcessor.processOptions(navigationOptions);
+    options.someKeyColor = 'hsla(360, 100%, 100%, 1.0)';
+    OptionsProcessor.processOptions(options);
 
-    expect(navigationOptions.someKeyColor).toEqual(0xffffffff);
+    expect(options.someKeyColor).toEqual(0xffffffff);
   });
 
   it('unknown colors return undefined', () => {
-    navigationOptions.someKeyColor = 'wut';
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.someKeyColor).toEqual(undefined);
+    options.someKeyColor = 'wut';
+    OptionsProcessor.processOptions(options);
+    expect(options.someKeyColor).toEqual(undefined);
   });
 
   it('any keys ending with Color', () => {
-    navigationOptions.otherKeyColor = 'red';
-    navigationOptions.yetAnotherColor = 'blue';
-    navigationOptions.andAnotherColor = 'rgb(0, 255, 0)';
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.otherKeyColor).toEqual(0xffff0000);
-    expect(navigationOptions.yetAnotherColor).toEqual(0xff0000ff);
-    expect(navigationOptions.andAnotherColor).toEqual(0xff00ff00);
+    options.otherKeyColor = 'red';
+    options.yetAnotherColor = 'blue';
+    options.andAnotherColor = 'rgb(0, 255, 0)';
+    OptionsProcessor.processOptions(options);
+    expect(options.otherKeyColor).toEqual(0xffff0000);
+    expect(options.yetAnotherColor).toEqual(0xff0000ff);
+    expect(options.andAnotherColor).toEqual(0xff00ff00);
   });
 
   it('keys ending with Color case sensitive', () => {
-    navigationOptions.otherKey_color = 'red'; // eslint-disable-line camelcase
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.otherKey_color).toEqual('red');
+    options.otherKey_color = 'red'; // eslint-disable-line camelcase
+    OptionsProcessor.processOptions(options);
+    expect(options.otherKey_color).toEqual('red');
   });
 
   it('any nested recursive keys ending with Color', () => {
-    navigationOptions.topBar = { textColor: 'red' };
-    navigationOptions.topBar.innerMostObj = { anotherColor: 'yellow' };
-    OptionsProcessor.processOptions(navigationOptions);
-    expect(navigationOptions.topBar.textColor).toEqual(0xffff0000);
-    expect(navigationOptions.topBar.innerMostObj.anotherColor).toEqual(0xffffff00);
+    options.topBar = { textColor: 'red' };
+    options.topBar.innerMostObj = { anotherColor: 'yellow' };
+    OptionsProcessor.processOptions(options);
+    expect(options.topBar.textColor).toEqual(0xffff0000);
+    expect(options.topBar.innerMostObj.anotherColor).toEqual(0xffffff00);
   });
 
   it('resolve image sources with name/ending with icon', () => {
-    navigationOptions.icon = 'require("https://wix.github.io/react-native-navigation/_images/logo.png");';
-    navigationOptions.topBar = {
+    options.icon = 'require("https://wix.github.io/react-native-navigation/_images/logo.png");';
+    options.topBar = {
       myIcon: 'require("https://wix.github.io/react-native-navigation/_images/logo.png");',
       myOtherValue: 'value'
     };
-    OptionsProcessor.processOptions(navigationOptions);
+    OptionsProcessor.processOptions(options);
 
     // 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)
     // and expect the value to be resovled, in this case it doesn't find anything and returns null
-    expect(navigationOptions.icon).toEqual(null);
-    expect(navigationOptions.topBar.myIcon).toEqual(null);
-    expect(navigationOptions.topBar.myOtherValue).toEqual('value');
+    expect(options.icon).toEqual(null);
+    expect(options.topBar.myIcon).toEqual(null);
+    expect(options.topBar.myOtherValue).toEqual('value');
   });
 
-  it('processes NavigationOptions jsDoc object', () => {
-    navigationOptions.someKeyColor = 'rgb(255, 0, 255)';
-    navigationOptions.topBar = { textColor: 'red' };
-    navigationOptions.topBar.innerMostObj = { anotherColor: 'yellow' };
-    const navigationOptionsObj = new NavigationOptions(navigationOptions);
+  it('processes Options object', () => {
+    options.someKeyColor = 'rgb(255, 0, 255)';
+    options.topBar = { textColor: 'red' };
+    options.topBar.innerMostObj = { anotherColor: 'yellow' };
 
-    OptionsProcessor.processOptions(navigationOptionsObj);
+    OptionsProcessor.processOptions({ o: options });
 
-    expect(navigationOptionsObj.topBar.textColor).toEqual(0xffff0000);
+    expect(options.topBar.textColor).toEqual(0xffff0000);
   });
 
   it('undefined value return undefined ', () => {
-    navigationOptions.someImage = undefined;
-    OptionsProcessor.processOptions(navigationOptions);
+    options.someImage = undefined;
+    OptionsProcessor.processOptions(options);
 
-    expect(navigationOptions.someImage).toEqual(undefined);
+    expect(options.someImage).toEqual(undefined);
   });
 });

lib/src/commands/SimpleLayouts.js

@@ -1,138 +0,0 @@
-const singleScreenApp = {
-  container: {
-    name: 'com.example.MyScreen'
-  }
-};
-
-const passProps = {
-  strProp: 'string prop',
-  numProp: 12345,
-  objProp: { inner: { foo: 'bar' } },
-  fnProp: () => 'Hello from a function'
-};
-
-const singleScreenWithAditionalParams = {
-  container: {
-    name: 'com.example.MyScreen',
-    passProps,
-    style: {},
-    buttons: {}
-  }
-};
-
-const tabBasedApp = {
-  bottomTabs: [
-    {
-      container: {
-        name: 'com.example.ATab'
-      }
-    },
-    {
-      container: {
-        name: 'com.example.SecondTab'
-      }
-    },
-    {
-      container: {
-        name: 'com.example.ATab'
-      }
-    }
-  ]
-};
-
-const singleWithSideMenu = {
-  container: {
-    name: 'com.example.MyScreen'
-  },
-  sideMenu: {
-    left: {
-      container: {
-        name: 'com.example.SideMenu'
-      }
-    }
-  }
-};
-
-const singleWithRightSideMenu = {
-  container: {
-    name: 'com.example.MyScreen'
-  },
-  sideMenu: {
-    right: {
-      container: {
-        name: 'com.example.SideMenu'
-      }
-    }
-  }
-};
-
-const singleWithBothMenus = {
-  container: {
-    name: 'com.example.MyScreen'
-  },
-  sideMenu: {
-    left: {
-      container: {
-        name: 'com.example.Menu1'
-      }
-    },
-    right: {
-      container: {
-        name: 'com.example.Menu2'
-      }
-    }
-  }
-};
-
-const tabBasedWithBothSideMenus = {
-  bottomTabs: [
-    {
-      container: {
-        name: 'com.example.FirstTab'
-      }
-    },
-    {
-      container: {
-        name: 'com.example.SecondTab'
-      }
-    }
-  ],
-  sideMenu: {
-    left: {
-      container: {
-        name: 'com.example.Menu1'
-      }
-    },
-    right: {
-      container: {
-        name: 'com.example.Menu2'
-      }
-    }
-  }
-};
-
-const singleScreenWithTopTabs = {
-  topTabs: [
-    {
-      name: 'navigation.playground.TextScreen'
-    },
-    {
-      name: 'navigation.playground.TextScreen'
-    },
-    {
-      name: 'navigation.playground.TextScreen'
-    }
-  ]
-};
-
-module.exports = {
-  singleScreenApp,
-  passProps,
-  singleScreenWithAditionalParams,
-  tabBasedApp,
-  singleWithSideMenu,
-  singleWithRightSideMenu,
-  singleWithBothMenus,
-  tabBasedWithBothSideMenus,
-  singleScreenWithTopTabs
-};