fix(react-jss/types): fix react default props types support (#1353)

Co-authored-by: Sergey Gavrilov <[email protected]>

Author: vismu

changelog.md

@@ -4,6 +4,10 @@ Since you are interested in what happens next, in case, you work for a for-profi
 
 ---
 
+### Improvements
+
+- [react-jss] add properly react default props types calculation (https://github.com/cssinjs/jss/pull/1353)
+
 ## 10.3.0 (2020-6-10)
 
 ### Improvements

packages/react-jss/src/index.d.ts

@@ -66,21 +66,19 @@ declare function createUseStyles<Theme = DefaultTheme, C extends string = string
   options?: CreateUseStylesOptions<Theme>
 ): (data?: unknown) => Classes<C>
 
+type GetProps<C> = C extends ComponentType<infer P> ? P : never
+
 declare function withStyles<
   ClassNames extends string | number | symbol,
   S extends Styles<ClassNames> | ((theme: any) => Styles<ClassNames>)
 >(
   styles: S,
   options?: WithStylesOptions
-): <
-  Props extends {
-    classes: S extends (theme: any) => Styles<ClassNames>
-      ? Classes<keyof ReturnType<S>>
-      : Classes<ClassNames>
-  }
->(
-  comp: ComponentType<Props>
-) => ComponentType<Omit<Props, 'classes'> & {classes?: Partial<Props['classes']>}>
+): <C>(
+  comp: C
+) => ComponentType<
+  JSX.LibraryManagedAttributes<C, Omit<GetProps<C>, 'classes'> & Partial<WithStylesProps<S>>>
+>
 
 type Omit<T, K> = Pick<T, Exclude<keyof T, K>>
 

packages/react-jss/src/index.test.tsx

@@ -0,0 +1,24 @@
+import React, {Component} from 'react'
+
+import WithStyles from '.'
+
+interface Props {
+  testProp: string
+}
+
+class TestComponent extends Component<Props> {
+  static defaultProps: Props = {
+    testProp: 'hello'
+  }
+
+  render() {
+    return <div>{this.props.testProp}</div>
+  }
+}
+
+const TestComponentWitStyles = WithStyles({})(TestComponent)
+
+function testRender() {
+  // component shouldn't ask to pass `testProp`
+  return <TestComponentWitStyles />
+}

tsconfig.json

@@ -9,5 +9,5 @@
     "moduleResolution": "node",
     "jsx": "react"
   },
-  "include": ["packages/**/*.ts"]
+  "include": ["packages/**/*.ts", "packages/**/*.tsx"]
 }