@react-navigation/material-top-tabs 7.0.0-alpha.10 → 7.0.0-alpha.12
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/commonjs/views/MaterialTopTabBar.js +46 -86
- package/lib/commonjs/views/MaterialTopTabBar.js.map +1 -1
- package/lib/module/views/MaterialTopTabBar.js +48 -88
- package/lib/module/views/MaterialTopTabBar.js.map +1 -1
- package/lib/typescript/src/types.d.ts +2 -6
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/lib/typescript/src/views/MaterialTopTabBar.d.ts.map +1 -1
- package/package.json +6 -6
- package/src/types.tsx +5 -7
- package/src/views/MaterialTopTabBar.tsx +59 -70
|
@@ -14,24 +14,61 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
|
|
|
14
14
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
15
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
16
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
17
|
-
|
|
17
|
+
const MaterialLabel = _ref => {
|
|
18
|
+
let {
|
|
19
|
+
color,
|
|
20
|
+
label,
|
|
21
|
+
labelStyle,
|
|
22
|
+
allowScaling
|
|
23
|
+
} = _ref;
|
|
24
|
+
return /*#__PURE__*/React.createElement(_elements.Text, {
|
|
25
|
+
style: [{
|
|
26
|
+
color
|
|
27
|
+
}, styles.label, labelStyle],
|
|
28
|
+
allowFontScaling: allowScaling
|
|
29
|
+
}, label);
|
|
30
|
+
};
|
|
31
|
+
const renderLabel = props => {
|
|
32
|
+
return /*#__PURE__*/React.createElement(MaterialLabel, props);
|
|
33
|
+
};
|
|
34
|
+
function MaterialTopTabBar(_ref2) {
|
|
18
35
|
let {
|
|
19
36
|
state,
|
|
20
37
|
navigation,
|
|
21
38
|
descriptors,
|
|
22
39
|
...rest
|
|
23
|
-
} =
|
|
40
|
+
} = _ref2;
|
|
24
41
|
const {
|
|
25
42
|
colors
|
|
26
43
|
} = (0, _native.useTheme)();
|
|
27
44
|
const {
|
|
28
45
|
direction
|
|
29
46
|
} = (0, _native.useLocale)();
|
|
47
|
+
const {
|
|
48
|
+
buildHref
|
|
49
|
+
} = (0, _native.useLinkBuilder)();
|
|
30
50
|
const focusedOptions = descriptors[state.routes[state.index].key].options;
|
|
31
51
|
const activeColor = focusedOptions.tabBarActiveTintColor ?? colors.text;
|
|
32
52
|
const inactiveColor = focusedOptions.tabBarInactiveTintColor ?? (0, _color.default)(activeColor).alpha(0.5).rgb().string();
|
|
53
|
+
const tabBarOptions = Object.fromEntries(state.routes.map(route => {
|
|
54
|
+
const {
|
|
55
|
+
options
|
|
56
|
+
} = descriptors[route.key];
|
|
57
|
+
return [route.key, {
|
|
58
|
+
href: buildHref(route.name, route.params),
|
|
59
|
+
testID: options.tabBarButtonTestID,
|
|
60
|
+
accessibilityLabel: options.tabBarAccessibilityLabel,
|
|
61
|
+
badge: options.tabBarBadge,
|
|
62
|
+
icon: options.tabBarShowIcon === false ? undefined : options.tabBarIcon,
|
|
63
|
+
label: options.tabBarShowLabel === false ? undefined : renderLabel,
|
|
64
|
+
labelAllowFontScaling: options.tabBarAllowFontScaling,
|
|
65
|
+
labelStyle: options.tabBarLabelStyle,
|
|
66
|
+
labelText: options.tabBarShowLabel === false ? undefined : options.title !== undefined ? options.title : route.name
|
|
67
|
+
}];
|
|
68
|
+
}));
|
|
33
69
|
return /*#__PURE__*/React.createElement(_reactNativeTabView.TabBar, _extends({}, rest, {
|
|
34
70
|
navigationState: state,
|
|
71
|
+
options: tabBarOptions,
|
|
35
72
|
direction: direction,
|
|
36
73
|
scrollEnabled: focusedOptions.tabBarScrollEnabled,
|
|
37
74
|
bounces: focusedOptions.tabBarBounces,
|
|
@@ -50,23 +87,11 @@ function MaterialTopTabBar(_ref) {
|
|
|
50
87
|
style: [{
|
|
51
88
|
backgroundColor: colors.card
|
|
52
89
|
}, focusedOptions.tabBarStyle],
|
|
53
|
-
|
|
54
|
-
let {
|
|
55
|
-
route
|
|
56
|
-
} = _ref2;
|
|
57
|
-
return descriptors[route.key].options.tabBarAccessibilityLabel;
|
|
58
|
-
},
|
|
59
|
-
getTestID: _ref3 => {
|
|
60
|
-
let {
|
|
61
|
-
route
|
|
62
|
-
} = _ref3;
|
|
63
|
-
return descriptors[route.key].options.tabBarButtonTestID;
|
|
64
|
-
},
|
|
65
|
-
onTabPress: _ref4 => {
|
|
90
|
+
onTabPress: _ref3 => {
|
|
66
91
|
let {
|
|
67
92
|
route,
|
|
68
93
|
preventDefault
|
|
69
|
-
} =
|
|
94
|
+
} = _ref3;
|
|
70
95
|
const event = navigation.emit({
|
|
71
96
|
type: 'tabPress',
|
|
72
97
|
target: route.key,
|
|
@@ -76,80 +101,20 @@ function MaterialTopTabBar(_ref) {
|
|
|
76
101
|
preventDefault();
|
|
77
102
|
}
|
|
78
103
|
},
|
|
79
|
-
onTabLongPress:
|
|
104
|
+
onTabLongPress: _ref4 => {
|
|
80
105
|
let {
|
|
81
106
|
route
|
|
82
|
-
} =
|
|
107
|
+
} = _ref4;
|
|
83
108
|
return navigation.emit({
|
|
84
109
|
type: 'tabLongPress',
|
|
85
110
|
target: route.key
|
|
86
111
|
});
|
|
87
112
|
},
|
|
88
|
-
|
|
89
|
-
let {
|
|
90
|
-
route,
|
|
91
|
-
focused,
|
|
92
|
-
color
|
|
93
|
-
} = _ref6;
|
|
94
|
-
const {
|
|
95
|
-
options
|
|
96
|
-
} = descriptors[route.key];
|
|
97
|
-
if (options.tabBarShowIcon === false) {
|
|
98
|
-
return null;
|
|
99
|
-
}
|
|
100
|
-
if (options.tabBarIcon !== undefined) {
|
|
101
|
-
const icon = options.tabBarIcon({
|
|
102
|
-
focused,
|
|
103
|
-
color
|
|
104
|
-
});
|
|
105
|
-
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
106
|
-
style: [styles.icon, options.tabBarIconStyle]
|
|
107
|
-
}, icon);
|
|
108
|
-
}
|
|
109
|
-
return null;
|
|
110
|
-
},
|
|
111
|
-
renderLabel: _ref7 => {
|
|
112
|
-
let {
|
|
113
|
-
route,
|
|
114
|
-
focused,
|
|
115
|
-
color
|
|
116
|
-
} = _ref7;
|
|
117
|
-
const {
|
|
118
|
-
options
|
|
119
|
-
} = descriptors[route.key];
|
|
120
|
-
if (options.tabBarShowLabel === false) {
|
|
121
|
-
return null;
|
|
122
|
-
}
|
|
123
|
-
const label = options.tabBarLabel !== undefined ? options.tabBarLabel : options.title !== undefined ? options.title : route.name;
|
|
124
|
-
if (typeof label === 'string') {
|
|
125
|
-
return /*#__PURE__*/React.createElement(_elements.Text, {
|
|
126
|
-
style: [{
|
|
127
|
-
color
|
|
128
|
-
}, styles.label, options.tabBarLabelStyle],
|
|
129
|
-
allowFontScaling: options.tabBarAllowFontScaling
|
|
130
|
-
}, label);
|
|
131
|
-
}
|
|
132
|
-
const children = typeof options.tabBarLabel === 'string' ? options.tabBarLabel : options.title !== undefined ? options.title : route.name;
|
|
133
|
-
return label({
|
|
134
|
-
focused,
|
|
135
|
-
color,
|
|
136
|
-
children
|
|
137
|
-
});
|
|
138
|
-
},
|
|
139
|
-
renderBadge: _ref8 => {
|
|
140
|
-
let {
|
|
141
|
-
route
|
|
142
|
-
} = _ref8;
|
|
143
|
-
const {
|
|
144
|
-
tabBarBadge
|
|
145
|
-
} = descriptors[route.key].options;
|
|
146
|
-
return tabBarBadge?.() ?? null;
|
|
147
|
-
},
|
|
148
|
-
renderIndicator: _ref9 => {
|
|
113
|
+
renderIndicator: _ref5 => {
|
|
149
114
|
let {
|
|
150
115
|
navigationState: state,
|
|
151
116
|
...rest
|
|
152
|
-
} =
|
|
117
|
+
} = _ref5;
|
|
153
118
|
return focusedOptions.tabBarIndicator ? focusedOptions.tabBarIndicator({
|
|
154
119
|
state: state,
|
|
155
120
|
...rest
|
|
@@ -160,14 +125,9 @@ function MaterialTopTabBar(_ref) {
|
|
|
160
125
|
}));
|
|
161
126
|
}
|
|
162
127
|
const styles = _reactNative.StyleSheet.create({
|
|
163
|
-
icon: {
|
|
164
|
-
height: 24,
|
|
165
|
-
width: 24
|
|
166
|
-
},
|
|
167
128
|
label: {
|
|
168
129
|
textAlign: 'center',
|
|
169
|
-
|
|
170
|
-
fontSize: 13,
|
|
130
|
+
fontSize: 14,
|
|
171
131
|
margin: 4,
|
|
172
132
|
backgroundColor: 'transparent'
|
|
173
133
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_elements","require","_native","_color","_interopRequireDefault","React","_interopRequireWildcard","_reactNative","_reactNativeTabView","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","
|
|
1
|
+
{"version":3,"names":["_elements","require","_native","_color","_interopRequireDefault","React","_interopRequireWildcard","_reactNative","_reactNativeTabView","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","obj","_extends","assign","bind","target","arguments","length","source","key","apply","MaterialLabel","_ref","color","label","labelStyle","allowScaling","createElement","Text","style","styles","allowFontScaling","renderLabel","props","MaterialTopTabBar","_ref2","state","navigation","descriptors","rest","colors","useTheme","direction","useLocale","buildHref","useLinkBuilder","focusedOptions","routes","index","options","activeColor","tabBarActiveTintColor","text","inactiveColor","tabBarInactiveTintColor","Color","alpha","rgb","string","tabBarOptions","fromEntries","map","route","href","name","params","testID","tabBarButtonTestID","accessibilityLabel","tabBarAccessibilityLabel","badge","tabBarBadge","icon","tabBarShowIcon","undefined","tabBarIcon","tabBarShowLabel","labelAllowFontScaling","tabBarAllowFontScaling","tabBarLabelStyle","labelText","title","TabBar","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","_ref3","preventDefault","event","emit","type","canPreventDefault","defaultPrevented","onTabLongPress","_ref4","renderIndicator","_ref5","tabBarIndicator","TabBarIndicator","StyleSheet","create","textAlign","fontSize","margin"],"sourceRoot":"../../../src","sources":["views/MaterialTopTabBar.tsx"],"mappings":"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"}
|
|
@@ -1,28 +1,65 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
2
|
import { Text } from '@react-navigation/elements';
|
|
3
|
-
import { useLocale, useTheme } from '@react-navigation/native';
|
|
3
|
+
import { useLinkBuilder, useLocale, useTheme } from '@react-navigation/native';
|
|
4
4
|
import Color from 'color';
|
|
5
5
|
import * as React from 'react';
|
|
6
|
-
import { StyleSheet
|
|
6
|
+
import { StyleSheet } from 'react-native';
|
|
7
7
|
import { TabBar, TabBarIndicator } from 'react-native-tab-view';
|
|
8
|
-
|
|
8
|
+
const MaterialLabel = _ref => {
|
|
9
|
+
let {
|
|
10
|
+
color,
|
|
11
|
+
label,
|
|
12
|
+
labelStyle,
|
|
13
|
+
allowScaling
|
|
14
|
+
} = _ref;
|
|
15
|
+
return /*#__PURE__*/React.createElement(Text, {
|
|
16
|
+
style: [{
|
|
17
|
+
color
|
|
18
|
+
}, styles.label, labelStyle],
|
|
19
|
+
allowFontScaling: allowScaling
|
|
20
|
+
}, label);
|
|
21
|
+
};
|
|
22
|
+
const renderLabel = props => {
|
|
23
|
+
return /*#__PURE__*/React.createElement(MaterialLabel, props);
|
|
24
|
+
};
|
|
25
|
+
export function MaterialTopTabBar(_ref2) {
|
|
9
26
|
let {
|
|
10
27
|
state,
|
|
11
28
|
navigation,
|
|
12
29
|
descriptors,
|
|
13
30
|
...rest
|
|
14
|
-
} =
|
|
31
|
+
} = _ref2;
|
|
15
32
|
const {
|
|
16
33
|
colors
|
|
17
34
|
} = useTheme();
|
|
18
35
|
const {
|
|
19
36
|
direction
|
|
20
37
|
} = useLocale();
|
|
38
|
+
const {
|
|
39
|
+
buildHref
|
|
40
|
+
} = useLinkBuilder();
|
|
21
41
|
const focusedOptions = descriptors[state.routes[state.index].key].options;
|
|
22
42
|
const activeColor = focusedOptions.tabBarActiveTintColor ?? colors.text;
|
|
23
43
|
const inactiveColor = focusedOptions.tabBarInactiveTintColor ?? Color(activeColor).alpha(0.5).rgb().string();
|
|
44
|
+
const tabBarOptions = Object.fromEntries(state.routes.map(route => {
|
|
45
|
+
const {
|
|
46
|
+
options
|
|
47
|
+
} = descriptors[route.key];
|
|
48
|
+
return [route.key, {
|
|
49
|
+
href: buildHref(route.name, route.params),
|
|
50
|
+
testID: options.tabBarButtonTestID,
|
|
51
|
+
accessibilityLabel: options.tabBarAccessibilityLabel,
|
|
52
|
+
badge: options.tabBarBadge,
|
|
53
|
+
icon: options.tabBarShowIcon === false ? undefined : options.tabBarIcon,
|
|
54
|
+
label: options.tabBarShowLabel === false ? undefined : renderLabel,
|
|
55
|
+
labelAllowFontScaling: options.tabBarAllowFontScaling,
|
|
56
|
+
labelStyle: options.tabBarLabelStyle,
|
|
57
|
+
labelText: options.tabBarShowLabel === false ? undefined : options.title !== undefined ? options.title : route.name
|
|
58
|
+
}];
|
|
59
|
+
}));
|
|
24
60
|
return /*#__PURE__*/React.createElement(TabBar, _extends({}, rest, {
|
|
25
61
|
navigationState: state,
|
|
62
|
+
options: tabBarOptions,
|
|
26
63
|
direction: direction,
|
|
27
64
|
scrollEnabled: focusedOptions.tabBarScrollEnabled,
|
|
28
65
|
bounces: focusedOptions.tabBarBounces,
|
|
@@ -41,23 +78,11 @@ export function MaterialTopTabBar(_ref) {
|
|
|
41
78
|
style: [{
|
|
42
79
|
backgroundColor: colors.card
|
|
43
80
|
}, focusedOptions.tabBarStyle],
|
|
44
|
-
|
|
45
|
-
let {
|
|
46
|
-
route
|
|
47
|
-
} = _ref2;
|
|
48
|
-
return descriptors[route.key].options.tabBarAccessibilityLabel;
|
|
49
|
-
},
|
|
50
|
-
getTestID: _ref3 => {
|
|
51
|
-
let {
|
|
52
|
-
route
|
|
53
|
-
} = _ref3;
|
|
54
|
-
return descriptors[route.key].options.tabBarButtonTestID;
|
|
55
|
-
},
|
|
56
|
-
onTabPress: _ref4 => {
|
|
81
|
+
onTabPress: _ref3 => {
|
|
57
82
|
let {
|
|
58
83
|
route,
|
|
59
84
|
preventDefault
|
|
60
|
-
} =
|
|
85
|
+
} = _ref3;
|
|
61
86
|
const event = navigation.emit({
|
|
62
87
|
type: 'tabPress',
|
|
63
88
|
target: route.key,
|
|
@@ -67,80 +92,20 @@ export function MaterialTopTabBar(_ref) {
|
|
|
67
92
|
preventDefault();
|
|
68
93
|
}
|
|
69
94
|
},
|
|
70
|
-
onTabLongPress:
|
|
95
|
+
onTabLongPress: _ref4 => {
|
|
71
96
|
let {
|
|
72
97
|
route
|
|
73
|
-
} =
|
|
98
|
+
} = _ref4;
|
|
74
99
|
return navigation.emit({
|
|
75
100
|
type: 'tabLongPress',
|
|
76
101
|
target: route.key
|
|
77
102
|
});
|
|
78
103
|
},
|
|
79
|
-
|
|
80
|
-
let {
|
|
81
|
-
route,
|
|
82
|
-
focused,
|
|
83
|
-
color
|
|
84
|
-
} = _ref6;
|
|
85
|
-
const {
|
|
86
|
-
options
|
|
87
|
-
} = descriptors[route.key];
|
|
88
|
-
if (options.tabBarShowIcon === false) {
|
|
89
|
-
return null;
|
|
90
|
-
}
|
|
91
|
-
if (options.tabBarIcon !== undefined) {
|
|
92
|
-
const icon = options.tabBarIcon({
|
|
93
|
-
focused,
|
|
94
|
-
color
|
|
95
|
-
});
|
|
96
|
-
return /*#__PURE__*/React.createElement(View, {
|
|
97
|
-
style: [styles.icon, options.tabBarIconStyle]
|
|
98
|
-
}, icon);
|
|
99
|
-
}
|
|
100
|
-
return null;
|
|
101
|
-
},
|
|
102
|
-
renderLabel: _ref7 => {
|
|
103
|
-
let {
|
|
104
|
-
route,
|
|
105
|
-
focused,
|
|
106
|
-
color
|
|
107
|
-
} = _ref7;
|
|
108
|
-
const {
|
|
109
|
-
options
|
|
110
|
-
} = descriptors[route.key];
|
|
111
|
-
if (options.tabBarShowLabel === false) {
|
|
112
|
-
return null;
|
|
113
|
-
}
|
|
114
|
-
const label = options.tabBarLabel !== undefined ? options.tabBarLabel : options.title !== undefined ? options.title : route.name;
|
|
115
|
-
if (typeof label === 'string') {
|
|
116
|
-
return /*#__PURE__*/React.createElement(Text, {
|
|
117
|
-
style: [{
|
|
118
|
-
color
|
|
119
|
-
}, styles.label, options.tabBarLabelStyle],
|
|
120
|
-
allowFontScaling: options.tabBarAllowFontScaling
|
|
121
|
-
}, label);
|
|
122
|
-
}
|
|
123
|
-
const children = typeof options.tabBarLabel === 'string' ? options.tabBarLabel : options.title !== undefined ? options.title : route.name;
|
|
124
|
-
return label({
|
|
125
|
-
focused,
|
|
126
|
-
color,
|
|
127
|
-
children
|
|
128
|
-
});
|
|
129
|
-
},
|
|
130
|
-
renderBadge: _ref8 => {
|
|
131
|
-
let {
|
|
132
|
-
route
|
|
133
|
-
} = _ref8;
|
|
134
|
-
const {
|
|
135
|
-
tabBarBadge
|
|
136
|
-
} = descriptors[route.key].options;
|
|
137
|
-
return tabBarBadge?.() ?? null;
|
|
138
|
-
},
|
|
139
|
-
renderIndicator: _ref9 => {
|
|
104
|
+
renderIndicator: _ref5 => {
|
|
140
105
|
let {
|
|
141
106
|
navigationState: state,
|
|
142
107
|
...rest
|
|
143
|
-
} =
|
|
108
|
+
} = _ref5;
|
|
144
109
|
return focusedOptions.tabBarIndicator ? focusedOptions.tabBarIndicator({
|
|
145
110
|
state: state,
|
|
146
111
|
...rest
|
|
@@ -151,14 +116,9 @@ export function MaterialTopTabBar(_ref) {
|
|
|
151
116
|
}));
|
|
152
117
|
}
|
|
153
118
|
const styles = StyleSheet.create({
|
|
154
|
-
icon: {
|
|
155
|
-
height: 24,
|
|
156
|
-
width: 24
|
|
157
|
-
},
|
|
158
119
|
label: {
|
|
159
120
|
textAlign: 'center',
|
|
160
|
-
|
|
161
|
-
fontSize: 13,
|
|
121
|
+
fontSize: 14,
|
|
162
122
|
margin: 4,
|
|
163
123
|
backgroundColor: 'transparent'
|
|
164
124
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Text","useLocale","useTheme","Color","React","StyleSheet","
|
|
1
|
+
{"version":3,"names":["Text","useLinkBuilder","useLocale","useTheme","Color","React","StyleSheet","TabBar","TabBarIndicator","MaterialLabel","_ref","color","label","labelStyle","allowScaling","createElement","style","styles","allowFontScaling","renderLabel","props","MaterialTopTabBar","_ref2","state","navigation","descriptors","rest","colors","direction","buildHref","focusedOptions","routes","index","key","options","activeColor","tabBarActiveTintColor","text","inactiveColor","tabBarInactiveTintColor","alpha","rgb","string","tabBarOptions","Object","fromEntries","map","route","href","name","params","testID","tabBarButtonTestID","accessibilityLabel","tabBarAccessibilityLabel","badge","tabBarBadge","icon","tabBarShowIcon","undefined","tabBarIcon","tabBarShowLabel","labelAllowFontScaling","tabBarAllowFontScaling","tabBarLabelStyle","labelText","title","_extends","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","_ref3","preventDefault","event","emit","type","target","canPreventDefault","defaultPrevented","onTabLongPress","_ref4","renderIndicator","_ref5","tabBarIndicator","create","textAlign","fontSize","margin"],"sourceRoot":"../../../src","sources":["views/MaterialTopTabBar.tsx"],"mappings":"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"}
|
|
@@ -70,7 +70,7 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
70
70
|
tabBarIcon?: (props: {
|
|
71
71
|
focused: boolean;
|
|
72
72
|
color: string;
|
|
73
|
-
}) => React.
|
|
73
|
+
}) => React.ReactElement;
|
|
74
74
|
/**
|
|
75
75
|
* Whether the tab icon should be visible. Defaults to `false`.
|
|
76
76
|
*/
|
|
@@ -78,7 +78,7 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
78
78
|
/**
|
|
79
79
|
* Function that returns a React element to use as a badge for the tab.
|
|
80
80
|
*/
|
|
81
|
-
tabBarBadge?: () => React.
|
|
81
|
+
tabBarBadge?: () => React.ReactElement;
|
|
82
82
|
/**
|
|
83
83
|
* Function that returns a React element as the tab bar indicator.
|
|
84
84
|
*/
|
|
@@ -123,10 +123,6 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
123
123
|
* If you set this to `true`, you should also specify a width in `tabBarItemStyle` to improve the performance of initial render.
|
|
124
124
|
*/
|
|
125
125
|
tabBarScrollEnabled?: boolean;
|
|
126
|
-
/**
|
|
127
|
-
* Style object for the tab icon container.
|
|
128
|
-
*/
|
|
129
|
-
tabBarIconStyle?: StyleProp<ViewStyle>;
|
|
130
126
|
/**
|
|
131
127
|
* Style object for the tab label.
|
|
132
128
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,UAAU,EACV,iBAAiB,EACjB,cAAc,EACd,aAAa,EACb,KAAK,EACL,SAAS,EACT,gBAAgB,EAChB,kBAAkB,EACnB,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,EACV,kBAAkB,EAClB,MAAM,EACN,YAAY,EACb,MAAM,uBAAuB,CAAC;AAE/B,MAAM,MAAM,gCAAgC,GAAG;IAC7C;;OAEG;IACH,QAAQ,EAAE;QAAE,IAAI,EAAE,SAAS,CAAC;QAAC,iBAAiB,EAAE,IAAI,CAAA;KAAE,CAAC;IACvD;;OAEG;IACH,YAAY,EAAE;QAAE,IAAI,EAAE,SAAS,CAAA;KAAE,CAAC;IAClC;;OAEG;IACH,UAAU,EAAE;QAAE,IAAI,EAAE,SAAS,CAAA;KAAE,CAAC;IAChC;;OAEG;IACH,QAAQ,EAAE;QAAE,IAAI,EAAE,SAAS,CAAA;KAAE,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,+BAA+B,GAAG,iBAAiB,CAC7D,aAAa,EACb,gCAAgC,CACjC,GACC,gBAAgB,CAAC,aAAa,CAAC,CAAC;AAElC,MAAM,MAAM,4BAA4B,CACtC,SAAS,SAAS,aAAa,EAC/B,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,EACnD,WAAW,SAAS,MAAM,GAAG,SAAS,GAAG,SAAS,IAChD,cAAc,CAChB,SAAS,EACT,SAAS,EACT,WAAW,EACX,kBAAkB,CAAC,SAAS,CAAC,EAC7B,+BAA+B,EAC/B,gCAAgC,CACjC,GACC,gBAAgB,CAAC,SAAS,CAAC,CAAC;AAE9B,MAAM,MAAM,yBAAyB,CACnC,SAAS,SAAS,aAAa,EAC/B,SAAS,SAAS,MAAM,SAAS,GAAG,MAAM,SAAS,EACnD,WAAW,SAAS,MAAM,GAAG,SAAS,GAAG,SAAS,IAChD;IACF,UAAU,EAAE,4BAA4B,CAAC,SAAS,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC;IAC5E,KAAK,EAAE,SAAS,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,+BAA+B,GAAG;IAC5C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,WAAW,CAAC,EACR,MAAM,GACN,CAAC,CAAC,KAAK,EAAE;QACP,OAAO,EAAE,OAAO,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;KAClB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;IAE3B;;;OAGG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE;
|
|
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":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"MaterialTopTabBar.d.ts","sourceRoot":"","sources":["../../../../src/views/MaterialTopTabBar.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AA6BvD,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,UAAU,EACV,WAAW,EACX,GAAG,IAAI,EACR,EAAE,sBAAsB,qBA0FxB"}
|
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": "7.0.0-alpha.
|
|
4
|
+
"version": "7.0.0-alpha.12",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native-component",
|
|
7
7
|
"react-component",
|
|
@@ -41,12 +41,12 @@
|
|
|
41
41
|
"clean": "del lib"
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@react-navigation/elements": "^2.0.0-alpha.
|
|
44
|
+
"@react-navigation/elements": "^2.0.0-alpha.10",
|
|
45
45
|
"color": "^4.2.3",
|
|
46
|
-
"react-native-tab-view": "^4.0.0-alpha.
|
|
46
|
+
"react-native-tab-view": "^4.0.0-alpha.7"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
|
-
"@react-navigation/native": "^7.0.0-alpha.
|
|
49
|
+
"@react-navigation/native": "^7.0.0-alpha.12",
|
|
50
50
|
"@testing-library/react-native": "^12.4.3",
|
|
51
51
|
"@types/react": "~18.2.45",
|
|
52
52
|
"del-cli": "^5.1.0",
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
"typescript": "^5.3.3"
|
|
58
58
|
},
|
|
59
59
|
"peerDependencies": {
|
|
60
|
-
"@react-navigation/native": "^7.0.0-alpha.
|
|
60
|
+
"@react-navigation/native": "^7.0.0-alpha.12",
|
|
61
61
|
"react": ">= 18.2.0",
|
|
62
62
|
"react-native": ">= 0.72.0",
|
|
63
63
|
"react-native-pager-view": ">= 6.0.0"
|
|
@@ -76,5 +76,5 @@
|
|
|
76
76
|
]
|
|
77
77
|
]
|
|
78
78
|
},
|
|
79
|
-
"gitHead": "
|
|
79
|
+
"gitHead": "4278a3d0a5deca93206771a1fa746aa03b86900e"
|
|
80
80
|
}
|
package/src/types.tsx
CHANGED
|
@@ -109,7 +109,10 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
109
109
|
/**
|
|
110
110
|
* A function that given { focused: boolean, color: string } returns a React.Node to display in the tab bar.
|
|
111
111
|
*/
|
|
112
|
-
tabBarIcon?: (props: {
|
|
112
|
+
tabBarIcon?: (props: {
|
|
113
|
+
focused: boolean;
|
|
114
|
+
color: string;
|
|
115
|
+
}) => React.ReactElement;
|
|
113
116
|
|
|
114
117
|
/**
|
|
115
118
|
* Whether the tab icon should be visible. Defaults to `false`.
|
|
@@ -119,7 +122,7 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
119
122
|
/**
|
|
120
123
|
* Function that returns a React element to use as a badge for the tab.
|
|
121
124
|
*/
|
|
122
|
-
tabBarBadge?: () => React.
|
|
125
|
+
tabBarBadge?: () => React.ReactElement;
|
|
123
126
|
|
|
124
127
|
/**
|
|
125
128
|
* Function that returns a React element as the tab bar indicator.
|
|
@@ -180,11 +183,6 @@ export type MaterialTopTabNavigationOptions = {
|
|
|
180
183
|
*/
|
|
181
184
|
tabBarScrollEnabled?: boolean;
|
|
182
185
|
|
|
183
|
-
/**
|
|
184
|
-
* Style object for the tab icon container.
|
|
185
|
-
*/
|
|
186
|
-
tabBarIconStyle?: StyleProp<ViewStyle>;
|
|
187
|
-
|
|
188
186
|
/**
|
|
189
187
|
* Style object for the tab label.
|
|
190
188
|
*/
|
|
@@ -1,18 +1,45 @@
|
|
|
1
1
|
import { Text } from '@react-navigation/elements';
|
|
2
2
|
import {
|
|
3
3
|
type ParamListBase,
|
|
4
|
-
type Route,
|
|
5
4
|
type TabNavigationState,
|
|
5
|
+
useLinkBuilder,
|
|
6
6
|
useLocale,
|
|
7
7
|
useTheme,
|
|
8
8
|
} from '@react-navigation/native';
|
|
9
9
|
import Color from 'color';
|
|
10
10
|
import * as React from 'react';
|
|
11
|
-
import { StyleSheet,
|
|
11
|
+
import { type StyleProp, StyleSheet, type ViewStyle } from 'react-native';
|
|
12
12
|
import { TabBar, TabBarIndicator } from 'react-native-tab-view';
|
|
13
13
|
|
|
14
14
|
import type { MaterialTopTabBarProps } from '../types';
|
|
15
15
|
|
|
16
|
+
type MaterialLabelType = {
|
|
17
|
+
color: string;
|
|
18
|
+
label?: string;
|
|
19
|
+
labelStyle?: StyleProp<ViewStyle>;
|
|
20
|
+
allowScaling?: boolean;
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
const MaterialLabel = ({
|
|
24
|
+
color,
|
|
25
|
+
label,
|
|
26
|
+
labelStyle,
|
|
27
|
+
allowScaling,
|
|
28
|
+
}: MaterialLabelType) => {
|
|
29
|
+
return (
|
|
30
|
+
<Text
|
|
31
|
+
style={[{ color }, styles.label, labelStyle]}
|
|
32
|
+
allowFontScaling={allowScaling}
|
|
33
|
+
>
|
|
34
|
+
{label}
|
|
35
|
+
</Text>
|
|
36
|
+
);
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
const renderLabel = (props: MaterialLabelType) => {
|
|
40
|
+
return <MaterialLabel {...props} />;
|
|
41
|
+
};
|
|
42
|
+
|
|
16
43
|
export function MaterialTopTabBar({
|
|
17
44
|
state,
|
|
18
45
|
navigation,
|
|
@@ -21,6 +48,7 @@ export function MaterialTopTabBar({
|
|
|
21
48
|
}: MaterialTopTabBarProps) {
|
|
22
49
|
const { colors } = useTheme();
|
|
23
50
|
const { direction } = useLocale();
|
|
51
|
+
const { buildHref } = useLinkBuilder();
|
|
24
52
|
|
|
25
53
|
const focusedOptions = descriptors[state.routes[state.index].key].options;
|
|
26
54
|
|
|
@@ -29,10 +57,38 @@ export function MaterialTopTabBar({
|
|
|
29
57
|
focusedOptions.tabBarInactiveTintColor ??
|
|
30
58
|
Color(activeColor).alpha(0.5).rgb().string();
|
|
31
59
|
|
|
60
|
+
const tabBarOptions = Object.fromEntries(
|
|
61
|
+
state.routes.map((route) => {
|
|
62
|
+
const { options } = descriptors[route.key];
|
|
63
|
+
|
|
64
|
+
return [
|
|
65
|
+
route.key,
|
|
66
|
+
{
|
|
67
|
+
href: buildHref(route.name, route.params),
|
|
68
|
+
testID: options.tabBarButtonTestID,
|
|
69
|
+
accessibilityLabel: options.tabBarAccessibilityLabel,
|
|
70
|
+
badge: options.tabBarBadge,
|
|
71
|
+
icon:
|
|
72
|
+
options.tabBarShowIcon === false ? undefined : options.tabBarIcon,
|
|
73
|
+
label: options.tabBarShowLabel === false ? undefined : renderLabel,
|
|
74
|
+
labelAllowFontScaling: options.tabBarAllowFontScaling,
|
|
75
|
+
labelStyle: options.tabBarLabelStyle,
|
|
76
|
+
labelText:
|
|
77
|
+
options.tabBarShowLabel === false
|
|
78
|
+
? undefined
|
|
79
|
+
: options.title !== undefined
|
|
80
|
+
? options.title
|
|
81
|
+
: route.name,
|
|
82
|
+
},
|
|
83
|
+
];
|
|
84
|
+
})
|
|
85
|
+
);
|
|
86
|
+
|
|
32
87
|
return (
|
|
33
88
|
<TabBar
|
|
34
89
|
{...rest}
|
|
35
90
|
navigationState={state}
|
|
91
|
+
options={tabBarOptions}
|
|
36
92
|
direction={direction}
|
|
37
93
|
scrollEnabled={focusedOptions.tabBarScrollEnabled}
|
|
38
94
|
bounces={focusedOptions.tabBarBounces}
|
|
@@ -50,12 +106,6 @@ export function MaterialTopTabBar({
|
|
|
50
106
|
indicatorContainerStyle={focusedOptions.tabBarIndicatorContainerStyle}
|
|
51
107
|
contentContainerStyle={focusedOptions.tabBarContentContainerStyle}
|
|
52
108
|
style={[{ backgroundColor: colors.card }, focusedOptions.tabBarStyle]}
|
|
53
|
-
getAccessibilityLabel={({ route }) =>
|
|
54
|
-
descriptors[route.key].options.tabBarAccessibilityLabel
|
|
55
|
-
}
|
|
56
|
-
getTestID={({ route }) =>
|
|
57
|
-
descriptors[route.key].options.tabBarButtonTestID
|
|
58
|
-
}
|
|
59
109
|
onTabPress={({ route, preventDefault }) => {
|
|
60
110
|
const event = navigation.emit({
|
|
61
111
|
type: 'tabPress',
|
|
@@ -73,62 +123,6 @@ export function MaterialTopTabBar({
|
|
|
73
123
|
target: route.key,
|
|
74
124
|
})
|
|
75
125
|
}
|
|
76
|
-
renderIcon={({ route, focused, color }) => {
|
|
77
|
-
const { options } = descriptors[route.key];
|
|
78
|
-
|
|
79
|
-
if (options.tabBarShowIcon === false) {
|
|
80
|
-
return null;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
if (options.tabBarIcon !== undefined) {
|
|
84
|
-
const icon = options.tabBarIcon({ focused, color });
|
|
85
|
-
|
|
86
|
-
return (
|
|
87
|
-
<View style={[styles.icon, options.tabBarIconStyle]}>{icon}</View>
|
|
88
|
-
);
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
return null;
|
|
92
|
-
}}
|
|
93
|
-
renderLabel={({ route, focused, color }) => {
|
|
94
|
-
const { options } = descriptors[route.key];
|
|
95
|
-
|
|
96
|
-
if (options.tabBarShowLabel === false) {
|
|
97
|
-
return null;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
const label =
|
|
101
|
-
options.tabBarLabel !== undefined
|
|
102
|
-
? options.tabBarLabel
|
|
103
|
-
: options.title !== undefined
|
|
104
|
-
? options.title
|
|
105
|
-
: (route as Route<string>).name;
|
|
106
|
-
|
|
107
|
-
if (typeof label === 'string') {
|
|
108
|
-
return (
|
|
109
|
-
<Text
|
|
110
|
-
style={[{ color }, styles.label, options.tabBarLabelStyle]}
|
|
111
|
-
allowFontScaling={options.tabBarAllowFontScaling}
|
|
112
|
-
>
|
|
113
|
-
{label}
|
|
114
|
-
</Text>
|
|
115
|
-
);
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
const children =
|
|
119
|
-
typeof options.tabBarLabel === 'string'
|
|
120
|
-
? options.tabBarLabel
|
|
121
|
-
: options.title !== undefined
|
|
122
|
-
? options.title
|
|
123
|
-
: route.name;
|
|
124
|
-
|
|
125
|
-
return label({ focused, color, children });
|
|
126
|
-
}}
|
|
127
|
-
renderBadge={({ route }) => {
|
|
128
|
-
const { tabBarBadge } = descriptors[route.key].options;
|
|
129
|
-
|
|
130
|
-
return tabBarBadge?.() ?? null;
|
|
131
|
-
}}
|
|
132
126
|
renderIndicator={({ navigationState: state, ...rest }) => {
|
|
133
127
|
return focusedOptions.tabBarIndicator ? (
|
|
134
128
|
focusedOptions.tabBarIndicator({
|
|
@@ -144,14 +138,9 @@ export function MaterialTopTabBar({
|
|
|
144
138
|
}
|
|
145
139
|
|
|
146
140
|
const styles = StyleSheet.create({
|
|
147
|
-
icon: {
|
|
148
|
-
height: 24,
|
|
149
|
-
width: 24,
|
|
150
|
-
},
|
|
151
141
|
label: {
|
|
152
142
|
textAlign: 'center',
|
|
153
|
-
|
|
154
|
-
fontSize: 13,
|
|
143
|
+
fontSize: 14,
|
|
155
144
|
margin: 4,
|
|
156
145
|
backgroundColor: 'transparent',
|
|
157
146
|
},
|