react-navigation-reanimated-top-tabs 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +20 -0
- package/README.md +26 -0
- package/lib/commonjs/components/ReanimatedTopTab/AnimationHelper.js +76 -0
- package/lib/commonjs/components/ReanimatedTopTab/AnimationHelper.js.map +1 -0
- package/lib/commonjs/components/ReanimatedTopTab/ReanimatedTabView.js +125 -0
- package/lib/commonjs/components/ReanimatedTopTab/ReanimatedTabView.js.map +1 -0
- package/lib/commonjs/components/ReanimatedTopTab/types.js +8 -0
- package/lib/commonjs/components/ReanimatedTopTab/types.js.map +1 -0
- package/lib/commonjs/components/elements/TabBarBaseComponent.js +71 -0
- package/lib/commonjs/components/elements/TabBarBaseComponent.js.map +1 -0
- package/lib/commonjs/components/elements/TabBarLabelBaseComponent.js +48 -0
- package/lib/commonjs/components/elements/TabBarLabelBaseComponent.js.map +1 -0
- package/lib/commonjs/components/wrappers/GestureWrapper.js +100 -0
- package/lib/commonjs/components/wrappers/GestureWrapper.js.map +1 -0
- package/lib/commonjs/components/wrappers/ScreenWrapper.js +34 -0
- package/lib/commonjs/components/wrappers/ScreenWrapper.js.map +1 -0
- package/lib/commonjs/components/wrappers/ScrollView.js +58 -0
- package/lib/commonjs/components/wrappers/ScrollView.js.map +1 -0
- package/lib/commonjs/context/TopTabContext.hooks.js +48 -0
- package/lib/commonjs/context/TopTabContext.hooks.js.map +1 -0
- package/lib/commonjs/context/TopTabContext.js +86 -0
- package/lib/commonjs/context/TopTabContext.js.map +1 -0
- package/lib/commonjs/hooks/TopTab.hooks.js +120 -0
- package/lib/commonjs/hooks/TopTab.hooks.js.map +1 -0
- package/lib/commonjs/index.js +92 -0
- package/lib/commonjs/index.js.map +1 -0
- package/lib/commonjs/navigator/createReanimatedTopTabNavigator.js +141 -0
- package/lib/commonjs/navigator/createReanimatedTopTabNavigator.js.map +1 -0
- package/lib/commonjs/types.js +8 -0
- package/lib/commonjs/types.js.map +1 -0
- package/lib/module/components/ReanimatedTopTab/AnimationHelper.js +72 -0
- package/lib/module/components/ReanimatedTopTab/AnimationHelper.js.map +1 -0
- package/lib/module/components/ReanimatedTopTab/ReanimatedTabView.js +119 -0
- package/lib/module/components/ReanimatedTopTab/ReanimatedTabView.js.map +1 -0
- package/lib/module/components/ReanimatedTopTab/types.js +4 -0
- package/lib/module/components/ReanimatedTopTab/types.js.map +1 -0
- package/lib/module/components/elements/TabBarBaseComponent.js +64 -0
- package/lib/module/components/elements/TabBarBaseComponent.js.map +1 -0
- package/lib/module/components/elements/TabBarLabelBaseComponent.js +41 -0
- package/lib/module/components/elements/TabBarLabelBaseComponent.js.map +1 -0
- package/lib/module/components/wrappers/GestureWrapper.js +94 -0
- package/lib/module/components/wrappers/GestureWrapper.js.map +1 -0
- package/lib/module/components/wrappers/ScreenWrapper.js +28 -0
- package/lib/module/components/wrappers/ScreenWrapper.js.map +1 -0
- package/lib/module/components/wrappers/ScrollView.js +52 -0
- package/lib/module/components/wrappers/ScrollView.js.map +1 -0
- package/lib/module/context/TopTabContext.hooks.js +44 -0
- package/lib/module/context/TopTabContext.hooks.js.map +1 -0
- package/lib/module/context/TopTabContext.js +82 -0
- package/lib/module/context/TopTabContext.js.map +1 -0
- package/lib/module/hooks/TopTab.hooks.js +110 -0
- package/lib/module/hooks/TopTab.hooks.js.map +1 -0
- package/lib/module/index.js +11 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/navigator/createReanimatedTopTabNavigator.js +134 -0
- package/lib/module/navigator/createReanimatedTopTabNavigator.js.map +1 -0
- package/lib/module/types.js +4 -0
- package/lib/module/types.js.map +1 -0
- package/lib/typescript/commonjs/package.json +1 -0
- package/lib/typescript/commonjs/src/components/ReanimatedTopTab/AnimationHelper.d.ts +11 -0
- package/lib/typescript/commonjs/src/components/ReanimatedTopTab/AnimationHelper.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/components/ReanimatedTopTab/ReanimatedTabView.d.ts +14 -0
- package/lib/typescript/commonjs/src/components/ReanimatedTopTab/ReanimatedTabView.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/components/ReanimatedTopTab/types.d.ts +30 -0
- package/lib/typescript/commonjs/src/components/ReanimatedTopTab/types.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/components/elements/TabBarBaseComponent.d.ts +24 -0
- package/lib/typescript/commonjs/src/components/elements/TabBarBaseComponent.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/components/elements/TabBarLabelBaseComponent.d.ts +8 -0
- package/lib/typescript/commonjs/src/components/elements/TabBarLabelBaseComponent.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/components/wrappers/GestureWrapper.d.ts +2 -0
- package/lib/typescript/commonjs/src/components/wrappers/GestureWrapper.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/components/wrappers/ScreenWrapper.d.ts +6 -0
- package/lib/typescript/commonjs/src/components/wrappers/ScreenWrapper.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/components/wrappers/ScrollView.d.ts +6 -0
- package/lib/typescript/commonjs/src/components/wrappers/ScrollView.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/context/TopTabContext.d.ts +4 -0
- package/lib/typescript/commonjs/src/context/TopTabContext.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/context/TopTabContext.hooks.d.ts +5 -0
- package/lib/typescript/commonjs/src/context/TopTabContext.hooks.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/hooks/TopTab.hooks.d.ts +33 -0
- package/lib/typescript/commonjs/src/hooks/TopTab.hooks.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/index.d.ts +10 -0
- package/lib/typescript/commonjs/src/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/navigator/createReanimatedTopTabNavigator.d.ts +4 -0
- package/lib/typescript/commonjs/src/navigator/createReanimatedTopTabNavigator.d.ts.map +1 -0
- package/lib/typescript/commonjs/src/types.d.ts +56 -0
- package/lib/typescript/commonjs/src/types.d.ts.map +1 -0
- package/lib/typescript/module/package.json +1 -0
- package/lib/typescript/module/src/components/ReanimatedTopTab/AnimationHelper.d.ts +11 -0
- package/lib/typescript/module/src/components/ReanimatedTopTab/AnimationHelper.d.ts.map +1 -0
- package/lib/typescript/module/src/components/ReanimatedTopTab/ReanimatedTabView.d.ts +14 -0
- package/lib/typescript/module/src/components/ReanimatedTopTab/ReanimatedTabView.d.ts.map +1 -0
- package/lib/typescript/module/src/components/ReanimatedTopTab/types.d.ts +30 -0
- package/lib/typescript/module/src/components/ReanimatedTopTab/types.d.ts.map +1 -0
- package/lib/typescript/module/src/components/elements/TabBarBaseComponent.d.ts +24 -0
- package/lib/typescript/module/src/components/elements/TabBarBaseComponent.d.ts.map +1 -0
- package/lib/typescript/module/src/components/elements/TabBarLabelBaseComponent.d.ts +8 -0
- package/lib/typescript/module/src/components/elements/TabBarLabelBaseComponent.d.ts.map +1 -0
- package/lib/typescript/module/src/components/wrappers/GestureWrapper.d.ts +2 -0
- package/lib/typescript/module/src/components/wrappers/GestureWrapper.d.ts.map +1 -0
- package/lib/typescript/module/src/components/wrappers/ScreenWrapper.d.ts +6 -0
- package/lib/typescript/module/src/components/wrappers/ScreenWrapper.d.ts.map +1 -0
- package/lib/typescript/module/src/components/wrappers/ScrollView.d.ts +6 -0
- package/lib/typescript/module/src/components/wrappers/ScrollView.d.ts.map +1 -0
- package/lib/typescript/module/src/context/TopTabContext.d.ts +4 -0
- package/lib/typescript/module/src/context/TopTabContext.d.ts.map +1 -0
- package/lib/typescript/module/src/context/TopTabContext.hooks.d.ts +5 -0
- package/lib/typescript/module/src/context/TopTabContext.hooks.d.ts.map +1 -0
- package/lib/typescript/module/src/hooks/TopTab.hooks.d.ts +33 -0
- package/lib/typescript/module/src/hooks/TopTab.hooks.d.ts.map +1 -0
- package/lib/typescript/module/src/index.d.ts +10 -0
- package/lib/typescript/module/src/index.d.ts.map +1 -0
- package/lib/typescript/module/src/navigator/createReanimatedTopTabNavigator.d.ts +4 -0
- package/lib/typescript/module/src/navigator/createReanimatedTopTabNavigator.d.ts.map +1 -0
- package/lib/typescript/module/src/types.d.ts +56 -0
- package/lib/typescript/module/src/types.d.ts.map +1 -0
- package/package.json +204 -0
- package/src/components/ReanimatedTopTab/AnimationHelper.ts +94 -0
- package/src/components/ReanimatedTopTab/ReanimatedTabView.tsx +200 -0
- package/src/components/ReanimatedTopTab/types.ts +29 -0
- package/src/components/elements/TabBarBaseComponent.tsx +99 -0
- package/src/components/elements/TabBarLabelBaseComponent.tsx +63 -0
- package/src/components/wrappers/GestureWrapper.tsx +135 -0
- package/src/components/wrappers/ScreenWrapper.tsx +27 -0
- package/src/components/wrappers/ScrollView.tsx +59 -0
- package/src/context/TopTabContext.hooks.ts +55 -0
- package/src/context/TopTabContext.tsx +115 -0
- package/src/hooks/TopTab.hooks.ts +112 -0
- package/src/index.tsx +15 -0
- package/src/navigator/createReanimatedTopTabNavigator.tsx +192 -0
- package/src/types.ts +63 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2024 irion94
|
|
4
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
5
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
6
|
+
in the Software without restriction, including without limitation the rights
|
|
7
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
8
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
9
|
+
furnished to do so, subject to the following conditions:
|
|
10
|
+
|
|
11
|
+
The above copyright notice and this permission notice shall be included in all
|
|
12
|
+
copies or substantial portions of the Software.
|
|
13
|
+
|
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
15
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
16
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
17
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
18
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
19
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
20
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
# react-navigation-reanimated-top-tabs
|
|
2
|
+
|
|
3
|
+
react-navigation-reanimated-top-tabs
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```sh
|
|
8
|
+
npm install react-navigation-reanimated-top-tabs
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
TODO.
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
## Contributing
|
|
17
|
+
|
|
18
|
+
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
|
|
19
|
+
|
|
20
|
+
## License
|
|
21
|
+
|
|
22
|
+
MIT
|
|
23
|
+
|
|
24
|
+
---
|
|
25
|
+
|
|
26
|
+
Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.AnimationHelper = void 0;
|
|
7
|
+
var _reactNativeReanimated = require("react-native-reanimated");
|
|
8
|
+
const onChange = (event, animationValue, width, navigationState) => {
|
|
9
|
+
'worklet';
|
|
10
|
+
|
|
11
|
+
if (animationValue > 0) {
|
|
12
|
+
return 0;
|
|
13
|
+
}
|
|
14
|
+
const routesLength = navigationState.routes.length - 1;
|
|
15
|
+
if (animationValue < -width * routesLength) {
|
|
16
|
+
return -width * routesLength;
|
|
17
|
+
}
|
|
18
|
+
return animationValue + event.changeX;
|
|
19
|
+
};
|
|
20
|
+
const getIndex = (navigationState, type) => {
|
|
21
|
+
'worklet';
|
|
22
|
+
|
|
23
|
+
if (type === 'increment') {
|
|
24
|
+
return navigationState.index === navigationState.routes.length - 1 ? navigationState.index : navigationState.index + 1;
|
|
25
|
+
}
|
|
26
|
+
return navigationState.index === 0 ? navigationState.index : navigationState.index - 1;
|
|
27
|
+
};
|
|
28
|
+
const onEnd = (event, minimumValueToChangeView, width, navigationState) => {
|
|
29
|
+
'worklet';
|
|
30
|
+
|
|
31
|
+
if (event.velocityX < -200) {
|
|
32
|
+
return {
|
|
33
|
+
index: getIndex(navigationState, 'increment'),
|
|
34
|
+
value: -width * (navigationState.index + 1)
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
if (event.velocityX > 200) {
|
|
38
|
+
return {
|
|
39
|
+
index: getIndex(navigationState, 'decrement'),
|
|
40
|
+
value: -width * (navigationState.index - 1)
|
|
41
|
+
};
|
|
42
|
+
}
|
|
43
|
+
if (event.translationX < 0) {
|
|
44
|
+
if (event.translationX < -minimumValueToChangeView) {
|
|
45
|
+
return {
|
|
46
|
+
index: getIndex(navigationState, 'increment'),
|
|
47
|
+
value: -width * (navigationState.index + 1)
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
if (event.translationX > 0) {
|
|
52
|
+
if (event.translationX > minimumValueToChangeView) {
|
|
53
|
+
return {
|
|
54
|
+
index: getIndex(navigationState, 'decrement'),
|
|
55
|
+
value: -width * (navigationState.index - 1)
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
return {
|
|
60
|
+
index: navigationState.index,
|
|
61
|
+
value: -width * navigationState.index
|
|
62
|
+
};
|
|
63
|
+
};
|
|
64
|
+
const animation = (newValue, duration = 200) => {
|
|
65
|
+
'worklet';
|
|
66
|
+
|
|
67
|
+
return (0, _reactNativeReanimated.withTiming)(newValue, {
|
|
68
|
+
duration
|
|
69
|
+
});
|
|
70
|
+
};
|
|
71
|
+
const AnimationHelper = exports.AnimationHelper = {
|
|
72
|
+
animation,
|
|
73
|
+
onChange,
|
|
74
|
+
onEnd
|
|
75
|
+
};
|
|
76
|
+
//# sourceMappingURL=AnimationHelper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNativeReanimated","require","onChange","event","animationValue","width","navigationState","routesLength","routes","length","changeX","getIndex","type","index","onEnd","minimumValueToChangeView","velocityX","value","translationX","animation","newValue","duration","reanimatedWithTiming","AnimationHelper","exports"],"sourceRoot":"../../../../src","sources":["components/ReanimatedTopTab/AnimationHelper.ts"],"mappings":";;;;;;AAMA,IAAAA,sBAAA,GAAAC,OAAA;AAGA,MAAMC,QAAQ,GAAGA,CACfC,KAEC,EACDC,cAAsB,EACtBC,KAAa,EACbC,eAAuD,KACpD;EACH,SAAS;;EACT,IAAIF,cAAc,GAAG,CAAC,EAAE;IACtB,OAAO,CAAC;EACV;EACA,MAAMG,YAAY,GAAGD,eAAe,CAACE,MAAM,CAACC,MAAM,GAAG,CAAC;EACtD,IAAIL,cAAc,GAAG,CAACC,KAAK,GAAGE,YAAY,EAAE;IAC1C,OAAO,CAACF,KAAK,GAAGE,YAAY;EAC9B;EACA,OAAOH,cAAc,GAAGD,KAAK,CAACO,OAAO;AACvC,CAAC;AAED,MAAMC,QAAQ,GAAGA,CACfL,eAAuD,EACvDM,IAA+B,KAC5B;EACH,SAAS;;EACT,IAAIA,IAAI,KAAK,WAAW,EAAE;IACxB,OAAON,eAAe,CAACO,KAAK,KAAKP,eAAe,CAACE,MAAM,CAACC,MAAM,GAAG,CAAC,GAC9DH,eAAe,CAACO,KAAK,GACrBP,eAAe,CAACO,KAAK,GAAG,CAAC;EAC/B;EACA,OAAOP,eAAe,CAACO,KAAK,KAAK,CAAC,GAC9BP,eAAe,CAACO,KAAK,GACrBP,eAAe,CAACO,KAAK,GAAG,CAAC;AAC/B,CAAC;AAED,MAAMC,KAAK,GAAGA,CACZX,KAA6D,EAC7DY,wBAAgC,EAChCV,KAAa,EACbC,eAAuD,KACpD;EACH,SAAS;;EACT,IAAIH,KAAK,CAACa,SAAS,GAAG,CAAC,GAAG,EAAE;IAC1B,OAAO;MACLH,KAAK,EAAEF,QAAQ,CAACL,eAAe,EAAE,WAAW,CAAC;MAC7CW,KAAK,EAAE,CAACZ,KAAK,IAAIC,eAAe,CAACO,KAAK,GAAG,CAAC;IAC5C,CAAC;EACH;EACA,IAAIV,KAAK,CAACa,SAAS,GAAG,GAAG,EAAE;IACzB,OAAO;MACLH,KAAK,EAAEF,QAAQ,CAACL,eAAe,EAAE,WAAW,CAAC;MAC7CW,KAAK,EAAE,CAACZ,KAAK,IAAIC,eAAe,CAACO,KAAK,GAAG,CAAC;IAC5C,CAAC;EACH;EACA,IAAIV,KAAK,CAACe,YAAY,GAAG,CAAC,EAAE;IAC1B,IAAIf,KAAK,CAACe,YAAY,GAAG,CAACH,wBAAwB,EAAE;MAClD,OAAO;QACLF,KAAK,EAAEF,QAAQ,CAACL,eAAe,EAAE,WAAW,CAAC;QAC7CW,KAAK,EAAE,CAACZ,KAAK,IAAIC,eAAe,CAACO,KAAK,GAAG,CAAC;MAC5C,CAAC;IACH;EACF;EACA,IAAIV,KAAK,CAACe,YAAY,GAAG,CAAC,EAAE;IAC1B,IAAIf,KAAK,CAACe,YAAY,GAAGH,wBAAwB,EAAE;MACjD,OAAO;QACLF,KAAK,EAAEF,QAAQ,CAACL,eAAe,EAAE,WAAW,CAAC;QAC7CW,KAAK,EAAE,CAACZ,KAAK,IAAIC,eAAe,CAACO,KAAK,GAAG,CAAC;MAC5C,CAAC;IACH;EACF;EACA,OAAO;IACLA,KAAK,EAAEP,eAAe,CAACO,KAAK;IAC5BI,KAAK,EAAE,CAACZ,KAAK,GAAGC,eAAe,CAACO;EAClC,CAAC;AACH,CAAC;AAED,MAAMM,SAAS,GAAGA,CAACC,QAAgB,EAAEC,QAAQ,GAAG,GAAG,KAAK;EACtD,SAAS;;EACT,OAAO,IAAAC,iCAAoB,EAACF,QAAQ,EAAE;IAAEC;EAAS,CAAC,CAAC;AACrD,CAAC;AAEM,MAAME,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG;EAC7BJ,SAAS;EACTjB,QAAQ;EACRY;AACF,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ReanimatedTabView = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _reactNativeGestureHandler = require("react-native-gesture-handler");
|
|
10
|
+
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
|
|
11
|
+
var _AnimationHelper = require("./AnimationHelper.js");
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
14
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
15
|
+
const ReanimatedTabView = exports.ReanimatedTabView = /*#__PURE__*/_react.default.memo(({
|
|
16
|
+
LazyPlaceholder = () => null,
|
|
17
|
+
lazy = false,
|
|
18
|
+
navigationState,
|
|
19
|
+
onIndexChange,
|
|
20
|
+
percentageTrigger = 0.4,
|
|
21
|
+
positionInterpolation,
|
|
22
|
+
renderScene,
|
|
23
|
+
renderTabBar
|
|
24
|
+
}) => {
|
|
25
|
+
const {
|
|
26
|
+
width
|
|
27
|
+
} = (0, _reactNative.useWindowDimensions)();
|
|
28
|
+
const loadedScreens = (0, _react.useRef)([navigationState.routes[navigationState.index]]);
|
|
29
|
+
// const width = 160;
|
|
30
|
+
const scrollPosition = (0, _reactNativeReanimated.useSharedValue)(navigationState.index);
|
|
31
|
+
const position = (0, _reactNativeReanimated.useDerivedValue)(() => {
|
|
32
|
+
if (!positionInterpolation) {
|
|
33
|
+
return -scrollPosition.value;
|
|
34
|
+
}
|
|
35
|
+
return (0, _reactNativeReanimated.interpolate)(-scrollPosition.value, positionInterpolation.input, positionInterpolation.output, _reactNativeReanimated.Extrapolation.CLAMP);
|
|
36
|
+
}, [positionInterpolation]);
|
|
37
|
+
(0, _react.useEffect)(() => {
|
|
38
|
+
scrollPosition.value = _AnimationHelper.AnimationHelper.animation(-navigationState.index * width);
|
|
39
|
+
}, [navigationState.index, scrollPosition, width]);
|
|
40
|
+
const minimumValueToChangeView = (0, _react.useMemo)(() => width * percentageTrigger, [percentageTrigger, width]);
|
|
41
|
+
const panGesture = _react.default.useMemo(() => _reactNativeGestureHandler.Gesture.Pan().failOffsetY(-10).failOffsetY(10).activeOffsetX([-20, 20]).onChange(event => {
|
|
42
|
+
scrollPosition.value = _AnimationHelper.AnimationHelper.onChange(event, scrollPosition.value, width, navigationState);
|
|
43
|
+
}).onEnd(event => {
|
|
44
|
+
const state = _AnimationHelper.AnimationHelper.onEnd(event, minimumValueToChangeView, width, navigationState);
|
|
45
|
+
scrollPosition.value = _AnimationHelper.AnimationHelper.animation(state.value);
|
|
46
|
+
(0, _reactNativeReanimated.runOnJS)(onIndexChange)(state.index);
|
|
47
|
+
}), [minimumValueToChangeView, navigationState, onIndexChange, scrollPosition, width]);
|
|
48
|
+
const scrollPositionStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
|
|
49
|
+
transform: [{
|
|
50
|
+
translateX: (0, _reactNativeReanimated.interpolate)(scrollPosition.value, [-width * (navigationState.routes.length - 1), 0], [-width * (navigationState.routes.length - 1), 0], _reactNativeReanimated.Extrapolation.CLAMP)
|
|
51
|
+
}]
|
|
52
|
+
}));
|
|
53
|
+
const jumpTo = _react.default.useCallback(key => {
|
|
54
|
+
const newIndex = navigationState.routes.findIndex(r => r.key === key);
|
|
55
|
+
if (newIndex === -1) {
|
|
56
|
+
// throw
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
scrollPosition.value = _AnimationHelper.AnimationHelper.animation(-newIndex * width);
|
|
60
|
+
onIndexChange(newIndex);
|
|
61
|
+
}, [navigationState.routes, onIndexChange, scrollPosition, width]);
|
|
62
|
+
const chooseRender = (0, _react.useCallback)((params, useRenderScene = true) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
63
|
+
style: {
|
|
64
|
+
width
|
|
65
|
+
},
|
|
66
|
+
children: useRenderScene ? renderScene(params) : LazyPlaceholder()
|
|
67
|
+
}, `RNNTabView_${params.route.key}`), [LazyPlaceholder, renderScene, width]);
|
|
68
|
+
const Routes = (0, _react.useMemo)(() => navigationState.routes.map((route, index) => {
|
|
69
|
+
if (!lazy) {
|
|
70
|
+
return chooseRender({
|
|
71
|
+
jumpTo,
|
|
72
|
+
route
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
const screen = loadedScreens.current.find(loadedScreen => loadedScreen?.key === route.key);
|
|
76
|
+
if (screen !== undefined) {
|
|
77
|
+
return chooseRender({
|
|
78
|
+
jumpTo,
|
|
79
|
+
route
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
if (navigationState.index === index) {
|
|
83
|
+
loadedScreens.current.push(route);
|
|
84
|
+
return chooseRender({
|
|
85
|
+
jumpTo,
|
|
86
|
+
route
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
return chooseRender({
|
|
90
|
+
jumpTo,
|
|
91
|
+
route
|
|
92
|
+
}, false);
|
|
93
|
+
}), [navigationState.routes, navigationState.index, lazy, chooseRender, jumpTo]);
|
|
94
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView, {
|
|
95
|
+
style: defaultStyles.flex,
|
|
96
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
|
|
97
|
+
layout: _reactNativeReanimated.LinearTransition,
|
|
98
|
+
style: defaultStyles.flex,
|
|
99
|
+
children: [renderTabBar ? renderTabBar({
|
|
100
|
+
navigationState,
|
|
101
|
+
position
|
|
102
|
+
}) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector, {
|
|
103
|
+
gesture: panGesture,
|
|
104
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
105
|
+
layout: _reactNativeReanimated.LinearTransition,
|
|
106
|
+
style: [scrollPositionStyle, defaultStyles.flex, {
|
|
107
|
+
width: width * navigationState.routes.length - 1
|
|
108
|
+
}, defaultStyles.viewsContainer],
|
|
109
|
+
children: Routes
|
|
110
|
+
})
|
|
111
|
+
})]
|
|
112
|
+
})
|
|
113
|
+
});
|
|
114
|
+
});
|
|
115
|
+
|
|
116
|
+
//NOTE: purposely use of StyleSheet - simplify migration to library
|
|
117
|
+
const defaultStyles = _reactNative.StyleSheet.create({
|
|
118
|
+
flex: {
|
|
119
|
+
flex: 1
|
|
120
|
+
},
|
|
121
|
+
viewsContainer: {
|
|
122
|
+
flexDirection: 'row'
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
//# sourceMappingURL=ReanimatedTabView.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeGestureHandler","_reactNativeReanimated","_AnimationHelper","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ReanimatedTabView","exports","React","memo","LazyPlaceholder","lazy","navigationState","onIndexChange","percentageTrigger","positionInterpolation","renderScene","renderTabBar","width","useWindowDimensions","loadedScreens","useRef","routes","index","scrollPosition","useSharedValue","position","useDerivedValue","value","interpolate","input","output","Extrapolation","CLAMP","useEffect","AnimationHelper","animation","minimumValueToChangeView","useMemo","panGesture","Gesture","Pan","failOffsetY","activeOffsetX","onChange","event","onEnd","state","runOnJS","scrollPositionStyle","useAnimatedStyle","transform","translateX","length","jumpTo","useCallback","key","newIndex","findIndex","chooseRender","params","useRenderScene","jsx","View","style","children","route","Routes","map","screen","current","find","loadedScreen","undefined","push","GestureHandlerRootView","defaultStyles","flex","jsxs","layout","LinearTransition","GestureDetector","gesture","viewsContainer","StyleSheet","create","flexDirection"],"sourceRoot":"../../../../src","sources":["components/ReanimatedTopTab/ReanimatedTabView.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["ReanimatedTabViewTypes","exports"],"sourceRoot":"../../../../src","sources":["components/ReanimatedTopTab/types.ts"],"mappings":";;;;;;IAGiBA,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA","ignoreList":[]}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.TabBarBaseComponent = void 0;
|
|
7
|
+
var React = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
|
|
10
|
+
var _TopTabHooks = require("../../hooks/TopTab.hooks.js");
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
13
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
14
|
+
const TabBarBaseComponent = ({
|
|
15
|
+
children,
|
|
16
|
+
navigate,
|
|
17
|
+
navigationState,
|
|
18
|
+
position,
|
|
19
|
+
style
|
|
20
|
+
}) => {
|
|
21
|
+
const layout = (0, _reactNative.useWindowDimensions)();
|
|
22
|
+
const {
|
|
23
|
+
topTabHeight,
|
|
24
|
+
transformationX
|
|
25
|
+
} = (0, _TopTabHooks.useTabContext)();
|
|
26
|
+
|
|
27
|
+
//Assign interpolated offsetX to transformationX
|
|
28
|
+
(0, _reactNativeReanimated.useAnimatedReaction)(() => (0, _reactNativeReanimated.interpolate)(position.value, navigationState.routes.map((_, i) => i * layout.width), navigationState.routes.map((_, i) => i), 'clamp'), value => {
|
|
29
|
+
transformationX.value = value;
|
|
30
|
+
}, [navigationState.routes]);
|
|
31
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
|
|
32
|
+
onLayout: ({
|
|
33
|
+
nativeEvent
|
|
34
|
+
}) => {
|
|
35
|
+
topTabHeight.value = nativeEvent.layout.height;
|
|
36
|
+
},
|
|
37
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
38
|
+
style: [styles.wrapper, style],
|
|
39
|
+
children: navigationState.routes.map(route => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
|
|
40
|
+
style: styles.labelWrapper,
|
|
41
|
+
onPress: () => {
|
|
42
|
+
navigate(route);
|
|
43
|
+
},
|
|
44
|
+
children: route.tabBarLabel ? route.tabBarLabel() : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
45
|
+
style: {
|
|
46
|
+
color: 'red'
|
|
47
|
+
},
|
|
48
|
+
children: route.title
|
|
49
|
+
})
|
|
50
|
+
}, route.key))
|
|
51
|
+
}), children]
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
// Static styles
|
|
56
|
+
exports.TabBarBaseComponent = TabBarBaseComponent;
|
|
57
|
+
const styles = _reactNative.StyleSheet.create({
|
|
58
|
+
labelWrapper: {
|
|
59
|
+
flex: 1,
|
|
60
|
+
alignItems: 'center',
|
|
61
|
+
justifyContent: 'center'
|
|
62
|
+
},
|
|
63
|
+
wrapper: {
|
|
64
|
+
width: '100%',
|
|
65
|
+
flexDirection: 'row',
|
|
66
|
+
backgroundColor: 'white',
|
|
67
|
+
paddingVertical: 8,
|
|
68
|
+
height: 50
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
//# sourceMappingURL=TabBarBaseComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["React","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_TopTabHooks","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TabBarBaseComponent","children","navigate","navigationState","position","style","layout","useWindowDimensions","topTabHeight","transformationX","useTabContext","useAnimatedReaction","interpolate","value","routes","map","_","width","jsxs","View","onLayout","nativeEvent","height","jsx","styles","wrapper","route","Pressable","labelWrapper","onPress","tabBarLabel","Text","color","title","key","exports","StyleSheet","create","flex","alignItems","justifyContent","flexDirection","backgroundColor","paddingVertical"],"sourceRoot":"../../../../src","sources":["components/elements/TabBarBaseComponent.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.TabBarLabelBaseComponent = void 0;
|
|
7
|
+
var _reactNative = require("react-native");
|
|
8
|
+
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
|
|
9
|
+
var _TopTabHooks = require("../../hooks/TopTab.hooks.js");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
12
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
13
|
+
const TabBarLabelBaseComponent = ({
|
|
14
|
+
index,
|
|
15
|
+
...props
|
|
16
|
+
}) => {
|
|
17
|
+
const {
|
|
18
|
+
transformationX
|
|
19
|
+
} = (0, _TopTabHooks.useTabContext)();
|
|
20
|
+
const style = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
|
|
21
|
+
backgroundColor: (0, _reactNativeReanimated.interpolateColor)(transformationX.value, [index - 1, index, index + 1], ['transparent', 'blue', 'transparent'])
|
|
22
|
+
}), []);
|
|
23
|
+
const textStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
|
|
24
|
+
color: (0, _reactNativeReanimated.interpolateColor)(transformationX.value, [index - 1, index, index + 1], ['black', 'white', 'black'])
|
|
25
|
+
}), []);
|
|
26
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
27
|
+
style: [style, styles.wrapper],
|
|
28
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.Text, {
|
|
29
|
+
style: [textStyle, styles.text],
|
|
30
|
+
children: props.title
|
|
31
|
+
})
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
exports.TabBarLabelBaseComponent = TabBarLabelBaseComponent;
|
|
35
|
+
const styles = _reactNative.StyleSheet.create({
|
|
36
|
+
text: {
|
|
37
|
+
fontWeight: 'bold',
|
|
38
|
+
textTransform: 'uppercase'
|
|
39
|
+
},
|
|
40
|
+
wrapper: {
|
|
41
|
+
borderRadius: 10,
|
|
42
|
+
height: 35,
|
|
43
|
+
justifyContent: 'center',
|
|
44
|
+
paddingHorizontal: 16,
|
|
45
|
+
paddingVertical: 8
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
//# sourceMappingURL=TabBarLabelBaseComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_reactNativeReanimated","_interopRequireWildcard","_TopTabHooks","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TabBarLabelBaseComponent","index","props","transformationX","useTabContext","style","useAnimatedStyle","backgroundColor","interpolateColor","value","textStyle","color","jsx","View","styles","wrapper","children","Text","text","title","exports","StyleSheet","create","fontWeight","textTransform","borderRadius","height","justifyContent","paddingHorizontal","paddingVertical"],"sourceRoot":"../../../../src","sources":["components/elements/TabBarLabelBaseComponent.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.GestureWrapper = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _reactNativeGestureHandler = require("react-native-gesture-handler");
|
|
9
|
+
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
|
|
10
|
+
var _TopTabHooks = require("../../hooks/TopTab.hooks.js");
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
13
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
14
|
+
//TODO: types
|
|
15
|
+
const GestureWrapper = ({
|
|
16
|
+
children
|
|
17
|
+
}) => {
|
|
18
|
+
const {
|
|
19
|
+
currentScreenIndex,
|
|
20
|
+
currentYPosition,
|
|
21
|
+
gestureEnabled,
|
|
22
|
+
headerHeight,
|
|
23
|
+
screenProperties,
|
|
24
|
+
transformationY,
|
|
25
|
+
screenRefs
|
|
26
|
+
} = (0, _TopTabHooks.useTabContext)();
|
|
27
|
+
const movedY = (0, _reactNativeReanimated.useSharedValue)(0);
|
|
28
|
+
const gestureRef = (0, _react.useRef)(_reactNativeGestureHandler.Gesture.Pan());
|
|
29
|
+
const withTimingConfig = {
|
|
30
|
+
duration: 300,
|
|
31
|
+
easing: _reactNativeReanimated.Easing.bezier(0.25, 0.1, 0.25, 1)
|
|
32
|
+
};
|
|
33
|
+
const [_gestureEnabled, setGestureEnabled] = (0, _react.useState)(gestureEnabled.value);
|
|
34
|
+
(0, _reactNativeReanimated.useAnimatedReaction)(() => gestureEnabled.value, nextValue => {
|
|
35
|
+
(0, _reactNativeReanimated.runOnJS)(setGestureEnabled)(nextValue);
|
|
36
|
+
}, []);
|
|
37
|
+
const _scrollTo = (index, value = 0) => {
|
|
38
|
+
const {
|
|
39
|
+
scrollTo
|
|
40
|
+
} = Object.values(screenRefs.refs.current)[index]?.current ?? {
|
|
41
|
+
scrollTo: () => null
|
|
42
|
+
};
|
|
43
|
+
scrollTo({
|
|
44
|
+
y: value,
|
|
45
|
+
animated: false
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
const gesture = (0, _react.useMemo)(() => _reactNativeGestureHandler.Gesture.Pan().activeOffsetY([-10, 10]).onTouchesMove(({
|
|
49
|
+
state
|
|
50
|
+
}, stateManager) => {
|
|
51
|
+
const current = Object.values(screenProperties).map(({
|
|
52
|
+
scrollY
|
|
53
|
+
}) => scrollY)[currentScreenIndex.value];
|
|
54
|
+
if ((current?.value ?? 0) > 0 && state !== 4 && state !== 3) {
|
|
55
|
+
stateManager.fail();
|
|
56
|
+
}
|
|
57
|
+
}).onUpdate(({
|
|
58
|
+
translationY
|
|
59
|
+
}) => {
|
|
60
|
+
if (translationY <= -headerHeight.value) {
|
|
61
|
+
(0, _reactNativeReanimated.runOnJS)(_scrollTo)(currentScreenIndex.value, Math.abs(translationY + headerHeight.value));
|
|
62
|
+
}
|
|
63
|
+
transformationY.value = currentYPosition.value + translationY - movedY.value;
|
|
64
|
+
}).onEnd(({
|
|
65
|
+
translationY,
|
|
66
|
+
velocityY
|
|
67
|
+
}) => {
|
|
68
|
+
const gestureValue = translationY + velocityY * 0.2;
|
|
69
|
+
const changeOffset = 0.2 * headerHeight.value;
|
|
70
|
+
if (gestureValue < -changeOffset && transformationY.value < 0) {
|
|
71
|
+
transformationY.value = (0, _reactNativeReanimated.withTiming)(-headerHeight.value, withTimingConfig);
|
|
72
|
+
currentYPosition.value = -headerHeight.value;
|
|
73
|
+
} else if (gestureValue > changeOffset) {
|
|
74
|
+
const destination = 0;
|
|
75
|
+
transformationY.value = (0, _reactNativeReanimated.withTiming)(destination, withTimingConfig);
|
|
76
|
+
currentYPosition.value = destination;
|
|
77
|
+
} else {
|
|
78
|
+
transformationY.value = (0, _reactNativeReanimated.withTiming)(currentYPosition.value, withTimingConfig);
|
|
79
|
+
}
|
|
80
|
+
}).onFinalize(() => {
|
|
81
|
+
movedY.value = 0;
|
|
82
|
+
}).simultaneousWithExternalGesture(...Object.values(screenProperties).map(({
|
|
83
|
+
nativeGesture
|
|
84
|
+
}) => nativeGesture)).withRef(gestureRef).enabled(_gestureEnabled), [_gestureEnabled]);
|
|
85
|
+
const style = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
|
|
86
|
+
flex: 1,
|
|
87
|
+
transform: [{
|
|
88
|
+
translateY: (0, _reactNativeReanimated.interpolate)(transformationY.value, [0, -headerHeight.value], [0, -headerHeight.value], 'clamp')
|
|
89
|
+
}]
|
|
90
|
+
}), []);
|
|
91
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector, {
|
|
92
|
+
gesture: gesture,
|
|
93
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
94
|
+
style: style,
|
|
95
|
+
children: children
|
|
96
|
+
})
|
|
97
|
+
});
|
|
98
|
+
};
|
|
99
|
+
exports.GestureWrapper = GestureWrapper;
|
|
100
|
+
//# sourceMappingURL=GestureWrapper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNativeGestureHandler","_reactNativeReanimated","_interopRequireWildcard","_TopTabHooks","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","GestureWrapper","children","currentScreenIndex","currentYPosition","gestureEnabled","headerHeight","screenProperties","transformationY","screenRefs","useTabContext","movedY","useSharedValue","gestureRef","useRef","Gesture","Pan","withTimingConfig","duration","easing","Easing","bezier","_gestureEnabled","setGestureEnabled","useState","value","useAnimatedReaction","nextValue","runOnJS","_scrollTo","index","scrollTo","values","refs","current","y","animated","gesture","useMemo","activeOffsetY","onTouchesMove","state","stateManager","map","scrollY","fail","onUpdate","translationY","Math","abs","onEnd","velocityY","gestureValue","changeOffset","withTiming","destination","onFinalize","simultaneousWithExternalGesture","nativeGesture","withRef","enabled","style","useAnimatedStyle","flex","transform","translateY","interpolate","jsx","GestureDetector","View","exports"],"sourceRoot":"../../../../src","sources":["components/wrappers/GestureWrapper.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ScreenWrapper = void 0;
|
|
7
|
+
var _native = require("@react-navigation/native");
|
|
8
|
+
var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
|
|
9
|
+
var _TopTabHooks = require("../../hooks/TopTab.hooks.js");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
|
+
const ScreenWrapper = ({
|
|
13
|
+
children,
|
|
14
|
+
...viewProps
|
|
15
|
+
}) => {
|
|
16
|
+
const {
|
|
17
|
+
key
|
|
18
|
+
} = (0, _native.useRoute)();
|
|
19
|
+
const {
|
|
20
|
+
screenProperties
|
|
21
|
+
} = (0, _TopTabHooks.useTabContext)();
|
|
22
|
+
const onLayout = event => {
|
|
23
|
+
const screen = screenProperties[key];
|
|
24
|
+
if (!screen) throw 'No screen property registered for this route';
|
|
25
|
+
screen.outerLayout.value = event.nativeEvent.layout;
|
|
26
|
+
};
|
|
27
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.View, {
|
|
28
|
+
...viewProps,
|
|
29
|
+
onLayout: onLayout,
|
|
30
|
+
children: children
|
|
31
|
+
});
|
|
32
|
+
};
|
|
33
|
+
exports.ScreenWrapper = ScreenWrapper;
|
|
34
|
+
//# sourceMappingURL=ScreenWrapper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_native","require","_reactNativeReanimated","_interopRequireDefault","_TopTabHooks","_jsxRuntime","e","__esModule","default","ScreenWrapper","children","viewProps","key","useRoute","screenProperties","useTabContext","onLayout","event","screen","outerLayout","value","nativeEvent","layout","jsx","View","exports"],"sourceRoot":"../../../../src","sources":["components/wrappers/ScreenWrapper.tsx"],"mappings":";;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAEA,IAAAC,sBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,YAAA,GAAAH,OAAA;AAAyD,IAAAI,WAAA,GAAAJ,OAAA;AAAA,SAAAE,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAKlD,MAAMG,aAAa,GAAGA,CAAC;EAC5BC,QAAQ;EACR,GAAGC;AACe,CAAC,KAAK;EACxB,MAAM;IAAEC;EAAI,CAAC,GAAG,IAAAC,gBAAQ,EAAC,CAAC;EAC1B,MAAM;IAAEC;EAAiB,CAAC,GAAG,IAAAC,0BAAa,EAAC,CAAC;EAE5C,MAAMC,QAAQ,GAAIC,KAAwB,IAAK;IAC7C,MAAMC,MAAM,GAAGJ,gBAAgB,CAACF,GAAG,CAAC;IACpC,IAAI,CAACM,MAAM,EAAE,MAAM,8CAA8C;IACjEA,MAAM,CAACC,WAAW,CAACC,KAAK,GAAGH,KAAK,CAACI,WAAW,CAACC,MAAM;EACrD,CAAC;EAED,oBACE,IAAAjB,WAAA,CAAAkB,GAAA,EAACrB,sBAAA,CAAAM,OAAU,CAACgB,IAAI;IAAA,GAAKb,SAAS;IAAEK,QAAQ,EAAEA,QAAS;IAAAN,QAAA,EAChDA;EAAQ,CACM,CAAC;AAEtB,CAAC;AAACe,OAAA,CAAAhB,aAAA,GAAAA,aAAA","ignoreList":[]}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ScrollView = void 0;
|
|
7
|
+
var _reactNative = require("react-native");
|
|
8
|
+
var _reactNativeGestureHandler = require("react-native-gesture-handler");
|
|
9
|
+
var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
|
|
10
|
+
var _TopTabHooks = require("../../hooks/TopTab.hooks.js");
|
|
11
|
+
var _react = require("react");
|
|
12
|
+
var _native = require("@react-navigation/native");
|
|
13
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
|
+
const ScrollView = ({
|
|
16
|
+
children,
|
|
17
|
+
style,
|
|
18
|
+
...props
|
|
19
|
+
}) => {
|
|
20
|
+
const gesture = (0, _TopTabHooks.useScreenGesture)();
|
|
21
|
+
const {
|
|
22
|
+
style: animatedStyle,
|
|
23
|
+
...scrollProps
|
|
24
|
+
} = (0, _TopTabHooks.useScreenScrollable)();
|
|
25
|
+
const {
|
|
26
|
+
innerLayout
|
|
27
|
+
} = (0, _TopTabHooks.useScreenProperties)();
|
|
28
|
+
const {
|
|
29
|
+
screenRefs
|
|
30
|
+
} = (0, _TopTabHooks.useTabContext)();
|
|
31
|
+
const {
|
|
32
|
+
key
|
|
33
|
+
} = (0, _native.useRoute)();
|
|
34
|
+
const _ref = (0, _react.useRef)(null);
|
|
35
|
+
const onLayout = event => {
|
|
36
|
+
innerLayout.value = event.nativeEvent.layout;
|
|
37
|
+
screenRefs.setRef(key, _ref);
|
|
38
|
+
};
|
|
39
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector, {
|
|
40
|
+
gesture: gesture,
|
|
41
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeReanimated.default.ScrollView, {
|
|
42
|
+
...scrollProps,
|
|
43
|
+
...props,
|
|
44
|
+
ref: _ref,
|
|
45
|
+
contentContainerStyle: _style.contentContainerStyle,
|
|
46
|
+
onLayout: onLayout,
|
|
47
|
+
style: [style, animatedStyle],
|
|
48
|
+
children: children
|
|
49
|
+
})
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
exports.ScrollView = ScrollView;
|
|
53
|
+
const _style = _reactNative.StyleSheet.create({
|
|
54
|
+
contentContainerStyle: {
|
|
55
|
+
flexGrow: 1
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
//# sourceMappingURL=ScrollView.js.map
|