Skip to content
Permalink
Browse files
fix(react): fixes for --exactOptionalPropertyTypes TS flag (#827)
TypeScript 4.4 introduced new `--exactOptionalPropertyTypes` flag. With this flag enabled typescript compiler strictly distinguish between `?` and `undefined` type. Currently `@types/react:17.0` package has `className?: string | undefined` and `style?: CSSProperties | undefined` specified for html attributes, but linaria types are only marked as `?` but `undefined`. This patch fixes this incompatibility.
  • Loading branch information
geakstr committed Aug 31, 2021
1 parent 6a062e1 commit eed92b19e3b779b656fb780307bbab8a08d14ba2
Showing with 5 additions and 3 deletions.
  1. +5 −3 packages/react/src/styled.ts
@@ -63,13 +63,15 @@ interface IProps {
// If styled wraps custom component, that component should have className property
function styled<TConstructor extends React.FunctionComponent<any>>(
tag: TConstructor extends React.FunctionComponent<infer T>
? T extends { className?: string }
? T extends { className?: string | undefined }
? TConstructor
: never
: never
): ComponentStyledTag<TConstructor>;
function styled<T>(
tag: T extends { className?: string } ? React.ComponentType<T> : never
tag: T extends { className?: string | undefined }
? React.ComponentType<T>
: never
): ComponentStyledTag<T>;
function styled<TName extends keyof JSX.IntrinsicElements>(
tag: TName
@@ -197,7 +199,7 @@ type ComponentStyledTag<T> = <
>(
strings: TemplateStringsArray,
// Expressions can contain functions only if wrapped component has style property
...exprs: TrgProps extends { style?: React.CSSProperties }
...exprs: TrgProps extends { style?: React.CSSProperties | undefined }
? Array<
| StaticPlaceholder
| ((props: NoInfer<OwnProps & TrgProps>) => string | number)

0 comments on commit eed92b1

Please sign in to comment.