From bddbdb084457f3cf9e94ec8cb1871f0301b3634d Mon Sep 17 00:00:00 2001
From: Liam Potter <liam@liampotter.co.uk>
Date: Fri, 5 Apr 2024 17:16:32 +0100
Subject: [PATCH] feat: add ability to override bottom tab sideContent styles

---
 packages/bottom-tabs/src/types.tsx              | 5 +++++
 packages/bottom-tabs/src/views/BottomTabBar.tsx | 6 +++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/bottom-tabs/src/types.tsx b/packages/bottom-tabs/src/types.tsx
index 0d963f1f3c..62b9959d76 100644
--- a/packages/bottom-tabs/src/types.tsx
+++ b/packages/bottom-tabs/src/types.tsx
@@ -227,6 +227,11 @@ export type BottomTabNavigationOptions = HeaderOptions & {
    */
   tabBarStyle?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
 
+  /**
+   * Style object for the tab bar content container.
+   */
+  tabBarContentStyle?: StyleProp<ViewStyle>;
+
   /**
    * Function which returns a React Element to use as background for the tab bar.
    * You could render an image, a gradient, blur view etc.
diff --git a/packages/bottom-tabs/src/views/BottomTabBar.tsx b/packages/bottom-tabs/src/views/BottomTabBar.tsx
index f407002eb4..8ec7d5f47a 100644
--- a/packages/bottom-tabs/src/views/BottomTabBar.tsx
+++ b/packages/bottom-tabs/src/views/BottomTabBar.tsx
@@ -155,6 +155,7 @@ export function BottomTabBar({
     tabBarHideOnKeyboard = false,
     tabBarVisibilityAnimationConfig,
     tabBarStyle,
+    tabBarContentStyle,
     tabBarBackground,
     tabBarActiveTintColor,
     tabBarInactiveTintColor,
@@ -332,7 +333,10 @@ export function BottomTabBar({
       </View>
       <View
         accessibilityRole="tablist"
-        style={tabBarIsHorizontal ? styles.bottomContent : styles.sideContent}
+        style={[
+          tabBarIsHorizontal ? styles.bottomContent : styles.sideContent,
+          tabBarContentStyle,
+        ]}
       >
         {routes.map((route, index) => {
           const focused = index === state.index;