TabsProps.onChange TypeScript type is unsatisfiable/incorrect

[davidmfoley]

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

The typescript type for TabsProps<{}>.onChange is as follows:
((event: ChangeEvent<{}>, value: any) => void) & ((event: FormEvent<HTMLButtonElement>) => void)

This seems incorrect, since it is an intersection type of two function types with different signatures.

I believe this was introduced in this commit:

225badb#diff-c95eab2a6e6470acd8e136b01b514471R42

Expected Behavior 🤔

I think that the left type in the intersection (((event: ChangeEvent<{}>, value: any) => void)) is correct.

Steps to Reproduce 🕹

1. Upgrade a TypeScript app that uses Tabs with an onChange handler to @material-ui/types 4.1.1

Your Environment 🌎

@material-ui/types: 4.1.1

[eps1lon]

Could you include code that passes typescript but should be rejected? Or is there code that is rejected that should pass in your opinion?

[davidmfoley]

This worked with previous versions:

const MyTabs: React.FC<TabsProps> = props => <Tabs {...props} />
const ShouldWork = () => <MyTabs onChange={(e: unknown, value: any) => {}} />

[thinksaydo]

Same problem here since 4.4.1 and newer. ((event: ChangeEvent<{}>, value: any) => void) & ((event: FormEvent<HTMLButtonElement>) isn't the correct type for this. Should be just (event: ChangeEvent<{}>, value: any) => void

[thinksaydo]

I found that I'm only getting this error when using TabProps while wrapping the Tabs component.

[oliviertassinari]

I believe it's a duplicate of #17454.