Skip to content

Commit 090e822

Browse files
litinskiim-bertCopilot
authored
SwipeableProps from RefObject to Ref (#3759)
# Fix ReanimatedSwipeable ref type to support ref callbacks ## Description This PR fixes the `ref` prop type in `ReanimatedSwipeableProps` to support both ref objects and ref callbacks, improving TypeScript compatibility and developer experience. ## Changes - Changed `ref?: React.RefObject<SwipeableMethods | null>` to `ref?: React.Ref<SwipeableMethods | null>` in `ReanimatedSwipeableProps` interface ## Motivation The current implementation only supports `React.RefObject` which limits developers to using `useRef()` hook. By changing to `React.Ref`, the component now supports: 1. **Ref objects** (`useRef()`) 2. **Ref callbacks** (function refs) This change aligns with React's best practices and provides more flexibility for developers when working with refs. ## Example Usage ### Before (only ref objects) ```tsx const swipeableRef = useRef<SwipeableMethods>(null); <ReanimatedSwipeable ref={swipeableRef}> {/* content */} </ReanimatedSwipeable> ``` ### After (supports both ref objects and callbacks) ```tsx // Ref object const swipeableRef = useRef<SwipeableMethods>(null); // Ref callback const handleRef = (ref: SwipeableMethods | null) => { // Custom logic }; <ReanimatedSwipeable ref={swipeableRef}> {/* content */} </ReanimatedSwipeable> <ReanimatedSwipeable ref={handleRef}> {/* content */} </ReanimatedSwipeable> ``` ## Type Safety This change maintains full TypeScript type safety while expanding the supported ref patterns. The `React.Ref<T>` type is a union type that includes: - `React.RefObject<T>` - `React.RefCallback<T>` ## Breaking Changes None. This is a backward-compatible change that only expands the supported ref types. ## Testing - [x] Existing tests pass - [x] TypeScript compilation succeeds - [x] Both ref object and ref callback patterns work correctly ## Related Issues Fixes the limitation where developers could only use `useRef()` with ReanimatedSwipeable components. --------- Co-authored-by: Michał <michal.bert@swmansion.com> Co-authored-by: Michał Bert <63123542+m-bert@users.noreply.github.com> Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
1 parent fd49a39 commit 090e822

1 file changed

Lines changed: 1 addition & 1 deletion

File tree

packages/react-native-gesture-handler/src/components/ReanimatedSwipeable/ReanimatedSwipeableProps.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export interface SwipeableProps {
1313
/**
1414
*
1515
*/
16-
ref?: React.RefObject<SwipeableMethods | null>;
16+
ref?: React.Ref<SwipeableMethods>;
1717

1818
/**
1919
* Sets a `testID` property, allowing for querying `ReanimatedSwipeable` for it in tests.

0 commit comments

Comments
 (0)