Skip to content

Commit 5c39eb4

Browse files
heiazuheiazu
committed
feat: 支持calc，支持大小写px
1 parent a382df4 commit 5c39eb4

File tree

8 files changed

+97
-16
lines changed

8 files changed

+97
-16
lines changed

‎Cargo.lock‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Cargo.toml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ selectors = "0.25.0"
2121
smallvec = "1.11.0"
2222
style = "0.1.0"
2323
pcre2 = "0.2.6"
24+
regex = "1.10.3"
2425
swc_core = "0.90.11"
2526
swc_common = {version = "0.33.0", features = ["tty-emitter", "sourcemap"]}
2627
swc_ecma_ast = {version = "0.110.0"}

‎__test__/fixure/pesudo.jsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,10 @@ import './pesudo.scss'
33

44
export default function Pesudo() {
55

6-
return <View className='pesudo'>
6+
return <View className='pesudo' style={{
7+
height: '10px',
8+
width: Math.random() > 0.5 ? '10px' : '20px'
9+
}}>
710
<Text className='text'>asdasdasdasdasd</Text>
811
</View>
912
}

‎src/style_propetries/flex_basis.rs‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ use lightningcss::{
44
traits::ToCss
55
};
66

7-
use crate::{generate_expr_lit_str, generate_dimension_percentage};
7+
use crate::{generate_dimension_percentage, generate_expr_lit_calc, generate_expr_lit_str};
88

99
use super::{traits::ToExpr, unit::{generate_expr_by_length_value, Platform, PropertyTuple}};
1010

@@ -26,7 +26,7 @@ impl ToExpr for FlexBasis {
2626
PropertyTuple::One(
2727
self.id.to_string(),
2828
match &self.value {
29-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
29+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::Harmony),
3030
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::Harmony),
3131
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
3232
}
@@ -37,7 +37,7 @@ impl ToExpr for FlexBasis {
3737
PropertyTuple::One(
3838
self.id.to_string(),
3939
match &self.value {
40-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
40+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::Harmony),
4141
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::ReactNative),
4242
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
4343
}

‎src/style_propetries/font_size.rs‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ use lightningcss::{
33
values::{length::LengthValue, percentage::Percentage}, traits::ToCss,
44
};
55

6-
use crate::{generate_expr_lit_str, generate_dimension_percentage, generate_invalid_expr};
6+
use crate::{generate_dimension_percentage, generate_expr_lit_calc, generate_expr_lit_str, generate_invalid_expr};
77

88
use super::{traits::ToExpr, unit::{generate_expr_by_length_value, Platform, PropertyTuple}};
99

@@ -27,7 +27,7 @@ impl ToExpr for FontSize {
2727
PropertyTuple::One(
2828
self.id.to_string(),
2929
match &self.value {
30-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
30+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::Harmony),
3131
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::Harmony),
3232
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
3333
EnumValue::Invalid => generate_invalid_expr!(),
@@ -39,7 +39,7 @@ impl ToExpr for FontSize {
3939
PropertyTuple::One(
4040
self.id.to_string(),
4141
match &self.value {
42-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
42+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::ReactNative),
4343
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::ReactNative),
4444
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
4545
EnumValue::Invalid => generate_invalid_expr!(),

‎src/style_propetries/length_value.rs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
use lightningcss::traits::ToCss;
22

3-
use crate::{generate_expr_lit_str, generate_length_value_property, generate_dimension_percentage, generate_invalid_expr};
3+
use crate::{generate_expr_lit_str, generate_length_value_property, generate_invalid_expr};
44
use super::unit::PropertyTuple;
55
use super::{traits::ToExpr, unit::{generate_expr_by_length_value, Platform}};
66

‎src/style_propetries/macros.rs‎

Lines changed: 61 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,48 @@ macro_rules! generate_expr_lit_num {
1919
};
2020
}
2121

22+
23+
#[macro_export]
24+
macro_rules! generate_expr_lit_calc {
25+
($var:expr, $platform:expr) => {{
26+
27+
use $crate::constants::{CONVERT_STYLE_PX_FN, RN_CONVERT_STYLE_PX_FN, RN_CONVERT_STYLE_VU_FN};
28+
29+
let re = regex::Regex::new(r#"(\d+(?:px|vw|vh))"#).unwrap();
30+
let result = re.replace_all($var.as_str(), |caps: &regex::Captures| {
31+
let value = &caps[1];
32+
let unit = &value[value.len() - 2..];
33+
let parsed_value: i32 = value[..value.len() - 2].parse().unwrap();
34+
if $platform == Platform::Harmony {
35+
if unit == "px" {
36+
return format!("${{{}({}, 'px')}}", CONVERT_STYLE_PX_FN, parsed_value);
37+
} else {
38+
return format!("${{{}({}, '{}')}}", CONVERT_STYLE_PX_FN, parsed_value, unit);
39+
}
40+
} else {
41+
if unit == "px" {
42+
return format!("${{{}({}, 'px')}}", RN_CONVERT_STYLE_PX_FN, parsed_value);
43+
} else {
44+
return format!("${{{}({}, '{}')}}", RN_CONVERT_STYLE_VU_FN, parsed_value, unit);
45+
}
46+
}
47+
});
48+
49+
swc_ecma_ast::Expr::Tpl(swc_ecma_ast::Tpl {
50+
span: swc_common::DUMMY_SP,
51+
exprs: vec![],
52+
quasis: vec![
53+
swc_ecma_ast::TplElement {
54+
span: swc_common::DUMMY_SP,
55+
tail: false,
56+
cooked: None,
57+
raw: swc_atoms::Atom::from(result).into(),
58+
}
59+
],
60+
})
61+
}};
62+
}
63+
2264
#[macro_export]
2365
macro_rules! generate_expr_ident {
2466
($var:expr) => {
@@ -45,10 +87,14 @@ macro_rules! generate_string_by_css_color {
4587
macro_rules! generate_expr_by_length {
4688
($var:expr, $platform:expr) => {{
4789
use $crate::style_propetries::unit::{Platform, generate_expr_by_length_value};
90+
use $crate::generate_expr_lit_calc;
4891
use lightningcss::values::length::Length;
4992
match $var {
5093
Length::Value(val) => generate_expr_by_length_value(&val, $platform),
51-
Length::Calc(val) => generate_expr_lit_str!(*val.to_css_string(lightningcss::stylesheet::PrinterOptions::default()).unwrap()),
94+
Length::Calc(val) => {
95+
let calc_string = val.to_css_string(lightningcss::stylesheet::PrinterOptions::default()).unwrap();
96+
generate_expr_lit_calc!(calc_string, $platform)
97+
},
5298
}
5399
}};
54100
}
@@ -70,13 +116,16 @@ macro_rules! generate_expr_by_length_percentage_or_auto {
70116
#[macro_export]
71117
macro_rules! generate_expr_by_length_percentage {
72118
($var:expr, $platform:expr) => {{
73-
use $crate::{generate_expr_lit_str, style_propetries::unit::{generate_expr_by_length_value} };
119+
use $crate::{generate_expr_lit_str, generate_expr_lit_calc, style_propetries::unit::{generate_expr_by_length_value} };
74120
use lightningcss::traits::ToCss;
75121

76122
match $var {
77123
lightningcss::values::percentage::DimensionPercentage::Dimension(dimension) => generate_expr_by_length_value(&dimension, $platform),
78124
lightningcss::values::percentage::DimensionPercentage::Percentage(percentage) => generate_expr_lit_str!((percentage.0 * 100.0).to_string() + "%"),
79-
lightningcss::values::percentage::DimensionPercentage::Calc(calc) => generate_expr_lit_str!(calc.to_css_string(lightningcss::stylesheet::PrinterOptions::default()).unwrap()),
125+
lightningcss::values::percentage::DimensionPercentage::Calc(calc) => {
126+
let calc_string = calc.to_css_string(lightningcss::stylesheet::PrinterOptions::default()).unwrap();
127+
generate_expr_lit_calc!(calc_string, $platform)
128+
},
80129
}
81130
}};
82131
}
@@ -237,6 +286,9 @@ macro_rules! generate_number_property {
237286
#[macro_export]
238287
macro_rules! generate_length_value_property {
239288
($class:ident, $( $property_name:ident ), *) => {
289+
290+
use $crate::{generate_dimension_percentage, generate_expr_lit_calc};
291+
240292
#[derive(Debug, Clone)]
241293
pub struct $class {
242294
pub id: String,
@@ -256,7 +308,7 @@ macro_rules! generate_length_value_property {
256308
PropertyTuple::One(
257309
self.id.clone(),
258310
match &self.value {
259-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
311+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::Harmony),
260312
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::Harmony),
261313
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
262314
EnumValue::Auto => generate_invalid_expr!() // harmony 是个非法制，固不会生效
@@ -268,7 +320,7 @@ macro_rules! generate_length_value_property {
268320
PropertyTuple::One(
269321
self.id.clone(),
270322
match &self.value {
271-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
323+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::ReactNative),
272324
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::ReactNative),
273325
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
274326
EnumValue::Auto => generate_expr_lit_str!("auto")
@@ -309,6 +361,8 @@ macro_rules! generate_length_value_property {
309361
macro_rules! generate_size_property {
310362
($class:ident, $( $property_name:ident ), *) => {
311363

364+
use $crate::generate_expr_lit_calc;
365+
312366
#[derive(Debug, Clone)]
313367
pub struct $class {
314368
pub id: String,
@@ -328,7 +382,7 @@ macro_rules! generate_size_property {
328382
PropertyTuple::One(
329383
self.id.clone(),
330384
match &self.value {
331-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
385+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::Harmony),
332386
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::Harmony),
333387
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
334388
EnumValue::Auto => generate_expr_lit_str!("auto") // harmony 是个非法制，固不会生效
@@ -340,7 +394,7 @@ macro_rules! generate_size_property {
340394
PropertyTuple::One(
341395
self.id.clone(),
342396
match &self.value {
343-
EnumValue::String(value) => generate_expr_lit_str!(value.to_owned()),
397+
EnumValue::String(value) => generate_expr_lit_calc!(value, Platform::ReactNative),
344398
EnumValue::LengthValue(length_value) => generate_expr_by_length_value(length_value, Platform::ReactNative),
345399
EnumValue::Percentage(value) => generate_expr_lit_str!((value.0 * 100.0).to_string() + "%"),
346400
EnumValue::Auto => generate_expr_lit_str!("auto")

‎src/style_propetries/unit.rs‎

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,20 @@ pub fn generate_expr_by_length_value(length_value: &LengthValue, platform: Platf
101101
}
102102
}
103103
},
104+
LengthValue::Ch(num) => {
105+
match platform {
106+
Platform::ReactNative => {
107+
handler = Some(RN_CONVERT_STYLE_VU_FN.to_string());
108+
args.push(generate_expr_lit_num!(*num as f64));
109+
args.push(generate_expr_lit_str!("PX"));
110+
},
111+
Platform::Harmony => {
112+
handler = Some(CONVERT_STYLE_PX_FN.to_string());
113+
args.push(generate_expr_lit_num!(*num as f64));
114+
args.push(generate_expr_lit_str!("PX"));
115+
}
116+
}
117+
}
104118
_ => {}
105119
}
106120

@@ -125,7 +139,7 @@ pub fn generate_expr_by_length_value(length_value: &LengthValue, platform: Platf
125139

126140
pub fn generate_expr_with_css_input(input: String, platform: Platform) -> Expr {
127141
// 定义匹配 '16px' 的正则表达式
128-
let re = Regex::new(r"(-?(?P<num>\d+(\.\d*)?|\.\d+))(?P<unit>(px)|(vw)|(vh))").unwrap();
142+
let re = Regex::new(r"(-?(?P<num>\d+(\.\d*)?|\.\d+))(?P<unit>(px)|(vw)|(vh)|(pX)|(PX)|(Px))").unwrap();
129143
let bytes = input.as_bytes();
130144
// 使用正则表达式进行匹配
131145
if let Ok(caps) = re.captures(bytes) {
@@ -165,6 +179,14 @@ pub fn generate_expr_with_css_input(input: String, platform: Platform) -> Expr {
165179
};
166180
args.push(generate_expr_lit_num!(number * 16.0));
167181
},
182+
"pX" | "PX" | "Px" => {
183+
handler = match platform {
184+
Platform::ReactNative => Some(RN_CONVERT_STYLE_VU_FN.to_string()),
185+
Platform::Harmony => Some(CONVERT_STYLE_PX_FN.to_string())
186+
};
187+
args.push(generate_expr_lit_num!(number));
188+
args.push(generate_expr_lit_str!("PX"));
189+
}
168190
_ => {}
169191
}
170192

0 commit comments

Comments
 (0)