[feat] Add reanimated scroll view

Author: robgraeber

package.json

@@ -67,11 +67,13 @@
     "react": "18.2.0",
     "react-native": "0.73.4",
     "react-native-builder-bob": "^0.20.0",
+    "react-native-reanimated": "^3.17.5",
     "typescript": "^5.5.4"
   },
   "peerDependencies": {
     "react": "*",
-    "react-native": "*"
+    "react-native": "*",
+    "react-native-reanimated": "*"
   },
   "workspaces": [
     "example"
@@ -130,4 +132,4 @@
   "directories": {
     "example": "example"
   }
-}
+}

src/responsive-grid/index.tsx

@@ -2,11 +2,12 @@
 /* eslint-disable react-native/no-inline-styles */
 
 import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { ScrollView, View } from 'react-native';
+import { View } from 'react-native';
 import type { ResponsiveGridProps, TileItem } from './types';
 import { calcResponsiveGrid } from './calc-responsive-grid';
 import type { NativeSyntheticEvent, NativeScrollEvent } from 'react-native';
 import useThrottle from '../hooks/use-throttle';
+import Animated from 'react-native-reanimated';
 import { renderPropComponent } from '../libs/render-prop-component';
 
 export const ResponsiveGrid: React.FC<ResponsiveGridProps> = ({
@@ -155,7 +156,7 @@ export const ResponsiveGrid: React.FC<ResponsiveGridProps> = ({
         setContainerSize({ width, height });
       }}
     >
-      <ScrollView
+      <Animated.ScrollView
         onScroll={onScroll}
         contentContainerStyle={{
           height: sumScrollViewHeight || '100%',
@@ -195,7 +196,7 @@ export const ResponsiveGrid: React.FC<ResponsiveGridProps> = ({
         >
           {renderPropComponent(FooterComponent)}
         </View>
-      </ScrollView>
+      </Animated.ScrollView>
     </View>
   );
 };