chore: Add React 19 support #7055
Conversation
… be undefined to call that`
| @@ -44,7 +44,7 @@ function createAnimatedComponent<P extends object>( | |||
|
|
|||
| #### `component` | |||
|
|
|||
| The component you want to make animatable. Function components have to be wrapped with `React.forwardRef()`. | |||
| The component you want to make animatable. | |||
There was a problem hiding this comment.
Let's ship the docs in a separate PR after we release this change.
Also we should probably mark it that you need forwardRef for reanimated >3.17
There was a problem hiding this comment.
Yes! Was think about it
| @@ -113,13 +113,13 @@ const FlatListForwardRefRender = function <Item = any>( | |||
| ); | |||
| }; | |||
|
|
|||
| export const ReanimatedFlatList = forwardRef(FlatListForwardRefRender) as < | |||
| export const ReanimatedFlatList = FlatListRender as < | |||
There was a problem hiding this comment.
If I understand correctly, we can't yet commit these changes, since React 19 is only available in React Native 0.78. We have to keep backwards compatibility (at the moment) for at least React Native 0.76, which still has React 18.
There was a problem hiding this comment.
I talked with @piaskowyk to release this full React 19 support to Reanimated 4, and React 19 support with backward compatibility for 3.17.x, so user could use either 0.78 or for example 0.77, 0.76 with no problem - i'm currently working on it
It'll be similiar to this but without removing forwardRef and .Provider (only change from React 19 is the useRef() will have initial value). Further changes probably will include guard that would check if is React 19, similiary as GH did it.
Summary
This PR bumps React to 19 for Reanimated4, and make necessary changes according to React release notes.
Most importantly:
forwardRef, we can now access ref as a propuseRefneed an initial argument - mostly we usednullTest plan
It'll be tested thoroughly in #7065 as it add RN 0.78 and has diverged from this branch. After #7065 is merged, the best way to test it is to launch Reanimated app on fabric (ios, android) and web and check if it works.