FlatList & Ref types

[m-bert]

Description

This PR fixes 2 type issues that were reported via private channel:

1. Type 'FlatList' is not generic
2. Type 'Ref' is not assignable to type 'RefObject<ScrollView | null> | undefined'

Test plan

yarn ts-check

Tested on the following code

import React, { forwardRef, useEffect, useRef } from 'react';
import { Text } from 'react-native';
import {
  FlatList,
  GestureHandlerRootView,
  ScrollView,
} from 'react-native-gesture-handler';

interface MyComponentProps {
  title: string;
}

const MyCustomScrollView = forwardRef<ScrollView, MyComponentProps>(
  (props, ref) => {
    return (
      <ScrollView ref={ref} style={{ flex: 1 }}>
        <Text>{props.title}</Text>
      </ScrollView>
    );
  }
);

export default function App() {
  const scrollViewRef = useRef<ScrollView>(null);
  const flatListRef = useRef<FlatList<number>>(null);

  useEffect(() => {
    setTimeout(() => {
      console.log(scrollViewRef, flatListRef);
    }, 1000);
  });

  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <MyCustomScrollView ref={scrollViewRef} title="Hello, World!" />
    </GestureHandlerRootView>
  );
}

[Copilot]

Pull request overview

This PR addresses TypeScript typing issues in the v3 gesture-handler component/type wrappers to improve ref and FlatList generic compatibility for consumers.

Changes:

• Widen NativeWrapperProperties’ ref type from React.RefObject<T> to React.Ref<T> to support forwarded refs and callback refs.
• Make the exported FlatList type alias generic (FlatList<ItemT>) so consumers can write useRef<FlatList<number>>(...).

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File	Description
packages/react-native-gesture-handler/src/v3/types/NativeWrapperType.ts	Broadens wrapper ref typing to accept standard React ref shapes.
packages/react-native-gesture-handler/src/v3/components/GestureComponents.tsx	Updates the exported FlatList type alias to be generic over item type.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.