Property 'css' does not exist on type 'DetailedHTMLProps'

Hey, thank you all for this wonderful library. I have recently adopted TypeScript and keep running into problems with the css prop. I couldn’t find anything about my issue in the sc typescript docs. Any help is greatly appreciated.

Environment

## System:
 - OS: Windows 10
 - CPU: (4) x64 Intel(R) Core(TM) i5-4570 CPU @ 3.20GHz
 - Memory: 16.58 GB / 23.94 GB
## Binaries:
 - Node: 11.6.0 - C:\Program Files\nodejs\node.EXE
 - Yarn: 1.15.2 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
 - npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD
## package.json
 - "@types/styled-components": "4.1.14",
 - "typescript": "3.4.5",
 - "styled-components": "4.2.0",
 - "react": "16.8.6",
 - "react-dom": "16.8.6",
 - "react-scripts": "3.0.0",

Reproduction

https://codesandbox.io/s/6vp2yzj01k

Steps to reproduce

1. Use TypeScript with styled-components
2. Pass css prop to any React element

Expected Behavior

No type error

Actual Behavior

Type '{ children: (number | Element)[]; css: string; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.

  Property 'css' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.ts(2322)

[peduarte]

[yuchi]

Apparently the problem lies in the fact that importing import {} from "styled-components/cssprop"; doesn’t resolve correctly on Yarn. Didn’t found the culprit, but found a solution. For everyone reaching this issue, you can extract all the content directly in a styled.d.ts (probably the same file where you define the theme shape):

import { CSSProp } from "styled-components";

declare module "styled-components" {
  export interface DefaultTheme {
    // Your theme stuff here
  }
}

declare module "react" {
  interface Attributes {
    css?: CSSProp;
  }
}