import { forwardRef, type Ref } from "react"; import { ScrollView as NativeScrollView, FlatList as NativeFlatList, type ScrollViewProps, type FlatListProps, } from "react-native"; import { BottomSheetScrollView, BottomSheetFlatList } from "@gorhom/bottom-sheet"; import { ScrollView as GestureScrollView, FlatList as GestureFlatList, type NativeViewGestureHandlerProps, } from "react-native-gesture-handler"; import { isNative } from "@/constants/platform"; import { useIsInsideBottomSheet } from "./bottom-sheet-scope"; // Both libraries forward to the RN FlatList instance. Their published ref types // disagree about getScrollResponder (Gorhom) and include the component function // in the instance intersection (RNGH); keep that type discrepancy at this boundary. const SheetFlatList = BottomSheetFlatList as unknown as typeof NativeFlatList; const HorizontalFlatList = GestureFlatList as unknown as ( props: FlatListProps & NativeViewGestureHandlerProps & { ref?: Ref> }, ) => React.ReactElement; /** The presentation owns gesture integration; callers keep the React Native API. */ export const ScrollView = forwardRef( function ScrollView(props, ref) { const inSheet = useIsInsideBottomSheet(); if (!inSheet) return ; if (props.horizontal) { return isNative ? ( ) : ( ); } return ( {props.children} ); }, ); function SheetAwareFlatList(props: FlatListProps, ref: Ref>) { const inSheet = useIsInsideBottomSheet(); if (!inSheet) return ; if (props.horizontal) { return isNative ? ( ) : ( ); } return ; } // forwardRef erases the item generic. All three implementations expose the RN list methods. export const FlatList = forwardRef(SheetAwareFlatList) as ( props: FlatListProps & { ref?: Ref> }, ) => React.ReactElement;