react-native-tab-view 3.2.0 → 3.3.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/README.md +4 -0
- package/lib/commonjs/PagerViewAdapter.js +25 -8
- package/lib/commonjs/PagerViewAdapter.js.map +1 -1
- package/lib/commonjs/PanResponderAdapter.js +29 -20
- package/lib/commonjs/PanResponderAdapter.js.map +1 -1
- package/lib/commonjs/SceneMap.js +9 -12
- package/lib/commonjs/SceneMap.js.map +1 -1
- package/lib/commonjs/SceneView.js +54 -101
- package/lib/commonjs/SceneView.js.map +1 -1
- package/lib/commonjs/TabBar.js +327 -327
- package/lib/commonjs/TabBar.js.map +1 -1
- package/lib/commonjs/TabBarIndicator.js +81 -99
- package/lib/commonjs/TabBarIndicator.js.map +1 -1
- package/lib/commonjs/TabBarItem.js +184 -161
- package/lib/commonjs/TabBarItem.js.map +1 -1
- package/lib/commonjs/TabView.js +3 -1
- package/lib/commonjs/TabView.js.map +1 -1
- package/lib/commonjs/types.js.map +1 -1
- package/lib/module/PagerViewAdapter.js +25 -8
- package/lib/module/PagerViewAdapter.js.map +1 -1
- package/lib/module/PanResponderAdapter.js +29 -19
- package/lib/module/PanResponderAdapter.js.map +1 -1
- package/lib/module/SceneMap.js +9 -14
- package/lib/module/SceneMap.js.map +1 -1
- package/lib/module/SceneView.js +53 -98
- package/lib/module/SceneView.js.map +1 -1
- package/lib/module/TabBar.js +323 -323
- package/lib/module/TabBar.js.map +1 -1
- package/lib/module/TabBarIndicator.js +74 -92
- package/lib/module/TabBarIndicator.js.map +1 -1
- package/lib/module/TabBarItem.js +178 -154
- package/lib/module/TabBarItem.js.map +1 -1
- package/lib/module/TabView.js +3 -1
- package/lib/module/TabView.js.map +1 -1
- package/lib/module/types.js.map +1 -1
- package/lib/typescript/PagerViewAdapter.d.ts +1 -1
- package/lib/typescript/PanResponderAdapter.d.ts +1 -1
- package/lib/typescript/SceneMap.d.ts +5 -3
- package/lib/typescript/SceneView.d.ts +1 -18
- package/lib/typescript/TabBar.d.ts +7 -38
- package/lib/typescript/TabBarIndicator.d.ts +2 -10
- package/lib/typescript/TabBarItem.d.ts +3 -5
- package/lib/typescript/TabView.d.ts +1 -1
- package/lib/typescript/types.d.ts +1 -0
- package/package.json +4 -1
- package/src/PagerViewAdapter.tsx +29 -10
- package/src/PanResponderAdapter.tsx +29 -20
- package/src/SceneMap.tsx +11 -7
- package/src/SceneView.tsx +70 -106
- package/src/TabBar.tsx +451 -391
- package/src/TabBarIndicator.tsx +108 -114
- package/src/TabBarItem.tsx +214 -185
- package/src/TabView.tsx +2 -0
- package/src/types.tsx +1 -0
|
@@ -9,6 +9,8 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _reactNative = require("react-native");
|
|
11
11
|
|
|
12
|
+
var _useLatestCallback = _interopRequireDefault(require("use-latest-callback"));
|
|
13
|
+
|
|
12
14
|
var _PlatformPressable = _interopRequireDefault(require("./PlatformPressable"));
|
|
13
15
|
|
|
14
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -17,188 +19,209 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
17
19
|
|
|
18
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
21
|
|
|
20
|
-
function
|
|
22
|
+
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); }
|
|
21
23
|
|
|
22
24
|
const DEFAULT_ACTIVE_COLOR = 'rgba(255, 255, 255, 1)';
|
|
23
25
|
const DEFAULT_INACTIVE_COLOR = 'rgba(255, 255, 255, 0.7)';
|
|
24
26
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
inputRange,
|
|
34
|
-
outputRange: inputRange.map(i => i === tabIndex ? 1 : 0)
|
|
35
|
-
});
|
|
36
|
-
} else {
|
|
37
|
-
return 1;
|
|
38
|
-
}
|
|
27
|
+
const getActiveOpacity = (position, routesLength, tabIndex) => {
|
|
28
|
+
if (routesLength > 1) {
|
|
29
|
+
const inputRange = Array.from({
|
|
30
|
+
length: routesLength
|
|
31
|
+
}, (_, i) => i);
|
|
32
|
+
return position.interpolate({
|
|
33
|
+
inputRange,
|
|
34
|
+
outputRange: inputRange.map(i => i === tabIndex ? 1 : 0)
|
|
39
35
|
});
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
36
|
+
} else {
|
|
37
|
+
return 1;
|
|
38
|
+
}
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
const getInactiveOpacity = (position, routesLength, tabIndex) => {
|
|
42
|
+
if (routesLength > 1) {
|
|
43
|
+
const inputRange = Array.from({
|
|
44
|
+
length: routesLength
|
|
45
|
+
}, (_, i) => i);
|
|
46
|
+
return position.interpolate({
|
|
47
|
+
inputRange,
|
|
48
|
+
outputRange: inputRange.map(i => i === tabIndex ? 0 : 1)
|
|
51
49
|
});
|
|
50
|
+
} else {
|
|
51
|
+
return 0;
|
|
52
52
|
}
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
const TabBarItemInternal = _ref => {
|
|
56
|
+
let {
|
|
57
|
+
getAccessibilityLabel,
|
|
58
|
+
getAccessible,
|
|
59
|
+
getLabelText,
|
|
60
|
+
getTestID,
|
|
61
|
+
onLongPress,
|
|
62
|
+
onPress,
|
|
63
|
+
isFocused,
|
|
64
|
+
position,
|
|
65
|
+
route,
|
|
66
|
+
style,
|
|
67
|
+
inactiveColor: inactiveColorCustom,
|
|
68
|
+
activeColor: activeColorCustom,
|
|
69
|
+
labelStyle,
|
|
70
|
+
onLayout,
|
|
71
|
+
index: tabIndex,
|
|
72
|
+
pressColor,
|
|
73
|
+
pressOpacity,
|
|
74
|
+
renderBadge,
|
|
75
|
+
renderIcon,
|
|
76
|
+
defaultTabWidth,
|
|
77
|
+
routesLength,
|
|
78
|
+
renderLabel: renderLabelCustom
|
|
79
|
+
} = _ref;
|
|
80
|
+
|
|
81
|
+
const labelColorFromStyle = _reactNative.StyleSheet.flatten(labelStyle || {}).color;
|
|
82
|
+
|
|
83
|
+
const activeColor = activeColorCustom !== undefined ? activeColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_ACTIVE_COLOR;
|
|
84
|
+
const inactiveColor = inactiveColorCustom !== undefined ? inactiveColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_INACTIVE_COLOR;
|
|
85
|
+
const activeOpacity = getActiveOpacity(position, routesLength, tabIndex);
|
|
86
|
+
const inactiveOpacity = getInactiveOpacity(position, routesLength, tabIndex);
|
|
87
|
+
let icon = null;
|
|
88
|
+
let label = null;
|
|
89
|
+
|
|
90
|
+
if (renderIcon) {
|
|
91
|
+
const activeIcon = renderIcon({
|
|
56
92
|
route,
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
getAccessible,
|
|
66
|
-
activeColor: activeColorCustom,
|
|
67
|
-
inactiveColor: inactiveColorCustom,
|
|
68
|
-
pressColor,
|
|
69
|
-
pressOpacity,
|
|
70
|
-
labelStyle,
|
|
71
|
-
style,
|
|
72
|
-
onLayout,
|
|
73
|
-
onPress,
|
|
74
|
-
onLongPress
|
|
75
|
-
} = this.props;
|
|
76
|
-
const tabIndex = navigationState.routes.indexOf(route);
|
|
77
|
-
const isFocused = navigationState.index === tabIndex;
|
|
78
|
-
|
|
79
|
-
const labelColorFromStyle = _reactNative.StyleSheet.flatten(labelStyle || {}).color;
|
|
80
|
-
|
|
81
|
-
const activeColor = activeColorCustom !== undefined ? activeColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_ACTIVE_COLOR;
|
|
82
|
-
const inactiveColor = inactiveColorCustom !== undefined ? inactiveColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_INACTIVE_COLOR;
|
|
83
|
-
const activeOpacity = this.getActiveOpacity(position, navigationState.routes, tabIndex);
|
|
84
|
-
const inactiveOpacity = this.getInactiveOpacity(position, navigationState.routes, tabIndex);
|
|
85
|
-
let icon = null;
|
|
86
|
-
let label = null;
|
|
87
|
-
|
|
88
|
-
if (renderIcon) {
|
|
89
|
-
const activeIcon = renderIcon({
|
|
90
|
-
route,
|
|
91
|
-
focused: true,
|
|
92
|
-
color: activeColor
|
|
93
|
-
});
|
|
94
|
-
const inactiveIcon = renderIcon({
|
|
95
|
-
route,
|
|
96
|
-
focused: false,
|
|
97
|
-
color: inactiveColor
|
|
98
|
-
});
|
|
99
|
-
|
|
100
|
-
if (inactiveIcon != null && activeIcon != null) {
|
|
101
|
-
icon = /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
102
|
-
style: styles.icon
|
|
103
|
-
}, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
104
|
-
style: {
|
|
105
|
-
opacity: inactiveOpacity
|
|
106
|
-
}
|
|
107
|
-
}, inactiveIcon), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
108
|
-
style: [_reactNative.StyleSheet.absoluteFill, {
|
|
109
|
-
opacity: activeOpacity
|
|
110
|
-
}]
|
|
111
|
-
}, activeIcon));
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
const renderLabel = renderLabelCustom !== undefined ? renderLabelCustom : _ref => {
|
|
116
|
-
let {
|
|
117
|
-
route,
|
|
118
|
-
color
|
|
119
|
-
} = _ref;
|
|
120
|
-
const labelText = getLabelText({
|
|
121
|
-
route
|
|
122
|
-
});
|
|
123
|
-
|
|
124
|
-
if (typeof labelText === 'string') {
|
|
125
|
-
return /*#__PURE__*/React.createElement(_reactNative.Animated.Text, {
|
|
126
|
-
style: [styles.label, icon ? {
|
|
127
|
-
marginTop: 0
|
|
128
|
-
} : null, labelStyle, {
|
|
129
|
-
color
|
|
130
|
-
}]
|
|
131
|
-
}, labelText);
|
|
132
|
-
}
|
|
93
|
+
focused: true,
|
|
94
|
+
color: activeColor
|
|
95
|
+
});
|
|
96
|
+
const inactiveIcon = renderIcon({
|
|
97
|
+
route,
|
|
98
|
+
focused: false,
|
|
99
|
+
color: inactiveColor
|
|
100
|
+
});
|
|
133
101
|
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
const activeLabel = renderLabel({
|
|
139
|
-
route,
|
|
140
|
-
focused: true,
|
|
141
|
-
color: activeColor
|
|
142
|
-
});
|
|
143
|
-
const inactiveLabel = renderLabel({
|
|
144
|
-
route,
|
|
145
|
-
focused: false,
|
|
146
|
-
color: inactiveColor
|
|
147
|
-
});
|
|
148
|
-
label = /*#__PURE__*/React.createElement(_reactNative.View, null, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
102
|
+
if (inactiveIcon != null && activeIcon != null) {
|
|
103
|
+
icon = /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
104
|
+
style: styles.icon
|
|
105
|
+
}, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
149
106
|
style: {
|
|
150
107
|
opacity: inactiveOpacity
|
|
151
108
|
}
|
|
152
|
-
},
|
|
109
|
+
}, inactiveIcon), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
153
110
|
style: [_reactNative.StyleSheet.absoluteFill, {
|
|
154
111
|
opacity: activeOpacity
|
|
155
112
|
}]
|
|
156
|
-
},
|
|
113
|
+
}, activeIcon));
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
const renderLabel = renderLabelCustom !== undefined ? renderLabelCustom : labelProps => {
|
|
118
|
+
const labelText = getLabelText({
|
|
119
|
+
route: labelProps.route
|
|
120
|
+
});
|
|
121
|
+
|
|
122
|
+
if (typeof labelText === 'string') {
|
|
123
|
+
return /*#__PURE__*/React.createElement(_reactNative.Animated.Text, {
|
|
124
|
+
style: [styles.label, icon ? {
|
|
125
|
+
marginTop: 0
|
|
126
|
+
} : null, labelStyle, {
|
|
127
|
+
color: labelProps.color
|
|
128
|
+
}]
|
|
129
|
+
}, labelText);
|
|
157
130
|
}
|
|
158
131
|
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
};
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
,
|
|
183
|
-
accessibilityStates: isFocused ? ['selected'] : [],
|
|
184
|
-
pressColor: pressColor,
|
|
185
|
-
pressOpacity: pressOpacity,
|
|
186
|
-
delayPressIn: 0,
|
|
187
|
-
onLayout: onLayout,
|
|
188
|
-
onPress: onPress,
|
|
189
|
-
onLongPress: onLongPress,
|
|
190
|
-
style: [styles.pressable, tabContainerStyle]
|
|
191
|
-
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
192
|
-
pointerEvents: "none",
|
|
193
|
-
style: [styles.item, tabStyle]
|
|
194
|
-
}, icon, label, badge != null ? /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
195
|
-
style: styles.badge
|
|
196
|
-
}, badge) : null));
|
|
132
|
+
return labelText;
|
|
133
|
+
};
|
|
134
|
+
|
|
135
|
+
if (renderLabel) {
|
|
136
|
+
const activeLabel = renderLabel({
|
|
137
|
+
route,
|
|
138
|
+
focused: true,
|
|
139
|
+
color: activeColor
|
|
140
|
+
});
|
|
141
|
+
const inactiveLabel = renderLabel({
|
|
142
|
+
route,
|
|
143
|
+
focused: false,
|
|
144
|
+
color: inactiveColor
|
|
145
|
+
});
|
|
146
|
+
label = /*#__PURE__*/React.createElement(_reactNative.View, null, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
147
|
+
style: {
|
|
148
|
+
opacity: inactiveOpacity
|
|
149
|
+
}
|
|
150
|
+
}, inactiveLabel), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
151
|
+
style: [_reactNative.StyleSheet.absoluteFill, {
|
|
152
|
+
opacity: activeOpacity
|
|
153
|
+
}]
|
|
154
|
+
}, activeLabel));
|
|
197
155
|
}
|
|
198
156
|
|
|
157
|
+
const tabStyle = _reactNative.StyleSheet.flatten(style);
|
|
158
|
+
|
|
159
|
+
const isWidthSet = (tabStyle === null || tabStyle === void 0 ? void 0 : tabStyle.width) !== undefined;
|
|
160
|
+
const tabContainerStyle = isWidthSet ? null : {
|
|
161
|
+
width: defaultTabWidth
|
|
162
|
+
};
|
|
163
|
+
const scene = {
|
|
164
|
+
route
|
|
165
|
+
};
|
|
166
|
+
let accessibilityLabel = getAccessibilityLabel(scene);
|
|
167
|
+
accessibilityLabel = typeof accessibilityLabel !== 'undefined' ? accessibilityLabel : getLabelText(scene);
|
|
168
|
+
const badge = renderBadge ? renderBadge(scene) : null;
|
|
169
|
+
return /*#__PURE__*/React.createElement(_PlatformPressable.default, {
|
|
170
|
+
android_ripple: {
|
|
171
|
+
borderless: true
|
|
172
|
+
},
|
|
173
|
+
testID: getTestID(scene),
|
|
174
|
+
accessible: getAccessible(scene),
|
|
175
|
+
accessibilityLabel: accessibilityLabel,
|
|
176
|
+
accessibilityRole: "tab",
|
|
177
|
+
accessibilityState: {
|
|
178
|
+
selected: isFocused
|
|
179
|
+
} // @ts-ignore: this is to support older React Native versions
|
|
180
|
+
,
|
|
181
|
+
accessibilityStates: isFocused ? ['selected'] : [],
|
|
182
|
+
pressColor: pressColor,
|
|
183
|
+
pressOpacity: pressOpacity,
|
|
184
|
+
delayPressIn: 0,
|
|
185
|
+
onLayout: onLayout,
|
|
186
|
+
onPress: onPress,
|
|
187
|
+
onLongPress: onLongPress,
|
|
188
|
+
style: [styles.pressable, tabContainerStyle]
|
|
189
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
190
|
+
pointerEvents: "none",
|
|
191
|
+
style: [styles.item, tabStyle]
|
|
192
|
+
}, icon, label, badge != null ? /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
193
|
+
style: styles.badge
|
|
194
|
+
}, badge) : null));
|
|
195
|
+
};
|
|
196
|
+
|
|
197
|
+
const MemoizedTabBarItemInternal = /*#__PURE__*/React.memo(TabBarItemInternal);
|
|
198
|
+
|
|
199
|
+
function TabBarItem(props) {
|
|
200
|
+
const {
|
|
201
|
+
onPress,
|
|
202
|
+
onLongPress,
|
|
203
|
+
onLayout,
|
|
204
|
+
navigationState,
|
|
205
|
+
route,
|
|
206
|
+
...rest
|
|
207
|
+
} = props;
|
|
208
|
+
const onPressLatest = (0, _useLatestCallback.default)(onPress);
|
|
209
|
+
const onLongPressLatest = (0, _useLatestCallback.default)(onLongPress);
|
|
210
|
+
const onLayoutLatest = (0, _useLatestCallback.default)(onLayout ? onLayout : () => {});
|
|
211
|
+
const tabIndex = navigationState.routes.indexOf(route);
|
|
212
|
+
return /*#__PURE__*/React.createElement(MemoizedTabBarItemInternal, _extends({}, rest, {
|
|
213
|
+
onPress: onPressLatest,
|
|
214
|
+
onLayout: onLayoutLatest,
|
|
215
|
+
onLongPress: onLongPressLatest,
|
|
216
|
+
isFocused: navigationState.index === tabIndex,
|
|
217
|
+
route: route,
|
|
218
|
+
index: tabIndex,
|
|
219
|
+
routesLength: navigationState.routes.length
|
|
220
|
+
}));
|
|
199
221
|
}
|
|
200
222
|
|
|
201
|
-
|
|
223
|
+
var _default = TabBarItem;
|
|
224
|
+
exports.default = _default;
|
|
202
225
|
|
|
203
226
|
const styles = _reactNative.StyleSheet.create({
|
|
204
227
|
label: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DEFAULT_ACTIVE_COLOR","DEFAULT_INACTIVE_COLOR","TabBarItem","React","Component","position","routes","tabIndex","length","inputRange","map","_","i","interpolate","outputRange","render","route","navigationState","renderLabel","renderLabelCustom","renderIcon","renderBadge","getLabelText","getTestID","getAccessibilityLabel","getAccessible","activeColor","activeColorCustom","inactiveColor","inactiveColorCustom","pressColor","pressOpacity","labelStyle","style","onLayout","onPress","onLongPress","props","indexOf","isFocused","index","labelColorFromStyle","StyleSheet","flatten","color","undefined","activeOpacity","getActiveOpacity","inactiveOpacity","getInactiveOpacity","icon","label","activeIcon","focused","inactiveIcon","styles","opacity","absoluteFill","labelText","marginTop","activeLabel","inactiveLabel","tabStyle","isWidthSet","width","tabContainerStyle","flex","scene","accessibilityLabel","badge","borderless","selected","pressable","item","create","margin","backgroundColor","textTransform","alignItems","justifyContent","padding","minHeight","top","right"],"sources":["TabBarItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Animated,\n StyleSheet,\n View,\n StyleProp,\n LayoutChangeEvent,\n TextStyle,\n ViewStyle,\n} from 'react-native';\nimport PlatformPressable from './PlatformPressable';\nimport type { Scene, Route, NavigationState } from './types';\n\nexport type Props<T extends Route> = {\n position: Animated.AnimatedInterpolation;\n route: T;\n navigationState: NavigationState<T>;\n activeColor?: string;\n inactiveColor?: string;\n pressColor?: string;\n pressOpacity?: number;\n getLabelText: (scene: Scene<T>) => string | undefined;\n getAccessible: (scene: Scene<T>) => boolean | undefined;\n getAccessibilityLabel: (scene: Scene<T>) => string | undefined;\n getTestID: (scene: Scene<T>) => string | undefined;\n renderLabel?: (scene: {\n route: T;\n focused: boolean;\n color: string;\n }) => React.ReactNode;\n renderIcon?: (scene: {\n route: T;\n focused: boolean;\n color: string;\n }) => React.ReactNode;\n renderBadge?: (scene: Scene<T>) => React.ReactNode;\n onLayout?: (event: LayoutChangeEvent) => void;\n onPress: () => void;\n onLongPress: () => void;\n labelStyle?: StyleProp<TextStyle>;\n style: StyleProp<ViewStyle>;\n};\n\nconst DEFAULT_ACTIVE_COLOR = 'rgba(255, 255, 255, 1)';\nconst DEFAULT_INACTIVE_COLOR = 'rgba(255, 255, 255, 0.7)';\n\nexport default class TabBarItem<T extends Route> extends React.Component<\n Props<T>\n> {\n private getActiveOpacity = (\n position: Animated.AnimatedInterpolation,\n routes: Route[],\n tabIndex: number\n ) => {\n if (routes.length > 1) {\n const inputRange = routes.map((_, i) => i);\n\n return position.interpolate({\n inputRange,\n outputRange: inputRange.map((i) => (i === tabIndex ? 1 : 0)),\n });\n } else {\n return 1;\n }\n };\n\n private getInactiveOpacity = (\n position: Animated.AnimatedInterpolation,\n routes: Route[],\n tabIndex: number\n ) => {\n if (routes.length > 1) {\n const inputRange = routes.map((_: Route, i: number) => i);\n\n return position.interpolate({\n inputRange,\n outputRange: inputRange.map((i: number) => (i === tabIndex ? 0 : 1)),\n });\n } else {\n return 0;\n }\n };\n\n render() {\n const {\n route,\n position,\n navigationState,\n renderLabel: renderLabelCustom,\n renderIcon,\n renderBadge,\n getLabelText,\n getTestID,\n getAccessibilityLabel,\n getAccessible,\n activeColor: activeColorCustom,\n inactiveColor: inactiveColorCustom,\n pressColor,\n pressOpacity,\n labelStyle,\n style,\n onLayout,\n onPress,\n onLongPress,\n } = this.props;\n\n const tabIndex = navigationState.routes.indexOf(route);\n const isFocused = navigationState.index === tabIndex;\n\n const labelColorFromStyle = StyleSheet.flatten(labelStyle || {}).color;\n\n const activeColor =\n activeColorCustom !== undefined\n ? activeColorCustom\n : typeof labelColorFromStyle === 'string'\n ? labelColorFromStyle\n : DEFAULT_ACTIVE_COLOR;\n const inactiveColor =\n inactiveColorCustom !== undefined\n ? inactiveColorCustom\n : typeof labelColorFromStyle === 'string'\n ? labelColorFromStyle\n : DEFAULT_INACTIVE_COLOR;\n\n const activeOpacity = this.getActiveOpacity(\n position,\n navigationState.routes,\n tabIndex\n );\n const inactiveOpacity = this.getInactiveOpacity(\n position,\n navigationState.routes,\n tabIndex\n );\n\n let icon: React.ReactNode | null = null;\n let label: React.ReactNode | null = null;\n\n if (renderIcon) {\n const activeIcon = renderIcon({\n route,\n focused: true,\n color: activeColor,\n });\n const inactiveIcon = renderIcon({\n route,\n focused: false,\n color: inactiveColor,\n });\n\n if (inactiveIcon != null && activeIcon != null) {\n icon = (\n <View style={styles.icon}>\n <Animated.View style={{ opacity: inactiveOpacity }}>\n {inactiveIcon}\n </Animated.View>\n <Animated.View\n style={[StyleSheet.absoluteFill, { opacity: activeOpacity }]}\n >\n {activeIcon}\n </Animated.View>\n </View>\n );\n }\n }\n\n const renderLabel =\n renderLabelCustom !== undefined\n ? renderLabelCustom\n : ({ route, color }: { route: T; color: string }) => {\n const labelText = getLabelText({ route });\n\n if (typeof labelText === 'string') {\n return (\n <Animated.Text\n style={[\n styles.label,\n icon ? { marginTop: 0 } : null,\n labelStyle,\n { color },\n ]}\n >\n {labelText}\n </Animated.Text>\n );\n }\n\n return labelText;\n };\n\n if (renderLabel) {\n const activeLabel = renderLabel({\n route,\n focused: true,\n color: activeColor,\n });\n const inactiveLabel = renderLabel({\n route,\n focused: false,\n color: inactiveColor,\n });\n\n label = (\n <View>\n <Animated.View style={{ opacity: inactiveOpacity }}>\n {inactiveLabel}\n </Animated.View>\n <Animated.View\n style={[StyleSheet.absoluteFill, { opacity: activeOpacity }]}\n >\n {activeLabel}\n </Animated.View>\n </View>\n );\n }\n\n const tabStyle = StyleSheet.flatten(style);\n const isWidthSet = tabStyle?.width !== undefined;\n const tabContainerStyle: ViewStyle | null = isWidthSet ? null : { flex: 1 };\n\n const scene = { route };\n\n let accessibilityLabel = getAccessibilityLabel(scene);\n\n accessibilityLabel =\n typeof accessibilityLabel !== 'undefined'\n ? accessibilityLabel\n : getLabelText(scene);\n\n const badge = renderBadge ? renderBadge(scene) : null;\n\n return (\n <PlatformPressable\n android_ripple={{ borderless: true }}\n testID={getTestID(scene)}\n accessible={getAccessible(scene)}\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"tab\"\n accessibilityState={{ selected: isFocused }}\n // @ts-ignore: this is to support older React Native versions\n accessibilityStates={isFocused ? ['selected'] : []}\n pressColor={pressColor}\n pressOpacity={pressOpacity}\n delayPressIn={0}\n onLayout={onLayout}\n onPress={onPress}\n onLongPress={onLongPress}\n style={[styles.pressable, tabContainerStyle]}\n >\n <View pointerEvents=\"none\" style={[styles.item, tabStyle]}>\n {icon}\n {label}\n {badge != null ? <View style={styles.badge}>{badge}</View> : null}\n </View>\n </PlatformPressable>\n );\n }\n}\n\nconst styles = StyleSheet.create({\n label: {\n margin: 4,\n backgroundColor: 'transparent',\n textTransform: 'uppercase',\n },\n icon: {\n margin: 2,\n },\n item: {\n flex: 1,\n alignItems: 'center',\n justifyContent: 'center',\n padding: 10,\n minHeight: 48,\n },\n badge: {\n position: 'absolute',\n top: 0,\n right: 0,\n },\n pressable: {\n // The label is not pressable on Windows\n // Adding backgroundColor: 'transparent' seems to fix it\n backgroundColor: 'transparent',\n },\n});\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["DEFAULT_ACTIVE_COLOR","DEFAULT_INACTIVE_COLOR","getActiveOpacity","position","routesLength","tabIndex","inputRange","Array","from","length","_","i","interpolate","outputRange","map","getInactiveOpacity","TabBarItemInternal","getAccessibilityLabel","getAccessible","getLabelText","getTestID","onLongPress","onPress","isFocused","route","style","inactiveColor","inactiveColorCustom","activeColor","activeColorCustom","labelStyle","onLayout","index","pressColor","pressOpacity","renderBadge","renderIcon","defaultTabWidth","renderLabel","renderLabelCustom","labelColorFromStyle","StyleSheet","flatten","color","undefined","activeOpacity","inactiveOpacity","icon","label","activeIcon","focused","inactiveIcon","styles","opacity","absoluteFill","labelProps","labelText","marginTop","activeLabel","inactiveLabel","tabStyle","isWidthSet","width","tabContainerStyle","scene","accessibilityLabel","badge","borderless","selected","pressable","item","MemoizedTabBarItemInternal","React","memo","TabBarItem","props","navigationState","rest","onPressLatest","useLatestCallback","onLongPressLatest","onLayoutLatest","routes","indexOf","create","margin","backgroundColor","textTransform","flex","alignItems","justifyContent","padding","minHeight","top","right"],"sources":["TabBarItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Animated,\n StyleSheet,\n View,\n StyleProp,\n LayoutChangeEvent,\n TextStyle,\n ViewStyle,\n} from 'react-native';\nimport useLatestCallback from 'use-latest-callback';\nimport PlatformPressable from './PlatformPressable';\nimport type { Scene, Route, NavigationState } from './types';\n\nexport type Props<T extends Route> = {\n position: Animated.AnimatedInterpolation;\n route: T;\n navigationState: NavigationState<T>;\n activeColor?: string;\n inactiveColor?: string;\n pressColor?: string;\n pressOpacity?: number;\n getLabelText: (scene: Scene<T>) => string | undefined;\n getAccessible: (scene: Scene<T>) => boolean | undefined;\n getAccessibilityLabel: (scene: Scene<T>) => string | undefined;\n getTestID: (scene: Scene<T>) => string | undefined;\n renderLabel?: (scene: {\n route: T;\n focused: boolean;\n color: string;\n }) => React.ReactNode;\n renderIcon?: (scene: {\n route: T;\n focused: boolean;\n color: string;\n }) => React.ReactNode;\n renderBadge?: (scene: Scene<T>) => React.ReactNode;\n onLayout?: (event: LayoutChangeEvent) => void;\n onPress: () => void;\n onLongPress: () => void;\n defaultTabWidth?: number;\n labelStyle?: StyleProp<TextStyle>;\n style: StyleProp<ViewStyle>;\n};\n\nconst DEFAULT_ACTIVE_COLOR = 'rgba(255, 255, 255, 1)';\nconst DEFAULT_INACTIVE_COLOR = 'rgba(255, 255, 255, 0.7)';\n\nconst getActiveOpacity = (\n position: Animated.AnimatedInterpolation,\n routesLength: number,\n tabIndex: number\n) => {\n if (routesLength > 1) {\n const inputRange = Array.from({ length: routesLength }, (_, i) => i);\n\n return position.interpolate({\n inputRange,\n outputRange: inputRange.map((i) => (i === tabIndex ? 1 : 0)),\n });\n } else {\n return 1;\n }\n};\n\nconst getInactiveOpacity = (\n position: Animated.AnimatedInterpolation,\n routesLength: number,\n tabIndex: number\n) => {\n if (routesLength > 1) {\n const inputRange = Array.from({ length: routesLength }, (_, i) => i);\n\n return position.interpolate({\n inputRange,\n outputRange: inputRange.map((i: number) => (i === tabIndex ? 0 : 1)),\n });\n } else {\n return 0;\n }\n};\n\ntype TabBarItemInternalProps<T extends Route> = Omit<\n Props<T>,\n 'navigationState'\n> & {\n isFocused: boolean;\n index: number;\n routesLength: number;\n};\n\nconst TabBarItemInternal = <T extends Route>({\n getAccessibilityLabel,\n getAccessible,\n getLabelText,\n getTestID,\n onLongPress,\n onPress,\n isFocused,\n position,\n route,\n style,\n inactiveColor: inactiveColorCustom,\n activeColor: activeColorCustom,\n labelStyle,\n onLayout,\n index: tabIndex,\n pressColor,\n pressOpacity,\n renderBadge,\n renderIcon,\n defaultTabWidth,\n routesLength,\n renderLabel: renderLabelCustom,\n}: TabBarItemInternalProps<T>) => {\n const labelColorFromStyle = StyleSheet.flatten(labelStyle || {}).color;\n\n const activeColor =\n activeColorCustom !== undefined\n ? activeColorCustom\n : typeof labelColorFromStyle === 'string'\n ? labelColorFromStyle\n : DEFAULT_ACTIVE_COLOR;\n const inactiveColor =\n inactiveColorCustom !== undefined\n ? inactiveColorCustom\n : typeof labelColorFromStyle === 'string'\n ? labelColorFromStyle\n : DEFAULT_INACTIVE_COLOR;\n\n const activeOpacity = getActiveOpacity(position, routesLength, tabIndex);\n const inactiveOpacity = getInactiveOpacity(position, routesLength, tabIndex);\n\n let icon: React.ReactNode | null = null;\n let label: React.ReactNode | null = null;\n\n if (renderIcon) {\n const activeIcon = renderIcon({\n route,\n focused: true,\n color: activeColor,\n });\n const inactiveIcon = renderIcon({\n route,\n focused: false,\n color: inactiveColor,\n });\n\n if (inactiveIcon != null && activeIcon != null) {\n icon = (\n <View style={styles.icon}>\n <Animated.View style={{ opacity: inactiveOpacity }}>\n {inactiveIcon}\n </Animated.View>\n <Animated.View\n style={[StyleSheet.absoluteFill, { opacity: activeOpacity }]}\n >\n {activeIcon}\n </Animated.View>\n </View>\n );\n }\n }\n\n const renderLabel =\n renderLabelCustom !== undefined\n ? renderLabelCustom\n : (labelProps: { route: T; color: string }) => {\n const labelText = getLabelText({ route: labelProps.route });\n\n if (typeof labelText === 'string') {\n return (\n <Animated.Text\n style={[\n styles.label,\n icon ? { marginTop: 0 } : null,\n labelStyle,\n { color: labelProps.color },\n ]}\n >\n {labelText}\n </Animated.Text>\n );\n }\n\n return labelText;\n };\n\n if (renderLabel) {\n const activeLabel = renderLabel({\n route,\n focused: true,\n color: activeColor,\n });\n const inactiveLabel = renderLabel({\n route,\n focused: false,\n color: inactiveColor,\n });\n\n label = (\n <View>\n <Animated.View style={{ opacity: inactiveOpacity }}>\n {inactiveLabel}\n </Animated.View>\n <Animated.View\n style={[StyleSheet.absoluteFill, { opacity: activeOpacity }]}\n >\n {activeLabel}\n </Animated.View>\n </View>\n );\n }\n\n const tabStyle = StyleSheet.flatten(style);\n const isWidthSet = tabStyle?.width !== undefined;\n\n const tabContainerStyle: ViewStyle | null = isWidthSet\n ? null\n : { width: defaultTabWidth };\n\n const scene = { route };\n\n let accessibilityLabel = getAccessibilityLabel(scene);\n\n accessibilityLabel =\n typeof accessibilityLabel !== 'undefined'\n ? accessibilityLabel\n : getLabelText(scene);\n\n const badge = renderBadge ? renderBadge(scene) : null;\n\n return (\n <PlatformPressable\n android_ripple={{ borderless: true }}\n testID={getTestID(scene)}\n accessible={getAccessible(scene)}\n accessibilityLabel={accessibilityLabel}\n accessibilityRole=\"tab\"\n accessibilityState={{ selected: isFocused }}\n // @ts-ignore: this is to support older React Native versions\n accessibilityStates={isFocused ? ['selected'] : []}\n pressColor={pressColor}\n pressOpacity={pressOpacity}\n delayPressIn={0}\n onLayout={onLayout}\n onPress={onPress}\n onLongPress={onLongPress}\n style={[styles.pressable, tabContainerStyle]}\n >\n <View pointerEvents=\"none\" style={[styles.item, tabStyle]}>\n {icon}\n {label}\n {badge != null ? <View style={styles.badge}>{badge}</View> : null}\n </View>\n </PlatformPressable>\n );\n};\n\nconst MemoizedTabBarItemInternal = React.memo(\n TabBarItemInternal\n) as typeof TabBarItemInternal;\n\nfunction TabBarItem<T extends Route>(props: Props<T>) {\n const { onPress, onLongPress, onLayout, navigationState, route, ...rest } =\n props;\n const onPressLatest = useLatestCallback(onPress);\n const onLongPressLatest = useLatestCallback(onLongPress);\n const onLayoutLatest = useLatestCallback(onLayout ? onLayout : () => {});\n\n const tabIndex = navigationState.routes.indexOf(route);\n\n return (\n <MemoizedTabBarItemInternal\n {...rest}\n onPress={onPressLatest}\n onLayout={onLayoutLatest}\n onLongPress={onLongPressLatest}\n isFocused={navigationState.index === tabIndex}\n route={route}\n index={tabIndex}\n routesLength={navigationState.routes.length}\n />\n );\n}\n\nexport default TabBarItem;\n\nconst styles = StyleSheet.create({\n label: {\n margin: 4,\n backgroundColor: 'transparent',\n textTransform: 'uppercase',\n },\n icon: {\n margin: 2,\n },\n item: {\n flex: 1,\n alignItems: 'center',\n justifyContent: 'center',\n padding: 10,\n minHeight: 48,\n },\n badge: {\n position: 'absolute',\n top: 0,\n right: 0,\n },\n pressable: {\n // The label is not pressable on Windows\n // Adding backgroundColor: 'transparent' seems to fix it\n backgroundColor: 'transparent',\n },\n});\n"],"mappings":"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"}
|
package/lib/commonjs/TabView.js
CHANGED
|
@@ -40,7 +40,8 @@ function TabView(_ref) {
|
|
|
40
40
|
pagerStyle,
|
|
41
41
|
style,
|
|
42
42
|
swipeEnabled = true,
|
|
43
|
-
tabBarPosition = 'top'
|
|
43
|
+
tabBarPosition = 'top',
|
|
44
|
+
animationEnabled = true
|
|
44
45
|
} = _ref;
|
|
45
46
|
const [layout, setLayout] = React.useState({
|
|
46
47
|
width: 0,
|
|
@@ -82,6 +83,7 @@ function TabView(_ref) {
|
|
|
82
83
|
onSwipeStart: onSwipeStart,
|
|
83
84
|
onSwipeEnd: onSwipeEnd,
|
|
84
85
|
onIndexChange: jumpToIndex,
|
|
86
|
+
animationEnabled: animationEnabled,
|
|
85
87
|
style: pagerStyle
|
|
86
88
|
}, _ref2 => {
|
|
87
89
|
let {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["TabView","onIndexChange","navigationState","renderScene","initialLayout","keyboardDismissMode","lazy","lazyPreloadDistance","onSwipeStart","onSwipeEnd","renderLazyPlaceholder","renderTabBar","props","sceneContainerStyle","pagerStyle","style","swipeEnabled","tabBarPosition","layout","setLayout","React","useState","width","height","jumpToIndex","index","handleLayout","e","nativeEvent","prevLayout","styles","pager","position","render","addEnterListener","jumpTo","sceneRendererProps","routes","map","route","i","key","loading","StyleSheet","create","flex","overflow"],"sources":["TabView.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n StyleSheet,\n View,\n StyleProp,\n ViewStyle,\n LayoutChangeEvent,\n} from 'react-native';\nimport TabBar from './TabBar';\nimport SceneView from './SceneView';\nimport Pager from './Pager';\nimport type {\n Layout,\n NavigationState,\n Route,\n SceneRendererProps,\n PagerProps,\n} from './types';\n\nexport type Props<T extends Route> = PagerProps & {\n onIndexChange: (index: number) => void;\n navigationState: NavigationState<T>;\n renderScene: (props: SceneRendererProps & { route: T }) => React.ReactNode;\n renderLazyPlaceholder?: (props: { route: T }) => React.ReactNode;\n renderTabBar?: (\n props: SceneRendererProps & { navigationState: NavigationState<T> }\n ) => React.ReactNode;\n tabBarPosition?: 'top' | 'bottom';\n initialLayout?: Partial<Layout>;\n lazy?: ((props: { route: T }) => boolean) | boolean;\n lazyPreloadDistance?: number;\n sceneContainerStyle?: StyleProp<ViewStyle>;\n pagerStyle?: StyleProp<ViewStyle>;\n style?: StyleProp<ViewStyle>;\n};\n\nexport default function TabView<T extends Route>({\n onIndexChange,\n navigationState,\n renderScene,\n initialLayout,\n keyboardDismissMode = 'auto',\n lazy = false,\n lazyPreloadDistance = 0,\n onSwipeStart,\n onSwipeEnd,\n renderLazyPlaceholder = () => null,\n renderTabBar = (props) => <TabBar {...props} />,\n sceneContainerStyle,\n pagerStyle,\n style,\n swipeEnabled = true,\n tabBarPosition = 'top',\n}: Props<T>) {\n const [layout, setLayout] = React.useState({\n width: 0,\n height: 0,\n ...initialLayout,\n });\n\n const jumpToIndex = (index: number) => {\n if (index !== navigationState.index) {\n onIndexChange(index);\n }\n };\n\n const handleLayout = (e: LayoutChangeEvent) => {\n const { height, width } = e.nativeEvent.layout;\n\n setLayout((prevLayout) => {\n if (prevLayout.width === width && prevLayout.height === height) {\n return prevLayout;\n }\n\n return { height, width };\n });\n };\n\n return (\n <View onLayout={handleLayout} style={[styles.pager, style]}>\n <Pager\n layout={layout}\n navigationState={navigationState}\n keyboardDismissMode={keyboardDismissMode}\n swipeEnabled={swipeEnabled}\n onSwipeStart={onSwipeStart}\n onSwipeEnd={onSwipeEnd}\n onIndexChange={jumpToIndex}\n style={pagerStyle}\n >\n {({ position, render, addEnterListener, jumpTo }) => {\n // All of the props here must not change between re-renders\n // This is crucial to optimizing the routes with PureComponent\n const sceneRendererProps = {\n position,\n layout,\n jumpTo,\n };\n\n return (\n <React.Fragment>\n {tabBarPosition === 'top' &&\n renderTabBar({\n ...sceneRendererProps,\n navigationState,\n })}\n {render(\n navigationState.routes.map((route, i) => {\n return (\n <SceneView\n {...sceneRendererProps}\n addEnterListener={addEnterListener}\n key={route.key}\n index={i}\n lazy={typeof lazy === 'function' ? lazy({ route }) : lazy}\n lazyPreloadDistance={lazyPreloadDistance}\n navigationState={navigationState}\n style={sceneContainerStyle}\n >\n {({ loading }) =>\n loading\n ? renderLazyPlaceholder({ route })\n : renderScene({\n ...sceneRendererProps,\n route,\n })\n }\n </SceneView>\n );\n })\n )}\n {tabBarPosition === 'bottom' &&\n renderTabBar({\n ...sceneRendererProps,\n navigationState,\n })}\n </React.Fragment>\n );\n }}\n </Pager>\n </View>\n );\n}\n\nconst styles = StyleSheet.create({\n pager: {\n flex: 1,\n overflow: 'hidden',\n },\n});\n"],"mappings":";;;;;;;AAAA;;AACA;;AAOA;;AACA;;AACA;;;;;;;;;;AA0Be,SAASA,OAAT,
|
|
1
|
+
{"version":3,"names":["TabView","onIndexChange","navigationState","renderScene","initialLayout","keyboardDismissMode","lazy","lazyPreloadDistance","onSwipeStart","onSwipeEnd","renderLazyPlaceholder","renderTabBar","props","sceneContainerStyle","pagerStyle","style","swipeEnabled","tabBarPosition","animationEnabled","layout","setLayout","React","useState","width","height","jumpToIndex","index","handleLayout","e","nativeEvent","prevLayout","styles","pager","position","render","addEnterListener","jumpTo","sceneRendererProps","routes","map","route","i","key","loading","StyleSheet","create","flex","overflow"],"sources":["TabView.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n StyleSheet,\n View,\n StyleProp,\n ViewStyle,\n LayoutChangeEvent,\n} from 'react-native';\nimport TabBar from './TabBar';\nimport SceneView from './SceneView';\nimport Pager from './Pager';\nimport type {\n Layout,\n NavigationState,\n Route,\n SceneRendererProps,\n PagerProps,\n} from './types';\n\nexport type Props<T extends Route> = PagerProps & {\n onIndexChange: (index: number) => void;\n navigationState: NavigationState<T>;\n renderScene: (props: SceneRendererProps & { route: T }) => React.ReactNode;\n renderLazyPlaceholder?: (props: { route: T }) => React.ReactNode;\n renderTabBar?: (\n props: SceneRendererProps & { navigationState: NavigationState<T> }\n ) => React.ReactNode;\n tabBarPosition?: 'top' | 'bottom';\n initialLayout?: Partial<Layout>;\n lazy?: ((props: { route: T }) => boolean) | boolean;\n lazyPreloadDistance?: number;\n sceneContainerStyle?: StyleProp<ViewStyle>;\n pagerStyle?: StyleProp<ViewStyle>;\n style?: StyleProp<ViewStyle>;\n};\n\nexport default function TabView<T extends Route>({\n onIndexChange,\n navigationState,\n renderScene,\n initialLayout,\n keyboardDismissMode = 'auto',\n lazy = false,\n lazyPreloadDistance = 0,\n onSwipeStart,\n onSwipeEnd,\n renderLazyPlaceholder = () => null,\n renderTabBar = (props) => <TabBar {...props} />,\n sceneContainerStyle,\n pagerStyle,\n style,\n swipeEnabled = true,\n tabBarPosition = 'top',\n animationEnabled = true,\n}: Props<T>) {\n const [layout, setLayout] = React.useState({\n width: 0,\n height: 0,\n ...initialLayout,\n });\n\n const jumpToIndex = (index: number) => {\n if (index !== navigationState.index) {\n onIndexChange(index);\n }\n };\n\n const handleLayout = (e: LayoutChangeEvent) => {\n const { height, width } = e.nativeEvent.layout;\n\n setLayout((prevLayout) => {\n if (prevLayout.width === width && prevLayout.height === height) {\n return prevLayout;\n }\n\n return { height, width };\n });\n };\n\n return (\n <View onLayout={handleLayout} style={[styles.pager, style]}>\n <Pager\n layout={layout}\n navigationState={navigationState}\n keyboardDismissMode={keyboardDismissMode}\n swipeEnabled={swipeEnabled}\n onSwipeStart={onSwipeStart}\n onSwipeEnd={onSwipeEnd}\n onIndexChange={jumpToIndex}\n animationEnabled={animationEnabled}\n style={pagerStyle}\n >\n {({ position, render, addEnterListener, jumpTo }) => {\n // All of the props here must not change between re-renders\n // This is crucial to optimizing the routes with PureComponent\n const sceneRendererProps = {\n position,\n layout,\n jumpTo,\n };\n\n return (\n <React.Fragment>\n {tabBarPosition === 'top' &&\n renderTabBar({\n ...sceneRendererProps,\n navigationState,\n })}\n {render(\n navigationState.routes.map((route, i) => {\n return (\n <SceneView\n {...sceneRendererProps}\n addEnterListener={addEnterListener}\n key={route.key}\n index={i}\n lazy={typeof lazy === 'function' ? lazy({ route }) : lazy}\n lazyPreloadDistance={lazyPreloadDistance}\n navigationState={navigationState}\n style={sceneContainerStyle}\n >\n {({ loading }) =>\n loading\n ? renderLazyPlaceholder({ route })\n : renderScene({\n ...sceneRendererProps,\n route,\n })\n }\n </SceneView>\n );\n })\n )}\n {tabBarPosition === 'bottom' &&\n renderTabBar({\n ...sceneRendererProps,\n navigationState,\n })}\n </React.Fragment>\n );\n }}\n </Pager>\n </View>\n );\n}\n\nconst styles = StyleSheet.create({\n pager: {\n flex: 1,\n overflow: 'hidden',\n },\n});\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["types.tsx"],"sourcesContent":["import type { Animated } from 'react-native';\nimport type { PagerViewProps } from 'react-native-pager-view';\n\nexport type Route = {\n key: string;\n icon?: string;\n title?: string;\n accessible?: boolean;\n accessibilityLabel?: string;\n testID?: string;\n};\n\nexport type Event = {\n defaultPrevented: boolean;\n preventDefault(): void;\n};\n\nexport type Scene<T extends Route> = {\n route: T;\n};\n\nexport type NavigationState<T extends Route> = {\n index: number;\n routes: T[];\n};\n\nexport type Layout = {\n width: number;\n height: number;\n};\n\nexport type Listener = (value: number) => void;\n\nexport type SceneRendererProps = {\n layout: Layout;\n position: Animated.AnimatedInterpolation;\n jumpTo: (key: string) => void;\n};\n\nexport type EventEmitterProps = {\n addEnterListener: (listener: Listener) => () => void;\n};\n\nexport type PagerProps = Omit<\n PagerViewProps,\n | 'initialPage'\n | 'scrollEnabled'\n | 'onPageScroll'\n | 'onPageSelected'\n | 'onPageScrollStateChanged'\n | 'keyboardDismissMode'\n | 'children'\n> & {\n keyboardDismissMode?: 'none' | 'on-drag' | 'auto';\n swipeEnabled?: boolean;\n onSwipeStart?: () => void;\n onSwipeEnd?: () => void;\n};\n"],"mappings":""}
|
|
1
|
+
{"version":3,"names":[],"sources":["types.tsx"],"sourcesContent":["import type { Animated } from 'react-native';\nimport type { PagerViewProps } from 'react-native-pager-view';\n\nexport type Route = {\n key: string;\n icon?: string;\n title?: string;\n accessible?: boolean;\n accessibilityLabel?: string;\n testID?: string;\n};\n\nexport type Event = {\n defaultPrevented: boolean;\n preventDefault(): void;\n};\n\nexport type Scene<T extends Route> = {\n route: T;\n};\n\nexport type NavigationState<T extends Route> = {\n index: number;\n routes: T[];\n};\n\nexport type Layout = {\n width: number;\n height: number;\n};\n\nexport type Listener = (value: number) => void;\n\nexport type SceneRendererProps = {\n layout: Layout;\n position: Animated.AnimatedInterpolation;\n jumpTo: (key: string) => void;\n};\n\nexport type EventEmitterProps = {\n addEnterListener: (listener: Listener) => () => void;\n};\n\nexport type PagerProps = Omit<\n PagerViewProps,\n | 'initialPage'\n | 'scrollEnabled'\n | 'onPageScroll'\n | 'onPageSelected'\n | 'onPageScrollStateChanged'\n | 'keyboardDismissMode'\n | 'children'\n> & {\n keyboardDismissMode?: 'none' | 'on-drag' | 'auto';\n swipeEnabled?: boolean;\n animationEnabled?: boolean;\n onSwipeStart?: () => void;\n onSwipeEnd?: () => void;\n};\n"],"mappings":""}
|
|
@@ -15,6 +15,7 @@ export default function PagerViewAdapter(_ref) {
|
|
|
15
15
|
onSwipeEnd,
|
|
16
16
|
children,
|
|
17
17
|
style,
|
|
18
|
+
animationEnabled,
|
|
18
19
|
...rest
|
|
19
20
|
} = _ref;
|
|
20
21
|
const {
|
|
@@ -30,22 +31,37 @@ export default function PagerViewAdapter(_ref) {
|
|
|
30
31
|
navigationStateRef.current = navigationState;
|
|
31
32
|
});
|
|
32
33
|
const jumpTo = React.useCallback(key => {
|
|
33
|
-
var _pagerRef$current;
|
|
34
|
-
|
|
35
34
|
const index = navigationStateRef.current.routes.findIndex(route => route.key === key);
|
|
36
|
-
|
|
37
|
-
|
|
35
|
+
|
|
36
|
+
if (animationEnabled) {
|
|
37
|
+
var _pagerRef$current;
|
|
38
|
+
|
|
39
|
+
(_pagerRef$current = pagerRef.current) === null || _pagerRef$current === void 0 ? void 0 : _pagerRef$current.setPage(index);
|
|
40
|
+
} else {
|
|
41
|
+
var _pagerRef$current2;
|
|
42
|
+
|
|
43
|
+
(_pagerRef$current2 = pagerRef.current) === null || _pagerRef$current2 === void 0 ? void 0 : _pagerRef$current2.setPageWithoutAnimation(index);
|
|
44
|
+
position.setValue(index);
|
|
45
|
+
}
|
|
46
|
+
}, [animationEnabled, position]);
|
|
38
47
|
React.useEffect(() => {
|
|
39
48
|
if (keyboardDismissMode === 'auto') {
|
|
40
49
|
Keyboard.dismiss();
|
|
41
50
|
}
|
|
42
51
|
|
|
43
52
|
if (indexRef.current !== index) {
|
|
44
|
-
|
|
53
|
+
if (animationEnabled) {
|
|
54
|
+
var _pagerRef$current3;
|
|
45
55
|
|
|
46
|
-
|
|
56
|
+
(_pagerRef$current3 = pagerRef.current) === null || _pagerRef$current3 === void 0 ? void 0 : _pagerRef$current3.setPage(index);
|
|
57
|
+
} else {
|
|
58
|
+
var _pagerRef$current4;
|
|
59
|
+
|
|
60
|
+
(_pagerRef$current4 = pagerRef.current) === null || _pagerRef$current4 === void 0 ? void 0 : _pagerRef$current4.setPageWithoutAnimation(index);
|
|
61
|
+
position.setValue(index);
|
|
62
|
+
}
|
|
47
63
|
}
|
|
48
|
-
}, [keyboardDismissMode, index]);
|
|
64
|
+
}, [keyboardDismissMode, index, animationEnabled, position]);
|
|
49
65
|
|
|
50
66
|
const onPageScrollStateChanged = state => {
|
|
51
67
|
const {
|
|
@@ -87,8 +103,9 @@ export default function PagerViewAdapter(_ref) {
|
|
|
87
103
|
}
|
|
88
104
|
};
|
|
89
105
|
}, []);
|
|
106
|
+
const memoizedPosition = React.useMemo(() => Animated.add(position, offset), [offset, position]);
|
|
90
107
|
return children({
|
|
91
|
-
position:
|
|
108
|
+
position: memoizedPosition,
|
|
92
109
|
addEnterListener,
|
|
93
110
|
jumpTo,
|
|
94
111
|
render: children => /*#__PURE__*/React.createElement(AnimatedViewPager, _extends({}, rest, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Animated","Keyboard","StyleSheet","ViewPager","useAnimatedValue","AnimatedViewPager","createAnimatedComponent","PagerViewAdapter","keyboardDismissMode","swipeEnabled","navigationState","onIndexChange","onSwipeStart","onSwipeEnd","children","style","rest","index","listenersRef","useRef","pagerRef","indexRef","navigationStateRef","position","offset","useEffect","current","jumpTo","useCallback","key","routes","findIndex","route","setPage","dismiss","onPageScrollStateChanged","state","pageScrollState","nativeEvent","subscription","addListener","value","next","Math","ceil","floor","forEach","listener","removeListener","addEnterListener","push","indexOf","splice","add","render","styles","container","event","useNativeDriver","e","create","flex"],"sources":["PagerViewAdapter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Animated, Keyboard, StyleSheet } from 'react-native';\nimport ViewPager, {\n PageScrollStateChangedNativeEvent,\n} from 'react-native-pager-view';\nimport useAnimatedValue from './useAnimatedValue';\nimport type {\n NavigationState,\n Route,\n Listener,\n EventEmitterProps,\n PagerProps,\n} from './types';\n\nconst AnimatedViewPager = Animated.createAnimatedComponent(ViewPager);\n\ntype Props<T extends Route> = PagerProps & {\n onIndexChange: (index: number) => void;\n navigationState: NavigationState<T>;\n children: (\n props: EventEmitterProps & {\n // Animated value which represents the state of current index\n // It can include fractional digits as it represents the intermediate value\n position: Animated.AnimatedInterpolation;\n // Function to actually render the content of the pager\n // The parent component takes care of rendering\n render: (children: React.ReactNode) => React.ReactNode;\n // Callback to call when switching the tab\n // The tab switch animation is performed even if the index in state is unchanged\n jumpTo: (key: string) => void;\n }\n ) => React.ReactElement;\n};\n\nexport default function PagerViewAdapter<T extends Route>({\n keyboardDismissMode = 'auto',\n swipeEnabled = true,\n navigationState,\n onIndexChange,\n onSwipeStart,\n onSwipeEnd,\n children,\n style,\n ...rest\n}: Props<T>) {\n const { index } = navigationState;\n\n const listenersRef = React.useRef<Listener[]>([]);\n\n const pagerRef = React.useRef<ViewPager>();\n const indexRef = React.useRef<number>(index);\n const navigationStateRef = React.useRef(navigationState);\n\n const position = useAnimatedValue(index);\n const offset = useAnimatedValue(0);\n\n React.useEffect(() => {\n navigationStateRef.current = navigationState;\n });\n\n const jumpTo = React.useCallback((key: string) => {\n
|
|
1
|
+
{"version":3,"names":["React","Animated","Keyboard","StyleSheet","ViewPager","useAnimatedValue","AnimatedViewPager","createAnimatedComponent","PagerViewAdapter","keyboardDismissMode","swipeEnabled","navigationState","onIndexChange","onSwipeStart","onSwipeEnd","children","style","animationEnabled","rest","index","listenersRef","useRef","pagerRef","indexRef","navigationStateRef","position","offset","useEffect","current","jumpTo","useCallback","key","routes","findIndex","route","setPage","setPageWithoutAnimation","setValue","dismiss","onPageScrollStateChanged","state","pageScrollState","nativeEvent","subscription","addListener","value","next","Math","ceil","floor","forEach","listener","removeListener","addEnterListener","push","indexOf","splice","memoizedPosition","useMemo","add","render","styles","container","event","useNativeDriver","e","create","flex"],"sources":["PagerViewAdapter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Animated, Keyboard, StyleSheet } from 'react-native';\nimport ViewPager, {\n PageScrollStateChangedNativeEvent,\n} from 'react-native-pager-view';\nimport useAnimatedValue from './useAnimatedValue';\nimport type {\n NavigationState,\n Route,\n Listener,\n EventEmitterProps,\n PagerProps,\n} from './types';\n\nconst AnimatedViewPager = Animated.createAnimatedComponent(ViewPager);\n\ntype Props<T extends Route> = PagerProps & {\n onIndexChange: (index: number) => void;\n navigationState: NavigationState<T>;\n children: (\n props: EventEmitterProps & {\n // Animated value which represents the state of current index\n // It can include fractional digits as it represents the intermediate value\n position: Animated.AnimatedInterpolation;\n // Function to actually render the content of the pager\n // The parent component takes care of rendering\n render: (children: React.ReactNode) => React.ReactNode;\n // Callback to call when switching the tab\n // The tab switch animation is performed even if the index in state is unchanged\n jumpTo: (key: string) => void;\n }\n ) => React.ReactElement;\n};\n\nexport default function PagerViewAdapter<T extends Route>({\n keyboardDismissMode = 'auto',\n swipeEnabled = true,\n navigationState,\n onIndexChange,\n onSwipeStart,\n onSwipeEnd,\n children,\n style,\n animationEnabled,\n ...rest\n}: Props<T>) {\n const { index } = navigationState;\n\n const listenersRef = React.useRef<Listener[]>([]);\n\n const pagerRef = React.useRef<ViewPager>();\n const indexRef = React.useRef<number>(index);\n const navigationStateRef = React.useRef(navigationState);\n\n const position = useAnimatedValue(index);\n const offset = useAnimatedValue(0);\n\n React.useEffect(() => {\n navigationStateRef.current = navigationState;\n });\n\n const jumpTo = React.useCallback(\n (key: string) => {\n const index = navigationStateRef.current.routes.findIndex(\n (route: { key: string }) => route.key === key\n );\n\n if (animationEnabled) {\n pagerRef.current?.setPage(index);\n } else {\n pagerRef.current?.setPageWithoutAnimation(index);\n position.setValue(index);\n }\n },\n [animationEnabled, position]\n );\n\n React.useEffect(() => {\n if (keyboardDismissMode === 'auto') {\n Keyboard.dismiss();\n }\n\n if (indexRef.current !== index) {\n if (animationEnabled) {\n pagerRef.current?.setPage(index);\n } else {\n pagerRef.current?.setPageWithoutAnimation(index);\n position.setValue(index);\n }\n }\n }, [keyboardDismissMode, index, animationEnabled, position]);\n\n const onPageScrollStateChanged = (\n state: PageScrollStateChangedNativeEvent\n ) => {\n const { pageScrollState } = state.nativeEvent;\n\n switch (pageScrollState) {\n case 'idle':\n onSwipeEnd?.();\n return;\n case 'dragging': {\n const subscription = offset.addListener(({ value }) => {\n const next =\n index + (value > 0 ? Math.ceil(value) : Math.floor(value));\n\n if (next !== index) {\n listenersRef.current.forEach((listener) => listener(next));\n }\n\n offset.removeListener(subscription);\n });\n\n onSwipeStart?.();\n return;\n }\n }\n };\n\n const addEnterListener = React.useCallback((listener: Listener) => {\n listenersRef.current.push(listener);\n\n return () => {\n const index = listenersRef.current.indexOf(listener);\n\n if (index > -1) {\n listenersRef.current.splice(index, 1);\n }\n };\n }, []);\n\n const memoizedPosition = React.useMemo(\n () => Animated.add(position, offset),\n [offset, position]\n );\n\n return children({\n position: memoizedPosition,\n addEnterListener,\n jumpTo,\n render: (children) => (\n <AnimatedViewPager\n {...rest}\n ref={pagerRef}\n style={[styles.container, style]}\n initialPage={index}\n keyboardDismissMode={\n keyboardDismissMode === 'auto' ? 'on-drag' : keyboardDismissMode\n }\n onPageScroll={Animated.event(\n [\n {\n nativeEvent: {\n position: position,\n offset: offset,\n },\n },\n ],\n { useNativeDriver: true }\n )}\n onPageSelected={(e) => {\n const index = e.nativeEvent.position;\n indexRef.current = index;\n onIndexChange(index);\n }}\n onPageScrollStateChanged={onPageScrollStateChanged}\n scrollEnabled={swipeEnabled}\n >\n {children}\n </AnimatedViewPager>\n ),\n });\n}\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n },\n});\n"],"mappings":"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"}
|