I am using experimental decorators with TypeScript in React.
The library I'm using for the forms is from Ant Design and the decorator inserts a form property to my component.
I have a Component declaration like this:
interface IProps {
form: any
}
@Form.create()
class Component extends React.Component<IProps> { ... }
Now when I want to use that Component without the form property like so
<Component/>
I get following TS Error
TS2769
No overload matches this call.
Overload 1 of 2, '(props: Readonly): Component', gave the following error. Property 'form' is missing in type '{}' but required in type 'Readonly'.
Overload 2 of 2, '(props: IProps, context?: any): Component', gave the following error. Property 'form' is missing in type '{}' but required in type 'Readonly'.
Now I could just make the form property optional with the ? notation, but its not nice, and when I want to further type form like so
interface IFields {
"name": string;
}
interface IProps extends FormComponentProps<IFields> { ... }
it really becomes unfeasible.
What way do I have to tell TypeScript that the form property is injected via a decorator?