From 5f6603ff41a8a7c9be58590b7ed040ee734e9e7b Mon Sep 17 00:00:00 2001
From: Satyajit Sahoo <satyajit.happy@gmail.com>
Date: Fri, 30 Jul 2021 15:58:39 +0200
Subject: [PATCH] fix: use label color from styles if specified. closes #1175

---
 src/TabBarItem.tsx | 25 ++++++++++++++++++++-----
 1 file changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/TabBarItem.tsx b/src/TabBarItem.tsx
index f82a8c12..80d2e1c0 100644
--- a/src/TabBarItem.tsx
+++ b/src/TabBarItem.tsx
@@ -86,15 +86,15 @@ export default class TabBarItem<T extends Route> extends React.Component<
       route,
       position,
       navigationState,
-      renderLabel: renderLabelPassed,
+      renderLabel: renderLabelCustom,
       renderIcon,
       renderBadge,
       getLabelText,
       getTestID,
       getAccessibilityLabel,
       getAccessible,
-      activeColor = DEFAULT_ACTIVE_COLOR,
-      inactiveColor = DEFAULT_INACTIVE_COLOR,
+      activeColor: activeColorCustom,
+      inactiveColor: inactiveColorCustom,
       pressColor,
       pressOpacity,
       labelStyle,
@@ -107,6 +107,21 @@ export default class TabBarItem<T extends Route> extends React.Component<
     const tabIndex = navigationState.routes.indexOf(route);
     const isFocused = navigationState.index === tabIndex;
 
+    const labelColorFromStyle = StyleSheet.flatten(labelStyle || {}).color;
+
+    const activeColor =
+      activeColorCustom !== undefined
+        ? activeColorCustom
+        : typeof labelColorFromStyle === 'string'
+        ? labelColorFromStyle
+        : DEFAULT_ACTIVE_COLOR;
+    const inactiveColor =
+      inactiveColorCustom !== undefined
+        ? inactiveColorCustom
+        : typeof labelColorFromStyle === 'string'
+        ? labelColorFromStyle
+        : DEFAULT_INACTIVE_COLOR;
+
     const activeOpacity = this.getActiveOpacity(
       position,
       navigationState.routes,
@@ -150,8 +165,8 @@ export default class TabBarItem<T extends Route> extends React.Component<
     }
 
     const renderLabel =
-      renderLabelPassed !== undefined
-        ? renderLabelPassed
+      renderLabelCustom !== undefined
+        ? renderLabelCustom
         : ({ route, color }: { route: T; color: string }) => {
             const labelText = getLabelText({ route });