fix(css/modules): aggregate class names when composes is chained.

crates/swc_css_modules/src/lib.rs

@@ -218,7 +218,27 @@ where
                                     .cloned();
 
                                 if let Some(key) = key {
-                                    self.result.renamed.entry(key).or_default().extend(composes);
+                                    let mut renamed = self.result.renamed.clone();
+                                    let class_names = self.result.renamed.entry(key).or_default();
+
+                                    class_names.extend(composes.clone());
+
+                                    for composed_class_name in composes.clone().iter() {
+                                        if let CssClassName::Local { name } = composed_class_name {
+                                            if let Some(original_class_name) =
+                                                self.data.renamed_to_orig.get(&name.value).cloned()
+                                            {
+                                                class_names.extend(
+                                                    renamed
+                                                        .entry(original_class_name.clone())
+                                                        .or_default()
+                                                        .split_at(1)
+                                                        .1
+                                                        .to_vec(),
+                                                );
+                                            }
+                                        }
+                                    }
                                 }
                             }
                         }

crates/swc_css_modules/tests/fixture/modules/issue-7737/issue-7737.compiled.css

@@ -0,0 +1,3 @@
+.__local__chain2 {}
+.__local__chain1 {}
+.__local__root-class {}

crates/swc_css_modules/tests/fixture/modules/issue-7737/issue-7737.css

@@ -0,0 +1,16 @@
+.chain2 {
+    composes: e from global;
+    composes: f from "./f.css";
+}
+
+.chain1 {
+    composes: chain2;
+    composes: c from global;
+    composes: d from "./d.css";
+}
+
+.root-class {
+    composes: chain1;
+    composes: a from global;
+    composes: b from "./b.css";
+}

crates/swc_css_modules/tests/fixture/modules/issue-7737/issue-7737.imports.json

@@ -0,0 +1,5 @@
+[
+  "./b.css",
+  "./d.css",
+  "./f.css"
+]

crates/swc_css_modules/tests/fixture/modules/issue-7737/issue-7737.transform.json

@@ -0,0 +1,86 @@
+{
+  "chain2": [
+    {
+      "type": "local",
+      "name": "__local__chain2"
+    },
+    {
+      "type": "global",
+      "name": "e"
+    },
+    {
+      "type": "import",
+      "name": "f",
+      "from": "./f.css"
+    }
+  ],
+  "chain1": [
+    {
+      "type": "local",
+      "name": "__local__chain1"
+    },
+    {
+      "type": "local",
+      "name": "__local__chain2"
+    },
+    {
+      "type": "global",
+      "name": "c"
+    },
+    {
+      "type": "import",
+      "name": "d",
+      "from": "./d.css"
+    },
+    {
+      "type": "global",
+      "name": "e"
+    },
+    {
+      "type": "import",
+      "name": "f",
+      "from": "./f.css"
+    }
+  ],
+  "root-class": [
+    {
+      "type": "local",
+      "name": "__local__root-class"
+    },
+    {
+      "type": "local",
+      "name": "__local__chain1"
+    },
+    {
+      "type": "global",
+      "name": "a"
+    },
+    {
+      "type": "import",
+      "name": "b",
+      "from": "./b.css"
+    },
+    {
+      "type": "local",
+      "name": "__local__chain2"
+    },
+    {
+      "type": "global",
+      "name": "c"
+    },
+    {
+      "type": "import",
+      "name": "d",
+      "from": "./d.css"
+    },
+    {
+      "type": "global",
+      "name": "e"
+    },
+    {
+      "type": "import",
+      "name": "f",
+      "from": "./f.css"
+    }
+  ]
+}

crates/swc_css_modules/tests/fixture/modules/tests-cases/composes-1/source.transform.json

@@ -18,6 +18,11 @@
     {
       "type": "local",
       "name": "__local__c1"
+    },
+    {
+      "type": "import",
+      "name": "c2",
+      "from": "./file.css"
     }
   ],
   "c5": [

crates/swc_css_modules/tests/fixture/modules/tests-cases/composes-2/source.transform.json

@@ -18,6 +18,11 @@
     {
       "type": "local",
       "name": "__local__c1"
+    },
+    {
+      "type": "import",
+      "name": "c-2",
+      "from": "./file.css"
     }
   ],
   "c5": [