Add activeLabelStyle and inactiveLabelStyle for DrawerItem (#3559)

* Add activeLabelStyle and inactiveLabelStyle

Adding activeLabelStyle, so that active items can be customized more.
My use case: Change font of the active item to bold.
Also, added inactiveLabelStyle which can be used for a similar purpose.

* prettier fix

* Update react-navigation.js

* prettier fix

* Update jest snapshot for DrawerNavigator - for adding a new style property to the styles array

packages/react-navigation/flow/react-navigation.js

@@ -945,6 +945,8 @@ declare module 'react-navigation' {
     itemsContainerStyle?: ViewStyleProp,
     itemStyle?: ViewStyleProp,
     labelStyle?: TextStyleProp,
+    activeLabelStyle?: TextStyleProp,
+    inactiveLabelStyle?: TextStyleProp,
     iconContainerStyle?: ViewStyleProp,
     drawerPosition: 'left' | 'right',
   };

packages/react-navigation/src/navigators/__tests__/__snapshots__/DrawerNavigator-test.js.snap

@@ -224,6 +224,7 @@ exports[`DrawerNavigator renders successfully 1`] = `
                             "color": "#2196f3",
                           },
                           undefined,
+                          undefined,
                         ]
                       }
                     >

packages/react-navigation/src/views/Drawer/DrawerNavigatorItems.js

@@ -21,6 +21,8 @@ const DrawerNavigatorItems = ({
   itemsContainerStyle,
   itemStyle,
   labelStyle,
+  activeLabelStyle,
+  inactiveLabelStyle,
   iconContainerStyle,
   drawerPosition,
 }) => (
@@ -34,6 +36,7 @@ const DrawerNavigatorItems = ({
       const scene = { route, index, focused, tintColor: color };
       const icon = renderIcon(scene);
       const label = getLabel(scene);
+      const extraLabelStyle = focused ? activeLabelStyle : inactiveLabelStyle;
       return (
         <TouchableItem
           key={route.key}
@@ -63,7 +66,9 @@ const DrawerNavigatorItems = ({
                 </View>
               ) : null}
               {typeof label === 'string' ? (
-                <Text style={[styles.label, { color }, labelStyle]}>
+                <Text
+                  style={[styles.label, { color }, labelStyle, extraLabelStyle]}
+                >
                   {label}
                 </Text>
               ) : (