diff --git a/packages/material-ui-styles/src/withStyles/withStyles.d.ts b/packages/material-ui-styles/src/withStyles/withStyles.d.ts index 3bd02d7900e150..9cfe360fe6640c 100644 --- a/packages/material-ui-styles/src/withStyles/withStyles.d.ts +++ b/packages/material-ui-styles/src/withStyles/withStyles.d.ts @@ -9,6 +9,8 @@ export {}; type JSSFontface = CSS.FontFace & { fallbacks?: CSS.FontFace[] }; +type PropsFunc = (props: Props) => T; + /** * Allows the user to augment the properties available */ @@ -29,7 +31,7 @@ export interface CSSProperties extends BaseCSSProperties { } export type BaseCreateCSSProperties = { - [P in keyof BaseCSSProperties]: BaseCSSProperties[P] | ((props: Props) => BaseCSSProperties[P]) + [P in keyof BaseCSSProperties]: BaseCSSProperties[P] | PropsFunc }; export interface CreateCSSProperties @@ -55,7 +57,7 @@ export type StyleRules // JSS property bag based on props - | ((props: Props) => CreateCSSProperties) + | PropsFunc> >; /** diff --git a/packages/material-ui-styles/test/styles.spec.tsx b/packages/material-ui-styles/test/styles.spec.tsx index 03bcc37a288ab6..0219868b3d838b 100644 --- a/packages/material-ui-styles/test/styles.spec.tsx +++ b/packages/material-ui-styles/test/styles.spec.tsx @@ -455,14 +455,14 @@ function forwardRefTest() { // If there are no props, use the definition that doesn't accept them // https://github.com/mui-org/material-ui/issues/16198 - // $ExpectType Record<"root", CSSProperties | CreateCSSProperties<{}> | ((props: {}) => CreateCSSProperties<{}>)> + // $ExpectType Record<"root", CSSProperties | CreateCSSProperties<{}> | PropsFunc<{}, CreateCSSProperties<{}>>> const styles = createStyles({ root: { width: 1, }, }); - // $ExpectType Record<"root", CSSProperties | CreateCSSProperties<{}> | ((props: {}) => CreateCSSProperties<{}>)> + // $ExpectType Record<"root", CSSProperties | CreateCSSProperties<{}> | PropsFunc<{}, CreateCSSProperties<{}>>> const styles2 = createStyles({ root: () => ({ width: 1, @@ -473,7 +473,7 @@ function forwardRefTest() { foo: boolean; } - // $ExpectType Record<"root", CSSProperties | CreateCSSProperties | ((props: testProps) => CreateCSSProperties)> + // $ExpectType Record<"root", CSSProperties | CreateCSSProperties | PropsFunc>> const styles3 = createStyles({ root: (props: testProps) => ({ width: 1,