react-native-tab-view 3.2.1 → 3.3.2

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.
Files changed (66) hide show
  1. package/{LICENSE.md → LICENSE} +0 -0
  2. package/README.md +5 -36
  3. package/lib/commonjs/PagerViewAdapter.js +2 -1
  4. package/lib/commonjs/PagerViewAdapter.js.map +1 -1
  5. package/lib/commonjs/PanResponderAdapter.js +2 -1
  6. package/lib/commonjs/PanResponderAdapter.js.map +1 -1
  7. package/lib/commonjs/SceneMap.js +9 -12
  8. package/lib/commonjs/SceneMap.js.map +1 -1
  9. package/lib/commonjs/SceneView.js +54 -101
  10. package/lib/commonjs/SceneView.js.map +1 -1
  11. package/lib/commonjs/TabBar.js +358 -325
  12. package/lib/commonjs/TabBar.js.map +1 -1
  13. package/lib/commonjs/TabBarIndicator.js +81 -99
  14. package/lib/commonjs/TabBarIndicator.js.map +1 -1
  15. package/lib/commonjs/TabBarItem.js +184 -161
  16. package/lib/commonjs/TabBarItem.js.map +1 -1
  17. package/lib/commonjs/TabView.js +2 -2
  18. package/lib/commonjs/TabView.js.map +1 -1
  19. package/lib/commonjs/index.js +3 -3
  20. package/lib/commonjs/index.js.map +1 -1
  21. package/lib/module/PagerViewAdapter.js +2 -1
  22. package/lib/module/PagerViewAdapter.js.map +1 -1
  23. package/lib/module/PanResponderAdapter.js +3 -2
  24. package/lib/module/PanResponderAdapter.js.map +1 -1
  25. package/lib/module/SceneMap.js +9 -14
  26. package/lib/module/SceneMap.js.map +1 -1
  27. package/lib/module/SceneView.js +54 -99
  28. package/lib/module/SceneView.js.map +1 -1
  29. package/lib/module/TabBar.js +355 -324
  30. package/lib/module/TabBar.js.map +1 -1
  31. package/lib/module/TabBarIndicator.js +75 -93
  32. package/lib/module/TabBarIndicator.js.map +1 -1
  33. package/lib/module/TabBarItem.js +178 -154
  34. package/lib/module/TabBarItem.js.map +1 -1
  35. package/lib/module/TabView.js +2 -2
  36. package/lib/module/TabView.js.map +1 -1
  37. package/lib/module/index.js +2 -2
  38. package/lib/module/index.js.map +1 -1
  39. package/lib/typescript/{Pager.android.d.ts → src/Pager.android.d.ts} +0 -0
  40. package/lib/typescript/{Pager.d.ts → src/Pager.d.ts} +0 -0
  41. package/lib/typescript/{Pager.ios.d.ts → src/Pager.ios.d.ts} +0 -0
  42. package/lib/typescript/{PagerViewAdapter.d.ts → src/PagerViewAdapter.d.ts} +1 -1
  43. package/lib/typescript/{PanResponderAdapter.d.ts → src/PanResponderAdapter.d.ts} +1 -1
  44. package/lib/typescript/{PlatformPressable.d.ts → src/PlatformPressable.d.ts} +0 -0
  45. package/lib/typescript/{SceneMap.d.ts → src/SceneMap.d.ts} +5 -3
  46. package/lib/typescript/src/SceneView.d.ts +15 -0
  47. package/lib/typescript/src/TabBar.d.ts +42 -0
  48. package/lib/typescript/src/TabBarIndicator.d.ts +12 -0
  49. package/lib/typescript/{TabBarItem.d.ts → src/TabBarItem.d.ts} +5 -7
  50. package/lib/typescript/{TabView.d.ts → src/TabView.d.ts} +1 -1
  51. package/lib/typescript/{index.d.ts → src/index.d.ts} +7 -7
  52. package/lib/typescript/{types.d.ts → src/types.d.ts} +0 -0
  53. package/lib/typescript/{useAnimatedValue.d.ts → src/useAnimatedValue.d.ts} +0 -0
  54. package/package.json +28 -58
  55. package/src/PagerViewAdapter.tsx +11 -5
  56. package/src/PanResponderAdapter.tsx +16 -12
  57. package/src/SceneMap.tsx +12 -7
  58. package/src/SceneView.tsx +73 -108
  59. package/src/TabBar.tsx +506 -401
  60. package/src/TabBarIndicator.tsx +114 -117
  61. package/src/TabBarItem.tsx +230 -200
  62. package/src/TabView.tsx +6 -5
  63. package/src/index.tsx +7 -12
  64. package/lib/typescript/SceneView.d.ts +0 -32
  65. package/lib/typescript/TabBar.d.ts +0 -72
  66. package/lib/typescript/TabBarIndicator.d.ts +0 -20
@@ -1,182 +1,206 @@
1
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
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
 
3
3
  import * as React from 'react';
4
4
  import { Animated, StyleSheet, View } from 'react-native';
5
+ import useLatestCallback from 'use-latest-callback';
5
6
  import PlatformPressable from './PlatformPressable';
6
7
  const DEFAULT_ACTIVE_COLOR = 'rgba(255, 255, 255, 1)';
7
8
  const DEFAULT_INACTIVE_COLOR = 'rgba(255, 255, 255, 0.7)';
8
- export default class TabBarItem extends React.Component {
9
- constructor() {
10
- super(...arguments);
11
9
 
12
- _defineProperty(this, "getActiveOpacity", (position, routes, tabIndex) => {
13
- if (routes.length > 1) {
14
- const inputRange = routes.map((_, i) => i);
15
- return position.interpolate({
16
- inputRange,
17
- outputRange: inputRange.map(i => i === tabIndex ? 1 : 0)
18
- });
19
- } else {
20
- return 1;
21
- }
10
+ const getActiveOpacity = (position, routesLength, tabIndex) => {
11
+ if (routesLength > 1) {
12
+ const inputRange = Array.from({
13
+ length: routesLength
14
+ }, (_, i) => i);
15
+ return position.interpolate({
16
+ inputRange,
17
+ outputRange: inputRange.map(i => i === tabIndex ? 1 : 0)
22
18
  });
19
+ } else {
20
+ return 1;
21
+ }
22
+ };
23
23
 
24
- _defineProperty(this, "getInactiveOpacity", (position, routes, tabIndex) => {
25
- if (routes.length > 1) {
26
- const inputRange = routes.map((_, i) => i);
27
- return position.interpolate({
28
- inputRange,
29
- outputRange: inputRange.map(i => i === tabIndex ? 0 : 1)
30
- });
31
- } else {
32
- return 0;
33
- }
24
+ const getInactiveOpacity = (position, routesLength, tabIndex) => {
25
+ if (routesLength > 1) {
26
+ const inputRange = Array.from({
27
+ length: routesLength
28
+ }, (_, i) => i);
29
+ return position.interpolate({
30
+ inputRange,
31
+ outputRange: inputRange.map(i => i === tabIndex ? 0 : 1)
34
32
  });
33
+ } else {
34
+ return 0;
35
35
  }
36
+ };
36
37
 
37
- render() {
38
- const {
39
- route,
40
- position,
41
- navigationState,
42
- renderLabel: renderLabelCustom,
43
- renderIcon,
44
- renderBadge,
45
- getLabelText,
46
- getTestID,
47
- getAccessibilityLabel,
48
- getAccessible,
49
- activeColor: activeColorCustom,
50
- inactiveColor: inactiveColorCustom,
51
- pressColor,
52
- pressOpacity,
53
- labelStyle,
54
- style,
55
- onLayout,
56
- onPress,
57
- onLongPress
58
- } = this.props;
59
- const tabIndex = navigationState.routes.indexOf(route);
60
- const isFocused = navigationState.index === tabIndex;
61
- const labelColorFromStyle = StyleSheet.flatten(labelStyle || {}).color;
62
- const activeColor = activeColorCustom !== undefined ? activeColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_ACTIVE_COLOR;
63
- const inactiveColor = inactiveColorCustom !== undefined ? inactiveColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_INACTIVE_COLOR;
64
- const activeOpacity = this.getActiveOpacity(position, navigationState.routes, tabIndex);
65
- const inactiveOpacity = this.getInactiveOpacity(position, navigationState.routes, tabIndex);
66
- let icon = null;
67
- let label = null;
68
-
69
- if (renderIcon) {
70
- const activeIcon = renderIcon({
71
- route,
72
- focused: true,
73
- color: activeColor
74
- });
75
- const inactiveIcon = renderIcon({
76
- route,
77
- focused: false,
78
- color: inactiveColor
79
- });
80
-
81
- if (inactiveIcon != null && activeIcon != null) {
82
- icon = /*#__PURE__*/React.createElement(View, {
83
- style: styles.icon
84
- }, /*#__PURE__*/React.createElement(Animated.View, {
85
- style: {
86
- opacity: inactiveOpacity
87
- }
88
- }, inactiveIcon), /*#__PURE__*/React.createElement(Animated.View, {
89
- style: [StyleSheet.absoluteFill, {
90
- opacity: activeOpacity
91
- }]
92
- }, activeIcon));
93
- }
94
- }
38
+ const TabBarItemInternal = _ref => {
39
+ let {
40
+ getAccessibilityLabel,
41
+ getAccessible,
42
+ getLabelText,
43
+ getTestID,
44
+ onLongPress,
45
+ onPress,
46
+ isFocused,
47
+ position,
48
+ route,
49
+ style,
50
+ inactiveColor: inactiveColorCustom,
51
+ activeColor: activeColorCustom,
52
+ labelStyle,
53
+ onLayout,
54
+ index: tabIndex,
55
+ pressColor,
56
+ pressOpacity,
57
+ renderBadge,
58
+ renderIcon,
59
+ defaultTabWidth,
60
+ routesLength,
61
+ renderLabel: renderLabelCustom
62
+ } = _ref;
63
+ const labelColorFromStyle = StyleSheet.flatten(labelStyle || {}).color;
64
+ const activeColor = activeColorCustom !== undefined ? activeColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_ACTIVE_COLOR;
65
+ const inactiveColor = inactiveColorCustom !== undefined ? inactiveColorCustom : typeof labelColorFromStyle === 'string' ? labelColorFromStyle : DEFAULT_INACTIVE_COLOR;
66
+ const activeOpacity = getActiveOpacity(position, routesLength, tabIndex);
67
+ const inactiveOpacity = getInactiveOpacity(position, routesLength, tabIndex);
68
+ let icon = null;
69
+ let label = null;
95
70
 
96
- const renderLabel = renderLabelCustom !== undefined ? renderLabelCustom : _ref => {
97
- let {
98
- route,
99
- color
100
- } = _ref;
101
- const labelText = getLabelText({
102
- route
103
- });
104
-
105
- if (typeof labelText === 'string') {
106
- return /*#__PURE__*/React.createElement(Animated.Text, {
107
- style: [styles.label, icon ? {
108
- marginTop: 0
109
- } : null, labelStyle, {
110
- color
111
- }]
112
- }, labelText);
113
- }
114
-
115
- return labelText;
116
- };
71
+ if (renderIcon) {
72
+ const activeIcon = renderIcon({
73
+ route,
74
+ focused: true,
75
+ color: activeColor
76
+ });
77
+ const inactiveIcon = renderIcon({
78
+ route,
79
+ focused: false,
80
+ color: inactiveColor
81
+ });
117
82
 
118
- if (renderLabel) {
119
- const activeLabel = renderLabel({
120
- route,
121
- focused: true,
122
- color: activeColor
123
- });
124
- const inactiveLabel = renderLabel({
125
- route,
126
- focused: false,
127
- color: inactiveColor
128
- });
129
- label = /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Animated.View, {
83
+ if (inactiveIcon != null && activeIcon != null) {
84
+ icon = /*#__PURE__*/React.createElement(View, {
85
+ style: styles.icon
86
+ }, /*#__PURE__*/React.createElement(Animated.View, {
130
87
  style: {
131
88
  opacity: inactiveOpacity
132
89
  }
133
- }, inactiveLabel), /*#__PURE__*/React.createElement(Animated.View, {
90
+ }, inactiveIcon), /*#__PURE__*/React.createElement(Animated.View, {
134
91
  style: [StyleSheet.absoluteFill, {
135
92
  opacity: activeOpacity
136
93
  }]
137
- }, activeLabel));
94
+ }, activeIcon));
95
+ }
96
+ }
97
+
98
+ const renderLabel = renderLabelCustom !== undefined ? renderLabelCustom : labelProps => {
99
+ const labelText = getLabelText({
100
+ route: labelProps.route
101
+ });
102
+
103
+ if (typeof labelText === 'string') {
104
+ return /*#__PURE__*/React.createElement(Animated.Text, {
105
+ style: [styles.label, icon ? {
106
+ marginTop: 0
107
+ } : null, labelStyle, {
108
+ color: labelProps.color
109
+ }]
110
+ }, labelText);
138
111
  }
139
112
 
140
- const tabStyle = StyleSheet.flatten(style);
141
- const isWidthSet = (tabStyle === null || tabStyle === void 0 ? void 0 : tabStyle.width) !== undefined;
142
- const tabContainerStyle = isWidthSet ? null : {
143
- flex: 1
144
- };
145
- const scene = {
146
- route
147
- };
148
- let accessibilityLabel = getAccessibilityLabel(scene);
149
- accessibilityLabel = typeof accessibilityLabel !== 'undefined' ? accessibilityLabel : getLabelText(scene);
150
- const badge = renderBadge ? renderBadge(scene) : null;
151
- return /*#__PURE__*/React.createElement(PlatformPressable, {
152
- android_ripple: {
153
- borderless: true
154
- },
155
- testID: getTestID(scene),
156
- accessible: getAccessible(scene),
157
- accessibilityLabel: accessibilityLabel,
158
- accessibilityRole: "tab",
159
- accessibilityState: {
160
- selected: isFocused
161
- } // @ts-ignore: this is to support older React Native versions
162
- ,
163
- accessibilityStates: isFocused ? ['selected'] : [],
164
- pressColor: pressColor,
165
- pressOpacity: pressOpacity,
166
- delayPressIn: 0,
167
- onLayout: onLayout,
168
- onPress: onPress,
169
- onLongPress: onLongPress,
170
- style: [styles.pressable, tabContainerStyle]
171
- }, /*#__PURE__*/React.createElement(View, {
172
- pointerEvents: "none",
173
- style: [styles.item, tabStyle]
174
- }, icon, label, badge != null ? /*#__PURE__*/React.createElement(View, {
175
- style: styles.badge
176
- }, badge) : null));
113
+ return labelText;
114
+ };
115
+
116
+ if (renderLabel) {
117
+ const activeLabel = renderLabel({
118
+ route,
119
+ focused: true,
120
+ color: activeColor
121
+ });
122
+ const inactiveLabel = renderLabel({
123
+ route,
124
+ focused: false,
125
+ color: inactiveColor
126
+ });
127
+ label = /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Animated.View, {
128
+ style: {
129
+ opacity: inactiveOpacity
130
+ }
131
+ }, inactiveLabel), /*#__PURE__*/React.createElement(Animated.View, {
132
+ style: [StyleSheet.absoluteFill, {
133
+ opacity: activeOpacity
134
+ }]
135
+ }, activeLabel));
177
136
  }
178
137
 
138
+ const tabStyle = StyleSheet.flatten(style);
139
+ const isWidthSet = (tabStyle === null || tabStyle === void 0 ? void 0 : tabStyle.width) !== undefined;
140
+ const tabContainerStyle = isWidthSet ? null : {
141
+ width: defaultTabWidth
142
+ };
143
+ const scene = {
144
+ route
145
+ };
146
+ let accessibilityLabel = getAccessibilityLabel(scene);
147
+ accessibilityLabel = typeof accessibilityLabel !== 'undefined' ? accessibilityLabel : getLabelText(scene);
148
+ const badge = renderBadge ? renderBadge(scene) : null;
149
+ return /*#__PURE__*/React.createElement(PlatformPressable, {
150
+ android_ripple: {
151
+ borderless: true
152
+ },
153
+ testID: getTestID(scene),
154
+ accessible: getAccessible(scene),
155
+ accessibilityLabel: accessibilityLabel,
156
+ accessibilityRole: "tab",
157
+ accessibilityState: {
158
+ selected: isFocused
159
+ } // @ts-ignore: this is to support older React Native versions
160
+ ,
161
+ accessibilityStates: isFocused ? ['selected'] : [],
162
+ pressColor: pressColor,
163
+ pressOpacity: pressOpacity,
164
+ delayPressIn: 0,
165
+ onLayout: onLayout,
166
+ onPress: onPress,
167
+ onLongPress: onLongPress,
168
+ style: [styles.pressable, tabContainerStyle]
169
+ }, /*#__PURE__*/React.createElement(View, {
170
+ pointerEvents: "none",
171
+ style: [styles.item, tabStyle]
172
+ }, icon, label, badge != null ? /*#__PURE__*/React.createElement(View, {
173
+ style: styles.badge
174
+ }, badge) : null));
175
+ };
176
+
177
+ const MemoizedTabBarItemInternal = /*#__PURE__*/React.memo(TabBarItemInternal);
178
+
179
+ function TabBarItem(props) {
180
+ const {
181
+ onPress,
182
+ onLongPress,
183
+ onLayout,
184
+ navigationState,
185
+ route,
186
+ ...rest
187
+ } = props;
188
+ const onPressLatest = useLatestCallback(onPress);
189
+ const onLongPressLatest = useLatestCallback(onLongPress);
190
+ const onLayoutLatest = useLatestCallback(onLayout ? onLayout : () => {});
191
+ const tabIndex = navigationState.routes.indexOf(route);
192
+ return /*#__PURE__*/React.createElement(MemoizedTabBarItemInternal, _extends({}, rest, {
193
+ onPress: onPressLatest,
194
+ onLayout: onLayoutLatest,
195
+ onLongPress: onLongPressLatest,
196
+ isFocused: navigationState.index === tabIndex,
197
+ route: route,
198
+ index: tabIndex,
199
+ routesLength: navigationState.routes.length
200
+ }));
179
201
  }
202
+
203
+ export default TabBarItem;
180
204
  const styles = StyleSheet.create({
181
205
  label: {
182
206
  margin: 4,
@@ -1 +1 @@
1
- {"version":3,"names":["React","Animated","StyleSheet","View","PlatformPressable","DEFAULT_ACTIVE_COLOR","DEFAULT_INACTIVE_COLOR","TabBarItem","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","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":["React","Animated","StyleSheet","View","useLatestCallback","PlatformPressable","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","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","memo","TabBarItem","props","navigationState","rest","onPressLatest","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 LayoutChangeEvent,\n StyleProp,\n StyleSheet,\n TextStyle,\n View,\n ViewStyle,\n} from 'react-native';\nimport useLatestCallback from 'use-latest-callback';\n\nimport PlatformPressable from './PlatformPressable';\nimport type { NavigationState, Route, Scene } 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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"}
@@ -2,9 +2,9 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
2
2
 
3
3
  import * as React from 'react';
4
4
  import { StyleSheet, View } from 'react-native';
5
- import TabBar from './TabBar';
6
- import SceneView from './SceneView';
7
5
  import Pager from './Pager';
6
+ import SceneView from './SceneView';
7
+ import TabBar from './TabBar';
8
8
  export default function TabView(_ref) {
9
9
  let {
10
10
  onIndexChange,
@@ -1 +1 @@
1
- {"version":3,"names":["React","StyleSheet","View","TabBar","SceneView","Pager","TabView","onIndexChange","navigationState","renderScene","initialLayout","keyboardDismissMode","lazy","lazyPreloadDistance","onSwipeStart","onSwipeEnd","renderLazyPlaceholder","renderTabBar","props","sceneContainerStyle","pagerStyle","style","swipeEnabled","tabBarPosition","animationEnabled","layout","setLayout","useState","width","height","jumpToIndex","index","handleLayout","e","nativeEvent","prevLayout","styles","pager","position","render","addEnterListener","jumpTo","sceneRendererProps","routes","map","route","i","key","loading","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
+ {"version":3,"names":["React","StyleSheet","View","Pager","SceneView","TabBar","TabView","onIndexChange","navigationState","renderScene","initialLayout","keyboardDismissMode","lazy","lazyPreloadDistance","onSwipeStart","onSwipeEnd","renderLazyPlaceholder","renderTabBar","props","sceneContainerStyle","pagerStyle","style","swipeEnabled","tabBarPosition","animationEnabled","layout","setLayout","useState","width","height","jumpToIndex","index","handleLayout","e","nativeEvent","prevLayout","styles","pager","position","render","addEnterListener","jumpTo","sceneRendererProps","routes","map","route","i","key","loading","create","flex","overflow"],"sources":["TabView.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n LayoutChangeEvent,\n StyleProp,\n StyleSheet,\n View,\n ViewStyle,\n} from 'react-native';\n\nimport Pager from './Pager';\nimport SceneView from './SceneView';\nimport TabBar from './TabBar';\nimport type {\n Layout,\n NavigationState,\n PagerProps,\n Route,\n SceneRendererProps,\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,6 +1,6 @@
1
+ export { default as SceneMap } from './SceneMap';
1
2
  export { default as TabBar } from './TabBar';
2
- export { default as TabView } from './TabView';
3
3
  export { default as TabBarIndicator } from './TabBarIndicator';
4
4
  export { default as TabBarItem } from './TabBarItem';
5
- export { default as SceneMap } from './SceneMap';
5
+ export { default as TabView } from './TabView';
6
6
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["default","TabBar","TabView","TabBarIndicator","TabBarItem","SceneMap"],"sources":["index.tsx"],"sourcesContent":["export { default as TabBar } from './TabBar';\nexport type { Props as TabBarProps } from './TabBar';\n\nexport { default as TabView } from './TabView';\nexport type { Props as TabViewProps } from './TabView';\n\nexport { default as TabBarIndicator } from './TabBarIndicator';\nexport type { Props as TabBarIndicatorProps } from './TabBarIndicator';\n\nexport { default as TabBarItem } from './TabBarItem';\nexport type { Props as TabBarItemProps } from './TabBarItem';\n\nexport { default as SceneMap } from './SceneMap';\n\nexport type { Route, NavigationState, SceneRendererProps } from './types';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,MAApB,QAAkC,UAAlC;AAGA,SAASD,OAAO,IAAIE,OAApB,QAAmC,WAAnC;AAGA,SAASF,OAAO,IAAIG,eAApB,QAA2C,mBAA3C;AAGA,SAASH,OAAO,IAAII,UAApB,QAAsC,cAAtC;AAGA,SAASJ,OAAO,IAAIK,QAApB,QAAoC,YAApC"}
1
+ {"version":3,"names":["default","SceneMap","TabBar","TabBarIndicator","TabBarItem","TabView"],"sources":["index.tsx"],"sourcesContent":["export { default as SceneMap } from './SceneMap';\nexport type { Props as TabBarProps } from './TabBar';\nexport { default as TabBar } from './TabBar';\nexport type { Props as TabBarIndicatorProps } from './TabBarIndicator';\nexport { default as TabBarIndicator } from './TabBarIndicator';\nexport type { Props as TabBarItemProps } from './TabBarItem';\nexport { default as TabBarItem } from './TabBarItem';\nexport type { Props as TabViewProps } from './TabView';\nexport { default as TabView } from './TabView';\nexport type { NavigationState, Route, SceneRendererProps } from './types';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,QAApB,QAAoC,YAApC;AAEA,SAASD,OAAO,IAAIE,MAApB,QAAkC,UAAlC;AAEA,SAASF,OAAO,IAAIG,eAApB,QAA2C,mBAA3C;AAEA,SAASH,OAAO,IAAII,UAApB,QAAsC,cAAtC;AAEA,SAASJ,OAAO,IAAIK,OAApB,QAAmC,WAAnC"}
File without changes
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { Animated } from 'react-native';
3
- import type { NavigationState, Route, EventEmitterProps, PagerProps } from './types';
3
+ import type { EventEmitterProps, NavigationState, PagerProps, Route } from './types';
4
4
  declare type Props<T extends Route> = PagerProps & {
5
5
  onIndexChange: (index: number) => void;
6
6
  navigationState: NavigationState<T>;
@@ -1,6 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { Animated } from 'react-native';
3
- import type { NavigationState, Route, Layout, EventEmitterProps, PagerProps } from './types';
3
+ import type { EventEmitterProps, Layout, NavigationState, PagerProps, Route } from './types';
4
4
  declare type Props<T extends Route> = PagerProps & {
5
5
  layout: Layout;
6
6
  onIndexChange: (index: number) => void;
@@ -1,7 +1,9 @@
1
1
  import * as React from 'react';
2
2
  import type { SceneRendererProps } from './types';
3
+ declare type SceneProps = {
4
+ route: any;
5
+ } & Omit<SceneRendererProps, 'layout'>;
3
6
  export default function SceneMap<T extends any>(scenes: {
4
7
  [key: string]: React.ComponentType<T>;
5
- }): ({ route, jumpTo, position }: SceneRendererProps & {
6
- route: any;
7
- }) => JSX.Element;
8
+ }): ({ route, jumpTo, position }: SceneProps) => JSX.Element;
9
+ export {};
@@ -0,0 +1,15 @@
1
+ import * as React from 'react';
2
+ import { StyleProp, ViewStyle } from 'react-native';
3
+ import type { EventEmitterProps, NavigationState, Route, SceneRendererProps } from './types';
4
+ declare type Props<T extends Route> = SceneRendererProps & EventEmitterProps & {
5
+ navigationState: NavigationState<T>;
6
+ lazy: boolean;
7
+ lazyPreloadDistance: number;
8
+ index: number;
9
+ children: (props: {
10
+ loading: boolean;
11
+ }) => React.ReactNode;
12
+ style?: StyleProp<ViewStyle>;
13
+ };
14
+ export default function SceneView<T extends Route>({ children, navigationState, lazy, layout, index, lazyPreloadDistance, addEnterListener, style, }: Props<T>): JSX.Element;
15
+ export {};
@@ -0,0 +1,42 @@
1
+ import * as React from 'react';
2
+ import { StyleProp, TextStyle, ViewStyle } from 'react-native';
3
+ import { Props as IndicatorProps } from './TabBarIndicator';
4
+ import { Props as TabBarItemProps } from './TabBarItem';
5
+ import type { Event, NavigationState, Route, Scene, SceneRendererProps } from './types';
6
+ export declare type Props<T extends Route> = SceneRendererProps & {
7
+ navigationState: NavigationState<T>;
8
+ scrollEnabled?: boolean;
9
+ bounces?: boolean;
10
+ activeColor?: string;
11
+ inactiveColor?: string;
12
+ pressColor?: string;
13
+ pressOpacity?: number;
14
+ getLabelText?: (scene: Scene<T>) => string | undefined;
15
+ getAccessible?: (scene: Scene<T>) => boolean | undefined;
16
+ getAccessibilityLabel?: (scene: Scene<T>) => string | undefined;
17
+ getTestID?: (scene: Scene<T>) => string | undefined;
18
+ renderLabel?: (scene: Scene<T> & {
19
+ focused: boolean;
20
+ color: string;
21
+ }) => React.ReactNode;
22
+ renderIcon?: (scene: Scene<T> & {
23
+ focused: boolean;
24
+ color: string;
25
+ }) => React.ReactNode;
26
+ renderBadge?: (scene: Scene<T>) => React.ReactNode;
27
+ renderIndicator?: (props: IndicatorProps<T>) => React.ReactNode;
28
+ renderTabBarItem?: (props: TabBarItemProps<T> & {
29
+ key: string;
30
+ }) => React.ReactElement;
31
+ onTabPress?: (scene: Scene<T> & Event) => void;
32
+ onTabLongPress?: (scene: Scene<T>) => void;
33
+ tabStyle?: StyleProp<ViewStyle>;
34
+ indicatorStyle?: StyleProp<ViewStyle>;
35
+ indicatorContainerStyle?: StyleProp<ViewStyle>;
36
+ labelStyle?: StyleProp<TextStyle>;
37
+ contentContainerStyle?: StyleProp<ViewStyle>;
38
+ style?: StyleProp<ViewStyle>;
39
+ gap?: number;
40
+ testID?: string;
41
+ };
42
+ export default function TabBar<T extends Route>({ getLabelText, getAccessible, getAccessibilityLabel, getTestID, renderIndicator, gap, scrollEnabled, jumpTo, navigationState, position, activeColor, bounces, contentContainerStyle, inactiveColor, indicatorContainerStyle, indicatorStyle, labelStyle, onTabLongPress, onTabPress, pressColor, pressOpacity, renderBadge, renderIcon, renderLabel, renderTabBarItem, style, tabStyle, testID, }: Props<T>): JSX.Element;
@@ -0,0 +1,12 @@
1
+ /// <reference types="react" />
2
+ import { StyleProp, ViewStyle } from 'react-native';
3
+ import type { NavigationState, Route, SceneRendererProps } from './types';
4
+ export declare type GetTabWidth = (index: number) => number;
5
+ export declare type Props<T extends Route> = SceneRendererProps & {
6
+ navigationState: NavigationState<T>;
7
+ width: string | number;
8
+ style?: StyleProp<ViewStyle>;
9
+ getTabWidth: GetTabWidth;
10
+ gap?: number;
11
+ };
12
+ export default function TabBarIndicator<T extends Route>({ getTabWidth, layout, navigationState, position, width, gap, style, }: Props<T>): JSX.Element;