fix: fix and remove recyclerlistview component

Author: howljs

packages/react-native-calendar-kit/src/service/CalendarList/HorizontalVirtualizedList.tsx

@@ -1,5 +1,5 @@
 import React, { useMemo } from 'react';
-import { View } from 'react-native';
+import { View } from './View';
 
 interface HorizontalVirtualizedListProps {
   count: number;
@@ -42,8 +42,7 @@ export const HorizontalVirtualizedList = React.memo(
                 left: relativePosition,
                 width: itemSize,
                 height: '100%',
-              }}
-            >
+              }}>
               {renderItem({ item: i, index: i })}
             </View>
           );
@@ -61,7 +60,6 @@ export const HorizontalVirtualizedList = React.memo(
       itemSize,
     ]);
 
-    // Calculate container transform to handle large offsets
     const firstVisiblePosition =
       visibleRange.start > 0 ? getItemPosition(visibleRange.start) : 0;
 
@@ -71,10 +69,8 @@ export const HorizontalVirtualizedList = React.memo(
           position: 'relative',
           width: totalSize,
           height: '100%',
-          // Use transform to handle large offsets instead of large absolute positions
           transform: [{ translateX: firstVisiblePosition }],
-        }}
-      >
+        }}>
         {renderItems}
       </View>
     );

packages/react-native-calendar-kit/src/service/CalendarList/View.tsx

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { Platform, View as RNView, type ViewProps } from 'react-native';
+
+const RCTView = React.forwardRef<RNView, ViewProps>((props, ref) => {
+  return React.createElement('RCTView', { ...props, ref });
+});
+
+RCTView.displayName = 'RCTView';
+
+export const View =
+  Platform.OS === 'android' || Platform.OS === 'ios' ? RCTView : RNView;

packages/react-native-calendar-kit/src/service/CalendarList/index.tsx

@@ -13,15 +13,16 @@ import {
   type NativeSyntheticEvent,
 } from 'react-native';
 
-import { HorizontalVirtualizedList } from './HorizontalVirtualizedList';
 import { ScrollView } from 'react-native-gesture-handler';
 import Animated, {
   AnimatedRef,
+  runOnJS,
+  useAnimatedReaction,
   useAnimatedRef,
   useScrollViewOffset,
-  useAnimatedReaction,
-  runOnJS,
+  useSharedValue,
 } from 'react-native-reanimated';
+import { HorizontalVirtualizedList } from './HorizontalVirtualizedList';
 
 const AnimatedScrollView = Animated.createAnimatedComponent(ScrollView);
 
@@ -97,12 +98,10 @@ export const CalendarList = React.forwardRef<
   ) => {
     const scrollViewRef = useRef<ScrollView>(null);
     const [viewportWidth, setViewportWidth] = useState(0);
-    const [scrollOffset, setScrollOffset] = useState(0);
+    const [scrollOffset, setScrollOffset] = useState(initialOffset ?? 0);
     const isLoaded = useRef(false);
 
-    const totalSize = useMemo(() => {
-      return count * itemSize;
-    }, [count, itemSize]);
+    const totalSize = count * itemSize;
 
     const visibleRange = useMemo(() => {
       if (viewportWidth === 0 || count === 0) {
@@ -125,7 +124,8 @@ export const CalendarList = React.forwardRef<
     );
 
     const animScrollRef = useAnimatedRef<Animated.ScrollView>();
-    const scrollOffsetAnim = useScrollViewOffset(animScrollRef);
+    const internalOffset = useSharedValue(initialOffset ?? 0);
+    const scrollOffsetAnim = useScrollViewOffset(animScrollRef, internalOffset);
 
     const handleColumnChanged = useCallback(
       (offset: number) => {
@@ -257,6 +257,7 @@ export const CalendarList = React.forwardRef<
         contentContainerStyle={[contentContainerStyle, { width: totalSize }]}
         onScroll={onScroll}
         onLayout={handleLayout}
+        contentOffset={{ x: initialOffset ?? 0, y: 0 }}
         scrollEventThrottle={scrollEventThrottle}
         scrollEnabled={scrollEnabled}
         showsHorizontalScrollIndicator={false}