Can't type props of createStyles/makeStyles while still inferring class names

[levrik]

It's not possible to type props of createStyles or makeStyles while still inferring the class names.

• 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 😯

Using makeStyles<Theme, SomeProps> will result in Record<string, string> as it's return-value.
I don't have to even try createStyles since the class names come as the first generic type and are not optional.

Expected Behavior 🤔

To be able to type props of makeStyles or createStyles without loosing inference of the class names.

Steps to Reproduce 🕹

https://codesandbox.io/s/elated-river-kzgm5

Your Environment 🌎

Tech	Version
Material-UI	v4.9.5
TypeScript	3.7.5

[eps1lon]

makeStyles with two generic params expects the ClassKey as the second param:
export default function makeStyles<Theme = DefaultTheme, ClassKey extends string = string>

If you specify the Theme you also have to specify ClassKey. Otherwise TypeScript will fallback to the default which is string.

- const useStyles2 = makeStyles<Theme, {}>(() =>
+const useStyles2 = makeStyles((theme: Theme) =>

Generally you don't need to use the generic arguments. By specifying them explicitly you errors closer to the origin and full inference.

[levrik]

@eps1lon I think you misunderstood. I want to pass props to useStyles that are used inside the stylesheet. I want to type these. But it doesn't seem to be possible to type these without having to define them manually.

[eps1lon]

But it doesn't seem to be possible to type these without having to define them manually.

makeStyles<Theme, ClassKey, Props> if you prefer this syntax. You have to decide though in TypeScript. Either use inference or type each generic argument. There is no middleground in TypeScript. If you're interested in this feature please subscribe to microsoft/TypeScript#26242

[levrik]

@eps1lon But I don't see a way of getting the props typed by inference or am I missing something here?

[eps1lon]

I think you get better help on StackOverflow. Maybe https://github.com/mui-org/material-ui/blob/79d90997d49b0cb07bf61999e5c3ed985a914e35/packages/material-ui-styles/test/styles.spec.tsx#L431-L452 already helps?