styled-components 6.2.0 → 6.3.0

package/dist/types.d.ts

@@ -1,204 +0,0 @@
-import type * as CSS from 'csstype';
-import React from 'react';
-import ComponentStyle from './models/ComponentStyle';
-import { DefaultTheme } from './models/ThemeProvider';
-import createWarnTooManyClasses from './utils/createWarnTooManyClasses';
-import type { SupportedHTMLElements } from './utils/domElements';
-export { CSS, DefaultTheme, SupportedHTMLElements };
-export interface ExoticComponentWithDisplayName<P extends BaseObject = {}> extends React.ExoticComponent<P> {
-    defaultProps?: Partial<P> | undefined;
-    displayName?: string | undefined;
-}
-/**
- * Use this type to disambiguate between a styled-component instance
- * and a StyleFunction or any other type of function.
- */
-export type StyledComponentBrand = {
-    readonly _sc: symbol;
-};
-export type BaseObject = {};
-export type OmitNever<T> = {
-    [K in keyof T as T[K] extends never ? never : K]: T[K];
-};
-export type FastOmit<T extends BaseObject, U extends string | number | symbol> = {
-    [K in keyof T as K extends U ? never : K]: T[K];
-};
-export type Runtime = 'web' | 'native';
-export type AnyComponent<P extends BaseObject = any> = ExoticComponentWithDisplayName<P> | React.ComponentType<P>;
-export type KnownTarget = SupportedHTMLElements | AnyComponent;
-export type WebTarget = string | KnownTarget;
-export type NativeTarget = AnyComponent;
-export type StyledTarget<R extends Runtime> = R extends 'web' ? WebTarget : NativeTarget;
-export interface StyledOptions<R extends Runtime, Props extends BaseObject> {
-    attrs?: Attrs<Props>[] | undefined;
-    componentId?: (R extends 'web' ? string : never) | undefined;
-    displayName?: string | undefined;
-    parentComponentId?: (R extends 'web' ? string : never) | undefined;
-    shouldForwardProp?: ShouldForwardProp<R> | undefined;
-}
-export type Dict<T = any> = {
-    [key: string]: T;
-};
-/**
- * This type is intended for when data attributes are composed via
- * the `.attrs` API:
- *
- * ```tsx
- * styled.div.attrs<DataAttributes>({ 'data-testid': 'foo' })``
- * ```
- *
- * Would love to figure out how to support this natively without having to
- * manually compose the type, but haven't figured out a way to do so yet that
- * doesn't cause specificity loss (see `test/types.tsx` if you attempt to embed
- * `DataAttributes` directly in the `Attrs<>` type.)
- */
-export type DataAttributes = {
-    [key: `data-${string}`]: any;
-};
-export type ExecutionProps = {
-    /**
-     * Dynamically adjust the rendered component or HTML tag, e.g.
-     * ```
-     * const StyledButton = styled.button``
-     *
-     * <StyledButton as="a" href="/foo">
-     *   I'm an anchor now
-     * </StyledButton>
-     * ```
-     */
-    as?: KnownTarget | undefined;
-    forwardedAs?: KnownTarget | undefined;
-    theme?: DefaultTheme | undefined;
-};
-/**
- * ExecutionProps but with `theme` required.
- */
-export interface ExecutionContext extends ExecutionProps {
-    theme: DefaultTheme;
-}
-export interface StyleFunction<Props extends BaseObject> {
-    (executionContext: ExecutionContext & Props): Interpolation<Props>;
-}
-export type Interpolation<Props extends BaseObject> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | StyledComponentBrand | RuleSet<Props> | Interpolation<Props>[];
-export type Attrs<Props extends BaseObject = BaseObject> = (ExecutionProps & Partial<Props>) | ((props: ExecutionContext & Props) => ExecutionProps & Partial<Props>);
-export type RuleSet<Props extends BaseObject = BaseObject> = Interpolation<Props>[];
-export type Styles<Props extends BaseObject> = TemplateStringsArray | StyledObject<Props> | StyleFunction<Props>;
-export type NameGenerator = (hash: number) => string;
-export interface StyleSheet {
-    create: Function;
-}
-export interface Keyframes {
-    id: string;
-    name: string;
-    rules: string;
-}
-export interface Flattener<Props extends BaseObject> {
-    (chunks: Interpolation<Props>[], executionContext: object | null | undefined, styleSheet: StyleSheet | null | undefined): Interpolation<Props>[];
-}
-export interface Stringifier {
-    (css: string, selector?: string | undefined, prefix?: string | undefined, componentId?: string | undefined): string[];
-    hash: string;
-}
-export interface ShouldForwardProp<R extends Runtime> {
-    (prop: string, elementToBeCreated: StyledTarget<R>): boolean;
-}
-export interface CommonStatics<R extends Runtime, Props extends BaseObject> {
-    attrs: Attrs<Props>[];
-    target: StyledTarget<R>;
-    shouldForwardProp?: ShouldForwardProp<R> | undefined;
-}
-export interface IStyledStatics<R extends Runtime, OuterProps extends BaseObject> extends CommonStatics<R, OuterProps> {
-    componentStyle: R extends 'web' ? ComponentStyle : never;
-    foldedComponentIds: R extends 'web' ? 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) | undefined;
-}
-/**
- * Used by PolymorphicComponent to define prop override cascading order.
- */
-export type PolymorphicComponentProps<R extends Runtime, BaseProps extends BaseObject, AsTarget extends StyledTarget<R> | void, ForwardedAsTarget extends StyledTarget<R> | void, AsTargetProps extends BaseObject = AsTarget extends KnownTarget ? React.ComponentPropsWithRef<AsTarget> : {}, ForwardedAsTargetProps extends BaseObject = ForwardedAsTarget extends KnownTarget ? React.ComponentPropsWithRef<ForwardedAsTarget> : {}> = NoInfer<FastOmit<Substitute<BaseProps, Substitute<ForwardedAsTargetProps, AsTargetProps>>, keyof ExecutionProps>> & FastOmit<ExecutionProps, 'as' | 'forwardedAs'> & {
-    as?: AsTarget;
-    forwardedAs?: ForwardedAsTarget;
-};
-/**
- * This type forms the signature for a forwardRef-enabled component
- * that accepts the "as" prop to dynamically change the underlying
- * rendered JSX. The interface will automatically attempt to extract
- * props from the given rendering target to get proper typing for
- * any specialized props in the target component.
- */
-export interface PolymorphicComponent<R extends Runtime, BaseProps extends BaseObject> extends React.ForwardRefExoticComponent<BaseProps> {
-    <AsTarget extends StyledTarget<R> | void = void, ForwardedAsTarget extends StyledTarget<R> | void = void>(props: PolymorphicComponentProps<R, BaseProps, AsTarget, ForwardedAsTarget>): React.JSX.Element;
-}
-export interface IStyledComponentBase<R extends Runtime, Props extends BaseObject = BaseObject> extends PolymorphicComponent<R, Props>, IStyledStatics<R, Props>, StyledComponentBrand {
-    defaultProps?: (ExecutionProps & Partial<Props>) | undefined;
-    toString: () => string;
-}
-export type IStyledComponent<R extends Runtime, Props extends BaseObject = BaseObject> = IStyledComponentBase<R, Props> & 
-/**
- * TypeScript doesn't allow using a styled component as a key inside object
- * styles because "A computed property name must be of type 'string', 'number',
- * 'symbol', or 'any'.". The toString() method only exists in the web runtime.
- * This hack intersects the `IStyledComponent` type with the built-in `string`
- * type to keep TSC happy.
- *
- * @example
- *  const H1 = styled.h1({
- *    fontSize: '2rem'
- *  });
- *
- *  const Header = styled.header({
- *    [H1]: {
- *      marginBottom: '1rem'
- *    }
- *  })
- */
-(R extends 'web' ? string : {});
-export interface IStyledComponentFactory<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends BaseObject, OuterStatics extends BaseObject = BaseObject> {
-    <Props extends BaseObject = BaseObject, Statics extends BaseObject = BaseObject>(target: Target, options: StyledOptions<R, OuterProps & Props>, rules: RuleSet<OuterProps & Props>): IStyledComponent<R, Substitute<OuterProps, Props>> & OuterStatics & Statics;
-}
-export interface IInlineStyleConstructor<Props extends BaseObject> {
-    new (rules: RuleSet<Props>): IInlineStyle<Props>;
-}
-export interface IInlineStyle<Props extends BaseObject> {
-    rules: RuleSet<Props>;
-    generateStyleObject(executionContext: ExecutionContext & Props): object;
-}
-export type CSSProperties = CSS.Properties<number | (string & {})>;
-export type CSSPseudos = {
-    [K in CSS.Pseudos]?: CSSObject;
-};
-export type CSSKeyframes = object & {
-    [key: string]: CSSObject;
-};
-export type CSSObject<Props extends BaseObject = BaseObject> = StyledObject<Props>;
-export interface StyledObject<Props extends BaseObject = BaseObject> extends CSSProperties, CSSPseudos {
-    [key: string]: StyledObject<Props> | string | number | StyleFunction<Props> | RuleSet<any> | undefined;
-}
-/**
- * The `css` prop is not declared by default in the types as it would cause `css` to be present
- * on the types of anything that uses styled-components indirectly, even if they do not use the
- * babel plugin.
- *
- * To enable support for the `css` prop in TypeScript, create a `styled-components.d.ts` file in
- * your project source with the following contents:
- *
- * ```ts
- * import type { CSSProp } from "styled-components";
- *
- * declare module "react" {
- *  interface Attributes {
- *    css?: CSSProp;
- *  }
- * }
- * ```
- *
- * In order to get accurate typings for `props.theme` in `css` interpolations, see
- * {@link DefaultTheme}.
- */
-export type CSSProp = Interpolation<any>;
-export type NoInfer<T> = [T][T extends any ? 0 : never];
-export type Substitute<A extends BaseObject, B extends BaseObject> = FastOmit<A, keyof B> & B;
-export type InsertionTarget = HTMLElement | ShadowRoot;

package/dist/utils/addUnitIfNeeded.d.ts

@@ -1 +0,0 @@
-export default function addUnitIfNeeded(name: string, value: any): string;

package/dist/utils/checkDynamicCreation.d.ts

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

package/dist/utils/createWarnTooManyClasses.d.ts

@@ -1,3 +0,0 @@
-export declare const LIMIT = 200;
-declare const _default: (displayName: string, componentId: string) => (className: string) => void;
-export default _default;

package/dist/utils/determineTheme.d.ts

@@ -1,4 +0,0 @@
-import { DefaultTheme, ExecutionProps } from '../types';
-export default function determineTheme(props: ExecutionProps, providedTheme?: DefaultTheme | undefined, defaultProps?: {
-    theme?: DefaultTheme | undefined;
-}): DefaultTheme | undefined;

package/dist/utils/domElements.d.ts

@@ -1,4 +0,0 @@
-declare const elements: readonly ["a", "abbr", "address", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "cite", "code", "col", "colgroup", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "header", "hgroup", "hr", "html", "i", "iframe", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "menu", "menuitem", "meta", "meter", "nav", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "pre", "progress", "q", "rp", "rt", "ruby", "s", "samp", "script", "section", "select", "small", "source", "span", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "textarea", "tfoot", "th", "thead", "time", "tr", "track", "u", "ul", "use", "var", "video", "wbr", "circle", "clipPath", "defs", "ellipse", "foreignObject", "g", "image", "line", "linearGradient", "marker", "mask", "path", "pattern", "polygon", "polyline", "radialGradient", "rect", "stop", "svg", "text", "tspan"];
-declare const _default: Set<"object" | "g" | "map" | "big" | "link" | "small" | "sub" | "sup" | "input" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "summary" | "table" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "circle" | "clipPath" | "defs" | "ellipse" | "foreignObject" | "image" | "line" | "linearGradient" | "marker" | "mask" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "svg" | "text" | "tspan" | "use">;
-export default _default;
-export type SupportedHTMLElements = (typeof elements)[number];

package/dist/utils/empties.d.ts

@@ -1,3 +0,0 @@
-import { Dict } from '../types';
-export declare const EMPTY_ARRAY: Readonly<any[]>;
-export declare const EMPTY_OBJECT: Readonly<Dict<any>>;

package/dist/utils/error.d.ts

@@ -1,5 +0,0 @@
-/**
- * Create an error file out of errors.md for development and a simple web link to the full errors
- * in production mode.
- */
-export default function throwStyledComponentsError(code: string | number, ...interpolations: any[]): Error;

package/dist/utils/errors.d.ts

@@ -1,21 +0,0 @@
-declare const _default: {
-    '1': string;
-    '2': string;
-    '3': string;
-    '4': string;
-    '5': string;
-    '6': string;
-    '7': string;
-    '8': string;
-    '9': string;
-    '10': string;
-    '11': string;
-    '12': string;
-    '13': string;
-    '14': string;
-    '15': string;
-    '16': string;
-    '17': string;
-    '18': string;
-};
-export default _default;

package/dist/utils/escape.d.ts

@@ -1,5 +0,0 @@
-/**
- * TODO: Explore using CSS.escape when it becomes more available
- * in evergreen browsers.
- */
-export default function escape(str: string): string;

package/dist/utils/flatten.d.ts

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

package/dist/utils/generateAlphabeticName.d.ts

@@ -1 +0,0 @@
-export default function generateAlphabeticName(code: number): string;

package/dist/utils/generateComponentId.d.ts

@@ -1 +0,0 @@
-export default function generateComponentId(str: string): string;

package/dist/utils/generateDisplayName.d.ts

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

package/dist/utils/getComponentName.d.ts

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

package/dist/utils/hash.d.ts

@@ -1,3 +0,0 @@
-export declare const SEED = 5381;
-export declare const phash: (h: number, x: string) => number;
-export declare const hash: (x: string) => number;

package/dist/utils/hoist.d.ts

@@ -1,51 +0,0 @@
-import React from 'react';
-import { AnyComponent } from '../types';
-/**
- * Adapted from hoist-non-react-statics to avoid the react-is dependency.
- */
-declare const REACT_STATICS: {
-    childContextTypes: boolean;
-    contextType: boolean;
-    contextTypes: boolean;
-    defaultProps: boolean;
-    displayName: boolean;
-    getDefaultProps: boolean;
-    getDerivedStateFromError: boolean;
-    getDerivedStateFromProps: boolean;
-    mixins: boolean;
-    propTypes: boolean;
-    type: boolean;
-};
-declare const KNOWN_STATICS: {
-    name: boolean;
-    length: boolean;
-    prototype: boolean;
-    caller: boolean;
-    callee: boolean;
-    arguments: boolean;
-    arity: boolean;
-};
-declare const FORWARD_REF_STATICS: {
-    $$typeof: boolean;
-    render: boolean;
-    defaultProps: boolean;
-    displayName: boolean;
-    propTypes: boolean;
-};
-declare const MEMO_STATICS: {
-    $$typeof: boolean;
-    compare: boolean;
-    defaultProps: boolean;
-    displayName: boolean;
-    propTypes: boolean;
-    type: boolean;
-};
-type OmniComponent = AnyComponent;
-type ExcludeList = {
-    [key: string]: true;
-};
-export type NonReactStatics<S extends OmniComponent, C extends ExcludeList = {}> = {
-    [key in Exclude<keyof S, S extends React.MemoExoticComponent<any> ? keyof typeof MEMO_STATICS | keyof C : S extends React.ForwardRefExoticComponent<any> ? keyof typeof FORWARD_REF_STATICS | keyof C : keyof typeof REACT_STATICS | keyof typeof KNOWN_STATICS | keyof C>]: S[key];
-};
-export default function hoistNonReactStatics<T extends OmniComponent, S extends OmniComponent, C extends ExcludeList = {}>(targetComponent: T, sourceComponent: S, excludelist?: C | undefined): T & NonReactStatics<S, C>;
-export {};

package/dist/utils/hyphenateStyleName.d.ts

@@ -1,14 +0,0 @@
-/**
- * Hyphenates a camelcased CSS property name, for example:
- *
- *   > hyphenateStyleName('backgroundColor')
- *   < "background-color"
- *   > hyphenateStyleName('MozTransition')
- *   < "-moz-transition"
- *   > hyphenateStyleName('msTransition')
- *   < "-ms-transition"
- *
- * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix
- * is converted to `-ms-`.
- */
-export default function hyphenateStyleName(string: string): string;

package/dist/utils/interleave.d.ts

@@ -1,2 +0,0 @@
-import { Interpolation } from '../types';
-export default function interleave<Props extends object>(strings: readonly string[], interpolations: Interpolation<Props>[]): Interpolation<Props>[];

package/dist/utils/isFunction.d.ts

@@ -1 +0,0 @@
-export default function isFunction(test: any): test is Function;

package/dist/utils/isPlainObject.d.ts

@@ -1 +0,0 @@
-export default function isPlainObject(x: any): x is Record<any, any>;

package/dist/utils/isStatelessFunction.d.ts

@@ -1 +0,0 @@
-export default function isStatelessFunction(test: any): test is Function;

package/dist/utils/isStaticRules.d.ts

@@ -1,2 +0,0 @@
-import { RuleSet } from '../types';
-export default function isStaticRules<Props extends object>(rules: RuleSet<Props>): boolean;

package/dist/utils/isStyledComponent.d.ts

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

package/dist/utils/isTag.d.ts

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

package/dist/utils/joinStrings.d.ts

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

package/dist/utils/mixinDeep.d.ts

@@ -1,6 +0,0 @@
-/**
- * Arrays & POJOs merged recursively, other objects and value types are overridden
- * If target is not a POJO or an Array, it will get source properties injected via shallow merge
- * Source objects applied left to right.  Mutates & returns target.  Similar to lodash merge.
- */
-export default function mixinDeep(target: any, ...sources: any[]): any;

package/dist/utils/nonce.d.ts

@@ -1 +0,0 @@
-export default function getNonce(): string | null;

package/dist/utils/setToString.d.ts

@@ -1,17 +0,0 @@
-/**
- * If the Object prototype is frozen, the "toString" property is non-writable. This means that any objects which inherit this property
- * cannot have the property changed using a "=" assignment operator. If using strict mode, attempting that will cause an error. If not using
- * strict mode, attempting that will be silently ignored.
- *
- * If the Object prototype is frozen, inherited non-writable properties can still be shadowed using one of two mechanisms:
- *
- *  1. ES6 class methods: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes#methods
- *  2. Using the `Object.defineProperty()` static method:
- *     https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty
- *
- * However, this project uses Babel to transpile ES6 classes, and transforms ES6 class methods to use the assignment operator instead:
- * https://babeljs.io/docs/babel-plugin-transform-class-properties#options
- *
- * Therefore, the most compatible way to shadow the prototype's "toString" property is to define a new "toString" property on this object.
- */
-export declare function setToString(object: object, toStringFn: () => string): void;

package/dist/utils/stylis.d.ts

@@ -1,10 +0,0 @@
-import * as stylis from 'stylis';
-import { Stringifier } from '../types';
-export type ICreateStylisInstance = {
-    options?: {
-        namespace?: string | undefined;
-        prefix?: boolean | undefined;
-    } | undefined;
-    plugins?: stylis.Middleware[] | undefined;
-};
-export default function createStylisInstance({ options, plugins, }?: ICreateStylisInstance): Stringifier;