styled-components 6.0.0-beta.11 → 6.0.0-beta.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/dist/base.d.ts +0 -5
  2. package/dist/constructors/constructWithOptions.d.ts +4 -4
  3. package/dist/hoc/withTheme.d.ts +1 -1
  4. package/dist/models/StyleSheetManager.d.ts +3 -3
  5. package/dist/models/ThemeProvider.d.ts +3 -3
  6. package/dist/sheet/Sheet.d.ts +3 -3
  7. package/dist/sheet/types.d.ts +1 -1
  8. package/dist/styled-components.browser.cjs.js +16 -13
  9. package/dist/styled-components.browser.cjs.js.map +1 -1
  10. package/dist/styled-components.browser.esm.js +16 -13
  11. package/dist/styled-components.browser.esm.js.map +1 -1
  12. package/dist/styled-components.cjs.js +14 -8
  13. package/dist/styled-components.cjs.js.map +1 -1
  14. package/dist/styled-components.esm.js +14 -8
  15. package/dist/styled-components.esm.js.map +1 -1
  16. package/dist/styled-components.js +22 -19
  17. package/dist/styled-components.js.map +1 -1
  18. package/dist/styled-components.min.js +1 -1
  19. package/dist/styled-components.min.js.map +1 -1
  20. package/dist/tsconfig.tsbuildinfo +1 -1
  21. package/dist/types.d.ts +18 -18
  22. package/dist/utils/hoist.d.ts +3 -3
  23. package/dist/utils/stylis.d.ts +1 -1
  24. package/native/dist/base.d.ts +0 -5
  25. package/native/dist/constructors/constructWithOptions.d.ts +4 -4
  26. package/native/dist/hoc/withTheme.d.ts +1 -1
  27. package/native/dist/models/StyleSheetManager.d.ts +3 -3
  28. package/native/dist/models/ThemeProvider.d.ts +3 -3
  29. package/native/dist/sheet/Sheet.d.ts +3 -3
  30. package/native/dist/sheet/types.d.ts +1 -1
  31. package/native/dist/styled-components.native.cjs.js +1 -1
  32. package/native/dist/styled-components.native.esm.js +1 -1
  33. package/native/dist/types.d.ts +18 -18
  34. package/native/dist/utils/hoist.d.ts +3 -3
  35. package/native/dist/utils/stylis.d.ts +1 -1
  36. package/package.json +20 -24
package/dist/base.d.ts CHANGED
@@ -8,11 +8,6 @@ import ServerStyleSheet from './models/ServerStyleSheet';
8
8
  import { IStyleSheetContext, IStyleSheetManager, IStylisContext, StyleSheetConsumer, StyleSheetContext, StyleSheetManager } from './models/StyleSheetManager';
9
9
  import ThemeProvider, { ThemeConsumer, ThemeContext } from './models/ThemeProvider';
10
10
  import isStyledComponent from './utils/isStyledComponent';
11
- declare global {
12
- interface Window {
13
- '__styled-components-init__'?: number;
14
- }
15
- }
16
11
  export * from './secretInternals';
17
12
  export { AttrsArg as Attrs, DefaultTheme, ShouldForwardProp } from './types';
18
13
  export { createGlobalStyle, css, isStyledComponent, IStyleSheetManager, IStyleSheetContext, IStylisContext, keyframes, ServerStyleSheet, StyleSheetConsumer, StyleSheetContext, StyleSheetManager, ThemeConsumer, ThemeContext, ThemeProvider, useTheme, SC_VERSION as version, withTheme, };
@@ -3,18 +3,18 @@ import { Attrs, AttrsArg, ExecutionProps, Interpolation, IStyledComponent, IStyl
3
3
  /**
4
4
  * for types a and b, if b shares a field with a, mark a's field as optional
5
5
  */
6
- declare type OptionalIntersection<A, B> = {
6
+ type OptionalIntersection<A, B> = {
7
7
  [K in Extract<keyof A, keyof B>]?: A[K];
8
8
  };
9
- declare type AttrsResult<T extends Attrs> = T extends (...args: any) => infer P ? P : T;
10
- declare type ExtractAttrsTarget<R extends Runtime, P extends ExecutionProps, DefaultTarget extends StyledTarget<R>> = P['as'] extends KnownTarget ? P['as'] : DefaultTarget;
9
+ type AttrsResult<T extends Attrs> = T extends (...args: any) => infer P ? P : T;
10
+ type ExtractAttrsTarget<R extends Runtime, P extends ExecutionProps, DefaultTarget extends StyledTarget<R>> = P['as'] extends KnownTarget ? P['as'] : DefaultTarget;
11
11
  /**
12
12
  * If attrs type is a function (no type provided, inferring from usage), extract the return value
13
13
  * and merge it with the existing type to hole-punch any required fields that are satisfied as
14
14
  * a result of running attrs. Otherwise if we have a definite type then union the base props
15
15
  * with the passed attr type to capture any intended overrides.
16
16
  */
17
- declare type PropsSatisfiedByAttrs<T extends Attrs, Props extends object, Result extends ExecutionProps = AttrsResult<T>> = Omit<Props, keyof Result> & OptionalIntersection<Props, Result> & Partial<Omit<Result, keyof Props | 'as'>>;
17
+ type PropsSatisfiedByAttrs<T extends Attrs, Props extends object, Result extends ExecutionProps = AttrsResult<T>> = Omit<Props, keyof Result> & OptionalIntersection<Props, Result> & Partial<Omit<Result, keyof Props | 'as'>>;
18
18
  export interface Styled<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = object, OuterStatics extends object = object, RuntimeInjectedProps extends ExecutionProps = object> {
19
19
  <Props extends object = object, Statics extends object = object>(initialStyles: Styles<OuterProps & RuntimeInjectedProps & Props>, ...interpolations: Interpolation<OuterProps & RuntimeInjectedProps & Props>[]): // @ts-expect-error KnownTarget is a subset of StyledTarget<R>
20
20
  IStyledComponent<R, ExtractAttrsTarget<R, RuntimeInjectedProps, Target>, OuterProps & Props> & OuterStatics & Statics;
@@ -1,3 +1,3 @@
1
1
  import React from 'react';
2
2
  import { AnyComponent, ExecutionProps } from '../types';
3
- export default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<JSX.LibraryManagedAttributes<T, ExecutionProps>> & React.RefAttributes<T>> & { [key in Exclude<keyof T, T extends React.MemoExoticComponent<any> ? "propTypes" | "defaultProps" | "displayName" | "$$typeof" | "type" | "compare" : T extends React.ForwardRefExoticComponent<any> ? "propTypes" | "defaultProps" | "displayName" | "$$typeof" | "render" : "length" | "propTypes" | "contextType" | "contextTypes" | "childContextTypes" | "defaultProps" | "displayName" | "getDerivedStateFromProps" | "getDerivedStateFromError" | "type" | "getDefaultProps" | "mixins" | "name" | "prototype" | "caller" | "callee" | "arguments" | "arity">]: T[key]; };
3
+ export default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<JSX.LibraryManagedAttributes<T, ExecutionProps>> & React.RefAttributes<T>> & { [key in Exclude<keyof T, T extends React.MemoExoticComponent<any> ? "propTypes" | "type" | "defaultProps" | "displayName" | "$$typeof" | "compare" : T extends React.ForwardRefExoticComponent<any> ? "propTypes" | "defaultProps" | "displayName" | "$$typeof" | "render" : "length" | "propTypes" | "type" | "contextType" | "contextTypes" | "childContextTypes" | "defaultProps" | "displayName" | "getDerivedStateFromProps" | "getDerivedStateFromError" | "getDefaultProps" | "mixins" | "name" | "prototype" | "caller" | "callee" | "arguments" | "arity">]: T[key]; };
@@ -1,13 +1,13 @@
1
1
  import React from 'react';
2
2
  import StyleSheet from '../sheet';
3
3
  import { ShouldForwardProp, Stringifier } from '../types';
4
- export declare type IStyleSheetContext = {
4
+ export type IStyleSheetContext = {
5
5
  shouldForwardProp?: ShouldForwardProp<'web'>;
6
6
  styleSheet?: StyleSheet;
7
7
  };
8
8
  export declare const StyleSheetContext: React.Context<IStyleSheetContext>;
9
9
  export declare const StyleSheetConsumer: React.Consumer<IStyleSheetContext>;
10
- export declare type IStylisContext = Stringifier | void;
10
+ export type IStylisContext = Stringifier | void;
11
11
  export declare const StylisContext: React.Context<IStylisContext>;
12
12
  export declare const StylisConsumer: React.Consumer<IStylisContext>;
13
13
  export declare const mainSheet: StyleSheet;
@@ -15,7 +15,7 @@ export declare const mainStylis: Stringifier;
15
15
  export declare function useShouldForwardProp(): ShouldForwardProp<"web"> | undefined;
16
16
  export declare function useStyleSheet(): StyleSheet;
17
17
  export declare function useStylis(): Stringifier;
18
- export declare type IStyleSheetManager = React.PropsWithChildren<{
18
+ export type IStyleSheetManager = React.PropsWithChildren<{
19
19
  /**
20
20
  * If desired, you can pass this prop to disable "speedy" insertion mode, which
21
21
  * uses the browser [CSSOM APIs](https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet).
@@ -24,9 +24,9 @@ import React from 'react';
24
24
  export interface DefaultTheme {
25
25
  [key: string]: any;
26
26
  }
27
- declare type ThemeFn = (outerTheme?: DefaultTheme) => DefaultTheme;
28
- declare type ThemeArgument = DefaultTheme | ThemeFn;
29
- declare type Props = {
27
+ type ThemeFn = (outerTheme?: DefaultTheme) => DefaultTheme;
28
+ type ThemeArgument = DefaultTheme | ThemeFn;
29
+ type Props = {
30
30
  children?: React.ReactNode;
31
31
  theme: ThemeArgument;
32
32
  };
@@ -1,13 +1,13 @@
1
1
  import { GroupedTag, Sheet, SheetOptions } from './types';
2
- declare type SheetConstructorArgs = {
2
+ type SheetConstructorArgs = {
3
3
  isServer?: boolean;
4
4
  useCSSOMInjection?: boolean;
5
5
  target?: HTMLElement;
6
6
  };
7
- declare type GlobalStylesAllocationMap = {
7
+ type GlobalStylesAllocationMap = {
8
8
  [key: string]: number;
9
9
  };
10
- declare type NamesAllocationMap = Map<string, Set<string>>;
10
+ type NamesAllocationMap = Map<string, Set<string>>;
11
11
  /** Contains the main stylesheet logic for stringification and caching */
12
12
  export default class StyleSheet implements Sheet {
13
13
  gs: GlobalStylesAllocationMap;
@@ -14,7 +14,7 @@ export interface GroupedTag {
14
14
  length: number;
15
15
  tag: Tag;
16
16
  }
17
- export declare type SheetOptions = {
17
+ export type SheetOptions = {
18
18
  isServer: boolean;
19
19
  target?: HTMLElement;
20
20
  useCSSOMInjection: boolean;
@@ -18,7 +18,7 @@ var SC_ATTR = (typeof process !== 'undefined' && typeof process.env !== 'undefin
18
18
  'data-styled';
19
19
  var SC_ATTR_ACTIVE = 'active';
20
20
  var SC_ATTR_VERSION = 'data-styled-version';
21
- var SC_VERSION = "6.0.0-beta.11";
21
+ var SC_VERSION = "6.0.0-beta.13";
22
22
  var SPLITTER = '/*!sc*/\n';
23
23
  var IS_BROWSER = typeof window !== 'undefined' && 'HTMLElement' in window;
24
24
  var DISABLE_SPEEDY = Boolean(typeof SC_DISABLE_SPEEDY === 'boolean'
@@ -1551,7 +1551,11 @@ function createStyledComponent(target, options, rules) {
1551
1551
  checkDynamicCreation(displayName, styledComponentId);
1552
1552
  WrappedStyledComponent.warnTooManyClasses = createWarnTooManyClasses(displayName, styledComponentId);
1553
1553
  }
1554
- WrappedStyledComponent.toString = function () { return ".".concat(WrappedStyledComponent.styledComponentId); };
1554
+ // If the Object prototype is frozen, the "toString" property is non-writable. This means that any objects which inherit this property
1555
+ // cannot have the property changed using an assignment. If using strict mode, attempting that will cause an error. If not using strict
1556
+ // mode, attempting that will be silently ignored.
1557
+ // However, we can still explicitly shadow the prototype's "toString" property by defining a new "toString" property on this object.
1558
+ Object.defineProperty(WrappedStyledComponent, 'toString', { value: function () { return ".".concat(WrappedStyledComponent.styledComponentId); } });
1555
1559
  if (isCompositeComponent) {
1556
1560
  var compositeComponentTarget = target;
1557
1561
  hoistNonReactStatics(WrappedStyledComponent, compositeComponentTarget, {
@@ -1822,22 +1826,21 @@ var __PRIVATE__ = {
1822
1826
  if (process.env.NODE_ENV !== 'production' &&
1823
1827
  typeof navigator !== 'undefined' &&
1824
1828
  navigator.product === 'ReactNative') {
1825
- console.warn("It looks like you've imported 'styled-components' on React Native.\n" +
1826
- "Perhaps you're looking to import 'styled-components/native'?\n" +
1827
- 'Read more about this at https://www.styled-components.com/docs/basics#react-native');
1829
+ console.warn("It looks like you've imported 'styled-components' on React Native.\nPerhaps you're looking to import 'styled-components/native'?\nRead more about this at https://www.styled-components.com/docs/basics#react-native");
1828
1830
  }
1831
+ var windowGlobalKey = "__sc-".concat(SC_ATTR, "__");
1829
1832
  /* Warning if there are several instances of styled-components */
1830
1833
  if (process.env.NODE_ENV !== 'production' &&
1831
1834
  process.env.NODE_ENV !== 'test' &&
1832
1835
  typeof window !== 'undefined') {
1833
- window['__styled-components-init__'] || (window['__styled-components-init__'] = 0);
1834
- if (window['__styled-components-init__'] === 1) {
1835
- console.warn("It looks like there are several instances of 'styled-components' initialized in this application. " +
1836
- 'This may cause dynamic styles to not render properly, errors during the rehydration process, ' +
1837
- 'a missing theme prop, and makes your application bigger without good reason.\n\n' +
1838
- 'See https://s-c.sh/2BAXzed for more info.');
1839
- }
1840
- window['__styled-components-init__'] += 1;
1836
+ // @ts-expect-error dynamic key not in window object
1837
+ window[windowGlobalKey] || (window[windowGlobalKey] = 0);
1838
+ // @ts-expect-error dynamic key not in window object
1839
+ if (window[windowGlobalKey] === 1) {
1840
+ console.warn("It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.\n\nSee https://s-c.sh/2BAXzed for more info.");
1841
+ }
1842
+ // @ts-expect-error dynamic key not in window object
1843
+ window[windowGlobalKey] += 1;
1841
1844
  }
1842
1845
 
1843
1846
  exports.ServerStyleSheet = ServerStyleSheet;