styled-components 6.1.18 → 6.2.0

package/dist/test/utils.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const seedNextClassnames: (names: string[]) => string[];
 export declare const resetStyled: (isServer?: boolean) => (<Target extends import("..").WebTarget, InjectedProps extends object = import("../types").BaseObject>(tag: Target) => import("../constructors/constructWithOptions").Styled<"web", Target, Target extends import("../types").KnownTarget ? import("react").ComponentPropsWithRef<Target> & InjectedProps : InjectedProps, import("../types").BaseObject>) & {
     object: import("../constructors/constructWithOptions").Styled<"web", "object", import("react").DetailedHTMLProps<import("react").ObjectHTMLAttributes<HTMLObjectElement>, HTMLObjectElement>, import("../types").BaseObject>;
@@ -9,6 +8,7 @@ export declare const resetStyled: (isServer?: boolean) => (<Target extends impor
     small: import("../constructors/constructWithOptions").Styled<"web", "small", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
     sub: import("../constructors/constructWithOptions").Styled<"web", "sub", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
     sup: import("../constructors/constructWithOptions").Styled<"web", "sup", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
+    input: import("../constructors/constructWithOptions").Styled<"web", "input", import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, import("../types").BaseObject>;
     a: import("../constructors/constructWithOptions").Styled<"web", "a", import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, import("../types").BaseObject>;
     abbr: import("../constructors/constructWithOptions").Styled<"web", "abbr", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
     address: import("../constructors/constructWithOptions").Styled<"web", "address", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
@@ -60,7 +60,6 @@ export declare const resetStyled: (isServer?: boolean) => (<Target extends impor
     i: import("../constructors/constructWithOptions").Styled<"web", "i", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
     iframe: import("../constructors/constructWithOptions").Styled<"web", "iframe", import("react").DetailedHTMLProps<import("react").IframeHTMLAttributes<HTMLIFrameElement>, HTMLIFrameElement>, import("../types").BaseObject>;
     img: import("../constructors/constructWithOptions").Styled<"web", "img", import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, import("../types").BaseObject>;
-    input: import("../constructors/constructWithOptions").Styled<"web", "input", import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, import("../types").BaseObject>;
     ins: import("../constructors/constructWithOptions").Styled<"web", "ins", import("react").DetailedHTMLProps<import("react").InsHTMLAttributes<HTMLModElement>, HTMLModElement>, import("../types").BaseObject>;
     kbd: import("../constructors/constructWithOptions").Styled<"web", "kbd", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
     keygen: import("../constructors/constructWithOptions").Styled<"web", "keygen", import("react").DetailedHTMLProps<import("react").KeygenHTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
@@ -113,7 +112,6 @@ export declare const resetStyled: (isServer?: boolean) => (<Target extends impor
     var: import("../constructors/constructWithOptions").Styled<"web", "var", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
     video: import("../constructors/constructWithOptions").Styled<"web", "video", import("react").DetailedHTMLProps<import("react").VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, import("../types").BaseObject>;
     wbr: import("../constructors/constructWithOptions").Styled<"web", "wbr", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
-    svg: import("../constructors/constructWithOptions").Styled<"web", "svg", import("react").SVGProps<SVGSVGElement>, import("../types").BaseObject>;
     circle: import("../constructors/constructWithOptions").Styled<"web", "circle", import("react").SVGProps<SVGCircleElement>, import("../types").BaseObject>;
     clipPath: import("../constructors/constructWithOptions").Styled<"web", "clipPath", import("react").SVGProps<SVGClipPathElement>, import("../types").BaseObject>;
     defs: import("../constructors/constructWithOptions").Styled<"web", "defs", import("react").SVGProps<SVGDefsElement>, import("../types").BaseObject>;
@@ -131,6 +129,7 @@ export declare const resetStyled: (isServer?: boolean) => (<Target extends impor
     radialGradient: import("../constructors/constructWithOptions").Styled<"web", "radialGradient", import("react").SVGProps<SVGRadialGradientElement>, import("../types").BaseObject>;
     rect: import("../constructors/constructWithOptions").Styled<"web", "rect", import("react").SVGProps<SVGRectElement>, import("../types").BaseObject>;
     stop: import("../constructors/constructWithOptions").Styled<"web", "stop", import("react").SVGProps<SVGStopElement>, import("../types").BaseObject>;
+    svg: import("../constructors/constructWithOptions").Styled<"web", "svg", import("react").SVGProps<SVGSVGElement>, import("../types").BaseObject>;
     text: import("../constructors/constructWithOptions").Styled<"web", "text", import("react").SVGTextElementAttributes<SVGTextElement>, import("../types").BaseObject>;
     tspan: import("../constructors/constructWithOptions").Styled<"web", "tspan", import("react").SVGProps<SVGTSpanElement>, import("../types").BaseObject>;
     use: import("../constructors/constructWithOptions").Styled<"web", "use", import("react").SVGProps<SVGUseElement>, import("../types").BaseObject>;

package/dist/types.d.ts

@@ -5,7 +5,7 @@ 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 object = {}> extends React.ExoticComponent<P> {
+export interface ExoticComponentWithDisplayName<P extends BaseObject = {}> extends React.ExoticComponent<P> {
     defaultProps?: Partial<P> | undefined;
     displayName?: string | undefined;
 }
@@ -20,16 +20,16 @@ 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 object, U extends string | number | symbol> = {
+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 object = any> = ExoticComponentWithDisplayName<P> | React.ComponentType<P>;
+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 object> {
+export interface StyledOptions<R extends Runtime, Props extends BaseObject> {
     attrs?: Attrs<Props>[] | undefined;
     componentId?: (R extends 'web' ? string : never) | undefined;
     displayName?: string | undefined;
@@ -76,13 +76,13 @@ export type ExecutionProps = {
 export interface ExecutionContext extends ExecutionProps {
     theme: DefaultTheme;
 }
-export interface StyleFunction<Props extends object> {
+export interface StyleFunction<Props extends BaseObject> {
     (executionContext: ExecutionContext & Props): Interpolation<Props>;
 }
-export type Interpolation<Props extends object> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | StyledComponentBrand | RuleSet<Props> | Interpolation<Props>[];
-export type Attrs<Props extends object = BaseObject> = (ExecutionProps & Partial<Props>) | ((props: ExecutionContext & Props) => ExecutionProps & Partial<Props>);
-export type RuleSet<Props extends object = BaseObject> = Interpolation<Props>[];
-export type Styles<Props extends object> = TemplateStringsArray | StyledObject<Props> | StyleFunction<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;
@@ -92,7 +92,7 @@ export interface Keyframes {
     name: string;
     rules: string;
 }
-export interface Flattener<Props extends object> {
+export interface Flattener<Props extends BaseObject> {
     (chunks: Interpolation<Props>[], executionContext: object | null | undefined, styleSheet: StyleSheet | null | undefined): Interpolation<Props>[];
 }
 export interface Stringifier {
@@ -102,12 +102,12 @@ export interface Stringifier {
 export interface ShouldForwardProp<R extends Runtime> {
     (prop: string, elementToBeCreated: StyledTarget<R>): boolean;
 }
-export interface CommonStatics<R extends Runtime, Props extends object> {
+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 object> extends CommonStatics<R, OuterProps> {
+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;
@@ -118,7 +118,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, BaseProps extends object, AsTarget extends StyledTarget<R> | void, ForwardedAsTarget extends StyledTarget<R> | void, AsTargetProps extends object = AsTarget extends KnownTarget ? React.ComponentPropsWithRef<AsTarget> : {}, ForwardedAsTargetProps extends object = ForwardedAsTarget extends KnownTarget ? React.ComponentPropsWithRef<ForwardedAsTarget> : {}> = NoInfer<FastOmit<Substitute<BaseProps, Substitute<ForwardedAsTargetProps, AsTargetProps>>, keyof ExecutionProps>> & FastOmit<ExecutionProps, 'as' | 'forwardedAs'> & {
+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;
 };
@@ -129,14 +129,14 @@ export type PolymorphicComponentProps<R extends Runtime, BaseProps extends objec
  * 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 object> extends React.ForwardRefExoticComponent<BaseProps> {
+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 object = BaseObject> extends PolymorphicComponent<R, Props>, IStyledStatics<R, Props>, StyledComponentBrand {
+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 object = BaseObject> = IStyledComponentBase<R, Props> & 
+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',
@@ -156,13 +156,13 @@ export type IStyledComponent<R extends Runtime, Props extends object = BaseObjec
  *  })
  */
 (R extends 'web' ? string : {});
-export interface IStyledComponentFactory<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object, OuterStatics extends object = BaseObject> {
-    <Props extends object = BaseObject, Statics extends object = BaseObject>(target: Target, options: StyledOptions<R, OuterProps & Props>, rules: RuleSet<OuterProps & Props>): IStyledComponent<R, Substitute<OuterProps, Props>> & OuterStatics & Statics;
+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 object> {
+export interface IInlineStyleConstructor<Props extends BaseObject> {
     new (rules: RuleSet<Props>): IInlineStyle<Props>;
 }
-export interface IInlineStyle<Props extends object> {
+export interface IInlineStyle<Props extends BaseObject> {
     rules: RuleSet<Props>;
     generateStyleObject(executionContext: ExecutionContext & Props): object;
 }
@@ -173,8 +173,8 @@ export type CSSPseudos = {
 export type CSSKeyframes = object & {
     [key: string]: CSSObject;
 };
-export type CSSObject<Props extends object = BaseObject> = StyledObject<Props>;
-export interface StyledObject<Props extends object = BaseObject> extends CSSProperties, CSSPseudos {
+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;
 }
 /**
@@ -200,5 +200,5 @@ export interface StyledObject<Props extends object = BaseObject> extends CSSProp
  */
 export type CSSProp = Interpolation<any>;
 export type NoInfer<T> = [T][T extends any ? 0 : never];
-export type Substitute<A extends object, B extends object> = FastOmit<A, keyof B> & B;
+export type Substitute<A extends BaseObject, B extends BaseObject> = FastOmit<A, keyof B> & B;
 export type InsertionTarget = HTMLElement | ShadowRoot;

package/dist/utils/domElements.d.ts

@@ -1,4 +1,4 @@
 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" | "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" | "input" | "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" | "svg" | "circle" | "clipPath" | "defs" | "ellipse" | "foreignObject" | "image" | "line" | "linearGradient" | "marker" | "mask" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "text" | "tspan" | "use">;
+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 +1,3 @@
 import { Dict } from '../types';
-export declare const EMPTY_ARRAY: readonly any[];
+export declare const EMPTY_ARRAY: Readonly<any[]>;
 export declare const EMPTY_OBJECT: Readonly<Dict<any>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Attrs, BaseObject, ExecutionProps, Interpolation, IStyledComponent, IStyledComponentFactory, KnownTarget, NoInfer, Runtime, StyledOptions, StyledTarget, Styles, Substitute } from '../types';
 type AttrsResult<T extends Attrs<any>> = T extends (...args: any) => infer P ? P extends object ? P : never : T extends object ? T : never;
 /**

package/native/dist/constructors/styled.d.ts

@@ -1,142 +1,9 @@
 import * as React from 'react';
 import { BaseObject, KnownTarget, WebTarget } from '../types';
+import { SupportedHTMLElements } from '../utils/domElements';
 import { Styled as StyledInstance } from './constructWithOptions';
 declare const baseStyled: <Target extends WebTarget, InjectedProps extends object = BaseObject>(tag: Target) => StyledInstance<"web", Target, Target extends KnownTarget ? React.ComponentPropsWithRef<Target> & InjectedProps : InjectedProps, BaseObject>;
-declare const styled: (<Target extends WebTarget, InjectedProps extends object = BaseObject>(tag: Target) => StyledInstance<"web", Target, Target extends KnownTarget ? React.ComponentPropsWithRef<Target> & InjectedProps : InjectedProps, BaseObject>) & {
-    object: StyledInstance<"web", "object", React.DetailedHTMLProps<React.ObjectHTMLAttributes<HTMLObjectElement>, HTMLObjectElement>, BaseObject>;
-    g: StyledInstance<"web", "g", React.SVGProps<SVGGElement>, BaseObject>;
-    map: StyledInstance<"web", "map", React.DetailedHTMLProps<React.MapHTMLAttributes<HTMLMapElement>, HTMLMapElement>, BaseObject>;
-    big: StyledInstance<"web", "big", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    link: StyledInstance<"web", "link", React.DetailedHTMLProps<React.LinkHTMLAttributes<HTMLLinkElement>, HTMLLinkElement>, BaseObject>;
-    small: StyledInstance<"web", "small", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    sub: StyledInstance<"web", "sub", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    sup: StyledInstance<"web", "sup", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    a: StyledInstance<"web", "a", React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, BaseObject>;
-    abbr: StyledInstance<"web", "abbr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    address: StyledInstance<"web", "address", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    area: StyledInstance<"web", "area", React.DetailedHTMLProps<React.AreaHTMLAttributes<HTMLAreaElement>, HTMLAreaElement>, BaseObject>;
-    article: StyledInstance<"web", "article", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    aside: StyledInstance<"web", "aside", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    audio: StyledInstance<"web", "audio", React.DetailedHTMLProps<React.AudioHTMLAttributes<HTMLAudioElement>, HTMLAudioElement>, BaseObject>;
-    b: StyledInstance<"web", "b", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    base: StyledInstance<"web", "base", React.DetailedHTMLProps<React.BaseHTMLAttributes<HTMLBaseElement>, HTMLBaseElement>, BaseObject>;
-    bdi: StyledInstance<"web", "bdi", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    bdo: StyledInstance<"web", "bdo", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    blockquote: StyledInstance<"web", "blockquote", React.DetailedHTMLProps<React.BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, BaseObject>;
-    body: StyledInstance<"web", "body", React.DetailedHTMLProps<React.HTMLAttributes<HTMLBodyElement>, HTMLBodyElement>, BaseObject>;
-    br: StyledInstance<"web", "br", React.DetailedHTMLProps<React.HTMLAttributes<HTMLBRElement>, HTMLBRElement>, BaseObject>;
-    button: StyledInstance<"web", "button", React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, BaseObject>;
-    canvas: StyledInstance<"web", "canvas", React.DetailedHTMLProps<React.CanvasHTMLAttributes<HTMLCanvasElement>, HTMLCanvasElement>, BaseObject>;
-    caption: StyledInstance<"web", "caption", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    cite: StyledInstance<"web", "cite", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    code: StyledInstance<"web", "code", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    col: StyledInstance<"web", "col", React.DetailedHTMLProps<React.ColHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>, BaseObject>;
-    colgroup: StyledInstance<"web", "colgroup", React.DetailedHTMLProps<React.ColgroupHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>, BaseObject>;
-    data: StyledInstance<"web", "data", React.DetailedHTMLProps<React.DataHTMLAttributes<HTMLDataElement>, HTMLDataElement>, BaseObject>;
-    datalist: StyledInstance<"web", "datalist", React.DetailedHTMLProps<React.HTMLAttributes<HTMLDataListElement>, HTMLDataListElement>, BaseObject>;
-    dd: StyledInstance<"web", "dd", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    del: StyledInstance<"web", "del", React.DetailedHTMLProps<React.DelHTMLAttributes<HTMLModElement>, HTMLModElement>, BaseObject>;
-    details: StyledInstance<"web", "details", React.DetailedHTMLProps<React.DetailsHTMLAttributes<HTMLDetailsElement>, HTMLDetailsElement>, BaseObject>;
-    dfn: StyledInstance<"web", "dfn", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    dialog: StyledInstance<"web", "dialog", React.DetailedHTMLProps<React.DialogHTMLAttributes<HTMLDialogElement>, HTMLDialogElement>, BaseObject>;
-    div: StyledInstance<"web", "div", React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, BaseObject>;
-    dl: StyledInstance<"web", "dl", React.DetailedHTMLProps<React.HTMLAttributes<HTMLDListElement>, HTMLDListElement>, BaseObject>;
-    dt: StyledInstance<"web", "dt", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    em: StyledInstance<"web", "em", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    embed: StyledInstance<"web", "embed", React.DetailedHTMLProps<React.EmbedHTMLAttributes<HTMLEmbedElement>, HTMLEmbedElement>, BaseObject>;
-    fieldset: StyledInstance<"web", "fieldset", React.DetailedHTMLProps<React.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, BaseObject>;
-    figcaption: StyledInstance<"web", "figcaption", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    figure: StyledInstance<"web", "figure", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    footer: StyledInstance<"web", "footer", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    form: StyledInstance<"web", "form", React.DetailedHTMLProps<React.FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, BaseObject>;
-    h1: StyledInstance<"web", "h1", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h2: StyledInstance<"web", "h2", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h3: StyledInstance<"web", "h3", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h4: StyledInstance<"web", "h4", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h5: StyledInstance<"web", "h5", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h6: StyledInstance<"web", "h6", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    header: StyledInstance<"web", "header", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    hgroup: StyledInstance<"web", "hgroup", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    hr: StyledInstance<"web", "hr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHRElement>, HTMLHRElement>, BaseObject>;
-    html: StyledInstance<"web", "html", React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLHtmlElement>, HTMLHtmlElement>, BaseObject>;
-    i: StyledInstance<"web", "i", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    iframe: StyledInstance<"web", "iframe", React.DetailedHTMLProps<React.IframeHTMLAttributes<HTMLIFrameElement>, HTMLIFrameElement>, BaseObject>;
-    img: StyledInstance<"web", "img", React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, BaseObject>;
-    input: StyledInstance<"web", "input", React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, BaseObject>;
-    ins: StyledInstance<"web", "ins", React.DetailedHTMLProps<React.InsHTMLAttributes<HTMLModElement>, HTMLModElement>, BaseObject>;
-    kbd: StyledInstance<"web", "kbd", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    keygen: StyledInstance<"web", "keygen", React.DetailedHTMLProps<React.KeygenHTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    label: StyledInstance<"web", "label", React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, BaseObject>;
-    legend: StyledInstance<"web", "legend", React.DetailedHTMLProps<React.HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, BaseObject>;
-    li: StyledInstance<"web", "li", React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, BaseObject>;
-    main: StyledInstance<"web", "main", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    mark: StyledInstance<"web", "mark", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    menu: StyledInstance<"web", "menu", React.DetailedHTMLProps<React.MenuHTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    menuitem: StyledInstance<"web", "menuitem", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    meta: StyledInstance<"web", "meta", React.DetailedHTMLProps<React.MetaHTMLAttributes<HTMLMetaElement>, HTMLMetaElement>, BaseObject>;
-    meter: StyledInstance<"web", "meter", React.DetailedHTMLProps<React.MeterHTMLAttributes<HTMLMeterElement>, HTMLMeterElement>, BaseObject>;
-    nav: StyledInstance<"web", "nav", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    noscript: StyledInstance<"web", "noscript", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    ol: StyledInstance<"web", "ol", React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, BaseObject>;
-    optgroup: StyledInstance<"web", "optgroup", React.DetailedHTMLProps<React.OptgroupHTMLAttributes<HTMLOptGroupElement>, HTMLOptGroupElement>, BaseObject>;
-    option: StyledInstance<"web", "option", React.DetailedHTMLProps<React.OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, BaseObject>;
-    output: StyledInstance<"web", "output", React.DetailedHTMLProps<React.OutputHTMLAttributes<HTMLOutputElement>, HTMLOutputElement>, BaseObject>;
-    p: StyledInstance<"web", "p", React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, BaseObject>;
-    param: StyledInstance<"web", "param", React.DetailedHTMLProps<React.ParamHTMLAttributes<HTMLParamElement>, HTMLParamElement>, BaseObject>;
-    picture: StyledInstance<"web", "picture", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    pre: StyledInstance<"web", "pre", React.DetailedHTMLProps<React.HTMLAttributes<HTMLPreElement>, HTMLPreElement>, BaseObject>;
-    progress: StyledInstance<"web", "progress", React.DetailedHTMLProps<React.ProgressHTMLAttributes<HTMLProgressElement>, HTMLProgressElement>, BaseObject>;
-    q: StyledInstance<"web", "q", React.DetailedHTMLProps<React.QuoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, BaseObject>;
-    rp: StyledInstance<"web", "rp", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    rt: StyledInstance<"web", "rt", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    ruby: StyledInstance<"web", "ruby", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    s: StyledInstance<"web", "s", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    samp: StyledInstance<"web", "samp", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    script: StyledInstance<"web", "script", React.DetailedHTMLProps<React.ScriptHTMLAttributes<HTMLScriptElement>, HTMLScriptElement>, BaseObject>;
-    section: StyledInstance<"web", "section", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    select: StyledInstance<"web", "select", React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, BaseObject>;
-    source: StyledInstance<"web", "source", React.DetailedHTMLProps<React.SourceHTMLAttributes<HTMLSourceElement>, HTMLSourceElement>, BaseObject>;
-    span: StyledInstance<"web", "span", React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, BaseObject>;
-    strong: StyledInstance<"web", "strong", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    style: StyledInstance<"web", "style", React.DetailedHTMLProps<React.StyleHTMLAttributes<HTMLStyleElement>, HTMLStyleElement>, BaseObject>;
-    summary: StyledInstance<"web", "summary", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    table: StyledInstance<"web", "table", React.DetailedHTMLProps<React.TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, BaseObject>;
-    tbody: StyledInstance<"web", "tbody", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, BaseObject>;
-    td: StyledInstance<"web", "td", React.DetailedHTMLProps<React.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, BaseObject>;
-    textarea: StyledInstance<"web", "textarea", React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, BaseObject>;
-    tfoot: StyledInstance<"web", "tfoot", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, BaseObject>;
-    th: StyledInstance<"web", "th", React.DetailedHTMLProps<React.ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, BaseObject>;
-    thead: StyledInstance<"web", "thead", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, BaseObject>;
-    time: StyledInstance<"web", "time", React.DetailedHTMLProps<React.TimeHTMLAttributes<HTMLTimeElement>, HTMLTimeElement>, BaseObject>;
-    tr: StyledInstance<"web", "tr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, BaseObject>;
-    track: StyledInstance<"web", "track", React.DetailedHTMLProps<React.TrackHTMLAttributes<HTMLTrackElement>, HTMLTrackElement>, BaseObject>;
-    u: StyledInstance<"web", "u", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    ul: StyledInstance<"web", "ul", React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, BaseObject>;
-    var: StyledInstance<"web", "var", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    video: StyledInstance<"web", "video", React.DetailedHTMLProps<React.VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, BaseObject>;
-    wbr: StyledInstance<"web", "wbr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    svg: StyledInstance<"web", "svg", React.SVGProps<SVGSVGElement>, BaseObject>;
-    circle: StyledInstance<"web", "circle", React.SVGProps<SVGCircleElement>, BaseObject>;
-    clipPath: StyledInstance<"web", "clipPath", React.SVGProps<SVGClipPathElement>, BaseObject>;
-    defs: StyledInstance<"web", "defs", React.SVGProps<SVGDefsElement>, BaseObject>;
-    ellipse: StyledInstance<"web", "ellipse", React.SVGProps<SVGEllipseElement>, BaseObject>;
-    foreignObject: StyledInstance<"web", "foreignObject", React.SVGProps<SVGForeignObjectElement>, BaseObject>;
-    image: StyledInstance<"web", "image", React.SVGProps<SVGImageElement>, BaseObject>;
-    line: StyledInstance<"web", "line", React.SVGLineElementAttributes<SVGLineElement>, BaseObject>;
-    linearGradient: StyledInstance<"web", "linearGradient", React.SVGProps<SVGLinearGradientElement>, BaseObject>;
-    marker: StyledInstance<"web", "marker", React.SVGProps<SVGMarkerElement>, BaseObject>;
-    mask: StyledInstance<"web", "mask", React.SVGProps<SVGMaskElement>, BaseObject>;
-    path: StyledInstance<"web", "path", React.SVGProps<SVGPathElement>, BaseObject>;
-    pattern: StyledInstance<"web", "pattern", React.SVGProps<SVGPatternElement>, BaseObject>;
-    polygon: StyledInstance<"web", "polygon", React.SVGProps<SVGPolygonElement>, BaseObject>;
-    polyline: StyledInstance<"web", "polyline", React.SVGProps<SVGPolylineElement>, BaseObject>;
-    radialGradient: StyledInstance<"web", "radialGradient", React.SVGProps<SVGRadialGradientElement>, BaseObject>;
-    rect: StyledInstance<"web", "rect", React.SVGProps<SVGRectElement>, BaseObject>;
-    stop: StyledInstance<"web", "stop", React.SVGProps<SVGStopElement>, BaseObject>;
-    text: StyledInstance<"web", "text", React.SVGTextElementAttributes<SVGTextElement>, BaseObject>;
-    tspan: StyledInstance<"web", "tspan", React.SVGProps<SVGTSpanElement>, BaseObject>;
-    use: StyledInstance<"web", "use", React.SVGProps<SVGUseElement>, BaseObject>;
-};
+declare const styled: typeof baseStyled & { [E in SupportedHTMLElements]: StyledInstance<"web", E, React.JSX.IntrinsicElements[E]>; };
 export default styled;
 export { StyledInstance };
 /**

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Attrs, BaseObject, ExecutionProps, Interpolation, IStyledComponent, IStyledComponentFactory, KnownTarget, NoInfer, Runtime, StyledOptions, StyledTarget, Styles, Substitute } from '../types';
 type AttrsResult<T extends Attrs<any>> = T extends (...args: any) => infer P ? P extends object ? P : never : T extends object ? T : never;
 /**

package/native/dist/dist/constructors/styled.d.ts

@@ -1,142 +1,9 @@
 import * as React from 'react';
 import { BaseObject, KnownTarget, WebTarget } from '../types';
+import { SupportedHTMLElements } from '../utils/domElements';
 import { Styled as StyledInstance } from './constructWithOptions';
 declare const baseStyled: <Target extends WebTarget, InjectedProps extends object = BaseObject>(tag: Target) => StyledInstance<"web", Target, Target extends KnownTarget ? React.ComponentPropsWithRef<Target> & InjectedProps : InjectedProps, BaseObject>;
-declare const styled: (<Target extends WebTarget, InjectedProps extends object = BaseObject>(tag: Target) => StyledInstance<"web", Target, Target extends KnownTarget ? React.ComponentPropsWithRef<Target> & InjectedProps : InjectedProps, BaseObject>) & {
-    object: StyledInstance<"web", "object", React.DetailedHTMLProps<React.ObjectHTMLAttributes<HTMLObjectElement>, HTMLObjectElement>, BaseObject>;
-    g: StyledInstance<"web", "g", React.SVGProps<SVGGElement>, BaseObject>;
-    map: StyledInstance<"web", "map", React.DetailedHTMLProps<React.MapHTMLAttributes<HTMLMapElement>, HTMLMapElement>, BaseObject>;
-    big: StyledInstance<"web", "big", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    link: StyledInstance<"web", "link", React.DetailedHTMLProps<React.LinkHTMLAttributes<HTMLLinkElement>, HTMLLinkElement>, BaseObject>;
-    small: StyledInstance<"web", "small", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    sub: StyledInstance<"web", "sub", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    sup: StyledInstance<"web", "sup", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    a: StyledInstance<"web", "a", React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, BaseObject>;
-    abbr: StyledInstance<"web", "abbr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    address: StyledInstance<"web", "address", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    area: StyledInstance<"web", "area", React.DetailedHTMLProps<React.AreaHTMLAttributes<HTMLAreaElement>, HTMLAreaElement>, BaseObject>;
-    article: StyledInstance<"web", "article", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    aside: StyledInstance<"web", "aside", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    audio: StyledInstance<"web", "audio", React.DetailedHTMLProps<React.AudioHTMLAttributes<HTMLAudioElement>, HTMLAudioElement>, BaseObject>;
-    b: StyledInstance<"web", "b", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    base: StyledInstance<"web", "base", React.DetailedHTMLProps<React.BaseHTMLAttributes<HTMLBaseElement>, HTMLBaseElement>, BaseObject>;
-    bdi: StyledInstance<"web", "bdi", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    bdo: StyledInstance<"web", "bdo", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    blockquote: StyledInstance<"web", "blockquote", React.DetailedHTMLProps<React.BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, BaseObject>;
-    body: StyledInstance<"web", "body", React.DetailedHTMLProps<React.HTMLAttributes<HTMLBodyElement>, HTMLBodyElement>, BaseObject>;
-    br: StyledInstance<"web", "br", React.DetailedHTMLProps<React.HTMLAttributes<HTMLBRElement>, HTMLBRElement>, BaseObject>;
-    button: StyledInstance<"web", "button", React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, BaseObject>;
-    canvas: StyledInstance<"web", "canvas", React.DetailedHTMLProps<React.CanvasHTMLAttributes<HTMLCanvasElement>, HTMLCanvasElement>, BaseObject>;
-    caption: StyledInstance<"web", "caption", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    cite: StyledInstance<"web", "cite", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    code: StyledInstance<"web", "code", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    col: StyledInstance<"web", "col", React.DetailedHTMLProps<React.ColHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>, BaseObject>;
-    colgroup: StyledInstance<"web", "colgroup", React.DetailedHTMLProps<React.ColgroupHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>, BaseObject>;
-    data: StyledInstance<"web", "data", React.DetailedHTMLProps<React.DataHTMLAttributes<HTMLDataElement>, HTMLDataElement>, BaseObject>;
-    datalist: StyledInstance<"web", "datalist", React.DetailedHTMLProps<React.HTMLAttributes<HTMLDataListElement>, HTMLDataListElement>, BaseObject>;
-    dd: StyledInstance<"web", "dd", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    del: StyledInstance<"web", "del", React.DetailedHTMLProps<React.DelHTMLAttributes<HTMLModElement>, HTMLModElement>, BaseObject>;
-    details: StyledInstance<"web", "details", React.DetailedHTMLProps<React.DetailsHTMLAttributes<HTMLDetailsElement>, HTMLDetailsElement>, BaseObject>;
-    dfn: StyledInstance<"web", "dfn", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    dialog: StyledInstance<"web", "dialog", React.DetailedHTMLProps<React.DialogHTMLAttributes<HTMLDialogElement>, HTMLDialogElement>, BaseObject>;
-    div: StyledInstance<"web", "div", React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, BaseObject>;
-    dl: StyledInstance<"web", "dl", React.DetailedHTMLProps<React.HTMLAttributes<HTMLDListElement>, HTMLDListElement>, BaseObject>;
-    dt: StyledInstance<"web", "dt", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    em: StyledInstance<"web", "em", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    embed: StyledInstance<"web", "embed", React.DetailedHTMLProps<React.EmbedHTMLAttributes<HTMLEmbedElement>, HTMLEmbedElement>, BaseObject>;
-    fieldset: StyledInstance<"web", "fieldset", React.DetailedHTMLProps<React.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, BaseObject>;
-    figcaption: StyledInstance<"web", "figcaption", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    figure: StyledInstance<"web", "figure", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    footer: StyledInstance<"web", "footer", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    form: StyledInstance<"web", "form", React.DetailedHTMLProps<React.FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, BaseObject>;
-    h1: StyledInstance<"web", "h1", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h2: StyledInstance<"web", "h2", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h3: StyledInstance<"web", "h3", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h4: StyledInstance<"web", "h4", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h5: StyledInstance<"web", "h5", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    h6: StyledInstance<"web", "h6", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, BaseObject>;
-    header: StyledInstance<"web", "header", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    hgroup: StyledInstance<"web", "hgroup", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    hr: StyledInstance<"web", "hr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLHRElement>, HTMLHRElement>, BaseObject>;
-    html: StyledInstance<"web", "html", React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLHtmlElement>, HTMLHtmlElement>, BaseObject>;
-    i: StyledInstance<"web", "i", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    iframe: StyledInstance<"web", "iframe", React.DetailedHTMLProps<React.IframeHTMLAttributes<HTMLIFrameElement>, HTMLIFrameElement>, BaseObject>;
-    img: StyledInstance<"web", "img", React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, BaseObject>;
-    input: StyledInstance<"web", "input", React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, BaseObject>;
-    ins: StyledInstance<"web", "ins", React.DetailedHTMLProps<React.InsHTMLAttributes<HTMLModElement>, HTMLModElement>, BaseObject>;
-    kbd: StyledInstance<"web", "kbd", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    keygen: StyledInstance<"web", "keygen", React.DetailedHTMLProps<React.KeygenHTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    label: StyledInstance<"web", "label", React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, BaseObject>;
-    legend: StyledInstance<"web", "legend", React.DetailedHTMLProps<React.HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, BaseObject>;
-    li: StyledInstance<"web", "li", React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, BaseObject>;
-    main: StyledInstance<"web", "main", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    mark: StyledInstance<"web", "mark", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    menu: StyledInstance<"web", "menu", React.DetailedHTMLProps<React.MenuHTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    menuitem: StyledInstance<"web", "menuitem", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    meta: StyledInstance<"web", "meta", React.DetailedHTMLProps<React.MetaHTMLAttributes<HTMLMetaElement>, HTMLMetaElement>, BaseObject>;
-    meter: StyledInstance<"web", "meter", React.DetailedHTMLProps<React.MeterHTMLAttributes<HTMLMeterElement>, HTMLMeterElement>, BaseObject>;
-    nav: StyledInstance<"web", "nav", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    noscript: StyledInstance<"web", "noscript", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    ol: StyledInstance<"web", "ol", React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, BaseObject>;
-    optgroup: StyledInstance<"web", "optgroup", React.DetailedHTMLProps<React.OptgroupHTMLAttributes<HTMLOptGroupElement>, HTMLOptGroupElement>, BaseObject>;
-    option: StyledInstance<"web", "option", React.DetailedHTMLProps<React.OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, BaseObject>;
-    output: StyledInstance<"web", "output", React.DetailedHTMLProps<React.OutputHTMLAttributes<HTMLOutputElement>, HTMLOutputElement>, BaseObject>;
-    p: StyledInstance<"web", "p", React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, BaseObject>;
-    param: StyledInstance<"web", "param", React.DetailedHTMLProps<React.ParamHTMLAttributes<HTMLParamElement>, HTMLParamElement>, BaseObject>;
-    picture: StyledInstance<"web", "picture", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    pre: StyledInstance<"web", "pre", React.DetailedHTMLProps<React.HTMLAttributes<HTMLPreElement>, HTMLPreElement>, BaseObject>;
-    progress: StyledInstance<"web", "progress", React.DetailedHTMLProps<React.ProgressHTMLAttributes<HTMLProgressElement>, HTMLProgressElement>, BaseObject>;
-    q: StyledInstance<"web", "q", React.DetailedHTMLProps<React.QuoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, BaseObject>;
-    rp: StyledInstance<"web", "rp", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    rt: StyledInstance<"web", "rt", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    ruby: StyledInstance<"web", "ruby", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    s: StyledInstance<"web", "s", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    samp: StyledInstance<"web", "samp", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    script: StyledInstance<"web", "script", React.DetailedHTMLProps<React.ScriptHTMLAttributes<HTMLScriptElement>, HTMLScriptElement>, BaseObject>;
-    section: StyledInstance<"web", "section", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    select: StyledInstance<"web", "select", React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, BaseObject>;
-    source: StyledInstance<"web", "source", React.DetailedHTMLProps<React.SourceHTMLAttributes<HTMLSourceElement>, HTMLSourceElement>, BaseObject>;
-    span: StyledInstance<"web", "span", React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, BaseObject>;
-    strong: StyledInstance<"web", "strong", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    style: StyledInstance<"web", "style", React.DetailedHTMLProps<React.StyleHTMLAttributes<HTMLStyleElement>, HTMLStyleElement>, BaseObject>;
-    summary: StyledInstance<"web", "summary", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    table: StyledInstance<"web", "table", React.DetailedHTMLProps<React.TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, BaseObject>;
-    tbody: StyledInstance<"web", "tbody", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, BaseObject>;
-    td: StyledInstance<"web", "td", React.DetailedHTMLProps<React.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, BaseObject>;
-    textarea: StyledInstance<"web", "textarea", React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, BaseObject>;
-    tfoot: StyledInstance<"web", "tfoot", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, BaseObject>;
-    th: StyledInstance<"web", "th", React.DetailedHTMLProps<React.ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, BaseObject>;
-    thead: StyledInstance<"web", "thead", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, BaseObject>;
-    time: StyledInstance<"web", "time", React.DetailedHTMLProps<React.TimeHTMLAttributes<HTMLTimeElement>, HTMLTimeElement>, BaseObject>;
-    tr: StyledInstance<"web", "tr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, BaseObject>;
-    track: StyledInstance<"web", "track", React.DetailedHTMLProps<React.TrackHTMLAttributes<HTMLTrackElement>, HTMLTrackElement>, BaseObject>;
-    u: StyledInstance<"web", "u", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    ul: StyledInstance<"web", "ul", React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, BaseObject>;
-    var: StyledInstance<"web", "var", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    video: StyledInstance<"web", "video", React.DetailedHTMLProps<React.VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, BaseObject>;
-    wbr: StyledInstance<"web", "wbr", React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, BaseObject>;
-    svg: StyledInstance<"web", "svg", React.SVGProps<SVGSVGElement>, BaseObject>;
-    circle: StyledInstance<"web", "circle", React.SVGProps<SVGCircleElement>, BaseObject>;
-    clipPath: StyledInstance<"web", "clipPath", React.SVGProps<SVGClipPathElement>, BaseObject>;
-    defs: StyledInstance<"web", "defs", React.SVGProps<SVGDefsElement>, BaseObject>;
-    ellipse: StyledInstance<"web", "ellipse", React.SVGProps<SVGEllipseElement>, BaseObject>;
-    foreignObject: StyledInstance<"web", "foreignObject", React.SVGProps<SVGForeignObjectElement>, BaseObject>;
-    image: StyledInstance<"web", "image", React.SVGProps<SVGImageElement>, BaseObject>;
-    line: StyledInstance<"web", "line", React.SVGLineElementAttributes<SVGLineElement>, BaseObject>;
-    linearGradient: StyledInstance<"web", "linearGradient", React.SVGProps<SVGLinearGradientElement>, BaseObject>;
-    marker: StyledInstance<"web", "marker", React.SVGProps<SVGMarkerElement>, BaseObject>;
-    mask: StyledInstance<"web", "mask", React.SVGProps<SVGMaskElement>, BaseObject>;
-    path: StyledInstance<"web", "path", React.SVGProps<SVGPathElement>, BaseObject>;
-    pattern: StyledInstance<"web", "pattern", React.SVGProps<SVGPatternElement>, BaseObject>;
-    polygon: StyledInstance<"web", "polygon", React.SVGProps<SVGPolygonElement>, BaseObject>;
-    polyline: StyledInstance<"web", "polyline", React.SVGProps<SVGPolylineElement>, BaseObject>;
-    radialGradient: StyledInstance<"web", "radialGradient", React.SVGProps<SVGRadialGradientElement>, BaseObject>;
-    rect: StyledInstance<"web", "rect", React.SVGProps<SVGRectElement>, BaseObject>;
-    stop: StyledInstance<"web", "stop", React.SVGProps<SVGStopElement>, BaseObject>;
-    text: StyledInstance<"web", "text", React.SVGTextElementAttributes<SVGTextElement>, BaseObject>;
-    tspan: StyledInstance<"web", "tspan", React.SVGProps<SVGTSpanElement>, BaseObject>;
-    use: StyledInstance<"web", "use", React.SVGProps<SVGUseElement>, BaseObject>;
-};
+declare const styled: typeof baseStyled & { [E in SupportedHTMLElements]: StyledInstance<"web", E, React.JSX.IntrinsicElements[E]>; };
 export default styled;
 export { StyledInstance };
 /**

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

@@ -1,4 +1,4 @@
 import React from 'react';
 import { AnyComponent, ExecutionProps } from '../types';
 import { NonReactStatics } from '../utils/hoist';
-export default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<React.JSX.LibraryManagedAttributes<T, ExecutionProps>> & React.RefAttributes<T>> & NonReactStatics<T>;
+export default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<React.ComponentPropsWithRef<T> & ExecutionProps> & React.RefAttributes<T>> & NonReactStatics<T>;

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

@@ -1,4 +1,5 @@
 import { IInlineStyleConstructor, StyleSheet } from '../types';
+export declare const RN_UNSUPPORTED_VALUES: string[];
 export declare const resetStyleCache: () => void;
 /**
  * InlineStyle takes arbitrary CSS and generates a flat object

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

@@ -1,7 +1,6 @@
-/// <reference types="node" />
 import React from 'react';
+import { type PipeableStream } from 'react-dom/server';
 import type * as streamInternal from 'stream';
-import { Readable } from 'stream';
 import StyleSheet from '../sheet';
 export default class ServerStyleSheet {
     instance: StyleSheet;
@@ -11,6 +10,6 @@ export default class ServerStyleSheet {
     collectStyles(children: any): React.JSX.Element;
     getStyleTags: () => string;
     getStyleElement: () => React.JSX.Element[];
-    interleaveWithNodeStream(input: Readable): streamInternal.Transform;
+    interleaveWithNodeStream(input: NodeJS.ReadableStream | PipeableStream): streamInternal.Transform;
     seal: () => void;
 }

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

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

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

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