title: Using styled components with Typescript, prop does not exist?
body: <p>Here is my styled component. </p>
  
  <pre><code>import * as React from 'react';
  import styled from 'styled-components';
  import { ComponentChildren } from 'app-types';
  
  interface Props {
      children: ComponentChildren;
      emphasized: boolean;
  }
  
  const HeadingStyled = styled.h2`
      ${props =&gt; props.emphasized &amp;&amp; css`
          display: inline;
          padding-top: 10px;
          padding-right: 30px;
    `}
  `;
  
  const Heading = (props: Props) =&gt; (
      &lt;HeadingStyled&gt;
          {props.children}
      &lt;/HeadingStyled&gt;
  );
  
  export default Heading;
  </code></pre>
  
  <p>I get warnings that:</p>
  
  <ul>
  <li><code>Property 'emphasized' does not exist on type 'ThemedStyledProps&lt;DetailedHTMLProps&lt;HTMLAttributes&lt;HTMLHeadingElement&gt;, HTMLHeadingElement&gt;, any&gt;'.</code></li>
  <li><code>Cannot find name 'css'. Did you mean 'CSS'?</code></li>
  </ul>
  
  <p>How can I get this to work?</p>