;
-export type StyledProps = ThemedStyledProps
;
+export type StyledProps
= ThemedStyledProps
>;
export type StyledComponentProps<
// The Component from whose props are derived
@@ -57,8 +57,8 @@ type StyledComponentPropsWithAs<
export type FalseyValue = undefined | null | false;
export type Interpolation
=
| InterpolationValue
- | InterpolationFunction
- | FlattenInterpolation
;
+ | FlattenInterpolation
+ | InterpolationFunction
;
// must be an interface to be self-referential
export interface FlattenInterpolation
extends ReadonlyArray> {}
@@ -93,10 +93,15 @@ export interface GlobalStyleComponent
extends React.ComponentClass> {}
// remove the call signature from StyledComponent so Interpolation can still infer InterpolationFunction
-type StyledComponentInterpolation = Pick<
- AnyStyledComponent,
- keyof StyledComponentBase
->;
+type StyledComponentInterpolation =
+ | Pick<
+ StyledComponentBase,
+ keyof StyledComponentBase
+ >
+ | Pick<
+ StyledComponentBase,
+ keyof StyledComponentBase
+ >;
// abuse Pick to strip the call signature from ForwardRefExoticComponent
type ForwardRefExoticBase = Pick<
@@ -162,25 +167,45 @@ export interface StyledComponentBase<
): StyledComponent;
}
-export type ThemedStyledFunctionBase<
+export interface ThemedStyledFunctionBase<
C extends keyof JSX.IntrinsicElements | React.ComponentType,
T extends object,
O extends object = {},
A extends keyof any = never
-> =
+> {
+ (
+ first:
+ | TemplateStringsArray
+ | NonNullable<
+ Interpolation<
+ ThemedStyledProps & O, T>
+ >
+ >,
+ ...rest: Array<
+ Interpolation<
+ ThemedStyledProps & O, T>
+ >
+ >
+ ): StyledComponent;
// at least the first argument is required, whatever it is
(
- first: NonNullable<
- Interpolation<
- ThemedStyledProps & O & U, T>
- >
- >,
+ first:
+ | TemplateStringsArray
+ | NonNullable<
+ Interpolation<
+ ThemedStyledProps<
+ StyledComponentPropsWithRef & O & U,
+ T
+ >
+ >
+ >,
...rest: Array<
Interpolation<
ThemedStyledProps & O & U, T>
>
>
- ) => StyledComponent;
+ ): StyledComponent;
+}
export interface ThemedStyledFunction<
C extends keyof JSX.IntrinsicElements | React.ComponentType,
@@ -243,17 +268,13 @@ type StyledComponentInnerAttrs<
export interface ThemedBaseStyledInterface
extends ThemedStyledComponentFactories {
- (tag: TTag): ThemedStyledFunction<
- TTag,
- T
- >;
(component: C): ThemedStyledFunction<
StyledComponentInnerComponent,
T,
StyledComponentInnerOtherProps,
StyledComponentInnerAttrs
>;
- >(
+ >(
// unfortunately using a conditional type to validate that it can receive a `theme?: Theme`
// causes tests to fail in TS 3.1
component: C
@@ -265,10 +286,20 @@ export type ThemedStyledInterface = ThemedBaseStyledInterface<
>;
export type StyledInterface = ThemedStyledInterface;
-export type BaseThemedCssFunction = (
- first: NonNullable>>,
- ...interpolations: Array>>
-) => Array>>;
+export interface BaseThemedCssFunction {
+ (
+ first:
+ | TemplateStringsArray
+ | NonNullable>>,
+ ...interpolations: Array>>
+ ): FlattenInterpolation>;
+ (
+ first:
+ | TemplateStringsArray
+ | NonNullable>>,
+ ...interpolations: Array>>
+ ): FlattenInterpolation>;
+}
export type ThemedCssFunction = BaseThemedCssFunction<
AnyIfEmpty
@@ -296,7 +327,9 @@ export interface ThemedStyledComponentsModule<
): Keyframes;
createGlobalStyle(
- first: NonNullable>>,
+ first:
+ | TemplateStringsArray
+ | NonNullable>>,
...interpolations: Array>>
): GlobalStyleComponent;
@@ -366,7 +399,9 @@ export function keyframes(
): Keyframes;
export function createGlobalStyle
(
- first: NonNullable>>,
+ first:
+ | TemplateStringsArray
+ | NonNullable>>,
...interpolations: Array>>
): GlobalStyleComponent;