Skip to content

Make styled components work when the Object prototype is frozen#3963

Merged
quantizor merged 1 commit intostyled-components:mainfrom
jportner:frozen-prototype-fix
Mar 10, 2023
Merged

Make styled components work when the Object prototype is frozen#3963
quantizor merged 1 commit intostyled-components:mainfrom
jportner:frozen-prototype-fix

Conversation

@jportner
Copy link
Contributor

@jportner jportner commented Mar 9, 2023

Background

Note: examples use the Node.js REPL with strict mode: node --use_strict.

Inheritance and Shadowing

Objects in JavaScript inherit properties from their prototype chain. For example, the "toString" property can be accessed on all objects, but it doesn't actually exist on each object, it exists on the global Object prototype:

let obj = {};
obj.toString();
// '[object Object]'
Object.getOwnPropertyDescriptor(obj, 'toString');
// undefined
Object.getOwnPropertyDescriptor(Object.prototype, 'toString');
// { value: [Function: toString], writable: true, enumerable: false, configurable: true }

Under normal circumstances, you can assign a property to an object using the = operator, and any property of the same name in the object's prototype chain will not be modified, but will be "shadowed" by the new property:

obj.toString = () => 'foo';
obj.toString();
// 'foo'
Object.getOwnPropertyDescriptor(obj, 'toString');
// { value: [Function: toString], writable: true, enumerable: true, configurable: true }

Prototype Pollution

From Snyk:

Prototype pollution is an injection attack that targets JavaScript runtimes. With prototype pollution, an attacker might control the default values of an object's properties. This allows the attacker to tamper with the logic of the application and can also lead to denial of service or, in extreme cases, remote code execution.

There are a few different ways to mitigate Prototype Pollution, and one way to do it across the board is to freeze the global Object prototype.

From MDN:

The Object.freeze() static method freezes an object. Freezing an object prevents extensions and makes existing properties non-writable and non-configurable. A frozen object can no longer be changed: new properties cannot be added, existing properties cannot be removed, their enumerability, configurability, writability, or value cannot be changed, and the object's prototype cannot be re-assigned.

This means that any attempt to change the Object prototype will fail. If using strict mode, it will throw an error; otherwise, it will be silently ignored.

If the Object prototype becomes frozen, all of its properties are no longer writable or configurable:

Object.freeze(Object.prototype);
Object.getOwnPropertyDescriptor(Object.prototype, 'toString');
// { value: [Function: toString], writable: false, enumerable: false, configurable: false }

This also prevents shadowing properties with assignment. If an object doesn't already have a property defined (such as "toString"), and it inherits a non-writable property of that name from its prototype chain, any attempt to assign the property on that object will fail:

let obj2 = {};
obj2.toString = () => 'bar';
// Uncaught TypeError: Cannot assign to read only property 'toString' of object '#<Object>'
obj2.toString();
// '[object Object]'

This behavior is described in the ECMAScript 2016 specification:

Assignment to an undeclared identifier or otherwise unresolvable reference does not create a property in the global object. When a simple assignment occurs within strict mode code, its LeftHandSideExpression must not evaluate to an unresolvable Reference. If it does a ReferenceError exception is thrown (6.2.3.2). The LeftHandSideExpression also may not be a reference to a data property with the attribute value {[[Writable]]: false}, to an accessor property with the attribute value {[[Set]]: undefined}, nor to a non-existent property of an object whose [[Extensible]] internal slot has the value false. In these cases a TypeError exception is thrown (12.15).

The Problem

Unfortunately, this package uses assignment to shadow the "toString" function on styled components:

WrappedStyledComponent.toString = () => `.${WrappedStyledComponent.styledComponentId}`;

This means that projects cannot use this package if they:

  • Have frozen the global Object prototype in client-side code, or
  • Have frozen the global Object prototype in server-side code and use server-side rendering

The Solution

You can still shadow non-writable prototype properties by explicitly defining a new data property on the object:

Object.defineProperty(obj2, 'toString', { value: () => 'bar' });
obj2.toString();
// 'bar'
Object.getOwnPropertyDescriptor(obj2, 'toString');
// { value: [Function: toString], writable: false, enumerable: false, configurable: false }

Styled components can be changed to use this method of shadowing so they are compatible with this approach of mitigating Prototype Pollution 🎉

I also have another branch ready with the same change for v5 if this PR is accepted.

Copy link
Contributor

@quantizor quantizor left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks makes sense

@quantizor quantizor merged commit a546d1e into styled-components:main Mar 10, 2023
@jportner jportner deleted the frozen-prototype-fix branch March 10, 2023 04:07
kodiakhq bot referenced this pull request in X-oss-byte/Canary-nextjs Sep 23, 2023
[![Mend Renovate](https://app.renovatebot.com/images/banner.svg)](https://renovatebot.com)

This PR contains the following updates:

| Package | Change | Age | Adoption | Passing | Confidence |
|---|---|---|---|---|---|
| [styled-components](https://styled-components.com) ([source](https://togithub.com/styled-components/styled-components)) | [`6.0.0-beta.5` -> `6.0.8`](https://renovatebot.com/diffs/npm/styled-components/6.0.0-beta.5/6.0.8) | [![age](https://developer.mend.io/api/mc/badges/age/npm/styled-components/6.0.8?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/styled-components/6.0.8?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/styled-components/6.0.0-beta.5/6.0.8?slim=true)](https://docs.renovatebot.com/merge-confidence/) | [![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/styled-components/6.0.0-beta.5/6.0.8?slim=true)](https://docs.renovatebot.com/merge-confidence/) |

---

### Release Notes

<details>
<summary>styled-components/styled-components (styled-components)</summary>

### [`v6.0.8`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.8)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.7...v6.0.8)

#### What's Changed

-   feat(native): add `toStyleSheet` function by [@&#8203;krudos](https://togithub.com/krudos) in [https://github.com/styled-components/styled-components/pull/4124](https://togithub.com/styled-components/styled-components/pull/4124)
-   fix: prevent `StyleSheetManager` updating context on every render by [@&#8203;keeganstreet](https://togithub.com/keeganstreet) in [https://github.com/styled-components/styled-components/pull/4159](https://togithub.com/styled-components/styled-components/pull/4159)
-   fix(types): ensure typing for static properties defined on third-party components wrapped by styled-components by [@&#8203;MartinPELCAT](https://togithub.com/MartinPELCAT) in [https://github.com/styled-components/styled-components/pull/4141](https://togithub.com/styled-components/styled-components/pull/4141)
-   fix: production mode inconsistent CSS rendering when dynamic property values are the same but property names are different by [@&#8203;bcole808](https://togithub.com/bcole808) in [https://github.com/styled-components/styled-components/pull/4132](https://togithub.com/styled-components/styled-components/pull/4132)
-   fix(types): decrease type complexity by moving off of `JSX.IntrinsicElements` for the supported element list by [@&#8203;RJWadley](https://togithub.com/RJWadley) in [https://github.com/styled-components/styled-components/pull/4149](https://togithub.com/styled-components/styled-components/pull/4149)
-   fix(types): adopt ref typing from forwardedAs by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/4163](https://togithub.com/styled-components/styled-components/pull/4163)
-   chore: update typescript reference on issue template by [@&#8203;chilled-capybara](https://togithub.com/chilled-capybara) in [https://github.com/styled-components/styled-components/pull/4150](https://togithub.com/styled-components/styled-components/pull/4150)
-   chore(types): add type exports for `StyleFunction`, `Interpolation` by [@&#8203;bcole808](https://togithub.com/bcole808) in [https://github.com/styled-components/styled-components/pull/4140](https://togithub.com/styled-components/styled-components/pull/4140)
-   chore: updated Contributing guide benchmark instructions by [@&#8203;bcole808](https://togithub.com/bcole808) in [https://github.com/styled-components/styled-components/pull/4137](https://togithub.com/styled-components/styled-components/pull/4137)
-   chore(types): add missing types `CSSProperties`, `CSSObject`, `CSSPseudos` and `CSSKeyframes` by [@&#8203;takurinton](https://togithub.com/takurinton) in [https://github.com/styled-components/styled-components/pull/4117](https://togithub.com/styled-components/styled-components/pull/4117)

#### New Contributors

-   [@&#8203;takurinton](https://togithub.com/takurinton) made their first contribution in [https://github.com/styled-components/styled-components/pull/4117](https://togithub.com/styled-components/styled-components/pull/4117)
-   [@&#8203;krudos](https://togithub.com/krudos) made their first contribution in [https://github.com/styled-components/styled-components/pull/4124](https://togithub.com/styled-components/styled-components/pull/4124)
-   [@&#8203;chilled-capybara](https://togithub.com/chilled-capybara) made their first contribution in [https://github.com/styled-components/styled-components/pull/4150](https://togithub.com/styled-components/styled-components/pull/4150)
-   [@&#8203;MartinPELCAT](https://togithub.com/MartinPELCAT) made their first contribution in [https://github.com/styled-components/styled-components/pull/4141](https://togithub.com/styled-components/styled-components/pull/4141)
-   [@&#8203;RJWadley](https://togithub.com/RJWadley) made their first contribution in [https://github.com/styled-components/styled-components/pull/4149](https://togithub.com/styled-components/styled-components/pull/4149)

**Full Changelog**: styled-components/styled-components@v6.0.7...v6.0.8

### [`v6.0.7`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.7)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.6...v6.0.7)

#### What's Changed

-   refactor(types): enable `exactOptionalPropertyTypes` check by [@&#8203;aspirisen](https://togithub.com/aspirisen) in [https://github.com/styled-components/styled-components/pull/3993](https://togithub.com/styled-components/styled-components/pull/3993)
-   fix(types): allow number for height/width/etc ([#&#8203;4090](https://togithub.com/styled-components/styled-components/issues/4090)) by [@&#8203;drewbrend](https://togithub.com/drewbrend) in [https://github.com/styled-components/styled-components/pull/4111](https://togithub.com/styled-components/styled-components/pull/4111)

#### New Contributors

-   [@&#8203;aspirisen](https://togithub.com/aspirisen) made their first contribution in [https://github.com/styled-components/styled-components/pull/3993](https://togithub.com/styled-components/styled-components/pull/3993)
-   [@&#8203;drewbrend](https://togithub.com/drewbrend) made their first contribution in [https://github.com/styled-components/styled-components/pull/4111](https://togithub.com/styled-components/styled-components/pull/4111)

**Full Changelog**: styled-components/styled-components@v6.0.6...v6.0.7

### [`v6.0.6`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.6)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.5...v6.0.6)

#### What's Changed

-   fix(types): issues with StyleFunctions and StyledObjects by [@&#8203;bcole808](https://togithub.com/bcole808) in [https://github.com/styled-components/styled-components/pull/4107](https://togithub.com/styled-components/styled-components/pull/4107)

#### New Contributors

-   [@&#8203;bcole808](https://togithub.com/bcole808) made their first contribution in [https://github.com/styled-components/styled-components/pull/4107](https://togithub.com/styled-components/styled-components/pull/4107)

**Full Changelog**: styled-components/styled-components@v6.0.5...v6.0.6

### [`v6.0.5`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.5)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.4...v6.0.5)

#### What's Changed

-   Fix createGlobalStyle not removing styles on unmount by [@&#8203;mdeschamps](https://togithub.com/mdeschamps) in [https://github.com/styled-components/styled-components/pull/4101](https://togithub.com/styled-components/styled-components/pull/4101)

#### New Contributors

-   [@&#8203;mdeschamps](https://togithub.com/mdeschamps) made their first contribution in [https://github.com/styled-components/styled-components/pull/4101](https://togithub.com/styled-components/styled-components/pull/4101)

**Full Changelog**: styled-components/styled-components@v6.0.4...v6.0.5

### [`v6.0.4`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.4)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.3...v6.0.4)

#### What's Changed

-   refactor: dev warning on unknown props retargeted specifically toward HTML targets rather than other React components by [@&#8203;woodreamz](https://togithub.com/woodreamz) in [https://github.com/styled-components/styled-components/pull/4084](https://togithub.com/styled-components/styled-components/pull/4084)
-   fix: untyped event handler callbacks  by [@&#8203;ziolekjj](https://togithub.com/ziolekjj) in [https://github.com/styled-components/styled-components/pull/4086](https://togithub.com/styled-components/styled-components/pull/4086)

#### New Contributors

-   [@&#8203;woodreamz](https://togithub.com/woodreamz) made their first contribution in [https://github.com/styled-components/styled-components/pull/4084](https://togithub.com/styled-components/styled-components/pull/4084)
-   [@&#8203;ziolekjj](https://togithub.com/ziolekjj) made their first contribution in [https://github.com/styled-components/styled-components/pull/4086](https://togithub.com/styled-components/styled-components/pull/4086)

**Full Changelog**: styled-components/styled-components@v6.0.3...v6.0.4

### [`v6.0.3`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.3)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.2...v6.0.3)

#### What's Changed

-   fix: StyleSheetManager missing Stylis types by [@&#8203;MattIPv4](https://togithub.com/MattIPv4) in [https://github.com/styled-components/styled-components/pull/4078](https://togithub.com/styled-components/styled-components/pull/4078)

#### New Contributors

-   [@&#8203;MattIPv4](https://togithub.com/MattIPv4) made their first contribution in [https://github.com/styled-components/styled-components/pull/4078](https://togithub.com/styled-components/styled-components/pull/4078)

**Full Changelog**: styled-components/styled-components@v6.0.2...v6.0.3

### [`v6.0.2`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.2)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.1...v6.0.2)

#### What's Changed

-   fix: StyleSheetManager must accept undefined props by [@&#8203;gineika](https://togithub.com/gineika) in [https://github.com/styled-components/styled-components/pull/4069](https://togithub.com/styled-components/styled-components/pull/4069)
-   fix: replace slow Omit type by [@&#8203;gineika](https://togithub.com/gineika) in [https://github.com/styled-components/styled-components/pull/4068](https://togithub.com/styled-components/styled-components/pull/4068)
-   drop `displayName` in production to save bytes, it's already present in the static className if you're using the babel plugin or equivalent
-   refactor use of `flatMap` and `at` with ES5-compliant variants

#### New Contributors

-   [@&#8203;gineika](https://togithub.com/gineika) made their first contribution in [https://github.com/styled-components/styled-components/pull/4069](https://togithub.com/styled-components/styled-components/pull/4069)

**Full Changelog**: styled-components/styled-components@v6.0.1...v6.0.2

### [`v6.0.1`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.1)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0...v6.0.1)

Fixed an issue where a dev-time warning was being triggered too eagerly.

**Full Changelog**: styled-components/styled-components@v6.0.0...v6.0.1

### [`v6.0.0`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/f135d4f20f7876d926312999ce244e049f57d256...v6.0.0)

    yarn add styled-components

#### Changed in this version

-   fix(types): prevent prop bleed on styling properties (fixes [#&#8203;4053](https://togithub.com/styled-components/styled-components/issues/4053), [`c0f8015`](https://togithub.com/styled-components/styled-components/commit/c0f8015af64367938ff9d9debf90fb8005459c6c))
-   feat(types): ship csstype via "CSS" namespace ([`e6c4f0a`](https://togithub.com/styled-components/styled-components/commit/e6c4f0a6b1a1c483cf0c433f0d0434bbda124d2c))
-   chore: bump stylis to 4.3 (fixes [#&#8203;4007](https://togithub.com/styled-components/styled-components/issues/4007), [`fa58875`](https://togithub.com/styled-components/styled-components/commit/fa58875dcbdbff43532c3b9519eb5fc7d009830d))
-   reduced some sources of unnecessary branching logic

#### Breaking changes in v6

Migration guide → https://styled-components.com/docs/faqs#what-do-i-need-to-do-to-migrate-to-v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v5.3.7...v6.0.0

### [`v6.0.0-rc.2-4007`](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.6...f135d4f20f7876d926312999ce244e049f57d256)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.6...f135d4f20f7876d926312999ce244e049f57d256)

### [`v6.0.0-rc.6`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-rc.6)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.5...v6.0.0-rc.6)

    yarn add styled-components

#### Changed in this version

-   fix: stylis types are now included as a direct dependency [#&#8203;4051](https://togithub.com/styled-components/styled-components/issues/4051) ([`235a62b`](https://togithub.com/styled-components/styled-components/commit/235a62b8d2f2ad42319df380f83a7e033b177db1))
-   refactor: simplify code related to style tag injection [#&#8203;4040](https://togithub.com/styled-components/styled-components/issues/4040) ([`c3939a4`](https://togithub.com/styled-components/styled-components/commit/c3939a4aa8a98ba1ed38a3ea024470f2395439a5))
-   chore: don't warn if shouldForwardProp is in use and the prop is forwarded (styled-components/styled-components@00ab9c4)

#### Breaking changes in v6

Migration guide → https://styled-components.com/docs/faqs#what-do-i-need-to-do-to-migrate-to-v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: https://github.com/styled-components/styled-components/compare/v6.0.0-rc.5..v6.0.0-rc.6

### [`v6.0.0-rc.5`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-rc.5)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.4...v6.0.0-rc.5)

    yarn add styled-components

#### Changed in this version

-   Compatibility with frozen Object prototype, part 2 by [@&#8203;jportner](https://togithub.com/jportner) in [https://github.com/styled-components/styled-components/pull/4042](https://togithub.com/styled-components/styled-components/pull/4042)
-   ensure useTheme hook returns theme object by [@&#8203;nksfrank](https://togithub.com/nksfrank) in [https://github.com/styled-components/styled-components/pull/4033](https://togithub.com/styled-components/styled-components/pull/4033)
-   revert rc.3 type changes, investigate alternate fixes by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/4037](https://togithub.com/styled-components/styled-components/pull/4037)
-   finalize rc.4 inclusions by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/4047](https://togithub.com/styled-components/styled-components/pull/4047)
-   object styles now have strong typing
-   add dev-time warning if `enableVendorPrefixes` needs to be enabled based on prop usage

#### New Contributors

-   [@&#8203;nksfrank](https://togithub.com/nksfrank) made their first contribution in [https://github.com/styled-components/styled-components/pull/4033](https://togithub.com/styled-components/styled-components/pull/4033)

#### Breaking changes in v6

Migration guide → https://styled-components.com/docs/faqs#what-do-i-need-to-do-to-migrate-to-v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: https://github.com/styled-components/styled-components/compare/v6.0.0-rc.3..v6.0.0-rc.5

### [`v6.0.0-rc.4`](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.3...v6.0.0-rc.4)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.3...v6.0.0-rc.4)

### [`v6.0.0-rc.3`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-rc.3)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.2...v6.0.0-rc.3)

-   fix(types): several regression fixes and improved CSSProp typing by [@&#8203;justinbhopper](https://togithub.com/justinbhopper), [@&#8203;aliceHendicott](https://togithub.com/aliceHendicott), [@&#8203;probablyup](https://togithub.com/probablyup)  in [https://github.com/styled-components/styled-components/pull/4028](https://togithub.com/styled-components/styled-components/pull/4028)
-   fix(stylis): ensure rules are split coming out of stylis by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/4021](https://togithub.com/styled-components/styled-components/pull/4021) (this is a partial fix for [#&#8203;4007](https://togithub.com/styled-components/styled-components/issues/4007), the remainder requires [https://github.com/thysultan/stylis/pull/315](https://togithub.com/thysultan/stylis/pull/315))

**Full Changelog**: styled-components/styled-components@v6.0.0-rc.2...v6.0.0-rc.3

### [`v6.0.0-rc.2`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-rc.2)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.1...v6.0.0-rc.2)

    yarn add styled-components

#### Changed in this version

-   fix(types): perf issue with large union types by [@&#8203;justinbhopper](https://togithub.com/justinbhopper) in [https://github.com/styled-components/styled-components/pull/4011](https://togithub.com/styled-components/styled-components/pull/4011)
-   fix(types): resolve deficiencies in the attr typings, and many other type improvements by [@&#8203;justinbhopper](https://togithub.com/justinbhopper), [@&#8203;aliceHendicott](https://togithub.com/aliceHendicott), [@&#8203;probablyup](https://togithub.com/probablyup)  in [https://github.com/styled-components/styled-components/pull/4014](https://togithub.com/styled-components/styled-components/pull/4014)

#### New Contributors

-   [@&#8203;justinbhopper](https://togithub.com/justinbhopper) made their first contribution in [https://github.com/styled-components/styled-components/pull/4011](https://togithub.com/styled-components/styled-components/pull/4011)

#### Upcoming

-   v6 migration documentation

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-rc.1...v6.0.0-rc.2

### [`v6.0.0-rc.1`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-rc.1)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-rc.0...v6.0.0-rc.1)

    yarn add styled-components

#### Changed in this version

-   bump stylis to 4.2.0 to enable `@layer` rule support

#### Upcoming

-   v6 migration documentation

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-rc.0...v6.0.0-rc.1

### [`v6.0.0-rc.0`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-rc.0)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.15...v6.0.0-rc.0)

    yarn add styled-components@beta

#### Changed in this version

-   fix: correct dep declaration for styled-components by [@&#8203;PeachScript](https://togithub.com/PeachScript) in [https://github.com/styled-components/styled-components/pull/3995](https://togithub.com/styled-components/styled-components/pull/3995)
-   fix scenario where stylis failed to process some self references in CSS ([`6cee6c2`](https://togithub.com/styled-components/styled-components/commit/6cee6c24f7e8dd4f0ada724fcea397d03e778ea2))

#### Upcoming

-   `@layer` rule support ([https://github.com/thysultan/stylis/pull/313](https://togithub.com/thysultan/stylis/pull/313))
-   v6 migration documentation

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

#### New Contributors (thank you!)

-   [@&#8203;PeachScript](https://togithub.com/PeachScript) made their first contribution in [https://github.com/styled-components/styled-components/pull/3995](https://togithub.com/styled-components/styled-components/pull/3995)

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.15...v6.0.0-rc.0

### [`v6.0.0-beta.15`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.15)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.14...v6.0.0-beta.15)

    yarn add styled-components@beta

#### Changed in this version

-   Fixes an issue where keyframes are declared inside a namespaced StyleSheetManager by [@&#8203;marmite22](https://togithub.com/marmite22) in [https://github.com/styled-components/styled-components/pull/3977](https://togithub.com/styled-components/styled-components/pull/3977)
-   chore: remove --clipboard option in envinfo by [@&#8203;ImBIOS](https://togithub.com/ImBIOS) in [https://github.com/styled-components/styled-components/pull/3972](https://togithub.com/styled-components/styled-components/pull/3972)
-   Fix `css` prop typings by [@&#8203;ahutchings](https://togithub.com/ahutchings) in [https://github.com/styled-components/styled-components/pull/3982](https://togithub.com/styled-components/styled-components/pull/3982)
-   Remove duplicated test by [@&#8203;ahutchings](https://togithub.com/ahutchings) in [https://github.com/styled-components/styled-components/pull/3984](https://togithub.com/styled-components/styled-components/pull/3984)
-   fix: Do not add px to CSS variables (main branch) by [@&#8203;Lazyuki](https://togithub.com/Lazyuki) in [https://github.com/styled-components/styled-components/pull/3987](https://togithub.com/styled-components/styled-components/pull/3987)
-   several typing fixes by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/3991](https://togithub.com/styled-components/styled-components/pull/3991)

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

#### New Contributors (thank you!)

-   [@&#8203;ImBIOS](https://togithub.com/ImBIOS) made their first contribution in [https://github.com/styled-components/styled-components/pull/3972](https://togithub.com/styled-components/styled-components/pull/3972)
-   [@&#8203;ahutchings](https://togithub.com/ahutchings) made their first contribution in [https://github.com/styled-components/styled-components/pull/3982](https://togithub.com/styled-components/styled-components/pull/3982)

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.14...v6.0.0-beta.15

### [`v6.0.0-beta.14`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.14)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.13...v6.0.0-beta.14)

    yarn add styled-components@beta

#### Changed in this version

-   **breaking refactor**(stylis): disable vendor prefixing by default by [@&#8203;probablyup](https://togithub.com/probablyup) in styled-components/styled-components@2b4f6cb
-   Fix determineTheme & add typing by [@&#8203;benbryant0](https://togithub.com/benbryant0) in [https://github.com/styled-components/styled-components/pull/3966](https://togithub.com/styled-components/styled-components/pull/3966)
-   Optimization of hot paths by [@&#8203;benbryant0](https://togithub.com/benbryant0) in [https://github.com/styled-components/styled-components/pull/3970](https://togithub.com/styled-components/styled-components/pull/3970)
-   refactor: adjust className application order by [@&#8203;probablyup](https://togithub.com/probablyup) in styled-components/styled-components@1e3ffeb
-   misc code optimizations

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   `StyleSheetManager`
    -   replaced `disableVendorPrefixes` with `enableVendorPrefixes` prop
    -   dropped automatic vendor prefixing; if you need to support older browsers, you can re-enable it easily with the above prop
        ```tsx
        <StyleSheetManager enableVendorPrefixes>
          {/* your React tree and ThemeProvider goes here */}
        </StyleSheetManager>
        ```
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

#### New Contributors (thank you!)

-   [@&#8203;benbryant0](https://togithub.com/benbryant0) made their first contribution in [https://github.com/styled-components/styled-components/pull/3966](https://togithub.com/styled-components/styled-components/pull/3966)

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.13...v6.0.0-beta.14

### [`v6.0.0-beta.13`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.13)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.12...v6.0.0-beta.13)

    yarn add styled-components@beta

#### Changed in this version

-   Remove "exports" entries by [@&#8203;SilviaPag95](https://togithub.com/SilviaPag95) in [https://github.com/styled-components/styled-components/pull/3961](https://togithub.com/styled-components/styled-components/pull/3961)
-   Make styled components work when the Object prototype is frozen by [@&#8203;jportner](https://togithub.com/jportner) in [https://github.com/styled-components/styled-components/pull/3963](https://togithub.com/styled-components/styled-components/pull/3963)

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

#### New Contributors (thank you!)

-   [@&#8203;SilviaPag95](https://togithub.com/SilviaPag95) made their first contribution in [https://github.com/styled-components/styled-components/pull/3961](https://togithub.com/styled-components/styled-components/pull/3961)
-   [@&#8203;jportner](https://togithub.com/jportner) made their first contribution in [https://github.com/styled-components/styled-components/pull/3963](https://togithub.com/styled-components/styled-components/pull/3963)

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.11...v6.0.0-beta.12

### [`v6.0.0-beta.12`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.12)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.11...v6.0.0-beta.12)

    yarn add styled-components@beta

#### Changed in this version

-   fix(types): restore exotic component prop passing ([`f678107`](https://togithub.com/styled-components/styled-components/commit/f678107f420ecf5454aa6326bd6819d83a61c09d)); this restores `React.ComponentProps<typeof MyStyledComponent>` support
-   add "exports" config in package.json
-   minor dependency updates
-   thank you [@&#8203;marmite22](https://togithub.com/marmite22) for updating a test that was not getting properly run

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.11...v6.0.0-beta.12

### [`v6.0.0-beta.11`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.11)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.10...v6.0.0-beta.11)

    yarn add styled-components@beta

#### Changed in this version

-   fix: invert StyleFunction prop handling by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/3941](https://togithub.com/styled-components/styled-components/pull/3941) (fixes `props.theme` in interpolations when using `attrs`

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.10...v6.0.0-beta.11

### [`v6.0.0-beta.10`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.10)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.9...v6.0.0-beta.10)

    yarn add styled-components@beta

#### Changed in this version

-   fix: interpolation functions returning null should not console.error by [@&#8203;charltoons](https://togithub.com/charltoons) in [https://github.com/styled-components/styled-components/pull/3925](https://togithub.com/styled-components/styled-components/pull/3925)
-   fix: prevent crash when process.env is not defined by [@&#8203;eMerzh](https://togithub.com/eMerzh) in [https://github.com/styled-components/styled-components/pull/3907](https://togithub.com/styled-components/styled-components/pull/3907)
-   Fixes issue when using an ampersand (&) to scope css to a parent selector alongside the new namespace feature by [@&#8203;marmite22](https://togithub.com/marmite22) in [https://github.com/styled-components/styled-components/pull/3908](https://togithub.com/styled-components/styled-components/pull/3908)
-   feat(StyleSheetManager): add ability to provide default shouldForwardProp by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/3930](https://togithub.com/styled-components/styled-components/pull/3930)
-   refactor: type adjustments by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/3931](https://togithub.com/styled-components/styled-components/pull/3931)

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

#### New Contributors

-   [@&#8203;charltoons](https://togithub.com/charltoons) made their first contribution in [https://github.com/styled-components/styled-components/pull/3925](https://togithub.com/styled-components/styled-components/pull/3925)
-   [@&#8203;eMerzh](https://togithub.com/eMerzh) made their first contribution in [https://github.com/styled-components/styled-components/pull/3907](https://togithub.com/styled-components/styled-components/pull/3907)
-   [@&#8203;marmite22](https://togithub.com/marmite22) made their first contribution in [https://github.com/styled-components/styled-components/pull/3908](https://togithub.com/styled-components/styled-components/pull/3908)

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.9...v6.0.0-beta.10

### [`v6.0.0-beta.9`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.9)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.8...v6.0.0-beta.9)

    yarn add styled-components@beta

#### What's Changed

-   fix: add `<use>` to domElements by [@&#8203;shanpriyan](https://togithub.com/shanpriyan) in [https://github.com/styled-components/styled-components/pull/3901](https://togithub.com/styled-components/styled-components/pull/3901)
-   refactor(typings): revise to support more attrs patterns by [@&#8203;probablyup](https://togithub.com/probablyup) in [https://github.com/styled-components/styled-components/pull/3906](https://togithub.com/styled-components/styled-components/pull/3906)

#### New Contributors

-   [@&#8203;shanpriyan](https://togithub.com/shanpriyan) made their first contribution in [https://github.com/styled-components/styled-components/pull/3901](https://togithub.com/styled-components/styled-components/pull/3901)

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.8...v6.0.0-beta.9

### [`v6.0.0-beta.8`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.8)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.7...v6.0.0-beta.8)

    yarn add styled-components@beta

#### What's Changed

-   revert rollup upgrade to resolve issues with cjs<>es default import interop
-   refactor(ThemeProvider): allow multiple children (styled-components/styled-components@871435c)

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.7...v6.0.0-beta.8

### [`v6.0.0-beta.7`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.7)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.6...v6.0.0-beta.7)

    yarn add styled-components@beta

#### What's Changed

-   feat(StyleSheetManager): add optional namespacing ([#&#8203;3881](https://togithub.com/styled-components/styled-components/issues/3881)); replaces functionality in the babel plugin to be performed at runtime
-   breaking refactor: remove deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   feat: add styled as named export as well ([`5aed9e3`](https://togithub.com/styled-components/styled-components/commit/5aed9e3f84cd52fa053693d5b66dc5a0f0c82ee9)); note that this syntax will probably not work with the babel plugin until it is updated
-   chore: dependency maintenance, including rollup upgrades

#### Breaking changes in v6

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.6...v6.0.0-beta.7

### [`v6.0.0-beta.6`](https://togithub.com/styled-components/styled-components/releases/tag/v6.0.0-beta.6)

[Compare Source](https://togithub.com/styled-components/styled-components/compare/v6.0.0-beta.5...v6.0.0-beta.6)

    yarn add styled-components@beta

#### What's Changed

-   Bump stylis to version 4.1.3 by [@&#8203;lunaris](https://togithub.com/lunaris) in [https://github.com/styled-components/styled-components/pull/3860](https://togithub.com/styled-components/styled-components/pull/3860) (adds `@container` CSS  support)
-   Fix various type issues

#### Breaking changes in v6 (as of this version)

-   now using `stylis` v4 (if using `stylis-plugin-rtl` you'll need to upgrade to the newer version)
-   styled-components now provides its own types; if you installed `@types/styled-components` in the past, you'll want to remove it
-   dropped `$as` and `$forwardedAs` props (use `as` or `forwardedAs`)
-   dropped automatic prop filtering; use transient props (`$` prefix) for stuff you don't want to be passed to child component / HTML
-   dropped deprecated `withComponent` API ([`87f511a`](https://togithub.com/styled-components/styled-components/commit/87f511a228e5b13b1ff70a416409e0705e5bf456)); use "as" prop instead
-   node >= 14 needed

**Full Changelog**: styled-components/styled-components@v6.0.0-beta.5...v6.0.0-beta.6

</details>

---

### Configuration

📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about this update again.

---

 - [ ] If you want to rebase/retry this PR, check this box

---

This PR has been generated by [Mend Renovate](https://www.mend.io/free-developer-tools/renovate/). View repository job log [here](https://developer.mend.io/github/X-oss-byte/Canary-nextjs).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants