From 1656e9b629741e85df5c54f000df1ef1ecbb7625 Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Thu, 17 Feb 2022 12:02:40 -0600
Subject: [PATCH 1/2] Revert "Revert swc css bump temporarily (#34440)"

This reverts commit 01524ef20fe102d623bcde01e6b9d04e67e6f291.
---
 packages/next-swc/Cargo.lock                  | 117 ++++++++++--------
 packages/next-swc/crates/core/Cargo.toml      |   8 +-
 .../core/src/styled_jsx/transform_css.rs      |  87 ++++---------
 .../styled-jsx/ts-with-css-resolve/output.js  |   4 +-
 .../css-selector-after-pseudo/output.js       |   2 +-
 .../fixture/styled-jsx/expressions/output.js  |  14 +--
 .../styled-jsx/external-stylesheet/output.js  |   4 +-
 .../fixture/styled-jsx/fragment/output.js     |   2 +-
 .../tests/fixture/styled-jsx/global/output.js |   2 +-
 .../fixture/styled-jsx/issue-30480/output.js  |   2 +-
 .../fixture/styled-jsx/issue-30570/output.js  |   2 +-
 .../output.js                                 |   5 +-
 .../tests/fixture/styled-jsx/styles/output.js |  12 +-
 .../fixture/styled-jsx/too-many/output.js     |  16 +--
 .../fixture/styled-jsx/tpl-escape-1/output.js |   2 +-
 .../fixture/styled-jsx/tpl-escape-2/output.js |   3 +-
 .../tpl-placeholder-1-as-property/output.js   |   2 +-
 .../output.js                                 |   3 +-
 .../tpl-placeholder-3-as-value/output.js      |   2 +-
 .../output.js                                 |   4 +-
 .../output.js                                 |   3 +-
 .../transform-css-complex-selector/output.js  |   2 +-
 .../styled-jsx/transform-css-global/output.js |   2 +-
 .../transform-css-media-query/output.js       |   2 +-
 .../styled-jsx/transform-css-normal/output.js |   2 +-
 .../styled-jsx/transform-css/output.js        |   2 +-
 .../crates/core/tests/full/example/output.js  |  18 +--
 .../core/tests/loader/css-hygiene-1/output.js |   2 +-
 .../core/tests/loader/example/output.js       |   2 +-
 .../core/tests/loader/issue-31627/output.js   |   4 +-
 .../loader/styled-components/1/output.js      |   2 +-
 packages/next-swc/crates/napi/Cargo.toml      |   6 +-
 packages/next-swc/crates/wasm/Cargo.toml      |   4 +-
 33 files changed, 144 insertions(+), 200 deletions(-)

diff --git a/packages/next-swc/Cargo.lock b/packages/next-swc/Cargo.lock
index 603918b6e73947a..af269fdef7c0c6e 100644
--- a/packages/next-swc/Cargo.lock
+++ b/packages/next-swc/Cargo.lock
@@ -812,7 +812,7 @@ dependencies = [
  "swc_css",
  "swc_ecma_loader",
  "swc_ecma_transforms_testing",
- "swc_ecmascript",
+ "swc_ecmascript 0.114.2",
  "swc_node_base",
  "swc_stylis",
  "testing",
@@ -839,7 +839,7 @@ dependencies = [
  "swc_bundler",
  "swc_common",
  "swc_ecma_loader",
- "swc_ecmascript",
+ "swc_ecmascript 0.114.2",
  "swc_node_base",
 ]
 
@@ -915,9 +915,9 @@ dependencies = [
 
 [[package]]
 name = "once_cell"
-version = "1.8.0"
+version = "1.9.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "692fcb63b64b1758029e0a96ee63e049ce8c5948587f2f7208df04625e5f6b56"
+checksum = "da32515d9f6e6e489d7bc9d84c71b060db7247dc035bbe44eac88cf87486d8d5"
 
 [[package]]
 name = "opaque-debug"
@@ -1589,15 +1589,15 @@ dependencies = [
  "serde",
  "swc_atoms",
  "swc_common",
- "swc_ecmascript",
+ "swc_ecmascript 0.112.6",
  "tracing",
 ]
 
 [[package]]
 name = "swc"
-version = "0.121.7"
+version = "0.126.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e6d2753ff42ccbcf55b444c5b5c75bdf8d711b9c022c6117a1945a5b259721da"
+checksum = "1c2373a6f6dddd42719a2d8fcd9989849915ae15691fd1a75f6b04d14a6cab91"
 dependencies = [
  "ahash",
  "anyhow",
@@ -1628,7 +1628,7 @@ dependencies = [
  "swc_ecma_transforms_optimization",
  "swc_ecma_utils",
  "swc_ecma_visit",
- "swc_ecmascript",
+ "swc_ecmascript 0.114.2",
  "swc_node_comments",
  "swc_visit",
  "tracing",
@@ -1646,9 +1646,9 @@ dependencies = [
 
 [[package]]
 name = "swc_bundler"
-version = "0.105.0"
+version = "0.107.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6288db2c327430667c9ab30fb053a76f6dbb4868569ef9833e04d355ef1e1d96"
+checksum = "c5b6761f9b57072658a42ff25304a7edc7f8444024726ed27d5861e4644c1ffe"
 dependencies = [
  "ahash",
  "anyhow",
@@ -1711,9 +1711,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css"
-version = "0.46.0"
+version = "0.85.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "75a4e8913ddbf92a39e087996c30a80dfcac5192adc3fb63cd3beabe8975b0c8"
+checksum = "d6f657d1876aa951dabce2be53af58e73f3c6fd61d17f177b647966ad9d77168"
 dependencies = [
  "swc_css_ast",
  "swc_css_codegen",
@@ -1724,9 +1724,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_ast"
-version = "0.42.0"
+version = "0.77.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b0861c74eba5c61ade5c1ef3a14e3e0fd0699f20e5619bbc292c2ac4f9463617"
+checksum = "26127ec7150da493706c0a8153cf1ad73fe1f2dd4e010e51ca783a97d4881a44"
 dependencies = [
  "is-macro",
  "serde",
@@ -1737,9 +1737,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_codegen"
-version = "0.44.0"
+version = "0.82.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "de309d82614f8d3613c27f4ccafbacc1ed524ca5bfd7792387f76314d5131df2"
+checksum = "3f7181cd4048b62f2e89e5a26b38c7d2d6bb5cd9080850b8d0278f8525062688"
 dependencies = [
  "auto_impl",
  "bitflags",
@@ -1764,9 +1764,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_parser"
-version = "0.46.0"
+version = "0.83.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ac061b34fb0a3afa4ac5777b705c149f91c2ab29fc5f8463acb2bf8a17e02938"
+checksum = "69ce9cc25996b42c50a0d2312021faf9e2d646a8c5baea6ea17ab7e928ba4bda"
 dependencies = [
  "bitflags",
  "lexical",
@@ -1777,9 +1777,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_utils"
-version = "0.39.0"
+version = "0.74.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "94cdc01e5631f63f8d4c52545d9a61ed5a6616a2d8d4d4b6235ea2ff779ae80c"
+checksum = "ee0b4a58cce4b02567f54c079cd7ce3a18bfb79638f81f2197079e7c35e4f749"
 dependencies = [
  "swc_atoms",
  "swc_common",
@@ -1789,9 +1789,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_visit"
-version = "0.41.0"
+version = "0.76.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ce49ce82798c85e1a8f2a46552b6ef9530868302c333f8b135da3b5c9d5b1ca8"
+checksum = "6d4bab1a12ffe359eca6413b09865e27c9e05c0e8d765bebd558d14df31f6e44"
 dependencies = [
  "swc_atoms",
  "swc_common",
@@ -1862,13 +1862,16 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_lints"
-version = "0.13.1"
+version = "0.14.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a4c9664c8261d32d1dff6df9978c4aa3b0ac686b8bbcab9d4cc8a2f56c9efdfc"
+checksum = "9dc7e7d669e28b2df325d9a232f1d74e7b77d2606c04f0f70cc37e38dcf49ad3"
 dependencies = [
+ "ahash",
  "auto_impl",
+ "dashmap",
  "parking_lot",
  "rayon",
+ "regex",
  "serde",
  "swc_atoms",
  "swc_common",
@@ -1899,9 +1902,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_minifier"
-version = "0.72.1"
+version = "0.74.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6541c47325e3b6b2c0a1ecdff32049bc3ae83765eb09e49f532ed4fcbe54a6e7"
+checksum = "184e0e6337f2a4cfff36e3456e7937846dadf0b47833b7f711654e4acd0a13aa"
 dependencies = [
  "ahash",
  "indexmap",
@@ -1928,9 +1931,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_parser"
-version = "0.88.2"
+version = "0.88.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "016e15f5837f1fb954c7a693a0229fc25cba2982ab9c13773db44ce0e00dc275"
+checksum = "bfd30c93f08afdf29226b5695e45aadcc6ce452470cc63ea87a7eb53d29bb02b"
 dependencies = [
  "either",
  "enum_kind",
@@ -1948,9 +1951,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_preset_env"
-version = "0.88.0"
+version = "0.90.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7ebd2ffd8d26a5d52d86da8d643038da2952e86993998f120554a80e0a64e2b5"
+checksum = "5335f575d5cd4fcefe8bb3c52fa8dc8d59d461f07da43fb2ac6c31689aa88e0f"
 dependencies = [
  "ahash",
  "anyhow",
@@ -1974,9 +1977,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms"
-version = "0.115.3"
+version = "0.117.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "142a3d2bd7a1d78fd2112a98cb295b7b6aa67c2c590d639650882cd658fc43c9"
+checksum = "b1fa132c1a736c2c61736958f1102249348a4cc911c7f60e3a6255aa49c1c03e"
 dependencies = [
  "swc_atoms",
  "swc_common",
@@ -2017,9 +2020,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms_classes"
-version = "0.45.0"
+version = "0.46.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d8fec6a1780299ff1006539b71bed431bde5e48c9773235de4ccc414467ff0f2"
+checksum = "ac8983235c6902879b65dcb1003d4084adf094408c96d94d62d3f33f44c3fa8e"
 dependencies = [
  "swc_atoms",
  "swc_common",
@@ -2031,9 +2034,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms_compat"
-version = "0.69.0"
+version = "0.70.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c7e1ec45963836c97a27c1c43c316ddfdddeac274aa793223a0a82391ba2304f"
+checksum = "7ff9a64fc99b205b6104a6996832b0006fc059f5aa9fe61d5fb2c3b9f1885b14"
 dependencies = [
  "ahash",
  "arrayvec 0.7.2",
@@ -2069,9 +2072,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms_module"
-version = "0.76.1"
+version = "0.78.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "151f5f8fb7bf42d4bbc04e61af0b5fd84e31b1a3014e006f60246b1cac68274e"
+checksum = "441616e68981062a1650a923d2c63075021a8178045e2112007a90a157cdb1da"
 dependencies = [
  "Inflector",
  "ahash",
@@ -2091,9 +2094,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms_optimization"
-version = "0.85.0"
+version = "0.87.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "57792864e708f7ba41c4fed8c8b8e2c01dba8da4a44aa43ebb70a60e07e45265"
+checksum = "e074149dd5e969d35a790851b47b0f76700b14fcfda1c05e15751c1458e2dd38"
 dependencies = [
  "ahash",
  "dashmap",
@@ -2114,9 +2117,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms_proposal"
-version = "0.76.0"
+version = "0.77.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4e0c8f8ad3e3960658e4d7a4a87609b893b2a023f570e45b91f4ebe025845b43"
+checksum = "048ac8ea82e02fa9a54b9aa448dc5d15a8e994304364fcd8c4e2f650572c9141"
 dependencies = [
  "either",
  "serde",
@@ -2134,9 +2137,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms_react"
-version = "0.78.0"
+version = "0.80.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3d93afe0884dbcb5d4f931d6b2673ba65ad17d0de4d1c88e69f2730f13817739"
+checksum = "9fb5b7c98597bf41d1503ca4039be5445fd02e7aa381ae520d1c78a8a370f7f5"
 dependencies = [
  "ahash",
  "base64 0.13.0",
@@ -2182,9 +2185,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_transforms_typescript"
-version = "0.80.0"
+version = "0.82.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4b136bcb8a598378542393b2e9b51231e23e34b858baa0582aa72e78a2d5fee5"
+checksum = "f7859a18a33f751d488fbc1b7a0073fb08c69d794ad1f8daa2da47bfda2d9242"
 dependencies = [
  "serde",
  "swc_atoms",
@@ -2199,9 +2202,9 @@ dependencies = [
 
 [[package]]
 name = "swc_ecma_utils"
-version = "0.65.0"
+version = "0.65.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a372b01214518c1dbfb9f84d7e08e8e46e2098e7e1f63eb9e9f6f06025ae2863"
+checksum = "b462ac7dd5340544e7a12965bb7fbbbf9db8b26c1b32159b43c4b2430fed3fc8"
 dependencies = [
  "indexmap",
  "once_cell",
@@ -2232,6 +2235,18 @@ name = "swc_ecmascript"
 version = "0.112.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "ce38cf2c41ed841d82dbfb1c328379a3ec75d4e4e43900ea8c8ef3c51a44e3cb"
+dependencies = [
+ "swc_ecma_ast",
+ "swc_ecma_parser",
+ "swc_ecma_utils",
+ "swc_ecma_visit",
+]
+
+[[package]]
+name = "swc_ecmascript"
+version = "0.114.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e752c12b209c65e203a952186ab2fcefa8021a17a8a393b7d5f410e1fe1a0e87"
 dependencies = [
  "swc_ecma_ast",
  "swc_ecma_codegen",
@@ -2313,9 +2328,9 @@ dependencies = [
 
 [[package]]
 name = "swc_stylis"
-version = "0.43.0"
+version = "0.81.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "75fd0f4f37579b15bbcd762b0fd1ae3fc6ef29215777b96cbc2bcdfaacd439ab"
+checksum = "1cf66bb3ab3e136fb0852c2577824cd19b76f3346d7c5558cfdb782b5f14f6a4"
 dependencies = [
  "swc_atoms",
  "swc_common",
@@ -2649,7 +2664,7 @@ dependencies = [
  "serde_json",
  "swc",
  "swc_common",
- "swc_ecmascript",
+ "swc_ecmascript 0.114.2",
  "tracing",
  "wasm-bindgen",
  "wasm-bindgen-futures",
diff --git a/packages/next-swc/crates/core/Cargo.toml b/packages/next-swc/crates/core/Cargo.toml
index 1b43fb3ebc4ccbc..6e82e60b7a98166 100644
--- a/packages/next-swc/crates/core/Cargo.toml
+++ b/packages/next-swc/crates/core/Cargo.toml
@@ -16,14 +16,14 @@ pathdiff = "0.2.0"
 serde = "1"
 serde_json = "1"
 styled_components = "0.14.0"
-swc = "0.121.7"
+swc = "0.126.2"
 swc_atoms = "0.2.7"
 swc_common = { version = "0.17.0", features = ["concurrent", "sourcemap"] }
-swc_css = "0.46.0"
+swc_css = "0.85.0"
 swc_ecma_loader = { version = "0.28.0", features = ["node", "lru"] }
-swc_ecmascript = { version = "0.112.6", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] }
+swc_ecmascript = { version = "0.114.2", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] }
 swc_node_base = "0.5.1"
-swc_stylis = "0.43.0"
+swc_stylis = "0.81.0"
 tracing = {version = "0.1.28", features = ["release_max_level_off"]}
 regex = "1.5"
 
diff --git a/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs b/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs
index dcf00d73bf56b7e..d25cd05e634967a 100644
--- a/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs
+++ b/packages/next-swc/crates/core/src/styled_jsx/transform_css.rs
@@ -21,7 +21,7 @@ use tracing::{debug, trace};
 use super::{hash_string, string_literal_expr, LocalStyle};
 
 pub fn transform_css(
-    cm: Arc<SourceMap>,
+    _cm: Arc<SourceMap>,
     style_info: &LocalStyle,
     is_global: bool,
     class_name: &Option<String>,
@@ -33,7 +33,6 @@ pub fn transform_css(
         style_info.css_span.lo,
         style_info.css_span.hi,
         ParserConfig {
-            parse_values: false,
             allow_wrong_line_comments: true,
         },
         // We ignore errors because we inject placeholders for expressions which is
@@ -62,7 +61,6 @@ pub fn transform_css(
     };
     // ? Do we need to support optionally prefixing?
     ss.visit_mut_with(&mut prefixer());
-    ss.visit_mut_with(&mut CssPlaceholderFixer { cm });
     ss.visit_mut_with(&mut Namespacer {
         class_name: match class_name {
             Some(s) => s.clone(),
@@ -131,48 +129,6 @@ fn read_number(s: &str) -> (usize, usize) {
     unreachable!("read_number(`{}`) is invalid because it is empty", s)
 }
 
-/// This fixes invalid css which is created from interpolated expressions.
-///
-/// `__styled-jsx-placeholder-` is handled at here.
-struct CssPlaceholderFixer {
-    cm: Arc<SourceMap>,
-}
-
-impl VisitMut for CssPlaceholderFixer {
-    fn visit_mut_media_query(&mut self, q: &mut MediaQuery) {
-        q.visit_mut_children_with(self);
-
-        match q {
-            MediaQuery::Ident(q) => {
-                if !q.raw.starts_with("__styled-jsx-placeholder-") {
-                    return;
-                }
-                // We need to support both of @media ($breakPoint) {} and @media $queryString {}
-                // This is complex because @media (__styled-jsx-placeholder-0__) {} is valid
-                // while @media __styled-jsx-placeholder-0__ {} is not
-                //
-                // So we check original source code to determine if we should inject
-                // parenthesis.
-
-                // TODO(kdy1): Avoid allocation.
-                // To remove allocation, we should patch swc_common to provide a way to get
-                // source code without allocation.
-                //
-                //
-                // We need
-                //
-                // fn with_source_code (self: &mut Self, f: impl FnOnce(&str) -> Ret) -> _ {}
-                if let Ok(source) = self.cm.span_to_snippet(q.span) {
-                    if source.starts_with('(') {
-                        q.raw = format!("({})", &q.value).into();
-                    }
-                }
-            }
-            _ => {}
-        }
-    }
-}
-
 struct Namespacer {
     class_name: String,
     is_global: bool,
@@ -229,9 +185,7 @@ impl VisitMut for Namespacer {
                 }
                 ComplexSelectorChildren::Combinator(v) => match v.value {
                     CombinatorValue::Descendant => {}
-                    CombinatorValue::NextSibling
-                    | CombinatorValue::Child
-                    | CombinatorValue::LaterSibling => {
+                    _ => {
                         combinator = Some(v.clone());
 
                         new_selectors.push(sel);
@@ -251,23 +205,22 @@ impl Namespacer {
     ) -> Result<Vec<ComplexSelectorChildren>, Error> {
         let mut pseudo_index = None;
 
-        let empty_tokens = Tokens {
-            span: node.span,
-            tokens: vec![],
-        };
+        let empty_tokens = vec![];
         let mut arg_tokens;
 
         for (i, selector) in node.subclass_selectors.iter().enumerate() {
             let (name, args) = match selector {
                 SubclassSelector::PseudoClass(PseudoClassSelector { name, children, .. }) => {
-                    match children {
-                        Some(PseudoSelectorChildren::Nth(v)) => {
-                            arg_tokens = nth_to_tokens(&v);
-                            (name, &arg_tokens)
-                        }
-                        Some(PseudoSelectorChildren::Tokens(v)) => (name, v),
-                        None => (name, &empty_tokens),
-                    }
+                    arg_tokens = children
+                        .iter()
+                        .flatten()
+                        .flat_map(|v| match v {
+                            PseudoSelectorChildren::Nth(v) => nth_to_tokens(v).tokens,
+                            PseudoSelectorChildren::PreservedToken(v) => vec![v.clone()],
+                        })
+                        .collect::<Vec<_>>();
+
+                    (name, &arg_tokens)
                 }
                 SubclassSelector::PseudoElement(PseudoElementSelector {
                     name, children, ..
@@ -280,9 +233,19 @@ impl Namespacer {
 
             // One off global selector
             if &name.value == "global" {
+                let args = args.clone();
+                let mut args = {
+                    let lo = args.first().map(|v| v.span.lo).unwrap_or(BytePos(0));
+                    let hi = args.last().map(|v| v.span.hi).unwrap_or(BytePos(0));
+
+                    Tokens {
+                        span: Span::new(lo, hi, Default::default()),
+                        tokens: args,
+                    }
+                };
+
                 let block_tokens = get_block_tokens(&args);
                 let mut front_tokens = get_front_selector_tokens(&args);
-                let mut args = args.clone();
                 front_tokens.extend(args.tokens);
                 front_tokens.extend(block_tokens);
                 args.tokens = front_tokens;
@@ -291,7 +254,6 @@ impl Namespacer {
                     let x: ComplexSelector = parse_tokens(
                         &args,
                         ParserConfig {
-                            parse_values: false,
                             allow_wrong_line_comments: true,
                         },
                         // TODO(kdy1): We might be able to report syntax errors.
@@ -522,7 +484,6 @@ fn nth_to_tokens(nth: &Nth) -> Tokens {
     let mut lexer = swc_css::parser::lexer::Lexer::new(
         StringInput::new(&s, nth.span.lo, nth.span.hi),
         ParserConfig {
-            parse_values: false,
             allow_wrong_line_comments: true,
             ..Default::default()
         },
diff --git a/packages/next-swc/crates/core/tests/errors/styled-jsx/ts-with-css-resolve/output.js b/packages/next-swc/crates/core/tests/errors/styled-jsx/ts-with-css-resolve/output.js
index 135a868443bee87..6fbd823e7814ad9 100644
--- a/packages/next-swc/crates/core/tests/errors/styled-jsx/ts-with-css-resolve/output.js
+++ b/packages/next-swc/crates/core/tests/errors/styled-jsx/ts-with-css-resolve/output.js
@@ -1,5 +1,5 @@
 import _JSXStyle from "styled-jsx/style";
 export default {
-    styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;\ncolor:white;\nfont-weight:700;\nheight:100px}"}</_JSXStyle>,
+    styles: <_JSXStyle id={"71f03d42ea0ec6"}>{".container.jsx-71f03d42ea0ec6{background:#000;color:white;font-weight:700;height:100px}"}</_JSXStyle>,
     className: "jsx-71f03d42ea0ec6"
-};
\ No newline at end of file
+};
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/css-selector-after-pseudo/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/css-selector-after-pseudo/output.js
index 6cb37534c641bbe..adc37567bc9bc45 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/css-selector-after-pseudo/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/css-selector-after-pseudo/output.js
@@ -4,7 +4,7 @@ function NavigationItem({ active , className  }) {
         active
     }, className, "navigation-item") || "")}>
 
-      <_JSXStyle id={"2342aae4628612c6"}>{".navigation-item.jsx-2342aae4628612c6 a::after{content:attr(data-text);\ncontent: attr(data-text) / ''}"}</_JSXStyle>
+      <_JSXStyle id={"2342aae4628612c6"}>{".navigation-item.jsx-2342aae4628612c6 a::after{content:attr(data-text);content:attr(data-text)/\"\"}"}</_JSXStyle>
 
     </span>;
 }
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/expressions/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/expressions/output.js
index ea1779a5ca0e9f0..5822f4fe70aa354 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/expressions/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/expressions/output.js
@@ -51,8 +51,7 @@ export default (({ display  })=><div className={"jsx-1ada4ad4dab7822f " + _JSXSt
         ]
     ])}>test</p>
 
-    <_JSXStyle id={"6116059e04f3bff7"}>{`p.${color}.jsx-1ada4ad4dab7822f{color:${otherColor};
-display:${obj.display}}`}</_JSXStyle>
+    <_JSXStyle id={"6116059e04f3bff7"}>{`p.${color}.jsx-1ada4ad4dab7822f{color:${otherColor};display:${obj.display}}`}</_JSXStyle>
 
     <_JSXStyle id={"94239b6d6b42c9b5"}>{"p.jsx-1ada4ad4dab7822f{color:red}"}</_JSXStyle>
 
@@ -74,16 +73,11 @@ display:${obj.display}}`}</_JSXStyle>
         darken(color) + 2
     ]}>{`p.__jsx-style-dynamic-selector{color:${darken(color) + 2}}`}</_JSXStyle>
 
-    <_JSXStyle id={"4e4be2da62837c76"}>{`@media (min-width:${mediumScreen}) {p.jsx-1ada4ad4dab7822f{color:green}
-p.jsx-1ada4ad4dab7822f{color:${`red`}}}
-p.jsx-1ada4ad4dab7822f{color:red}`}</_JSXStyle>
+    <_JSXStyle id={"4e4be2da62837c76"}>{`@media(min-width:${mediumScreen}){p.jsx-1ada4ad4dab7822f{color:green}p.jsx-1ada4ad4dab7822f{color:${`red`}}}p.jsx-1ada4ad4dab7822f{color:red}`}</_JSXStyle>
 
-    <_JSXStyle id={"27040f0829fb73d4"}>{`p.jsx-1ada4ad4dab7822f{-webkit-animation-duration:${animationDuration};
-animation-duration:${animationDuration}}`}</_JSXStyle>
+    <_JSXStyle id={"27040f0829fb73d4"}>{`p.jsx-1ada4ad4dab7822f{-webkit-animation-duration:${animationDuration};animation-duration:${animationDuration}}`}</_JSXStyle>
 
-    <_JSXStyle id={"3e72d735e703a530"}>{`p.jsx-1ada4ad4dab7822f{-webkit-animation:${animationDuration} forwards ${animationName};
-animation:${animationDuration} forwards ${animationName}}
-div.jsx-1ada4ad4dab7822f{background:${color}}`}</_JSXStyle>
+    <_JSXStyle id={"3e72d735e703a530"}>{`p.jsx-1ada4ad4dab7822f{-webkit-animation:${animationDuration} forwards ${animationName};animation:${animationDuration} forwards ${animationName}}div.jsx-1ada4ad4dab7822f{background:${color}}`}</_JSXStyle>
 
 
 
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/external-stylesheet/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/external-stylesheet/output.js
index 7dc7df9b4c8d786..e0304b413fd0af4 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/external-stylesheet/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/external-stylesheet/output.js
@@ -14,7 +14,7 @@ export default (()=><div className={"jsx-bee92b62eadf8a14 " + `jsx-${styles.__ha
 
     <div className={"jsx-bee92b62eadf8a14 " + `jsx-${styles.__hash} jsx-${styles3.__hash}`}>woot</div>
 
-    <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}\ndiv.jsx-bee92b62eadf8a14{color:green}"}</_JSXStyle>
+    <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"}</_JSXStyle>
 
     <_JSXStyle id={styles.__hash}>{styles}</_JSXStyle>
 
@@ -30,7 +30,7 @@ export const Test = ()=><div className={"jsx-bee92b62eadf8a14 " + `jsx-${styles3
 
     <div className={"jsx-bee92b62eadf8a14 " + `jsx-${styles3.__hash}`}>woot</div>
 
-    <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}\ndiv.jsx-bee92b62eadf8a14{color:green}"}</_JSXStyle>
+    <_JSXStyle id={"bee92b62eadf8a14"}>{"p.jsx-bee92b62eadf8a14{color:red}div.jsx-bee92b62eadf8a14{color:green}"}</_JSXStyle>
 
   </div>
 ;
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/fragment/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/fragment/output.js
index dda9c2b5fc7c534..aefcddc43fcb714 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/fragment/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/fragment/output.js
@@ -28,7 +28,7 @@ export default (()=><>
 
     </>
 
-    <_JSXStyle id={"6dd5f97e085c0297"}>{"p.jsx-6dd5f97e085c0297{color:cyan}\n.foo.jsx-6dd5f97e085c0297{font-size:18px;\ncolor:hotpink}\n#head.jsx-6dd5f97e085c0297{text-decoration:underline}"}</_JSXStyle>
+    <_JSXStyle id={"6dd5f97e085c0297"}>{"p.jsx-6dd5f97e085c0297{color:cyan}.foo.jsx-6dd5f97e085c0297{font-size:18px;color:hotpink}#head.jsx-6dd5f97e085c0297{text-decoration:underline}"}</_JSXStyle>
 
   </>
 );
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/global/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/global/output.js
index 7eab66c441b5a97..2ec88553ec8d757 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/global/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/global/output.js
@@ -1,7 +1,7 @@
 import _JSXStyle from "styled-jsx/style";
 const Test = ()=><div className={"jsx-d47d6adadf14e957"}>
 
-    <_JSXStyle id={"d47d6adadf14e957"}>{"body{color:red}\n:hover{color:red;\ndisplay:-webkit-box;\ndisplay:-webkit-flex;\ndisplay:-ms-flexbox;\ndisplay:flex;\n-webkit-animation:foo 1s ease-out;\nanimation:foo 1s ease-out}\ndiv a{display:none}\n[data-test]>div{color:red}"}</_JSXStyle>
+    <_JSXStyle id={"d47d6adadf14e957"}>{"body{color:red}:hover{color:red;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-animation:foo 1s ease-out;animation:foo 1s ease-out}div a{display:none}[data-test]>div{color:red}"}</_JSXStyle>
 
   </div>
 ;
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30480/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30480/output.js
index d91b5759a137084..f36b6e2e7383719 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30480/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30480/output.js
@@ -10,7 +10,7 @@ export default (({ breakPoint  })=><div className={_JSXStyle.dynamic([
 
     <_JSXStyle id={"42a6f8ca08e1a043"} dynamic={[
         breakPoint
-    ]}>{`@media (${breakPoint}) {}`}</_JSXStyle>
+    ]}>{`@media(${breakPoint}){}`}</_JSXStyle>
 
   </div>
 );
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30570/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30570/output.js
index fec5cf3680648f9..ac9cfafc42458f3 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30570/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-30570/output.js
@@ -6,7 +6,7 @@ export default function IndexPage() {
 
   
 
-        <_JSXStyle id={"bbdada4ef17d18ef"}>{"@supports (display:flex) {h1{color:hotpink}}"}</_JSXStyle>
+        <_JSXStyle id={"bbdada4ef17d18ef"}>{"@supports(display:flex){h1{color:hotpink}}"}</_JSXStyle>
 
       </div>;
 };
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-31562-interpolation-in-mdea/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-31562-interpolation-in-mdea/output.js
index fb59ef207106321..ac5394ea192a852 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-31562-interpolation-in-mdea/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/issue-31562-interpolation-in-mdea/output.js
@@ -36,10 +36,7 @@ export default class {
             Typography.base.size.mediumPlus,
             Target.largePlus,
             Typography.base.size.largePlus
-        ]}>{`html{font-size:${Typography.base.size.default};
-line-height:${Typography.base.lineHeight}}
-@media ${Target.mediumPlus} {html{font-size:${Typography.base.size.mediumPlus}}}
-@media ${Target.largePlus} {html{font-size:${Typography.base.size.largePlus}}}`}</_JSXStyle>
+        ]}>{`html{font-size:${Typography.base.size.default};line-height:${Typography.base.lineHeight}}@media ${Target.mediumPlus}{html{font-size:${Typography.base.size.mediumPlus}}}@media ${Target.largePlus}{html{font-size:${Typography.base.size.largePlus}}}`}</_JSXStyle>
 
         </div>;
     }
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/styles/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/styles/output.js
index 415058e5691e55a..7b61c0b7ec131ea 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/styles/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/styles/output.js
@@ -11,21 +11,18 @@ export const uh = bar;
 export const foo = new String(`div.jsx-945eaa83250ed332{color:${color}}`);
 foo.__hash = "945eaa83250ed332";
 ({
-    styles: <_JSXStyle id={"c107a919a5b2943d"}>{`div.jsx-c107a919a5b2943d{color:${colors.green.light}}
-a.jsx-c107a919a5b2943d{color:red}`}</_JSXStyle>,
+    styles: <_JSXStyle id={"c107a919a5b2943d"}>{`div.jsx-c107a919a5b2943d{color:${colors.green.light}}a.jsx-c107a919a5b2943d{color:red}`}</_JSXStyle>,
     className: "jsx-c107a919a5b2943d"
 });
 const b = {
-    styles: <_JSXStyle id={"c107a919a5b2943d"}>{`div.jsx-c107a919a5b2943d{color:${colors.green.light}}
-a.jsx-c107a919a5b2943d{color:red}`}</_JSXStyle>,
+    styles: <_JSXStyle id={"c107a919a5b2943d"}>{`div.jsx-c107a919a5b2943d{color:${colors.green.light}}a.jsx-c107a919a5b2943d{color:red}`}</_JSXStyle>,
     className: "jsx-c107a919a5b2943d"
 };
 const dynamic = (colors1)=>{
     const b = {
         styles: <_JSXStyle id={"60132422fc87f1d1"} dynamic={[
             colors1.green.light
-        ]}>{`div.__jsx-style-dynamic-selector{color:${colors1.green.light}}
-a.__jsx-style-dynamic-selector{color:red}`}</_JSXStyle>,
+        ]}>{`div.__jsx-style-dynamic-selector{color:${colors1.green.light}}a.__jsx-style-dynamic-selector{color:red}`}</_JSXStyle>,
         className: _JSXStyle.dynamic([
             [
                 "60132422fc87f1d1",
@@ -37,7 +34,6 @@ a.__jsx-style-dynamic-selector{color:red}`}</_JSXStyle>,
     };
 };
 export default {
-    styles: <_JSXStyle id={"e5da8dd7ff5c7f39"}>{`div.jsx-e5da8dd7ff5c7f39{font-size:3em}
-p.jsx-e5da8dd7ff5c7f39{color:${color}}`}</_JSXStyle>,
+    styles: <_JSXStyle id={"e5da8dd7ff5c7f39"}>{`div.jsx-e5da8dd7ff5c7f39{font-size:3em}p.jsx-e5da8dd7ff5c7f39{color:${color}}`}</_JSXStyle>,
     className: "jsx-e5da8dd7ff5c7f39"
 };
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/too-many/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/too-many/output.js
index 00ff7acd83a698f..fd67a8dec05a8c2 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/too-many/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/too-many/output.js
@@ -43,21 +43,7 @@ export const Red = ({ Component ="button"  })=>{
         e13,
         e14,
         e15
-    ]}>{`.button.__jsx-style-dynamic-selector{--button-1: ${e1};
---button-2: ${e2};
---button-3: ${e3};
---button-4: ${e4};
---button-5: ${e5};
---button-6: ${e6};
---button-7: ${e7};
---button-8: ${e8};
---button-9: ${e9};
---button-10: ${e10};
---button-11: ${e11};
---button-12: ${e12};
---button-13: ${e13};
---button-14: ${e14};
---button-15: ${e15}}`}</_JSXStyle>
+    ]}>{`.button.__jsx-style-dynamic-selector{--button-1:${e1};--button-2:${e2};--button-3:${e3};--button-4:${e4};--button-5:${e5};--button-6:${e6};--button-7:${e7};--button-8:${e8};--button-9:${e9};--button-10:${e10};--button-11:${e11};--button-12:${e12};--button-13:${e13};--button-14:${e14};--button-15:${e15}}`}</_JSXStyle>
 
     </Component>;
 };
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-1/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-1/output.js
index 7b9b2f69a80329b..b12af6f02d53d18 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-1/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-1/output.js
@@ -5,7 +5,7 @@ export default class {
 
         <p className={"jsx-1f6cef12199c3a8f"}>test</p>
 
-        <_JSXStyle id={"1f6cef12199c3a8f"}>{"p.jsx-1f6cef12199c3a8f{content:'`'}"}</_JSXStyle>
+        <_JSXStyle id={"1f6cef12199c3a8f"}>{"p.jsx-1f6cef12199c3a8f{content:\"`\"}"}</_JSXStyle>
 
       </div>;
     }
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-2/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-2/output.js
index 3e3ed2489c6705a..c94ca5493d06c47 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-2/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-escape-2/output.js
@@ -11,8 +11,7 @@ export default function Home({ fontFamily  }) {
 
       <_JSXStyle id={"f804e2f486b6ac13"} dynamic={[
         fontFamily
-    ]}>{`body{font-family:${fontFamily}}
-code:before, code:after{content:'\`'}`}</_JSXStyle>
+    ]}>{`body{font-family:${fontFamily}}code:before,code:after{content:"\`"}`}</_JSXStyle>
 
     </div>;
 };
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-1-as-property/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-1-as-property/output.js
index 9d93281ced13fd4..28d29b34b19665d 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-1-as-property/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-1-as-property/output.js
@@ -21,7 +21,7 @@ export default class {
 
           <_JSXStyle id={"e359801ddd3b3cb6"} dynamic={[
             inputSize ? "height: calc(2 * var(--a)) !important;" : ""
-        ]}>{`@media only screen {a.__jsx-style-dynamic-selector{${inputSize ? "height: calc(2 * var(--a)) !important;" : ""}
+        ]}>{`@media only screen{a.__jsx-style-dynamic-selector{${inputSize ? "height: calc(2 * var(--a)) !important;" : ""}
                 }}`}</_JSXStyle>
 
         </div>;
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-2-as-part-of-value/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-2-as-part-of-value/output.js
index bc25a6c5235b41e..7c0c59d4ac651a1 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-2-as-part-of-value/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-2-as-part-of-value/output.js
@@ -27,8 +27,7 @@ export default class {
             a[b],
             -1 * (c || 0),
             d
-        ]}>{`.a:hover .b.__jsx-style-dynamic-selector{a:${a[b]}px!important;
-b:translate3d(0, ${-1 * (c || 0)}px, -${d}px) scale(1)!important}`}</_JSXStyle>
+        ]}>{`.a:hover .b.__jsx-style-dynamic-selector{a:${a[b]}px!important;b:translate3d(0,${-1 * (c || 0)}px,-${d}px)scale(1)!important}`}</_JSXStyle>
 
         </div>;
     }
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-3-as-value/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-3-as-value/output.js
index f311c3526881348..754e53aa0330908 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-3-as-value/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-3-as-value/output.js
@@ -21,7 +21,7 @@ export default class {
 
           <_JSXStyle id={"4ca4ef3595473f53"} dynamic={[
             a
-        ]}>{`@media only screen {a.__jsx-style-dynamic-selector{color:${a}}}`}</_JSXStyle>
+        ]}>{`@media only screen{a.__jsx-style-dynamic-selector{color:${a}}}`}</_JSXStyle>
 
         </div>;
     }
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-4-as-part-of-value-in-multiple/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-4-as-part-of-value-in-multiple/output.js
index 4683d8c24306222..8f9e67c31304ac9 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-4-as-part-of-value-in-multiple/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-4-as-part-of-value-in-multiple/output.js
@@ -24,9 +24,7 @@ export default class {
           <_JSXStyle id={"97886c1e9511aafa"} dynamic={[
             a || "var(--c)",
             b || "inherit"
-        ]}>{`.a:hover .b.__jsx-style-dynamic-selector{display:inline-block;
-padding:0 ${a || "var(--c)"};
-color:${b || "inherit"}}`}</_JSXStyle>
+        ]}>{`.a:hover .b.__jsx-style-dynamic-selector{display:inline-block;padding:0 ${a || "var(--c)"};color:${b || "inherit"}}`}</_JSXStyle>
 
         </div>;
     }
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-5-values-of-multiple-properties/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-5-values-of-multiple-properties/output.js
index e009c13a7456165..898bc9e3d60aa32 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-5-values-of-multiple-properties/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/tpl-placeholder-5-values-of-multiple-properties/output.js
@@ -24,8 +24,7 @@ export default class {
           <_JSXStyle id={"bcc606c168bcd197"} dynamic={[
             a ? "100%" : "200px",
             b ? "0" : "8px 20px"
-        ]}>{`.item.__jsx-style-dynamic-selector{max-width:${a ? "100%" : "200px"};
-padding:${b ? "0" : "8px 20px"}}`}</_JSXStyle>
+        ]}>{`.item.__jsx-style-dynamic-selector{max-width:${a ? "100%" : "200px"};padding:${b ? "0" : "8px 20px"}}`}</_JSXStyle>
 
         </div>;
     }
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js
index a6480c2fb787d9f..5f2002467dea31c 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-complex-selector/output.js
@@ -3,7 +3,7 @@ export default (()=><div className={"jsx-713499aa363d6373"}>
 
     <p className={"jsx-713499aa363d6373"}>test</p>
 
-    <_JSXStyle id={"713499aa363d6373"}>{"p.jsx-713499aa363d6373 a.jsx-713499aa363d6373 span.jsx-713499aa363d6373{color:red}\np.jsx-713499aa363d6373 span{background:blue}\np.jsx-713499aa363d6373 a[title=\"'w ' '  t'\"].jsx-713499aa363d6373{margin:auto}\np.jsx-713499aa363d6373 span:not(.test){color:green}\np.jsx-713499aa363d6373, h1.jsx-713499aa363d6373{color:blue;\n-webkit-animation:hahaha 3s ease forwards infinite;\nanimation:hahaha 3s ease forwards infinite;\n-webkit-animation-name:hahaha;\nanimation-name:hahaha;\nanimation-delay:100ms}\np.jsx-713499aa363d6373{-webkit-animation:hahaha 1s, hehehe 2s;\nanimation:hahaha 1s, hehehe 2s}\np.jsx-713499aa363d6373:hover{color:red}\np.jsx-713499aa363d6373::before{color:red}\n.jsx-713499aa363d6373:hover{color:red}\n.jsx-713499aa363d6373::before{color:red}\n.jsx-713499aa363d6373:hover p.jsx-713499aa363d6373{color:red}\np.jsx-713499aa363d6373+a.jsx-713499aa363d6373{color:red}\np.jsx-713499aa363d6373~a.jsx-713499aa363d6373{color:red}\np.jsx-713499aa363d6373>a.jsx-713499aa363d6373{color:red}\n@keyframes hahaha {from {top:0}to {top:100}}\n@keyframes hehehe {from {left:0}to {left:100}}\n@media (min-width:500px) {.test.jsx-713499aa363d6373{color:red}}\n.test.jsx-713499aa363d6373{display:block}\n.inline-flex.jsx-713499aa363d6373{display:-webkit-inline-box;\ndisplay:-webkit-inline-flex;\ndisplay:-ms-inline-flexbox;\ndisplay:inline-flex}\n.flex.jsx-713499aa363d6373{display:-webkit-box;\ndisplay:-webkit-flex;\ndisplay:-ms-flexbox;\ndisplay:flex}\n.test.jsx-713499aa363d6373{box-shadow:0 0 10px black, inset 0 0 5px black}\n.test[title=\",\"].jsx-713499aa363d6373{display:inline-block}\n.test.is-status.jsx-713499aa363d6373 .test.jsx-713499aa363d6373{color:red}\n.a-selector.jsx-713499aa363d6373:hover, .a-selector.jsx-713499aa363d6373:focus{outline:none}"}</_JSXStyle>
+    <_JSXStyle id={"713499aa363d6373"}>{"p.jsx-713499aa363d6373 a.jsx-713499aa363d6373 span.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373 span{background:blue}p.jsx-713499aa363d6373 a[title=\"'w ' '  t'\"].jsx-713499aa363d6373{margin:auto}p.jsx-713499aa363d6373 span:not(.test){color:green}p.jsx-713499aa363d6373,h1.jsx-713499aa363d6373{color:blue;-webkit-animation:hahaha 3s ease forwards infinite;animation:hahaha 3s ease forwards infinite;-webkit-animation-name:hahaha;animation-name:hahaha;animation-delay:100ms}p.jsx-713499aa363d6373{-webkit-animation:hahaha 1s,hehehe 2s;animation:hahaha 1s,hehehe 2s}p.jsx-713499aa363d6373:hover{color:red}p.jsx-713499aa363d6373::before{color:red}.jsx-713499aa363d6373:hover{color:red}.jsx-713499aa363d6373::before{color:red}.jsx-713499aa363d6373:hover p.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373+a.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373~a.jsx-713499aa363d6373{color:red}p.jsx-713499aa363d6373>a.jsx-713499aa363d6373{color:red}@keyframes hahaha{from{top:0}to{top:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-713499aa363d6373{color:red}}.test.jsx-713499aa363d6373{display:block}.inline-flex.jsx-713499aa363d6373{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-713499aa363d6373{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.test.jsx-713499aa363d6373{box-shadow:0 0 10px black,inset 0 0 5px black}.test[title=\",\"].jsx-713499aa363d6373{display:inline-block}.test.is-status.jsx-713499aa363d6373 .test.jsx-713499aa363d6373{color:red}.a-selector.jsx-713499aa363d6373:hover,.a-selector.jsx-713499aa363d6373:focus{outline:none}"}</_JSXStyle>
 
   </div>
 );
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-global/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-global/output.js
index e8ab9d15554867b..b9405bfa115039c 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-global/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-global/output.js
@@ -3,7 +3,7 @@ export default (()=><div className={"jsx-53fd644ab080300c"}>
 
     <p className={"jsx-53fd644ab080300c"}>test</p>
 
-    <_JSXStyle id={"53fd644ab080300c"}>{"html.jsx-53fd644ab080300c{background-image:linear-gradient(0deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), url(/static/background.svg)}\np{color:blue}\np{color:blue}\np, a.jsx-53fd644ab080300c{color:blue}\n.foo+a{color:red}\nbody{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif}"}</_JSXStyle>
+    <_JSXStyle id={"53fd644ab080300c"}>{"html.jsx-53fd644ab080300c{background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:blue}p{color:blue}p,a.jsx-53fd644ab080300c{color:blue}.foo+a{color:red}body{font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Helvetica,Arial,sans-serif}"}</_JSXStyle>
 
   </div>
 );
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-media-query/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-media-query/output.js
index abc84ac0f354d0e..c5a6b455fb26a8c 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-media-query/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-media-query/output.js
@@ -3,7 +3,7 @@ export default (()=><div className={"jsx-1f7963ae04c6466a"}>
 
     <p className={"jsx-1f7963ae04c6466a"}>test</p>
 
-    <_JSXStyle id={"1f7963ae04c6466a"}>{"@media (min-width:1px) and (max-width:768px) {[class*='grid__col--'].jsx-1f7963ae04c6466a{margin-top:12px;\nmargin-bottom:12px}}\n@media (max-width:64em) {.test.jsx-1f7963ae04c6466a{margin-bottom:1em}\n@supports (-moz-appearance:none) and (display:contents) {.test.jsx-1f7963ae04c6466a{margin-bottom:2rem}}}"}</_JSXStyle>
+    <_JSXStyle id={"1f7963ae04c6466a"}>{"@media(min-width:1px)and (max-width:768px){[class*=\"grid__col--\"].jsx-1f7963ae04c6466a{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-1f7963ae04c6466a{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-1f7963ae04c6466a{margin-bottom:2rem}}}"}</_JSXStyle>
 
   </div>
 );
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-normal/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-normal/output.js
index 9c81fa9facdf808..98a03ea47b4ca77 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-normal/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css-normal/output.js
@@ -3,7 +3,7 @@ export default (()=><div className={"jsx-1a19bb4817c105dd"}>
 
     <p className={"jsx-1a19bb4817c105dd"}>test</p>
 
-    <_JSXStyle id={"1a19bb4817c105dd"}>{"p.jsx-1a19bb4817c105dd{color:red}\np.jsx-1a19bb4817c105dd{color:red}\n*.jsx-1a19bb4817c105dd{color:blue}\n[href=\"woot\"].jsx-1a19bb4817c105dd{color:red}"}</_JSXStyle>
+    <_JSXStyle id={"1a19bb4817c105dd"}>{"p.jsx-1a19bb4817c105dd{color:red}p.jsx-1a19bb4817c105dd{color:red}*.jsx-1a19bb4817c105dd{color:blue}[href=\"woot\"].jsx-1a19bb4817c105dd{color:red}"}</_JSXStyle>
 
   </div>
 );
diff --git a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js
index ddefde312281627..7a279450b965d13 100644
--- a/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js
+++ b/packages/next-swc/crates/core/tests/fixture/styled-jsx/transform-css/output.js
@@ -3,7 +3,7 @@ export default (()=><div className={"jsx-768337a97aceabd1"}>
 
     <p className={"jsx-768337a97aceabd1"}>test</p>
 
-    <_JSXStyle id={"768337a97aceabd1"}>{"html.jsx-768337a97aceabd1{background-image:linear-gradient(0deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)), url(/static/background.svg)}\np{color:blue}\np{color:blue}\np, a.jsx-768337a97aceabd1{color:blue}\n.foo+a{color:red}\nbody{font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif}\np.jsx-768337a97aceabd1{color:red}\np.jsx-768337a97aceabd1{color:red}\n*.jsx-768337a97aceabd1{color:blue}\n[href=\"woot\"].jsx-768337a97aceabd1{color:red}\np.jsx-768337a97aceabd1 a.jsx-768337a97aceabd1 span.jsx-768337a97aceabd1{color:red}\np.jsx-768337a97aceabd1 span{background:blue}\np.jsx-768337a97aceabd1 a[title=\"'w ' '  t'\"].jsx-768337a97aceabd1{margin:auto}\np.jsx-768337a97aceabd1 span:not(.test){color:green}\np.jsx-768337a97aceabd1, h1.jsx-768337a97aceabd1{color:blue;\n-webkit-animation:hahaha 3s ease forwards infinite;\nanimation:hahaha 3s ease forwards infinite;\n-webkit-animation-name:hahaha;\nanimation-name:hahaha;\nanimation-delay:100ms}\np.jsx-768337a97aceabd1{-webkit-animation:hahaha 1s, hehehe 2s;\nanimation:hahaha 1s, hehehe 2s}\np.jsx-768337a97aceabd1:hover{color:red}\np.jsx-768337a97aceabd1::before{color:red}\n.jsx-768337a97aceabd1:hover{color:red}\n.jsx-768337a97aceabd1::before{color:red}\n.jsx-768337a97aceabd1:hover p.jsx-768337a97aceabd1{color:red}\np.jsx-768337a97aceabd1+a.jsx-768337a97aceabd1{color:red}\np.jsx-768337a97aceabd1~a.jsx-768337a97aceabd1{color:red}\np.jsx-768337a97aceabd1>a.jsx-768337a97aceabd1{color:red}\n@keyframes hahaha {from {top:0}to {top:100}}\n@keyframes hehehe {from {left:0}to {left:100}}\n@media (min-width:500px) {.test.jsx-768337a97aceabd1{color:red}}\n.test.jsx-768337a97aceabd1{display:block}\n.inline-flex.jsx-768337a97aceabd1{display:-webkit-inline-box;\ndisplay:-webkit-inline-flex;\ndisplay:-ms-inline-flexbox;\ndisplay:inline-flex}\n.flex.jsx-768337a97aceabd1{display:-webkit-box;\ndisplay:-webkit-flex;\ndisplay:-ms-flexbox;\ndisplay:flex}\n.test.jsx-768337a97aceabd1{box-shadow:0 0 10px black, inset 0 0 5px black}\n.test[title=\",\"].jsx-768337a97aceabd1{display:inline-block}\n.test.is-status.jsx-768337a97aceabd1 .test.jsx-768337a97aceabd1{color:red}\n.a-selector.jsx-768337a97aceabd1:hover, .a-selector.jsx-768337a97aceabd1:focus{outline:none}\n@media (min-width:1px) and (max-width:768px) {[class*='grid__col--'].jsx-768337a97aceabd1{margin-top:12px;\nmargin-bottom:12px}}\n@media (max-width:64em) {.test.jsx-768337a97aceabd1{margin-bottom:1em}\n@supports (-moz-appearance:none) and (display:contents) {.test.jsx-768337a97aceabd1{margin-bottom:2rem}}}"}</_JSXStyle>
+    <_JSXStyle id={"768337a97aceabd1"}>{"html.jsx-768337a97aceabd1{background-image:linear-gradient(0deg,rgba(255,255,255,.8),rgba(255,255,255,.8)),url(/static/background.svg)}p{color:blue}p{color:blue}p,a.jsx-768337a97aceabd1{color:blue}.foo+a{color:red}body{font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Helvetica,Arial,sans-serif}p.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1{color:red}*.jsx-768337a97aceabd1{color:blue}[href=\"woot\"].jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1 a.jsx-768337a97aceabd1 span.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1 span{background:blue}p.jsx-768337a97aceabd1 a[title=\"'w ' '  t'\"].jsx-768337a97aceabd1{margin:auto}p.jsx-768337a97aceabd1 span:not(.test){color:green}p.jsx-768337a97aceabd1,h1.jsx-768337a97aceabd1{color:blue;-webkit-animation:hahaha 3s ease forwards infinite;animation:hahaha 3s ease forwards infinite;-webkit-animation-name:hahaha;animation-name:hahaha;animation-delay:100ms}p.jsx-768337a97aceabd1{-webkit-animation:hahaha 1s,hehehe 2s;animation:hahaha 1s,hehehe 2s}p.jsx-768337a97aceabd1:hover{color:red}p.jsx-768337a97aceabd1::before{color:red}.jsx-768337a97aceabd1:hover{color:red}.jsx-768337a97aceabd1::before{color:red}.jsx-768337a97aceabd1:hover p.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1+a.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1~a.jsx-768337a97aceabd1{color:red}p.jsx-768337a97aceabd1>a.jsx-768337a97aceabd1{color:red}@keyframes hahaha{from{top:0}to{top:100}}@keyframes hehehe{from{left:0}to{left:100}}@media(min-width:500px){.test.jsx-768337a97aceabd1{color:red}}.test.jsx-768337a97aceabd1{display:block}.inline-flex.jsx-768337a97aceabd1{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex}.flex.jsx-768337a97aceabd1{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.test.jsx-768337a97aceabd1{box-shadow:0 0 10px black,inset 0 0 5px black}.test[title=\",\"].jsx-768337a97aceabd1{display:inline-block}.test.is-status.jsx-768337a97aceabd1 .test.jsx-768337a97aceabd1{color:red}.a-selector.jsx-768337a97aceabd1:hover,.a-selector.jsx-768337a97aceabd1:focus{outline:none}@media(min-width:1px)and (max-width:768px){[class*=\"grid__col--\"].jsx-768337a97aceabd1{margin-top:12px;margin-bottom:12px}}@media(max-width:64em){.test.jsx-768337a97aceabd1{margin-bottom:1em}@supports(-moz-appearance:none)and (display:contents){.test.jsx-768337a97aceabd1{margin-bottom:2rem}}}"}</_JSXStyle>
 
   </div>
 );
diff --git a/packages/next-swc/crates/core/tests/full/example/output.js b/packages/next-swc/crates/core/tests/full/example/output.js
index ebba00c28d0bc90..e0a9c88dd80fa5b 100644
--- a/packages/next-swc/crates/core/tests/full/example/output.js
+++ b/packages/next-swc/crates/core/tests/full/example/output.js
@@ -1,9 +1,9 @@
-import a from "other";
-function b(a, b) {
+function a(a, b) {
     (null == b || b > a.length) && (b = a.length);
     for(var c = 0, d = new Array(b); c < b; c++)d[c] = a[c];
     return d;
 }
+import b from "other";
 (function(a, c) {
     return (function(a) {
         if (Array.isArray(a)) return a;
@@ -24,17 +24,17 @@ function b(a, b) {
             }
             return g;
         }
-    })(a, c) || (function(a, c) {
-        if (a) {
-            if ("string" == typeof a) return b(a, c);
-            var d = Object.prototype.toString.call(a).slice(8, -1);
-            if ("Object" === d && a.constructor && (d = a.constructor.name), "Map" === d || "Set" === d) return Array.from(d);
-            if ("Arguments" === d || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(d)) return b(a, c);
+    })(a, c) || (function(b, c) {
+        if (b) {
+            if ("string" == typeof b) return a(b, c);
+            var d = Object.prototype.toString.call(b).slice(8, -1);
+            if ("Object" === d && b.constructor && (d = b.constructor.name), "Map" === d || "Set" === d) return Array.from(d);
+            if ("Arguments" === d || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(d)) return a(b, c);
         }
     })(a, c) || (function() {
         throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     })();
-})(a, 1)[0];
+})(b, 1)[0];
 var c = function() {
     "use strict";
     !function(a, b) {
diff --git a/packages/next-swc/crates/core/tests/loader/css-hygiene-1/output.js b/packages/next-swc/crates/core/tests/loader/css-hygiene-1/output.js
index ad93e37fb91f5b6..cd1517cec174d5a 100644
--- a/packages/next-swc/crates/core/tests/loader/css-hygiene-1/output.js
+++ b/packages/next-swc/crates/core/tests/loader/css-hygiene-1/output.js
@@ -1,3 +1,3 @@
-var _defaultExport = new String("@media (max-width:870px) {th.expiration-date-cell, td.expiration-date-cell{display:none}}");
+var _defaultExport = new String("@media(max-width:870px){th.expiration-date-cell,td.expiration-date-cell{display:none}}");
 _defaultExport.__hash = "fd71bf06ba8860bb";
 export default _defaultExport;
diff --git a/packages/next-swc/crates/core/tests/loader/example/output.js b/packages/next-swc/crates/core/tests/loader/example/output.js
index 7bbcd606d5afaa2..1bb38a8e44b6ec7 100644
--- a/packages/next-swc/crates/core/tests/loader/example/output.js
+++ b/packages/next-swc/crates/core/tests/loader/example/output.js
@@ -1,4 +1,3 @@
-import other from 'other';
 function _arrayLikeToArray(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
     for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
@@ -50,6 +49,7 @@ function _unsupportedIterableToArray(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
 }
+import other from 'other';
 var _other = _slicedToArray(other, 1), foo = _other[0];
 var Foo = function Foo() {
     "use strict";
diff --git a/packages/next-swc/crates/core/tests/loader/issue-31627/output.js b/packages/next-swc/crates/core/tests/loader/issue-31627/output.js
index abdbe09ac240763..1bd450ee9fafd47 100644
--- a/packages/next-swc/crates/core/tests/loader/issue-31627/output.js
+++ b/packages/next-swc/crates/core/tests/loader/issue-31627/output.js
@@ -1,10 +1,10 @@
-import { useEffect } from 'react';
-import { select, selectAll } from 'd3-selection';
 function _classCallCheck(instance, Constructor) {
     if (!(instance instanceof Constructor)) {
         throw new TypeError("Cannot call a class as a function");
     }
 }
+import { useEffect } from 'react';
+import { select, selectAll } from 'd3-selection';
 export default function Home() {
     useEffect(function() {
         new MyClass();
diff --git a/packages/next-swc/crates/core/tests/loader/styled-components/1/output.js b/packages/next-swc/crates/core/tests/loader/styled-components/1/output.js
index 70e1bb4afc6bb2a..8e100ad666c08d1 100644
--- a/packages/next-swc/crates/core/tests/loader/styled-components/1/output.js
+++ b/packages/next-swc/crates/core/tests/loader/styled-components/1/output.js
@@ -1,4 +1,3 @@
-import styled from 'styled-components';
 function _taggedTemplateLiteral(strings, raw) {
     if (!raw) {
         raw = strings.slice(0);
@@ -18,6 +17,7 @@ function _templateObject() {
     };
     return data;
 }
+import styled from 'styled-components';
 export var foo = styled.input.withConfig({
     displayName: "input__foo",
     componentId: "sc-12c52e68-0"
diff --git a/packages/next-swc/crates/napi/Cargo.toml b/packages/next-swc/crates/napi/Cargo.toml
index f7d20e9a64051cc..493424eb23bf58a 100644
--- a/packages/next-swc/crates/napi/Cargo.toml
+++ b/packages/next-swc/crates/napi/Cargo.toml
@@ -16,12 +16,12 @@ once_cell = "1.8.0"
 serde = "1"
 serde_json = "1"
 next-swc = { version = "0.0.0", path = "../core" }
-swc = "0.121.7"
+swc = "0.126.2"
 swc_atoms = "0.2.7"
-swc_bundler = { version = "0.105.0", features = ["concurrent"] }
+swc_bundler = { version = "0.107.0", features = ["concurrent"] }
 swc_common = { version = "0.17.0", features = ["concurrent", "sourcemap"] }
 swc_ecma_loader = { version = "0.28.0", features = ["node", "lru"] }
-swc_ecmascript = { version = "0.112.6", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] }
+swc_ecmascript = { version = "0.114.2", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] }
 swc_node_base = "0.5.1"
 
 [build-dependencies]
diff --git a/packages/next-swc/crates/wasm/Cargo.toml b/packages/next-swc/crates/wasm/Cargo.toml
index c84005528842b76..b25e21bcbe0e0cb 100644
--- a/packages/next-swc/crates/wasm/Cargo.toml
+++ b/packages/next-swc/crates/wasm/Cargo.toml
@@ -16,9 +16,9 @@ path-clean = "0.1"
 serde = {version = "1", features = ["derive"]}
 serde_json = "1"
 next-swc = { version = "0.0.0", path = "../core" }
-swc = "0.121.7"
+swc = "0.126.2"
 swc_common = { version = "0.17.0", features = ["concurrent", "sourcemap"] }
-swc_ecmascript = { version = "0.112.6", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] }
+swc_ecmascript = { version = "0.114.2", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] }
 tracing = {version = "0.1.28", features = ["release_max_level_off"]}
 wasm-bindgen = {version = "0.2", features = ["serde-serialize"]}
 wasm-bindgen-futures = "0.4.8"

From 55e4fdaad14f2d3d613134da41bfda08933ac6ef Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Donny/=EA=B0=95=EB=8F=99=EC=9C=A4?= <kdy1997.dev@gmail.com>
Date: Fri, 18 Feb 2022 14:11:50 +0900
Subject: [PATCH 2/2] Update css crates

---
 packages/next-swc/Cargo.lock             | 28 ++++++++++++------------
 packages/next-swc/crates/core/Cargo.toml |  4 ++--
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/packages/next-swc/Cargo.lock b/packages/next-swc/Cargo.lock
index af269fdef7c0c6e..dd6333b29e4fb50 100644
--- a/packages/next-swc/Cargo.lock
+++ b/packages/next-swc/Cargo.lock
@@ -1711,9 +1711,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css"
-version = "0.85.0"
+version = "0.87.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d6f657d1876aa951dabce2be53af58e73f3c6fd61d17f177b647966ad9d77168"
+checksum = "9b4b570606b904949dcb186af2f32ee57a7731002d3cb72e21183edef0c1f2dc"
 dependencies = [
  "swc_css_ast",
  "swc_css_codegen",
@@ -1724,9 +1724,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_ast"
-version = "0.77.0"
+version = "0.79.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "26127ec7150da493706c0a8153cf1ad73fe1f2dd4e010e51ca783a97d4881a44"
+checksum = "00c07118ba87a4139be7d78bff15ba33438195f2eb35376157a5ca2e60cc54c4"
 dependencies = [
  "is-macro",
  "serde",
@@ -1737,9 +1737,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_codegen"
-version = "0.82.0"
+version = "0.84.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3f7181cd4048b62f2e89e5a26b38c7d2d6bb5cd9080850b8d0278f8525062688"
+checksum = "8d192566df252168bc1d0a206f0e783e30816a2c75c43ddd04b7ddd703b9d396"
 dependencies = [
  "auto_impl",
  "bitflags",
@@ -1764,9 +1764,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_parser"
-version = "0.83.0"
+version = "0.85.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "69ce9cc25996b42c50a0d2312021faf9e2d646a8c5baea6ea17ab7e928ba4bda"
+checksum = "c2550222e793736aa09d9361b43a04ca8b9467588bb73cf02ba827484c1243a4"
 dependencies = [
  "bitflags",
  "lexical",
@@ -1777,9 +1777,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_utils"
-version = "0.74.0"
+version = "0.76.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ee0b4a58cce4b02567f54c079cd7ce3a18bfb79638f81f2197079e7c35e4f749"
+checksum = "7ddab011e673ffd3b3d6dea612d113714caaeab1ec1673adb70b62f5a5727bbe"
 dependencies = [
  "swc_atoms",
  "swc_common",
@@ -1789,9 +1789,9 @@ dependencies = [
 
 [[package]]
 name = "swc_css_visit"
-version = "0.76.0"
+version = "0.78.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6d4bab1a12ffe359eca6413b09865e27c9e05c0e8d765bebd558d14df31f6e44"
+checksum = "f9489996952eb66ba087c15258c41e34f4a5466e87db90df4e54557f4f47751c"
 dependencies = [
  "swc_atoms",
  "swc_common",
@@ -2328,9 +2328,9 @@ dependencies = [
 
 [[package]]
 name = "swc_stylis"
-version = "0.81.0"
+version = "0.83.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1cf66bb3ab3e136fb0852c2577824cd19b76f3346d7c5558cfdb782b5f14f6a4"
+checksum = "07fe7e1fea389c2a95bb8a8a46937d9f10aa573def79ca270e56a43d432822d9"
 dependencies = [
  "swc_atoms",
  "swc_common",
diff --git a/packages/next-swc/crates/core/Cargo.toml b/packages/next-swc/crates/core/Cargo.toml
index 6e82e60b7a98166..063a0129010aeaf 100644
--- a/packages/next-swc/crates/core/Cargo.toml
+++ b/packages/next-swc/crates/core/Cargo.toml
@@ -19,11 +19,11 @@ styled_components = "0.14.0"
 swc = "0.126.2"
 swc_atoms = "0.2.7"
 swc_common = { version = "0.17.0", features = ["concurrent", "sourcemap"] }
-swc_css = "0.85.0"
+swc_css = "0.87.0"
 swc_ecma_loader = { version = "0.28.0", features = ["node", "lru"] }
 swc_ecmascript = { version = "0.114.2", features = ["codegen", "minifier", "optimization", "parser", "react", "transforms", "typescript", "utils", "visit"] }
 swc_node_base = "0.5.1"
-swc_stylis = "0.81.0"
+swc_stylis = "0.83.0"
 tracing = {version = "0.1.28", features = ["release_max_level_off"]}
 regex = "1.5"