Patch Changes

• 49d09ae: Fix a performance regression in 6.4.0 where dynamic createGlobalStyle components caused significant re-render slowdowns. Also restores pre-6.4 cascade ordering when multiple instances of the same createGlobalStyle coexist.
• eca95b2: Fix outdated dev-mode error messages for keyframes-in-untagged-strings and component-selector references that still pointed at www.styled-components.com and described behavior from styled-components v3.

Full Changelog: https://github.com/styled-components/styled-components/compare/styled-components@6.4.1-prerelease-20260417184031...styled-components@6.4.1-prerelease-20260417184545

What's Changed

• fix: avoid double rebuildGroup on every dynamic createGlobalStyle render (#5730) by @quantizor in #5732

Full Changelog: https://github.com/styled-components/styled-components/compare/styled-components@6.4.0...styled-components@6.4.1-prerelease-20260417184031

Minor Changes

• b0f3d29: .attrs() improvements: props supplied via attrs are now automatically made optional on the resulting component (previously required even when attrs provided a default). Also fixes a bug where the attrs callback received a mutable props object that could be changed by subsequent attrs processing; it now receives an immutable snapshot.

• 2a973d8: Dropped IE11 support: ES2015 build target, inlined unitless CSS properties (removing @emotion/unitless dependency), removed legacy React class statics from hoist and other unnecessary code.

• 9e07d95: Add createTheme(defaultTheme, options?) for CSS variable theming that works across RSC and client components.

  Returns an object with the same shape where every leaf is var(--prefix-path, fallback). Pass it to ThemeProvider for stable class name hashes across themes (no hydration mismatch on light/dark switch).

  const theme = createTheme({ colors: { primary: '#0070f3' } });
  // theme.colors.primary → "var(--sc-colors-primary, #0070f3)"
  // theme.raw → original object
  // theme.vars.colors.primary → "--sc-colors-primary"
  // theme.resolve(el?) → computed values from DOM (client-only)
  // theme.GlobalStyle → component that emits CSS var declarations

  vars exposes bare CSS custom property names (same shape as the theme) for use in createGlobalStyle dark mode overrides without hand-writing variable names:

  const { vars } = createTheme({ colors: { bg: '#fff', text: '#000' } });
  
  const DarkOverrides = createGlobalStyle`
    @media (prefers-color-scheme: dark) {
      :root {
        ${vars.colors.bg}: #111;
        ${vars.colors.text}: #eee;
      }
    }
  `;

  Options: prefix (default "sc"), selector (default ":root", use ":host" for Shadow DOM).

• 79cc7b4: Add first-class CSP nonce support. Nonces can now be configured via StyleSheetManager's nonce prop (recommended for Next.js, Remix), ServerStyleSheet's constructor, <meta property="csp-nonce"> (Vite convention), <meta name="sc-nonce">, or the legacy __webpack_nonce__ global.

• b0f3d29: Rearchitect createGlobalStyle to use shared stylesheet groups.

  All instances of a createGlobalStyle component now share a single stylesheet group, registered once at definition time. This fixes unmounting one instance removing styles needed by others (#5695), styles scattering after remount (#3146), and group ID leaks during SSR (#3022).

  CSS injection order is now fully determined at definition time (lower group ID = earlier in stylesheet). Render order no longer affects CSS order. Keyframes defined before a component correctly appear before that component's rules.

  Also fixes: O(n^2) performance regression in jsdom test environments from unbounded rule accumulation, and stale static global styles during client-side HMR (effect deps now include the globalStyle reference so module re-evaluation triggers re-injection).

• b0f3d29: Significant render performance improvements via three-layer memoization and hot-path micro-optimizations. Client-only; server renders are unaffected.

  Re-renders that don't change styling now skip style resolution entirely. Components sharing the same CSS (e.g., list items) benefit from cross-sibling caching. Hot-path changes include forEach → for/for...of, template literal → manual concat, and reduced allocations.

  Benchmarks vs 6.3.12:

  • Parent re-render (most common): 3.3x faster
  • First mount: 1.7-2.5x faster
  • Prop cycling: 2.3-2.4x faster
  • 10K heavy layouts: 1.9x faster
  • No regressions on any benchmark

• 9ada92b: React Server Components support: inline style injection, deduplication, and a new stylisPluginRSC for child-index selector fixes.

  Inline style injection: RSC-rendered styled components emit <style data-styled> tags alongside their elements. CSS is deduplicated per render via React.cache (React 19+). Extended components use :where() zero-specificity wrapping on base CSS so extensions always win the cascade regardless of injection order.

  StyleSheetManager works in RSC: stylisPlugins and shouldForwardProp are now applied in server component environments where React context is unavailable.

  stylisPluginRSC — opt-in stylis plugin that fixes :first-child, :last-child, :nth-child(), and :nth-last-child() selectors broken by inline <style> tags shifting child indices. Rewrites them using CSS Selectors Level 4 of S syntax to exclude styled-components style tags from the count.

  import { StyleSheetManager, stylisPluginRSC } from 'styled-components';
  
  <StyleSheetManager stylisPlugins={[stylisPluginRSC]}>{children}</StyleSheetManager>;

  The plugin rewrites :first-child, :last-child, :nth-child(), and :nth-last-child() using CSS Selectors Level 4 of S syntax to exclude injected style tags from the child count.

  Browser support: Chrome 111+, Firefox 113+, Safari 9+ (~93% global). In unsupported browsers, the entire CSS rule is dropped — only opt in if your audience supports it. Use :first-of-type / :nth-of-type() as a universally compatible alternative.

  HMR: Stale styles during client-side HMR are detected and invalidated when module re-evaluation creates new component instances while IDs remain stable (SWC plugin assigns IDs by file location). createGlobalStyle additionally clears stale sheet entries when the instance changes between renders.

  The plugin is fully tree-shakeable — zero bytes in bundles that don't import it.

Patch Changes

• b0f3d29: Expose as and forwardedAs props in React.ComponentProps extraction for styled components
• 553cbb4: Fix memory leak in long-running apps using components with free-form string interpolations (e.g. color: ${p => p.$dynamicValue} where the value comes from unbounded user input).
• b0f3d29: React Native improvements: replaced postcss with a lightweight CSS declaration parser, fixing nanoid crashes in Expo/Metro (#5705) and improving parse speed 4-6x. Parent re-renders with unchanged children are 2.6-3.2x faster via cache-first render. Updated native component alias list (removed 5 dead components, added 4 missing). Added react-native as an optional peer dependency.
• 74e8b76: Smaller install footprint via unused dependency cleanup.

Patch Changes

• db4f940: Fix test performance regression in 6.3.x by eliminating double style rendering in createGlobalStyle and removing unnecessary DOM queries during cleanup in client/test environments.
• 1203f80: Fix React Native crash caused by document references in the native build. The native bundle no longer includes DOM code, resolving compatibility with RN 0.79+ and Hermes.
• 5ef3804: Gracefully handle CSS syntax errors in React Native instead of crashing. Missing semicolons and other syntax issues now log a warning in development and produce an empty style object instead of throwing a fatal error.
• a777f5a: Preserve explicitly passed undefined props instead of stripping them. This fixes compatibility with libraries like MUI and Radix UI that pass undefined to reset inherited defaults (e.g., role={undefined}). Props set to undefined via .attrs() are still stripped as before.

Patch Changes

• 752f5ec: fix: resolve "React is not defined" ReferenceError introduced in 6.3.10 when loading the CJS build in Node.js

Patch Changes

• f674224: fix: RSC style tags for extended components have correct href and include base CSS (#5663)

  • Fix spaces in <style href> attribute that caused React 19 hydration failures when using styled() inheritance
  • Fix missing base component CSS in RSC output when only the extended component renders
  • Emit a separate <style> tag per inheritance level with content-aware hrefs, enabling React 19 deduplication of shared base styles
  • Preserve correct CSS ordering (base before extended) for proper specificity override behavior

• f674224: Reduce standalone/browser bundle size by making IS_RSC a build-time constant, enabling dead code elimination of RSC-specific branches

Patch Changes

• ca61aca: Fix CSS block comments containing // (e.g. URLs) causing subsequent styles to not be applied.
• a2cd792: Fix createGlobalStyle styles not being removed when unmounted in RSC environments. React 19's precedence attribute on style tags makes them persist as permanent resources; global styles now render without precedence so they follow normal component lifecycle.
• dbe0aae: In RSC environments, theme is now undefined instead of {} for styled components, matching the existing behavior of withTheme and createGlobalStyle. This ensures accessing theme properties without a ThemeProvider correctly throws rather than silently returning undefined.
• 1888c73: Fix withTheme HOC types: ref now correctly resolves to the component instance type instead of the constructor, and theme is properly optional in the wrapped component's props.
• f84f3fa: Fix SSR styles hydration and global style cleanup in Shadow DOM
• 43a5b4b: Optimize internal style processing hot paths: cached GroupedTag index lookups, string fast path in flatten, direct string concatenation in dynamic style generation, pre-built stylis middleware chain with lazy RegExp creation, single-lookup Map operations, VirtualTag append fast-path, and manual string concat in SSR output.
• 788e8c0: Revert exports field and restore browser/server build split with browser field in package.json. Fixes require('stream') resolution errors in browser bundlers like webpack 5.

Patch Changes

• 55d05c1: Make react-dom an optional peer dependency, clean up some unnecessary type peers.

Patch Changes

• 51ffa9c: Fix createGlobalStyle compatibility with React StrictMode and RSC

  This fix addresses issues where global styles would disappear or behave incorrectly in React StrictMode and RSC:

  1. Static styles optimization: Static global styles (without props/interpolations) are now only injected once and won't be removed/re-added on every render. This prevents the style flickering that could occur during concurrent rendering.

  2. StrictMode-aware cleanup: Style cleanup now uses queueMicrotask to coordinate with React's effect lifecycle. In StrictMode's simulated unmount/remount cycle, styles are preserved. On real unmount, styles are properly removed.

  3. RSC compatibility: Move useRef inside RSC guard in createGlobalStyle and unify all useContext calls to use consistent !IS_RSC ? pattern.

  4. RSC inline style tag cleanup: Fix bug where server-defined createGlobalStyle rendered in client components would leave behind accumulated SSR-rendered inline <style data-styled-global> tags. The cleanup effect now removes these hoisted style tags when the component unmounts or re-renders with different CSS.

  These changes ensure createGlobalStyle works correctly with:

  • React StrictMode's double-render behavior
  • React 18/19's concurrent rendering features
  • React 19's style hoisting with the precedence attribute
  • React Server Components (server-defined GlobalStyles in client components)

• 51ffa9c: Restore styled.br.

• 1f794b7: Add package.json "exports" field for better native ESM integration.