react-navigation-reanimated-top-tabs 0.8.0 → 0.9.1
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/components/ReanimatedTopTab/AnimationHelper.js +21 -26
- package/lib/commonjs/components/ReanimatedTopTab/AnimationHelper.js.map +1 -1
- package/lib/commonjs/components/ReanimatedTopTab/ReanimatedTabView.js +10 -11
- package/lib/commonjs/components/ReanimatedTopTab/ReanimatedTabView.js.map +1 -1
- package/lib/commonjs/components/ReanimatedTopTab/types.js.map +1 -1
- package/lib/commonjs/components/elements/TabBarBaseComponent.js +2 -10
- package/lib/commonjs/components/elements/TabBarBaseComponent.js.map +1 -1
- package/lib/commonjs/components/elements/TabBarBaseItem.js +6 -3
- package/lib/commonjs/components/elements/TabBarBaseItem.js.map +1 -1
- package/lib/commonjs/components/elements/TabBarLabelBaseComponent.js +3 -3
- package/lib/commonjs/components/elements/TabBarLabelBaseComponent.js.map +1 -1
- package/lib/commonjs/components/wrappers/GestureWrapper.js +27 -8
- package/lib/commonjs/components/wrappers/GestureWrapper.js.map +1 -1
- package/lib/commonjs/context/Context.hooks.js +12 -10
- package/lib/commonjs/context/Context.hooks.js.map +1 -1
- package/lib/commonjs/context/Context.js +11 -8
- package/lib/commonjs/context/Context.js.map +1 -1
- package/lib/commonjs/hooks/useHeader.js +2 -2
- package/lib/commonjs/hooks/useHeader.js.map +1 -1
- package/lib/commonjs/hooks/useTabOffset.js +2 -2
- package/lib/commonjs/hooks/useTabOffset.js.map +1 -1
- package/lib/commonjs/navigator/createReanimatedTopTabNavigator.js +3 -1
- package/lib/commonjs/navigator/createReanimatedTopTabNavigator.js.map +1 -1
- package/lib/module/components/ReanimatedTopTab/AnimationHelper.js +21 -26
- package/lib/module/components/ReanimatedTopTab/AnimationHelper.js.map +1 -1
- package/lib/module/components/ReanimatedTopTab/ReanimatedTabView.js +11 -12
- package/lib/module/components/ReanimatedTopTab/ReanimatedTabView.js.map +1 -1
- package/lib/module/components/ReanimatedTopTab/types.js.map +1 -1
- package/lib/module/components/elements/TabBarBaseComponent.js +4 -12
- package/lib/module/components/elements/TabBarBaseComponent.js.map +1 -1
- package/lib/module/components/elements/TabBarBaseItem.js +7 -4
- package/lib/module/components/elements/TabBarBaseItem.js.map +1 -1
- package/lib/module/components/elements/TabBarLabelBaseComponent.js +3 -3
- package/lib/module/components/elements/TabBarLabelBaseComponent.js.map +1 -1
- package/lib/module/components/wrappers/GestureWrapper.js +29 -10
- package/lib/module/components/wrappers/GestureWrapper.js.map +1 -1
- package/lib/module/context/Context.hooks.js +12 -10
- package/lib/module/context/Context.hooks.js.map +1 -1
- package/lib/module/context/Context.js +11 -8
- package/lib/module/context/Context.js.map +1 -1
- package/lib/module/hooks/useHeader.js +2 -2
- package/lib/module/hooks/useHeader.js.map +1 -1
- package/lib/module/hooks/useTabOffset.js +2 -2
- package/lib/module/hooks/useTabOffset.js.map +1 -1
- package/lib/module/navigator/createReanimatedTopTabNavigator.js +3 -1
- package/lib/module/navigator/createReanimatedTopTabNavigator.js.map +1 -1
- package/lib/typescript/src/components/ReanimatedTopTab/AnimationHelper.d.ts.map +1 -1
- package/lib/typescript/src/components/ReanimatedTopTab/ReanimatedTabView.d.ts +0 -1
- package/lib/typescript/src/components/ReanimatedTopTab/ReanimatedTabView.d.ts.map +1 -1
- package/lib/typescript/src/components/ReanimatedTopTab/types.d.ts +0 -6
- package/lib/typescript/src/components/ReanimatedTopTab/types.d.ts.map +1 -1
- package/lib/typescript/src/components/elements/TabBarBaseComponent.d.ts +1 -1
- package/lib/typescript/src/components/elements/TabBarBaseComponent.d.ts.map +1 -1
- package/lib/typescript/src/components/elements/TabBarBaseItem.d.ts +1 -3
- package/lib/typescript/src/components/elements/TabBarBaseItem.d.ts.map +1 -1
- package/lib/typescript/src/components/wrappers/GestureWrapper.d.ts +2 -1
- package/lib/typescript/src/components/wrappers/GestureWrapper.d.ts.map +1 -1
- package/lib/typescript/src/context/Context.d.ts.map +1 -1
- package/lib/typescript/src/context/Context.hooks.d.ts +4 -3
- package/lib/typescript/src/context/Context.hooks.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +1 -1
- package/lib/typescript/src/navigator/createReanimatedTopTabNavigator.d.ts +1 -1
- package/lib/typescript/src/navigator/createReanimatedTopTabNavigator.d.ts.map +1 -1
- package/lib/typescript/src/types.d.ts +3 -1
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/ReanimatedTopTab/AnimationHelper.ts +22 -30
- package/src/components/ReanimatedTopTab/ReanimatedTabView.tsx +16 -18
- package/src/components/ReanimatedTopTab/types.ts +0 -4
- package/src/components/elements/TabBarBaseComponent.tsx +3 -26
- package/src/components/elements/TabBarBaseItem.tsx +6 -6
- package/src/components/elements/TabBarLabelBaseComponent.tsx +3 -3
- package/src/components/wrappers/GestureWrapper.tsx +31 -14
- package/src/context/Context.hooks.ts +13 -11
- package/src/context/Context.tsx +8 -5
- package/src/hooks/useHeader.ts +2 -2
- package/src/hooks/useTabOffset.ts +2 -2
- package/src/navigator/createReanimatedTopTabNavigator.tsx +2 -1
- package/src/types.ts +3 -1
|
@@ -22,23 +22,24 @@ const Provider = exports.Provider = /*#__PURE__*/(0, _react.memo)(({
|
|
|
22
22
|
const topTabHeight = (0, _reactNativeReanimated.useSharedValue)(0);
|
|
23
23
|
const topTabNativeGesture = (0, _react.useRef)(_reactNativeGestureHandler.Gesture.Native()).current;
|
|
24
24
|
const {
|
|
25
|
-
|
|
25
|
+
positionX,
|
|
26
26
|
transformationY,
|
|
27
27
|
currentYPosition,
|
|
28
28
|
headerHeight,
|
|
29
|
-
isHeaderHeightSet
|
|
29
|
+
isHeaderHeightSet,
|
|
30
|
+
scrollY
|
|
30
31
|
} = _Context.ContextHooks.useTransformHeaderOnTabChange({
|
|
31
32
|
config
|
|
32
33
|
});
|
|
33
34
|
_Context.ContextHooks.useResetApproachingScreenScrollOffset({
|
|
34
35
|
currentYPosition,
|
|
35
|
-
|
|
36
|
+
positionX,
|
|
36
37
|
context
|
|
37
38
|
});
|
|
38
39
|
_Context.ContextHooks.useApproachingTabChange({
|
|
39
40
|
config,
|
|
40
41
|
gestureEnabled,
|
|
41
|
-
|
|
42
|
+
positionX,
|
|
42
43
|
currentScreenIndex
|
|
43
44
|
});
|
|
44
45
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(Context.Provider, {
|
|
@@ -52,10 +53,11 @@ const Provider = exports.Provider = /*#__PURE__*/(0, _react.memo)(({
|
|
|
52
53
|
navHeight,
|
|
53
54
|
topTabHeight,
|
|
54
55
|
topTabNativeGesture,
|
|
55
|
-
|
|
56
|
+
positionX,
|
|
56
57
|
transformationY,
|
|
57
58
|
context,
|
|
58
|
-
isHeaderHeightSet
|
|
59
|
+
isHeaderHeightSet,
|
|
60
|
+
scrollY
|
|
59
61
|
},
|
|
60
62
|
children: children({
|
|
61
63
|
closeOffset,
|
|
@@ -67,10 +69,11 @@ const Provider = exports.Provider = /*#__PURE__*/(0, _react.memo)(({
|
|
|
67
69
|
navHeight,
|
|
68
70
|
topTabHeight,
|
|
69
71
|
topTabNativeGesture,
|
|
70
|
-
|
|
72
|
+
positionX,
|
|
71
73
|
transformationY,
|
|
72
74
|
context,
|
|
73
|
-
isHeaderHeightSet
|
|
75
|
+
isHeaderHeightSet,
|
|
76
|
+
scrollY
|
|
74
77
|
})
|
|
75
78
|
});
|
|
76
79
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_reactNativeGestureHandler","_reactNativeReanimated","_Context","_jsxRuntime","Context","exports","createContext","Provider","memo","children","config","context","gestureEnabled","useSharedValue","currentScreenIndex","navHeight","closeOffset","topTabHeight","topTabNativeGesture","useRef","Gesture","Native","current","
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNativeGestureHandler","_reactNativeReanimated","_Context","_jsxRuntime","Context","exports","createContext","Provider","memo","children","config","context","gestureEnabled","useSharedValue","currentScreenIndex","navHeight","closeOffset","topTabHeight","topTabNativeGesture","useRef","Gesture","Native","current","positionX","transformationY","currentYPosition","headerHeight","isHeaderHeightSet","scrollY","ContextHooks","useTransformHeaderOnTabChange","useResetApproachingScreenScrollOffset","useApproachingTabChange","jsx","value"],"sourceRoot":"../../../src","sources":["context/Context.tsx"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,0BAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAA+C,IAAAI,WAAA,GAAAJ,OAAA;AAExC,MAAMK,OAAO,GAAAC,OAAA,CAAAD,OAAA,gBAAG,IAAAE,oBAAa,EAClC,CAAC,CACH,CAAC;AAEM,MAAMC,QAAQ,GAAAF,OAAA,CAAAE,QAAA,gBAAG,IAAAC,WAAI,EAC1B,CAAC;EACCC,QAAQ;EACRC,MAAM;EACNC;AAC6C,CAAC,KAAK;EACnD,MAAMC,cAAc,GAAG,IAAAC,qCAAc,EAAC,IAAI,CAAC;EAC3C,MAAMC,kBAAkB,GAAG,IAAAD,qCAAc,EAAC,CAAC,CAAC;EAE5C,MAAME,SAAS,GAAG,IAAAF,qCAAc,EAAC,CAAC,CAAC;EACnC,MAAMG,WAAW,GAAG,IAAAH,qCAAc,EAAC,CAAC,CAAC;EACrC,MAAMI,YAAY,GAAG,IAAAJ,qCAAc,EAAC,CAAC,CAAC;EAEtC,MAAMK,mBAAmB,GAAG,IAAAC,aAAM,EAACC,kCAAO,CAACC,MAAM,CAAC,CAAC,CAAC,CAACC,OAAO;EAE5D,MAAM;IACJC,SAAS;IACTC,eAAe;IACfC,gBAAgB;IAChBC,YAAY;IACZC,iBAAiB;IACjBC;EACF,CAAC,GAAGC,qBAAY,CAACC,6BAA6B,CAAC;IAAEpB;EAAO,CAAC,CAAC;EAE1DmB,qBAAY,CAACE,qCAAqC,CAAC;IACjDN,gBAAgB;IAChBF,SAAS;IACTZ;EACF,CAAC,CAAC;EAEFkB,qBAAY,CAACG,uBAAuB,CAAC;IACnCtB,MAAM;IACNE,cAAc;IACdW,SAAS;IACTT;EACF,CAAC,CAAC;EAEF,oBACE,IAAAX,WAAA,CAAA8B,GAAA,EAAC7B,OAAO,CAACG,QAAQ;IACf2B,KAAK,EAAE;MACLlB,WAAW;MACXN,MAAM;MACNI,kBAAkB;MAClBW,gBAAgB;MAChBb,cAAc;MACdc,YAAY;MACZX,SAAS;MACTE,YAAY;MACZC,mBAAmB;MACnBK,SAAS;MACTC,eAAe;MACfb,OAAO;MACPgB,iBAAiB;MACjBC;IACF,CAAE;IAAAnB,QAAA,EAEDA,QAAQ,CAAC;MACRO,WAAW;MACXN,MAAM;MACNI,kBAAkB;MAClBW,gBAAgB;MAChBb,cAAc;MACdc,YAAY;MACZX,SAAS;MACTE,YAAY;MACZC,mBAAmB;MACnBK,SAAS;MACTC,eAAe;MACfb,OAAO;MACPgB,iBAAiB;MACjBC;IACF,CAAC;EAAC,CACc,CAAC;AAEvB,CACF,CAAC","ignoreList":[]}
|
|
@@ -9,10 +9,10 @@ var _reactNativeReanimated = require("react-native-reanimated");
|
|
|
9
9
|
const useHeader = () => {
|
|
10
10
|
const {
|
|
11
11
|
headerHeight,
|
|
12
|
-
|
|
12
|
+
transformationY
|
|
13
13
|
} = (0, _useTabContext.useTabContext)();
|
|
14
14
|
const hideHeader = () => {
|
|
15
|
-
|
|
15
|
+
transformationY.value = (0, _reactNativeReanimated.withTiming)(-headerHeight.value);
|
|
16
16
|
};
|
|
17
17
|
return {
|
|
18
18
|
hideHeader
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_useTabContext","require","_reactNativeReanimated","useHeader","headerHeight","
|
|
1
|
+
{"version":3,"names":["_useTabContext","require","_reactNativeReanimated","useHeader","headerHeight","transformationY","useTabContext","hideHeader","value","withTiming","exports"],"sourceRoot":"../../../src","sources":["hooks/useHeader.ts"],"mappings":";;;;;;AAAA,IAAAA,cAAA,GAAAC,OAAA;AACA,IAAAC,sBAAA,GAAAD,OAAA;AAEO,MAAME,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAM;IAAEC,YAAY;IAAEC;EAAgB,CAAC,GAAG,IAAAC,4BAAa,EAAC,CAAC;EAEzD,MAAMC,UAAU,GAAGA,CAAA,KAAM;IACvBF,eAAe,CAACG,KAAK,GAAG,IAAAC,iCAAU,EAAC,CAACL,YAAY,CAACI,KAAK,CAAC;EACzD,CAAC;EAED,OAAO;IAAED;EAAW,CAAC;AACvB,CAAC;AAACG,OAAA,CAAAP,SAAA,GAAAA,SAAA","ignoreList":[]}
|
|
@@ -10,9 +10,9 @@ var _reactNativeReanimated = require("react-native-reanimated");
|
|
|
10
10
|
|
|
11
11
|
const useTabOffset = () => {
|
|
12
12
|
const {
|
|
13
|
-
|
|
13
|
+
positionX
|
|
14
14
|
} = (0, _useTabContext.useTabContext)();
|
|
15
|
-
return (0, _reactNativeReanimated.useDerivedValue)(() =>
|
|
15
|
+
return (0, _reactNativeReanimated.useDerivedValue)(() => positionX.value);
|
|
16
16
|
};
|
|
17
17
|
exports.useTabOffset = useTabOffset;
|
|
18
18
|
//# sourceMappingURL=useTabOffset.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_useTabContext","require","_reactNativeReanimated","useTabOffset","
|
|
1
|
+
{"version":3,"names":["_useTabContext","require","_reactNativeReanimated","useTabOffset","positionX","useTabContext","useDerivedValue","value","exports"],"sourceRoot":"../../../src","sources":["hooks/useTabOffset.ts"],"mappings":";;;;;;AACA,IAAAA,cAAA,GAAAC,OAAA;AACA,IAAAC,sBAAA,GAAAD,OAAA;AAFA;;AAIO,MAAME,YAAY,GAAGA,CAAA,KAAM;EAChC,MAAM;IAAEC;EAAU,CAAC,GAAG,IAAAC,4BAAa,EAAC,CAAC;EACrC,OAAO,IAAAC,sCAAe,EAAC,MAAMF,SAAS,CAACG,KAAK,CAAC;AAC/C,CAAC;AAACC,OAAA,CAAAL,YAAA,GAAAA,YAAA","ignoreList":[]}
|
|
@@ -22,7 +22,8 @@ const TabViewNavigator = ({
|
|
|
22
22
|
children,
|
|
23
23
|
config,
|
|
24
24
|
initialRouteName,
|
|
25
|
-
screenOptions = {}
|
|
25
|
+
screenOptions = {},
|
|
26
|
+
bounces
|
|
26
27
|
}) => {
|
|
27
28
|
const {
|
|
28
29
|
NavigationContent,
|
|
@@ -77,6 +78,7 @@ const TabViewNavigator = ({
|
|
|
77
78
|
children: [TopComponent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(TopComponent, {
|
|
78
79
|
transformationY: transformationY
|
|
79
80
|
}) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_GestureWrapper.GestureWrapper, {
|
|
81
|
+
bounces: bounces,
|
|
80
82
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
81
83
|
onLayout: ({
|
|
82
84
|
nativeEvent
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_native","require","_GestureWrapper","_TabBarBaseComponent","_Context","_lodash","_react","_reactNativeReanimated","_interopRequireDefault","_ReanimatedTabView","_Context2","_jsxRuntime","e","__esModule","default","TabViewNavigator","HeaderComponent","TopComponent","TabBarComponent","TabBarBaseComponent","children","config","initialRouteName","screenOptions","NavigationContent","descriptors","navigation","state","useNavigationBuilder","TabRouter","defaultScreenOptions","_config","routes","map","context","ContextHooks","usePrepareContext","navigate","index","route","dispatch","TabActions","jumpTo","name","navigationState","useMemo","restOptions","omit","key","options","tabBarLabel","focused","title","undefined","renderScene","render","jsx","Provider","headerHeight","transformationY","jsxs","GestureWrapper","View","onLayout","nativeEvent","value","layout","height","ReanimatedTabView","renderTabBar","createReanimatedTopTabNavigator","createNavigatorFactory","exports"],"sourceRoot":"../../../src","sources":["navigator/createReanimatedTopTabNavigator.tsx"],"mappings":";;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AASA,IAAAC,eAAA,GAAAD,OAAA;AACA,IAAAE,oBAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAEA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,sBAAA,GAAAC,sBAAA,CAAAP,OAAA;AAEA,IAAAQ,kBAAA,GAAAR,OAAA;AACA,IAAAS,SAAA,GAAAT,OAAA;AAAwD,IAAAU,WAAA,GAAAV,OAAA;AAAA,SAAAO,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAExD,MAAMG,gBAAgB,GAAGA,CAAC;EACxBC,eAAe;EACfC,YAAY;EACZC,eAAe,GAAGC,wCAAmB;EACrCC,QAAQ;EACRC,MAAM;EACNC,gBAAgB;EAChBC,aAAa,GAAG,CAAC;
|
|
1
|
+
{"version":3,"names":["_native","require","_GestureWrapper","_TabBarBaseComponent","_Context","_lodash","_react","_reactNativeReanimated","_interopRequireDefault","_ReanimatedTabView","_Context2","_jsxRuntime","e","__esModule","default","TabViewNavigator","HeaderComponent","TopComponent","TabBarComponent","TabBarBaseComponent","children","config","initialRouteName","screenOptions","bounces","NavigationContent","descriptors","navigation","state","useNavigationBuilder","TabRouter","defaultScreenOptions","_config","routes","map","context","ContextHooks","usePrepareContext","navigate","index","route","dispatch","TabActions","jumpTo","name","navigationState","useMemo","restOptions","omit","key","options","tabBarLabel","focused","title","undefined","renderScene","render","jsx","Provider","headerHeight","transformationY","jsxs","GestureWrapper","View","onLayout","nativeEvent","value","layout","height","ReanimatedTabView","renderTabBar","createReanimatedTopTabNavigator","createNavigatorFactory","exports"],"sourceRoot":"../../../src","sources":["navigator/createReanimatedTopTabNavigator.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -16,48 +16,43 @@ const onChange = (event, animationValue, width, navigationState) => {
|
|
|
16
16
|
const getIndex = (navigationState, type) => {
|
|
17
17
|
'worklet';
|
|
18
18
|
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
const max = navigationState.size - 1;
|
|
20
|
+
const current = navigationState.index;
|
|
21
|
+
if (type === 'increment' && current < max) {
|
|
22
|
+
return current + 1;
|
|
21
23
|
}
|
|
22
|
-
|
|
24
|
+
if (type === 'decrement' && current > 0) {
|
|
25
|
+
return current - 1;
|
|
26
|
+
}
|
|
27
|
+
return current;
|
|
23
28
|
};
|
|
24
29
|
const onEnd = (event, minimumValueToChangeView, width, navigationState) => {
|
|
25
30
|
'worklet';
|
|
26
31
|
|
|
27
|
-
|
|
32
|
+
const {
|
|
33
|
+
velocityX,
|
|
34
|
+
translationX
|
|
35
|
+
} = event;
|
|
36
|
+
if (velocityX < -200 || translationX < -minimumValueToChangeView) {
|
|
37
|
+
const newIndex = getIndex(navigationState, 'increment');
|
|
28
38
|
return {
|
|
29
|
-
index:
|
|
30
|
-
value: -width *
|
|
39
|
+
index: newIndex,
|
|
40
|
+
value: -width * newIndex
|
|
31
41
|
};
|
|
32
42
|
}
|
|
33
|
-
if (
|
|
43
|
+
if (velocityX > 200 || translationX > minimumValueToChangeView) {
|
|
44
|
+
const newIndex = getIndex(navigationState, 'decrement');
|
|
34
45
|
return {
|
|
35
|
-
index:
|
|
36
|
-
value: -width *
|
|
46
|
+
index: newIndex,
|
|
47
|
+
value: -width * newIndex
|
|
37
48
|
};
|
|
38
49
|
}
|
|
39
|
-
if (event.translationX < 0) {
|
|
40
|
-
if (event.translationX < -minimumValueToChangeView) {
|
|
41
|
-
return {
|
|
42
|
-
index: getIndex(navigationState, 'increment'),
|
|
43
|
-
value: -width * (navigationState.index + 1)
|
|
44
|
-
};
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
if (event.translationX > 0) {
|
|
48
|
-
if (event.translationX > minimumValueToChangeView) {
|
|
49
|
-
return {
|
|
50
|
-
index: getIndex(navigationState, 'decrement'),
|
|
51
|
-
value: -width * (navigationState.index - 1)
|
|
52
|
-
};
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
50
|
return {
|
|
56
51
|
index: navigationState.index,
|
|
57
52
|
value: -width * navigationState.index
|
|
58
53
|
};
|
|
59
54
|
};
|
|
60
|
-
const animation = (newValue, duration =
|
|
55
|
+
const animation = (newValue, duration = 200) => {
|
|
61
56
|
'worklet';
|
|
62
57
|
|
|
63
58
|
return withTiming(newValue, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["withTiming","onChange","event","animationValue","width","navigationState","routesLength","size","changeX","getIndex","type","index","onEnd","minimumValueToChangeView","velocityX","
|
|
1
|
+
{"version":3,"names":["withTiming","onChange","event","animationValue","width","navigationState","routesLength","size","changeX","getIndex","type","max","current","index","onEnd","minimumValueToChangeView","velocityX","translationX","newIndex","value","animation","newValue","duration","AnimationHelper"],"sourceRoot":"../../../../src","sources":["components/ReanimatedTopTab/AnimationHelper.ts"],"mappings":";;AAMA,SAASA,UAAU,QAAQ,yBAAyB;AAIpD,MAAMC,QAAQ,GAAGA,CACfC,KAEC,EACDC,cAAsB,EACtBC,KAAa,EACbC,eAAgC,KAC7B;EACH,SAAS;;EACT,IAAIF,cAAc,GAAG,CAAC,EAAE;IACtB,OAAO,CAAC;EACV;EACA,MAAMG,YAAY,GAAGD,eAAe,CAACE,IAAI,GAAG,CAAC;EAC7C,IAAIJ,cAAc,GAAG,CAACC,KAAK,GAAGE,YAAY,EAAE;IAC1C,OAAO,CAACF,KAAK,GAAGE,YAAY;EAC9B;EACA,OAAOH,cAAc,GAAGD,KAAK,CAACM,OAAO;AACvC,CAAC;AAED,MAAMC,QAAQ,GAAGA,CACfJ,eAAgC,EAChCK,IAA+B,KAC5B;EACH,SAAS;;EACT,MAAMC,GAAG,GAAGN,eAAe,CAACE,IAAI,GAAG,CAAC;EACpC,MAAMK,OAAO,GAAGP,eAAe,CAACQ,KAAK;EAErC,IAAIH,IAAI,KAAK,WAAW,IAAIE,OAAO,GAAGD,GAAG,EAAE;IACzC,OAAOC,OAAO,GAAG,CAAC;EACpB;EAEA,IAAIF,IAAI,KAAK,WAAW,IAAIE,OAAO,GAAG,CAAC,EAAE;IACvC,OAAOA,OAAO,GAAG,CAAC;EACpB;EAEA,OAAOA,OAAO;AAChB,CAAC;AAED,MAAME,KAAK,GAAGA,CACZZ,KAA6D,EAC7Da,wBAAgC,EAChCX,KAAa,EACbC,eAAgC,KAC7B;EACH,SAAS;;EACT,MAAM;IAAEW,SAAS;IAAEC;EAAa,CAAC,GAAGf,KAAK;EAEzC,IAAIc,SAAS,GAAG,CAAC,GAAG,IAAIC,YAAY,GAAG,CAACF,wBAAwB,EAAE;IAChE,MAAMG,QAAQ,GAAGT,QAAQ,CAACJ,eAAe,EAAE,WAAW,CAAC;IACvD,OAAO;MACLQ,KAAK,EAAEK,QAAQ;MACfC,KAAK,EAAE,CAACf,KAAK,GAAGc;IAClB,CAAC;EACH;EACA,IAAIF,SAAS,GAAG,GAAG,IAAIC,YAAY,GAAGF,wBAAwB,EAAE;IAC9D,MAAMG,QAAQ,GAAGT,QAAQ,CAACJ,eAAe,EAAE,WAAW,CAAC;IACvD,OAAO;MACLQ,KAAK,EAAEK,QAAQ;MACfC,KAAK,EAAE,CAACf,KAAK,GAAGc;IAClB,CAAC;EACH;EACA,OAAO;IACLL,KAAK,EAAER,eAAe,CAACQ,KAAK;IAC5BM,KAAK,EAAE,CAACf,KAAK,GAAGC,eAAe,CAACQ;EAClC,CAAC;AACH,CAAC;AAED,MAAMO,SAAS,GAAGA,CAACC,QAAgB,EAAEC,QAAQ,GAAG,GAAG,KAAK;EACtD,SAAS;;EACT,OAAOtB,UAAU,CAACqB,QAAQ,EAAE;IAAEC;EAAS,CAAC,CAAC;AAC3C,CAAC;AAED,OAAO,MAAMC,eAAe,GAAG;EAC7BH,SAAS;EACTnB,QAAQ;EACRa;AACF,CAAC","ignoreList":[]}
|
|
@@ -3,7 +3,8 @@
|
|
|
3
3
|
import React, { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
4
4
|
import { StyleSheet, useWindowDimensions, View } from 'react-native';
|
|
5
5
|
import { Gesture, GestureDetector, GestureHandlerRootView } from 'react-native-gesture-handler';
|
|
6
|
-
import Reanimated, {
|
|
6
|
+
import Reanimated, { interpolate, LinearTransition, runOnJS, runOnUI, useAnimatedReaction, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
|
|
7
|
+
import { useTabContext } from '../../hooks/useTabContext';
|
|
7
8
|
import { AnimationHelper } from './AnimationHelper';
|
|
8
9
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
10
|
export const ReanimatedTabView = /*#__PURE__*/React.memo(({
|
|
@@ -11,7 +12,6 @@ export const ReanimatedTabView = /*#__PURE__*/React.memo(({
|
|
|
11
12
|
lazy = false,
|
|
12
13
|
navigationState,
|
|
13
14
|
percentageTrigger = 0.4,
|
|
14
|
-
positionInterpolation,
|
|
15
15
|
renderScene,
|
|
16
16
|
renderTabBar,
|
|
17
17
|
navigate,
|
|
@@ -22,12 +22,12 @@ export const ReanimatedTabView = /*#__PURE__*/React.memo(({
|
|
|
22
22
|
} = useWindowDimensions();
|
|
23
23
|
const loadedScreens = useRef([navigationState.routes[navigationState.index]]);
|
|
24
24
|
const scrollPosition = useSharedValue(navigationState.index);
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
}
|
|
25
|
+
const {
|
|
26
|
+
positionX
|
|
27
|
+
} = useTabContext();
|
|
28
|
+
useAnimatedReaction(() => scrollPosition.value, value => {
|
|
29
|
+
positionX.value = interpolate(value, navigationState.routes.map((_, i) => i * -width), navigationState.routes.map((_, i) => i), 'clamp');
|
|
30
|
+
});
|
|
31
31
|
const _navigate = index => {
|
|
32
32
|
scrollPosition.value = AnimationHelper.animation(-index * width);
|
|
33
33
|
navigate(index);
|
|
@@ -54,10 +54,10 @@ export const ReanimatedTabView = /*#__PURE__*/React.memo(({
|
|
|
54
54
|
scrollPosition.value = AnimationHelper.animation(state.value);
|
|
55
55
|
_navigationState.value.index = state.index;
|
|
56
56
|
runOnJS(navigate)(state.index);
|
|
57
|
-
}), [minimumValueToChangeView, width
|
|
57
|
+
}), [minimumValueToChangeView, width]);
|
|
58
58
|
const scrollPositionStyle = useAnimatedStyle(() => ({
|
|
59
59
|
transform: [{
|
|
60
|
-
translateX: interpolate(scrollPosition.value, [-width * (navigationState.routes.length - 1), 0], [-width * (navigationState.routes.length - 1), 0],
|
|
60
|
+
translateX: interpolate(scrollPosition.value, [-width * (navigationState.routes.length - 1), 0], [-width * (navigationState.routes.length - 1), 0], 'clamp')
|
|
61
61
|
}]
|
|
62
62
|
}));
|
|
63
63
|
const jumpTo = React.useCallback(key => {
|
|
@@ -66,7 +66,7 @@ export const ReanimatedTabView = /*#__PURE__*/React.memo(({
|
|
|
66
66
|
return;
|
|
67
67
|
}
|
|
68
68
|
scrollPosition.value = AnimationHelper.animation(-newIndex * width);
|
|
69
|
-
}, [navigationState.routes,
|
|
69
|
+
}, [navigationState.routes, width]);
|
|
70
70
|
const chooseRender = useCallback((params, useRenderScene = true) => /*#__PURE__*/_jsx(View, {
|
|
71
71
|
style: {
|
|
72
72
|
width
|
|
@@ -106,7 +106,6 @@ export const ReanimatedTabView = /*#__PURE__*/React.memo(({
|
|
|
106
106
|
style: defaultStyles.flex,
|
|
107
107
|
children: [renderTabBar ? renderTabBar({
|
|
108
108
|
navigationState,
|
|
109
|
-
position,
|
|
110
109
|
navigate: _navigate,
|
|
111
110
|
screenOptions
|
|
112
111
|
}) : null, /*#__PURE__*/_jsx(GestureDetector, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useCallback","useEffect","useMemo","useRef","StyleSheet","useWindowDimensions","View","Gesture","GestureDetector","GestureHandlerRootView","Reanimated","
|
|
1
|
+
{"version":3,"names":["React","useCallback","useEffect","useMemo","useRef","StyleSheet","useWindowDimensions","View","Gesture","GestureDetector","GestureHandlerRootView","Reanimated","interpolate","LinearTransition","runOnJS","runOnUI","useAnimatedReaction","useAnimatedStyle","useSharedValue","useTabContext","AnimationHelper","jsx","_jsx","jsxs","_jsxs","ReanimatedTabView","memo","LazyPlaceholder","lazy","navigationState","percentageTrigger","renderScene","renderTabBar","navigate","screenOptions","width","loadedScreens","routes","index","scrollPosition","positionX","value","map","_","i","_navigate","animation","minimumValueToChangeView","_navigationState","size","length","panGesture","Pan","failOffsetY","activeOffsetX","onChange","event","onEnd","state","scrollPositionStyle","transform","translateX","jumpTo","key","newIndex","findIndex","route","chooseRender","params","useRenderScene","style","children","Routes","screen","current","find","loadedScreen","undefined","push","defaultStyles","flex","layout","gesture","viewsContainer","create","flexDirection"],"sourceRoot":"../../../../src","sources":["components/ReanimatedTopTab/ReanimatedTabView.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["ReanimatedTabViewTypes"],"sourceRoot":"../../../../src","sources":["components/ReanimatedTopTab/types.ts"],"mappings":";;
|
|
1
|
+
{"version":3,"names":["ReanimatedTabViewTypes"],"sourceRoot":"../../../../src","sources":["components/ReanimatedTopTab/types.ts"],"mappings":";;WAGiBA,sBAAsB","ignoreList":[]}
|
|
@@ -1,23 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as React from 'react';
|
|
4
|
-
import { StyleSheet
|
|
5
|
-
import Reanimated, { interpolate,
|
|
4
|
+
import { StyleSheet } from 'react-native';
|
|
5
|
+
import Reanimated, { interpolate, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
|
|
6
6
|
import { useTabContext } from '../../hooks/useTabContext';
|
|
7
7
|
import { TabBarBaseItem } from './TabBarBaseItem';
|
|
8
8
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
9
|
export const TabBarBaseComponent = ({
|
|
10
10
|
children,
|
|
11
11
|
navigationState,
|
|
12
|
-
position,
|
|
13
12
|
style,
|
|
14
13
|
navigate,
|
|
15
14
|
screenOptions
|
|
16
15
|
}) => {
|
|
17
|
-
const layout = useWindowDimensions();
|
|
18
16
|
const {
|
|
19
17
|
topTabHeight,
|
|
20
|
-
|
|
18
|
+
positionX
|
|
21
19
|
} = useTabContext();
|
|
22
20
|
const width = useSharedValue(0);
|
|
23
21
|
const {
|
|
@@ -30,16 +28,11 @@ export const TabBarBaseComponent = ({
|
|
|
30
28
|
const outputRange = navigationState.routes.map((_, index) => index * (width.value / navigationState.routes.length));
|
|
31
29
|
return {
|
|
32
30
|
transform: [{
|
|
33
|
-
translateX: interpolate(
|
|
31
|
+
translateX: interpolate(positionX.value, inputRange, outputRange)
|
|
34
32
|
}],
|
|
35
33
|
width: width.value / navigationState.routes.length
|
|
36
34
|
};
|
|
37
35
|
});
|
|
38
|
-
|
|
39
|
-
//Assign interpolated offsetX to transformationX
|
|
40
|
-
useAnimatedReaction(() => interpolate(position.value, navigationState.routes.map((_, i) => i * layout.width), navigationState.routes.map((_, i) => i), 'clamp'), value => {
|
|
41
|
-
transformationX.value = value;
|
|
42
|
-
}, [navigationState.routes]);
|
|
43
36
|
return /*#__PURE__*/_jsxs(Reanimated.View, {
|
|
44
37
|
onLayout: ({
|
|
45
38
|
nativeEvent
|
|
@@ -58,7 +51,6 @@ export const TabBarBaseComponent = ({
|
|
|
58
51
|
}), navigationState.routes.map((route, index) => /*#__PURE__*/_jsx(TabBarBaseItem, {
|
|
59
52
|
index: index,
|
|
60
53
|
inputRange: inputRange,
|
|
61
|
-
position: transformationX,
|
|
62
54
|
onPress: () => {
|
|
63
55
|
navigate(index);
|
|
64
56
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","StyleSheet","
|
|
1
|
+
{"version":3,"names":["React","StyleSheet","Reanimated","interpolate","useAnimatedStyle","useSharedValue","useTabContext","TabBarBaseItem","jsx","_jsx","jsxs","_jsxs","TabBarBaseComponent","children","navigationState","style","navigate","screenOptions","topTabHeight","positionX","width","tabBarIndicatorStyle","tabBarItemStyle","tabBarStyle","inputRange","routes","map","_","index","indicatorStyle","outputRange","value","length","transform","translateX","View","onLayout","nativeEvent","layout","height","styles","wrapper","indicator","route","onPress","key","create","labelWrapper","flex","alignItems","justifyContent","flexDirection","backgroundColor","bottom","position"],"sourceRoot":"../../../../src","sources":["components/elements/TabBarBaseComponent.tsx"],"mappings":";;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,UAAU,QAAQ,cAAc;AACzC,OAAOC,UAAU,IACfC,WAAW,EACXC,gBAAgB,EAChBC,cAAc,QAET,yBAAyB;AAEhC,SAASC,aAAa,QAAQ,2BAA2B;AAEzD,SAASC,cAAc,QAAQ,kBAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAOlD,OAAO,MAAMC,mBAAmB,GAAGA,CAAC;EAClCC,QAAQ;EACRC,eAAe;EACfC,KAAK;EACLC,QAAQ;EACRC;AACW,CAAC,KAAK;EACjB,MAAM;IAAEC,YAAY;IAAEC;EAAU,CAAC,GAAGb,aAAa,CAAC,CAAC;EACnD,MAAMc,KAAK,GAAGf,cAAc,CAAC,CAAC,CAAC;EAE/B,MAAM;IAAEgB,oBAAoB;IAAEC,eAAe;IAAEC;EAAY,CAAC,GAC1DN,aAAa,IAAI,CAAC,CAAC;EAErB,MAAMO,UAAU,GAAGV,eAAe,CAACW,MAAM,CAACC,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,KAAKA,KAAK,CAAC;EAElE,MAAMC,cAAc,GAAGzB,gBAAgB,CAAC,MAAM;IAC5C,MAAM0B,WAAW,GAAGhB,eAAe,CAACW,MAAM,CAACC,GAAG,CAC5C,CAACC,CAAC,EAAEC,KAAK,KAAKA,KAAK,IAAIR,KAAK,CAACW,KAAK,GAAGjB,eAAe,CAACW,MAAM,CAACO,MAAM,CACpE,CAAC;IAED,OAAO;MACLC,SAAS,EAAE,CACT;QACEC,UAAU,EAAE/B,WAAW,CAACgB,SAAS,CAACY,KAAK,EAAEP,UAAU,EAAEM,WAAW;MAClE,CAAC,CACF;MACDV,KAAK,EAAEA,KAAK,CAACW,KAAK,GAAGjB,eAAe,CAACW,MAAM,CAACO;IAC9C,CAAC;EACH,CAAC,CAAC;EAEF,oBACErB,KAAA,CAACT,UAAU,CAACiC,IAAI;IACdC,QAAQ,EAAEA,CAAC;MAAEC;IAAY,CAAC,KAAK;MAC7BnB,YAAY,CAACa,KAAK,GAAGM,WAAW,CAACC,MAAM,CAACC,MAAM;IAChD,CAAE;IAAA1B,QAAA,gBAEFF,KAAA,CAACT,UAAU,CAACiC,IAAI;MACdC,QAAQ,EAAEA,CAAC;QAAEC;MAAY,CAAC,KAAK;QAC7BjB,KAAK,CAACW,KAAK,GAAGM,WAAW,CAACC,MAAM,CAAClB,KAAK;MACxC,CAAE;MACFL,KAAK,EAAE,CAACyB,MAAM,CAACC,OAAO,EAAElB,WAAW,EAAER,KAAK,CAAE;MAAAF,QAAA,gBAE5CJ,IAAA,CAACP,UAAU,CAACiC,IAAI;QACdpB,KAAK,EAAE,CAACyB,MAAM,CAACE,SAAS,EAAEb,cAAc,EAAER,oBAAoB;MAAE,CACjE,CAAC,EACDP,eAAe,CAACW,MAAM,CAACC,GAAG,CAAC,CAACiB,KAAK,EAAEf,KAAK,kBACvCnB,IAAA,CAACF,cAAc;QACbqB,KAAK,EAAEA,KAAM;QACbJ,UAAU,EAAEA,UAAW;QAEvBoB,OAAO,EAAEA,CAAA,KAAM;UACb5B,QAAQ,CAACY,KAAK,CAAC;QACjB,CAAE;QACFe,KAAK,EAAEA,KAAM;QACb5B,KAAK,EAAEO;MAAgB,GALlBqB,KAAK,CAACE,GAMZ,CACF,CAAC;IAAA,CACa,CAAC,EACjBhC,QAAQ;EAAA,CACM,CAAC;AAEtB,CAAC;;AAED;AACA,MAAM2B,MAAM,GAAGvC,UAAU,CAAC6C,MAAM,CAAC;EAC/BC,YAAY,EAAE;IACZC,IAAI,EAAE,CAAC;IACPC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDT,OAAO,EAAE;IACPU,aAAa,EAAE,KAAK;IACpBC,eAAe,EAAE;EACnB,CAAC;EACDV,SAAS,EAAE;IACTU,eAAe,EAAE,OAAO;IACxBC,MAAM,EAAE,CAAC;IACTd,MAAM,EAAE,CAAC;IACTe,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -1,22 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { Pressable, StyleSheet, Text } from 'react-native';
|
|
4
|
-
import Animated, {
|
|
4
|
+
import Animated, { interpolate, useAnimatedStyle } from 'react-native-reanimated';
|
|
5
|
+
import { useTabContext } from '../../hooks/useTabContext';
|
|
5
6
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
6
7
|
export const TabBarBaseItem = ({
|
|
7
|
-
position,
|
|
8
8
|
index,
|
|
9
9
|
inputRange,
|
|
10
10
|
onPress,
|
|
11
11
|
route,
|
|
12
12
|
style
|
|
13
13
|
}) => {
|
|
14
|
+
const {
|
|
15
|
+
positionX
|
|
16
|
+
} = useTabContext();
|
|
14
17
|
const activeStyle = useAnimatedStyle(() => ({
|
|
15
|
-
opacity: interpolate(
|
|
18
|
+
opacity: interpolate(positionX.value, inputRange, inputRange.map(i => i === index ? 1 : 0)),
|
|
16
19
|
position: 'absolute'
|
|
17
20
|
}));
|
|
18
21
|
const inactiveStyle = useAnimatedStyle(() => ({
|
|
19
|
-
opacity: interpolate(
|
|
22
|
+
opacity: interpolate(positionX.value, inputRange, inputRange.map(i => i === index ? 0 : 1))
|
|
20
23
|
}));
|
|
21
24
|
return /*#__PURE__*/_jsxs(Pressable, {
|
|
22
25
|
onPress: () => onPress(index),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Pressable","StyleSheet","Text","Animated","useAnimatedStyle","
|
|
1
|
+
{"version":3,"names":["Pressable","StyleSheet","Text","Animated","interpolate","useAnimatedStyle","useTabContext","jsx","_jsx","jsxs","_jsxs","TabBarBaseItem","index","inputRange","onPress","route","style","positionX","activeStyle","opacity","value","map","i","position","inactiveStyle","styles","container","children","View","tabBarLabel","title","create","alignItems","flex","justifyContent","minHeight"],"sourceRoot":"../../../../src","sources":["components/elements/TabBarBaseItem.tsx"],"mappings":";;AAAA,SACEA,SAAS,EACTC,UAAU,EACVC,IAAI,QAGC,cAAc;AACrB,OAAOC,QAAQ,IACbC,WAAW,EACXC,gBAAgB,QACX,yBAAyB;AAChC,SAASC,aAAa,QAAQ,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAW1D,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAC7BC,KAAK;EACLC,UAAU;EACVC,OAAO;EACPC,KAAK;EACLC;AACmB,CAAC,KAAK;EACzB,MAAM;IAAEC;EAAU,CAAC,GAAGX,aAAa,CAAC,CAAC;EAErC,MAAMY,WAAW,GAAGb,gBAAgB,CAAC,OAAO;IAC1Cc,OAAO,EAAEf,WAAW,CAClBa,SAAS,CAACG,KAAK,EACfP,UAAU,EACVA,UAAU,CAACQ,GAAG,CAAEC,CAAC,IAAMA,CAAC,KAAKV,KAAK,GAAG,CAAC,GAAG,CAAE,CAC7C,CAAC;IACDW,QAAQ,EAAE;EACZ,CAAC,CAAC,CAAC;EAEH,MAAMC,aAAa,GAAGnB,gBAAgB,CAAC,OAAO;IAC5Cc,OAAO,EAAEf,WAAW,CAClBa,SAAS,CAACG,KAAK,EACfP,UAAU,EACVA,UAAU,CAACQ,GAAG,CAAEC,CAAC,IAAMA,CAAC,KAAKV,KAAK,GAAG,CAAC,GAAG,CAAE,CAC7C;EACF,CAAC,CAAC,CAAC;EAEH,oBACEF,KAAA,CAACV,SAAS;IAACc,OAAO,EAAEA,CAAA,KAAMA,OAAO,CAACF,KAAK,CAAE;IAACI,KAAK,EAAE,CAACS,MAAM,CAACC,SAAS,EAAEV,KAAK,CAAE;IAAAW,QAAA,gBACzEnB,IAAA,CAACL,QAAQ,CAACyB,IAAI;MAACZ,KAAK,EAAEE,WAAY;MAAAS,QAAA,EAC/BZ,KAAK,CAACc,WAAW,GAChBd,KAAK,CAACc,WAAW,CAAC,IAAI,CAAC,gBAEvBrB,IAAA,CAACN,IAAI;QAAAyB,QAAA,EAAEZ,KAAK,CAACe;MAAK,CAAO;IAC1B,CACY,CAAC,eAChBtB,IAAA,CAACL,QAAQ,CAACyB,IAAI;MAACZ,KAAK,EAAEQ,aAAc;MAAAG,QAAA,EACjCZ,KAAK,CAACc,WAAW,GAChBd,KAAK,CAACc,WAAW,CAAC,KAAK,CAAC,gBAExBrB,IAAA,CAACN,IAAI;QAAAyB,QAAA,EAAEZ,KAAK,CAACe;MAAK,CAAO;IAC1B,CACY,CAAC;EAAA,CACP,CAAC;AAEhB,CAAC;AAED,MAAML,MAAM,GAAGxB,UAAU,CAAC8B,MAAM,CAAC;EAC/BL,SAAS,EAAE;IACTM,UAAU,EAAE,QAAQ;IACpBC,IAAI,EAAE,CAAC;IACPC,cAAc,EAAE,QAAQ;IACxBC,SAAS,EAAE;EACb;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -8,12 +8,12 @@ export const TabBarLabelBaseComponent = ({
|
|
|
8
8
|
index,
|
|
9
9
|
...props
|
|
10
10
|
}) => {
|
|
11
|
-
const
|
|
11
|
+
const positionX = useTabOffset();
|
|
12
12
|
const style = useAnimatedStyle(() => ({
|
|
13
|
-
backgroundColor: interpolateColor(
|
|
13
|
+
backgroundColor: interpolateColor(positionX.value, [index - 1, index, index + 1], ['transparent', 'blue', 'transparent'])
|
|
14
14
|
}), []);
|
|
15
15
|
const textStyle = useAnimatedStyle(() => ({
|
|
16
|
-
color: interpolateColor(
|
|
16
|
+
color: interpolateColor(positionX.value, [index - 1, index, index + 1], ['black', 'white', 'black'])
|
|
17
17
|
}), []);
|
|
18
18
|
return /*#__PURE__*/_jsx(Reanimated.View, {
|
|
19
19
|
style: [style, styles.wrapper],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["StyleSheet","Reanimated","interpolateColor","useAnimatedStyle","useTabOffset","jsx","_jsx","TabBarLabelBaseComponent","index","props","
|
|
1
|
+
{"version":3,"names":["StyleSheet","Reanimated","interpolateColor","useAnimatedStyle","useTabOffset","jsx","_jsx","TabBarLabelBaseComponent","index","props","positionX","style","backgroundColor","value","textStyle","color","View","styles","wrapper","children","Text","text","title","create","fontWeight","textTransform","borderRadius","height","justifyContent","paddingHorizontal","paddingVertical"],"sourceRoot":"../../../../src","sources":["components/elements/TabBarLabelBaseComponent.tsx"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,cAAc;AACzC,OAAOC,UAAU,IACfC,gBAAgB,EAChBC,gBAAgB,QACX,yBAAyB;AAEhC,SAASC,YAAY,QAAQ,0BAA0B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQxD,OAAO,MAAMC,wBAAwB,GAAGA,CAAC;EACvCC,KAAK;EACL,GAAGC;AACa,CAAC,KAAK;EACtB,MAAMC,SAAS,GAAGN,YAAY,CAAC,CAAC;EAEhC,MAAMO,KAAK,GAAGR,gBAAgB,CAC5B,OAAO;IACLS,eAAe,EAAEV,gBAAgB,CAC/BQ,SAAS,CAACG,KAAK,EACf,CAACL,KAAK,GAAG,CAAC,EAAEA,KAAK,EAAEA,KAAK,GAAG,CAAC,CAAC,EAC7B,CAAC,aAAa,EAAE,MAAM,EAAE,aAAa,CACvC;EACF,CAAC,CAAC,EACF,EACF,CAAC;EAED,MAAMM,SAAS,GAAGX,gBAAgB,CAChC,OAAO;IACLY,KAAK,EAAEb,gBAAgB,CACrBQ,SAAS,CAACG,KAAK,EACf,CAACL,KAAK,GAAG,CAAC,EAAEA,KAAK,EAAEA,KAAK,GAAG,CAAC,CAAC,EAC7B,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,CAC5B;EACF,CAAC,CAAC,EACF,EACF,CAAC;EAED,oBACEF,IAAA,CAACL,UAAU,CAACe,IAAI;IAACL,KAAK,EAAE,CAACA,KAAK,EAAEM,MAAM,CAACC,OAAO,CAAE;IAAAC,QAAA,eAC9Cb,IAAA,CAACL,UAAU,CAACmB,IAAI;MAACT,KAAK,EAAE,CAACG,SAAS,EAAEG,MAAM,CAACI,IAAI,CAAE;MAAAF,QAAA,EAC9CV,KAAK,CAACa;IAAK,CACG;EAAC,CACH,CAAC;AAEtB,CAAC;AAED,MAAML,MAAM,GAAGjB,UAAU,CAACuB,MAAM,CAAC;EAC/BF,IAAI,EAAE;IACJG,UAAU,EAAE,MAAM;IAClBC,aAAa,EAAE;EACjB,CAAC;EACDP,OAAO,EAAE;IACPQ,YAAY,EAAE,EAAE;IAChBC,MAAM,EAAE,EAAE;IACVC,cAAc,EAAE,QAAQ;IACxBC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -2,20 +2,26 @@
|
|
|
2
2
|
|
|
3
3
|
import React, { useMemo, useRef, useState } from 'react';
|
|
4
4
|
import { Gesture, GestureDetector } from 'react-native-gesture-handler';
|
|
5
|
-
import Reanimated, { Easing,
|
|
5
|
+
import Reanimated, { Easing, runOnJS, useAnimatedReaction, useAnimatedStyle, useDerivedValue, useSharedValue, withTiming } from 'react-native-reanimated';
|
|
6
6
|
import { useTabContext } from '../../hooks/useTabContext';
|
|
7
|
-
import { StyleSheet, View } from 'react-native';
|
|
7
|
+
import { Platform, StyleSheet, View } from 'react-native';
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
9
|
export const GestureWrapper = ({
|
|
10
|
-
children
|
|
10
|
+
children,
|
|
11
|
+
bounces
|
|
11
12
|
}) => {
|
|
13
|
+
const _bounces = Platform.select({
|
|
14
|
+
ios: bounces,
|
|
15
|
+
default: false
|
|
16
|
+
});
|
|
12
17
|
const {
|
|
13
18
|
context,
|
|
14
19
|
currentScreenIndex,
|
|
15
20
|
currentYPosition,
|
|
16
21
|
gestureEnabled,
|
|
17
22
|
headerHeight,
|
|
18
|
-
transformationY
|
|
23
|
+
transformationY,
|
|
24
|
+
scrollY
|
|
19
25
|
} = useTabContext();
|
|
20
26
|
const movedY = useSharedValue(0);
|
|
21
27
|
const gestureRef = useRef(Gesture.Pan());
|
|
@@ -68,12 +74,25 @@ export const GestureWrapper = ({
|
|
|
68
74
|
}).simultaneousWithExternalGesture(...Object.values(context.screen.properties).map(({
|
|
69
75
|
nativeGesture
|
|
70
76
|
}) => nativeGesture)).withRef(gestureRef).enabled(_gestureEnabled), [_gestureEnabled]);
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
+
useAnimatedReaction(() => {
|
|
78
|
+
if (transformationY.value > 0) {
|
|
79
|
+
if (_bounces) return transformationY.value * -0.3;else return 0;
|
|
80
|
+
}
|
|
81
|
+
if (transformationY.value < -headerHeight.value) {
|
|
82
|
+
return headerHeight.value;
|
|
83
|
+
}
|
|
84
|
+
return -transformationY.value;
|
|
85
|
+
}, value => {
|
|
86
|
+
scrollY.value = value;
|
|
87
|
+
});
|
|
88
|
+
const style = useAnimatedStyle(() => {
|
|
89
|
+
return {
|
|
90
|
+
flex: 1,
|
|
91
|
+
transform: [{
|
|
92
|
+
translateY: scrollY.value * -1
|
|
93
|
+
}]
|
|
94
|
+
};
|
|
95
|
+
}, []);
|
|
77
96
|
return /*#__PURE__*/_jsx(GestureDetector, {
|
|
78
97
|
gesture: gesture,
|
|
79
98
|
children: /*#__PURE__*/_jsx(View, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useMemo","useRef","useState","Gesture","GestureDetector","Reanimated","Easing","
|
|
1
|
+
{"version":3,"names":["React","useMemo","useRef","useState","Gesture","GestureDetector","Reanimated","Easing","runOnJS","useAnimatedReaction","useAnimatedStyle","useDerivedValue","useSharedValue","withTiming","useTabContext","Platform","StyleSheet","View","jsx","_jsx","GestureWrapper","children","bounces","_bounces","select","ios","default","context","currentScreenIndex","currentYPosition","gestureEnabled","headerHeight","transformationY","scrollY","movedY","gestureRef","Pan","currentScreenScrollOffset","Object","values","screen","properties","map","value","withTimingConfig","duration","easing","bezier","_gestureEnabled","setGestureEnabled","next","prev","gesture","activeOffsetY","onTouchesMove","_","stateManager","fail","onUpdate","translationY","onEnd","velocityY","gestureValue","changeOffset","destination","onFinalize","simultaneousWithExternalGesture","nativeGesture","withRef","enabled","style","flex","transform","translateY","styles","container","create","overflow"],"sourceRoot":"../../../../src","sources":["components/wrappers/GestureWrapper.tsx"],"mappings":"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","ignoreList":[]}
|