Release 1.5.8

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-navigation",
-  "version": "1.5.5",
+  "version": "1.5.8",
   "description": "Routing and navigation for your React Native apps",
   "main": "src/react-navigation.js",
   "repository": {
@@ -35,7 +35,7 @@
     "react-lifecycles-compat": "^1.0.2",
     "react-native-drawer-layout-polyfill": "^1.3.2",
     "react-native-safe-area-view": "^0.7.0",
-    "react-native-tab-view": "^0.0.74"
+    "react-native-tab-view": "github:react-navigation/react-native-tab-view"
   },
   "devDependencies": {
     "babel-cli": "^6.24.1",

src/navigators/__tests__/__snapshots__/TabNavigator-test.js.snap

@@ -137,9 +137,15 @@ exports[`TabNavigator renders successfully 1`] = `
         >
           <View
             style={
-              Object {
-                "flexGrow": 1,
-              }
+              Array [
+                Object {
+                  "height": 29,
+                },
+                false,
+                Object {
+                  "flexGrow": 1,
+                },
+              ]
             }
           >
             <View

src/views/TabView/TabBarBottom.js

@@ -101,6 +101,8 @@ class TabBarBottom extends React.PureComponent {
       return null;
     }
 
+    const horizontal = this._shouldUseHorizontalTabs();
+
     return (
       <TabBarIcon
         position={position}
@@ -110,8 +112,9 @@ class TabBarBottom extends React.PureComponent {
         renderIcon={renderIcon}
         scene={scene}
         style={[
-          styles.icon,
-          this._shouldUseHorizontalTabs() && styles.horizontalIcon,
+          styles.iconWithExplicitHeight,
+          showLabel === false && !horizontal && styles.iconWithoutLabel,
+          showLabel !== false && !horizontal && styles.iconWithLabel,
         ]}
       />
     );
@@ -318,10 +321,13 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
     flexDirection: 'row',
   },
-  icon: {
+  iconWithoutLabel: {
+    flex: 1,
+  },
+  iconWithLabel: {
     flexGrow: 1,
   },
-  horizontalIcon: {
+  iconWithExplicitHeight: {
     height: Platform.isPad ? DEFAULT_HEIGHT : COMPACT_HEIGHT,
   },
   label: {

src/views/TabView/TabBarIcon.js

@@ -54,11 +54,11 @@ const styles = StyleSheet.create({
     // We render the icon twice at the same position on top of each other:
     // active and inactive one, so we can fade between them:
     // Cover the whole iconContainer:
-    alignItems: 'center',
-    alignSelf: 'center',
-    height: '100%',
-    justifyContent: 'center',
     position: 'absolute',
+    alignSelf: 'center',
+    alignItems: 'center',
+    justifyContent: 'center',
+    height: '100%',
     width: '100%',
   },
 });

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

@@ -83,9 +83,15 @@ exports[`TabBarBottom renders successfully 1`] = `
         >
           <View
             style={
-              Object {
-                "flexGrow": 1,
-              }
+              Array [
+                Object {
+                  "height": 29,
+                },
+                false,
+                Object {
+                  "flexGrow": 1,
+                },
+              ]
             }
           >
             <View