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
This commit is contained in:
Tim Yung
2019-11-03 18:00:15 -08:00
committed by Facebook Github Bot
parent 66e72bb4e0
commit e22946c25a
3 changed files with 7 additions and 10 deletions
@@ -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(
@@ -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({
@@ -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;
};