Release 1.5.2

Fixes #3709

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-navigation",
-  "version": "1.5.0",
+  "version": "1.5.2",
   "description": "Routing and navigation for your React Native apps",
   "main": "src/react-navigation.js",
   "repository": {

src/navigators/StackNavigator.js

@@ -11,6 +11,7 @@ import NavigationActions from '../NavigationActions';
 
 export default (routeConfigMap, stackConfig = {}) => {
   const {
+    initialRouteKey,
     initialRouteName,
     initialRouteParams,
     paths,
@@ -25,6 +26,7 @@ export default (routeConfigMap, stackConfig = {}) => {
   } = stackConfig;
 
   const stackRouterConfig = {
+    initialRouteKey,
     initialRouteName,
     initialRouteParams,
     paths,
@@ -47,7 +49,7 @@ export default (routeConfigMap, stackConfig = {}) => {
         onTransitionEnd={(lastTransition, transition) => {
           const { state, dispatch } = props.navigation;
           dispatch(NavigationActions.completeTransition({ key: state.key }));
-          onTransitionEnd && onTransitionEnd();
+          onTransitionEnd && onTransitionEnd(lastTransition, transition);
         }}
       />
     )

src/views/TabView/TabBarBottom.js

@@ -100,6 +100,7 @@ class TabBarBottom extends React.PureComponent {
     if (showIcon === false) {
       return null;
     }
+
     return (
       <TabBarIcon
         position={position}
@@ -108,7 +109,11 @@ class TabBarBottom extends React.PureComponent {
         inactiveTintColor={inactiveTintColor}
         renderIcon={renderIcon}
         scene={scene}
-        style={showLabel && this._shouldUseHorizontalTabs() ? {} : styles.icon}
+        style={
+          showLabel && this._shouldUseHorizontalTabs()
+            ? styles.horizontalIcon
+            : styles.icon
+        }
       />
     );
   };
@@ -286,6 +291,9 @@ class TabBarBottom extends React.PureComponent {
   }
 }
 
+const DEFAULT_HEIGHT = 49;
+const COMPACT_HEIGHT = 29;
+
 const styles = StyleSheet.create({
   tabBar: {
     backgroundColor: '#F7F7F7', // Default background color in iOS 10
@@ -294,10 +302,10 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
   },
   tabBarCompact: {
-    height: 29,
+    height: COMPACT_HEIGHT,
   },
   tabBarRegular: {
-    height: 49,
+    height: DEFAULT_HEIGHT,
   },
   tab: {
     flex: 1,
@@ -314,6 +322,9 @@ const styles = StyleSheet.create({
   icon: {
     flexGrow: 1,
   },
+  horizontalIcon: {
+    height: Platform.isPad ? DEFAULT_HEIGHT : COMPACT_HEIGHT,
+  },
   label: {
     textAlign: 'center',
     backgroundColor: 'transparent',

src/views/TabView/TabBarIcon.js

@@ -23,6 +23,7 @@ export default class TabBarIcon extends React.PureComponent {
       inputRange,
       outputRange: inputRange.map(i => (i === index ? 0 : 1)),
     });
+
     // We render the icon twice at the same position on top of each other:
     // active and inactive one, so we can fade between them.
     return (

src/views/__tests__/__snapshots__/TabView-test.js.snap

@@ -93,13 +93,12 @@ exports[`TabBarBottom renders successfully 1`] = `
               style={
                 Object {
                   "alignItems": "center",
-                  "bottom": 0,
+                  "alignSelf": "center",
+                  "height": "100%",
                   "justifyContent": "center",
-                  "left": 0,
                   "opacity": 1,
                   "position": "absolute",
-                  "right": 0,
-                  "top": 0,
+                  "width": "100%",
                 }
               }
             />
@@ -108,13 +107,12 @@ exports[`TabBarBottom renders successfully 1`] = `
               style={
                 Object {
                   "alignItems": "center",
-                  "bottom": 0,
+                  "alignSelf": "center",
+                  "height": "100%",
                   "justifyContent": "center",
-                  "left": 0,
                   "opacity": 0,
                   "position": "absolute",
-                  "right": 0,
-                  "top": 0,
+                  "width": "100%",
                 }
               }
             />

src/withCachedChildNavigation.js

@@ -31,7 +31,7 @@ export default function withCachedChildNavigation(Comp) {
       });
     }
 
-    _isRouteFocused = route => () => {
+    _isRouteFocused = route => {
       const { state } = this.props.navigation;
       const focusedRoute = state.routes[state.index];
       return route === focusedRoute;
@@ -58,7 +58,7 @@ export default function withCachedChildNavigation(Comp) {
         this._childNavigationProps[route.key] = addNavigationHelpers({
           dispatch: navigation.dispatch,
           state: route,
-          isFocused: this._isRouteFocused.bind(this, route),
+          isFocused: () => this._isRouteFocused(route),
           addListener: this._childEventSubscribers[route.key],
         });
       });