fix: change api

Author: okwasniewski

docs/docs/docs/guides/usage-with-react-navigation.mdx

@@ -149,6 +149,16 @@ Tab views using the sidebar adaptable style have an appearance
 
 Whether to enable haptic feedback on tab press. Defaults to true.
 
+#### `tabLabelStyle`
+
+Object containing styles for the tab label.
+
+Supported properties:
+- `fontFamily`
+- `fontSize`
+- `fontWeight`
+
+
 ### Options
 
 The following options can be used to configure the screens in the navigator. These can be specified under `screenOptions` prop of `Tab.navigator` or `options` prop of `Tab.Screen`.

example/src/Examples/NativeBottomTabs.tsx

@@ -18,8 +18,10 @@ function NativeBottomTabs() {
       tabBarActiveTintColor="#F7DBA7"
       barTintColor="#1E2D2F"
       rippleColor="#F7DBA7"
-      fontFamily="Avenir"
-      fontSize={15}
+      tabLabelStyle={{
+        fontFamily: 'Avenir',
+        fontSize: 15,
+      }}
       activeIndicatorColor="#041F1E"
       screenListeners={{
         tabLongPress: (data) => {

src/TabView.tsx

@@ -123,18 +123,22 @@ interface Props<Route extends BaseRoute> {
    * Color of tab indicator. (Android only)
    */
   activeIndicatorColor?: ColorValue;
-  /**
-   * Font family for the tab labels.
-   */
-  fontFamily?: string;
-  /**
-   * Font weight for the tab labels.
-   */
-  fontWeight?: string;
-  /**
-   * Font size for the tab labels.
-   */
-  fontSize?: number;
+  tabLabelStyle?: {
+    /**
+     * Font family for the tab labels.
+     */
+    fontFamily?: string;
+
+    /**
+     * Font weight for the tab labels.
+     */
+    fontWeight?: string;
+
+    /**
+     * Font size for the tab labels.
+     */
+    fontSize?: number;
+  };
 }
 
 const ANDROID_MAX_TABS = 6;
@@ -160,6 +164,7 @@ const TabView = <Route extends BaseRoute>({
   getHidden = ({ route }: { route: Route }) => route.hidden,
   getActiveTintColor = ({ route }: { route: Route }) => route.activeTintColor,
   hapticFeedbackEnabled = true,
+  tabLabelStyle,
   ...props
 }: Props<Route>) => {
   // @ts-ignore
@@ -250,6 +255,7 @@ const TabView = <Route extends BaseRoute>({
   return (
     <TabViewAdapter
       {...props}
+      {...tabLabelStyle}
       style={styles.fullWidth}
       items={items}
       icons={resolvedIconAssets}