Upgrading styled-components 5 to 6
Breaking5.3.11 → 6.6.0Breaking19Security1Platform24New26Changed61Fixed147Other25
BreakingUpgrade verdict
13 breaking changes and 24 platform requirement changes and a security fix.
In plain terms
- This version no longer works in Internet Explorer 11 and removes some old compatibility code.
- The Babel macro plugin is no longer included, so anyone importing it must switch to another approach.
- The old withComponent helper was removed in favor of the as prop.
- TypeScript definitions are bundled, so the separate types package should be uninstalled.
Must act Top 5 of 38 that need code or config changes
styled-components publishes an official migration guide for version 6. It covers more than the release notes do.
Migration guide ↗Node.js requirement changed in 6.0.0-rc.3: >=10 → >= 16.
Adds @types/stylis 4.2.7, csstype 3.2.3, stylis 4.3.6.
Drops @babel/helper-module-imports, @babel/traverse, @emotion/stylis, @emotion/unitless, babel-plugin-styled-components, hoist-non-react-statics, shallowequal, supports-color.
Installs 9 packages in all (was 37).
What you must change
Breaking13
Drops IE11 support: ES2015 build target, inlined unitless CSS properties, and removed legacy React class statics from hoist.
hoistRemoves the babel macro due to lack of usage.
babel-plugin-styled-componentsDrops the deprecated withComponent API; use the as prop instead.
withComponentasstyled-components now provides its own types; remove @types/styled-components if installed.
@types/styled-componentsDrops the $as and $forwardedAs props; use as or forwardedAs instead.
$as$forwardedAsasforwardedAsDrops automatic prop filtering; use transient props with a $ prefix for props not to forward.
$StyleSheetManager replaces disableVendorPrefixes with enableVendorPrefixes and drops automatic vendor prefixing.
StyleSheetManagerdisableVendorPrefixesenableVendorPrefixesDisables vendor prefixing by default in stylis.
stylisRemoves runtime prop validation; use transient props for styling-only props or shouldForwardProp for advanced cases.
shouldForwardPropRemoves react-primitives support.
react-primitivesReact Native components now type-check
style against React Native's own style types, rejecting web-only CSS and custom properties.stylefloat--brandstyled.ViewNow uses stylis v4; stylis-plugin-rtl users must upgrade to the newer version.
stylisstylis-plugin-rtlDisallows mixing the $as and as props.
$asasSecurity1
Upgrades babel dependencies to latest to fix CVE-2023-45133.
Platform24
Makes react-dom an optional peer dependency and cleans up some unnecessary type peers.
react-domRequires Node.js 14 or newer.
Requires Node.js 14 or newer.
Requires Node.js 14 or newer.
Requires Node.js 14 or newer.
Requires Node.js 14 or newer.
Requires Node.js 14 or newer.
Requires Node.js >= 14.
Requires Node.js 14 or newer.
Requires Node.js version 14 or newer.
Requires Node.js 14 or newer.
Requires Node.js version 14 or newer.
Requires Node.js 14 or newer.
Requires Node >= 14.
Requires Node.js 14 or newer.
Requires Node.js 14 or newer.
Requires Node.js version 14 or higher.
Requires Node.js version 14 or newer.
Requires Node >= 14.
Requires Node.js 14 or newer.
Requires Node >= 14.
Requires Node.js 14 or newer.
Requires Node >= 14.
Requires Node.js 14 or newer.
API changes
Generated by DepDelta from published .d.ts files. Not mixed with prose notes.
- removed:
interface Attributes - removed:
property Attributes.css?: CSSProp
- added:
export * from './secretInternals' - added:
export { Attrs } from './types' - added:
export { DefaultTheme } from './types' - added:
export { IStyleSheetContext } - added:
export { IStyleSheetManager } - added:
export { IStylisContext } - added:
export { Keyframes } from './types' - added:
export { SC_VERSION as version } - added:
export { ServerStyleSheet } - added:
export { ShouldForwardProp } from './types' - added:
export { StyleSheetConsumer } - added:
export { StyleSheetContext } - added:
export { StyleSheetManager } - added:
export { ThemeConsumer } - added:
export { ThemeContext } - added:
export { ThemeProvider } - added:
export { createGlobalStyle } - added:
export { createTheme } - added:
export { css } - added:
export { isStyledComponent } - added:
export { keyframes } - added:
export { useTheme } - added:
export { withTheme }
- added:
const COLORS: string[] - added:
function bench(name: string, iterations: number, fn: (i: number) => void, options?: BenchOptions): number - added:
interface BenchOptions - added:
property BenchOptions.beforeIteration?: () => void - added:
property BenchOptions.nameWidth?: number - added:
property BenchOptions.precision?: number - added:
property BenchOptions.runs?: number - added:
property BenchOptions.warmupMax?: number
- added:
const DISABLE_SPEEDY: boolean - added:
const IS_BROWSER: boolean - added:
const IS_RSC: boolean - added:
const KEYFRAMES_ID_PREFIX = 'sc-keyframes-' - added:
const RSC_REDUNDANT_EMIT_WARN_THRESHOLD = 1000 - added:
const SC_ATTR: string - added:
const SC_ATTR_ACTIVE = 'active' - added:
const SC_ATTR_VERSION = 'data-styled-version' - added:
const SC_VERSION: string - added:
const SPLITTER = '/*!sc*/\n' - added:
const STATIC_EXECUTION_CONTEXT: {}
- added:
call Styled<Props extends object = BaseObject, Statics extends object = BaseObject>(initialStyles: Styles<MergeProps<OuterProps, NoInfer<Props>>>, ...interpolations: Interpolation<MergeProps<OuterProps, NoInfer<Props>>>[]): IStyledComponent<R, WidenForUntypedTarget<TargetProps<R, Target>, MakeAttrsOptional<MergeProps<OuterProps, Props>, AttrsKeys>>> & OuterStatics & Statics & (R extends 'web' ? T… - added:
default function constructWithOptions<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = TargetProps<R, Target>, OuterStatics extends object = BaseObject, AttrsKeys extends keyof any = never>(componentConstructor: IStyledComponentFactory<R, StyledTarget<R>, object, any>, tag: StyledTarget<R>, options?: StyledOptions<R, OuterProps>): Styled<R, Target, OuterProps, OuterStatics,… - added:
interface Styled<out R extends Runtime, out Target extends StyledTarget<R>, in out OuterProps extends object, out OuterStatics extends object = BaseObject, out AttrsKeys extends keyof any = never> - added:
property Styled.attrs: <Props extends object = BaseObject, PrivateMergedProps extends object = MergeProps<OuterProps, Props>, PrivateAttrsArg extends Attrs<WidenForUntypedTarget<TargetProps<R, Target>, PrivateMergedProps>> = Attrs<WidenForUntypedTarget<TargetProps<R, Target>, PrivateMergedProps>>, PrivateResolvedTarget extends StyledTarget<R> = AttrsTarget<R, PrivateAttrsArg, Target>>(attrs: Priv… - added:
property Styled.withConfig: (config: StyledOptions<R, OuterProps>) => Styled<R, Target, OuterProps, OuterStatics, AttrsKeys>
- added:
default function createGlobalStyle<Props extends object>(strings: Styles<Props>, ...interpolations: Array<Interpolation<Props>>): React.NamedExoticComponent<ExecutionProps & Props>
- added:
default function createTheme<T extends Record<string, any>>(defaultTheme: T, options?: CreateThemeOptions): ThemeContract<T>
- added:
default css - added:
function css(styles: Styles<object>, ...interpolations: Interpolation<object>[]): RuleSet<object> - added:
function css<Props extends object>(styles: Styles<NoInfer<Props>>, ...interpolations: Interpolation<NoInfer<Props>>[]): RuleSet<NoInfer<Props>>
- added:
default function keyframes<Props extends object = {}>(strings: Styles<Props>, ...interpolations: Array<Interpolation<Props>>): Keyframes
- added:
const styled: typeof baseStyled & { [E in SupportedHTMLElements]: StyledInstance<'web', E, TargetProps<'web', E>> } - added:
default styled - added:
export { StyledInstance } - added:
type LibraryStyled<LibraryProps extends object = BaseObject> = <Target extends WebTarget>(tag: Target) => typeof baseStyled<Target, LibraryProps> - added:
type Styled = typeof styled
- added:
default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<WithThemeOuterProps<T>> & React.RefAttributes<any>> & NonReactStatics<T>
- added:
export * from './base' - added:
export { CSSKeyframes } from './types' - added:
export { CSSObject } from './types' - added:
export { CSSProp } from './types' - added:
export { CSSProperties } from './types' - added:
export { CSSPseudos } from './types' - added:
export { CustomStyle } from './types' - added:
export { DataAttributes } from './types' - added:
export { DefaultTheme } from './types' - added:
export { ExecutionContext } from './types' - added:
export { ExecutionProps } from './types' - added:
export { FastOmit } from './types' - added:
export { IStyledComponent } from './types' - added:
export { IStyledComponentFactory } from './types' - added:
export { IStyledStatics } from './types' - added:
export { Interpolation } from './types' - added:
export { LibraryStyled } - added:
export { PolymorphicComponent } from './types' - added:
export { PolymorphicComponentProps } from './types' - added:
export { RuleSet } from './types' - added:
export { Runtime } from './types' - added:
export { StyleFunction } from './types' - added:
export { Styled } - added:
export { StyledComponent } from './types' - added:
export { StyledInstance } - added:
export { StyledObject } from './types' - added:
export { StyledOptions } from './types' - added:
export { SupportedHTMLElements } from './types' - added:
export { WebTarget } from './types' - added:
export { default as stylisPluginRSC } from './utils/stylisPluginRSC' - added:
export { styled as default } - added:
export { styled }
- added:
default styled - added:
export { styled }
- added:
constructor ComponentStyle(rules: RuleSet<any>, componentId: string, baseStyle?: ComponentStyle | undefined) - added:
default class ComponentStyle - added:
function getCompiledCSSForName(cs: ComponentStyle, name: string): string | null - added:
method ComponentStyle.generateAndInjectStyles(executionContext: ExecutionContext, styleSheet: StyleSheet, stylis: Stringifier): string - added:
property ComponentStyle.baseHash: number - added:
property ComponentStyle.baseStyle: ComponentStyle | null | undefined - added:
property ComponentStyle.componentId: string - added:
property ComponentStyle.dynamicNameCache: Map<string, string> | undefined - added:
property ComponentStyle.rules: RuleSet<any>
- added:
constructor GlobalStyle(rules: RuleSet<Props>, componentId: string) - added:
default class GlobalStyle<Props extends object> - added:
method GlobalStyle.removeStyles(instance: number, styleSheet: StyleSheet): void - added:
method GlobalStyle.renderStyles(instance: number, executionContext: ExecutionContext & Props, styleSheet: StyleSheet, stylis: Stringifier): void - added:
property GlobalStyle.componentId: string - added:
property GlobalStyle.instanceRules: Map<number, InstanceEntry> - added:
property GlobalStyle.isStatic: boolean - added:
property GlobalStyle.rules: RuleSet<Props>
- added:
const RN_UNSUPPORTED_VALUES: string[] - added:
const resetStyleCache: () => void - added:
default function makeInlineStyleClass<Props extends object>(styleSheet: StyleSheet): IInlineStyleConstructor<Props> - added:
function cssToStyleObject(flatCSS: string, styleSheet: StyleSheet): any - added:
function parseCSSDeclarations(rawCss: string): [string, string][]
- added:
constructor Keyframes(name: string, rules: string) - added:
default class Keyframes implements KeyframesType - added:
method Keyframes.getName(stylisInstance?: Stringifier): string - added:
property Keyframes.id: string - added:
property Keyframes.inject: (styleSheet: StyleSheet, stylisInstance?: Stringifier) => void - added:
property Keyframes.name: string - added:
property Keyframes.rules: string - added:
readonly property Keyframes[KEYFRAMES_SYMBOL]: true
- added:
constructor ServerStyleSheet({ nonce }?: { nonce?: string }) - added:
default class ServerStyleSheet - added:
method ServerStyleSheet.collectStyles(children: any): React.JSX.Element - added:
method ServerStyleSheet.interleaveWithNodeStream(input: NodeJS.ReadableStream | PipeableStream): NodeJS.ReadWriteStream - added:
property ServerStyleSheet._emitSheetCSS: () => string - added:
property ServerStyleSheet.getStyleElement: () => React.JSX.Element[] - added:
property ServerStyleSheet.getStyleTags: () => string - added:
property ServerStyleSheet.instance: StyleSheet - added:
property ServerStyleSheet.seal: () => void - added:
property ServerStyleSheet.sealed: boolean
- added:
const StyleSheetConsumer: React.Consumer<IStyleSheetContext> - added:
const StyleSheetContext: React.Context<IStyleSheetContext> - added:
const mainSheet: StyleSheet - added:
const mainStylis: Stringifier - added:
function StyleSheetManager(props: IStyleSheetManager): React.JSX.Element - added:
function useStyleSheetContext(): IStyleSheetContext - added:
type IStyleSheetContext = { shouldForwardProp?: ShouldForwardProp<'web'> | undefined; styleSheet: StyleSheet; stylis: Stringifier; stylisPlugins?: stylis.Middleware[] | undefined } - added:
type IStyleSheetManager = React.PropsWithChildren<{ disableCSSOMInjection?: undefined | boolean; enableVendorPrefixes?: undefined | boolean; namespace?: undefined | string; sheet?: unde… - added:
type IStylisContext = Stringifier | void
- added:
const resetIdentifiers: () => void - added:
default createStyledComponent - added:
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>>
- added:
const _default: (InlineStyle: IInlineStyleConstructor<any>) => <Target extends NativeTarget, OuterProps extends ExecutionProps, Statics extends object = BaseObject>(target: Ta… - added:
default _default
- added:
const ThemeConsumer: React.Consumer<DefaultTheme | undefined> - added:
const ThemeContext: React.Context<DefaultTheme | undefined> - added:
default function ThemeProvider(props: Props): React.JSX.Element | null - added:
function useTheme(): DefaultTheme - added:
interface DefaultTheme extends DefaultThemeAsObject
- added:
const default: typeof baseStyled & { [E in KnownComponents]: Styled<'native', RNComponents[E], TargetProps<'native', RNComponents[E]>> } - added:
const styled: typeof baseStyled & { [E in KnownComponents]: Styled<'native', RNComponents[E], TargetProps<'native', RNComponents[E]>> } - added:
const toStyleSheet: (rules: RuleSet<object>) => any - added:
export { CSSKeyframes } from '../types' - added:
export { CSSObject } from '../types' - added:
export { CSSProperties } from '../types' - added:
export { CSSPseudos } from '../types' - added:
export { CustomStyle } from '../types' - added:
export { DefaultTheme } from '../types' - added:
export { ExecutionContext } from '../types' - added:
export { ExecutionProps } from '../types' - added:
export { IStyledComponent } from '../types' - added:
export { IStyledComponentFactory } from '../types' - added:
export { IStyledStatics } from '../types' - added:
export { NativeStyledComponent as StyledComponent } from '../types' - added:
export { NativeTarget } from '../types' - added:
export { PolymorphicComponent } from '../types' - added:
export { PolymorphicComponentProps } from '../types' - added:
export { Runtime } from '../types' - added:
export { StyledObject } from '../types' - added:
export { StyledOptions } from '../types' - added:
export { ThemeConsumer } - added:
export { ThemeContext } - added:
export { ThemeProvider } - added:
export { css } - added:
export { isStyledComponent } - added:
export { useTheme } - added:
export { withTheme }
- added:
const __PRIVATE__: { StyleSheet: typeof StyleSheet; mainSheet: StyleSheet }
- added:
const getGroupForId: (id: string) => number - added:
const getIdForGroup: (group: number) => void | string - added:
const resetGroupIds: () => void - added:
const setGroupForId: (id: string, group: number) => void
- added:
const makeGroupedTag: (tag: Tag) => { groupSizes: Uint32Array; length: number; tag: Tag; _cGroup: number; _cIndex: number; indexOfGroup(group: number): number; insertRules(group: nu…
- added:
const getRehydrationContainer: (target?: InsertionTarget | undefined) => Document | ShadowRoot - added:
const outputSheet: (sheet: Sheet) => string - added:
const rehydrateSheet: (sheet: Sheet) => void - added:
const resetVersionMismatchWarning: () => void
- added:
constructor StyleSheet(options?: SheetConstructorArgs, globalStyles?: GlobalStylesAllocationMap, names?: NamesAllocationMap | undefined) - added:
default class StyleSheet implements Sheet - added:
method StyleSheet.allocateGSInstance(id: string): number - added:
method StyleSheet.clearNames(id: string): void - added:
method StyleSheet.clearRules(id: string): void - added:
method StyleSheet.clearTag(): void - added:
method StyleSheet.getTag(): GroupedTag - added:
method StyleSheet.hasNameForId(id: string, name: string): boolean - added:
method StyleSheet.insertRules(id: string, name: string, rules: string[]): void - added:
method StyleSheet.reconstructWithOptions(options: SheetConstructorArgs, withNames?: boolean): StyleSheet - added:
method StyleSheet.registerName(id: string, name: string): void - added:
method StyleSheet.rehydrate(): void - added:
property StyleSheet.gs: GlobalStylesAllocationMap - added:
property StyleSheet.keyframeIds: Set<string> - added:
property StyleSheet.names: NamesAllocationMap - added:
property StyleSheet.options: SheetOptions - added:
property StyleSheet.server: boolean - added:
property StyleSheet.tag?: GroupedTag | undefined - added:
static method StyleSheet.registerId(id: string): number
- added:
const CSSOMTag: { new (target?: InsertionTarget | undefined, nonce?: string | undefined): { element: HTMLStyleElement; sheet: CSSStyleSheet; length: number; insertRule(index:… - added:
const TextTag: { new (target?: InsertionTarget | undefined, nonce?: string | undefined): { element: HTMLStyleElement; nodes: NodeListOf<Node>; length: number; insertRule(inde… - added:
const VirtualTag: { new (_target?: InsertionTarget | undefined): { rules: string[]; length: number; insertRule(index: number, rule: string): boolean; deleteRule(index: number):… - added:
const makeTag: ({ isServer, useCSSOMInjection, target, nonce }: SheetOptions) => { rules: string[]; length: number; insertRule(index: number, rule: string): boolean; deleteRu…
- added:
const getSheet: (tag: HTMLStyleElement) => CSSStyleSheet - added:
const makeStyleTag: (target?: InsertionTarget | undefined, nonce?: string | undefined) => HTMLStyleElement
- added:
export { default } from './Sheet'
- added:
interface GroupedTag - added:
interface Sheet - added:
interface Tag - added:
method GroupedTag.clearGroup(group: number): void - added:
method GroupedTag.getGroup(group: number): string - added:
method GroupedTag.insertRules(group: number, rules: string[]): void - added:
method Sheet.allocateGSInstance(id: string): number - added:
method Sheet.clearNames(id: string): void - added:
method Sheet.clearRules(id: string): void - added:
method Sheet.clearTag(): void - added:
method Sheet.getTag(): GroupedTag - added:
method Sheet.hasNameForId(id: string, name: string): boolean - added:
method Sheet.insertRules(id: string, name: string, rules: string[]): void - added:
method Sheet.registerName(id: string, name: string): void - added:
method Sheet.rehydrate(): void - added:
method Sheet.toString(): string - added:
method Tag.deleteRule(index: number): void - added:
method Tag.getRule(index: number): string - added:
method Tag.insertRule(index: number, rule: string): boolean - added:
property GroupedTag.groupSizes: Uint32Array - added:
property GroupedTag.length: number - added:
property GroupedTag.tag: Tag - added:
property Sheet.names: Map<string, Set<string>> - added:
property Sheet.options: SheetOptions - added:
property Tag.length: number - added:
type SheetOptions = { isServer: boolean; nonce?: string | undefined; target?: InsertionTarget | undefined; useCSSOMInjection: boolean }
- added:
call Flattener(chunks: Interpolation<Props>[], executionContext: object | null | undefined, styleSheet: StyleSheet | null | undefined): Interpolation<Props>[] - added:
call IStyledComponentFactory<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 - added:
call PolymorphicComponent<AsTarget extends StyledTarget<R> | (BaseProps extends { as?: infer A } ? A : never) | void = void, ForwardedAsTarget extends StyledTarget<R> | void = void>(props: PolymorphicCallProps<R, BaseProps, AsTarget, ForwardedAsTarget>): React.JSX.Element - added:
call ShouldForwardProp(prop: string, elementToBeCreated: StyledTarget<R>): boolean - added:
call Stringifier(css: string, selector?: string | undefined, prefix?: string | undefined, componentId?: string | undefined): string[] - added:
call StyleFunction(executionContext: ExecutionContext & Props): Interpolation<Props> - added:
export { CSS } - added:
export { DefaultTheme } - added:
export { NoInfer } from './utils/noInfer' - added:
export { SupportedHTMLElements } - added:
index StyledObject[key: string]: StyledObject<Props> | string | number | StyleFunction<Props> | RuleSet<any> | undefined - added:
interface CommonStatics<out R extends Runtime, in out Props extends BaseObject> - added:
interface ExecutionContext extends ExecutionProps - added:
interface ExoticComponentWithDisplayName<P extends BaseObject = {}> extends React.ExoticComponent<P> - added:
interface Flattener<Props extends BaseObject> - added:
interface IInlineStyle<Props extends BaseObject> - added:
interface IInlineStyleConstructor<Props extends BaseObject> - added:
interface IStyledComponentBase<out R extends Runtime, in out Props extends BaseObject = BaseObject> extends PolymorphicComponent<R, WidenUntypedProps<Props>>, IStyledStatics<R, Props>, StyledComponentBrand - added:
interface IStyledComponentFactory<out R extends Runtime, in Target extends StyledTarget<R>, in out OuterProps extends BaseObject, out OuterStatics extends BaseObject = BaseObject> - added:
interface IStyledStatics<out R extends Runtime, in out OuterProps extends BaseObject> extends CommonStatics<R, OuterProps> - added:
interface Keyframes - added:
interface PolymorphicComponent<out R extends Runtime, in out BaseProps extends BaseObject> extends React.NamedExoticComponent<FastOmit<BaseProps, 'as' | 'forwardedAs'> & { as?: StyledTarget<R> | undefined; forwardedAs?: StyledTarget<R> | undefined }> - added:
interface ShouldForwardProp<R extends Runtime> - added:
interface Stringifier - added:
interface StyleFunction<Props extends BaseObject> - added:
interface StyleSheet - added:
interface StyledObject<Props extends BaseObject = BaseObject> extends CSSProperties, CSSPseudos - added:
interface StyledOptions<R extends Runtime, Props extends BaseObject> - added:
method IInlineStyle.generateStyleObject(executionContext: ExecutionContext & Props): object - added:
new IInlineStyleConstructor(rules: RuleSet<Props>): IInlineStyle<Props> - added:
property CommonStatics.attrs: Attrs<Props>[] - added:
property CommonStatics.shouldForwardProp?: ShouldForwardProp<R> | undefined - added:
property CommonStatics.target: StyledTarget<R> - added:
property ExecutionContext.theme: DefaultTheme - added:
property ExoticComponentWithDisplayName.defaultProps?: Partial<P> | undefined - added:
property ExoticComponentWithDisplayName.displayName?: string | undefined - added:
property IInlineStyle.rules: RuleSet<Props> - added:
property IStyledComponentBase.defaultProps?: (ExecutionProps & Partial<Props>) | undefined - added:
property IStyledComponentBase.toString: () => string - added:
property IStyledStatics.componentStyle: R extends 'web' ? ComponentStyle : never - added:
property IStyledStatics.foldedComponentIds: R extends 'web' ? string : never - added:
property IStyledStatics.inlineStyle: R extends 'native' ? InstanceType<IInlineStyleConstructor<OuterProps>> : never - added:
property IStyledStatics.styledComponentId: R extends 'web' ? string : never - added:
property IStyledStatics.target: StyledTarget<R> - added:
property IStyledStatics.warnTooManyClasses?: (R extends 'web' ? ReturnType<typeof createWarnTooManyClasses> : never) | undefined - added:
property Keyframes.id: string - added:
property Keyframes.name: string - added:
property Keyframes.rules: string - added:
property PolymorphicComponent.defaultProps?: Partial<BaseProps> | undefined - added:
property PolymorphicComponent.propTypes?: any - added:
property Stringifier.hash: string - added:
property StyleSheet.create: Function - added:
property StyledOptions.attrs?: Attrs<Props>[] | undefined - added:
property StyledOptions.componentId?: (R extends 'web' ? string : never) | undefined - added:
property StyledOptions.displayName?: string | undefined - added:
property StyledOptions.parentComponentId?: (R extends 'web' ? string : never) | undefined - added:
property StyledOptions.shouldForwardProp?: ShouldForwardProp<R> | undefined - added:
type AnyComponent<P extends BaseObject = any> = ExoticComponentWithDisplayName<P> | React.ComponentType<P> - added:
type Attrs<Props extends BaseObject = BaseObject> = (ExecutionProps & Partial<Props>) | ((props: ExecutionContext & Props) => ExecutionProps & Partial<Props>) - added:
type BaseObject = {} - added:
type CSSKeyframes = object & { [key: string]: CSSObject } - added:
type CSSObject<Props extends BaseObject = BaseObject> = StyledObject<Props> - added:
type CSSProp = Interpolation<any> - added:
type CSSProperties = CSS.Properties<number | (string & {})> - added:
type CSSPropertiesWithVars = React.CSSProperties & { [key: `--${string}`]: string | number | undefined } - added:
type CSSPseudos = { [K in CSS.Pseudos]?: CSSObject } - added:
type CustomStyle<T extends object> = T & { [K in Exclude<keyof CSSPropertiesWithVars, keyof T>]?: never } - added:
type DataAttributes = { [key: `data-${string}`]: any } - added:
type Dict<T = any> = { [key: string]: T } - added:
type ExecutionProps = { as?: KnownTarget | undefined; forwardedAs?: KnownTarget | undefined; theme?: DefaultTheme | undefined } - added:
type FastOmit<T extends BaseObject, U extends string | number | symbol> = { [K in keyof T as K extends U ? never : K]: T[K] } - added:
type IStyledComponent<R extends Runtime, Props extends BaseObject = BaseObject> = IStyledComponentBase<R, Props> & string - added:
type InsertionTarget = HTMLElement | ShadowRoot - added:
type Interpolation<Props extends BaseObject> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | StyledComponentBrand | RuleSet<Pro… - added:
type KnownTarget = SupportedHTMLElements | AnyComponent - added:
type KnownTargetPropsWithRef<T> = T extends React.ElementType ? React.ComponentPropsWithRef<T> : {} - added:
type MakeAttrsOptional<P extends BaseObject, K extends keyof any> = [K] extends [never] ? P : P extends unknown ? Omit<P, K & keyof P> & Partial<Pick<P, K & keyof P>> : never - added:
type MergeProps<A extends BaseObject, B> = keyof B extends never ? {} extends B ? A : Merged<A, B> : Merged<A, B> - added:
type Merged<A extends BaseObject, B> = FastOmit<A, Exclude<keyof B, 'style'>> & B - added:
type NameGenerator = (hash: number) => string - added:
type NativeStyledComponent<Target extends NativeTarget, Props extends BaseObject = BaseObject> = IStyledComponent<'native', WidenForUntypedTarget<TargetProps<'native', Target>, MergeProps<TargetProps<'native', Target>, Props>>> - added:
type NativeTarget = AnyComponent - added:
type OmitNever<T> = { [K in keyof T as T[K] extends never ? never : K]: T[K] } - added:
type PolymorphicComponentProps<R extends Runtime, BaseProps extends BaseObject, AsTarget extends StyledTarget<R> | (BaseProps extends { as?: infer A } ? A : never) | void, ForwardedAsTarget extends StyledTarget<R> | void, AsTargetProps extends BaseObject = TargetProps<R, AsTarget>, ForwardedAsTargetProps extends BaseObject = TargetProps<R, ForwardedAsTarget>> = NoInfer<FastOmit<MergeProps<BaseProps, Substitute<ForwardedAsTargetProps, AsTargetProps>>, keyof ExecutionProps>> & ThemedExecutionProps & { as?: AsTarget; for… - added:
type RuleSet<Props extends BaseObject = BaseObject> = Interpolation<Props>[] - added:
type Runtime = 'web' | 'native' - added:
type StyledComponent<Target extends WebTarget, Props extends BaseObject = BaseObject> = IStyledComponent<'web', WidenForUntypedTarget<TargetProps<'web', Target>, MergeProps<TargetProps<'web', Target>, Props>>> & (Target extends string ? {} : Omit<… - added:
type StyledComponentBrand = { readonly _sc: symbol } - added:
type StyledTarget<R extends Runtime> = R extends 'web' ? WebTarget : NativeTarget - added:
type Styles<Props extends BaseObject> = TemplateStringsArray | StyledObject<Props> | StyleFunction<Props> - added:
type Substitute<A extends BaseObject, B> = keyof B extends never ? {} extends B ? A : Substituted<A, B> : Substituted<A, B> - added:
type Substituted<A extends BaseObject, B> = FastOmit<A, keyof B> & B - added:
type TargetProps<R extends Runtime, T> = T extends keyof React.JSX.IntrinsicElements ? IntrinsicProps<T> : T extends AnyComponent ? ComponentTargetProps<R, T> : {} - added:
type WebTarget = (string & {}) | KnownTarget - added:
type WidenForUntypedTarget<Target extends BaseObject, Props extends BaseObject> = (Target extends unknown ? (keyof Target extends never ? true : false) : never) extends true ? Props & { [key: string]: unknown } : Props - added:
type WidenUntypedProps<Props extends BaseObject> = WidenForUntypedTarget<Props, Props>
- added:
default function addUnitIfNeeded(name: string, value: any): string
- added:
const ASTERISK = 42 - added:
const BACKSLASH = 92 - added:
const CLOSE_BRACE = 125 - added:
const CLOSE_PAREN = 41 - added:
const DOUBLE_QUOTE = 34 - added:
const HYPHEN = 45 - added:
const NEWLINE = 10 - added:
const OPEN_BRACE = 123 - added:
const OPEN_PAREN = 40 - added:
const SEMICOLON = 59 - added:
const SINGLE_QUOTE = 39 - added:
const SLASH = 47 - added:
const UPPER_A = 65 - added:
const UPPER_TO_LOWER = 32 - added:
const UPPER_Z = 90
- added:
const checkDynamicCreation: (displayName: string, componentId?: string | undefined) => void
- added:
const LIMIT = 200 - added:
const _default: (displayName: string, componentId: string) => (className: string) => void - added:
default _default
- added:
const cssTagged: WeakSet<RuleSet<any>>
- added:
default function determineTheme(props: ExecutionProps, providedTheme?: DefaultTheme | undefined, defaultProps?: { theme?: DefaultTheme | undefined }): DefaultTheme | undefined
- added:
const _default: Set<'symbol' | 'object' | 'a' | 'abbr' | 'address' | 'area' | 'article' | 'aside' | 'audio' | 'b' | 'bdi' | 'bdo' | 'blockquote' | 'body' | 'br' | 'button' | '… - added:
default _default - added:
type SupportedHTMLElements = (typeof elements)[number]
- added:
const EMPTY_ARRAY: Readonly<any[]> - added:
const EMPTY_OBJECT: Readonly<Dict<any>>
- added:
default function throwStyledComponentsError(code: string | number, ...interpolations: any[]): Error
- added:
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… - added:
default _default
- added:
default function escape(str: string): string
- added:
const objToCssArray: (obj: Dict<any>) => string[] - added:
default function flatten<Props extends object>(chunk: Interpolation<object>, executionContext?: (ExecutionContext & Props) | undefined, styleSheet?: StyleSheet | undefined, stylisInstance?: Stringifier | undefined, result?: RuleSet<Props>): RuleSet<Props>
- added:
default function generateAlphabeticName(code: number): string
- added:
default function generateComponentId(str: string): string
- added:
default function generateDisplayName(target: StyledTarget<any>): string
- added:
default function getComponentName(target: StyledTarget<any>): string
- added:
const SEED = 5381 - added:
const hash: (x: string) => number - added:
const phash: (h: number, x: string) => number - added:
const phashN: (h: number, n: number) => number
- added:
default function hoistNonReactStatics<T extends OmniComponent, S extends OmniComponent, C extends ExcludeList = {}>(targetComponent: T, sourceComponent: S, excludelist?: C | undefined): T & NonReactStatics<S, C> - added:
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> ? ke…
- added:
default function hyphenateStyleName(string: string): string
- added:
default function interleave<Props extends object>(strings: readonly string[], interpolations: Interpolation<Props>[]): Interpolation<Props>[]
- added:
default function isFunction(test: any): test is Function
- added:
const KEYFRAMES_SYMBOL: unique symbol - added:
default function isKeyframes(value: unknown): value is KeyframesClass
- added:
default function isPlainObject(x: any): x is Record<any, any>
- added:
default function isStatelessFunction(test: any): test is Function
- added:
default function isStaticRules<Props extends object>(rules: RuleSet<Props>): boolean
- added:
default function isStyledComponent(target: any): target is StyledComponentBrand
- added:
default function isTag(target: StyledTarget<'web'>): target is string
- added:
function joinRules(rules: string[]): string - added:
function joinStringArray(arr: string[], sep?: string | undefined): string - added:
function joinStrings(a?: string | undefined, b?: string | undefined): string - added:
function stripSplitter(css: string): string
- added:
default function mixinDeep(target: any, ...sources: any[]): any
- added:
type NoInfer<T> = [T][T extends any ? 0 : never]
- added:
default function getNonce(): string | undefined - added:
function resetNonceCache(): void
- added:
function createRSCCache<T>(factory: () => T): (() => T) | null
- added:
function setToString(object: object, toStringFn: () => string): void
- added:
default function createStylisInstance({ options, plugins }?: ICreateStylisInstance): Stringifier - added:
function isEscaped(css: string, i: number): boolean - added:
function preprocessCSS(css: string): string - added:
type ICreateStylisInstance = { options?: { namespace?: string | undefined; prefix?: boolean | undefined } | undefined; plugins?: stylis.Middleware[] | undefined }
- added:
default stylisPluginRSC - added:
function stylisPluginRSC(element: Parameters<Middleware>[0]): void
- added:
export { Keyframes } from './types' - added:
export { createTheme }
- added:
const COLORS: string[] - added:
function bench(name: string, iterations: number, fn: (i: number) => void, options?: BenchOptions): number - added:
interface BenchOptions - added:
property BenchOptions.beforeIteration?: () => void - added:
property BenchOptions.nameWidth?: number - added:
property BenchOptions.precision?: number - added:
property BenchOptions.runs?: number - added:
property BenchOptions.warmupMax?: number
- added:
const IS_RSC: boolean - added:
const KEYFRAMES_ID_PREFIX = 'sc-keyframes-' - added:
const RSC_REDUNDANT_EMIT_WARN_THRESHOLD = 1000
- removed:
method Styled.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 A… - removed:
method Styled.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>>)… - changed:
call Styled<Props extends object = object, Statics extends object = object>(initialStyles: Styles<OuterProps & RuntimeInjectedProps & NoInfer<Props>>, ...interpolations: Interpolation<OuterProps & RuntimeInjectedProps & NoInfer<Props>>[]): IStyledComponent<R, ExtractAttrsTarget<R, RuntimeInjectedProps, Target>, OuterProps & Props> & OuterStatics & Statics → call Styled<Props extends object = BaseObject, Statics extends object = BaseObject>(initialStyles: Styles<MergeProps<OuterProps, NoInfer<Props>>>, ...interpolations: Interpolation<MergeProps<OuterProps, NoInfer<Props>>>[]): IStyledComponent<R, WidenForUntypedTarget<TargetProps<R, Target>, MakeAttrsOptional<MergeProps<OuterProps, Props>, AttrsKeys>>> & OuterStatics & Statics & (R extends 'web' ? T… - changed:
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, OuterStat… → default function constructWithOptions<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = TargetProps<R, Target>, OuterStatics extends object = BaseObject, AttrsKeys extends keyof any = never>(componentConstructor: IStyledComponentFactory<R, StyledTarget<R>, object, any>, tag: StyledTarget<R>, options?: StyledOptions<R, OuterProps>): Styled<R, Target, OuterProps, OuterStatics,… - changed:
interface Styled<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = object, OuterStatics extends object = object, RuntimeInjectedProps extends ExecutionProps = object> → interface Styled<out R extends Runtime, out Target extends StyledTarget<R>, in out OuterProps extends object, out OuterStatics extends object = BaseObject, out AttrsKeys extends keyof any = never> - changed:
property Styled.withConfig: (config: StyledOptions<R, OuterProps>) => Styled<R, Target, OuterProps, OuterStatics> → property Styled.withConfig: (config: StyledOptions<R, OuterProps>) => Styled<R, Target, OuterProps, OuterStatics, AttrsKeys> - added:
property Styled.attrs: <Props extends object = BaseObject, PrivateMergedProps extends object = MergeProps<OuterProps, Props>, PrivateAttrsArg extends Attrs<WidenForUntypedTarget<TargetProps<R, Target>, PrivateMergedProps>> = Attrs<WidenForUntypedTarget<TargetProps<R, Target>, PrivateMergedProps>>, PrivateResolvedTarget extends StyledTarget<R> = AttrsTarget<R, PrivateAttrsArg, Target>>(attrs: Priv…
- added:
default function createTheme<T extends Record<string, any>>(defaultTheme: T, options?: CreateThemeOptions): ThemeContract<T>
- changed:
function css<Props extends object>(styles: Styles<Props>, ...interpolations: Interpolation<Props>[]): RuleSet<Props> → function css<Props extends object>(styles: Styles<NoInfer<Props>>, ...interpolations: Interpolation<NoInfer<Props>>[]): RuleSet<NoInfer<Props>>
- changed:
default function keyframes<Props extends object = object>(strings: Styles<Props>, ...interpolations: Array<Interpolation<Props>>): Keyframes → default function keyframes<Props extends object = {}>(strings: Styles<Props>, ...interpolations: Array<Interpolation<Props>>): Keyframes
- changed:
const styled: (<Target extends WebTarget>(tag: Target) => Styled<'web', Target, Target extends import('../types').KnownTarget ? import('react').ComponentPropsWithRef<Target>… → const styled: typeof baseStyled & { [E in SupportedHTMLElements]: StyledInstance<'web', E, TargetProps<'web', E>> } - added:
export { StyledInstance } - added:
type LibraryStyled<LibraryProps extends object = BaseObject> = <Target extends WebTarget>(tag: Target) => typeof baseStyled<Target, LibraryProps> - added:
type Styled = typeof styled
- added:
export * from './secretInternals' - added:
export { Attrs } from './types' - added:
export { DefaultTheme } from './types' - added:
export { IStyleSheetContext } - added:
export { IStyleSheetManager } - added:
export { IStylisContext } - added:
export { Keyframes } from './types' - added:
export { SC_VERSION as version } - added:
export { ServerStyleSheet } - added:
export { ShouldForwardProp } from './types' - added:
export { StyleSheetConsumer } - added:
export { StyleSheetContext } - added:
export { StyleSheetManager } - added:
export { ThemeConsumer } - added:
export { ThemeContext } - added:
export { ThemeProvider } - added:
export { createGlobalStyle } - added:
export { createTheme } - added:
export { css } - added:
export { isStyledComponent } - added:
export { keyframes } - added:
export { useTheme } - added:
export { withTheme }
- added:
const COLORS: string[] - added:
function bench(name: string, iterations: number, fn: (i: number) => void, options?: BenchOptions): number - added:
interface BenchOptions - added:
property BenchOptions.beforeIteration?: () => void - added:
property BenchOptions.nameWidth?: number - added:
property BenchOptions.precision?: number - added:
property BenchOptions.runs?: number - added:
property BenchOptions.warmupMax?: number
- added:
const DISABLE_SPEEDY: boolean - added:
const IS_BROWSER: boolean - added:
const IS_RSC: boolean - added:
const KEYFRAMES_ID_PREFIX = 'sc-keyframes-' - added:
const RSC_REDUNDANT_EMIT_WARN_THRESHOLD = 1000 - added:
const SC_ATTR: string - added:
const SC_ATTR_ACTIVE = 'active' - added:
const SC_ATTR_VERSION = 'data-styled-version' - added:
const SC_VERSION: string - added:
const SPLITTER = '/*!sc*/\n' - added:
const STATIC_EXECUTION_CONTEXT: {}
- added:
call Styled<Props extends object = BaseObject, Statics extends object = BaseObject>(initialStyles: Styles<MergeProps<OuterProps, NoInfer<Props>>>, ...interpolations: Interpolation<MergeProps<OuterProps, NoInfer<Props>>>[]): IStyledComponent<R, WidenForUntypedTarget<TargetProps<R, Target>, MakeAttrsOptional<MergeProps<OuterProps, Props>, AttrsKeys>>> & OuterStatics & Statics & (R extends 'web' ? T… - added:
default function constructWithOptions<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = TargetProps<R, Target>, OuterStatics extends object = BaseObject, AttrsKeys extends keyof any = never>(componentConstructor: IStyledComponentFactory<R, StyledTarget<R>, object, any>, tag: StyledTarget<R>, options?: StyledOptions<R, OuterProps>): Styled<R, Target, OuterProps, OuterStatics,… - added:
interface Styled<out R extends Runtime, out Target extends StyledTarget<R>, in out OuterProps extends object, out OuterStatics extends object = BaseObject, out AttrsKeys extends keyof any = never> - added:
property Styled.attrs: <Props extends object = BaseObject, PrivateMergedProps extends object = MergeProps<OuterProps, Props>, PrivateAttrsArg extends Attrs<WidenForUntypedTarget<TargetProps<R, Target>, PrivateMergedProps>> = Attrs<WidenForUntypedTarget<TargetProps<R, Target>, PrivateMergedProps>>, PrivateResolvedTarget extends StyledTarget<R> = AttrsTarget<R, PrivateAttrsArg, Target>>(attrs: Priv… - added:
property Styled.withConfig: (config: StyledOptions<R, OuterProps>) => Styled<R, Target, OuterProps, OuterStatics, AttrsKeys>
- added:
default function createGlobalStyle<Props extends object>(strings: Styles<Props>, ...interpolations: Array<Interpolation<Props>>): React.NamedExoticComponent<ExecutionProps & Props>
- added:
default function createTheme<T extends Record<string, any>>(defaultTheme: T, options?: CreateThemeOptions): ThemeContract<T>
- added:
default css - added:
function css(styles: Styles<object>, ...interpolations: Interpolation<object>[]): RuleSet<object> - added:
function css<Props extends object>(styles: Styles<NoInfer<Props>>, ...interpolations: Interpolation<NoInfer<Props>>[]): RuleSet<NoInfer<Props>>
- added:
default function keyframes<Props extends object = {}>(strings: Styles<Props>, ...interpolations: Array<Interpolation<Props>>): Keyframes
- added:
const styled: typeof baseStyled & { [E in SupportedHTMLElements]: StyledInstance<'web', E, TargetProps<'web', E>> } - added:
default styled - added:
export { StyledInstance } - added:
type LibraryStyled<LibraryProps extends object = BaseObject> = <Target extends WebTarget>(tag: Target) => typeof baseStyled<Target, LibraryProps> - added:
type Styled = typeof styled
- added:
default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<WithThemeOuterProps<T>> & React.RefAttributes<any>> & NonReactStatics<T>
- added:
export * from './base' - added:
export { CSSKeyframes } from './types' - added:
export { CSSObject } from './types' - added:
export { CSSProp } from './types' - added:
export { CSSProperties } from './types' - added:
export { CSSPseudos } from './types' - added:
export { CustomStyle } from './types' - added:
export { DataAttributes } from './types' - added:
export { DefaultTheme } from './types' - added:
export { ExecutionContext } from './types' - added:
export { ExecutionProps } from './types' - added:
export { FastOmit } from './types' - added:
export { IStyledComponent } from './types' - added:
export { IStyledComponentFactory } from './types' - added:
export { IStyledStatics } from './types' - added:
export { Interpolation } from './types' - added:
export { LibraryStyled } - added:
export { PolymorphicComponent } from './types' - added:
export { PolymorphicComponentProps } from './types' - added:
export { RuleSet } from './types' - added:
export { Runtime } from './types' - added:
export { StyleFunction } from './types' - added:
export { Styled } - added:
export { StyledComponent } from './types' - added:
export { StyledInstance } - added:
export { StyledObject } from './types' - added:
export { StyledOptions } from './types' - added:
export { SupportedHTMLElements } from './types' - added:
export { WebTarget } from './types' - added:
export { default as stylisPluginRSC } from './utils/stylisPluginRSC' - added:
export { styled as default } - added:
export { styled }
- added:
default styled - added:
export { styled }
- added:
constructor ComponentStyle(rules: RuleSet<any>, componentId: string, baseStyle?: ComponentStyle | undefined) - added:
default class ComponentStyle - added:
function getCompiledCSSForName(cs: ComponentStyle, name: string): string | null - added:
method ComponentStyle.generateAndInjectStyles(executionContext: ExecutionContext, styleSheet: StyleSheet, stylis: Stringifier): string - added:
property ComponentStyle.baseHash: number - added:
property ComponentStyle.baseStyle: ComponentStyle | null | undefined - added:
property ComponentStyle.componentId: string - added:
property ComponentStyle.dynamicNameCache: Map<string, string> | undefined - added:
property ComponentStyle.rules: RuleSet<any>
- added:
constructor GlobalStyle(rules: RuleSet<Props>, componentId: string) - added:
default class GlobalStyle<Props extends object> - added:
method GlobalStyle.removeStyles(instance: number, styleSheet: StyleSheet): void - added:
method GlobalStyle.renderStyles(instance: number, executionContext: ExecutionContext & Props, styleSheet: StyleSheet, stylis: Stringifier): void - added:
property GlobalStyle.componentId: string - added:
property GlobalStyle.instanceRules: Map<number, InstanceEntry> - added:
property GlobalStyle.isStatic: boolean - added:
property GlobalStyle.rules: RuleSet<Props>
- added:
const RN_UNSUPPORTED_VALUES: string[] - added:
const resetStyleCache: () => void - added:
default function makeInlineStyleClass<Props extends object>(styleSheet: StyleSheet): IInlineStyleConstructor<Props> - added:
function cssToStyleObject(flatCSS: string, styleSheet: StyleSheet): any - added:
function parseCSSDeclarations(rawCss: string): [string, string][]
- added:
constructor Keyframes(name: string, rules: string) - added:
default class Keyframes implements KeyframesType - added:
method Keyframes.getName(stylisInstance?: Stringifier): string - added:
property Keyframes.id: string - added:
property Keyframes.inject: (styleSheet: StyleSheet, stylisInstance?: Stringifier) => void - added:
property Keyframes.name: string - added:
property Keyframes.rules: string - added:
readonly property Keyframes[KEYFRAMES_SYMBOL]: true
- added:
constructor ServerStyleSheet({ nonce }?: { nonce?: string }) - added:
default class ServerStyleSheet - added:
method ServerStyleSheet.collectStyles(children: any): React.JSX.Element - added:
method ServerStyleSheet.interleaveWithNodeStream(input: NodeJS.ReadableStream | PipeableStream): NodeJS.ReadWriteStream - added:
property ServerStyleSheet._emitSheetCSS: () => string - added:
property ServerStyleSheet.getStyleElement: () => React.JSX.Element[] - added:
property ServerStyleSheet.getStyleTags: () => string - added:
property ServerStyleSheet.instance: StyleSheet - added:
property ServerStyleSheet.seal: () => void - added:
property ServerStyleSheet.sealed: boolean
- added:
const StyleSheetConsumer: React.Consumer<IStyleSheetContext> - added:
const StyleSheetContext: React.Context<IStyleSheetContext> - added:
const mainSheet: StyleSheet - added:
const mainStylis: Stringifier - added:
function StyleSheetManager(props: IStyleSheetManager): React.JSX.Element - added:
function useStyleSheetContext(): IStyleSheetContext - added:
type IStyleSheetContext = { shouldForwardProp?: ShouldForwardProp<'web'> | undefined; styleSheet: StyleSheet; stylis: Stringifier; stylisPlugins?: stylis.Middleware[] | undefined } - added:
type IStyleSheetManager = React.PropsWithChildren<{ disableCSSOMInjection?: undefined | boolean; enableVendorPrefixes?: undefined | boolean; namespace?: undefined | string; sheet?: unde… - added:
type IStylisContext = Stringifier | void
- added:
const resetIdentifiers: () => void - added:
default createStyledComponent - added:
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>>
- added:
const _default: (InlineStyle: IInlineStyleConstructor<any>) => <Target extends NativeTarget, OuterProps extends ExecutionProps, Statics extends object = BaseObject>(target: Ta… - added:
default _default
- added:
const ThemeConsumer: React.Consumer<DefaultTheme | undefined> - added:
const ThemeContext: React.Context<DefaultTheme | undefined> - added:
default function ThemeProvider(props: Props): React.JSX.Element | null - added:
function useTheme(): DefaultTheme - added:
interface DefaultTheme extends DefaultThemeAsObject
- added:
const default: typeof baseStyled & { [E in KnownComponents]: Styled<'native', RNComponents[E], TargetProps<'native', RNComponents[E]>> } - added:
const styled: typeof baseStyled & { [E in KnownComponents]: Styled<'native', RNComponents[E], TargetProps<'native', RNComponents[E]>> } - added:
const toStyleSheet: (rules: RuleSet<object>) => any - added:
export { CSSKeyframes } from '../types' - added:
export { CSSObject } from '../types' - added:
export { CSSProperties } from '../types' - added:
export { CSSPseudos } from '../types' - added:
export { CustomStyle } from '../types' - added:
export { DefaultTheme } from '../types' - added:
export { ExecutionContext } from '../types' - added:
export { ExecutionProps } from '../types' - added:
export { IStyledComponent } from '../types' - added:
export { IStyledComponentFactory } from '../types' - added:
export { IStyledStatics } from '../types' - added:
export { NativeStyledComponent as StyledComponent } from '../types' - added:
export { NativeTarget } from '../types' - added:
export { PolymorphicComponent } from '../types' - added:
export { PolymorphicComponentProps } from '../types' - added:
export { Runtime } from '../types' - added:
export { StyledObject } from '../types' - added:
export { StyledOptions } from '../types' - added:
export { ThemeConsumer } - added:
export { ThemeContext } - added:
export { ThemeProvider } - added:
export { css } - added:
export { isStyledComponent } - added:
export { useTheme } - added:
export { withTheme }
- added:
const __PRIVATE__: { StyleSheet: typeof StyleSheet; mainSheet: StyleSheet }
- added:
const getGroupForId: (id: string) => number - added:
const getIdForGroup: (group: number) => void | string - added:
const resetGroupIds: () => void - added:
const setGroupForId: (id: string, group: number) => void
- added:
const makeGroupedTag: (tag: Tag) => { groupSizes: Uint32Array; length: number; tag: Tag; _cGroup: number; _cIndex: number; indexOfGroup(group: number): number; insertRules(group: nu…
- added:
const getRehydrationContainer: (target?: InsertionTarget | undefined) => Document | ShadowRoot - added:
const outputSheet: (sheet: Sheet) => string - added:
const rehydrateSheet: (sheet: Sheet) => void - added:
const resetVersionMismatchWarning: () => void
- added:
constructor StyleSheet(options?: SheetConstructorArgs, globalStyles?: GlobalStylesAllocationMap, names?: NamesAllocationMap | undefined) - added:
default class StyleSheet implements Sheet - added:
method StyleSheet.allocateGSInstance(id: string): number - added:
method StyleSheet.clearNames(id: string): void - added:
method StyleSheet.clearRules(id: string): void - added:
method StyleSheet.clearTag(): void - added:
method StyleSheet.getTag(): GroupedTag - added:
method StyleSheet.hasNameForId(id: string, name: string): boolean - added:
method StyleSheet.insertRules(id: string, name: string, rules: string[]): void - added:
method StyleSheet.reconstructWithOptions(options: SheetConstructorArgs, withNames?: boolean): StyleSheet - added:
method StyleSheet.registerName(id: string, name: string): void - added:
method StyleSheet.rehydrate(): void - added:
property StyleSheet.gs: GlobalStylesAllocationMap - added:
property StyleSheet.keyframeIds: Set<string> - added:
property StyleSheet.names: NamesAllocationMap - added:
property StyleSheet.options: SheetOptions - added:
property StyleSheet.server: boolean - added:
property StyleSheet.tag?: GroupedTag | undefined - added:
static method StyleSheet.registerId(id: string): number
- added:
const CSSOMTag: { new (target?: InsertionTarget | undefined, nonce?: string | undefined): { element: HTMLStyleElement; sheet: CSSStyleSheet; length: number; insertRule(index:… - added:
const TextTag: { new (target?: InsertionTarget | undefined, nonce?: string | undefined): { element: HTMLStyleElement; nodes: NodeListOf<Node>; length: number; insertRule(inde… - added:
const VirtualTag: { new (_target?: InsertionTarget | undefined): { rules: string[]; length: number; insertRule(index: number, rule: string): boolean; deleteRule(index: number):… - added:
const makeTag: ({ isServer, useCSSOMInjection, target, nonce }: SheetOptions) => { rules: string[]; length: number; insertRule(index: number, rule: string): boolean; deleteRu…
- added:
const getSheet: (tag: HTMLStyleElement) => CSSStyleSheet - added:
const makeStyleTag: (target?: InsertionTarget | undefined, nonce?: string | undefined) => HTMLStyleElement
- added:
export { default } from './Sheet'
- added:
interface GroupedTag - added:
interface Sheet - added:
interface Tag - added:
method GroupedTag.clearGroup(group: number): void - added:
method GroupedTag.getGroup(group: number): string - added:
method GroupedTag.insertRules(group: number, rules: string[]): void - added:
method Sheet.allocateGSInstance(id: string): number - added:
method Sheet.clearNames(id: string): void - added:
method Sheet.clearRules(id: string): void - added:
method Sheet.clearTag(): void - added:
method Sheet.getTag(): GroupedTag - added:
method Sheet.hasNameForId(id: string, name: string): boolean - added:
method Sheet.insertRules(id: string, name: string, rules: string[]): void - added:
method Sheet.registerName(id: string, name: string): void - added:
method Sheet.rehydrate(): void - added:
method Sheet.toString(): string - added:
method Tag.deleteRule(index: number): void - added:
method Tag.getRule(index: number): string - added:
method Tag.insertRule(index: number, rule: string): boolean - added:
property GroupedTag.groupSizes: Uint32Array - added:
property GroupedTag.length: number - added:
property GroupedTag.tag: Tag - added:
property Sheet.names: Map<string, Set<string>> - added:
property Sheet.options: SheetOptions - added:
property Tag.length: number - added:
type SheetOptions = { isServer: boolean; nonce?: string | undefined; target?: InsertionTarget | undefined; useCSSOMInjection: boolean }
- added:
call Flattener(chunks: Interpolation<Props>[], executionContext: object | null | undefined, styleSheet: StyleSheet | null | undefined): Interpolation<Props>[] - added:
call IStyledComponentFactory<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 - added:
call PolymorphicComponent<AsTarget extends StyledTarget<R> | (BaseProps extends { as?: infer A } ? A : never) | void = void, ForwardedAsTarget extends StyledTarget<R> | void = void>(props: PolymorphicCallProps<R, BaseProps, AsTarget, ForwardedAsTarget>): React.JSX.Element - added:
call ShouldForwardProp(prop: string, elementToBeCreated: StyledTarget<R>): boolean - added:
call Stringifier(css: string, selector?: string | undefined, prefix?: string | undefined, componentId?: string | undefined): string[] - added:
call StyleFunction(executionContext: ExecutionContext & Props): Interpolation<Props> - added:
export { CSS } - added:
export { DefaultTheme } - added:
export { NoInfer } from './utils/noInfer' - added:
export { SupportedHTMLElements } - added:
index StyledObject[key: string]: StyledObject<Props> | string | number | StyleFunction<Props> | RuleSet<any> | undefined - added:
interface CommonStatics<out R extends Runtime, in out Props extends BaseObject> - added:
interface ExecutionContext extends ExecutionProps - added:
interface ExoticComponentWithDisplayName<P extends BaseObject = {}> extends React.ExoticComponent<P> - added:
interface Flattener<Props extends BaseObject> - added:
interface IInlineStyle<Props extends BaseObject> - added:
interface IInlineStyleConstructor<Props extends BaseObject> - added:
interface IStyledComponentBase<out R extends Runtime, in out Props extends BaseObject = BaseObject> extends PolymorphicComponent<R, WidenUntypedProps<Props>>, IStyledStatics<R, Props>, StyledComponentBrand - added:
interface IStyledComponentFactory<out R extends Runtime, in Target extends StyledTarget<R>, in out OuterProps extends BaseObject, out OuterStatics extends BaseObject = BaseObject> - added:
interface IStyledStatics<out R extends Runtime, in out OuterProps extends BaseObject> extends CommonStatics<R, OuterProps> - added:
interface Keyframes - added:
interface PolymorphicComponent<out R extends Runtime, in out BaseProps extends BaseObject> extends React.NamedExoticComponent<FastOmit<BaseProps, 'as' | 'forwardedAs'> & { as?: StyledTarget<R> | undefined; forwardedAs?: StyledTarget<R> | undefined }> - added:
interface ShouldForwardProp<R extends Runtime> - added:
interface Stringifier - added:
interface StyleFunction<Props extends BaseObject> - added:
interface StyleSheet - added:
interface StyledObject<Props extends BaseObject = BaseObject> extends CSSProperties, CSSPseudos - added:
interface StyledOptions<R extends Runtime, Props extends BaseObject> - added:
method IInlineStyle.generateStyleObject(executionContext: ExecutionContext & Props): object - added:
new IInlineStyleConstructor(rules: RuleSet<Props>): IInlineStyle<Props> - added:
property CommonStatics.attrs: Attrs<Props>[] - added:
property CommonStatics.shouldForwardProp?: ShouldForwardProp<R> | undefined - added:
property CommonStatics.target: StyledTarget<R> - added:
property ExecutionContext.theme: DefaultTheme - added:
property ExoticComponentWithDisplayName.defaultProps?: Partial<P> | undefined - added:
property ExoticComponentWithDisplayName.displayName?: string | undefined - added:
property IInlineStyle.rules: RuleSet<Props> - added:
property IStyledComponentBase.defaultProps?: (ExecutionProps & Partial<Props>) | undefined - added:
property IStyledComponentBase.toString: () => string - added:
property IStyledStatics.componentStyle: R extends 'web' ? ComponentStyle : never - added:
property IStyledStatics.foldedComponentIds: R extends 'web' ? string : never - added:
property IStyledStatics.inlineStyle: R extends 'native' ? InstanceType<IInlineStyleConstructor<OuterProps>> : never - added:
property IStyledStatics.styledComponentId: R extends 'web' ? string : never - added:
property IStyledStatics.target: StyledTarget<R> - added:
property IStyledStatics.warnTooManyClasses?: (R extends 'web' ? ReturnType<typeof createWarnTooManyClasses> : never) | undefined - added:
property Keyframes.id: string - added:
property Keyframes.name: string - added:
property Keyframes.rules: string - added:
property PolymorphicComponent.defaultProps?: Partial<BaseProps> | undefined - added:
property PolymorphicComponent.propTypes?: any - added:
property Stringifier.hash: string - added:
property StyleSheet.create: Function - added:
property StyledOptions.attrs?: Attrs<Props>[] | undefined - added:
property StyledOptions.componentId?: (R extends 'web' ? string : never) | undefined - added:
property StyledOptions.displayName?: string | undefined - added:
property StyledOptions.parentComponentId?: (R extends 'web' ? string : never) | undefined - added:
property StyledOptions.shouldForwardProp?: ShouldForwardProp<R> | undefined - added:
type AnyComponent<P extends BaseObject = any> = ExoticComponentWithDisplayName<P> | React.ComponentType<P> - added:
type Attrs<Props extends BaseObject = BaseObject> = (ExecutionProps & Partial<Props>) | ((props: ExecutionContext & Props) => ExecutionProps & Partial<Props>) - added:
type BaseObject = {} - added:
type CSSKeyframes = object & { [key: string]: CSSObject } - added:
type CSSObject<Props extends BaseObject = BaseObject> = StyledObject<Props> - added:
type CSSProp = Interpolation<any> - added:
type CSSProperties = CSS.Properties<number | (string & {})> - added:
type CSSPropertiesWithVars = React.CSSProperties & { [key: `--${string}`]: string | number | undefined } - added:
type CSSPseudos = { [K in CSS.Pseudos]?: CSSObject } - added:
type CustomStyle<T extends object> = T & { [K in Exclude<keyof CSSPropertiesWithVars, keyof T>]?: never } - added:
type DataAttributes = { [key: `data-${string}`]: any } - added:
type Dict<T = any> = { [key: string]: T } - added:
type ExecutionProps = { as?: KnownTarget | undefined; forwardedAs?: KnownTarget | undefined; theme?: DefaultTheme | undefined } - added:
type FastOmit<T extends BaseObject, U extends string | number | symbol> = { [K in keyof T as K extends U ? never : K]: T[K] } - added:
type IStyledComponent<R extends Runtime, Props extends BaseObject = BaseObject> = IStyledComponentBase<R, Props> & string - added:
type InsertionTarget = HTMLElement | ShadowRoot - added:
type Interpolation<Props extends BaseObject> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | StyledComponentBrand | RuleSet<Pro… - added:
type KnownTarget = SupportedHTMLElements | AnyComponent - added:
type KnownTargetPropsWithRef<T> = T extends React.ElementType ? React.ComponentPropsWithRef<T> : {} - added:
type MakeAttrsOptional<P extends BaseObject, K extends keyof any> = [K] extends [never] ? P : P extends unknown ? Omit<P, K & keyof P> & Partial<Pick<P, K & keyof P>> : never - added:
type MergeProps<A extends BaseObject, B> = keyof B extends never ? {} extends B ? A : Merged<A, B> : Merged<A, B> - added:
type Merged<A extends BaseObject, B> = FastOmit<A, Exclude<keyof B, 'style'>> & B - added:
type NameGenerator = (hash: number) => string - added:
type NativeStyledComponent<Target extends NativeTarget, Props extends BaseObject = BaseObject> = IStyledComponent<'native', WidenForUntypedTarget<TargetProps<'native', Target>, MergeProps<TargetProps<'native', Target>, Props>>> - added:
type NativeTarget = AnyComponent - added:
type OmitNever<T> = { [K in keyof T as T[K] extends never ? never : K]: T[K] } - added:
type PolymorphicComponentProps<R extends Runtime, BaseProps extends BaseObject, AsTarget extends StyledTarget<R> | (BaseProps extends { as?: infer A } ? A : never) | void, ForwardedAsTarget extends StyledTarget<R> | void, AsTargetProps extends BaseObject = TargetProps<R, AsTarget>, ForwardedAsTargetProps extends BaseObject = TargetProps<R, ForwardedAsTarget>> = NoInfer<FastOmit<MergeProps<BaseProps, Substitute<ForwardedAsTargetProps, AsTargetProps>>, keyof ExecutionProps>> & ThemedExecutionProps & { as?: AsTarget; for… - added:
type RuleSet<Props extends BaseObject = BaseObject> = Interpolation<Props>[] - added:
type Runtime = 'web' | 'native' - added:
type StyledComponent<Target extends WebTarget, Props extends BaseObject = BaseObject> = IStyledComponent<'web', WidenForUntypedTarget<TargetProps<'web', Target>, MergeProps<TargetProps<'web', Target>, Props>>> & (Target extends string ? {} : Omit<… - added:
type StyledComponentBrand = { readonly _sc: symbol } - added:
type StyledTarget<R extends Runtime> = R extends 'web' ? WebTarget : NativeTarget - added:
type Styles<Props extends BaseObject> = TemplateStringsArray | StyledObject<Props> | StyleFunction<Props> - added:
type Substitute<A extends BaseObject, B> = keyof B extends never ? {} extends B ? A : Substituted<A, B> : Substituted<A, B> - added:
type Substituted<A extends BaseObject, B> = FastOmit<A, keyof B> & B - added:
type TargetProps<R extends Runtime, T> = T extends keyof React.JSX.IntrinsicElements ? IntrinsicProps<T> : T extends AnyComponent ? ComponentTargetProps<R, T> : {} - added:
type WebTarget = (string & {}) | KnownTarget - added:
type WidenForUntypedTarget<Target extends BaseObject, Props extends BaseObject> = (Target extends unknown ? (keyof Target extends never ? true : false) : never) extends true ? Props & { [key: string]: unknown } : Props - added:
type WidenUntypedProps<Props extends BaseObject> = WidenForUntypedTarget<Props, Props>
- added:
default function addUnitIfNeeded(name: string, value: any): string
- added:
const ASTERISK = 42 - added:
const BACKSLASH = 92 - added:
const CLOSE_BRACE = 125 - added:
const CLOSE_PAREN = 41 - added:
const DOUBLE_QUOTE = 34 - added:
const HYPHEN = 45 - added:
const NEWLINE = 10 - added:
const OPEN_BRACE = 123 - added:
const OPEN_PAREN = 40 - added:
const SEMICOLON = 59 - added:
const SINGLE_QUOTE = 39 - added:
const SLASH = 47 - added:
const UPPER_A = 65 - added:
const UPPER_TO_LOWER = 32 - added:
const UPPER_Z = 90
- added:
const checkDynamicCreation: (displayName: string, componentId?: string | undefined) => void
- added:
const LIMIT = 200 - added:
const _default: (displayName: string, componentId: string) => (className: string) => void - added:
default _default
- added:
const cssTagged: WeakSet<RuleSet<any>>
- added:
default function determineTheme(props: ExecutionProps, providedTheme?: DefaultTheme | undefined, defaultProps?: { theme?: DefaultTheme | undefined }): DefaultTheme | undefined
- added:
const _default: Set<'symbol' | 'object' | 'a' | 'abbr' | 'address' | 'area' | 'article' | 'aside' | 'audio' | 'b' | 'bdi' | 'bdo' | 'blockquote' | 'body' | 'br' | 'button' | '… - added:
default _default - added:
type SupportedHTMLElements = (typeof elements)[number]
- added:
const EMPTY_ARRAY: Readonly<any[]> - added:
const EMPTY_OBJECT: Readonly<Dict<any>>
- added:
default function throwStyledComponentsError(code: string | number, ...interpolations: any[]): Error
- added:
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… - added:
default _default
- added:
default function escape(str: string): string
- added:
const objToCssArray: (obj: Dict<any>) => string[] - added:
default function flatten<Props extends object>(chunk: Interpolation<object>, executionContext?: (ExecutionContext & Props) | undefined, styleSheet?: StyleSheet | undefined, stylisInstance?: Stringifier | undefined, result?: RuleSet<Props>): RuleSet<Props>
- added:
default function generateAlphabeticName(code: number): string
- added:
default function generateComponentId(str: string): string
- added:
default function generateDisplayName(target: StyledTarget<any>): string
- added:
default function getComponentName(target: StyledTarget<any>): string
- added:
const SEED = 5381 - added:
const hash: (x: string) => number - added:
const phash: (h: number, x: string) => number - added:
const phashN: (h: number, n: number) => number
- added:
default function hoistNonReactStatics<T extends OmniComponent, S extends OmniComponent, C extends ExcludeList = {}>(targetComponent: T, sourceComponent: S, excludelist?: C | undefined): T & NonReactStatics<S, C> - added:
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> ? ke…
- added:
default function hyphenateStyleName(string: string): string
- added:
default function interleave<Props extends object>(strings: readonly string[], interpolations: Interpolation<Props>[]): Interpolation<Props>[]
- added:
default function isFunction(test: any): test is Function
- added:
const KEYFRAMES_SYMBOL: unique symbol - added:
default function isKeyframes(value: unknown): value is KeyframesClass
- added:
default function isPlainObject(x: any): x is Record<any, any>
- added:
default function isStatelessFunction(test: any): test is Function
- added:
default function isStaticRules<Props extends object>(rules: RuleSet<Props>): boolean
- added:
default function isStyledComponent(target: any): target is StyledComponentBrand
- added:
default function isTag(target: StyledTarget<'web'>): target is string
- added:
function joinRules(rules: string[]): string - added:
function joinStringArray(arr: string[], sep?: string | undefined): string - added:
function joinStrings(a?: string | undefined, b?: string | undefined): string - added:
function stripSplitter(css: string): string
- added:
default function mixinDeep(target: any, ...sources: any[]): any
- added:
type NoInfer<T> = [T][T extends any ? 0 : never]
- added:
default function getNonce(): string | undefined - added:
function resetNonceCache(): void
- added:
function createRSCCache<T>(factory: () => T): (() => T) | null
- added:
function setToString(object: object, toStringFn: () => string): void
- added:
default function createStylisInstance({ options, plugins }?: ICreateStylisInstance): Stringifier - added:
function isEscaped(css: string, i: number): boolean - added:
function preprocessCSS(css: string): string - added:
type ICreateStylisInstance = { options?: { namespace?: string | undefined; prefix?: boolean | undefined } | undefined; plugins?: stylis.Middleware[] | undefined }
- added:
default stylisPluginRSC - added:
function stylisPluginRSC(element: Parameters<Middleware>[0]): void
- changed:
default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<JSX.LibraryManagedAttributes<T, ExecutionProps>> & React.RefAttributes<T>> & { [key in Exclude<keyof T, T extends React.MemoExoticComponent<any> ? 'propTypes' | 'type' | 'defaultProps' | 'displayName' | '$$typeof' | 'compare' : T extends React.ForwardRefExoticComponent<any> ? 'propTypes… → default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<WithThemeOuterProps<T>> & React.RefAttributes<any>> & NonReactStatics<T>
- added:
export { CSSKeyframes } from './types' - added:
export { CSSObject } from './types' - added:
export { CSSProperties } from './types' - added:
export { CSSPseudos } from './types' - added:
export { CustomStyle } from './types' - added:
export { DataAttributes } from './types' - added:
export { FastOmit } from './types' - added:
export { Interpolation } from './types' - added:
export { LibraryStyled } - added:
export { StyleFunction } from './types' - added:
export { Styled } - added:
export { StyledComponent } from './types' - added:
export { StyledInstance } - added:
export { SupportedHTMLElements } from './types' - added:
export { default as stylisPluginRSC } from './utils/stylisPluginRSC'
- added:
export { styled }
- removed:
const _default: any - removed:
default _default
- removed:
property ComponentStyle.isStatic: boolean - removed:
property ComponentStyle.staticRulesId: string - changed:
constructor ComponentStyle(rules: RuleSet<any>, componentId: string, baseStyle?: ComponentStyle) → constructor ComponentStyle(rules: RuleSet<any>, componentId: string, baseStyle?: ComponentStyle | undefined) - changed:
method ComponentStyle.generateAndInjectStyles(executionContext: Object, styleSheet: StyleSheet, stylis: Stringifier): string → method ComponentStyle.generateAndInjectStyles(executionContext: ExecutionContext, styleSheet: StyleSheet, stylis: Stringifier): string - added:
function getCompiledCSSForName(cs: ComponentStyle, name: string): string | null - added:
property ComponentStyle.dynamicNameCache: Map<string, string> | undefined
- removed:
method GlobalStyle.createStyles(instance: number, executionContext: ExecutionContext & Props, styleSheet: StyleSheet, stylis: Stringifier): void - changed:
property GlobalStyle.rules: FlattenerResult<Props> → property GlobalStyle.rules: RuleSet<Props> - added:
property GlobalStyle.instanceRules: Map<number, InstanceEntry>
- added:
const RN_UNSUPPORTED_VALUES: string[] - added:
function cssToStyleObject(flatCSS: string, styleSheet: StyleSheet): any - added:
function parseCSSDeclarations(rawCss: string): [string, string][]
- removed:
property Keyframes.toString: () => void - added:
readonly property Keyframes[KEYFRAMES_SYMBOL]: true
- changed:
constructor ServerStyleSheet() → constructor ServerStyleSheet({ nonce }?: { nonce?: string }) - changed:
method ServerStyleSheet.collectStyles(children: any): JSX.Element → method ServerStyleSheet.collectStyles(children: any): React.JSX.Element - changed:
method ServerStyleSheet.interleaveWithNodeStream(input: Readable): streamInternal.Transform → method ServerStyleSheet.interleaveWithNodeStream(input: NodeJS.ReadableStream | PipeableStream): NodeJS.ReadWriteStream - changed:
property ServerStyleSheet.getStyleElement: () => JSX.Element[] → property ServerStyleSheet.getStyleElement: () => React.JSX.Element[]
- removed:
const StylisConsumer: React.Consumer<IStylisContext> - removed:
const StylisContext: React.Context<IStylisContext> - changed:
function StyleSheetManager(props: IStyleSheetManager): JSX.Element → function StyleSheetManager(props: IStyleSheetManager): React.JSX.Element - changed:
type IStyleSheetContext = { shouldForwardProp?: ShouldForwardProp<'web'>; styleSheet: StyleSheet; stylis: Stringifier } → type IStyleSheetContext = { shouldForwardProp?: ShouldForwardProp<'web'> | undefined; styleSheet: StyleSheet; stylis: Stringifier; stylisPlugins?: stylis.Middleware[] | undefined } - changed:
type IStyleSheetManager = React.PropsWithChildren<{ disableCSSOMInjection?: boolean; enableVendorPrefixes?: boolean; namespace?: string; sheet?: StyleSheet; shouldForwardProp?: IStyleSh… → type IStyleSheetManager = React.PropsWithChildren<{ disableCSSOMInjection?: undefined | boolean; enableVendorPrefixes?: undefined | boolean; namespace?: undefined | string; sheet?: unde…
- changed:
function createStyledComponent<Target extends WebTarget, OuterProps extends object, Statics extends object = object>(target: Target, options: StyledOptions<'web', OuterProps>, rules: RuleSet<OuterProps>): ReturnType<IStyledComponentFactory<'web', Target, OuterProps, Statics>> → 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>> - added:
const resetIdentifiers: () => void
- changed:
const _default: (InlineStyle: IInlineStyleConstructor<any>) => <Target extends NativeTarget, OuterProps extends ExecutionProps, Statics extends object = object>(target: Target… → const _default: (InlineStyle: IInlineStyleConstructor<any>) => <Target extends NativeTarget, OuterProps extends ExecutionProps, Statics extends object = BaseObject>(target: Ta…
- removed:
index DefaultTheme[key: string]: any - changed:
default function ThemeProvider(props: Props): JSX.Element | null → default function ThemeProvider(props: Props): React.JSX.Element | null - changed:
function useTheme(): DefaultTheme | undefined → function useTheme(): DefaultTheme - changed:
interface DefaultTheme → interface DefaultTheme extends DefaultThemeAsObject
- changed:
const default: (<Target extends NativeTarget>(tag: Target) => Styled<'native', Target, Target extends import('../types').KnownTarget ? React.ComponentPropsWithRef<Target> : o… → const default: typeof baseStyled & { [E in KnownComponents]: Styled<'native', RNComponents[E], TargetProps<'native', RNComponents[E]>> } - changed:
const styled: (<Target extends NativeTarget>(tag: Target) => Styled<'native', Target, Target extends import('../types').KnownTarget ? React.ComponentPropsWithRef<Target> : o… → const styled: typeof baseStyled & { [E in KnownComponents]: Styled<'native', RNComponents[E], TargetProps<'native', RNComponents[E]>> } - added:
const toStyleSheet: (rules: RuleSet<object>) => any - added:
export { CSSKeyframes } from '../types' - added:
export { CSSObject } from '../types' - added:
export { CSSProperties } from '../types' - added:
export { CSSPseudos } from '../types' - added:
export { CustomStyle } from '../types' - added:
export { NativeStyledComponent as StyledComponent } from '../types'
- changed:
const makeGroupedTag: (tag: Tag) => { groupSizes: Uint32Array; length: number; tag: Tag; indexOfGroup(group: number): number; insertRules(group: number, rules: string[]): void; clea… → const makeGroupedTag: (tag: Tag) => { groupSizes: Uint32Array; length: number; tag: Tag; _cGroup: number; _cIndex: number; indexOfGroup(group: number): number; insertRules(group: nu…
- added:
const getRehydrationContainer: (target?: InsertionTarget | undefined) => Document | ShadowRoot - added:
const resetVersionMismatchWarning: () => void
- removed:
method StyleSheet.toString(): string - changed:
constructor StyleSheet(options?: SheetConstructorArgs, globalStyles?: GlobalStylesAllocationMap, names?: NamesAllocationMap) → constructor StyleSheet(options?: SheetConstructorArgs, globalStyles?: GlobalStylesAllocationMap, names?: NamesAllocationMap | undefined) - changed:
method StyleSheet.insertRules(id: string, name: string, rules: string | string[]): void → method StyleSheet.insertRules(id: string, name: string, rules: string[]): void - changed:
property StyleSheet.tag?: GroupedTag → property StyleSheet.tag?: GroupedTag | undefined - added:
method StyleSheet.rehydrate(): void - added:
property StyleSheet.keyframeIds: Set<string>
- changed:
const CSSOMTag: { new (target?: HTMLElement): { element: HTMLStyleElement; sheet: CSSStyleSheet; length: number; insertRule(index: number, rule: string): boolean; deleteRule(i… → const CSSOMTag: { new (target?: InsertionTarget | undefined, nonce?: string | undefined): { element: HTMLStyleElement; sheet: CSSStyleSheet; length: number; insertRule(index:… - changed:
const TextTag: { new (target?: HTMLElement): { element: HTMLStyleElement; nodes: NodeListOf<Node>; length: number; insertRule(index: number, rule: string): boolean; deleteRul… → const TextTag: { new (target?: InsertionTarget | undefined, nonce?: string | undefined): { element: HTMLStyleElement; nodes: NodeListOf<Node>; length: number; insertRule(inde… - changed:
const VirtualTag: { new (_target?: HTMLElement): { rules: string[]; length: number; insertRule(index: number, rule: string): boolean; deleteRule(index: number): void; getRule(in… → const VirtualTag: { new (_target?: InsertionTarget | undefined): { rules: string[]; length: number; insertRule(index: number, rule: string): boolean; deleteRule(index: number):… - changed:
const makeTag: ({ isServer, useCSSOMInjection, target }: SheetOptions) => { element: HTMLStyleElement; sheet: CSSStyleSheet; length: number; insertRule(index: number, rule: s… → const makeTag: ({ isServer, useCSSOMInjection, target, nonce }: SheetOptions) => { element: HTMLStyleElement; sheet: CSSStyleSheet; length: number; insertRule(index: number,…
- changed:
const makeStyleTag: (target?: HTMLElement) => HTMLStyleElement → const makeStyleTag: (target?: InsertionTarget | undefined, nonce?: string | undefined) => HTMLStyleElement
- changed:
method GroupedTag.insertRules(group: number, rules: string | string[]): void → method GroupedTag.insertRules(group: number, rules: string[]): void - changed:
method Sheet.insertRules(id: string, name: string, rules: string | string[]): void → method Sheet.insertRules(id: string, name: string, rules: string[]): void - changed:
type SheetOptions = { isServer: boolean; target?: HTMLElement; useCSSOMInjection: boolean } → type SheetOptions = { isServer: boolean; nonce?: string | undefined; target?: InsertionTarget | undefined; useCSSOMInjection: boolean } - added:
method Sheet.rehydrate(): void
- removed:
var __SERVER__: boolean - removed:
var __VERSION__: string
- removed:
declare module 'react'
- removed:
const expectCSSMatches: (_expectation: string, opts?: { ignoreWhitespace: boolean }) => string - removed:
const getCSS: (scope: Document | HTMLElement) => string - removed:
const getRenderedCSS: () => string - removed:
const rehydrateTestStyles: () => void - removed:
const resetStyled: (isServer?: boolean) => (<Target extends import('..').WebTarget>(tag: Target) => import('../constructors/constructWithOptions').Styled<'web', Target, Target ex… - removed:
const seedNextClassnames: (names: string[]) => string[] - removed:
const stripComments: (str: string) => string - removed:
const stripWhitespace: (str: string) => string
- removed:
type VeryLargeUnionType = 'add-clip' | 'add-column-left' | 'add-column-right' | 'add-location' | 'add-row-bottom' | 'add-row-top' | 'add-to-artifact' | 'add-to-folder' | 'add' | 'aimpoi…
- removed:
index DataAttributes[key: `data-${string}`]: unknown - removed:
interface DataAttributes - removed:
interface ExecutionProps - removed:
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> - removed:
property ExecutionProps.as?: KnownTarget - removed:
property ExecutionProps.forwardedAs?: KnownTarget - removed:
property ExecutionProps.theme?: DefaultTheme - removed:
property IStyledComponent.defaultProps?: Partial<(Target extends KnownTarget ? ExecutionProps & Omit<React.ComponentProps<Target>, keyof ExecutionProps> : ExecutionProps) & Props> - removed:
property IStyledComponent.toString: () => string - removed:
type FlattenerResult<Props extends object> = RuleSet<Props> | number | string | string[] | IStyledComponent<'web', any, any> | Keyframes - removed:
type NoInfer<T> = [T][T extends any ? 0 : never] - removed:
type SubsetOnly<A, B> = { [K in keyof A]: K extends keyof B ? A[K] : never } - changed:
call Flattener(chunks: Interpolation<Props>[], executionContext: Object | null | undefined, styleSheet: Object | null | undefined): Interpolation<Props>[] → call Flattener(chunks: Interpolation<Props>[], executionContext: object | null | undefined, styleSheet: StyleSheet | null | undefined): Interpolation<Props>[] - changed:
call IStyledComponentFactory<Props extends object = object, Statics extends object = object>(target: Target, options: StyledOptions<R, OuterProps & Props>, rules: RuleSet<OuterProps & Props>): IStyledComponent<R, Target, OuterProps & Props> & OuterStatics & Statics → call IStyledComponentFactory<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 - changed:
call PolymorphicComponent<E extends StyledTarget<R> = FallbackComponent>(props: PolymorphicComponentProps<R, E, P>): React.ReactElement | null → call PolymorphicComponent<AsTarget extends StyledTarget<R> | (BaseProps extends { as?: infer A } ? A : never) | void = void, ForwardedAsTarget extends StyledTarget<R> | void = void>(props: PolymorphicCallProps<R, BaseProps, AsTarget, ForwardedAsTarget>): React.JSX.Element - changed:
call Stringifier(css: string, selector?: string, prefix?: string, componentId?: string): string[] → call Stringifier(css: string, selector?: string | undefined, prefix?: string | undefined, componentId?: string | undefined): string[] - changed:
index StyledObject[key: string]: string | number | StyleFunction<Props> | StyledObject<Props> | undefined → index StyledObject[key: string]: StyledObject<Props> | string | number | StyleFunction<Props> | RuleSet<any> | undefined - changed:
interface CommonStatics<R extends Runtime, Props extends object> → interface CommonStatics<out R extends Runtime, in out Props extends BaseObject> - changed:
interface Flattener<Props extends object> → interface Flattener<Props extends BaseObject> - changed:
interface IInlineStyle<Props extends object> → interface IInlineStyle<Props extends BaseObject> - changed:
interface IInlineStyleConstructor<Props extends object> → interface IInlineStyleConstructor<Props extends BaseObject> - changed:
interface IStyledComponentFactory<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object, OuterStatics extends object = object> → interface IStyledComponentFactory<out R extends Runtime, in Target extends StyledTarget<R>, in out OuterProps extends BaseObject, out OuterStatics extends BaseObject = BaseObject> - changed:
interface IStyledStatics<R extends Runtime, OuterProps extends object> extends CommonStatics<R, OuterProps> → interface IStyledStatics<out R extends Runtime, in out OuterProps extends BaseObject> extends CommonStatics<R, OuterProps> - changed:
interface PolymorphicComponent<R extends Runtime, P extends object, FallbackComponent extends StyledTarget<R>> extends React.ForwardRefExoticComponent<P> → interface PolymorphicComponent<out R extends Runtime, in out BaseProps extends BaseObject> extends React.NamedExoticComponent<FastOmit<BaseProps, 'as' | 'forwardedAs'> & { as?: StyledTarget<R> | undefined; forwardedAs?: StyledTarget<R> | undefined }> - changed:
interface StyleFunction<Props extends object> → interface StyleFunction<Props extends BaseObject> - changed:
interface StyledObject<Props extends object> → interface StyledObject<Props extends BaseObject = BaseObject> extends CSSProperties, CSSPseudos - changed:
interface StyledOptions<R extends Runtime, Props extends object> → interface StyledOptions<R extends Runtime, Props extends BaseObject> - changed:
method IInlineStyle.generateStyleObject(executionContext: Object): Object → method IInlineStyle.generateStyleObject(executionContext: ExecutionContext & Props): object - changed:
property CommonStatics.shouldForwardProp?: ShouldForwardProp<R> → property CommonStatics.shouldForwardProp?: ShouldForwardProp<R> | undefined - changed:
property IStyledStatics.warnTooManyClasses?: R extends 'web' ? ReturnType<typeof createWarnTooManyClasses> : never → property IStyledStatics.warnTooManyClasses?: (R extends 'web' ? ReturnType<typeof createWarnTooManyClasses> : never) | undefined - changed:
property StyledOptions.attrs?: Attrs<Props>[] → property StyledOptions.attrs?: Attrs<Props>[] | undefined - changed:
property StyledOptions.componentId?: R extends 'web' ? string : never → property StyledOptions.componentId?: (R extends 'web' ? string : never) | undefined - changed:
property StyledOptions.displayName?: string → property StyledOptions.displayName?: string | undefined - changed:
property StyledOptions.parentComponentId?: R extends 'web' ? string : never → property StyledOptions.parentComponentId?: (R extends 'web' ? string : never) | undefined - changed:
property StyledOptions.shouldForwardProp?: ShouldForwardProp<R> → property StyledOptions.shouldForwardProp?: ShouldForwardProp<R> | undefined - changed:
type AnyComponent<P = any> = ExoticComponentWithDisplayName<P> | React.ComponentType<P> → type AnyComponent<P extends BaseObject = any> = ExoticComponentWithDisplayName<P> | React.ComponentType<P> - changed:
type Attrs<Props extends object = object> = (ExecutionProps & Props) | ((props: ExecutionContext & Props) => Props) → type Attrs<Props extends BaseObject = BaseObject> = (ExecutionProps & Partial<Props>) | ((props: ExecutionContext & Props) => ExecutionProps & Partial<Props>) - changed:
type CSSProp = RuleSet<any> → type CSSProp = Interpolation<any> - changed:
type Dict<T> = { [key: string]: T } → type Dict<T = any> = { [key: string]: T } - changed:
type Interpolation<Props extends object> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | IStyledComponent<'web', any> | Int… → type Interpolation<Props extends BaseObject> = StyleFunction<Props> | StyledObject<Props> | TemplateStringsArray | string | number | false | undefined | null | Keyframes | StyledComponentBrand | RuleSet<Pro… - changed:
type KnownTarget = keyof JSX.IntrinsicElements | AnyComponent → type KnownTarget = SupportedHTMLElements | AnyComponent - changed:
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?: stri… → type PolymorphicComponentProps<R extends Runtime, BaseProps extends BaseObject, AsTarget extends StyledTarget<R> | (BaseProps extends { as?: infer A } ? A : never) | void, ForwardedAsTarget extends StyledTarget<R> | void, AsTargetProps extends BaseObject = TargetProps<R, AsTarget>, ForwardedAsTargetProps extends BaseObject = TargetProps<R, ForwardedAsTarget>> = NoInfer<FastOmit<MergeProps<BaseProps, Substitute<ForwardedAsTargetProps, AsTargetProps>>, keyof ExecutionProps>> & ThemedExecutionProps & { as?: AsTarget; for… - changed:
type RuleSet<Props extends object> = Interpolation<Props>[] → type RuleSet<Props extends BaseObject = BaseObject> = Interpolation<Props>[] - changed:
type Styles<Props extends object> = TemplateStringsArray | StyledObject<Props> | StyleFunction<Props> → type Styles<Props extends BaseObject> = TemplateStringsArray | StyledObject<Props> | StyleFunction<Props> - changed:
type WebTarget = string | KnownTarget → type WebTarget = (string & {}) | KnownTarget - added:
export { CSS } - added:
export { NoInfer } from './utils/noInfer' - added:
export { SupportedHTMLElements } - added:
interface ExoticComponentWithDisplayName<P extends BaseObject = {}> extends React.ExoticComponent<P> - added:
interface IStyledComponentBase<out R extends Runtime, in out Props extends BaseObject = BaseObject> extends PolymorphicComponent<R, WidenUntypedProps<Props>>, IStyledStatics<R, Props>, StyledComponentBrand - added:
property ExoticComponentWithDisplayName.defaultProps?: Partial<P> | undefined - added:
property ExoticComponentWithDisplayName.displayName?: string | undefined - added:
property IStyledComponentBase.defaultProps?: (ExecutionProps & Partial<Props>) | undefined - added:
property IStyledComponentBase.toString: () => string - added:
property PolymorphicComponent.defaultProps?: Partial<BaseProps> | undefined - added:
property PolymorphicComponent.propTypes?: any - added:
type BaseObject = {} - added:
type CSSKeyframes = object & { [key: string]: CSSObject } - added:
type CSSObject<Props extends BaseObject = BaseObject> = StyledObject<Props> - added:
type CSSProperties = CSS.Properties<number | (string & {})> - added:
type CSSPropertiesWithVars = React.CSSProperties & { [key: `--${string}`]: string | number | undefined } - added:
type CSSPseudos = { [K in CSS.Pseudos]?: CSSObject } - added:
type CustomStyle<T extends object> = T & { [K in Exclude<keyof CSSPropertiesWithVars, keyof T>]?: never } - added:
type DataAttributes = { [key: `data-${string}`]: any } - added:
type ExecutionProps = { as?: KnownTarget | undefined; forwardedAs?: KnownTarget | undefined; theme?: DefaultTheme | undefined } - added:
type FastOmit<T extends BaseObject, U extends string | number | symbol> = { [K in keyof T as K extends U ? never : K]: T[K] } - added:
type IStyledComponent<R extends Runtime, Props extends BaseObject = BaseObject> = IStyledComponentBase<R, Props> & string - added:
type InsertionTarget = HTMLElement | ShadowRoot - added:
type KnownTargetPropsWithRef<T> = T extends React.ElementType ? React.ComponentPropsWithRef<T> : {} - added:
type MakeAttrsOptional<P extends BaseObject, K extends keyof any> = [K] extends [never] ? P : P extends unknown ? Omit<P, K & keyof P> & Partial<Pick<P, K & keyof P>> : never - added:
type MergeProps<A extends BaseObject, B> = keyof B extends never ? {} extends B ? A : Merged<A, B> : Merged<A, B> - added:
type Merged<A extends BaseObject, B> = FastOmit<A, Exclude<keyof B, 'style'>> & B - added:
type NativeStyledComponent<Target extends NativeTarget, Props extends BaseObject = BaseObject> = IStyledComponent<'native', WidenForUntypedTarget<TargetProps<'native', Target>, MergeProps<TargetProps<'native', Target>, Props>>> - added:
type StyledComponent<Target extends WebTarget, Props extends BaseObject = BaseObject> = IStyledComponent<'web', WidenForUntypedTarget<TargetProps<'web', Target>, MergeProps<TargetProps<'web', Target>, Props>>> & (Target extends string ? {} : Omit<… - added:
type StyledComponentBrand = { readonly _sc: symbol } - added:
type Substitute<A extends BaseObject, B> = keyof B extends never ? {} extends B ? A : Substituted<A, B> : Substituted<A, B> - added:
type Substituted<A extends BaseObject, B> = FastOmit<A, keyof B> & B - added:
type TargetProps<R extends Runtime, T> = T extends keyof React.JSX.IntrinsicElements ? IntrinsicProps<T> : T extends AnyComponent ? ComponentTargetProps<R, T> : {} - added:
type WidenForUntypedTarget<Target extends BaseObject, Props extends BaseObject> = (Target extends unknown ? (keyof Target extends never ? true : false) : never) extends true ? Props & { [key: string]: unknown } : Props - added:
type WidenUntypedProps<Props extends BaseObject> = WidenForUntypedTarget<Props, Props>
- added:
const ASTERISK = 42 - added:
const BACKSLASH = 92 - added:
const CLOSE_BRACE = 125 - added:
const CLOSE_PAREN = 41 - added:
const DOUBLE_QUOTE = 34 - added:
const HYPHEN = 45 - added:
const NEWLINE = 10 - added:
const OPEN_BRACE = 123 - added:
const OPEN_PAREN = 40 - added:
const SEMICOLON = 59 - added:
const SINGLE_QUOTE = 39 - added:
const SLASH = 47 - added:
const UPPER_A = 65 - added:
const UPPER_TO_LOWER = 32 - added:
const UPPER_Z = 90
- changed:
const checkDynamicCreation: (displayName: string, componentId?: string) => void → const checkDynamicCreation: (displayName: string, componentId?: string | undefined) => void
- added:
const cssTagged: WeakSet<RuleSet<any>>
- changed:
default function determineTheme(props: ExecutionProps, providedTheme?: DefaultTheme, defaultProps?: { theme?: DefaultTheme }): DefaultTheme | undefined → default function determineTheme(props: ExecutionProps, providedTheme?: DefaultTheme | undefined, defaultProps?: { theme?: DefaultTheme | undefined }): DefaultTheme | undefined
- changed:
const _default: Set<'object' | 'g' | 'big' | 'link' | 'small' | 'sub' | 'sup' | 'a' | 'abbr' | 'address' | 'area' | 'article' | 'aside' | 'audio' | 'b' | 'base' | 'bdi' | 'bdo… → const _default: Set<'symbol' | 'object' | 'a' | 'abbr' | 'address' | 'area' | 'article' | 'aside' | 'audio' | 'b' | 'bdi' | 'bdo' | 'blockquote' | 'body' | 'br' | 'button' | '… - added:
type SupportedHTMLElements = (typeof elements)[number]
- changed:
const EMPTY_ARRAY: readonly any[] → const EMPTY_ARRAY: Readonly<any[]>
- changed:
default function flatten<Props extends object>(chunk: Interpolation<Props>, executionContext?: ExecutionContext & Props, styleSheet?: StyleSheet, stylisInstance?: Stringifier): RuleSet<Props> → default function flatten<Props extends object>(chunk: Interpolation<object>, executionContext?: (ExecutionContext & Props) | undefined, styleSheet?: StyleSheet | undefined, stylisInstance?: Stringifier | undefined, result?: RuleSet<Props>): RuleSet<Props>
- added:
const phashN: (h: number, n: number) => number
- changed:
default function hoistNonReactStatics<T extends OmniComponent, S extends OmniComponent, C extends ExcludeList = {}>(targetComponent: T, sourceComponent: S, excludelist?: C): T & NonReactStatics<S, C> → default function hoistNonReactStatics<T extends OmniComponent, S extends OmniComponent, C extends ExcludeList = {}>(targetComponent: T, sourceComponent: S, excludelist?: C | undefined): T & NonReactStatics<S, C> - added:
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> ? ke…
- added:
const KEYFRAMES_SYMBOL: unique symbol - added:
default function isKeyframes(value: unknown): value is KeyframesClass
- changed:
default function isStyledComponent(target: any): target is IStyledComponent<'web', any, any> → default function isStyledComponent(target: any): target is StyledComponentBrand
- changed:
function joinStringArray(arr: string[], sep?: string): string → function joinStringArray(arr: string[], sep?: string | undefined): string - changed:
function joinStrings(a?: string | null, b?: string | null): string → function joinStrings(a?: string | undefined, b?: string | undefined): string - added:
function joinRules(rules: string[]): string - added:
function stripSplitter(css: string): string
- added:
type NoInfer<T> = [T][T extends any ? 0 : never]
- changed:
default function getNonce(): string | null → default function getNonce(): string | undefined - added:
function resetNonceCache(): void
- added:
function createRSCCache<T>(factory: () => T): (() => T) | null
- added:
function setToString(object: object, toStringFn: () => string): void
- changed:
type ICreateStylisInstance = { options?: { namespace?: string; prefix?: boolean }; plugins?: Middleware[] } → type ICreateStylisInstance = { options?: { namespace?: string | undefined; prefix?: boolean | undefined } | undefined; plugins?: stylis.Middleware[] | undefined } - added:
function isEscaped(css: string, i: number): boolean - added:
function preprocessCSS(css: string): string
- added:
default stylisPluginRSC - added:
function stylisPluginRSC(element: Parameters<Middleware>[0]): void