From 2692a9cc6379d1183f80f3811e3e124d28364811 Mon Sep 17 00:00:00 2001
From: Yassine Chbani <yassine.chbani@gmail.com>
Date: Sun, 17 Nov 2019 21:07:09 +0100
Subject: [PATCH] feat: pass current opacity to renderIcon prop in
 CrossFadeIcon

---
 src/types.tsx                    | 2 ++
 src/utils/createTabNavigator.tsx | 9 ++++++++-
 src/views/CrossFadeIcon.tsx      | 3 +++
 3 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/types.tsx b/src/types.tsx
index c2669f34a..476c7e252 100644
--- a/src/types.tsx
+++ b/src/types.tsx
@@ -141,6 +141,7 @@ export type BottomTabBarProps = BottomTabBarOptions & {
   renderIcon: (props: {
     route: NavigationRoute;
     focused: boolean;
+    currentOpacity: number;
     tintColor?: string;
     horizontal?: boolean;
   }) => React.ReactNode;
@@ -211,6 +212,7 @@ export type NavigationCommonTabOptions = {
     | React.ReactNode
     | ((props: {
         focused: boolean;
+        currentOpacity?: number;
         tintColor?: string;
         horizontal?: boolean;
       }) => React.ReactNode);
diff --git a/src/utils/createTabNavigator.tsx b/src/utils/createTabNavigator.tsx
index b43864dba..b8871d8d9 100644
--- a/src/utils/createTabNavigator.tsx
+++ b/src/utils/createTabNavigator.tsx
@@ -34,6 +34,7 @@ type ExtraProps<Config extends {}> = {
 export type RenderIconProps = {
   route: NavigationRoute;
   focused: boolean;
+  currentOpacity?: number;
   tintColor?: string;
   horizontal?: boolean;
 };
@@ -75,6 +76,7 @@ export default function createTabNavigator<
     _renderIcon = ({
       route,
       focused,
+      currentOpacity,
       tintColor,
       horizontal = false,
     }: RenderIconProps) => {
@@ -84,7 +86,12 @@ export default function createTabNavigator<
 
       if (options.tabBarIcon) {
         return typeof options.tabBarIcon === 'function'
-          ? options.tabBarIcon({ focused, tintColor, horizontal })
+          ? options.tabBarIcon({
+              focused,
+              tintColor,
+              currentOpacity,
+              horizontal,
+            })
           : options.tabBarIcon;
       }
 
diff --git a/src/views/CrossFadeIcon.tsx b/src/views/CrossFadeIcon.tsx
index cc77f6880..59287bf4b 100644
--- a/src/views/CrossFadeIcon.tsx
+++ b/src/views/CrossFadeIcon.tsx
@@ -13,6 +13,7 @@ type Props = {
   renderIcon: (props: {
     route: NavigationRoute;
     focused: boolean;
+    currentOpacity: number;
     tintColor?: string;
     horizontal?: boolean;
   }) => React.ReactNode;
@@ -40,6 +41,7 @@ export default class TabBarIcon extends React.Component<Props> {
           {renderIcon({
             route,
             focused: true,
+            currentOpacity: activeOpacity,
             horizontal,
             tintColor: activeTintColor,
           })}
@@ -48,6 +50,7 @@ export default class TabBarIcon extends React.Component<Props> {
           {renderIcon({
             route,
             focused: false,
+            currentOpacity: inactiveOpacity,
             horizontal,
             tintColor: inactiveTintColor,
           })}