@react-navigation/bottom-tabs 7.0.0-alpha.2 → 7.0.0-alpha.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/TransitionConfigs/SceneStyleInterpolators.js +47 -0
- package/lib/commonjs/TransitionConfigs/SceneStyleInterpolators.js.map +1 -0
- package/lib/commonjs/TransitionConfigs/TransitionPresets.js +19 -0
- package/lib/commonjs/TransitionConfigs/TransitionPresets.js.map +1 -0
- package/lib/commonjs/TransitionConfigs/TransitionSpecs.js +24 -0
- package/lib/commonjs/TransitionConfigs/TransitionSpecs.js.map +1 -0
- package/lib/commonjs/index.js +9 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/utils/useAnimatedHashMap.js +31 -0
- package/lib/commonjs/utils/useAnimatedHashMap.js.map +1 -0
- package/lib/commonjs/views/BottomTabBar.js +53 -13
- package/lib/commonjs/views/BottomTabBar.js.map +1 -1
- package/lib/commonjs/views/BottomTabItem.js +21 -27
- package/lib/commonjs/views/BottomTabItem.js.map +1 -1
- package/lib/commonjs/views/BottomTabView.js +89 -8
- package/lib/commonjs/views/BottomTabView.js.map +1 -1
- package/lib/commonjs/views/ScreenFallback.js +6 -8
- package/lib/commonjs/views/ScreenFallback.js.map +1 -1
- package/lib/commonjs/views/TabBarIcon.js +12 -17
- package/lib/commonjs/views/TabBarIcon.js.map +1 -1
- package/lib/module/TransitionConfigs/SceneStyleInterpolators.js +40 -0
- package/lib/module/TransitionConfigs/SceneStyleInterpolators.js.map +1 -0
- package/lib/module/TransitionConfigs/TransitionPresets.js +11 -0
- package/lib/module/TransitionConfigs/TransitionPresets.js.map +1 -0
- package/lib/module/TransitionConfigs/TransitionSpecs.js +16 -0
- package/lib/module/TransitionConfigs/TransitionSpecs.js.map +1 -0
- package/lib/module/index.js +9 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/utils/useAnimatedHashMap.js +23 -0
- package/lib/module/utils/useAnimatedHashMap.js.map +1 -0
- package/lib/module/views/BottomTabBar.js +55 -15
- package/lib/module/views/BottomTabBar.js.map +1 -1
- package/lib/module/views/BottomTabItem.js +22 -28
- package/lib/module/views/BottomTabItem.js.map +1 -1
- package/lib/module/views/BottomTabView.js +90 -9
- package/lib/module/views/BottomTabView.js.map +1 -1
- package/lib/module/views/ScreenFallback.js +6 -8
- package/lib/module/views/ScreenFallback.js.map +1 -1
- package/lib/module/views/TabBarIcon.js +12 -17
- package/lib/module/views/TabBarIcon.js.map +1 -1
- package/lib/typescript/src/TransitionConfigs/SceneStyleInterpolators.d.ts +10 -0
- package/lib/typescript/src/TransitionConfigs/SceneStyleInterpolators.d.ts.map +1 -0
- package/lib/typescript/src/TransitionConfigs/TransitionPresets.d.ts +4 -0
- package/lib/typescript/src/TransitionConfigs/TransitionPresets.d.ts.map +1 -0
- package/lib/typescript/src/TransitionConfigs/TransitionSpecs.d.ts +4 -0
- package/lib/typescript/src/TransitionConfigs/TransitionSpecs.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +7 -0
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/types.d.ts +54 -0
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/lib/typescript/src/utils/useAnimatedHashMap.d.ts +4 -0
- package/lib/typescript/src/utils/useAnimatedHashMap.d.ts.map +1 -0
- package/lib/typescript/src/views/BottomTabBar.d.ts +1 -1
- package/lib/typescript/src/views/BottomTabBar.d.ts.map +1 -1
- package/lib/typescript/src/views/BottomTabItem.d.ts.map +1 -1
- package/lib/typescript/src/views/BottomTabView.d.ts.map +1 -1
- package/lib/typescript/src/views/ScreenFallback.d.ts +4 -4
- package/lib/typescript/src/views/ScreenFallback.d.ts.map +1 -1
- package/lib/typescript/src/views/TabBarIcon.d.ts.map +1 -1
- package/package.json +5 -5
- package/src/TransitionConfigs/SceneStyleInterpolators.tsx +44 -0
- package/src/TransitionConfigs/TransitionPresets.tsx +13 -0
- package/src/TransitionConfigs/TransitionSpecs.tsx +19 -0
- package/src/index.tsx +9 -0
- package/src/types.tsx +75 -0
- package/src/utils/useAnimatedHashMap.tsx +25 -0
- package/src/views/BottomTabBar.tsx +109 -34
- package/src/views/BottomTabItem.tsx +31 -37
- package/src/views/BottomTabView.tsx +115 -10
- package/src/views/ScreenFallback.tsx +6 -13
- package/src/views/TabBarIcon.tsx +13 -21
|
@@ -154,6 +154,10 @@ export type BottomTabNavigationOptions = HeaderOptions & {
|
|
|
154
154
|
* You'd also need to use `useBottomTabBarHeight()` to add a bottom padding to your content.
|
|
155
155
|
*/
|
|
156
156
|
tabBarBackground?: () => React.ReactNode;
|
|
157
|
+
/**
|
|
158
|
+
* Position of the tab bar on the screen. Defaults to `bottom`.
|
|
159
|
+
*/
|
|
160
|
+
tabBarPosition?: 'bottom' | 'left' | 'right';
|
|
157
161
|
/**
|
|
158
162
|
* Whether this screens should render the first time it's accessed. Defaults to `true`.
|
|
159
163
|
* Set it to `false` if you want to render the screen on initial render.
|
|
@@ -181,9 +185,59 @@ export type BottomTabNavigationOptions = HeaderOptions & {
|
|
|
181
185
|
* Only supported on iOS and Android.
|
|
182
186
|
*/
|
|
183
187
|
freezeOnBlur?: boolean;
|
|
188
|
+
/**
|
|
189
|
+
* Whether transition animations should be enabled when switching tabs.
|
|
190
|
+
* Defaults to `false`.
|
|
191
|
+
*/
|
|
192
|
+
animationEnabled?: boolean;
|
|
193
|
+
/**
|
|
194
|
+
* Function which specifies interpolated styles for bottom-tab scenes.
|
|
195
|
+
*/
|
|
196
|
+
sceneStyleInterpolator?: BottomTabSceneStyleInterpolator;
|
|
197
|
+
/**
|
|
198
|
+
* Object which specifies the animation type (timing or spring) and their options (such as duration for timing).
|
|
199
|
+
*/
|
|
200
|
+
transitionSpec?: TransitionSpec;
|
|
184
201
|
};
|
|
185
202
|
export type BottomTabDescriptor = Descriptor<BottomTabNavigationOptions, BottomTabNavigationProp<ParamListBase>, RouteProp<ParamListBase>>;
|
|
186
203
|
export type BottomTabDescriptorMap = Record<string, BottomTabDescriptor>;
|
|
204
|
+
export type BottomTabSceneInterpolationProps = {
|
|
205
|
+
/**
|
|
206
|
+
* Animated value for the current screen:
|
|
207
|
+
* - -1 if the index is lower than active tab,
|
|
208
|
+
* - 0 if they're active,
|
|
209
|
+
* - 1 if the index is higher than active tab
|
|
210
|
+
*/
|
|
211
|
+
current: Animated.Value;
|
|
212
|
+
};
|
|
213
|
+
export type BottomTabSceneInterpolatedStyle = {
|
|
214
|
+
/**
|
|
215
|
+
* Interpolated style for the view representing the scene containing screen content.
|
|
216
|
+
*/
|
|
217
|
+
sceneStyle: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
|
|
218
|
+
};
|
|
219
|
+
export type BottomTabSceneStyleInterpolator = (props: BottomTabSceneInterpolationProps) => BottomTabSceneInterpolatedStyle;
|
|
220
|
+
export type TransitionSpec = {
|
|
221
|
+
animation: 'timing';
|
|
222
|
+
config: Omit<Animated.TimingAnimationConfig, 'toValue' | keyof Animated.AnimationConfig>;
|
|
223
|
+
} | {
|
|
224
|
+
animation: 'spring';
|
|
225
|
+
config: Omit<Animated.SpringAnimationConfig, 'toValue' | keyof Animated.AnimationConfig>;
|
|
226
|
+
};
|
|
227
|
+
export type BottomTabTransitionPreset = {
|
|
228
|
+
/**
|
|
229
|
+
* Whether transition animations should be enabled when switching tabs.
|
|
230
|
+
*/
|
|
231
|
+
animationEnabled?: boolean;
|
|
232
|
+
/**
|
|
233
|
+
* Function which specifies interpolated styles for bottom-tab scenes.
|
|
234
|
+
*/
|
|
235
|
+
sceneStyleInterpolator?: BottomTabSceneStyleInterpolator;
|
|
236
|
+
/**
|
|
237
|
+
* Object which specifies the animation type (timing or spring) and their options (such as duration for timing).
|
|
238
|
+
*/
|
|
239
|
+
transitionSpec?: TransitionSpec;
|
|
240
|
+
};
|
|
187
241
|
export type BottomTabNavigationConfig = {
|
|
188
242
|
/**
|
|
189
243
|
* Function that returns a React element to display as the tab bar.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAnimatedHashMap.d.ts","sourceRoot":"","sources":["../../../../src/utils/useAnimatedHashMap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjE,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,wBAAgB,kBAAkB,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,eAAe,kCAoBpE"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ParamListBase, TabNavigationState } from '@react-navigation/native';
|
|
2
2
|
import { Animated, StyleProp, ViewStyle } from 'react-native';
|
|
3
|
-
import { EdgeInsets } from 'react-native-safe-area-context';
|
|
3
|
+
import type { EdgeInsets } from 'react-native-safe-area-context';
|
|
4
4
|
import type { BottomTabBarProps, BottomTabDescriptorMap } from '../types';
|
|
5
5
|
type Props = BottomTabBarProps & {
|
|
6
6
|
style?: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomTabBar.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabBar.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BottomTabBar.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabBar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAIL,aAAa,EACb,kBAAkB,EAGnB,MAAM,0BAA0B,CAAC;AAGlC,OAAO,EACL,QAAQ,EAGR,SAAS,EAIT,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAEjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAK1E,KAAK,KAAK,GAAG,iBAAiB,GAAG;IAC/B,KAAK,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;CAC1D,CAAC;AASF,KAAK,OAAO,GAAG;IACb,KAAK,EAAE,kBAAkB,CAAC,aAAa,CAAC,CAAC;IACzC,WAAW,EAAE,sBAAsB,CAAC;IACpC,MAAM,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,UAAU,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CAC/C,CAAC;AA8CF,eAAO,MAAM,eAAe;YAQlB,UAAU;WACX,SAAS,iBAAiB,CAAC,UAAU,SAAS,CAAC,CAAC,GAAG,SAAS;YA4BpE,CAAC;AAEF,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,UAAU,EACV,WAAW,EACX,MAAM,EACN,KAAK,GACN,EAAE,KAAK,eA+RP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomTabItem.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabItem.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BottomTabItem.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabItem.tsx"],"names":[],"mappings":"AACA,OAAO,EAAuB,KAAK,EAAY,MAAM,0BAA0B,CAAC;AAEhF,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,qBAAqB,EAGrB,SAAS,EAET,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EACV,uBAAuB,EACvB,mBAAmB,EACnB,aAAa,EACd,MAAM,UAAU,CAAC;AAGlB,KAAK,KAAK,GAAG;IACX;;OAEG;IACH,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,UAAU,EAAE,mBAAmB,CAAC;IAChC;;OAEG;IACH,KAAK,EACD,MAAM,GACN,CAAC,CAAC,KAAK,EAAE;QACP,OAAO,EAAE,OAAO,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,aAAa,CAAC;QACxB,QAAQ,EAAE,MAAM,CAAC;KAClB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;IAC3B;;OAEG;IACH,IAAI,EAAE,CAAC,KAAK,EAAE;QACZ,OAAO,EAAE,OAAO,CAAC;QACjB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;KACf,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,KAAK,CAAC,SAAS,CAAC;IAC7D;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,OAAO,EAAE,CACP,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,GAAG,qBAAqB,KACjE,IAAI,CAAC;IACV;;OAEG;IACH,WAAW,EAAE,CAAC,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAChD;;OAEG;IACH,UAAU,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACjC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,IAAI,EACJ,OAAO,EACP,UAAU,EACV,KAAK,EACL,IAAI,EACJ,KAAK,EACL,UAAU,EACV,MA0CC,EACD,kBAAkB,EAClB,MAAM,EACN,OAAO,EACP,WAAW,EACX,UAAU,EACV,eAAe,EAAE,qBAAqB,EACtC,iBAAiB,EAAE,uBAAuB,EAC1C,qBAAqC,EACrC,uBAAuC,EACvC,SAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,SAAS,EACT,KAAK,GACN,EAAE,KAAK,sEA4GP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomTabView.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabView.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,aAAa,EACb,kBAAkB,EACnB,MAAM,0BAA0B,CAAC;AAKlC,OAAO,KAAK,EAEV,sBAAsB,EAEtB,yBAAyB,EACzB,0BAA0B,
|
|
1
|
+
{"version":3,"file":"BottomTabView.d.ts","sourceRoot":"","sources":["../../../../src/views/BottomTabView.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,aAAa,EACb,kBAAkB,EACnB,MAAM,0BAA0B,CAAC;AAKlC,OAAO,KAAK,EAEV,sBAAsB,EAEtB,yBAAyB,EACzB,0BAA0B,EAG3B,MAAM,UAAU,CAAC;AAQlB,KAAK,KAAK,GAAG,yBAAyB,GAAG;IACvC,KAAK,EAAE,kBAAkB,CAAC,aAAa,CAAC,CAAC;IACzC,UAAU,EAAE,0BAA0B,CAAC;IACvC,WAAW,EAAE,sBAAsB,CAAC;CACrC,CAAC;AAiBF,wBAAgB,aAAa,CAAC,KAAK,EAAE,KAAK,eAkNzC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { StyleProp, ViewProps, ViewStyle } from 'react-native';
|
|
2
|
+
import { Animated, StyleProp, ViewProps, ViewStyle } from 'react-native';
|
|
3
3
|
type Props = {
|
|
4
|
-
visible: boolean;
|
|
5
|
-
children: React.ReactNode;
|
|
6
4
|
enabled: boolean;
|
|
5
|
+
active: 0 | 1 | 2 | Animated.AnimatedInterpolation<0 | 1>;
|
|
6
|
+
children: React.ReactNode;
|
|
7
7
|
freezeOnBlur?: boolean;
|
|
8
8
|
style?: StyleProp<ViewStyle>;
|
|
9
9
|
};
|
|
@@ -12,6 +12,6 @@ export declare const MaybeScreenContainer: ({ enabled, ...rest }: ViewProps & {
|
|
|
12
12
|
hasTwoStates: boolean;
|
|
13
13
|
children: React.ReactNode;
|
|
14
14
|
}) => JSX.Element;
|
|
15
|
-
export declare function MaybeScreen({
|
|
15
|
+
export declare function MaybeScreen({ enabled, active, ...rest }: ViewProps & Props): JSX.Element;
|
|
16
16
|
export {};
|
|
17
17
|
//# sourceMappingURL=ScreenFallback.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScreenFallback.d.ts","sourceRoot":"","sources":["../../../../src/views/ScreenFallback.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ScreenFallback.d.ts","sourceRoot":"","sources":["../../../../src/views/ScreenFallback.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAQ,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE/E,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,qBAAqB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IAC1D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC;AAUF,eAAO,MAAM,oBAAoB;aAItB,OAAO;kBACF,OAAO;cACX,MAAM,SAAS;iBAO1B,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,GAAG,KAAK,eAQ1E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBarIcon.d.ts","sourceRoot":"","sources":["../../../../src/views/TabBarIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,SAAS,EAET,SAAS,EAET,SAAS,EACV,MAAM,cAAc,CAAC;AAItB,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE,CAAC,KAAK,EAAE;QAClB,OAAO,EAAE,OAAO,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC7B,CAAC;
|
|
1
|
+
{"version":3,"file":"TabBarIcon.d.ts","sourceRoot":"","sources":["../../../../src/views/TabBarIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,SAAS,EAET,SAAS,EAET,SAAS,EACV,MAAM,cAAc,CAAC;AAItB,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;IACxB,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,UAAU,EAAE,CAAC,KAAK,EAAE;QAClB,OAAO,EAAE,OAAO,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC7B,CAAC;AAIF,wBAAgB,UAAU,CAAC,EACzB,KAAQ,EACR,UAAU,EACV,KAAK,EACL,UAAU,EACV,aAAa,EACb,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,UAAU,EACV,KAAK,GACN,EAAE,KAAK,eA8BP"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-navigation/bottom-tabs",
|
|
3
3
|
"description": "Bottom tab navigator following iOS design guidelines",
|
|
4
|
-
"version": "7.0.0-alpha.
|
|
4
|
+
"version": "7.0.0-alpha.4",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react-native-component",
|
|
7
7
|
"react-component",
|
|
@@ -36,11 +36,11 @@
|
|
|
36
36
|
"clean": "del lib"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@react-navigation/elements": "^
|
|
39
|
+
"@react-navigation/elements": "^2.0.0-alpha.1",
|
|
40
40
|
"color": "^4.2.3"
|
|
41
41
|
},
|
|
42
42
|
"devDependencies": {
|
|
43
|
-
"@react-navigation/native": "^7.0.0-alpha.
|
|
43
|
+
"@react-navigation/native": "^7.0.0-alpha.3",
|
|
44
44
|
"@testing-library/react-native": "^11.5.0",
|
|
45
45
|
"@types/color": "^3.0.3",
|
|
46
46
|
"@types/react": "~18.0.27",
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"del-cli": "^5.0.0",
|
|
49
49
|
"react": "18.2.0",
|
|
50
50
|
"react-native": "0.71.8",
|
|
51
|
-
"react-native-builder-bob": "^0.
|
|
51
|
+
"react-native-builder-bob": "^0.21.0",
|
|
52
52
|
"react-native-safe-area-context": "4.5.0",
|
|
53
53
|
"react-native-screens": "~3.20.0",
|
|
54
54
|
"typescript": "^4.9.4"
|
|
@@ -74,5 +74,5 @@
|
|
|
74
74
|
]
|
|
75
75
|
]
|
|
76
76
|
},
|
|
77
|
-
"gitHead": "
|
|
77
|
+
"gitHead": "17d212fd04d2c8d000f9fc38ae7ab9e888a0111d"
|
|
78
78
|
}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import type {
|
|
2
|
+
BottomTabSceneInterpolatedStyle,
|
|
3
|
+
BottomTabSceneInterpolationProps,
|
|
4
|
+
} from '../types';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Simple cross fade animation
|
|
8
|
+
*/
|
|
9
|
+
export function forCrossFade({
|
|
10
|
+
current,
|
|
11
|
+
}: BottomTabSceneInterpolationProps): BottomTabSceneInterpolatedStyle {
|
|
12
|
+
return {
|
|
13
|
+
sceneStyle: {
|
|
14
|
+
opacity: current.interpolate({
|
|
15
|
+
inputRange: [-1, 0, 1],
|
|
16
|
+
outputRange: [0, 1, 0],
|
|
17
|
+
}),
|
|
18
|
+
},
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Animation where the screens slightly shift to left/right
|
|
24
|
+
*/
|
|
25
|
+
export function forShifting({
|
|
26
|
+
current,
|
|
27
|
+
}: BottomTabSceneInterpolationProps): BottomTabSceneInterpolatedStyle {
|
|
28
|
+
return {
|
|
29
|
+
sceneStyle: {
|
|
30
|
+
opacity: current.interpolate({
|
|
31
|
+
inputRange: [-1, 0, 1],
|
|
32
|
+
outputRange: [0, 1, 0],
|
|
33
|
+
}),
|
|
34
|
+
transform: [
|
|
35
|
+
{
|
|
36
|
+
translateX: current.interpolate({
|
|
37
|
+
inputRange: [-1, 0, 1],
|
|
38
|
+
outputRange: [-50, 1, 50],
|
|
39
|
+
}),
|
|
40
|
+
},
|
|
41
|
+
],
|
|
42
|
+
},
|
|
43
|
+
};
|
|
44
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { BottomTabTransitionPreset } from '../types';
|
|
2
|
+
import { forCrossFade, forShifting } from './SceneStyleInterpolators';
|
|
3
|
+
import { CrossFadeSpec, ShiftingSpec } from './TransitionSpecs';
|
|
4
|
+
|
|
5
|
+
export const FadeTransition: BottomTabTransitionPreset = {
|
|
6
|
+
transitionSpec: CrossFadeSpec,
|
|
7
|
+
sceneStyleInterpolator: forCrossFade,
|
|
8
|
+
};
|
|
9
|
+
|
|
10
|
+
export const ShiftingTransition: BottomTabTransitionPreset = {
|
|
11
|
+
transitionSpec: ShiftingSpec,
|
|
12
|
+
sceneStyleInterpolator: forShifting,
|
|
13
|
+
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { Easing } from 'react-native';
|
|
2
|
+
|
|
3
|
+
import type { TransitionSpec } from '../types';
|
|
4
|
+
|
|
5
|
+
export const CrossFadeSpec: TransitionSpec = {
|
|
6
|
+
animation: 'timing',
|
|
7
|
+
config: {
|
|
8
|
+
duration: 150,
|
|
9
|
+
easing: Easing.in(Easing.linear),
|
|
10
|
+
},
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
export const ShiftingSpec: TransitionSpec = {
|
|
14
|
+
animation: 'timing',
|
|
15
|
+
config: {
|
|
16
|
+
duration: 150,
|
|
17
|
+
easing: Easing.inOut(Easing.ease),
|
|
18
|
+
},
|
|
19
|
+
};
|
package/src/index.tsx
CHANGED
|
@@ -1,3 +1,12 @@
|
|
|
1
|
+
import * as SceneStyleInterpolator from './TransitionConfigs/SceneStyleInterpolators';
|
|
2
|
+
import * as TransitionPresets from './TransitionConfigs/TransitionPresets';
|
|
3
|
+
import * as TransitionSpecs from './TransitionConfigs/TransitionSpecs';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Transition Presets
|
|
7
|
+
*/
|
|
8
|
+
export { SceneStyleInterpolator, TransitionPresets, TransitionSpecs };
|
|
9
|
+
|
|
1
10
|
/**
|
|
2
11
|
* Navigators
|
|
3
12
|
*/
|
package/src/types.tsx
CHANGED
|
@@ -223,6 +223,11 @@ export type BottomTabNavigationOptions = HeaderOptions & {
|
|
|
223
223
|
*/
|
|
224
224
|
tabBarBackground?: () => React.ReactNode;
|
|
225
225
|
|
|
226
|
+
/**
|
|
227
|
+
* Position of the tab bar on the screen. Defaults to `bottom`.
|
|
228
|
+
*/
|
|
229
|
+
tabBarPosition?: 'bottom' | 'left' | 'right';
|
|
230
|
+
|
|
226
231
|
/**
|
|
227
232
|
* Whether this screens should render the first time it's accessed. Defaults to `true`.
|
|
228
233
|
* Set it to `false` if you want to render the screen on initial render.
|
|
@@ -254,6 +259,22 @@ export type BottomTabNavigationOptions = HeaderOptions & {
|
|
|
254
259
|
* Only supported on iOS and Android.
|
|
255
260
|
*/
|
|
256
261
|
freezeOnBlur?: boolean;
|
|
262
|
+
|
|
263
|
+
/**
|
|
264
|
+
* Whether transition animations should be enabled when switching tabs.
|
|
265
|
+
* Defaults to `false`.
|
|
266
|
+
*/
|
|
267
|
+
animationEnabled?: boolean;
|
|
268
|
+
|
|
269
|
+
/**
|
|
270
|
+
* Function which specifies interpolated styles for bottom-tab scenes.
|
|
271
|
+
*/
|
|
272
|
+
sceneStyleInterpolator?: BottomTabSceneStyleInterpolator;
|
|
273
|
+
|
|
274
|
+
/**
|
|
275
|
+
* Object which specifies the animation type (timing or spring) and their options (such as duration for timing).
|
|
276
|
+
*/
|
|
277
|
+
transitionSpec?: TransitionSpec;
|
|
257
278
|
};
|
|
258
279
|
|
|
259
280
|
export type BottomTabDescriptor = Descriptor<
|
|
@@ -264,6 +285,60 @@ export type BottomTabDescriptor = Descriptor<
|
|
|
264
285
|
|
|
265
286
|
export type BottomTabDescriptorMap = Record<string, BottomTabDescriptor>;
|
|
266
287
|
|
|
288
|
+
export type BottomTabSceneInterpolationProps = {
|
|
289
|
+
/**
|
|
290
|
+
* Animated value for the current screen:
|
|
291
|
+
* - -1 if the index is lower than active tab,
|
|
292
|
+
* - 0 if they're active,
|
|
293
|
+
* - 1 if the index is higher than active tab
|
|
294
|
+
*/
|
|
295
|
+
current: Animated.Value;
|
|
296
|
+
};
|
|
297
|
+
|
|
298
|
+
export type BottomTabSceneInterpolatedStyle = {
|
|
299
|
+
/**
|
|
300
|
+
* Interpolated style for the view representing the scene containing screen content.
|
|
301
|
+
*/
|
|
302
|
+
sceneStyle: Animated.WithAnimatedValue<StyleProp<ViewStyle>>;
|
|
303
|
+
};
|
|
304
|
+
|
|
305
|
+
export type BottomTabSceneStyleInterpolator = (
|
|
306
|
+
props: BottomTabSceneInterpolationProps
|
|
307
|
+
) => BottomTabSceneInterpolatedStyle;
|
|
308
|
+
|
|
309
|
+
export type TransitionSpec =
|
|
310
|
+
| {
|
|
311
|
+
animation: 'timing';
|
|
312
|
+
config: Omit<
|
|
313
|
+
Animated.TimingAnimationConfig,
|
|
314
|
+
'toValue' | keyof Animated.AnimationConfig
|
|
315
|
+
>;
|
|
316
|
+
}
|
|
317
|
+
| {
|
|
318
|
+
animation: 'spring';
|
|
319
|
+
config: Omit<
|
|
320
|
+
Animated.SpringAnimationConfig,
|
|
321
|
+
'toValue' | keyof Animated.AnimationConfig
|
|
322
|
+
>;
|
|
323
|
+
};
|
|
324
|
+
|
|
325
|
+
export type BottomTabTransitionPreset = {
|
|
326
|
+
/**
|
|
327
|
+
* Whether transition animations should be enabled when switching tabs.
|
|
328
|
+
*/
|
|
329
|
+
animationEnabled?: boolean;
|
|
330
|
+
|
|
331
|
+
/**
|
|
332
|
+
* Function which specifies interpolated styles for bottom-tab scenes.
|
|
333
|
+
*/
|
|
334
|
+
sceneStyleInterpolator?: BottomTabSceneStyleInterpolator;
|
|
335
|
+
|
|
336
|
+
/**
|
|
337
|
+
* Object which specifies the animation type (timing or spring) and their options (such as duration for timing).
|
|
338
|
+
*/
|
|
339
|
+
transitionSpec?: TransitionSpec;
|
|
340
|
+
};
|
|
341
|
+
|
|
267
342
|
export type BottomTabNavigationConfig = {
|
|
268
343
|
/**
|
|
269
344
|
* Function that returns a React element to display as the tab bar.
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { NavigationState } from '@react-navigation/routers';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { Animated } from 'react-native';
|
|
4
|
+
|
|
5
|
+
export function useAnimatedHashMap({ routes, index }: NavigationState) {
|
|
6
|
+
const refs = React.useRef<Record<string, Animated.Value>>({});
|
|
7
|
+
const previous = refs.current;
|
|
8
|
+
const routeKeys = Object.keys(previous);
|
|
9
|
+
|
|
10
|
+
if (
|
|
11
|
+
routes.length === routeKeys.length &&
|
|
12
|
+
routes.every((route) => routeKeys.includes(route.key))
|
|
13
|
+
) {
|
|
14
|
+
return previous;
|
|
15
|
+
}
|
|
16
|
+
refs.current = {};
|
|
17
|
+
|
|
18
|
+
routes.forEach(({ key }, i) => {
|
|
19
|
+
refs.current[key] =
|
|
20
|
+
previous[key] ??
|
|
21
|
+
new Animated.Value(i === index ? 0 : i >= index ? 1 : -1);
|
|
22
|
+
});
|
|
23
|
+
|
|
24
|
+
return refs.current;
|
|
25
|
+
}
|
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
getDefaultSidebarWidth,
|
|
3
|
+
getLabel,
|
|
4
|
+
MissingIcon,
|
|
5
|
+
} from '@react-navigation/elements';
|
|
2
6
|
import {
|
|
3
7
|
CommonActions,
|
|
4
8
|
NavigationContext,
|
|
@@ -8,6 +12,7 @@ import {
|
|
|
8
12
|
useLinkTools,
|
|
9
13
|
useTheme,
|
|
10
14
|
} from '@react-navigation/native';
|
|
15
|
+
import Color from 'color';
|
|
11
16
|
import React from 'react';
|
|
12
17
|
import {
|
|
13
18
|
Animated,
|
|
@@ -15,10 +20,11 @@ import {
|
|
|
15
20
|
Platform,
|
|
16
21
|
StyleProp,
|
|
17
22
|
StyleSheet,
|
|
23
|
+
useWindowDimensions,
|
|
18
24
|
View,
|
|
19
25
|
ViewStyle,
|
|
20
26
|
} from 'react-native';
|
|
21
|
-
import { EdgeInsets
|
|
27
|
+
import type { EdgeInsets } from 'react-native-safe-area-context';
|
|
22
28
|
|
|
23
29
|
import type { BottomTabBarProps, BottomTabDescriptorMap } from '../types';
|
|
24
30
|
import { BottomTabBarHeightCallbackContext } from '../utils/BottomTabBarHeightCallbackContext';
|
|
@@ -32,6 +38,7 @@ type Props = BottomTabBarProps & {
|
|
|
32
38
|
const DEFAULT_TABBAR_HEIGHT = 49;
|
|
33
39
|
const COMPACT_TABBAR_HEIGHT = 32;
|
|
34
40
|
const DEFAULT_MAX_TAB_ITEM_WIDTH = 125;
|
|
41
|
+
const SPACING = 5;
|
|
35
42
|
|
|
36
43
|
const useNativeDriver = Platform.OS !== 'web';
|
|
37
44
|
|
|
@@ -140,6 +147,7 @@ export function BottomTabBar({
|
|
|
140
147
|
const focusedOptions = focusedDescriptor.options;
|
|
141
148
|
|
|
142
149
|
const {
|
|
150
|
+
tabBarPosition = 'bottom',
|
|
143
151
|
tabBarShowLabel,
|
|
144
152
|
tabBarHideOnKeyboard = false,
|
|
145
153
|
tabBarVisibilityAnimationConfig,
|
|
@@ -147,11 +155,17 @@ export function BottomTabBar({
|
|
|
147
155
|
tabBarBackground,
|
|
148
156
|
tabBarActiveTintColor,
|
|
149
157
|
tabBarInactiveTintColor,
|
|
150
|
-
tabBarActiveBackgroundColor
|
|
158
|
+
tabBarActiveBackgroundColor = tabBarPosition !== 'bottom'
|
|
159
|
+
? Color(tabBarActiveTintColor ?? colors.primary)
|
|
160
|
+
.alpha(0.12)
|
|
161
|
+
.rgb()
|
|
162
|
+
.string()
|
|
163
|
+
: undefined,
|
|
151
164
|
tabBarInactiveBackgroundColor,
|
|
152
165
|
} = focusedOptions;
|
|
153
166
|
|
|
154
|
-
|
|
167
|
+
// FIXME: useSafeAreaFrame doesn't update values when window is resized on Web
|
|
168
|
+
const dimensions = useWindowDimensions();
|
|
155
169
|
const isKeyboardShown = useIsKeyboardShown();
|
|
156
170
|
|
|
157
171
|
const onHeightChange = React.useContext(BottomTabBarHeightCallbackContext);
|
|
@@ -256,42 +270,67 @@ export function BottomTabBar({
|
|
|
256
270
|
return (
|
|
257
271
|
<Animated.View
|
|
258
272
|
style={[
|
|
259
|
-
|
|
273
|
+
tabBarPosition === 'left'
|
|
274
|
+
? styles.left
|
|
275
|
+
: tabBarPosition === 'right'
|
|
276
|
+
? styles.right
|
|
277
|
+
: styles.bottom,
|
|
260
278
|
{
|
|
261
279
|
backgroundColor:
|
|
262
280
|
tabBarBackgroundElement != null ? 'transparent' : colors.card,
|
|
263
|
-
|
|
281
|
+
borderColor: colors.border,
|
|
264
282
|
},
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
283
|
+
tabBarPosition === 'bottom'
|
|
284
|
+
? [
|
|
285
|
+
{
|
|
286
|
+
transform: [
|
|
287
|
+
{
|
|
288
|
+
translateY: visible.interpolate({
|
|
289
|
+
inputRange: [0, 1],
|
|
290
|
+
outputRange: [
|
|
291
|
+
layout.height +
|
|
292
|
+
paddingBottom +
|
|
293
|
+
StyleSheet.hairlineWidth,
|
|
294
|
+
0,
|
|
295
|
+
],
|
|
296
|
+
}),
|
|
297
|
+
},
|
|
273
298
|
],
|
|
274
|
-
|
|
299
|
+
// Absolutely position the tab bar so that the content is below it
|
|
300
|
+
// This is needed to avoid gap at bottom when the tab bar is hidden
|
|
301
|
+
position: isTabBarHidden ? 'absolute' : undefined,
|
|
302
|
+
},
|
|
303
|
+
{
|
|
304
|
+
height: tabBarHeight,
|
|
305
|
+
paddingBottom,
|
|
306
|
+
paddingHorizontal: Math.max(insets.left, insets.right),
|
|
307
|
+
},
|
|
308
|
+
]
|
|
309
|
+
: {
|
|
310
|
+
paddingTop: insets.top,
|
|
311
|
+
paddingBottom: insets.bottom,
|
|
312
|
+
paddingLeft: tabBarPosition === 'left' ? insets.left : 0,
|
|
313
|
+
paddingRight: tabBarPosition === 'right' ? insets.right : 0,
|
|
314
|
+
minWidth: hasHorizontalLabels
|
|
315
|
+
? getDefaultSidebarWidth(dimensions)
|
|
316
|
+
: 0,
|
|
275
317
|
},
|
|
276
|
-
],
|
|
277
|
-
// Absolutely position the tab bar so that the content is below it
|
|
278
|
-
// This is needed to avoid gap at bottom when the tab bar is hidden
|
|
279
|
-
position: isTabBarHidden ? 'absolute' : (null as any),
|
|
280
|
-
},
|
|
281
|
-
{
|
|
282
|
-
height: tabBarHeight,
|
|
283
|
-
paddingBottom,
|
|
284
|
-
paddingHorizontal: Math.max(insets.left, insets.right),
|
|
285
|
-
},
|
|
286
318
|
tabBarStyle,
|
|
287
319
|
]}
|
|
288
320
|
pointerEvents={isTabBarHidden ? 'none' : 'auto'}
|
|
289
|
-
onLayout={handleLayout}
|
|
321
|
+
onLayout={tabBarPosition === 'bottom' ? handleLayout : undefined}
|
|
290
322
|
>
|
|
291
323
|
<View pointerEvents="none" style={StyleSheet.absoluteFill}>
|
|
292
324
|
{tabBarBackgroundElement}
|
|
293
325
|
</View>
|
|
294
|
-
<View
|
|
326
|
+
<View
|
|
327
|
+
accessibilityRole="tablist"
|
|
328
|
+
style={
|
|
329
|
+
tabBarPosition === 'bottom'
|
|
330
|
+
? styles.bottomContent
|
|
331
|
+
: styles.sideContent
|
|
332
|
+
}
|
|
333
|
+
>
|
|
295
334
|
{routes.map((route, index) => {
|
|
296
335
|
const focused = index === state.index;
|
|
297
336
|
const { options } = descriptors[route.key];
|
|
@@ -319,11 +358,12 @@ export function BottomTabBar({
|
|
|
319
358
|
};
|
|
320
359
|
|
|
321
360
|
const label =
|
|
322
|
-
options.tabBarLabel
|
|
361
|
+
typeof options.tabBarLabel === 'function'
|
|
323
362
|
? options.tabBarLabel
|
|
324
|
-
:
|
|
325
|
-
|
|
326
|
-
|
|
363
|
+
: getLabel(
|
|
364
|
+
{ label: options.tabBarLabel, title: options.title },
|
|
365
|
+
route.name
|
|
366
|
+
);
|
|
327
367
|
|
|
328
368
|
const accessibilityLabel =
|
|
329
369
|
options.tabBarAccessibilityLabel !== undefined
|
|
@@ -366,7 +406,17 @@ export function BottomTabBar({
|
|
|
366
406
|
showLabel={tabBarShowLabel}
|
|
367
407
|
labelStyle={options.tabBarLabelStyle}
|
|
368
408
|
iconStyle={options.tabBarIconStyle}
|
|
369
|
-
style={
|
|
409
|
+
style={[
|
|
410
|
+
tabBarPosition === 'bottom'
|
|
411
|
+
? styles.bottomItem
|
|
412
|
+
: [
|
|
413
|
+
styles.sideItem,
|
|
414
|
+
hasHorizontalLabels
|
|
415
|
+
? { justifyContent: 'flex-start' }
|
|
416
|
+
: null,
|
|
417
|
+
],
|
|
418
|
+
options.tabBarItemStyle,
|
|
419
|
+
]}
|
|
370
420
|
/>
|
|
371
421
|
</NavigationRouteContext.Provider>
|
|
372
422
|
</NavigationContext.Provider>
|
|
@@ -378,15 +428,40 @@ export function BottomTabBar({
|
|
|
378
428
|
}
|
|
379
429
|
|
|
380
430
|
const styles = StyleSheet.create({
|
|
381
|
-
|
|
431
|
+
left: {
|
|
432
|
+
top: 0,
|
|
433
|
+
bottom: 0,
|
|
434
|
+
left: 0,
|
|
435
|
+
borderRightWidth: StyleSheet.hairlineWidth,
|
|
436
|
+
},
|
|
437
|
+
right: {
|
|
438
|
+
top: 0,
|
|
439
|
+
bottom: 0,
|
|
440
|
+
right: 0,
|
|
441
|
+
borderLeftWidth: StyleSheet.hairlineWidth,
|
|
442
|
+
},
|
|
443
|
+
bottom: {
|
|
382
444
|
left: 0,
|
|
383
445
|
right: 0,
|
|
384
446
|
bottom: 0,
|
|
385
447
|
borderTopWidth: StyleSheet.hairlineWidth,
|
|
386
448
|
elevation: 8,
|
|
387
449
|
},
|
|
388
|
-
|
|
450
|
+
bottomContent: {
|
|
389
451
|
flex: 1,
|
|
390
452
|
flexDirection: 'row',
|
|
391
453
|
},
|
|
454
|
+
sideContent: {
|
|
455
|
+
flex: 1,
|
|
456
|
+
flexDirection: 'column',
|
|
457
|
+
padding: SPACING,
|
|
458
|
+
},
|
|
459
|
+
bottomItem: {
|
|
460
|
+
flex: 1,
|
|
461
|
+
},
|
|
462
|
+
sideItem: {
|
|
463
|
+
margin: SPACING,
|
|
464
|
+
padding: SPACING * 2,
|
|
465
|
+
borderRadius: 4,
|
|
466
|
+
},
|
|
392
467
|
});
|