Definitelytyped: [@types/styled-component] styled() does not recognize React defaultProps in Typescript 3

[dan-kez]

• [x] I tried using the @types/xxxx package and had problems.
• [x] I tried using the latest stable version of tsc. https://www.npmjs.com/package/typescript
• [x] I have a question that is inappropriate for StackOverflow. (Please ask any appropriate questions there).
• [x] [Mention](https://github.com/blog/821-mention-somebody-they-re-notified) the authors (see Definitions by: in index.d.ts) so they can respond.
  
  
  
  • Authors: @Igorbek & @Igmat
  
  

If you do not mention the authors the issue will be ignored.

Hello! This is a follow up from this issue in the styled-components repo (was directed here) https://github.com/styled-components/styled-components/issues/1914

Initial post by @nathanbirrell quoted below

Since Typescript introduced support for defaultProps recently, it would be nice to have styled-components recognise their presence.

Reproduction

Create a component with one required and one optional prop, set a default prop for the optional.

interface IProps {
  requiredProp: boolean
  optionalProp: string // Shouldn't need to be optional here
}

class MyComponent extends React.PureComponent<IProps> {
  static defaultProps = {
    optionalProp: 'fallback'
  }

  render() {
    const { requiredProp, optionalProp } = this.props
    return (
      <span>
        {requiredProp.toString()}
        {optionalProp.toString()}
      </span>
    )
  }
}

Then use that component, once as a normal react component and once as a styled-component:

const MyComponentStyled = styled(MyComponent)``

// No type error (expected) because optionalProp is defined in defaultProps
<MyComponent requiredProp />

// Type error (unexpected), styled() doesn't recognise optionalProp is defined in defaultProps
<MyComponentStyled requiredProp />

Expected Behavior

No type error when using MyComponentStyled without optionalProp.

Actual Behavior

Type error, because styled() doesn't seem to recognise optionalProp is defined in defaultProps

Property 'optionalProp' is missing in type '{ requiredProp: true; }'.

Environment

## System:
 - OS: Linux 4.15 Fedora 27 (Workstation Edition) 27 (Workstation Edition)
 - CPU: x64 Intel(R) Core(TM) i5-6200U CPU @ 2.30GHz
 - Memory: 2.88 GB / 15.34 GB
 - Container: Yes
 - Shell: 4.4.19 - /bin/bash
## Binaries:
 - Node: 8.9.4 - /usr/bin/node
 - npm: 5.6.0 - /usr/bin/npm
## npmPackages:
 - babel-plugin-styled-components: ^1.5.0 => 1.5.1
 - styled-components: ^3.4.2 => 3.4.2
 - typescript: ^3.0.1 => 3.0.1

EDIT: This other PR may apply https://github.com/DefinitelyTyped/DefinitelyTyped/pull/28189, specifically lines https://github.com/DefinitelyTyped/DefinitelyTyped/pull/28189/files#diff-ee7ace1841a23c70c0c2b663cfae1cb7R95

EDIT 2: I've created a failing test case in this branch. Unfortunately, the typing for this library a little out of my depth and I haven't been able to figure this out on my own. If someone could help I'd really appreciate it.

https://github.com/dan-kez/DefinitelyTyped/blob/styled_comp_failing_test_case_defaultDep/types/styled-components/styled-components-tests.tsx#L178-L201

[dan-kez]

Just wanted to ping the maintainers given the recent activity with v4 to see if I could get some help on this issue.

@Igorbek & @Igmat & @lavoaster

[Igmat]

@dan-kez sorry, I can't help for now. But it seems that there are other active guys now.
If they won't fix it till I have a chance to work on it - I'll take a closer look int your issue.

[dan-kez]

Hey @IgorBabkin, @Lavoaster, @Kovensky I just wanted to check in and see if you had any thoughts on this issue. I've tried my hand at it a couple times and I haven't had luck but I'm likely not as familiar at TS as you all.

@Igmat - just adding you to keep you in the loop

[Igorbek]

IgorBabkin -> @Igorbek, I guess. The fix is in #31903