@react-navigation/bottom-tabs 8.0.0-alpha.3 → 8.0.0-alpha.30

package/src/views/ScreenContent.tsx

@@ -2,7 +2,6 @@ import { getHeaderTitle, Header } from '@react-navigation/elements';
 import { Screen } from '@react-navigation/elements/internal';
 import type { ParamListBase, Route } from '@react-navigation/native';
 import * as React from 'react';
-import { type StyleProp, type ViewStyle } from 'react-native';
 
 import type {
   BottomTabNavigationOptions,
@@ -21,7 +20,7 @@ export function ScreenContent({
   route: Route<string>;
   navigation: BottomTabNavigationProp<ParamListBase>;
   options: BottomTabNavigationOptions;
-  style?: StyleProp<ViewStyle>;
+  style?: React.ComponentProps<typeof Screen>['style'];
   children: React.ReactNode;
 }) {
   const {

package/src/views/TabBarIcon.tsx

@@ -1,4 +1,4 @@
-import { Badge } from '@react-navigation/elements';
+import { Badge, type Icon } from '@react-navigation/elements';
 import { MissingIcon } from '@react-navigation/elements/internal';
 import { MaterialSymbol, type Route, SFSymbol } from '@react-navigation/native';
 import React from 'react';
@@ -12,26 +12,24 @@ import {
   type ViewStyle,
 } from 'react-native';
 
-import type { BottomTabIcon } from '../types';
-
 export type TabBarIconProps = {
   route: Route<string>;
   variant: 'uikit' | 'material';
   size: 'compact' | 'regular';
-  badge?: string | number;
-  badgeStyle?: StyleProp<TextStyle>;
+  badge?: string | number | undefined;
+  badgeStyle?: StyleProp<TextStyle> | undefined;
   activeOpacity: number;
   inactiveOpacity: number;
   activeTintColor: ColorValue;
   inactiveTintColor: ColorValue;
   icon:
-    | BottomTabIcon
+    | Icon
     | ((props: {
         focused: boolean;
         color: ColorValue;
         size: number;
-      }) => BottomTabIcon | React.ReactNode);
-  allowFontScaling?: boolean;
+      }) => Icon | React.ReactNode);
+  allowFontScaling?: boolean | undefined;
   style: StyleProp<ViewStyle>;
 };
 
@@ -43,8 +41,8 @@ const ICON_SIZE_WIDE = 31;
 const ICON_SIZE_WIDE_COMPACT = 23;
 const ICON_SIZE_TALL = 28;
 const ICON_SIZE_TALL_COMPACT = 20;
-const ICON_SIZE_ROUND = 25;
-const ICON_SIZE_ROUND_COMPACT = 18;
+const ICON_SIZE_SQUARE = 23;
+const ICON_SIZE_SQUARE_COMPACT = 17;
 const ICON_SIZE_MATERIAL = 24;
 
 export function TabBarIcon({
@@ -65,8 +63,8 @@ export function TabBarIcon({
     variant === 'material'
       ? ICON_SIZE_MATERIAL
       : size === 'compact'
-        ? ICON_SIZE_ROUND_COMPACT
-        : ICON_SIZE_ROUND;
+        ? ICON_SIZE_SQUARE_COMPACT
+        : ICON_SIZE_SQUARE;
 
   // We render the icon twice at the same position on top of each other:
   // active and inactive one, so we can fade between them.
@@ -153,22 +151,17 @@ function renderIcon({
             }}
           />
         );
-      case 'resource':
-        return (
-          <Image
-            source={{ uri: iconValue.name }}
-            style={{
-              width: size,
-              height: size,
-              tintColor: iconValue.tinted === false ? undefined : color,
-            }}
-          />
-        );
       case 'sfSymbol':
         return <SFSymbol name={iconValue.name} size={size} color={color} />;
       case 'materialSymbol':
         return (
-          <MaterialSymbol name={iconValue.name} size={size} color={color} />
+          <MaterialSymbol
+            name={iconValue.name}
+            variant={iconValue.variant}
+            weight={iconValue.weight}
+            size={size}
+            color={color}
+          />
         );
       default: {
         const _exhaustiveCheck: never = iconValue;

package/lib/module/views/BottomTabViewCommon.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["BottomTabViewCustom","BottomTabViewNative","jsx","_jsx","BottomTabView","props","implementation"],"sourceRoot":"../../../src","sources":["views/BottomTabViewCommon.tsx"],"mappings":";;AAUA,SAASA,mBAAmB,QAAQ,0BAAuB;AAC3D,SAASC,mBAAmB,QAAQ,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQ5D,OAAO,SAASC,aAAaA,CAACC,KAAY,EAAE;EAC1C,IAAIA,KAAK,CAACC,cAAc,KAAK,QAAQ,EAAE;IACrC,oBAAOH,IAAA,CAACH,mBAAmB;MAAA,GAAKK;IAAK,CAAG,CAAC;EAC3C;EAEA,oBAAOF,IAAA,CAACF,mBAAmB;IAAA,GAAKI;EAAK,CAAG,CAAC;AAC3C","ignoreList":[]}

package/lib/typescript/src/views/BottomTabViewCommon.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BottomTabViewCommon.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabViewCommon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,kBAAkB,EACnB,MAAM,0BAA0B,CAAC;AAElC,OAAO,KAAK,EACV,sBAAsB,EACtB,yBAAyB,EACzB,0BAA0B,EAC3B,MAAM,UAAU,CAAC;AAIlB,KAAK,KAAK,GAAG,yBAAyB,GAAG;IACvC,KAAK,EAAE,kBAAkB,CAAC,aAAa,CAAC,CAAC;IACzC,UAAU,EAAE,0BAA0B,CAAC;IACvC,WAAW,EAAE,sBAAsB,CAAC;CACrC,CAAC;AAEF,wBAAgB,aAAa,CAAC,KAAK,EAAE,KAAK,2CAMzC"}