npm - styled-components - Versions diffs - 5.3.10 → 5.3.11 - Mend

styled-components 5.3.10 → 5.3.11

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 (22) hide show

package/dist/styled-components.browser.cjs.js +1 -1
package/dist/styled-components.browser.cjs.js.map +1 -1
package/dist/styled-components.browser.esm.js +1 -1
package/dist/styled-components.browser.esm.js.map +1 -1
package/dist/styled-components.cjs.js +1 -1
package/dist/styled-components.cjs.js.map +1 -1
package/dist/styled-components.esm.js +1 -1
package/dist/styled-components.esm.js.map +1 -1
package/dist/styled-components.js +1 -1
package/dist/styled-components.js.map +1 -1
package/dist/styled-components.min.js +1 -1
package/dist/styled-components.min.js.map +1 -1
package/native/dist/constructors/constructWithOptions.d.ts +18 -3
package/native/dist/styled-components.native.cjs.js +1 -1
package/native/dist/styled-components.native.esm.js +1 -1
package/native/dist/test/veryLargeUnionType.d.ts +1 -0
package/native/dist/types.d.ts +13 -6
package/native/dist/utils/joinStrings.d.ts +1 -1
package/package.json +1 -1
package/primitives/dist/styled-components-primitives.cjs.js +1 -1
package/primitives/dist/styled-components-primitives.esm.js +1 -1
package/native/dist/hooks/useTheme.d.ts +0 -3

package/native/dist/constructors/constructWithOptions.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Attrs, ExecutionProps, Interpolation, IStyledComponent, IStyledComponentFactory, KnownTarget, Runtime, StyledOptions, StyledTarget, Styles } from '../types';
+import { Attrs, DataAttributes, ExecutionContext, ExecutionProps, Interpolation, IStyledComponent, IStyledComponentFactory, KnownTarget, NoInfer, Runtime, StyledOptions, StyledTarget, Styles, SubsetOnly } from '../types';
 /**
  * for types a and b, if b shares a field with a, mark a's field as optional
  */
@@ -15,10 +15,25 @@ type ExtractAttrsTarget<R extends Runtime, P extends ExecutionProps, DefaultTarg
  * with the passed attr type to capture any intended overrides.
  */
 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'>>;
+/**
+ * Rejects an attr factory function argument (T) if it returns any properties not defined in Props.
+ */
+type StrictAttrFactory<T, Props> = T extends ((props: ExecutionContext & Props) => infer TResult) ? TResult extends SubsetOnly<TResult, (Partial<Props> & ExecutionProps & DataAttributes & React.AriaAttributes)> ? (props: ExecutionContext & Props) => TResult : never : never;
 export interface Styled<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = object, OuterStatics extends object = object, RuntimeInjectedProps extends ExecutionProps = object> {
-    <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>
+    <Props extends object = object, Statics extends object = object>(initialStyles: Styles<OuterProps & RuntimeInjectedProps & NoInfer<Props>>, ...interpolations: Interpolation<OuterProps & RuntimeInjectedProps & NoInfer<Props>>[]): // @ts-expect-error KnownTarget is a subset of StyledTarget<R>
     IStyledComponent<R, ExtractAttrsTarget<R, RuntimeInjectedProps, Target>, OuterProps & Props> & OuterStatics & Statics;
-    attrs: <T extends Attrs, TResult extends ExecutionProps = AttrsResult<T>, TTarget extends StyledTarget<R> = ExtractAttrsTarget<R, TResult, Target>>(attrs: Attrs<T extends (...args: any) => infer P ? OuterProps & P : OuterProps & T>) => Styled<R, TTarget, PropsSatisfiedByAttrs<T, OuterProps>, OuterStatics, Omit<RuntimeInjectedProps, keyof TResult> & TResult>;
+    /**
+     * This is a chainable method that attaches some props to a styled component.
+     * @param props An object containing prop values that will be merged into the rest of the component's props
+     * @argument Props Additional props being injected in `props`
+     */
+    attrs<Props extends object = object, PropValues extends Partial<OuterProps> & ExecutionProps & DataAttributes & React.AriaAttributes & NoInfer<Props> = Partial<OuterProps> & ExecutionProps & DataAttributes & React.AriaAttributes & NoInfer<Props>>(props: PropValues & SubsetOnly<PropValues, Partial<OuterProps> & ExecutionProps & DataAttributes & React.AriaAttributes & NoInfer<Props>>): Styled<R, Target, PropsSatisfiedByAttrs<PropValues, OuterProps>, OuterStatics, Omit<RuntimeInjectedProps, keyof PropValues> & PropValues>;
+    /**
+     * This is a chainable method that attaches some props to a styled component.
+     * @param propFactory A function that receives the props that are passed into the component and computes a value, that is then going to be merged into the existing component props.
+     * @argument Props Additional props being returned by `propFactory`
+     */
+    attrs<Props extends object = object, Factory extends ((...args: any[]) => any) = (...args: any[]) => any, TTarget extends StyledTarget<R> = ExtractAttrsTarget<R, AttrsResult<Factory>, Target>>(propFactory: Factory & StrictAttrFactory<Factory, OuterProps & NoInfer<Props>>): Styled<R, TTarget, PropsSatisfiedByAttrs<Factory, OuterProps>, OuterStatics, Omit<RuntimeInjectedProps, keyof AttrsResult<Factory>> & AttrsResult<Factory>>;
     withConfig: (config: StyledOptions<R, OuterProps>) => Styled<R, Target, OuterProps, OuterStatics>;
 }
 export default function constructWithOptions<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = Target extends KnownTarget ? React.ComponentPropsWithRef<Target> : object, OuterStatics extends object = object>(componentConstructor: IStyledComponentFactory<R, Target, OuterProps, OuterStatics>, tag: Target, options?: StyledOptions<R, OuterProps>): Styled<R, Target, OuterProps, OuterStatics>;

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

@@ -154,7 +154,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 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.10";
+var SC_VERSION = "5.3.11";
 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 !== '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.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' : false); // Shared empty execution context when generating static styles

package/native/dist/styled-components.native.esm.js CHANGED Viewed

@@ -147,7 +147,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 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.10";
+var SC_VERSION = "5.3.11";
 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 !== '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.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' : false); // Shared empty execution context when generating static styles

package/native/dist/test/veryLargeUnionType.d.ts ADDED Viewed

@@ -0,0 +1 @@

package/native/dist/types.d.ts CHANGED Viewed

@@ -26,6 +26,9 @@ export interface StyledOptions<R extends Runtime, Props extends object> {
 export type Dict<T> = {
     [key: string]: T;
 };
+export interface DataAttributes {
+    [key: `data-${string}`]: unknown;
+}
 export interface ExecutionProps {
     /**
      * Dynamically adjust the rendered component or HTML tag, e.g.
@@ -48,10 +51,10 @@ export interface ExecutionContext extends ExecutionProps {
     theme: DefaultTheme;
 }
 export interface StyleFunction<Props extends object> {
-    (executionContext: ExecutionContext & Omit<Props, keyof ExecutionContext>): Interpolation<Props>;
+    (executionContext: ExecutionContext & Props): Interpolation<Props>;
 }
-export type Interpolation<Props extends object> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | IStyledComponent<'web', any, any> | Interpolation<Props>[];
-export type Attrs<Props extends object = object> = (ExecutionProps & Props) | ((props: ExecutionContext & Props) => Partial<Props>);
+export type Interpolation<Props extends object> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | IStyledComponent<'web', any> | Interpolation<Props>[];
+export type Attrs<Props extends object = object> = (ExecutionProps & Props) | ((props: ExecutionContext & Props) => Props);
 export type RuleSet<Props extends object> = Interpolation<Props>[];
 export type Styles<Props extends object> = TemplateStringsArray | StyledObject<Props> | StyleFunction<Props>;
 export type NameGenerator = (hash: number) => string;
@@ -90,7 +93,7 @@ export interface IStyledStatics<R extends Runtime, OuterProps extends object> ex
 /**
  * Used by PolymorphicComponent to define prop override cascading order.
  */
-export type PolymorphicComponentProps<R extends Runtime, E extends StyledTarget<R>, P extends object> = Omit<E extends KnownTarget ? P & Omit<React.ComponentPropsWithRef<E>, keyof P> : P, 'as' | 'theme'> & {
+export type PolymorphicComponentProps<R extends Runtime, E extends StyledTarget<R>, P extends object> = Omit<E extends KnownTarget ? Omit<P, keyof React.ComponentPropsWithRef<E>> & React.ComponentPropsWithRef<E> : P, 'as' | 'theme'> & {
     as?: P extends {
         as?: string | AnyComponent;
     } ? P['as'] : E;
@@ -105,7 +108,7 @@ export type PolymorphicComponentProps<R extends Runtime, E extends StyledTarget<
 export interface PolymorphicComponent<R extends Runtime, P extends object, FallbackComponent extends StyledTarget<R>> extends React.ForwardRefExoticComponent<P> {
     <E extends StyledTarget<R> = FallbackComponent>(props: PolymorphicComponentProps<R, E, P>): React.ReactElement | null;
 }
-export interface IStyledComponent<R extends Runtime, Target extends StyledTarget<R>, Props extends object> extends PolymorphicComponent<R, Props, Target>, IStyledStatics<R, Props> {
+export interface IStyledComponent<R extends Runtime, Target extends StyledTarget<R>, Props extends object = Target extends KnownTarget ? React.ComponentPropsWithRef<Target> : object> extends PolymorphicComponent<R, Props, Target>, IStyledStatics<R, Props> {
     defaultProps?: Partial<(Target extends KnownTarget ? ExecutionProps & Omit<React.ComponentProps<Target>, keyof ExecutionProps> : ExecutionProps) & Props>;
     toString: () => string;
 }
@@ -120,7 +123,7 @@ export interface IInlineStyle<Props extends object> {
     generateStyleObject(executionContext: Object): Object;
 }
 export interface StyledObject<Props extends object> {
-    [key: string]: Dict<any> | string | number | StyleFunction<Props> | StyledObject<Props>;
+    [key: string]: string | number | StyleFunction<Props> | StyledObject<Props> | undefined;
 }
 /**
  * The `css` prop is not declared by default in the types as it would cause `css` to be present
@@ -144,3 +147,7 @@ export interface StyledObject<Props extends object> {
  * {@link DefaultTheme}.
  */
 export type CSSProp = RuleSet<any>;
+export type NoInfer<T> = [T][T extends any ? 0 : never];
+export type SubsetOnly<A, B> = {
+    [K in keyof A]: K extends keyof B ? A[K] : never;
+};

package/native/dist/utils/joinStrings.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 /**
  * Convenience function for joining strings to form className chains
  */
-export declare function joinStrings(a?: string, b?: string): string;
+export declare function joinStrings(a?: string | null, b?: string | null): string;
 export declare function joinStringArray(arr: string[], sep?: string): string;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "styled-components",
-  "version": "5.3.10",
+  "version": "5.3.11",
   "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/primitives/dist/styled-components-primitives.cjs.js CHANGED Viewed

@@ -155,7 +155,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 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.10";
+var SC_VERSION = "5.3.11";
 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 !== '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.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' : false); // Shared empty execution context when generating static styles

package/primitives/dist/styled-components-primitives.esm.js CHANGED Viewed

@@ -148,7 +148,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
 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.10";
+var SC_VERSION = "5.3.11";
 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 !== '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.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' : false); // Shared empty execution context when generating static styles

package/native/dist/hooks/useTheme.d.ts DELETED Viewed

@@ -1,3 +0,0 @@
-import { DefaultTheme } from '../models/ThemeProvider';
-declare const useTheme: () => DefaultTheme | undefined;
-export default useTheme;