feat(css): impl parse gap

Author: TtTRz

float-pigment-css/src/property.rs

@@ -55,6 +55,8 @@ property_list! (PropertyValueWithGlobal, {
     0x28 FlexBasis: LengthType as Initial default Length::Undefined, resolver = Length::resolve_em;
     0x29 JustifyItems: JustifyItemsType as Initial default JustifyItems::Stretch;
     0x2a Order: NumberType as Initial default Number::I32(0);
+    0x2b RowGap: GapType as Initial default Gap::Normal;
+    0x2c ColumnGap: GapType as Initial default Gap::Normal;
 
     // background
     0x30 BackgroundColor: ColorType as Initial default Color::Undefined;
@@ -330,6 +332,20 @@ property_value_format! (PropertyValueWithGlobal, {
         | "right" => JustifyItems::Right
     }};
     order: {{ Order = <number> -> |x: Number| Number::I32(x.to_i32()); }};
+    <gap_repr: Gap>:
+        "normal" => Gap::Normal
+        | <non_negative_length> -> |length| Gap::Length(length);
+    ;
+    column_gap: {{ ColumnGap = <gap_repr> }};
+    row_gap: {{ RowGap = <gap_repr> }};
+    gap: {{ (RowGap, ColumnGap)
+        = [ <gap_repr> <gap_repr>? ] -> |(row_gap, column_gap): (Gap, Option<Gap>)| {
+            if let Some(column_gap) = column_gap {
+                return (row_gap, column_gap);
+            }
+            return (row_gap.clone(), row_gap);
+        };
+    }};
     flex_grow: {{ FlexGrow = <number> }};
     flex_shrink: {{ FlexShrink = <number> }};
     flex_basis: {{ FlexBasis = <length> }};

float-pigment-css/src/typing.rs

@@ -1785,3 +1785,14 @@ pub struct FeatureTag {
     /// The optional number value in `font-feature-settings`.
     pub value: Number,
 }
+
+#[allow(missing_docs)]
+#[repr(C)]
+#[property_value_type(PropertyValueWithGlobal for GapType)]
+#[derive(Clone, Debug, PartialEq, Serialize, Deserialize, ResolveFontSize)]
+#[cfg_attr(debug_assertions, derive(CompatibilityEnumCheck))]
+pub enum Gap {
+    Normal,
+    #[resolve_font_size(Length::resolve_em_and_ratio)]
+    Length(Length),
+}

float-pigment-css/src/typing_stringify.rs

@@ -2327,3 +2327,12 @@ impl fmt::Display for FontFeatureSettings {
         write!(f, "{}", ret.join(","))
     }
 }
+
+impl fmt::Display for Gap {
+    fn fmt(&self, f: &mut fmt::Formatter<'_>) -> fmt::Result {
+        match self {
+            Gap::Normal => write!(f, "normal"),
+            Gap::Length(length) => write!(f, "{}", length),
+        }
+    }
+}

float-pigment-css/tests/property.rs

@@ -2058,6 +2058,42 @@ mod flex {
         test_parse_property!(order, "order", "1", Number::I32(1));
         test_parse_property!(order, "order", "-100", Number::I32(-100));
     }
+    // 0x2b
+    #[test]
+    fn row_gap() {
+        test_parse_property!(row_gap, "row-gap", "normal", Gap::Normal);
+        test_parse_property!(row_gap, "row-gap", "10px", Gap::Length(Length::Px(10.)));
+    }
+
+    // 0x2c
+    #[test]
+    fn column_gap() {
+        test_parse_property!(column_gap, "column-gap", "normal", Gap::Normal);
+        test_parse_property!(column_gap, "column-gap", "-10%", Gap::Normal);
+    }
+
+    #[test]
+    fn gap() {
+        test_parse_property!(row_gap, "gap", "normal", Gap::Normal);
+        test_parse_property!(column_gap, "gap", "normal", Gap::Normal);
+
+        test_parse_property!(row_gap, "gap", "30px", Gap::Length(Length::Px(30.)));
+        test_parse_property!(column_gap, "gap", "20px", Gap::Length(Length::Px(20.)));
+
+        test_parse_property!(row_gap, "gap", "normal 10px", Gap::Normal);
+        test_parse_property!(row_gap, "gap", "10px normal", Gap::Length(Length::Px(10.)));
+        test_parse_property!(
+            column_gap,
+            "gap",
+            "normal 10px",
+            Gap::Length(Length::Px(10.))
+        );
+        test_parse_property!(column_gap, "gap", "10px normal", Gap::Normal);
+
+        test_parse_property!(row_gap, "gap", "30px 40px", Gap::Length(Length::Px(30.)));
+        test_parse_property!(column_gap, "gap", "30px 40px", Gap::Length(Length::Px(40.)));
+    }
+
     #[test]
     fn flex_flow() {
         let mut ssg = StyleSheetGroup::new();