chore: retire macro docs (#952)

* chore: upgrade s-c

* chore: retire macro

* chore: add link back to gh

* test: update snaps

package.json

@@ -40,7 +40,7 @@
     "react-is": "^17.0.2",
     "react-live-runner": "^1.0.5",
     "react-transition-group": "^4.4.5",
-    "styled-components": "^6.0.0-rc.2",
+    "styled-components": "^6.0.0",
     "styled-theming": "^2.2.0",
     "stylis": "^4.2.0",
     "stylis-plugin-rtl": "^2.1.1"

sections/api/primary/css-prop.mdx

@@ -38,6 +38,8 @@ Note that you don't even have to add the import, the Babel plugin does that auto
 
 #### Usage with the Babel macro
 
+> This functionality was removed in v6.1 due to lack of usage and unnecessary bloat for other consumers. [More info](https://github.com/styled-components/styled-components/issues/4064)
+
 You can use the [Babel macro](/docs/tooling#babel-macro) to make this work in `create-react-app`. Unfortunately, Babel macros only run when imported so **the import can not be added automatically.** The above code works perfectly if you add the import to the macro manually:
 
 ```tsx

sections/faqs/create-react-app.mdx

@@ -3,7 +3,3 @@
 The basic functionality of the library should work out of the box like any other library.
 
 However, if you want to do server-side rendering or take advantage of some of the advanced capabilities of the [styled-components babel plugin](/docs/tooling#babel-plugin) without ejecting you'll need to set up [`react-app-rewired`](https://github.com/timarney/react-app-rewired) and [`react-app-rewire-styled-components`](https://github.com/withspectrum/react-app-rewire-styled-components).
-
-### Babel Macro
-
-As of create-react-app v2, there is now an alternative to setting up `react-app-rewired` through use of "babel macros". See the [documentation for the styled-components babel macro](/docs/tooling#babel-macro) for setup and usage.

sections/tooling/babel-macro.mdx

@@ -1,4 +1,6 @@
-## Babel Macro | v4
+## Babel Macro | v4 | v5
+
+> This functionality was removed in v6.1 due to lack of usage and unnecessary bloat for other consumers. [More info](https://github.com/styled-components/styled-components/issues/4064)
 
 [Babel macros](https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros) are quickly gaining steam as a full-featured option to allow advanced code transpilation for zero-config projects like [create-react-app](https://github.com/facebook/create-react-app).
 

test/components/NavBar/__snapshots__/Navbar.spec.tsx.snap

@@ -165,6 +165,7 @@ exports[`Navbar renders correctly 1`] = `
   align-items: center;
   background-color: rgba(12, 13, 15, 0.7);
   backdrop-filter: blur(5px);
+  -webkit-backdrop-filter: blur(5px);
   box-sizing: border-box;
   color: white;
   display: flex;

test/components/NavBar/__snapshots__/index.spec.tsx.snap

@@ -173,6 +173,7 @@ exports[`Nav renders correctly 1`] = `
   align-items: center;
   background-color: rgba(12, 13, 15, 0.7);
   backdrop-filter: blur(5px);
+  -webkit-backdrop-filter: blur(5px);
   box-sizing: border-box;
   color: white;
   display: flex;

test/components/__snapshots__/DocsLayout.spec.tsx.snap

@@ -197,6 +197,7 @@ exports[`DocsLayout renders correctly 1`] = `
   align-items: center;
   background-color: rgba(12, 13, 15, 0.7);
   backdrop-filter: blur(5px);
+  -webkit-backdrop-filter: blur(5px);
   box-sizing: border-box;
   color: white;
   display: flex;

test/components/__snapshots__/Note.spec.tsx.snap

@@ -14,8 +14,8 @@ exports[`Note renders correctly 1`] = `
   margin: 0 0 0.2777777777777778rem 0;
 }
 
-.sc-hzvfaM+.c0,
-.sc-clmipK+.c0 {
+.sc-eDDNPB+.c0,
+.sc-dmqGxT+.c0 {
   margin-top: 1.9444444444444444rem;
 }
 

yarn.lock

@@ -1660,6 +1660,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@emotion/is-prop-valid@npm:^1.2.1":
+  version: 1.2.1
+  resolution: "@emotion/is-prop-valid@npm:1.2.1"
+  dependencies:
+    "@emotion/memoize": ^0.8.1
+  checksum: 8f42dc573a3fad79b021479becb639b8fe3b60bdd1081a775d32388bca418ee53074c7602a4c845c5f75fa6831eb1cbdc4d208cc0299f57014ed3a02abcad16a
+  languageName: node
+  linkType: hard
+
+"@emotion/memoize@npm:^0.8.1":
+  version: 0.8.1
+  resolution: "@emotion/memoize@npm:0.8.1"
+  checksum: a19cc01a29fcc97514948eaab4dc34d8272e934466ed87c07f157887406bc318000c69ae6f813a9001c6a225364df04249842a50e692ef7a9873335fbcc141b0
+  languageName: node
+  linkType: hard
+
 "@emotion/unitless@npm:^0.8.0":
   version: 0.8.0
   resolution: "@emotion/unitless@npm:0.8.0"
@@ -2644,6 +2660,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/stylis@npm:^4.0.2":
+  version: 4.2.1
+  resolution: "@types/stylis@npm:4.2.1"
+  checksum: 556e7e4c3140f70afba4b1eacd2af48f6877c86eef43ce5d10d9d607e68f46ab25fe2cf9ae8a2f93765ca59aede98b6a1fd3cb66b4f8d73769932c50b614c8c3
+  languageName: node
+  linkType: hard
+
 "@types/tough-cookie@npm:*":
   version: 4.0.2
   resolution: "@types/tough-cookie@npm:4.0.2"
@@ -7468,7 +7491,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"nanoid@npm:^3.3.4":
+"nanoid@npm:^3.3.4, nanoid@npm:^3.3.6":
   version: 3.3.6
   resolution: "nanoid@npm:3.3.6"
   bin:
@@ -8100,6 +8123,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss@npm:^8.4.23":
+  version: 8.4.31
+  resolution: "postcss@npm:8.4.31"
+  dependencies:
+    nanoid: ^3.3.6
+    picocolors: ^1.0.0
+    source-map-js: ^1.0.2
+  checksum: 1d8611341b073143ad90486fcdfeab49edd243377b1f51834dc4f6d028e82ce5190e4f11bb2633276864503654fb7cab28e67abdc0fbf9d1f88cad4a0ff0beea
+  languageName: node
+  linkType: hard
+
 "preact@npm:^10.0.0":
   version: 10.15.0
   resolution: "preact@npm:10.15.0"
@@ -9204,7 +9238,7 @@ __metadata:
     react-transition-group: ^4.4.5
     remark-gfm: ^3.0.1
     rimraf: ^3.0.2
-    styled-components: ^6.0.0-rc.2
+    styled-components: ^6.0.0
     styled-theming: ^2.2.0
     stylis: ^4.2.0
     stylis-plugin-rtl: ^2.1.1
@@ -9214,9 +9248,9 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"styled-components@npm:^6.0.0-rc.2":
-  version: 6.0.0-rc.2
-  resolution: "styled-components@npm:6.0.0-rc.2"
+"styled-components@npm:^6.0.0":
+  version: 6.0.9
+  resolution: "styled-components@npm:6.0.9"
   dependencies:
     "@babel/cli": ^7.21.0
     "@babel/core": ^7.21.0
@@ -9228,10 +9262,14 @@ __metadata:
     "@babel/preset-react": ^7.18.6
     "@babel/preset-typescript": ^7.21.0
     "@babel/traverse": ^7.21.2
+    "@emotion/is-prop-valid": ^1.2.1
     "@emotion/unitless": ^0.8.0
+    "@types/stylis": ^4.0.2
     css-to-react-native: ^3.2.0
+    csstype: ^3.1.2
+    postcss: ^8.4.23
     shallowequal: ^1.1.0
-    stylis: ^4.2.0
+    stylis: ^4.3.0
     tslib: ^2.5.0
   peerDependencies:
     babel-plugin-styled-components: ">= 2"
@@ -9240,7 +9278,7 @@ __metadata:
   peerDependenciesMeta:
     babel-plugin-styled-components:
       optional: true
-  checksum: 3c52399aab749ac547bd266fde4c9ca107e4c3ed41dd6caffdade9265b0af58dfc539841069efb357a2f16c08aa31175710ed2d41b103de798304cb68a26c40e
+  checksum: 2ef1fb67b4b690b969e1efd2dd56943f45399203fe4f6f8a821bb6c8722c1bb28f0eef57b8614ddd751c50f0e19de2baa08f3ada8b3b2dc28109e5650be3c0e9
   languageName: node
   linkType: hard
 
@@ -9283,6 +9321,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"stylis@npm:^4.3.0":
+  version: 4.3.0
+  resolution: "stylis@npm:4.3.0"
+  checksum: 6120de3f03eacf3b5adc8e7919c4cca991089156a6badc5248752a3088106afaaf74996211a6817a7760ebeadca09004048eea31875bd8d4df51386365c50025
+  languageName: node
+  linkType: hard
+
 "sucrase@npm:^3.21.0":
   version: 3.31.0
   resolution: "sucrase@npm:3.31.0"