@react-navigation/material-top-tabs 7.4.11 → 8.0.0-alpha.0
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/createMaterialTopTabNavigator.js +7 -6
- package/lib/module/navigators/createMaterialTopTabNavigator.js.map +1 -1
- package/lib/module/views/MaterialTopTabBar.js +12 -5
- package/lib/module/views/MaterialTopTabBar.js.map +1 -1
- package/lib/typescript/src/index.d.ts +1 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/navigators/createMaterialTopTabNavigator.d.ts +10 -6
- package/lib/typescript/src/navigators/createMaterialTopTabNavigator.d.ts.map +1 -1
- package/lib/typescript/src/types.d.ts +20 -16
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/lib/typescript/src/views/MaterialTopTabBar.d.ts.map +1 -1
- package/package.json +13 -13
- package/src/index.tsx +4 -1
- package/src/navigators/createMaterialTopTabNavigator.tsx +48 -25
- package/src/types.tsx +23 -23
- package/src/views/MaterialTopTabBar.tsx +16 -8
- package/src/views/MaterialTopTabView.tsx +1 -1
package/lib/module/index.js
CHANGED
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createMaterialTopTabNavigator","MaterialTopTabBar","MaterialTopTabView","useTabAnimation"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA;AACA;AACA;AACA,
|
|
1
|
+
{"version":3,"names":["createMaterialTopTabNavigator","createMaterialTopTabScreen","MaterialTopTabBar","MaterialTopTabView","useTabAnimation"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA;AACA;AACA;AACA,SACEA,6BAA6B,EAC7BC,0BAA0B,QACrB,+CAA4C;;AAEnD;AACA;AACA;AACA,SAASC,iBAAiB,QAAQ,8BAA2B;AAC7D,SAASC,kBAAkB,QAAQ,+BAA4B;;AAE/D;AACA;AACA;AACA,SAASC,eAAe,QAAQ,4BAAyB;;AAEzD;AACA;AACA","ignoreList":[]}
|
|
@@ -4,16 +4,15 @@ import { createNavigatorFactory, TabRouter, useNavigationBuilder } from '@react-
|
|
|
4
4
|
import { MaterialTopTabView } from "../views/MaterialTopTabView.js";
|
|
5
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
6
|
function MaterialTopTabNavigator({
|
|
7
|
-
id,
|
|
8
7
|
initialRouteName,
|
|
9
8
|
backBehavior,
|
|
10
|
-
|
|
9
|
+
routeNamesChangeBehavior,
|
|
11
10
|
children,
|
|
12
11
|
layout,
|
|
13
12
|
screenListeners,
|
|
14
13
|
screenOptions,
|
|
15
14
|
screenLayout,
|
|
16
|
-
|
|
15
|
+
router,
|
|
17
16
|
...rest
|
|
18
17
|
}) {
|
|
19
18
|
const {
|
|
@@ -22,16 +21,15 @@ function MaterialTopTabNavigator({
|
|
|
22
21
|
navigation,
|
|
23
22
|
NavigationContent
|
|
24
23
|
} = useNavigationBuilder(TabRouter, {
|
|
25
|
-
id,
|
|
26
24
|
initialRouteName,
|
|
27
25
|
backBehavior,
|
|
28
|
-
|
|
26
|
+
routeNamesChangeBehavior,
|
|
29
27
|
children,
|
|
30
28
|
layout,
|
|
31
29
|
screenListeners,
|
|
32
30
|
screenOptions,
|
|
33
31
|
screenLayout,
|
|
34
|
-
|
|
32
|
+
router
|
|
35
33
|
});
|
|
36
34
|
return /*#__PURE__*/_jsx(NavigationContent, {
|
|
37
35
|
children: /*#__PURE__*/_jsx(MaterialTopTabView, {
|
|
@@ -45,4 +43,7 @@ function MaterialTopTabNavigator({
|
|
|
45
43
|
export function createMaterialTopTabNavigator(config) {
|
|
46
44
|
return createNavigatorFactory(MaterialTopTabNavigator)(config);
|
|
47
45
|
}
|
|
46
|
+
export function createMaterialTopTabScreen(config) {
|
|
47
|
+
return config;
|
|
48
|
+
}
|
|
48
49
|
//# sourceMappingURL=createMaterialTopTabNavigator.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["createNavigatorFactory","TabRouter","useNavigationBuilder","MaterialTopTabView","jsx","_jsx","MaterialTopTabNavigator","
|
|
1
|
+
{"version":3,"names":["createNavigatorFactory","TabRouter","useNavigationBuilder","MaterialTopTabView","jsx","_jsx","MaterialTopTabNavigator","initialRouteName","backBehavior","routeNamesChangeBehavior","children","layout","screenListeners","screenOptions","screenLayout","router","rest","state","descriptors","navigation","NavigationContent","createMaterialTopTabNavigator","config","createMaterialTopTabScreen"],"sourceRoot":"../../../src","sources":["navigators/createMaterialTopTabNavigator.tsx"],"mappings":";;AAAA,SACEA,sBAAsB,EAStBC,SAAS,EAGTC,oBAAoB,QACf,0BAA0B;AAQjC,SAASC,kBAAkB,QAAQ,gCAA6B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEjE,SAASC,uBAAuBA,CAAC;EAC/BC,gBAAgB;EAChBC,YAAY;EACZC,wBAAwB;EACxBC,QAAQ;EACRC,MAAM;EACNC,eAAe;EACfC,aAAa;EACbC,YAAY;EACZC,MAAM;EACN,GAAGC;AACyB,CAAC,EAAE;EAC/B,MAAM;IAAEC,KAAK;IAAEC,WAAW;IAAEC,UAAU;IAAEC;EAAkB,CAAC,GACzDlB,oBAAoB,CAMlBD,SAAS,EAAE;IACXM,gBAAgB;IAChBC,YAAY;IACZC,wBAAwB;IACxBC,QAAQ;IACRC,MAAM;IACNC,eAAe;IACfC,aAAa;IACbC,YAAY;IACZC;EACF,CAAC,CAAC;EAEJ,oBACEV,IAAA,CAACe,iBAAiB;IAAAV,QAAA,eAChBL,IAAA,CAACF,kBAAkB;MAAA,GACba,IAAI;MACRC,KAAK,EAAEA,KAAM;MACbE,UAAU,EAAEA,UAAW;MACvBD,WAAW,EAAEA;IAAY,CAC1B;EAAC,CACe,CAAC;AAExB;AA2BA,OAAO,SAASG,6BAA6BA,CAACC,MAAgB,EAAE;EAC9D,OAAOtB,sBAAsB,CAACM,uBAAuB,CAAC,CAACgB,MAAM,CAAC;AAChE;AAEA,OAAO,SAASC,0BAA0BA,CAIxCD,MAOC,EACD;EACA,OAAOA,MAAM;AACf","ignoreList":[]}
|
|
@@ -1,25 +1,31 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { Text } from '@react-navigation/elements';
|
|
4
|
+
import { Color } from '@react-navigation/elements/internal';
|
|
4
5
|
import { useLinkBuilder, useLocale, useTheme } from '@react-navigation/native';
|
|
5
|
-
import Color from 'color';
|
|
6
6
|
import { StyleSheet } from 'react-native';
|
|
7
7
|
import { TabBar, TabBarIndicator } from 'react-native-tab-view';
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
|
-
const
|
|
9
|
+
const MaterialLabel = ({
|
|
10
10
|
color,
|
|
11
11
|
labelText,
|
|
12
12
|
style,
|
|
13
13
|
allowFontScaling
|
|
14
14
|
}) => {
|
|
15
|
+
const {
|
|
16
|
+
fonts
|
|
17
|
+
} = useTheme();
|
|
15
18
|
return /*#__PURE__*/_jsx(Text, {
|
|
16
19
|
style: [{
|
|
17
20
|
color
|
|
18
|
-
}, styles.label, style],
|
|
21
|
+
}, fonts.medium, styles.label, style],
|
|
19
22
|
allowFontScaling: allowFontScaling,
|
|
20
23
|
children: labelText
|
|
21
24
|
});
|
|
22
25
|
};
|
|
26
|
+
const renderLabelDefault = props => /*#__PURE__*/_jsx(MaterialLabel, {
|
|
27
|
+
...props
|
|
28
|
+
});
|
|
23
29
|
export function MaterialTopTabBar({
|
|
24
30
|
state,
|
|
25
31
|
navigation,
|
|
@@ -27,7 +33,8 @@ export function MaterialTopTabBar({
|
|
|
27
33
|
...rest
|
|
28
34
|
}) {
|
|
29
35
|
const {
|
|
30
|
-
colors
|
|
36
|
+
colors,
|
|
37
|
+
dark
|
|
31
38
|
} = useTheme();
|
|
32
39
|
const {
|
|
33
40
|
direction
|
|
@@ -37,7 +44,7 @@ export function MaterialTopTabBar({
|
|
|
37
44
|
} = useLinkBuilder();
|
|
38
45
|
const focusedOptions = descriptors[state.routes[state.index].key].options;
|
|
39
46
|
const activeColor = focusedOptions.tabBarActiveTintColor ?? colors.text;
|
|
40
|
-
const inactiveColor = focusedOptions.tabBarInactiveTintColor ?? Color(activeColor)
|
|
47
|
+
const inactiveColor = focusedOptions.tabBarInactiveTintColor ?? Color(activeColor)?.alpha(0.5).string() ?? (dark ? 'rgba(255, 255, 255, 0.5)' : 'rgba(0, 0, 0, 0.5)');
|
|
41
48
|
const tabBarOptions = Object.fromEntries(state.routes.map(route => {
|
|
42
49
|
const {
|
|
43
50
|
options
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Text","useLinkBuilder","useLocale","useTheme","
|
|
1
|
+
{"version":3,"names":["Text","Color","useLinkBuilder","useLocale","useTheme","StyleSheet","TabBar","TabBarIndicator","jsx","_jsx","MaterialLabel","color","labelText","style","allowFontScaling","fonts","medium","styles","label","children","renderLabelDefault","props","MaterialTopTabBar","state","navigation","descriptors","rest","colors","dark","direction","buildHref","focusedOptions","routes","index","key","options","activeColor","tabBarActiveTintColor","text","inactiveColor","tabBarInactiveTintColor","alpha","string","tabBarOptions","Object","fromEntries","map","route","title","tabBarLabel","tabBarButtonTestID","tabBarAccessibilityLabel","tabBarBadge","tabBarShowIcon","tabBarShowLabel","tabBarIcon","tabBarAllowFontScaling","tabBarLabelStyle","href","name","params","testID","accessibilityLabel","badge","icon","undefined","focused","labelAllowFontScaling","labelStyle","navigationState","scrollEnabled","tabBarScrollEnabled","bounces","tabBarBounces","pressColor","tabBarPressColor","pressOpacity","tabBarPressOpacity","tabStyle","tabBarItemStyle","indicatorStyle","backgroundColor","primary","tabBarIndicatorStyle","gap","tabBarGap","android_ripple","tabBarAndroidRipple","indicatorContainerStyle","tabBarIndicatorContainerStyle","contentContainerStyle","tabBarContentContainerStyle","card","tabBarStyle","onTabPress","preventDefault","event","emit","type","target","canPreventDefault","defaultPrevented","onTabLongPress","renderIndicator","tabBarIndicator","create","textAlign","fontSize","margin"],"sourceRoot":"../../../src","sources":["views/MaterialTopTabBar.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EACL,6BAA6B,EAC7B,0BAA0B,GAC3B,MAAM,4CAA4C,CAAC;AAEpD;;GAEG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE;;GAEG;AACH,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAE1D;;GAEG;AACH,YAAY,EACV,sBAAsB,EACtB,gCAAgC,EAChC,+BAA+B,EAC/B,4BAA4B,EAC5B,4BAA4B,EAC5B,yBAAyB,EACzB,yBAAyB,GAC1B,MAAM,SAAS,CAAC"}
|
|
@@ -1,16 +1,20 @@
|
|
|
1
|
-
import { type
|
|
1
|
+
import { type ParamListBase, type StaticConfig, type StaticParamList, type StaticScreenConfig, type StaticScreenConfigLinking, type StaticScreenConfigScreen, type TabNavigationState, type TypedNavigator } from '@react-navigation/native';
|
|
2
2
|
import type { MaterialTopTabNavigationEventMap, MaterialTopTabNavigationOptions, MaterialTopTabNavigationProp, MaterialTopTabNavigatorProps } from '../types';
|
|
3
|
-
declare function MaterialTopTabNavigator({
|
|
4
|
-
|
|
3
|
+
declare function MaterialTopTabNavigator({ initialRouteName, backBehavior, routeNamesChangeBehavior, children, layout, screenListeners, screenOptions, screenLayout, router, ...rest }: MaterialTopTabNavigatorProps): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
type MaterialTopTabTypeBag<ParamList extends {}> = {
|
|
5
5
|
ParamList: ParamList;
|
|
6
|
-
NavigatorID: NavigatorID;
|
|
7
6
|
State: TabNavigationState<ParamList>;
|
|
8
7
|
ScreenOptions: MaterialTopTabNavigationOptions;
|
|
9
8
|
EventMap: MaterialTopTabNavigationEventMap;
|
|
10
9
|
NavigationList: {
|
|
11
|
-
[RouteName in keyof ParamList]: MaterialTopTabNavigationProp<ParamList, RouteName
|
|
10
|
+
[RouteName in keyof ParamList]: MaterialTopTabNavigationProp<ParamList, RouteName>;
|
|
12
11
|
};
|
|
13
12
|
Navigator: typeof MaterialTopTabNavigator;
|
|
14
|
-
}
|
|
13
|
+
};
|
|
14
|
+
export declare function createMaterialTopTabNavigator<const ParamList extends ParamListBase>(): TypedNavigator<MaterialTopTabTypeBag<ParamList>, undefined>;
|
|
15
|
+
export declare function createMaterialTopTabNavigator<const Config extends StaticConfig<MaterialTopTabTypeBag<ParamListBase>>>(config: Config): TypedNavigator<MaterialTopTabTypeBag<StaticParamList<{
|
|
16
|
+
config: Config;
|
|
17
|
+
}>>, Config>;
|
|
18
|
+
export declare function createMaterialTopTabScreen<const Linking extends StaticScreenConfigLinking, const Screen extends StaticScreenConfigScreen>(config: StaticScreenConfig<Linking, Screen, TabNavigationState<ParamListBase>, MaterialTopTabNavigationOptions, MaterialTopTabNavigationEventMap, MaterialTopTabNavigationProp<ParamListBase>>): StaticScreenConfig<Linking, Screen, TabNavigationState<ParamListBase>, MaterialTopTabNavigationOptions, MaterialTopTabNavigationEventMap, MaterialTopTabNavigationProp<ParamListBase>>;
|
|
15
19
|
export {};
|
|
16
20
|
//# sourceMappingURL=createMaterialTopTabNavigator.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createMaterialTopTabNavigator.d.ts","sourceRoot":"","sources":["../../../../src/navigators/createMaterialTopTabNavigator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,
|
|
1
|
+
{"version":3,"file":"createMaterialTopTabNavigator.d.ts","sourceRoot":"","sources":["../../../../src/navigators/createMaterialTopTabNavigator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,kBAAkB,EACvB,KAAK,yBAAyB,EAC9B,KAAK,wBAAwB,EAE7B,KAAK,kBAAkB,EAGvB,KAAK,cAAc,EAEpB,MAAM,0BAA0B,CAAC;AAElC,OAAO,KAAK,EACV,gCAAgC,EAChC,+BAA+B,EAC/B,4BAA4B,EAC5B,4BAA4B,EAC7B,MAAM,UAAU,CAAC;AAGlB,iBAAS,uBAAuB,CAAC,EAC/B,gBAAgB,EAChB,YAAY,EACZ,wBAAwB,EACxB,QAAQ,EACR,MAAM,EACN,eAAe,EACf,aAAa,EACb,YAAY,EACZ,MAAM,EACN,GAAG,IAAI,EACR,EAAE,4BAA4B,2CA8B9B;AAED,KAAK,qBAAqB,CAAC,SAAS,SAAS,EAAE,IAAI;IACjD,SAAS,EAAE,SAAS,CAAC;IACrB,KAAK,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACrC,aAAa,EAAE,+BAA+B,CAAC;IAC/C,QAAQ,EAAE,gCAAgC,CAAC;IAC3C,cAAc,EAAE;SACb,SAAS,IAAI,MAAM,SAAS,GAAG,4BAA4B,CAC1D,SAAS,EACT,SAAS,CACV;KACF,CAAC;IACF,SAAS,EAAE,OAAO,uBAAuB,CAAC;CAC3C,CAAC;AAEF,wBAAgB,6BAA6B,CAC3C,KAAK,CAAC,SAAS,SAAS,aAAa,KAClC,cAAc,CAAC,qBAAqB,CAAC,SAAS,CAAC,EAAE,SAAS,CAAC,CAAC;AACjE,wBAAgB,6BAA6B,CAC3C,KAAK,CAAC,MAAM,SAAS,YAAY,CAAC,qBAAqB,CAAC,aAAa,CAAC,CAAC,EAEvE,MAAM,EAAE,MAAM,GACb,cAAc,CACf,qBAAqB,CAAC,eAAe,CAAC;IAAE,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC,EAC1D,MAAM,CACP,CAAC;AAKF,wBAAgB,0BAA0B,CACxC,KAAK,CAAC,OAAO,SAAS,yBAAyB,EAC/C,KAAK,CAAC,MAAM,SAAS,wBAAwB,EAE7C,MAAM,EAAE,kBAAkB,CACxB,OAAO,EACP,MAAM,EACN,kBAAkB,CAAC,aAAa,CAAC,EACjC,+BAA+B,EAC/B,gCAAgC,EAChC,4BAA4B,CAAC,aAAa,CAAC,CAC5C,0LAGF"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { DefaultNavigatorOptions, Descriptor, NavigationHelpers, NavigationProp, ParamListBase, Route, RouteProp, TabActionHelpers, TabNavigationState, TabRouterOptions, Theme } from '@react-navigation/native';
|
|
2
2
|
import type React from 'react';
|
|
3
|
-
import type { Animated, PressableAndroidRippleConfig, StyleProp, TextStyle, ViewStyle } from 'react-native';
|
|
4
|
-
import type {
|
|
3
|
+
import type { Animated, ColorValue, PressableAndroidRippleConfig, StyleProp, TextStyle, ViewStyle } from 'react-native';
|
|
4
|
+
import type { TabBar, TabBarProps, TabViewProps } from 'react-native-tab-view';
|
|
5
5
|
export type MaterialTopTabNavigationEventMap = {
|
|
6
6
|
/**
|
|
7
7
|
* Event which fires on tapping on the tab in the tab bar.
|
|
@@ -30,12 +30,12 @@ export type MaterialTopTabNavigationEventMap = {
|
|
|
30
30
|
};
|
|
31
31
|
};
|
|
32
32
|
export type MaterialTopTabNavigationHelpers = NavigationHelpers<ParamListBase, MaterialTopTabNavigationEventMap> & TabActionHelpers<ParamListBase>;
|
|
33
|
-
export type MaterialTopTabNavigationProp<ParamList extends ParamListBase, RouteName extends keyof ParamList = keyof ParamList
|
|
34
|
-
export type MaterialTopTabScreenProps<ParamList extends ParamListBase, RouteName extends keyof ParamList = keyof ParamList
|
|
35
|
-
navigation: MaterialTopTabNavigationProp<ParamList, RouteName
|
|
33
|
+
export type MaterialTopTabNavigationProp<ParamList extends ParamListBase, RouteName extends keyof ParamList = keyof ParamList> = NavigationProp<ParamList, RouteName, TabNavigationState<ParamList>, MaterialTopTabNavigationOptions, MaterialTopTabNavigationEventMap, TabActionHelpers<ParamList>>;
|
|
34
|
+
export type MaterialTopTabScreenProps<ParamList extends ParamListBase, RouteName extends keyof ParamList = keyof ParamList> = {
|
|
35
|
+
navigation: MaterialTopTabNavigationProp<ParamList, RouteName>;
|
|
36
36
|
route: RouteProp<ParamList, RouteName>;
|
|
37
37
|
};
|
|
38
|
-
export type MaterialTopTabOptionsArgs<ParamList extends ParamListBase, RouteName extends keyof ParamList = keyof ParamList
|
|
38
|
+
export type MaterialTopTabOptionsArgs<ParamList extends ParamListBase, RouteName extends keyof ParamList = keyof ParamList> = MaterialTopTabScreenProps<ParamList, RouteName> & {
|
|
39
39
|
theme: Theme;
|
|
40
40
|
};
|
|
41
41
|
export type MaterialTopTabNavigationOptions = {
|
|
@@ -45,13 +45,13 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
45
45
|
title?: string;
|
|
46
46
|
/**
|
|
47
47
|
* Title string of a tab displayed in the tab bar
|
|
48
|
-
* or a function that given { focused: boolean, color:
|
|
48
|
+
* or a function that given { focused: boolean, color: ColorValue } returns a React.Node, to display in tab bar.
|
|
49
49
|
*
|
|
50
50
|
* When undefined, scene title is used. Use `tabBarShowLabel` to hide the label.
|
|
51
51
|
*/
|
|
52
52
|
tabBarLabel?: string | ((props: {
|
|
53
53
|
focused: boolean;
|
|
54
|
-
color:
|
|
54
|
+
color: ColorValue;
|
|
55
55
|
children: string;
|
|
56
56
|
}) => React.ReactNode);
|
|
57
57
|
/**
|
|
@@ -68,11 +68,11 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
68
68
|
*/
|
|
69
69
|
tabBarShowLabel?: boolean;
|
|
70
70
|
/**
|
|
71
|
-
* A function that given { focused: boolean, color:
|
|
71
|
+
* A function that given { focused: boolean, color: ColorValue } returns a React.Node to display in the tab bar.
|
|
72
72
|
*/
|
|
73
73
|
tabBarIcon?: (props: {
|
|
74
74
|
focused: boolean;
|
|
75
|
-
color:
|
|
75
|
+
color: ColorValue;
|
|
76
76
|
}) => React.ReactElement;
|
|
77
77
|
/**
|
|
78
78
|
* Whether the tab icon should be visible. Defaults to `false`.
|
|
@@ -103,15 +103,15 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
103
103
|
/**
|
|
104
104
|
* Color for the icon and label in the active tab.
|
|
105
105
|
*/
|
|
106
|
-
tabBarActiveTintColor?:
|
|
106
|
+
tabBarActiveTintColor?: ColorValue;
|
|
107
107
|
/**
|
|
108
108
|
* Color for the icon and label in the inactive tabs.
|
|
109
109
|
*/
|
|
110
|
-
tabBarInactiveTintColor?:
|
|
110
|
+
tabBarInactiveTintColor?: ColorValue;
|
|
111
111
|
/**
|
|
112
112
|
* Color for material ripple (Android >= 5.0 only).
|
|
113
113
|
*/
|
|
114
|
-
tabBarPressColor?:
|
|
114
|
+
tabBarPressColor?: ColorValue;
|
|
115
115
|
/**
|
|
116
116
|
* Opacity for pressed tab (iOS and Android < 5.0 only).
|
|
117
117
|
*/
|
|
@@ -196,13 +196,17 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
196
196
|
};
|
|
197
197
|
export type MaterialTopTabDescriptor = Descriptor<MaterialTopTabNavigationOptions, MaterialTopTabNavigationProp<ParamListBase>, RouteProp<ParamListBase>>;
|
|
198
198
|
export type MaterialTopTabDescriptorMap = Record<string, MaterialTopTabDescriptor>;
|
|
199
|
-
export type MaterialTopTabNavigationConfig = Omit<TabViewProps<Route<string>>, 'navigationState' | 'onIndexChange' | 'onSwipeStart' | 'onSwipeEnd' | 'renderScene' | 'renderTabBar' | 'renderLazyPlaceholder' | 'swipeEnabled' | 'animationEnabled' | 'lazy' | 'lazyPreloadDistance' | 'lazyPlaceholder'> & {
|
|
199
|
+
export type MaterialTopTabNavigationConfig = Omit<TabViewProps<Route<string>>, 'navigationState' | 'onIndexChange' | 'onSwipeStart' | 'onSwipeEnd' | 'renderScene' | 'renderTabBar' | 'renderLazyPlaceholder' | 'renderAdapter' | 'swipeEnabled' | 'animationEnabled' | 'lazy' | 'lazyPreloadDistance' | 'lazyPlaceholder'> & {
|
|
200
200
|
/**
|
|
201
201
|
* Function that returns a React element to display as the tab bar.
|
|
202
202
|
*/
|
|
203
203
|
tabBar?: (props: MaterialTopTabBarProps) => React.ReactNode;
|
|
204
|
+
/**
|
|
205
|
+
* Function that returns a React element to override the underlying adapter.
|
|
206
|
+
*/
|
|
207
|
+
adapter?: TabViewProps<Route<string>>['renderAdapter'];
|
|
204
208
|
};
|
|
205
|
-
export type MaterialTopTabBarProps =
|
|
209
|
+
export type MaterialTopTabBarProps = Pick<TabBarProps<Route<string>>, 'position' | 'subscribe' | 'jumpTo'> & {
|
|
206
210
|
state: TabNavigationState<ParamListBase>;
|
|
207
211
|
navigation: NavigationHelpers<ParamListBase, MaterialTopTabNavigationEventMap>;
|
|
208
212
|
descriptors: MaterialTopTabDescriptorMap;
|
|
@@ -210,5 +214,5 @@ export type MaterialTopTabBarProps = SceneRendererProps & {
|
|
|
210
214
|
export type MaterialTopTabAnimationContext = {
|
|
211
215
|
position: Animated.AnimatedInterpolation<number>;
|
|
212
216
|
};
|
|
213
|
-
export type MaterialTopTabNavigatorProps = DefaultNavigatorOptions<ParamListBase,
|
|
217
|
+
export type MaterialTopTabNavigatorProps = DefaultNavigatorOptions<ParamListBase, TabNavigationState<ParamListBase>, MaterialTopTabNavigationOptions, MaterialTopTabNavigationEventMap, MaterialTopTabNavigationProp<ParamListBase>> & TabRouterOptions & MaterialTopTabNavigationConfig;
|
|
214
218
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,uBAAuB,EACvB,UAAU,EACV,iBAAiB,EACjB,cAAc,EACd,aAAa,EACb,KAAK,EACL,SAAS,EACT,gBAAgB,EAChB,kBAAkB,EAClB,gBAAgB,EAChB,KAAK,EACN,MAAM,0BAA0B,CAAC;AAClC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EACV,QAAQ,EACR,4BAA4B,EAC5B,SAAS,EACT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MaterialTopTabBar.d.ts","sourceRoot":"","sources":["../../../../src/views/MaterialTopTabBar.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"MaterialTopTabBar.d.ts","sourceRoot":"","sources":["../../../../src/views/MaterialTopTabBar.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AA4BvD,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,UAAU,EACV,WAAW,EACX,GAAG,IAAI,EACR,EAAE,sBAAsB,2CAoHxB"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-navigation/material-top-tabs",
|
|
3
3
|
"description": "Integration for the animated tab view component from react-native-tab-view",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "8.0.0-alpha.0",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native-component",
|
|
7
7
|
"react-component",
|
|
@@ -46,30 +46,30 @@
|
|
|
46
46
|
"clean": "del lib"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"@react-navigation/elements": "^
|
|
49
|
+
"@react-navigation/elements": "^3.0.0-alpha.0",
|
|
50
50
|
"color": "^4.2.3",
|
|
51
|
-
"react-native-tab-view": "^
|
|
51
|
+
"react-native-tab-view": "^5.0.0-alpha.0"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
54
|
"@jest/globals": "^30.0.0",
|
|
55
|
-
"@react-navigation/native": "^
|
|
55
|
+
"@react-navigation/native": "^8.0.0-alpha.0",
|
|
56
56
|
"@testing-library/react-native": "^13.2.1",
|
|
57
|
-
"@types/react": "~19.
|
|
57
|
+
"@types/react": "~19.1.10",
|
|
58
58
|
"del-cli": "^6.0.0",
|
|
59
59
|
"react": "19.1.0",
|
|
60
|
-
"react-native": "0.81.
|
|
61
|
-
"react-native-builder-bob": "^0.40.
|
|
62
|
-
"react-native-pager-view": "
|
|
60
|
+
"react-native": "0.81.4",
|
|
61
|
+
"react-native-builder-bob": "^0.40.12",
|
|
62
|
+
"react-native-pager-view": "^8.0.0",
|
|
63
63
|
"react-native-safe-area-context": "~5.6.0",
|
|
64
64
|
"react-test-renderer": "19.1.0",
|
|
65
65
|
"typescript": "^5.9.2"
|
|
66
66
|
},
|
|
67
67
|
"peerDependencies": {
|
|
68
|
-
"@react-navigation/native": "^
|
|
69
|
-
"react": ">=
|
|
68
|
+
"@react-navigation/native": "^8.0.0-alpha.0",
|
|
69
|
+
"react": ">= 19.0.0",
|
|
70
70
|
"react-native": "*",
|
|
71
|
-
"react-native-pager-view": ">=
|
|
72
|
-
"react-native-safe-area-context": ">=
|
|
71
|
+
"react-native-pager-view": ">= 7.0.0",
|
|
72
|
+
"react-native-safe-area-context": ">= 5.5.0"
|
|
73
73
|
},
|
|
74
74
|
"react-native-builder-bob": {
|
|
75
75
|
"source": "src",
|
|
@@ -89,5 +89,5 @@
|
|
|
89
89
|
]
|
|
90
90
|
]
|
|
91
91
|
},
|
|
92
|
-
"gitHead": "
|
|
92
|
+
"gitHead": "46daae524ec6a59737147ed506222dd09a5b6e39"
|
|
93
93
|
}
|
package/src/index.tsx
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Navigators
|
|
3
3
|
*/
|
|
4
|
-
export {
|
|
4
|
+
export {
|
|
5
|
+
createMaterialTopTabNavigator,
|
|
6
|
+
createMaterialTopTabScreen,
|
|
7
|
+
} from './navigators/createMaterialTopTabNavigator';
|
|
5
8
|
|
|
6
9
|
/**
|
|
7
10
|
* Views
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import {
|
|
2
2
|
createNavigatorFactory,
|
|
3
|
-
type NavigatorTypeBagBase,
|
|
4
3
|
type ParamListBase,
|
|
5
4
|
type StaticConfig,
|
|
5
|
+
type StaticParamList,
|
|
6
|
+
type StaticScreenConfig,
|
|
7
|
+
type StaticScreenConfigLinking,
|
|
8
|
+
type StaticScreenConfigScreen,
|
|
6
9
|
type TabActionHelpers,
|
|
7
10
|
type TabNavigationState,
|
|
8
11
|
TabRouter,
|
|
@@ -20,16 +23,15 @@ import type {
|
|
|
20
23
|
import { MaterialTopTabView } from '../views/MaterialTopTabView';
|
|
21
24
|
|
|
22
25
|
function MaterialTopTabNavigator({
|
|
23
|
-
id,
|
|
24
26
|
initialRouteName,
|
|
25
27
|
backBehavior,
|
|
26
|
-
|
|
28
|
+
routeNamesChangeBehavior,
|
|
27
29
|
children,
|
|
28
30
|
layout,
|
|
29
31
|
screenListeners,
|
|
30
32
|
screenOptions,
|
|
31
33
|
screenLayout,
|
|
32
|
-
|
|
34
|
+
router,
|
|
33
35
|
...rest
|
|
34
36
|
}: MaterialTopTabNavigatorProps) {
|
|
35
37
|
const { state, descriptors, navigation, NavigationContent } =
|
|
@@ -40,16 +42,15 @@ function MaterialTopTabNavigator({
|
|
|
40
42
|
MaterialTopTabNavigationOptions,
|
|
41
43
|
MaterialTopTabNavigationEventMap
|
|
42
44
|
>(TabRouter, {
|
|
43
|
-
id,
|
|
44
45
|
initialRouteName,
|
|
45
46
|
backBehavior,
|
|
46
|
-
|
|
47
|
+
routeNamesChangeBehavior,
|
|
47
48
|
children,
|
|
48
49
|
layout,
|
|
49
50
|
screenListeners,
|
|
50
51
|
screenOptions,
|
|
51
52
|
screenLayout,
|
|
52
|
-
|
|
53
|
+
router,
|
|
53
54
|
});
|
|
54
55
|
|
|
55
56
|
return (
|
|
@@ -64,25 +65,47 @@ function MaterialTopTabNavigator({
|
|
|
64
65
|
);
|
|
65
66
|
}
|
|
66
67
|
|
|
68
|
+
type MaterialTopTabTypeBag<ParamList extends {}> = {
|
|
69
|
+
ParamList: ParamList;
|
|
70
|
+
State: TabNavigationState<ParamList>;
|
|
71
|
+
ScreenOptions: MaterialTopTabNavigationOptions;
|
|
72
|
+
EventMap: MaterialTopTabNavigationEventMap;
|
|
73
|
+
NavigationList: {
|
|
74
|
+
[RouteName in keyof ParamList]: MaterialTopTabNavigationProp<
|
|
75
|
+
ParamList,
|
|
76
|
+
RouteName
|
|
77
|
+
>;
|
|
78
|
+
};
|
|
79
|
+
Navigator: typeof MaterialTopTabNavigator;
|
|
80
|
+
};
|
|
81
|
+
|
|
67
82
|
export function createMaterialTopTabNavigator<
|
|
68
83
|
const ParamList extends ParamListBase,
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
RouteName,
|
|
80
|
-
NavigatorID
|
|
81
|
-
>;
|
|
82
|
-
};
|
|
83
|
-
Navigator: typeof MaterialTopTabNavigator;
|
|
84
|
-
},
|
|
85
|
-
const Config extends StaticConfig<TypeBag> = StaticConfig<TypeBag>,
|
|
86
|
-
>(config?: Config): TypedNavigator<TypeBag, Config> {
|
|
84
|
+
>(): TypedNavigator<MaterialTopTabTypeBag<ParamList>, undefined>;
|
|
85
|
+
export function createMaterialTopTabNavigator<
|
|
86
|
+
const Config extends StaticConfig<MaterialTopTabTypeBag<ParamListBase>>,
|
|
87
|
+
>(
|
|
88
|
+
config: Config
|
|
89
|
+
): TypedNavigator<
|
|
90
|
+
MaterialTopTabTypeBag<StaticParamList<{ config: Config }>>,
|
|
91
|
+
Config
|
|
92
|
+
>;
|
|
93
|
+
export function createMaterialTopTabNavigator(config?: unknown) {
|
|
87
94
|
return createNavigatorFactory(MaterialTopTabNavigator)(config);
|
|
88
95
|
}
|
|
96
|
+
|
|
97
|
+
export function createMaterialTopTabScreen<
|
|
98
|
+
const Linking extends StaticScreenConfigLinking,
|
|
99
|
+
const Screen extends StaticScreenConfigScreen,
|
|
100
|
+
>(
|
|
101
|
+
config: StaticScreenConfig<
|
|
102
|
+
Linking,
|
|
103
|
+
Screen,
|
|
104
|
+
TabNavigationState<ParamListBase>,
|
|
105
|
+
MaterialTopTabNavigationOptions,
|
|
106
|
+
MaterialTopTabNavigationEventMap,
|
|
107
|
+
MaterialTopTabNavigationProp<ParamListBase>
|
|
108
|
+
>
|
|
109
|
+
) {
|
|
110
|
+
return config;
|
|
111
|
+
}
|
package/src/types.tsx
CHANGED
|
@@ -14,16 +14,13 @@ import type {
|
|
|
14
14
|
import type React from 'react';
|
|
15
15
|
import type {
|
|
16
16
|
Animated,
|
|
17
|
+
ColorValue,
|
|
17
18
|
PressableAndroidRippleConfig,
|
|
18
19
|
StyleProp,
|
|
19
20
|
TextStyle,
|
|
20
21
|
ViewStyle,
|
|
21
22
|
} from 'react-native';
|
|
22
|
-
import type {
|
|
23
|
-
SceneRendererProps,
|
|
24
|
-
TabBar,
|
|
25
|
-
TabViewProps,
|
|
26
|
-
} from 'react-native-tab-view';
|
|
23
|
+
import type { TabBar, TabBarProps, TabViewProps } from 'react-native-tab-view';
|
|
27
24
|
|
|
28
25
|
export type MaterialTopTabNavigationEventMap = {
|
|
29
26
|
/**
|
|
@@ -53,31 +50,27 @@ export type MaterialTopTabNavigationHelpers = NavigationHelpers<
|
|
|
53
50
|
export type MaterialTopTabNavigationProp<
|
|
54
51
|
ParamList extends ParamListBase,
|
|
55
52
|
RouteName extends keyof ParamList = keyof ParamList,
|
|
56
|
-
NavigatorID extends string | undefined = undefined,
|
|
57
53
|
> = NavigationProp<
|
|
58
54
|
ParamList,
|
|
59
55
|
RouteName,
|
|
60
|
-
NavigatorID,
|
|
61
56
|
TabNavigationState<ParamList>,
|
|
62
57
|
MaterialTopTabNavigationOptions,
|
|
63
|
-
MaterialTopTabNavigationEventMap
|
|
64
|
-
>
|
|
65
|
-
|
|
58
|
+
MaterialTopTabNavigationEventMap,
|
|
59
|
+
TabActionHelpers<ParamList>
|
|
60
|
+
>;
|
|
66
61
|
|
|
67
62
|
export type MaterialTopTabScreenProps<
|
|
68
63
|
ParamList extends ParamListBase,
|
|
69
64
|
RouteName extends keyof ParamList = keyof ParamList,
|
|
70
|
-
NavigatorID extends string | undefined = undefined,
|
|
71
65
|
> = {
|
|
72
|
-
navigation: MaterialTopTabNavigationProp<ParamList, RouteName
|
|
66
|
+
navigation: MaterialTopTabNavigationProp<ParamList, RouteName>;
|
|
73
67
|
route: RouteProp<ParamList, RouteName>;
|
|
74
68
|
};
|
|
75
69
|
|
|
76
70
|
export type MaterialTopTabOptionsArgs<
|
|
77
71
|
ParamList extends ParamListBase,
|
|
78
72
|
RouteName extends keyof ParamList = keyof ParamList,
|
|
79
|
-
|
|
80
|
-
> = MaterialTopTabScreenProps<ParamList, RouteName, NavigatorID> & {
|
|
73
|
+
> = MaterialTopTabScreenProps<ParamList, RouteName> & {
|
|
81
74
|
theme: Theme;
|
|
82
75
|
};
|
|
83
76
|
|
|
@@ -89,7 +82,7 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
89
82
|
|
|
90
83
|
/**
|
|
91
84
|
* Title string of a tab displayed in the tab bar
|
|
92
|
-
* or a function that given { focused: boolean, color:
|
|
85
|
+
* or a function that given { focused: boolean, color: ColorValue } returns a React.Node, to display in tab bar.
|
|
93
86
|
*
|
|
94
87
|
* When undefined, scene title is used. Use `tabBarShowLabel` to hide the label.
|
|
95
88
|
*/
|
|
@@ -97,7 +90,7 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
97
90
|
| string
|
|
98
91
|
| ((props: {
|
|
99
92
|
focused: boolean;
|
|
100
|
-
color:
|
|
93
|
+
color: ColorValue;
|
|
101
94
|
children: string;
|
|
102
95
|
}) => React.ReactNode);
|
|
103
96
|
|
|
@@ -118,11 +111,11 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
118
111
|
tabBarShowLabel?: boolean;
|
|
119
112
|
|
|
120
113
|
/**
|
|
121
|
-
* A function that given { focused: boolean, color:
|
|
114
|
+
* A function that given { focused: boolean, color: ColorValue } returns a React.Node to display in the tab bar.
|
|
122
115
|
*/
|
|
123
116
|
tabBarIcon?: (props: {
|
|
124
117
|
focused: boolean;
|
|
125
|
-
color:
|
|
118
|
+
color: ColorValue;
|
|
126
119
|
}) => React.ReactElement;
|
|
127
120
|
|
|
128
121
|
/**
|
|
@@ -165,17 +158,17 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
165
158
|
/**
|
|
166
159
|
* Color for the icon and label in the active tab.
|
|
167
160
|
*/
|
|
168
|
-
tabBarActiveTintColor?:
|
|
161
|
+
tabBarActiveTintColor?: ColorValue;
|
|
169
162
|
|
|
170
163
|
/**
|
|
171
164
|
* Color for the icon and label in the inactive tabs.
|
|
172
165
|
*/
|
|
173
|
-
tabBarInactiveTintColor?:
|
|
166
|
+
tabBarInactiveTintColor?: ColorValue;
|
|
174
167
|
|
|
175
168
|
/**
|
|
176
169
|
* Color for material ripple (Android >= 5.0 only).
|
|
177
170
|
*/
|
|
178
|
-
tabBarPressColor?:
|
|
171
|
+
tabBarPressColor?: ColorValue;
|
|
179
172
|
|
|
180
173
|
/**
|
|
181
174
|
* Opacity for pressed tab (iOS and Android < 5.0 only).
|
|
@@ -294,6 +287,7 @@ export type MaterialTopTabNavigationConfig = Omit<
|
|
|
294
287
|
| 'renderScene'
|
|
295
288
|
| 'renderTabBar'
|
|
296
289
|
| 'renderLazyPlaceholder'
|
|
290
|
+
| 'renderAdapter'
|
|
297
291
|
| 'swipeEnabled'
|
|
298
292
|
| 'animationEnabled'
|
|
299
293
|
| 'lazy'
|
|
@@ -304,9 +298,16 @@ export type MaterialTopTabNavigationConfig = Omit<
|
|
|
304
298
|
* Function that returns a React element to display as the tab bar.
|
|
305
299
|
*/
|
|
306
300
|
tabBar?: (props: MaterialTopTabBarProps) => React.ReactNode;
|
|
301
|
+
/**
|
|
302
|
+
* Function that returns a React element to override the underlying adapter.
|
|
303
|
+
*/
|
|
304
|
+
adapter?: TabViewProps<Route<string>>['renderAdapter'];
|
|
307
305
|
};
|
|
308
306
|
|
|
309
|
-
export type MaterialTopTabBarProps =
|
|
307
|
+
export type MaterialTopTabBarProps = Pick<
|
|
308
|
+
TabBarProps<Route<string>>,
|
|
309
|
+
'position' | 'subscribe' | 'jumpTo'
|
|
310
|
+
> & {
|
|
310
311
|
state: TabNavigationState<ParamListBase>;
|
|
311
312
|
navigation: NavigationHelpers<
|
|
312
313
|
ParamListBase,
|
|
@@ -321,7 +322,6 @@ export type MaterialTopTabAnimationContext = {
|
|
|
321
322
|
|
|
322
323
|
export type MaterialTopTabNavigatorProps = DefaultNavigatorOptions<
|
|
323
324
|
ParamListBase,
|
|
324
|
-
string | undefined,
|
|
325
325
|
TabNavigationState<ParamListBase>,
|
|
326
326
|
MaterialTopTabNavigationOptions,
|
|
327
327
|
MaterialTopTabNavigationEventMap,
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Text } from '@react-navigation/elements';
|
|
2
|
+
import { Color } from '@react-navigation/elements/internal';
|
|
2
3
|
import {
|
|
3
4
|
type ParamListBase,
|
|
4
5
|
type TabNavigationState,
|
|
@@ -6,8 +7,7 @@ import {
|
|
|
6
7
|
useLocale,
|
|
7
8
|
useTheme,
|
|
8
9
|
} from '@react-navigation/native';
|
|
9
|
-
import
|
|
10
|
-
import { StyleSheet } from 'react-native';
|
|
10
|
+
import { type ColorValue, StyleSheet } from 'react-native';
|
|
11
11
|
import {
|
|
12
12
|
type Route,
|
|
13
13
|
TabBar,
|
|
@@ -21,15 +21,17 @@ type MaterialLabelProps = Parameters<
|
|
|
21
21
|
NonNullable<TabDescriptor<Route>['label']>
|
|
22
22
|
>[0];
|
|
23
23
|
|
|
24
|
-
const
|
|
24
|
+
const MaterialLabel = ({
|
|
25
25
|
color,
|
|
26
26
|
labelText,
|
|
27
27
|
style,
|
|
28
28
|
allowFontScaling,
|
|
29
29
|
}: MaterialLabelProps) => {
|
|
30
|
+
const { fonts } = useTheme();
|
|
31
|
+
|
|
30
32
|
return (
|
|
31
33
|
<Text
|
|
32
|
-
style={[{ color }, styles.label, style]}
|
|
34
|
+
style={[{ color }, fonts.medium, styles.label, style]}
|
|
33
35
|
allowFontScaling={allowFontScaling}
|
|
34
36
|
>
|
|
35
37
|
{labelText}
|
|
@@ -37,22 +39,28 @@ const renderLabelDefault = ({
|
|
|
37
39
|
);
|
|
38
40
|
};
|
|
39
41
|
|
|
42
|
+
const renderLabelDefault = (props: MaterialLabelProps) => (
|
|
43
|
+
<MaterialLabel {...props} />
|
|
44
|
+
);
|
|
45
|
+
|
|
40
46
|
export function MaterialTopTabBar({
|
|
41
47
|
state,
|
|
42
48
|
navigation,
|
|
43
49
|
descriptors,
|
|
44
50
|
...rest
|
|
45
51
|
}: MaterialTopTabBarProps) {
|
|
46
|
-
const { colors } = useTheme();
|
|
52
|
+
const { colors, dark } = useTheme();
|
|
47
53
|
const { direction } = useLocale();
|
|
48
54
|
const { buildHref } = useLinkBuilder();
|
|
49
55
|
|
|
50
56
|
const focusedOptions = descriptors[state.routes[state.index].key].options;
|
|
51
57
|
|
|
52
|
-
const activeColor =
|
|
53
|
-
|
|
58
|
+
const activeColor: ColorValue =
|
|
59
|
+
focusedOptions.tabBarActiveTintColor ?? colors.text;
|
|
60
|
+
const inactiveColor: ColorValue =
|
|
54
61
|
focusedOptions.tabBarInactiveTintColor ??
|
|
55
|
-
Color(activeColor)
|
|
62
|
+
Color(activeColor)?.alpha(0.5).string() ??
|
|
63
|
+
(dark ? 'rgba(255, 255, 255, 0.5)' : 'rgba(0, 0, 0, 0.5)');
|
|
56
64
|
|
|
57
65
|
const tabBarOptions = Object.fromEntries(
|
|
58
66
|
state.routes.map((route) => {
|