Skip to content

Commit e7bb155

Browse files
authored
Merge pull request #214 from dev-five-git/optimize-dynamic-value
Optimize dynamic value
2 parents 13f18af + 4e4bcf1 commit e7bb155

File tree

9 files changed

+207
-1
lines changed

9 files changed

+207
-1
lines changed

.changeset/four-glasses-tickle.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@devup-ui/wasm": patch
3+
---
4+
5+
Apply optimize_value to dynamic value, remove semicolon on optimize_value

libs/css/src/lib.rs

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -375,6 +375,22 @@ pub fn optimize_value(value: &str) -> String {
375375
if ret.contains("0") {
376376
ret = ZERO_RE.replace_all(&ret, "${1}0").to_string();
377377
}
378+
// remove ; from dynamic value
379+
for str_symbol in ["", "`", "\"", "'"] {
380+
if ret.ends_with(&format!(";{}", str_symbol)) {
381+
ret = format!(
382+
"{}{}",
383+
ret[..ret.len() - str_symbol.len() - 1].trim_end_matches(';'),
384+
str_symbol
385+
);
386+
} else if ret.ends_with(&format!(";{})", str_symbol)) {
387+
ret = format!(
388+
"{}{})",
389+
ret[..ret.len() - str_symbol.len() - 2].trim_end_matches(';'),
390+
str_symbol
391+
);
392+
}
393+
}
378394
ret
379395
}
380396

@@ -534,12 +550,24 @@ mod tests {
534550
assert_eq!(optimize_value("-0vw -0vw"), "0 0");
535551
assert_eq!(optimize_value("scale(0px)"), "scale(0)");
536552
assert_eq!(optimize_value("scale(-0px)"), "scale(0)");
553+
assert_eq!(optimize_value("scale(-0px);"), "scale(0)");
554+
assert_eq!(optimize_value("red;"), "red");
537555
assert_eq!(optimize_value("translate(0px)"), "translate(0)");
538556
assert_eq!(optimize_value("translate(-0px,0px)"), "translate(0,0)");
539557
assert_eq!(optimize_value("translate(-0px, 0px)"), "translate(0,0)");
540558
assert_eq!(optimize_value("translate(0px, 0px)"), "translate(0,0)");
541559
assert_eq!(optimize_value("translate(0px, 0px)"), "translate(0,0)");
542560
assert_eq!(optimize_value("translate(10px, 0px)"), "translate(10px,0)");
561+
assert_eq!(optimize_value("\"red\""), "\"red\"");
562+
assert_eq!(optimize_value("'red'"), "'red'");
563+
assert_eq!(optimize_value("`red`"), "`red`");
564+
assert_eq!(optimize_value("\"red;\""), "\"red\"");
565+
assert_eq!(optimize_value("'red;'"), "'red'");
566+
assert_eq!(optimize_value("`red;`"), "`red`");
567+
assert_eq!(optimize_value("(\"red;\")"), "(\"red\")");
568+
assert_eq!(optimize_value("(`red;`)"), "(`red`)");
569+
assert_eq!(optimize_value("('red;')"), "('red')");
570+
assert_eq!(optimize_value("('red') + 'blue;'"), "('red') + 'blue'");
543571
assert_eq!(
544572
optimize_value("translateX(0px) translateY(0px)"),
545573
"translateX(0) translateY(0)"
@@ -578,6 +606,10 @@ mod tests {
578606
sheet_to_classname("background", 0, Some("red"), None, None),
579607
sheet_to_classname(" background ", 0, Some(" red "), None, None),
580608
);
609+
assert_eq!(
610+
sheet_to_classname("background", 0, Some("red"), None, None),
611+
sheet_to_classname(" background ", 0, Some("red;"), None, None),
612+
);
581613
assert_eq!(
582614
sheet_to_classname("background", 0, Some("rgba(255, 0, 0, 0.5)"), None, None),
583615
sheet_to_classname("background", 0, Some("rgba(255,0,0,0.5)"), None, None),

libs/extractor/src/extract_style/mod.rs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -158,7 +158,7 @@ impl ExtractDynamicStyle {
158158
Self {
159159
property: short_to_long(property),
160160
level,
161-
identifier: identifier.to_string(),
161+
identifier: optimize_value(identifier),
162162
selector,
163163
style_order: None,
164164
}

libs/extractor/src/lib.rs

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -735,6 +735,85 @@ mod tests {
735735
));
736736
}
737737

738+
#[test]
739+
#[serial]
740+
fn remove_semicolon() {
741+
reset_class_map();
742+
assert_debug_snapshot!(ToBTreeSet::from(
743+
extract(
744+
"test.tsx",
745+
r#"import { Box } from "@devup-ui/core";
746+
<Box bg="red;" />
747+
"#,
748+
ExtractOption {
749+
package: "@devup-ui/core".to_string(),
750+
css_file: None
751+
}
752+
)
753+
.unwrap()
754+
));
755+
756+
reset_class_map();
757+
assert_debug_snapshot!(ToBTreeSet::from(
758+
extract(
759+
"test.tsx",
760+
r#"import { Box } from "@devup-ui/core";
761+
<Box bg="blue;;" />
762+
"#,
763+
ExtractOption {
764+
package: "@devup-ui/core".to_string(),
765+
css_file: None
766+
}
767+
)
768+
.unwrap()
769+
));
770+
771+
reset_class_map();
772+
assert_debug_snapshot!(ToBTreeSet::from(
773+
extract(
774+
"test.tsx",
775+
r#"import { Box } from "@devup-ui/core";
776+
<Box bg={`${"green;"}`} />
777+
"#,
778+
ExtractOption {
779+
package: "@devup-ui/core".to_string(),
780+
css_file: None
781+
}
782+
)
783+
.unwrap()
784+
));
785+
786+
reset_class_map();
787+
assert_debug_snapshot!(ToBTreeSet::from(
788+
extract(
789+
"test.tsx",
790+
r#"import { Box } from "@devup-ui/core";
791+
<Box bg={`${color};`} />
792+
"#,
793+
ExtractOption {
794+
package: "@devup-ui/core".to_string(),
795+
css_file: None
796+
}
797+
)
798+
.unwrap()
799+
));
800+
801+
reset_class_map();
802+
assert_debug_snapshot!(ToBTreeSet::from(
803+
extract(
804+
"test.tsx",
805+
r#"import { Box } from "@devup-ui/core";
806+
<Box bg={`${color}` + ";"} />
807+
"#,
808+
ExtractOption {
809+
package: "@devup-ui/core".to_string(),
810+
css_file: None
811+
}
812+
)
813+
.unwrap()
814+
));
815+
}
816+
738817
#[test]
739818
#[serial]
740819
fn extract_dynamic_responsive_style_props() {
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
source: libs/extractor/src/lib.rs
3+
expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import { Box } from \"@devup-ui/core\";\n<Box bg=\"blue;;\" />\n\"#, ExtractOption\n{ package: \"@devup-ui/core\".to_string(), css_file: None }).unwrap())"
4+
---
5+
ToBTreeSet {
6+
styles: {
7+
Static(
8+
ExtractStaticStyle {
9+
property: "background",
10+
value: "blue",
11+
level: 0,
12+
selector: None,
13+
style_order: None,
14+
},
15+
),
16+
},
17+
code: "import \"@devup-ui/core/devup-ui.css\";\n<div className=\"d0\" />;\n",
18+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
source: libs/extractor/src/lib.rs
3+
expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import { Box } from \"@devup-ui/core\";\n<Box bg={`${\"green;\"}`} />\n\"#,\nExtractOption\n{ package: \"@devup-ui/core\".to_string(), css_file: None }).unwrap())"
4+
---
5+
ToBTreeSet {
6+
styles: {
7+
Static(
8+
ExtractStaticStyle {
9+
property: "background",
10+
value: "green",
11+
level: 0,
12+
selector: None,
13+
style_order: None,
14+
},
15+
),
16+
},
17+
code: "import \"@devup-ui/core/devup-ui.css\";\n<div className=\"d0\" />;\n",
18+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
source: libs/extractor/src/lib.rs
3+
expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import { Box } from \"@devup-ui/core\";\n<Box bg={`${color};`} />\n\"#,\nExtractOption\n{ package: \"@devup-ui/core\".to_string(), css_file: None }).unwrap())"
4+
---
5+
ToBTreeSet {
6+
styles: {
7+
Dynamic(
8+
ExtractDynamicStyle {
9+
property: "background",
10+
level: 0,
11+
identifier: "`${color}`",
12+
selector: None,
13+
style_order: None,
14+
},
15+
),
16+
},
17+
code: "import \"@devup-ui/core/devup-ui.css\";\n<div className=\"d0\" style={{ \"--d1\": `${color}` }} />;\n",
18+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
source: libs/extractor/src/lib.rs
3+
expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import { Box } from \"@devup-ui/core\";\n<Box bg={`${color}` + \";\"} />\n\"#,\nExtractOption\n{ package: \"@devup-ui/core\".to_string(), css_file: None }).unwrap())"
4+
---
5+
ToBTreeSet {
6+
styles: {
7+
Dynamic(
8+
ExtractDynamicStyle {
9+
property: "background",
10+
level: 0,
11+
identifier: "`${color}` + \"\"",
12+
selector: None,
13+
style_order: None,
14+
},
15+
),
16+
},
17+
code: "import \"@devup-ui/core/devup-ui.css\";\n<div className=\"d0\" style={{ \"--d1\": `${color}` + \"\" }} />;\n",
18+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
---
2+
source: libs/extractor/src/lib.rs
3+
expression: "ToBTreeSet::from(extract(\"test.tsx\",\nr#\"import { Box } from \"@devup-ui/core\";\n<Box bg=\"red;\" />\n\"#, ExtractOption\n{ package: \"@devup-ui/core\".to_string(), css_file: None }).unwrap())"
4+
---
5+
ToBTreeSet {
6+
styles: {
7+
Static(
8+
ExtractStaticStyle {
9+
property: "background",
10+
value: "red",
11+
level: 0,
12+
selector: None,
13+
style_order: None,
14+
},
15+
),
16+
},
17+
code: "import \"@devup-ui/core/devup-ui.css\";\n<div className=\"d0\" />;\n",
18+
}

0 commit comments

Comments
 (0)