styled-components 5.3.6 → 5.3.7

package/native/dist/hoc/withTheme.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { AnyComponent, ExecutionContext } from '../types';
-export default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<JSX.LibraryManagedAttributes<T, ExecutionContext>> & 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]; };
+import { AnyComponent, ExecutionProps } from '../types';
+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]; };

package/native/dist/index.d.ts

@@ -1,4 +1,4 @@
 import styled from './constructors/styled';
 export * from './base';
-export { CSSProp, IStyledComponent, IStyledComponentFactory, IStyledStatics, StyledOptions, WebTarget, } from './types';
-export { styled as default };
+export { CSSProp, DefaultTheme, ExecutionContext, ExecutionProps, IStyledComponent, IStyledComponentFactory, IStyledStatics, PolymorphicComponent, PolymorphicComponentProps, Runtime, StyledObject, StyledOptions, WebTarget, } from './types';
+export { styled, styled as default };

package/native/dist/models/GlobalStyle.d.ts

@@ -1,6 +1,6 @@
 import StyleSheet from '../sheet';
 import { ExecutionContext, FlattenerResult, RuleSet, Stringifier } from '../types';
-export default class GlobalStyle<Props = unknown> {
+export default class GlobalStyle<Props extends object> {
     componentId: string;
     isStatic: boolean;
     rules: FlattenerResult<Props>;

package/native/dist/models/InlineStyle.d.ts

@@ -3,4 +3,4 @@ export declare const resetStyleCache: () => void;
 /**
  * InlineStyle takes arbitrary CSS and generates a flat object
  */
-export default function makeInlineStyleClass<Props = unknown>(styleSheet: StyleSheet): IInlineStyleConstructor<Props>;
+export default function makeInlineStyleClass<Props extends object>(styleSheet: StyleSheet): IInlineStyleConstructor<Props>;

package/native/dist/models/StyleSheetManager.d.ts

@@ -1,21 +1,65 @@
 import React from 'react';
 import StyleSheet from '../sheet';
-import { Stringifier } from '../types';
-declare type Props = {
-    children?: React.ReactChild;
-    disableCSSOMInjection?: boolean;
-    disableVendorPrefixes?: boolean;
-    sheet?: StyleSheet;
-    stylisPlugins?: stylis.Middleware[];
-    target?: HTMLElement;
+import { ShouldForwardProp, Stringifier } from '../types';
+export declare type IStyleSheetContext = {
+    shouldForwardProp?: ShouldForwardProp<'web'>;
+    styleSheet?: StyleSheet;
 };
-export declare const StyleSheetContext: React.Context<void | StyleSheet>;
-export declare const StyleSheetConsumer: React.Consumer<void | StyleSheet>;
-export declare const StylisContext: React.Context<void | Stringifier>;
-export declare const StylisConsumer: React.Consumer<void | Stringifier>;
+export declare const StyleSheetContext: React.Context<IStyleSheetContext>;
+export declare const StyleSheetConsumer: React.Consumer<IStyleSheetContext>;
+export declare type IStylisContext = Stringifier | void;
+export declare const StylisContext: React.Context<IStylisContext>;
+export declare const StylisConsumer: React.Consumer<IStylisContext>;
 export declare const mainSheet: StyleSheet;
 export declare const mainStylis: Stringifier;
+export declare function useShouldForwardProp(): ShouldForwardProp<"web"> | undefined;
 export declare function useStyleSheet(): StyleSheet;
 export declare function useStylis(): Stringifier;
-export default function StyleSheetManager(props: Props): JSX.Element;
-export {};
+export declare type IStyleSheetManager = React.PropsWithChildren<{
+    /**
+     * If desired, you can pass this prop to disable "speedy" insertion mode, which
+     * uses the browser [CSSOM APIs](https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet).
+     * When disabled, rules are inserted as simple text into style blocks.
+     */
+    disableCSSOMInjection?: boolean;
+    /**
+     * If you are working exclusively with modern browsers, vendor prefixes can often be omitted
+     * to reduce the weight of CSS on the page.
+     */
+    disableVendorPrefixes?: boolean;
+    /**
+     * Provide an optional selector to be prepended to all generated style rules.
+     */
+    namespace?: string;
+    /**
+     * Create and provide your own `StyleSheet` if necessary for advanced SSR scenarios.
+     */
+    sheet?: StyleSheet;
+    /**
+     * Starting in v6, styled-components no longer does its own prop validation
+     * and recommends use of transient props "$prop" to pass style-only props to
+     * components. If for some reason you are not able to use transient props, a
+     * prop validation function can be provided via `StyleSheetManager`, such as
+     * `@emotion/is-prop-valid`.
+     *
+     * When the return value is `true`, props will be forwarded to the DOM/underlying
+     * component. If return value is `false`, the prop will be discarded after styles
+     * are calculated.
+     *
+     * Manually composing `styled.{element}.withConfig({shouldForwardProp})` will
+     * override this default.
+     */
+    shouldForwardProp?: IStyleSheetContext['shouldForwardProp'];
+    /**
+     * An array of plugins to be run by stylis (style processor) during compilation.
+     * Check out [what's available on npm*](https://www.npmjs.com/search?q=keywords%3Astylis).
+     *
+     * \* The plugin(s) must be compatible with stylis v4 or above.
+     */
+    stylisPlugins?: stylis.Middleware[];
+    /**
+     * Provide an alternate DOM node to host generated styles; useful for iframes.
+     */
+    target?: HTMLElement;
+}>;
+export declare function StyleSheetManager(props: IStyleSheetManager): JSX.Element;

package/native/dist/models/StyledComponent.d.ts

@@ -1,3 +1,3 @@
 import type { IStyledComponentFactory, RuleSet, StyledOptions, WebTarget } from '../types';
-declare function createStyledComponent<Target extends WebTarget, OuterProps extends {}, Statics = unknown>(target: Target, options: StyledOptions<'web', OuterProps>, rules: RuleSet<OuterProps>): ReturnType<IStyledComponentFactory<'web', Target, OuterProps, Statics>>;
+declare function createStyledComponent<Target extends WebTarget, OuterProps extends object, Statics extends object = object>(target: Target, options: StyledOptions<'web', OuterProps>, rules: RuleSet<OuterProps>): ReturnType<IStyledComponentFactory<'web', Target, OuterProps, Statics>>;
 export default createStyledComponent;

package/native/dist/models/StyledNativeComponent.d.ts

@@ -1,3 +1,3 @@
-import type { ExtensibleObject, IInlineStyleConstructor, IStyledComponent, IStyledComponentFactory, NativeTarget, RuleSet, StyledOptions } from '../types';
-declare const _default: (InlineStyle: IInlineStyleConstructor<any>) => <Target extends NativeTarget, OuterProps extends ExtensibleObject, Statics = unknown>(target: Target, options: StyledOptions<"native", OuterProps>, rules: RuleSet<OuterProps>) => IStyledComponent<"native", Target, OuterProps> & Statics;
+import type { ExecutionProps, IInlineStyleConstructor, IStyledComponent, IStyledComponentFactory, NativeTarget, RuleSet, StyledOptions } from '../types';
+declare const _default: (InlineStyle: IInlineStyleConstructor<any>) => <Target extends NativeTarget, OuterProps extends ExecutionProps, Statics extends object = object>(target: Target, options: StyledOptions<"native", OuterProps>, rules: RuleSet<OuterProps>) => IStyledComponent<"native", Target, OuterProps & object> & Statics & object;
 export default _default;

package/native/dist/models/ThemeProvider.d.ts

@@ -27,7 +27,7 @@ export interface DefaultTheme {
 declare type ThemeFn = (outerTheme?: DefaultTheme) => DefaultTheme;
 declare type ThemeArgument = DefaultTheme | ThemeFn;
 declare type Props = {
-    children?: React.ReactChild;
+    children?: React.ReactNode;
     theme: ThemeArgument;
 };
 export declare const ThemeContext: React.Context<DefaultTheme | undefined>;

package/native/dist/native/index.d.ts

@@ -6,36 +6,32 @@ import useTheme from '../hooks/useTheme';
 import ThemeProvider, { ThemeConsumer, ThemeContext } from '../models/ThemeProvider';
 import { NativeTarget } from '../types';
 import isStyledComponent from '../utils/isStyledComponent';
-declare const styled: (<Target extends NativeTarget>(tag: Target) => {
-    <Props extends {} = {}, Statics = unknown>(initialStyles: import("../types").Styles<(Target extends import("../types").KnownTarget ? React.ComponentProps<Target> : unknown) & Props>, ...interpolations: import("../types").Interpolation<import("../types").ExecutionContext & (Target extends import("../types").KnownTarget ? React.ComponentProps<Target> : unknown) & Props>[]): import("../types").IStyledComponent<"native", Target, (Target extends import("../types").KnownTarget ? React.ComponentProps<Target> : unknown) & Props> & Statics;
-    attrs(attrs: import("../types").Attrs<import("../types").ExtensibleObject & (Target extends import("../types").KnownTarget ? React.ComponentProps<Target> : unknown)>): any;
-    withConfig(config: import("../types").StyledOptions<"native", Target extends import("../types").KnownTarget ? React.ComponentProps<Target> : unknown>): any;
-}) & {
-    ActivityIndicator: Styled<"native", typeof import("react-native").ActivityIndicator, import("react-native").ActivityIndicatorProps, {}, unknown>;
-    Button: Styled<"native", typeof import("react-native").Button, import("react-native").ButtonProps, {}, unknown>;
-    DatePickerIOS: Styled<"native", typeof import("react-native").DatePickerIOS, import("react-native").DatePickerIOSProps, {}, unknown>;
-    DrawerLayoutAndroid: Styled<"native", typeof import("react-native").DrawerLayoutAndroid, import("react-native").DrawerLayoutAndroidProps, {}, unknown>;
-    FlatList: Styled<"native", typeof import("react-native").FlatList, import("react-native").FlatListProps<unknown>, {}, unknown>;
-    Image: Styled<"native", typeof import("react-native").Image, import("react-native").ImageProps, {}, unknown>;
-    ImageBackground: Styled<"native", typeof import("react-native").ImageBackground, import("react-native").ImageBackgroundProps, {}, unknown>;
-    KeyboardAvoidingView: Styled<"native", typeof import("react-native").KeyboardAvoidingView, import("react-native").KeyboardAvoidingViewProps, {}, unknown>;
-    Modal: Styled<"native", typeof import("react-native").Modal, import("react-native").ModalProps, {}, unknown>;
-    Pressable: Styled<"native", import("react").ForwardRefExoticComponent<import("react-native").PressableProps & import("react").RefAttributes<import("react-native").View>>, import("react-native").PressableProps & import("react").RefAttributes<import("react-native").View>, {}, unknown>;
-    ProgressBarAndroid: Styled<"native", typeof import("react-native").ProgressBarAndroid, import("react-native").ProgressBarAndroidProps, {}, unknown>;
-    ProgressViewIOS: Styled<"native", typeof import("react-native").ProgressViewIOS, import("react-native").ProgressViewIOSProps, {}, unknown>;
-    RefreshControl: Styled<"native", typeof import("react-native").RefreshControl, import("react-native").RefreshControlProps, {}, unknown>;
-    SafeAreaView: Styled<"native", typeof import("react-native").SafeAreaView, import("react-native").ViewProps, {}, unknown>;
-    ScrollView: Styled<"native", typeof import("react-native").ScrollView, import("react-native").ScrollViewProps, {}, unknown>;
-    SectionList: Styled<"native", typeof import("react-native").SectionList, import("react-native").SectionListProps<unknown, unknown>, {}, unknown>;
-    Slider: Styled<"native", typeof import("react-native").Slider, import("react-native").SliderProps, {}, unknown>;
-    Switch: Styled<"native", typeof import("react-native").Switch, import("react-native").SwitchProps, {}, unknown>;
-    Text: Styled<"native", typeof import("react-native").Text, import("react-native").TextProps, {}, unknown>;
-    TextInput: Styled<"native", typeof import("react-native").TextInput, import("react-native").TextInputProps, {}, unknown>;
-    TouchableHighlight: Styled<"native", typeof import("react-native").TouchableHighlight, import("react-native").TouchableHighlightProps, {}, unknown>;
-    TouchableOpacity: Styled<"native", typeof import("react-native").TouchableOpacity, import("react-native").TouchableOpacityProps, {}, unknown>;
-    View: Styled<"native", typeof import("react-native").View, import("react-native").ViewProps, {}, unknown>;
-    VirtualizedList: Styled<"native", typeof import("react-native").VirtualizedList, import("react-native").VirtualizedListProps<unknown>, {}, unknown>;
+declare const styled: (<Target extends NativeTarget>(tag: Target) => Styled<"native", Target, Target extends import("../types").KnownTarget ? React.ComponentPropsWithRef<Target> : object, object, object>) & {
+    ActivityIndicator: Styled<"native", typeof import("react-native").ActivityIndicator, object, object, object>;
+    Button: Styled<"native", typeof import("react-native").Button, object, object, object>;
+    DatePickerIOS: Styled<"native", typeof import("react-native").DatePickerIOS, object, object, object>;
+    DrawerLayoutAndroid: Styled<"native", typeof import("react-native").DrawerLayoutAndroid, object, object, object>;
+    FlatList: Styled<"native", typeof import("react-native").FlatList, object, object, object>;
+    Image: Styled<"native", typeof import("react-native").Image, object, object, object>;
+    ImageBackground: Styled<"native", typeof import("react-native").ImageBackground, object, object, object>;
+    KeyboardAvoidingView: Styled<"native", typeof import("react-native").KeyboardAvoidingView, object, object, object>;
+    Modal: Styled<"native", typeof import("react-native").Modal, object, object, object>;
+    Pressable: Styled<"native", import("react").ForwardRefExoticComponent<import("react-native").PressableProps & import("react").RefAttributes<import("react-native").View>>, object, object, object>;
+    ProgressBarAndroid: Styled<"native", typeof import("react-native").ProgressBarAndroid, object, object, object>;
+    ProgressViewIOS: Styled<"native", typeof import("react-native").ProgressViewIOS, object, object, object>;
+    RefreshControl: Styled<"native", typeof import("react-native").RefreshControl, object, object, object>;
+    SafeAreaView: Styled<"native", typeof import("react-native").SafeAreaView, object, object, object>;
+    ScrollView: Styled<"native", typeof import("react-native").ScrollView, object, object, object>;
+    SectionList: Styled<"native", typeof import("react-native").SectionList, object, object, object>;
+    Slider: Styled<"native", typeof import("react-native").Slider, object, object, object>;
+    Switch: Styled<"native", typeof import("react-native").Switch, object, object, object>;
+    Text: Styled<"native", typeof import("react-native").Text, object, object, object>;
+    TextInput: Styled<"native", typeof import("react-native").TextInput, object, object, object>;
+    TouchableHighlight: Styled<"native", typeof import("react-native").TouchableHighlight, object, object, object>;
+    TouchableOpacity: Styled<"native", typeof import("react-native").TouchableOpacity, object, object, object>;
+    View: Styled<"native", typeof import("react-native").View, object, object, object>;
+    VirtualizedList: Styled<"native", typeof import("react-native").VirtualizedList, object, object, object>;
 };
-export { IStyledComponent, IStyledComponentFactory, IStyledStatics, NativeTarget, StyledOptions, } from '../types';
+export { DefaultTheme, ExecutionContext, ExecutionProps, IStyledComponent, IStyledComponentFactory, IStyledStatics, NativeTarget, PolymorphicComponent, PolymorphicComponentProps, Runtime, StyledObject, StyledOptions, } from '../types';
 export { css, isStyledComponent, ThemeProvider, ThemeConsumer, ThemeContext, withTheme, useTheme };
-export default styled;
+export { styled, styled as default };

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

@@ -151,13 +151,13 @@ 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 = typeof process !== 'undefined' && typeof process.env !== '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.6";
+var SC_VERSION = "5.3.7";
 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
+var DISABLE_SPEEDY = Boolean(typeof SC_DISABLE_SPEEDY === 'boolean' ? SC_DISABLE_SPEEDY : typeof process !== 'undefined' && typeof process.env !== '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 !== '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 && process.env.NODE_ENV !== 'production'); // Shared empty execution context when generating static styles
 
 //      
 var EMPTY_ARRAY = Object.freeze([]);
@@ -5993,7 +5993,7 @@ var StyledNativeComponent = /*#__PURE__*/function (_Component) {
       propsForElement.style = typeof style === 'function' ? function (state) {
         return [generatedStyles].concat(style(state));
       } : [generatedStyles].concat(style);
-      propsForElement.testID = testID;
+      propsForElement.testID = testID || propsForElement.testID;
       if (forwardedRef) propsForElement.ref = forwardedRef;
       if (forwardedAs) propsForElement.as = forwardedAs;
       return React.createElement(elementToBeRendered, propsForElement);