swc-project/swc
1
1
Fork 0
mirror of https://github.com/swc-project/swc.git synced 2024-12-29 16:42:28 +03:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

feat(css/modules): Support :local and :global (#6045)

Browse Source 
**Description:**

This PR adds support for `:local` and `:global` directives.
This commit is contained in:
Donny/강동윤 2022-10-05 16:33:40 +09:00 committed by GitHub
parent 5618702554
commit 10d0f8e001
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 30 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
crates/swc_css_modules/src/lib.rs
View File

@ -84,6 +84,8 @@ struct Data {
renamed_to_orig: FxHashMap<JsWord, JsWord>, renamed_to_orig: FxHashMap<JsWord, JsWord>,
orig_to_renamed: FxHashMap<JsWord, JsWord>, orig_to_renamed: FxHashMap<JsWord, JsWord>,
is_global_mode: bool,
} }
impl<C> VisitMut for Compiler<C> impl<C> VisitMut for Compiler<C>
@ -258,6 +260,8 @@ where
let mut new_children = Vec::with_capacity(n.children.len()); let mut new_children = Vec::with_capacity(n.children.len());
let old_is_global_mode = self.data.is_global_mode;
self.data.is_global_mode = false;
'complex: for mut n in n.children.take() { 'complex: for mut n in n.children.take() {
match &mut n { match &mut n {
ComplexSelectorChildren::CompoundSelector(sel) => { ComplexSelectorChildren::CompoundSelector(sel) => {
@ -266,13 +270,15 @@ where
for sel in &mut sel.subclass_selectors { for sel in &mut sel.subclass_selectors {
match sel { match sel {
SubclassSelector::Class(..) | SubclassSelector::Id(..) => { SubclassSelector::Class(..) | SubclassSelector::Id(..) => {
process_local( if !self.data.is_global_mode {
&mut self.config, process_local(
&mut self.result, &mut self.config,
&mut self.data.orig_to_renamed, &mut self.result,
&mut self.data.renamed_to_orig, &mut self.data.orig_to_renamed,
sel, &mut self.data.renamed_to_orig,
); sel,
);
}
} }
SubclassSelector::PseudoClass(class_sel) => { SubclassSelector::PseudoClass(class_sel) => {
match &*class_sel.name.value { match &*class_sel.name.value {
@ -292,7 +298,9 @@ where
sel.visit_mut_with(self); sel.visit_mut_with(self);
new_children.extend(sel.children); new_children.extend(sel.children);
continue 'complex;
} else {
self.data.is_global_mode = false;
continue 'complex; continue 'complex;
} }
} }
@ -311,6 +319,9 @@ where
new_children.extend(sel.children); new_children.extend(sel.children);
continue 'complex;
} else {
self.data.is_global_mode = true;
continue 'complex; continue 'complex;
} }
} }
@ -331,6 +342,7 @@ where
} }
n.children = new_children; n.children = new_children;
self.data.is_global_mode = old_is_global_mode;
} }
fn visit_mut_complex_selectors(&mut self, n: &mut Vec<ComplexSelector>) { fn visit_mut_complex_selectors(&mut self, n: &mut Vec<ComplexSelector>) {

2
crates/swc_css_modules/tests/fixture/modules/tests-cases/leak-scope/source.compiled.css
View File

@ -33,7 +33,7 @@
left: 20px; left: 20px;
} }
} }
:global .__local__d1 { .d1 {
animation: __local__d1; animation: __local__d1;
animation: __local__d2, __local__d3, __local__d4; animation: __local__d2, __local__d3, __local__d4;
} }

2
crates/swc_css_modules/tests/fixture/modules/tests-cases/local/source.compiled.css
View File

@ -1,6 +1,6 @@
.__local__abc .__local__def { .__local__abc .__local__def {
color: red; color: red;
} }
:local .__local__ghi .__local__jkl { .__local__ghi .__local__jkl {
color: blue; color: blue;
} }

4
crates/swc_css_modules/tests/fixture/modules/tests-cases/mode-switching/source.compiled.css
View File

@ -1,5 +1,5 @@
.__local__c1 :local .__local__c2 .__local__c3 :global .__local__c4 :local .__local__c5, .__local__c1 .__local__c2 .__local__c3 .c4 .__local__c5,
.__local__c6 :local .__local__c7 { .__local__c6 .__local__c7 {
background: red; background: red;
} }
.__local__c8 { .__local__c8 {

18
crates/swc_css_modules/tests/fixture/modules/tests-cases/mode-switching/source.transform.json
View File

@ -1,10 +1,4 @@
{ {
"c4": [
{
"type": "local",
"name": "__local__c4"
}
],
"c5": [ "c5": [
{ {
"type": "local", "type": "local",
@ -23,6 +17,12 @@
"name": "__local__c7" "name": "__local__c7"
} }
], ],
"c8": [
{
"type": "local",
"name": "__local__c8"
}
],
"c1": [ "c1": [
{ {
"type": "local", "type": "local",
@ -40,11 +40,5 @@
"type": "local", "type": "local",
"name": "__local__c3" "name": "__local__c3"
} }
],
"c8": [
{
"type": "local",
"name": "__local__c8"
}
] ]
} }