@react-navigation/bottom-tabs 8.0.0-alpha.3 → 8.0.0-alpha.31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/module/index.js +1 -1
- package/lib/module/index.js.map +1 -1
- package/lib/module/navigators/createBottomTabNavigator.js +4 -25
- package/lib/module/navigators/createBottomTabNavigator.js.map +1 -1
- package/lib/module/utils/useBottomTabAnimation.js +1 -1
- package/lib/module/utils/useBottomTabAnimation.js.map +1 -1
- package/lib/module/utils/useBottomTabBarHeight.js +1 -1
- package/lib/module/utils/useBottomTabBarHeight.js.map +1 -1
- package/lib/module/views/BottomTabBar.js +14 -11
- package/lib/module/views/BottomTabBar.js.map +1 -1
- package/lib/module/views/BottomTabItem.js +1 -1
- package/lib/module/views/BottomTabItem.js.map +1 -1
- package/lib/module/views/{BottomTabViewCommon.js → BottomTabView.js} +1 -1
- package/lib/module/views/BottomTabView.js.map +1 -0
- package/lib/module/views/BottomTabViewCustom.js +64 -66
- package/lib/module/views/BottomTabViewCustom.js.map +1 -1
- package/lib/module/views/BottomTabViewNativeImpl.js +299 -100
- package/lib/module/views/BottomTabViewNativeImpl.js.map +1 -1
- package/lib/module/views/ScreenContent.js.map +1 -1
- package/lib/module/views/TabBarIcon.js +5 -14
- package/lib/module/views/TabBarIcon.js.map +1 -1
- package/lib/typescript/src/index.d.ts +3 -3
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/navigators/createBottomTabNavigator.d.ts +8 -14
- package/lib/typescript/src/navigators/createBottomTabNavigator.d.ts.map +1 -1
- package/lib/typescript/src/types.d.ts +56 -108
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/lib/typescript/src/views/BottomTabBar.d.ts.map +1 -1
- package/lib/typescript/src/views/BottomTabItem.d.ts +16 -16
- package/lib/typescript/src/views/BottomTabItem.d.ts.map +1 -1
- package/lib/typescript/src/views/{BottomTabViewCommon.d.ts → BottomTabView.d.ts} +1 -1
- package/lib/typescript/src/views/BottomTabView.d.ts.map +1 -0
- package/lib/typescript/src/views/BottomTabViewCustom.d.ts +1 -1
- package/lib/typescript/src/views/BottomTabViewCustom.d.ts.map +1 -1
- package/lib/typescript/src/views/BottomTabViewNativeImpl.d.ts.map +1 -1
- package/lib/typescript/src/views/ScreenContent.d.ts +2 -2
- package/lib/typescript/src/views/ScreenContent.d.ts.map +1 -1
- package/lib/typescript/src/views/TabBarIcon.d.ts +6 -6
- package/lib/typescript/src/views/TabBarIcon.d.ts.map +1 -1
- package/package.json +18 -21
- package/src/index.tsx +2 -2
- package/src/navigators/createBottomTabNavigator.tsx +10 -75
- package/src/types.tsx +56 -116
- package/src/utils/useBottomTabAnimation.tsx +1 -1
- package/src/utils/useBottomTabBarHeight.tsx +1 -1
- package/src/views/BottomTabBar.tsx +24 -12
- package/src/views/BottomTabItem.tsx +17 -19
- package/src/views/BottomTabViewCustom.tsx +119 -117
- package/src/views/BottomTabViewNativeImpl.tsx +447 -151
- package/src/views/ScreenContent.tsx +1 -2
- package/src/views/TabBarIcon.tsx +17 -24
- package/lib/module/views/BottomTabViewCommon.js.map +0 -1
- package/lib/typescript/src/views/BottomTabViewCommon.d.ts.map +0 -1
- /package/src/views/{BottomTabViewCommon.tsx → BottomTabView.tsx} +0 -0
|
@@ -12,7 +12,7 @@ type Props = {
|
|
|
12
12
|
/**
|
|
13
13
|
* The `href` to use for the anchor tag on web
|
|
14
14
|
*/
|
|
15
|
-
href?: string;
|
|
15
|
+
href?: string | undefined;
|
|
16
16
|
/**
|
|
17
17
|
* Whether the tab is focused.
|
|
18
18
|
*/
|
|
@@ -37,23 +37,23 @@ type Props = {
|
|
|
37
37
|
/**
|
|
38
38
|
* Text to show in a badge on the tab icon.
|
|
39
39
|
*/
|
|
40
|
-
badge?: number | string;
|
|
40
|
+
badge?: number | string | undefined;
|
|
41
41
|
/**
|
|
42
42
|
* Custom style for the badge.
|
|
43
43
|
*/
|
|
44
|
-
badgeStyle?: StyleProp<TextStyle
|
|
44
|
+
badgeStyle?: StyleProp<TextStyle> | undefined;
|
|
45
45
|
/**
|
|
46
46
|
* The button for the tab. Uses a `Pressable` by default.
|
|
47
47
|
*/
|
|
48
|
-
button?: (props: BottomTabBarButtonProps) => React.ReactNode;
|
|
48
|
+
button?: ((props: BottomTabBarButtonProps) => React.ReactNode) | undefined;
|
|
49
49
|
/**
|
|
50
50
|
* The accessibility label for the tab.
|
|
51
51
|
*/
|
|
52
|
-
accessibilityLabel?: string;
|
|
52
|
+
accessibilityLabel?: string | undefined;
|
|
53
53
|
/**
|
|
54
54
|
* An unique ID for testing for the tab.
|
|
55
55
|
*/
|
|
56
|
-
testID?: string;
|
|
56
|
+
testID?: string | undefined;
|
|
57
57
|
/**
|
|
58
58
|
* Function to execute on press in React Native.
|
|
59
59
|
* On the web, this will use onClick.
|
|
@@ -84,44 +84,44 @@ type Props = {
|
|
|
84
84
|
/**
|
|
85
85
|
* Color for the icon and label when the item is active.
|
|
86
86
|
*/
|
|
87
|
-
activeTintColor?: ColorValue;
|
|
87
|
+
activeTintColor?: ColorValue | undefined;
|
|
88
88
|
/**
|
|
89
89
|
* Color for the icon and label when the item is inactive.
|
|
90
90
|
*/
|
|
91
|
-
inactiveTintColor?: ColorValue;
|
|
91
|
+
inactiveTintColor?: ColorValue | undefined;
|
|
92
92
|
/**
|
|
93
93
|
* Background color for item when its active.
|
|
94
94
|
*/
|
|
95
|
-
activeBackgroundColor?: ColorValue;
|
|
95
|
+
activeBackgroundColor?: ColorValue | undefined;
|
|
96
96
|
/**
|
|
97
97
|
* Background color for item when its inactive.
|
|
98
98
|
*/
|
|
99
|
-
inactiveBackgroundColor?: ColorValue;
|
|
99
|
+
inactiveBackgroundColor?: ColorValue | undefined;
|
|
100
100
|
/**
|
|
101
101
|
* Color of tab bar item's ripple effect.
|
|
102
102
|
*/
|
|
103
|
-
rippleColor?: ColorValue;
|
|
103
|
+
rippleColor?: ColorValue | undefined;
|
|
104
104
|
/**
|
|
105
105
|
* Label visibility mode for the tab bar item.
|
|
106
106
|
*/
|
|
107
|
-
labelVisibilityMode?: TabBarItemLabelVisibilityMode;
|
|
107
|
+
labelVisibilityMode?: TabBarItemLabelVisibilityMode | undefined;
|
|
108
108
|
/**
|
|
109
109
|
* Whether to allow scaling the font for the label for accessibility purposes.
|
|
110
110
|
* Defaults to `false` on iOS 13+ where it uses `largeContentTitle`.
|
|
111
111
|
*/
|
|
112
|
-
allowFontScaling?: boolean;
|
|
112
|
+
allowFontScaling?: boolean | undefined;
|
|
113
113
|
/**
|
|
114
114
|
* Style object for the label element.
|
|
115
115
|
*/
|
|
116
|
-
labelStyle?: StyleProp<TextStyle
|
|
116
|
+
labelStyle?: StyleProp<TextStyle> | undefined;
|
|
117
117
|
/**
|
|
118
118
|
* Style object for the icon element.
|
|
119
119
|
*/
|
|
120
|
-
iconStyle?: StyleProp<ViewStyle
|
|
120
|
+
iconStyle?: StyleProp<ViewStyle> | undefined;
|
|
121
121
|
/**
|
|
122
122
|
* Style object for the wrapper element.
|
|
123
123
|
*/
|
|
124
|
-
style?: StyleProp<ViewStyle
|
|
124
|
+
style?: StyleProp<ViewStyle> | undefined;
|
|
125
125
|
};
|
|
126
126
|
export declare function BottomTabItem({ route, href, focused, descriptor, label, icon, badge, badgeStyle, button, accessibilityLabel, testID, onPress, onLongPress, horizontal, compact, sidebar, variant, activeTintColor: customActiveTintColor, inactiveTintColor: customInactiveTintColor, activeBackgroundColor: customActiveBackgroundColor, inactiveBackgroundColor, rippleColor, labelVisibilityMode, allowFontScaling, labelStyle, iconStyle, style, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
127
127
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomTabItem.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabItem.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,KAAK,EAAY,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,KAAK,UAAU,EACf,KAAK,qBAAqB,EAE1B,KAAK,SAAS,EAEd,KAAK,SAAS,EAEd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,sBAAsB,CAAC;AAE1E,OAAO,KAAK,EACV,uBAAuB,EACvB,mBAAmB,EACnB,aAAa,EACd,MAAM,UAAU,CAAC;AAClB,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAEhE,KAAK,KAAK,GAAG;IACX;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"BottomTabItem.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabItem.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BottomTabView.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabView.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"}
|
|
@@ -5,6 +5,6 @@ type Props = BottomTabNavigationConfig & {
|
|
|
5
5
|
navigation: BottomTabNavigationHelpers;
|
|
6
6
|
descriptors: BottomTabDescriptorMap;
|
|
7
7
|
};
|
|
8
|
-
export declare function BottomTabViewCustom({ tabBar, state, navigation, descriptors,
|
|
8
|
+
export declare function BottomTabViewCustom({ tabBar, state, navigation, descriptors, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
9
9
|
export {};
|
|
10
10
|
//# sourceMappingURL=BottomTabViewCustom.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomTabViewCustom.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabViewCustom.tsx"],"names":[],"mappings":"AAKA,OAAO,EAEL,KAAK,aAAa,EAElB,KAAK,kBAAkB,EACxB,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"BottomTabViewCustom.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabViewCustom.tsx"],"names":[],"mappings":"AAKA,OAAO,EAEL,KAAK,aAAa,EAElB,KAAK,kBAAkB,EACxB,MAAM,0BAA0B,CAAC;AAclC,OAAO,KAAK,EAEV,sBAAsB,EACtB,yBAAyB,EACzB,0BAA0B,EAG3B,MAAM,UAAU,CAAC;AASlB,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;AA8BF,wBAAgB,mBAAmB,CAAC,EAClC,MAA4B,EAC5B,KAAK,EACL,UAAU,EACV,WAAW,GACZ,EAAE,KAAK,2CAiQP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomTabViewNativeImpl.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabViewNativeImpl.tsx"],"names":[],"mappings":"AAMA,OAAO,EAIL,KAAK,aAAa,EAGlB,KAAK,kBAAkB,EAExB,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"BottomTabViewNativeImpl.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabViewNativeImpl.tsx"],"names":[],"mappings":"AAMA,OAAO,EAIL,KAAK,aAAa,EAGlB,KAAK,kBAAkB,EAExB,MAAM,0BAA0B,CAAC;AAsBlC,OAAO,KAAK,EACV,sBAAsB,EACtB,yBAAyB,EACzB,0BAA0B,EAC3B,MAAM,UAAU,CAAC;AAMlB,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;AAoEF,wBAAgB,mBAAmB,CAAC,EAClC,KAAK,EACL,UAAU,EACV,WAAW,EACX,MAAM,GACP,EAAE,KAAK,2CAqiBP"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
+
import { Screen } from '@react-navigation/elements/internal';
|
|
1
2
|
import type { ParamListBase, Route } from '@react-navigation/native';
|
|
2
3
|
import * as React from 'react';
|
|
3
|
-
import { type StyleProp, type ViewStyle } from 'react-native';
|
|
4
4
|
import type { BottomTabNavigationOptions, BottomTabNavigationProp } from '../types';
|
|
5
5
|
export declare function ScreenContent({ isFocused, route, navigation, options, style, children, }: {
|
|
6
6
|
isFocused: boolean;
|
|
7
7
|
route: Route<string>;
|
|
8
8
|
navigation: BottomTabNavigationProp<ParamListBase>;
|
|
9
9
|
options: BottomTabNavigationOptions;
|
|
10
|
-
style?:
|
|
10
|
+
style?: React.ComponentProps<typeof Screen>['style'];
|
|
11
11
|
children: React.ReactNode;
|
|
12
12
|
}): import("react/jsx-runtime").JSX.Element;
|
|
13
13
|
//# sourceMappingURL=ScreenContent.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScreenContent.d.ts","sourceRoot":"","sources":["../../../../src/views/ScreenContent.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ScreenContent.d.ts","sourceRoot":"","sources":["../../../../src/views/ScreenContent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qCAAqC,CAAC;AAC7D,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AACrE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EACV,0BAA0B,EAC1B,uBAAuB,EACxB,MAAM,UAAU,CAAC;AAElB,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,KAAK,EACL,UAAU,EACV,OAAO,EACP,KAAK,EACL,QAAQ,GACT,EAAE;IACD,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,UAAU,EAAE,uBAAuB,CAAC,aAAa,CAAC,CAAC;IACnD,OAAO,EAAE,0BAA0B,CAAC;IACpC,KAAK,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,2CAgCA"}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
+
import { type Icon } from '@react-navigation/elements';
|
|
1
2
|
import { type Route } from '@react-navigation/native';
|
|
2
3
|
import React from 'react';
|
|
3
4
|
import { type ColorValue, type StyleProp, type TextStyle, type ViewStyle } from 'react-native';
|
|
4
|
-
import type { BottomTabIcon } from '../types';
|
|
5
5
|
export type TabBarIconProps = {
|
|
6
6
|
route: Route<string>;
|
|
7
7
|
variant: 'uikit' | 'material';
|
|
8
8
|
size: 'compact' | 'regular';
|
|
9
|
-
badge?: string | number;
|
|
10
|
-
badgeStyle?: StyleProp<TextStyle
|
|
9
|
+
badge?: string | number | undefined;
|
|
10
|
+
badgeStyle?: StyleProp<TextStyle> | undefined;
|
|
11
11
|
activeOpacity: number;
|
|
12
12
|
inactiveOpacity: number;
|
|
13
13
|
activeTintColor: ColorValue;
|
|
14
14
|
inactiveTintColor: ColorValue;
|
|
15
|
-
icon:
|
|
15
|
+
icon: Icon | ((props: {
|
|
16
16
|
focused: boolean;
|
|
17
17
|
color: ColorValue;
|
|
18
18
|
size: number;
|
|
19
|
-
}) =>
|
|
20
|
-
allowFontScaling?: boolean;
|
|
19
|
+
}) => Icon | React.ReactNode);
|
|
20
|
+
allowFontScaling?: boolean | undefined;
|
|
21
21
|
style: StyleProp<ViewStyle>;
|
|
22
22
|
};
|
|
23
23
|
export declare function TabBarIcon({ route: _, variant, size, badge, badgeStyle, activeOpacity, inactiveOpacity, activeTintColor, inactiveTintColor, icon, allowFontScaling, style, }: TabBarIconProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBarIcon.d.ts","sourceRoot":"","sources":["../../../../src/views/TabBarIcon.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TabBarIcon.d.ts","sourceRoot":"","sources":["../../../../src/views/TabBarIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAE9D,OAAO,EAAkB,KAAK,KAAK,EAAY,MAAM,0BAA0B,CAAC;AAChF,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,KAAK,UAAU,EAEf,KAAK,SAAS,EAEd,KAAK,SAAS,EAEd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,OAAO,EAAE,OAAO,GAAG,UAAU,CAAC;IAC9B,IAAI,EAAE,SAAS,GAAG,SAAS,CAAC;IAC5B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACpC,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IAC9C,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,UAAU,CAAC;IAC5B,iBAAiB,EAAE,UAAU,CAAC;IAC9B,IAAI,EACA,IAAI,GACJ,CAAC,CAAC,KAAK,EAAE;QACP,OAAO,EAAE,OAAO,CAAC;QACjB,KAAK,EAAE,UAAU,CAAC;QAClB,IAAI,EAAE,MAAM,CAAC;KACd,KAAK,IAAI,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;IAClC,gBAAgB,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACvC,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC7B,CAAC;AAcF,wBAAgB,UAAU,CAAC,EACzB,KAAK,EAAE,CAAC,EACR,OAAO,EACP,IAAI,EACJ,KAAK,EACL,UAAU,EACV,aAAa,EACb,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,IAAI,EACJ,gBAAgB,EAChB,KAAK,GACN,EAAE,eAAe,2CAwDjB"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-navigation/bottom-tabs",
|
|
3
3
|
"description": "Bottom tab navigator following iOS design guidelines",
|
|
4
|
-
"version": "8.0.0-alpha.
|
|
4
|
+
"version": "8.0.0-alpha.31",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native-component",
|
|
7
7
|
"react-component",
|
|
@@ -41,31 +41,28 @@
|
|
|
41
41
|
"clean": "del lib"
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@react-navigation/elements": "^3.0.0-alpha.
|
|
45
|
-
"color": "^4.2.3",
|
|
46
|
-
"sf-symbols-typescript": "^2.2.0"
|
|
44
|
+
"@react-navigation/elements": "^3.0.0-alpha.29"
|
|
47
45
|
},
|
|
48
46
|
"devDependencies": {
|
|
49
|
-
"@jest/globals": "^30.
|
|
50
|
-
"@react-navigation/native": "^8.0.0-alpha.
|
|
51
|
-
"@testing-library/react-native": "^13.
|
|
52
|
-
"@types/
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"react": "
|
|
56
|
-
"react-native": "0.
|
|
57
|
-
"react-native-
|
|
58
|
-
"react-native-
|
|
59
|
-
"react-
|
|
60
|
-
"
|
|
61
|
-
"typescript": "^5.9.2"
|
|
47
|
+
"@jest/globals": "^30.3.0",
|
|
48
|
+
"@react-navigation/native": "^8.0.0-alpha.26",
|
|
49
|
+
"@testing-library/react-native": "^13.3.3",
|
|
50
|
+
"@types/react": "~19.2.2",
|
|
51
|
+
"del-cli": "^7.0.0",
|
|
52
|
+
"react": "19.2.0",
|
|
53
|
+
"react-native": "0.83.4",
|
|
54
|
+
"react-native-builder-bob": "^0.41.0",
|
|
55
|
+
"react-native-safe-area-context": "~5.6.2",
|
|
56
|
+
"react-native-screens": "^4.25.0",
|
|
57
|
+
"react-test-renderer": "19.2.0",
|
|
58
|
+
"typescript": "^6.0.2"
|
|
62
59
|
},
|
|
63
60
|
"peerDependencies": {
|
|
64
|
-
"@react-navigation/native": "^8.0.0-alpha.
|
|
65
|
-
"react": ">= 19.
|
|
61
|
+
"@react-navigation/native": "^8.0.0-alpha.26",
|
|
62
|
+
"react": ">= 19.2.0",
|
|
66
63
|
"react-native": "*",
|
|
67
64
|
"react-native-safe-area-context": ">= 5.5.0",
|
|
68
|
-
"react-native-screens": ">= 4.
|
|
65
|
+
"react-native-screens": ">= 4.25.0"
|
|
69
66
|
},
|
|
70
67
|
"react-native-builder-bob": {
|
|
71
68
|
"source": "src",
|
|
@@ -85,5 +82,5 @@
|
|
|
85
82
|
]
|
|
86
83
|
]
|
|
87
84
|
},
|
|
88
|
-
"gitHead": "
|
|
85
|
+
"gitHead": "f7b2582ce8d3c3fbe4188b271dd194f46f773654"
|
|
89
86
|
}
|
package/src/index.tsx
CHANGED
|
@@ -11,6 +11,7 @@ export { SceneStyleInterpolators, TransitionPresets, TransitionSpecs };
|
|
|
11
11
|
* Navigators
|
|
12
12
|
*/
|
|
13
13
|
export {
|
|
14
|
+
type BottomTabTypeBag,
|
|
14
15
|
createBottomTabNavigator,
|
|
15
16
|
createBottomTabScreen,
|
|
16
17
|
} from './navigators/createBottomTabNavigator';
|
|
@@ -19,7 +20,7 @@ export {
|
|
|
19
20
|
* Views
|
|
20
21
|
*/
|
|
21
22
|
export { BottomTabBar } from './views/BottomTabBar';
|
|
22
|
-
export { BottomTabView } from './views/
|
|
23
|
+
export { BottomTabView } from './views/BottomTabView';
|
|
23
24
|
|
|
24
25
|
/**
|
|
25
26
|
* Utilities
|
|
@@ -36,7 +37,6 @@ export type {
|
|
|
36
37
|
BottomTabBarButtonProps,
|
|
37
38
|
BottomTabBarProps,
|
|
38
39
|
BottomTabHeaderProps,
|
|
39
|
-
BottomTabIcon,
|
|
40
40
|
BottomTabNavigationEventMap,
|
|
41
41
|
BottomTabNavigationOptions,
|
|
42
42
|
BottomTabNavigationProp,
|
|
@@ -1,28 +1,21 @@
|
|
|
1
1
|
import {
|
|
2
2
|
createNavigatorFactory,
|
|
3
|
+
createScreenFactory,
|
|
4
|
+
type NavigatorTypeBagBase,
|
|
3
5
|
type ParamListBase,
|
|
4
|
-
StackActions,
|
|
5
|
-
type StaticConfig,
|
|
6
|
-
type StaticParamList,
|
|
7
|
-
type StaticScreenConfig,
|
|
8
|
-
type StaticScreenConfigLinking,
|
|
9
|
-
type StaticScreenConfigScreen,
|
|
10
6
|
type TabActionHelpers,
|
|
11
7
|
type TabNavigationState,
|
|
12
8
|
TabRouter,
|
|
13
9
|
type TabRouterOptions,
|
|
14
|
-
type TypedNavigator,
|
|
15
10
|
useNavigationBuilder,
|
|
16
11
|
} from '@react-navigation/native';
|
|
17
|
-
import * as React from 'react';
|
|
18
12
|
|
|
19
13
|
import type {
|
|
20
14
|
BottomTabNavigationEventMap,
|
|
21
15
|
BottomTabNavigationOptions,
|
|
22
|
-
BottomTabNavigationProp,
|
|
23
16
|
BottomTabNavigatorProps,
|
|
24
17
|
} from '../types';
|
|
25
|
-
import { BottomTabView } from '../views/
|
|
18
|
+
import { BottomTabView } from '../views/BottomTabView';
|
|
26
19
|
|
|
27
20
|
function BottomTabNavigator({
|
|
28
21
|
initialRouteName,
|
|
@@ -55,32 +48,6 @@ function BottomTabNavigator({
|
|
|
55
48
|
router,
|
|
56
49
|
});
|
|
57
50
|
|
|
58
|
-
const focusedRouteKey = state.routes[state.index].key;
|
|
59
|
-
const previousRouteKeyRef = React.useRef(focusedRouteKey);
|
|
60
|
-
|
|
61
|
-
React.useEffect(() => {
|
|
62
|
-
const previousRouteKey = previousRouteKeyRef.current;
|
|
63
|
-
|
|
64
|
-
if (
|
|
65
|
-
previousRouteKey !== focusedRouteKey &&
|
|
66
|
-
descriptors[previousRouteKey]?.options.popToTopOnBlur
|
|
67
|
-
) {
|
|
68
|
-
const prevRoute = state.routes.find(
|
|
69
|
-
(route) => route.key === previousRouteKey
|
|
70
|
-
);
|
|
71
|
-
|
|
72
|
-
if (prevRoute?.state?.type === 'stack' && prevRoute.state.key) {
|
|
73
|
-
const popToTopAction = {
|
|
74
|
-
...StackActions.popToTop(),
|
|
75
|
-
target: prevRoute.state.key,
|
|
76
|
-
};
|
|
77
|
-
navigation.dispatch(popToTopAction);
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
previousRouteKeyRef.current = focusedRouteKey;
|
|
82
|
-
}, [descriptors, focusedRouteKey, navigation, state.index, state.routes]);
|
|
83
|
-
|
|
84
51
|
return (
|
|
85
52
|
<NavigationContent>
|
|
86
53
|
<BottomTabView
|
|
@@ -93,47 +60,15 @@ function BottomTabNavigator({
|
|
|
93
60
|
);
|
|
94
61
|
}
|
|
95
62
|
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
State: TabNavigationState<ParamList>;
|
|
63
|
+
export interface BottomTabTypeBag extends NavigatorTypeBagBase {
|
|
64
|
+
State: TabNavigationState<this['ParamList']>;
|
|
99
65
|
ScreenOptions: BottomTabNavigationOptions;
|
|
100
66
|
EventMap: BottomTabNavigationEventMap;
|
|
101
|
-
|
|
102
|
-
[RouteName in keyof ParamList]: BottomTabNavigationProp<
|
|
103
|
-
ParamList,
|
|
104
|
-
RouteName
|
|
105
|
-
>;
|
|
106
|
-
};
|
|
67
|
+
ActionHelpers: TabActionHelpers<this['ParamList']>;
|
|
107
68
|
Navigator: typeof BottomTabNavigator;
|
|
108
|
-
};
|
|
109
|
-
|
|
110
|
-
export function createBottomTabNavigator<
|
|
111
|
-
const ParamList extends ParamListBase,
|
|
112
|
-
>(): TypedNavigator<BottomTabTypeBag<ParamList>, undefined>;
|
|
113
|
-
export function createBottomTabNavigator<
|
|
114
|
-
const Config extends StaticConfig<BottomTabTypeBag<ParamListBase>>,
|
|
115
|
-
>(
|
|
116
|
-
config: Config
|
|
117
|
-
): TypedNavigator<
|
|
118
|
-
BottomTabTypeBag<StaticParamList<{ config: Config }>>,
|
|
119
|
-
Config
|
|
120
|
-
>;
|
|
121
|
-
export function createBottomTabNavigator(config?: unknown) {
|
|
122
|
-
return createNavigatorFactory(BottomTabNavigator)(config);
|
|
123
69
|
}
|
|
124
70
|
|
|
125
|
-
export
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
>(
|
|
129
|
-
config: StaticScreenConfig<
|
|
130
|
-
Linking,
|
|
131
|
-
Screen,
|
|
132
|
-
TabNavigationState<ParamListBase>,
|
|
133
|
-
BottomTabNavigationOptions,
|
|
134
|
-
BottomTabNavigationEventMap,
|
|
135
|
-
BottomTabNavigationProp<ParamListBase>
|
|
136
|
-
>
|
|
137
|
-
) {
|
|
138
|
-
return config;
|
|
139
|
-
}
|
|
71
|
+
export const createBottomTabNavigator =
|
|
72
|
+
createNavigatorFactory<BottomTabTypeBag>(BottomTabNavigator);
|
|
73
|
+
|
|
74
|
+
export const createBottomTabScreen = createScreenFactory<BottomTabTypeBag>();
|