From e22946c25a91c8dcd15876495ded024b360163db Mon Sep 17 00:00:00 2001
From: Tim Yung <yungsters@fb.com>
Date: Sun, 3 Nov 2019 18:00:15 -0800
Subject: [PATCH] Animated: Update Abstract Component Flow Type

Summary:
Updates the return type of `createAnimatedComponent` to reflect the new behavior (where we forward the ref to the internal component).

I also improved the type annotation for `Props` so that we can still enforce that only valid prop names are supplied. (We still do not check the prop values because we do not currently have a good strategy for typing the "animated versions" of those.)

Changelog:
[General] [Changed] - Flow types for Animated components now validates prop names and yields the new component instance.

Reviewed By: TheSavior

Differential Revision: D18290473

fbshipit-source-id: 8c629ab6aff009ebe6dabca1683c99a357869977
---
 Libraries/Animated/src/createAnimatedComponent.js   | 13 +++++--------
 RNTester/js/examples/FlatList/FlatListExample.js    |  2 +-
 .../js/examples/SectionList/SectionListExample.js   |  2 +-
 3 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/Libraries/Animated/src/createAnimatedComponent.js b/Libraries/Animated/src/createAnimatedComponent.js
index 4c0dc34c0f4..4a47ce6203e 100644
--- a/Libraries/Animated/src/createAnimatedComponent.js
+++ b/Libraries/Animated/src/createAnimatedComponent.js
@@ -17,15 +17,12 @@ const React = require('react');
 const invariant = require('invariant');
 const setAndForwardRef = require('../../Utilities/setAndForwardRef');
 
-export type AnimatedComponentType<Props, Instance> = React.AbstractComponent<
-  any,
-  $ReadOnly<{
-    setNativeProps: Object => void,
-    getNode: () => React.ElementRef<React.AbstractComponent<Props, Instance>>,
-  }>,
->;
+export type AnimatedComponentType<
+  Props: {+[string]: mixed},
+  Instance,
+> = React.AbstractComponent<$ObjMap<Props, () => any>, Instance>;
 
-function createAnimatedComponent<Props, Instance>(
+function createAnimatedComponent<Props: {+[string]: mixed}, Instance>(
   Component: React.AbstractComponent<Props, Instance>,
 ): AnimatedComponentType<Props, Instance> {
   invariant(
diff --git a/RNTester/js/examples/FlatList/FlatListExample.js b/RNTester/js/examples/FlatList/FlatListExample.js
index e71b9acd6d4..e241652f764 100644
--- a/RNTester/js/examples/FlatList/FlatListExample.js
+++ b/RNTester/js/examples/FlatList/FlatListExample.js
@@ -247,7 +247,7 @@ class FlatListExample extends React.PureComponent<Props, State> {
     this._listRef.getNode().recordInteraction();
     pressItem(this, key);
   };
-  _listRef: Animated.FlatList;
+  _listRef: React.ElementRef<typeof Animated.FlatList>;
 }
 
 const styles = StyleSheet.create({
diff --git a/RNTester/js/examples/SectionList/SectionListExample.js b/RNTester/js/examples/SectionList/SectionListExample.js
index 3046602e30f..193c9eb7da8 100644
--- a/RNTester/js/examples/SectionList/SectionListExample.js
+++ b/RNTester/js/examples/SectionList/SectionListExample.js
@@ -92,7 +92,7 @@ class SectionListExample extends React.PureComponent<{}, $FlowFixMeState> {
     {useNativeDriver: true},
   );
 
-  _sectionListRef: Animated.SectionList;
+  _sectionListRef: React.ElementRef<typeof Animated.SectionList>;
   _captureRef = ref => {
     this._sectionListRef = ref;
   };