styled-components 5.3.5 → 5.3.6

package/native/dist/types.d.ts

@@ -6,47 +6,43 @@ interface ExoticComponentWithDisplayName<P = unknown> extends React.ExoticCompon
     defaultProps?: Partial<P>;
     displayName?: string;
 }
+export declare type OmitNever<T> = {
+    [K in keyof T as T[K] extends never ? never : K]: T[K];
+};
+export declare type Runtime = 'web' | 'native';
 export { DefaultTheme };
 export declare type AnyComponent<P = any> = ExoticComponentWithDisplayName<P> | React.ComponentType<P>;
-export interface StyledOptions<Props> {
+export interface StyledOptions<R extends Runtime, Props> {
     attrs?: Attrs<Props>[];
-    componentId?: string;
+    componentId?: R extends 'web' ? string : never;
     displayName?: string;
-    parentComponentId?: string;
-    shouldForwardProp?: ShouldForwardProp;
+    parentComponentId?: R extends 'web' ? string : never;
+    shouldForwardProp?: ShouldForwardProp<R>;
 }
-export interface StyledNativeOptions<Props> {
-    attrs?: Attrs<Props>[];
-    displayName?: string;
-    shouldForwardProp?: ShouldForwardProp;
-}
-export declare type KnownWebTarget = keyof JSX.IntrinsicElements | AnyComponent;
-export declare type WebTarget = string | KnownWebTarget;
+export declare type KnownTarget = keyof JSX.IntrinsicElements | AnyComponent;
+export declare type WebTarget = string | KnownTarget;
 export declare type NativeTarget = AnyComponent;
 export interface BaseExtensibleObject {
     [key: string]: any;
 }
 export interface ExtensibleObject extends BaseExtensibleObject {
-    $as?: KnownWebTarget;
-    $forwardedAs?: KnownWebTarget;
-    as?: KnownWebTarget;
-    forwardedAs?: KnownWebTarget;
+    $as?: KnownTarget;
+    $forwardedAs?: KnownTarget;
+    as?: KnownTarget;
+    forwardedAs?: KnownTarget;
     theme?: DefaultTheme;
 }
 export interface ExecutionContext extends ExtensibleObject {
     theme: DefaultTheme;
 }
-export interface StyleFunction<Props> {
-    (executionContext: ExecutionContext & Props): string | number | StyledObject | CSSConstructor<Props> | StyleFunction<Props>;
+export interface StyleFunction<Props = BaseExtensibleObject> {
+    (executionContext: ExecutionContext & Props): Interpolation<Props>;
 }
-export declare type Interpolation<Props> = StyleFunction<Props> | StyledObject | string | number | Keyframes | IStyledComponent<any, any> | Interpolation<Props>[];
-export declare type Attrs<Props> = (ExtensibleObject & Props) | ((props: ExecutionContext & Props) => ExecutionContext & Props);
+export declare type Interpolation<Props> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | IStyledComponent<'web', any, any> | Interpolation<Props>[];
+export declare type Attrs<Props> = (ExtensibleObject & Props) | ((props: ExecutionContext & Props) => Partial<Props>);
 export declare type RuleSet<Props> = Interpolation<Props>[];
-export declare type Styles<Props> = TemplateStringsArray | StyledObject | StyleFunction<Props>;
+export declare type Styles<Props> = TemplateStringsArray | StyledObject<Props> | StyleFunction<Props>;
 export declare type NameGenerator = (hash: number) => string;
-export interface CSSConstructor<Props> {
-    (strings: string[], ...interpolations: Interpolation<Props>[]): RuleSet<Props>;
-}
 export interface StyleSheet {
     create: Function;
 }
@@ -58,54 +54,45 @@ export interface Keyframes {
 export interface Flattener<Props> {
     (chunks: Interpolation<Props>[], executionContext: Object | null | undefined, styleSheet: Object | null | undefined): Interpolation<Props>[];
 }
-export declare type FlattenerResult<Props> = RuleSet<Props> | number | string | string[] | IStyledComponent<any, any> | Keyframes;
+export declare type FlattenerResult<Props> = RuleSet<Props> | number | string | string[] | IStyledComponent<any, any, any> | Keyframes;
 export interface Stringifier {
-    (css: string, selector?: string, prefix?: string, componentId?: string): string;
+    (css: string, selector?: string, prefix?: string, componentId?: string): string[];
     hash: string;
 }
-export interface ShouldForwardProp {
-    (prop: string, isValidAttr: (prop: string) => boolean, elementToBeCreated?: WebTarget | NativeTarget): boolean;
+export interface ShouldForwardProp<R extends Runtime> {
+    (prop: string, elementToBeCreated?: StyledTarget<R>): boolean;
 }
-export interface CommonStatics<Props> {
+export interface CommonStatics<R extends Runtime, Props> {
     attrs: Attrs<Props>[];
-    target: StyledTarget;
-    shouldForwardProp?: ShouldForwardProp;
+    target: StyledTarget<R>;
+    shouldForwardProp?: ShouldForwardProp<R>;
     withComponent: any;
 }
-export interface IStyledStatics<OuterProps = unknown> extends CommonStatics<OuterProps> {
-    componentStyle: ComponentStyle;
-    foldedComponentIds: Array<string>;
-    target: WebTarget;
-    styledComponentId: string;
-    warnTooManyClasses?: ReturnType<typeof createWarnTooManyClasses>;
-    withComponent: <Target extends WebTarget, Props = unknown>(tag: Target) => IStyledComponent<Target, OuterProps & Props>;
+export interface IStyledStatics<R extends Runtime, OuterProps extends {}> extends CommonStatics<R, OuterProps> {
+    componentStyle: R extends 'web' ? ComponentStyle : never;
+    foldedComponentIds: R extends 'web' ? Array<string> : never;
+    inlineStyle: R extends 'native' ? InstanceType<IInlineStyleConstructor<OuterProps>> : never;
+    target: StyledTarget<R>;
+    styledComponentId: R extends 'web' ? string : never;
+    warnTooManyClasses?: R extends 'web' ? ReturnType<typeof createWarnTooManyClasses> : never;
+    withComponent: <Target extends StyledTarget<R>, Props = unknown>(tag: Target) => IStyledComponent<R, Target, OuterProps & Props>;
 }
-declare type PolymorphicComponentProps<ActualComponent extends StyledTarget, PropsToBeInjectedIntoActualComponent extends {}, ActualComponentProps = ActualComponent extends KnownWebTarget ? React.ComponentPropsWithRef<ActualComponent> : {}> = React.HTMLAttributes<ActualComponent> & Omit<PropsToBeInjectedIntoActualComponent, keyof ActualComponentProps | 'as' | '$as'> & ActualComponentProps & ({
+declare type PolymorphicComponentProps<R extends Runtime, ActualComponent extends StyledTarget<R>, PropsToBeInjectedIntoActualComponent extends {}, ActualComponentProps = ActualComponent extends KnownTarget ? React.ComponentPropsWithRef<ActualComponent> : {}> = React.HTMLAttributes<ActualComponent> & Omit<PropsToBeInjectedIntoActualComponent, keyof ActualComponentProps | 'as' | '$as'> & ActualComponentProps & ({
     $as: ActualComponent;
-    as?: AnyComponent;
+    as?: never;
 } | {
+    $as?: never;
     as?: ActualComponent;
 });
-interface PolymorphicComponent<FallbackComponent extends StyledTarget, ExpectedProps = unknown, PropsToBeInjectedIntoActualComponent = unknown> extends React.ForwardRefExoticComponent<ExpectedProps> {
-    <ActualComponent extends StyledTarget = FallbackComponent>(props: PolymorphicComponentProps<ActualComponent, ExpectedProps & PropsToBeInjectedIntoActualComponent>): React.ReactElement<PolymorphicComponentProps<ActualComponent, ExecutionContext & ExpectedProps & PropsToBeInjectedIntoActualComponent>, ActualComponent>;
+interface PolymorphicComponent<R extends Runtime, FallbackComponent extends StyledTarget<R>, ExpectedProps extends {}, PropsToBeInjectedIntoActualComponent extends {}> extends React.ForwardRefExoticComponent<ExpectedProps> {
+    <ActualComponent extends StyledTarget<R> = FallbackComponent>(props: PolymorphicComponentProps<R, ActualComponent, ExpectedProps & PropsToBeInjectedIntoActualComponent>): React.ReactElement<PolymorphicComponentProps<R, ActualComponent, ExecutionContext & ExpectedProps & PropsToBeInjectedIntoActualComponent>, ActualComponent>;
 }
-export interface IStyledComponent<Target extends WebTarget, Props = unknown> extends PolymorphicComponent<Target, Props, ExecutionContext>, IStyledStatics<Props> {
-    defaultProps?: Partial<ExtensibleObject & (Target extends KnownWebTarget ? React.ComponentProps<Target> : {}) & Props>;
+export interface IStyledComponent<R extends Runtime, Target extends StyledTarget<R>, Props extends {}> extends PolymorphicComponent<R, Target, Props, ExecutionContext>, IStyledStatics<R, Props> {
+    defaultProps?: Partial<ExtensibleObject & (Target extends KnownTarget ? React.ComponentProps<Target> : {}) & Props>;
     toString: () => string;
 }
-export interface IStyledComponentFactory<Target extends WebTarget, Props = unknown, Statics = unknown> {
-    (target: Target, options: StyledOptions<Props>, rules: RuleSet<Props>): IStyledComponent<Target, Props> & Statics;
-}
-export interface IStyledNativeStatics<OuterProps = unknown> extends CommonStatics<OuterProps> {
-    inlineStyle: InstanceType<IInlineStyleConstructor<OuterProps>>;
-    target: NativeTarget;
-    withComponent: <Target extends NativeTarget, Props = unknown>(tag: Target) => IStyledNativeComponent<Target, OuterProps & Props>;
-}
-export interface IStyledNativeComponent<Target extends NativeTarget, Props = unknown> extends PolymorphicComponent<Target, Props, ExecutionContext>, IStyledNativeStatics<Props> {
-    defaultProps?: Partial<ExtensibleObject & (Target extends KnownWebTarget ? React.ComponentProps<Target> : {}) & Props>;
-}
-export interface IStyledNativeComponentFactory<Target extends NativeTarget, Props = unknown, Statics = unknown> {
-    (target: Target, options: StyledNativeOptions<Props>, rules: RuleSet<Props>): IStyledNativeComponent<Target, Props> & Statics;
+export interface IStyledComponentFactory<R extends Runtime, Target extends StyledTarget<R>, Props extends {}, Statics = unknown> {
+    (target: Target, options: StyledOptions<R, Props>, rules: RuleSet<Props>): IStyledComponent<R, Target, Props> & Statics;
 }
 export interface IInlineStyleConstructor<Props = unknown> {
     new (rules: RuleSet<Props>): IInlineStyle<Props>;
@@ -114,8 +101,30 @@ export interface IInlineStyle<Props = unknown> {
     rules: RuleSet<Props>;
     generateStyleObject(executionContext: Object): Object;
 }
-export declare type StyledTarget = WebTarget | NativeTarget;
-export interface StyledObject {
-    [key: string]: Record<string, any> | string | number | StyleFunction<ExecutionContext>;
-}
-export declare type CSSProp = string | StyledObject | StyleFunction<ExecutionContext>;
+export declare type StyledTarget<R extends Runtime> = R extends 'web' ? WebTarget : NativeTarget;
+export interface StyledObject<Props = ExecutionContext> {
+    [key: string]: BaseExtensibleObject | string | number | StyleFunction<Props>;
+}
+/**
+ * Override DefaultTheme to get accurate typings for your project.
+ *
+ * ```
+ * // create styled-components.d.ts in your project source
+ * // if it isn't being picked up, check tsconfig compilerOptions.types
+ * import type { CSSProp } from "styled-components";
+ * import Theme from './theme';
+ *
+ * type ThemeType = typeof Theme;
+ *
+ * declare module "styled-components" {
+ *  export interface DefaultTheme extends ThemeType {}
+ * }
+ *
+ * declare module "react" {
+ *  interface DOMAttributes<T> {
+ *    css?: CSSProp;
+ *  }
+ * }
+ * ```
+ */
+export declare type CSSProp = string | StyledObject | StyleFunction;

package/native/dist/utils/checkDynamicCreation.d.ts

@@ -1 +1 @@
-export declare const checkDynamicCreation: (displayName: string, componentId?: string | undefined) => void;
+export declare const checkDynamicCreation: (displayName: string, componentId?: string) => void;

package/native/dist/utils/flatten.d.ts

@@ -1,4 +1,4 @@
 import StyleSheet from '../sheet';
 import { ExecutionContext, ExtensibleObject, Interpolation, Stringifier } from '../types';
-export declare const objToCssArray: (obj: ExtensibleObject, prevKey?: string | undefined) => string[];
+export declare const objToCssArray: (obj: ExtensibleObject, prevKey?: string) => string[];
 export default function flatten<Props = unknown>(chunk: Interpolation<Props>, executionContext?: ExecutionContext & Props, styleSheet?: StyleSheet, stylisInstance?: Stringifier): Interpolation<Props>;

package/native/dist/utils/generateDisplayName.d.ts

@@ -1,2 +1,2 @@
 import { StyledTarget } from '../types';
-export default function generateDisplayName(target: StyledTarget): string;
+export default function generateDisplayName(target: StyledTarget<any>): string;

package/native/dist/utils/getComponentName.d.ts

@@ -1,2 +1,2 @@
 import { StyledTarget } from '../types';
-export default function getComponentName(target: StyledTarget): string;
+export default function getComponentName(target: StyledTarget<any>): string;

package/native/dist/utils/isStyledComponent.d.ts

@@ -1,2 +1,2 @@
 import { IStyledComponent } from '../types';
-export default function isStyledComponent(target: any): target is IStyledComponent<any>;
+export default function isStyledComponent(target: any): target is IStyledComponent<'web', any, any>;

package/native/dist/utils/isTag.d.ts

@@ -1,2 +1,2 @@
 import { StyledTarget } from '../types';
-export default function isTag(target: StyledTarget): boolean;
+export default function isTag(target: StyledTarget<'web'>): target is string;

package/native/dist/utils/stylis.d.ts

@@ -1,9 +1,10 @@
+import { Middleware } from 'stylis';
 import { Stringifier } from '../types';
 declare type StylisInstanceConstructorArgs = {
     options?: {
         prefix?: boolean;
     };
-    plugins?: stylis.Middleware[];
+    plugins?: Middleware[];
 };
 export default function createStylisInstance({ options, plugins, }?: StylisInstanceConstructorArgs): Stringifier;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "styled-components",
-  "version": "5.3.5",
+  "version": "5.3.6",
   "description": "Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress",
   "main": "dist/styled-components.cjs.js",
   "jsnext:main": "dist/styled-components.esm.js",

package/postinstall.js

@@ -1,7 +1,7 @@
 const statement = `
 A message from the styled-components core team:
 
-If you are seeing this, your environment is set to Russian locale. By now, it is our hope that you have seen the devastation, horrors, and complete disregard the Russian military has for Ukranian civilians. Our position is that this war is unprovoked, unjust, and a senseless act of genocide and aggression against the Ukranian people.
+If you are seeing this, your environment is set to Russian locale. By now, it is our hope that you have seen the devastation, horrors, and complete disregard the Russian military has for Ukrainian civilians. Our position is that this war is unprovoked, unjust, and a senseless act of genocide and aggression against the Ukrainian people.
 
 As of March 24, 2022 the following has been reported (based on the Kyiv Independent @kyivindependent news publication):
 
@@ -37,7 +37,7 @@ russian via google translate (sorry, I'm sure it's not perfect):
 
 Сообщение от команды styled-components:
 
-Если вы виде это, ваша среда настроена на русский язык. Мы надеемся, что к настоящему моменту вы видели разруху, ужасы и полное пренебрежение российских военных к гражданскому населению Украины. Наша позиция заключается в том, что эта война является неспровоцированной, несправедливой и бессмысленным актом геноцида и агрессии против украинского народа.
+Если вы видете это, ваша среда разработки настроена на русский язык. Мы надеемся, что вы уже видели разруху, ужасы и полное неуважение российских военных к гражданскому населению Украины. Наша позиция заключается в том, что эта война является неспровоцированной, несправедливой и бессмысленным актом геноцида и агрессии против украинского народа.
 
 По состоянию на 24 марта 2022 года сообщалось следующее (по материалам новостного издания Kyiv Independent @kyivindependent):
 
@@ -47,9 +47,9 @@ russian via google translate (sorry, I'm sure it's not perfect):
 
 Россия запустила 1200 ракет по Украине.
 
-По данным ЮНИСЕФ, половина всех украинских детей были перемещены с 24 февраля.
+По данным ЮНИСЕФ, половина всех украинских детей покинули свои дома с 24 февраля.
 
-«С начала войны месяц назад из каждого мальчика и девочки в стране каждый второй был вынужден покинуть свои дома», — сказал CNN представитель ЮНИСЕФ Джеймс Элдер.
+«С начала войны, за месяц, из всех девочек и мальчиков, каждый второй был вынужден покинуть свой дом», — сказал CNN представитель ЮНИСЕФ Джеймс Элдер.
 
 Институт массовой информации сообщил, что также пропал один журналист. Всего Россия совершила 148 преступлений против журналистов и СМИ в Украине, говорится в отчете.
 

package/primitives/dist/styled-components-primitives.cjs.js

@@ -155,7 +155,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 var SC_ATTR = typeof process !== 'undefined' && (process.env.REACT_APP_SC_ATTR || process.env.SC_ATTR) || 'data-styled';
 var SC_ATTR_ACTIVE = 'active';
 var SC_ATTR_VERSION = 'data-styled-version';
-var SC_VERSION = "5.3.5";
+var SC_VERSION = "5.3.6";
 var SPLITTER = '/*!sc*/\n';
 var IS_BROWSER = typeof window !== 'undefined' && 'HTMLElement' in window;
 var DISABLE_SPEEDY = Boolean(typeof SC_DISABLE_SPEEDY === 'boolean' ? SC_DISABLE_SPEEDY : typeof process !== 'undefined' && typeof process.env.REACT_APP_SC_DISABLE_SPEEDY !== 'undefined' && process.env.REACT_APP_SC_DISABLE_SPEEDY !== '' ? process.env.REACT_APP_SC_DISABLE_SPEEDY === 'false' ? false : process.env.REACT_APP_SC_DISABLE_SPEEDY : typeof process !== 'undefined' && typeof process.env.SC_DISABLE_SPEEDY !== 'undefined' && process.env.SC_DISABLE_SPEEDY !== '' ? process.env.SC_DISABLE_SPEEDY === 'false' ? false : process.env.SC_DISABLE_SPEEDY : process.env.NODE_ENV !== 'production'); // Shared empty execution context when generating static styles
@@ -445,7 +445,7 @@ var rehydrateSheet = function rehydrateSheet(sheet) {
 
 /* eslint-disable camelcase, no-undef */
 var getNonce = function getNonce() {
-  return typeof window !== 'undefined' ? typeof window.__webpack_nonce__ !== 'undefined' ? window.__webpack_nonce__ : null : null;
+  return typeof __webpack_nonce__ !== 'undefined' ? __webpack_nonce__ : null;
 };
 
 //