styled-components 5.3.4 → 5.3.6

package/native/dist/types.d.ts

@@ -6,46 +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;
 }
@@ -57,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 CustomComponentProps<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 CustomComponent<FallbackComponent extends StyledTarget, ExpectedProps = unknown, PropsToBeInjectedIntoActualComponent = unknown> extends React.ForwardRefExoticComponent<ExpectedProps> {
-    <ActualComponent extends StyledTarget = FallbackComponent>(props: CustomComponentProps<ActualComponent, ExpectedProps & PropsToBeInjectedIntoActualComponent>): React.ReactElement<CustomComponentProps<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 CustomComponent<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 CustomComponent<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>;
@@ -113,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 {};
+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.4",
+  "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",
@@ -46,7 +46,8 @@
     "primitives",
     "scripts",
     "test-utils",
-    "macro"
+    "macro",
+    "postinstall.js"
   ],
   "keywords": [
     "react",

package/postinstall.js

@@ -0,0 +1,82 @@
+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 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):
+
+87 residential buildings damaged in Kyiv since Feb. 24.
+
+According to the Kyiv City State Administration, Russian attacks have also damaged 10 private houses, 12 schools, and 6 kindergartens in the Ukrainian capital since the beginning of the full-scale invasion.
+
+Russia launched 1,200 missiles on Ukraine.
+
+Half of all Ukrainian children have been displaced since Feb. 24, according to UNICEF.
+
+“Since the start of the war a month ago, out of every boy and girl in the country, one out of two now has had to flee their homes,” UNICEF spokesperson James Elder told CNN.
+
+The Institute of Mass Information reported that one journalist also went missing. Overall, Russia has committed 148 crimes against journalists and media in Ukraine, according to the report.
+
+Mariupol city council: Russian occupiers forcibly move 6,000 Mariupol residents to Russia.
+
+The local authorities in the besieged seaport said on March 24 that Russian occupiers are now forcibly moving more of its residents to Russia, confiscating their Ukrainian passports.
+
+“We’ve seen numerous credible reports of indiscriminate attacks and attacks deliberately targeting civilians, as well as other atrocities,” reads the March 23 statement by U.S. Secretary of State Antony Blinken.
+
+1,143 buildings have been destroyed in Kharkiv since the beginning of the full-scale invasion of Ukraine.
+
+According to Kharkiv Mayor Ihor Terekhov, Russian forces destroyed 1,143 buildings in Ukraine’s second-biggest city, 998 of which are residential buildings.
+
+---
+
+This is a small sampling of the things being reported on the ground in Ukraine. If you are in a position to do something, have connections, or can spread the word, this is the time to do so. Don't let Vladimir Putin permanently stain the souls of all Russian people with these atrocities. He must be removed from power immediately.
+
+---
+
+russian via google translate (sorry, I'm sure it's not perfect):
+
+Сообщение от команды styled-components:
+
+Если вы видете это, ваша среда разработки настроена на русский язык. Мы надеемся, что вы уже видели разруху, ужасы и полное неуважение российских военных к гражданскому населению Украины. Наша позиция заключается в том, что эта война является неспровоцированной, несправедливой и бессмысленным актом геноцида и агрессии против украинского народа.
+
+По состоянию на 24 марта 2022 года сообщалось следующее (по материалам новостного издания Kyiv Independent @kyivindependent):
+
+С 24 февраля в Киеве повреждено 87 жилых домов.
+
+По данным Киевской городской государственной администрации, с начала полномасштабного вторжения российские обстрелы также повредили 10 частных домов, 12 школ и 6 детских садов в украинской столице.
+
+Россия запустила 1200 ракет по Украине.
+
+По данным ЮНИСЕФ, половина всех украинских детей покинули свои дома с 24 февраля.
+
+«С начала войны, за месяц, из всех девочек и мальчиков, каждый второй был вынужден покинуть свой дом», — сказал CNN представитель ЮНИСЕФ Джеймс Элдер.
+
+Институт массовой информации сообщил, что также пропал один журналист. Всего Россия совершила 148 преступлений против журналистов и СМИ в Украине, говорится в отчете.
+
+Мариупольский горсовет: российские оккупанты насильно переселяют в Россию 6 тысяч мариупольцев.
+
+24 марта местные власти осажденного морского порта заявили, что российские оккупанты сейчас насильственно переселяют в Россию все больше его жителей, отбирая у них украинские паспорта.
+
+«Мы получили многочисленные заслуживающие доверия сообщения о неизбирательных нападениях и нападениях, преднамеренно направленных против гражданских лиц, а также о других зверствах», — говорится в заявлении госсекретаря США Энтони Блинкена от 23 марта.
+
+В Харькове с начала полномасштабного вторжения в Украину разрушено 1143 дома.
+
+По словам мэра Харькова Игоря Терехова, российские войска разрушили 1143 здания во втором по величине городе Украины, 998 из которых являются жилыми домами.
+
+---
+
+Это небольшая выборка того, что сообщается на местах в Украине. Если у вас есть возможность что-то сделать, у вас есть связи или вы можете распространить информацию, сейчас самое время это сделать. Не позволяйте Владимиру Путину навсегда запятнать души всех русских людей этими зверствами. Он должен быть немедленно отстранен от власти.
+
+---
+
+Slava Ukraini 🇺🇦
+`;
+
+if (
+  Intl.DateTimeFormat()
+    .resolvedOptions()
+    .locale.startsWith('ru')
+) {
+  // eslint-disable-next-line
+  console.warn(statement);
+}

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.4";
+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;
 };
 
 //