In the doc Type Reference it mentions React.ComponentType. In my react 15.6.1 project the following code doesn't compile
// @flow
import React from 'react'
const faded = <P>(componentKlass : React.ComponentType<P>) => class extends React.Component<P> {
render() {
return <div></div>
}
}
export default faded
I was writing a higher-order component following this HOC guide
I don't know where to look for the React.ComponentType, it not here
Another question is can <*> be used to make the Props type inferred?

You need to import React as a namespace or import the type explicitly.
So either import * as React from "react" or import type {ComponentType} from "react".
Changed to
// @flow
import React from 'react';
import type { ComponentType } from 'react';
import { CSSTransitionGroup } from 'react-transition-group';
import './faded.css';
export const FirstChild = (props: any) => {
const children = React.Children.toArray(props.children);
return children[0] || null;
};
const faded = (componentKlass: ComponentType<*>) =>
class extends React.Component<*> {
render() {
return (
<CSSTransitionGroup
transitionName="fade"
transitionAppear={false}
transitionAppearTimeout={1500}
transitionEnter={true}
transitionEnterTimeout={500}
transitionLeaveTimeout={500}
component={FirstChild}
>
{this.props.shouldRender ?
<componentKlass {...this.props} /> : null}
</CSSTransitionGroup>
);
}
};
export default faded;
flow will raise error for <componentKlass {...this.props}/>
Warning: Unknown props
onCancel,cities,shouldRenderontag. ( onCancel&citiesare used by the decorated component.)
After changing it to ComponentKlass it doesn't complain.
After reading
http://www.thedreaming.org/2017/04/28/es6-imports-babel/
https://stackoverflow.com/questions/42051588/wildcard-or-asterisk-vs-named-or-selective-import-es6-javascript
https://stackoverflow.com/questions/32236163/when-to-use-import-as-foo-versus-import-foo
I know that ComponentType is not a property of React(the default export of react).
Here's a related issue: https://github.com/facebook/flow/issues/2630
componentKlass should be capitalized, or be changed toComponents
Most helpful comment
You need to import React as a namespace or import the type explicitly.
So either
import * as React from "react"orimport type {ComponentType} from "react".See https://flow.org/en/docs/react/types/.