Minor TS types tweak in @emotion/styled

emotion-js · Aug 1, 2020 · 8f08aa2 · 8f08aa2
1 parent f57a722
commit 8f08aa2
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 2 deletions.
diff --git a/packages/react/types/helper.d.ts b/packages/react/types/helper.d.ts
@@ -2,6 +2,7 @@ import * as React from 'react'
 
 /**
  * @desc Utility type for getting props type of React component.
+ * It takes `defaultProps` into an account - making props with defaults optional.
  */
 export type PropsOf<
   C extends keyof JSX.IntrinsicElements | React.JSXElementConstructor<any>

diff --git a/packages/styled/types/base.d.ts b/packages/styled/types/base.d.ts
@@ -105,7 +105,7 @@ export interface CreateStyled {
     > = keyof React.ComponentProps<C>
   >(
     component: C,
-    options: FilteringStyledOptions<PropsOf<C>, ForwardedProps>
+    options: FilteringStyledOptions<React.ComponentProps<C>, ForwardedProps>
   ): CreateStyledComponent<
     Pick<PropsOf<C>, ForwardedProps> & {
       theme?: Theme
@@ -115,7 +115,7 @@ export interface CreateStyled {
 
   <C extends React.ComponentType<React.ComponentProps<C>>>(
     component: C,
-    options?: StyledOptions<PropsOf<C>>
+    options?: StyledOptions<React.ComponentProps<C>>
   ): CreateStyledComponent<
     PropsOf<C> & {
       theme?: Theme

diff --git a/packages/styled/types/tests-base.tsx b/packages/styled/types/tests-base.tsx
@@ -432,3 +432,13 @@ const Section = styled('section')`
 `
 ;<StyledWithAs as="section" />
 ;<StyledWithAs as={Section} />
+
+{
+  const MemoedComponent = React.memo((_props: { foo: string }) => {
+    return null
+  })
+  const StyledMemoedComponent = styled(MemoedComponent)()
+  ;<StyledMemoedComponent foo="test" />
+  // $ExpectError
+  ;<StyledMemoedComponent />
+}