Skip to content

Commit 16476b5

Browse files
authored
chore: compatibility with reanimated v2 (#38)
1 parent 56654b1 commit 16476b5

File tree

2 files changed

+15
-3
lines changed

2 files changed

+15
-3
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ yarn add react-native-scroll-bottom-sheet
4040

4141
If you don't use Expo, you also need to install [react-native-gesture-handler](https://github.com/software-mansion/react-native-gesture-handler) and [react-native-reanimated](https://github.com/software-mansion/react-native-reanimated) libraries along with this one.
4242

43-
It's recommended you install a version of gesture handler equal or higher than `1.6.0`, and for reanimated, equal or higher than `1.7.0`. Otherwise you may run into unexpected errors.
43+
It's recommended you install a version of gesture handler equal or higher than `1.6.0`, and for reanimated, equal or higher than `1.7.0`. Otherwise you may run into unexpected errors. This library is also compatible with reanimated 2.x, starting with `react-native-reanimated: 2.0.0-alpha.4`.
4444

4545
## Compatibility table
4646
You may add some touchable components inside the bottom sheet or several `FlatList` widgets for horizontal mode. Unfortunately, not all _interactable_ React Native components are compatible with this library. This is due to some limitations on `react-native-gesture-handler`, which this library uses behind the scenes. For that, please follow this compatibility table:

src/index.tsx

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,14 @@ import Animated, {
2828
Clock,
2929
clockRunning,
3030
cond,
31-
Easing,
31+
Easing as EasingDeprecated,
32+
// @ts-ignore: this property is only present in Reanimated 2
33+
EasingNode,
3234
eq,
3335
event,
3436
Extrapolate,
3537
greaterOrEq,
3638
greaterThan,
37-
interpolate,
3839
multiply,
3940
not,
4041
onChange,
@@ -55,6 +56,17 @@ import {
5556
} from 'react-native-gesture-handler';
5657
import { Assign } from 'utility-types';
5758

59+
const {
60+
interpolate: interpolateDeprecated,
61+
// @ts-ignore: this property is only present in Reanimated 2
62+
interpolateNode,
63+
} = Animated;
64+
65+
const interpolate: typeof interpolateDeprecated =
66+
interpolateNode ?? interpolateDeprecated;
67+
68+
const Easing: typeof EasingDeprecated = EasingNode ?? EasingDeprecated;
69+
5870
const FlatListComponentType = 'FlatList' as const;
5971
const ScrollViewComponentType = 'ScrollView' as const;
6072
const SectionListComponentType = 'SectionList' as const;

0 commit comments

Comments
 (0)