StyledComponent: More accurate component constraint for TS 4.2

[sandersn]

This change makes styled-components pass compilation on Typescript 4.2, which correctly propagates type parameter constraints through certain
complex conditional types. Old versions of typescript just dropped the constraint by mistake, so this inconsistency was just not checked before.

I'm not certain this is the right solution; in particular, it may be a lot slower. I hope not, because I have no idea what the right fix is otherwise!

Edit:

1. performance looks OK.
2. I haven't tried it, but changing all keyof JSX.Intrinsic to string might also fix the error, at the cost of some type accuracy.

[typescript-bot]

Hey @sandersn,

😒 Your PR doesn't modify any tests, so it's hard to know what's being fixed, and your changes might regress in the future. Please consider adding tests to cover the change you're making. Including tests allows this PR to be merged by yourself and the owners of this module. This can potentially save days of time for you.

[typescript-bot]

@sandersn Thank you for submitting this PR!

This is a live comment which I will keep updated.

1 package in this PR

• styled-components on npm, on unpkg
  • owner-approval: @eps1lon

Code Reviews

This PR can be merged once it's reviewed by a DT maintainer.

Status

• ✅ No merge conflicts
• ✅ Continuous integration tests have passed
• ❌ Only a DT maintainer can approve changes without tests

Once every item on this list is checked, I'll ask you for permission to merge and publish the changes.

---

Diagnostic Information: What the bot saw about this PR

{
  "type": "info",
  "now": "-",
  "pr_number": 50046,
  "author": "sandersn",
  "headCommitAbbrOid": "ee98c46",
  "headCommitOid": "ee98c46b741b0072da9a99e7ee54fe339aa3f416",
  "lastPushDate": "2020-12-09T22:10:33.000Z",
  "lastActivityDate": "2020-12-10T00:45:51.000Z",
  "maintainerBlessed": false,
  "hasMergeConflict": false,
  "isFirstContribution": false,
  "popularityLevel": "Popular",
  "pkgInfo": [
    {
      "name": "styled-components",
      "kind": "edit",
      "files": [
        {
          "path": "types/styled-components/index.d.ts",
          "kind": "definition"
        }
      ],
      "owners": [
        "Igorbek",
        "Igmat",
        "lavoaster",
        "Jessidhia",
        "jkillian",
        "eps1lon",
        "flavordaaave",
        "wagerfield",
        "Lazyuki",
        "mgoszcz2",
        "danilofuchs"
      ],
      "addedOwners": [],
      "deletedOwners": [],
      "popularityLevel": "Popular"
    }
  ],
  "reviews": [
    {
      "type": "approved",
      "reviewer": "eps1lon",
      "date": "2020-12-10T00:45:51.000Z",
      "isMaintainer": false
    }
  ],
  "ciResult": "pass"
}

[typescript-bot]

🔔 @Igorbek @Igmat @lavoaster @Jessidhia @jkillian @eps1lon @flavordaaave @wagerfield @Lazyuki @mgoszcz2 @danilofuchs — please review this PR in the next few days. Be sure to explicitly select Approve or Request Changes in the GitHub UI so I know what's going on.

[danger-public]

Inspecting the JavaScript source for this package found some properties that are not in the .d.ts files.
The check for missing properties isn't always right, so take this list as advice, not a requirement.

styled-components (unpkg)

was missing the following properties:

1. StyleSheetConsumer
2. StyleSheetContext
3. version

Generated by 🚫 dangerJS against ee98c46

[typescript-bot]

👋 Hi there! I’ve run some quick measurements against master and your PR. These metrics should help the humans reviewing this PR gauge whether it might negatively affect compile times or editor responsiveness for users who install these typings.

Let’s review the numbers, shall we?

Comparison details 📊

	master	#50046	diff
Batch compilation
Memory usage (MiB)	193.5	185.7	-4.0%
Type count	81923	82214	0%
Assignability cache size	24223	24220	0%
Language service
Samples taken	1207	1207	0%
Identifiers in tests	1414	1414	0%
getCompletionsAtPosition
Mean duration (ms)	615.0	622.1	+1.1%
Mean CV	8.1%	8.2%
Worst duration (ms)	3623.7	3722.4	+2.7%
Worst identifier	p	p
getQuickInfoAtPosition
Mean duration (ms)	625.3	639.9	+2.3%
Mean CV	8.1%	8.7%
Worst duration (ms)	3154.9	3297.5	+4.5%
Worst identifier	WithProp	WithProp

It looks like nothing changed too much. I won’t post performance data again unless it gets worse.