redux-form/lib/FieldProps.types.js.flow

A higher order component decorator for forms using Redux and React

// @flow
import type { Dispatch } from 'redux'
import type { Event, Validator } from './types'
import type { ComponentType, ElementRef } from 'react'

type FieldTypeProps = {
  type: 'radio',
  value: any, // mandatory iff type === 'radio'
} | {
  type?: string,
}

export type Props = {
  name: string,

  // this is hard (impossible?) to type strictly - should be ComponentType<FieldProps & Passthrough>
  // where Passthrough is `Props.props & ${any other props passed to the Field component}`
  component: ComponentType<any> | string,

  format?: ?(value: any, name: string) => ?string,
  normalize?: (
    value: any,
    previousValue: any,
    allValues: Object,
    previousAllValues: Object,
    name: string
  ) => ?any,
  onBlur?: (
    event: Event,
    newValue: any,
    previousValue: any,
    name: string
  ) => void,
  onChange?: (
    event: Event,
    newValue: any,
    previousValue: any,
    name: string
  ) => void,
  onDragStart?: (event: Event, name: string) => void,
  onDrop?: (
    event: Event,
    newValue: any,
    previousValue: any,
    name: string
  ) => void,
  onFocus?: (event: Event, name: string) => void,
  parse?: (value: any, name: string) => any,
  props?: Object,
  type?: string,
  validate?: Validator | Validator[],
  warn?: Validator | Validator[],
  forwardRef?: boolean,
  immutableProps?: Array<string>
} & FieldTypeProps

export type InputProps = {
  checked?: boolean,
  name: string,
  onBlur: { (eventOrValue: Event | any): void },
  onChange: { (eventOrValue: Event | any): void },
  onDrop: { (event: Event): void },
  onDragStart: { (event: Event): void },
  onFocus: { (event: Event): void },
  value: any
}

export type FieldProps = {
  input: InputProps,
  meta: {
    active: boolean,
    asyncValidating: boolean,
    autofilled: boolean,
    dirty: boolean,
    dispatch: Dispatch,
    error?: any,
    form: string,
    initial?: any,
    invalid: boolean,
    pristine: boolean,
    submitting: boolean,
    submitFailed: boolean,
    touched: boolean,
    valid: boolean,
    visited: boolean,
    warning?: any
  },
  custom: {
    ref?: ElementRef<any>
  }
}