index.js.flow

// @flow
import * as React from 'react';

export type ClassComponent<Props, State> =
  Class<React.Component<Props, State>>;

export type ClassComponentWithDefaultProps<DefaultProps, Props, State> =
  ClassComponent<Props, State> & {defaultProps: DefaultProps};

export type ComponentWithDefaultProps<DefaultProps, Props> =
  React.ComponentType<Props> & {defaultProps: DefaultProps};

/**
 * Here is a generic type for HOCs:
 *
 * It takes two type parameters: RequiredProps and ProvidedProps
 *
 * RequiredProps: The final wrapped component will need RequiredProps, in addition to its own props
 * ProvidedProps: The final wrapped component will not need ProvidedProps, because the HOC will provide them to the inner component
 */

export type HigherOrderComponent<RequiredProps, ProvidedProps> =
  & (
    <Props, DefaultProps>(component: ComponentWithDefaultProps<DefaultProps, ProvidedProps & Props>) =>
      React.ComponentType<
        // Merge in RequiredProps
        & RequiredProps
        // Props, with diffed-out default props. Make sure to merge with ProvidedProps to work with
        // $Diff constraints in nested HoCs.
        & $Diff<ProvidedProps & Props, DefaultProps & ProvidedProps>
        // Force props to be in the shape of all potential props (effectively allows properly-typed
        // overrides of DefaultProps)
        & $Shape<RequiredProps & DefaultProps & Props>
      >
    )
  & (<Props>(component: React.StatelessFunctionalComponent<ProvidedProps & Props>) => React.ComponentType<RequiredProps & Props>)
  & (<Props>(component: React.ComponentType<ProvidedProps & Props>) => React.ComponentType<RequiredProps & Props>)