Pass custom props to Redux Form Field in TypeScript

To pass custom props to Field component of Redux Form, you need to declare an interface of all the props you want to pass.

interface YourCustomProps {
    myProp1: string;
    myProp2: number;
}

Now, use GenericField from Redux Form to make Field as YourCustomField to which you will be able to pass YourCustomProps

import { Field, GenericField } from 'redux-form';

const YourCustomField = Field as new () => GenericField<YourCustomProps>;

Now you can pass custom props to YourCustomField as declared in the interface.

<YourCustomField
    myProp1="Hi"
    myProp2={123}
    component={MaterialTextField}
/>

This way you can pass anything as custom props such as react components as well! :)

After some more experimenting on my side I found a solution to pass custom props:

<Field 
    name="myName"
    props={{
        type: 'text'
    }}
    component={myComponent}
    {...{
        myCustomProps1: 'myCustomProp1',
        myCustomProps2: 'myCustomProp2'
    }}
/>

In myComponent you have your custom props on the root level of your properties:

const myComponent = (props) => {
    return <div>{props.myCustomProp1 + " " props.myCustomProp2}</div>
}