mirror of
https://github.com/RGBCube/serenity
synced 2025-07-24 15:47:42 +00:00
LibWeb: Parse grid-template-areas
CSS property
This commit is contained in:
parent
0448547553
commit
a6548c4d80
10 changed files with 101 additions and 0 deletions
|
@ -73,6 +73,7 @@ public:
|
||||||
static CSS::Size column_gap() { return CSS::Size::make_auto(); }
|
static CSS::Size column_gap() { return CSS::Size::make_auto(); }
|
||||||
static CSS::Size row_gap() { return CSS::Size::make_auto(); }
|
static CSS::Size row_gap() { return CSS::Size::make_auto(); }
|
||||||
static CSS::BorderCollapse border_collapse() { return CSS::BorderCollapse::Separate; }
|
static CSS::BorderCollapse border_collapse() { return CSS::BorderCollapse::Separate; }
|
||||||
|
static Vector<Vector<String>> grid_template_areas() { return {}; }
|
||||||
};
|
};
|
||||||
|
|
||||||
struct BackgroundLayerData {
|
struct BackgroundLayerData {
|
||||||
|
@ -194,6 +195,7 @@ public:
|
||||||
CSS::Size const& column_gap() const { return m_noninherited.column_gap; }
|
CSS::Size const& column_gap() const { return m_noninherited.column_gap; }
|
||||||
CSS::Size const& row_gap() const { return m_noninherited.row_gap; }
|
CSS::Size const& row_gap() const { return m_noninherited.row_gap; }
|
||||||
CSS::BorderCollapse border_collapse() const { return m_noninherited.border_collapse; }
|
CSS::BorderCollapse border_collapse() const { return m_noninherited.border_collapse; }
|
||||||
|
Vector<Vector<String>> const& grid_template_areas() const { return m_noninherited.grid_template_areas; }
|
||||||
|
|
||||||
CSS::LengthBox const& inset() const { return m_noninherited.inset; }
|
CSS::LengthBox const& inset() const { return m_noninherited.inset; }
|
||||||
const CSS::LengthBox& margin() const { return m_noninherited.margin; }
|
const CSS::LengthBox& margin() const { return m_noninherited.margin; }
|
||||||
|
@ -319,6 +321,7 @@ protected:
|
||||||
CSS::Size column_gap { InitialValues::column_gap() };
|
CSS::Size column_gap { InitialValues::column_gap() };
|
||||||
CSS::Size row_gap { InitialValues::row_gap() };
|
CSS::Size row_gap { InitialValues::row_gap() };
|
||||||
CSS::BorderCollapse border_collapse { InitialValues::border_collapse() };
|
CSS::BorderCollapse border_collapse { InitialValues::border_collapse() };
|
||||||
|
Vector<Vector<String>> grid_template_areas { InitialValues::grid_template_areas() };
|
||||||
} m_noninherited;
|
} m_noninherited;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -400,6 +403,7 @@ public:
|
||||||
void set_column_gap(CSS::Size const& column_gap) { m_noninherited.column_gap = column_gap; }
|
void set_column_gap(CSS::Size const& column_gap) { m_noninherited.column_gap = column_gap; }
|
||||||
void set_row_gap(CSS::Size const& row_gap) { m_noninherited.row_gap = row_gap; }
|
void set_row_gap(CSS::Size const& row_gap) { m_noninherited.row_gap = row_gap; }
|
||||||
void set_border_collapse(CSS::BorderCollapse const& border_collapse) { m_noninherited.border_collapse = border_collapse; }
|
void set_border_collapse(CSS::BorderCollapse const& border_collapse) { m_noninherited.border_collapse = border_collapse; }
|
||||||
|
void set_grid_template_areas(Vector<Vector<String>> const& grid_template_areas) { m_noninherited.grid_template_areas = grid_template_areas; }
|
||||||
|
|
||||||
void set_fill(Color value) { m_inherited.fill = value; }
|
void set_fill(Color value) { m_inherited.fill = value; }
|
||||||
void set_stroke(Color value) { m_inherited.stroke = value; }
|
void set_stroke(Color value) { m_inherited.stroke = value; }
|
||||||
|
|
|
@ -6292,6 +6292,22 @@ RefPtr<StyleValue> Parser::parse_grid_track_placement_shorthand_value(Vector<Com
|
||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
RefPtr<StyleValue> Parser::parse_grid_template_areas_value(Vector<ComponentValue> const& component_values)
|
||||||
|
{
|
||||||
|
Vector<Vector<String>> grid_area_rows;
|
||||||
|
for (auto& component_value : component_values) {
|
||||||
|
Vector<String> grid_area_columns;
|
||||||
|
if (component_value.is(Token::Type::String)) {
|
||||||
|
auto const parts = String::from_utf8(component_value.token().string()).release_value_but_fixme_should_propagate_errors().split(' ').release_value_but_fixme_should_propagate_errors();
|
||||||
|
for (auto& part : parts) {
|
||||||
|
grid_area_columns.append(part);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
grid_area_rows.append(move(grid_area_columns));
|
||||||
|
}
|
||||||
|
return GridTemplateAreaStyleValue::create(grid_area_rows);
|
||||||
|
}
|
||||||
|
|
||||||
Parser::ParseErrorOr<NonnullRefPtr<StyleValue>> Parser::parse_css_value(PropertyID property_id, TokenStream<ComponentValue>& tokens)
|
Parser::ParseErrorOr<NonnullRefPtr<StyleValue>> Parser::parse_css_value(PropertyID property_id, TokenStream<ComponentValue>& tokens)
|
||||||
{
|
{
|
||||||
auto function_contains_var_or_attr = [](Function const& function, auto&& recurse) -> bool {
|
auto function_contains_var_or_attr = [](Function const& function, auto&& recurse) -> bool {
|
||||||
|
@ -6430,6 +6446,10 @@ Parser::ParseErrorOr<NonnullRefPtr<StyleValue>> Parser::parse_css_value(Property
|
||||||
if (auto parsed_value = parse_grid_track_placement_shorthand_value(component_values))
|
if (auto parsed_value = parse_grid_track_placement_shorthand_value(component_values))
|
||||||
return parsed_value.release_nonnull();
|
return parsed_value.release_nonnull();
|
||||||
return ParseError::SyntaxError;
|
return ParseError::SyntaxError;
|
||||||
|
case PropertyID::GridTemplateAreas:
|
||||||
|
if (auto parsed_value = parse_grid_template_areas_value(component_values))
|
||||||
|
return parsed_value.release_nonnull();
|
||||||
|
return ParseError::SyntaxError;
|
||||||
case PropertyID::GridColumnEnd:
|
case PropertyID::GridColumnEnd:
|
||||||
if (auto parsed_value = parse_grid_track_placement(component_values))
|
if (auto parsed_value = parse_grid_track_placement(component_values))
|
||||||
return parsed_value.release_nonnull();
|
return parsed_value.release_nonnull();
|
||||||
|
|
|
@ -315,6 +315,7 @@ private:
|
||||||
RefPtr<StyleValue> parse_grid_track_sizes(Vector<ComponentValue> const&);
|
RefPtr<StyleValue> parse_grid_track_sizes(Vector<ComponentValue> const&);
|
||||||
RefPtr<StyleValue> parse_grid_track_placement(Vector<ComponentValue> const&);
|
RefPtr<StyleValue> parse_grid_track_placement(Vector<ComponentValue> const&);
|
||||||
RefPtr<StyleValue> parse_grid_track_placement_shorthand_value(Vector<ComponentValue> const&);
|
RefPtr<StyleValue> parse_grid_track_placement_shorthand_value(Vector<ComponentValue> const&);
|
||||||
|
RefPtr<StyleValue> parse_grid_template_areas_value(Vector<ComponentValue> const&);
|
||||||
|
|
||||||
// calc() parsing, according to https://www.w3.org/TR/css-values-3/#calc-syntax
|
// calc() parsing, according to https://www.w3.org/TR/css-values-3/#calc-syntax
|
||||||
OwnPtr<CalculatedStyleValue::CalcSum> parse_calc_sum(TokenStream<ComponentValue>&);
|
OwnPtr<CalculatedStyleValue::CalcSum> parse_calc_sum(TokenStream<ComponentValue>&);
|
||||||
|
|
|
@ -855,6 +855,16 @@
|
||||||
"string"
|
"string"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
"grid-template-areas": {
|
||||||
|
"inherited": false,
|
||||||
|
"initial": "auto",
|
||||||
|
"valid-identifiers": [
|
||||||
|
"auto"
|
||||||
|
],
|
||||||
|
"valid-types": [
|
||||||
|
"string"
|
||||||
|
]
|
||||||
|
},
|
||||||
"grid-template-columns": {
|
"grid-template-columns": {
|
||||||
"inherited": false,
|
"inherited": false,
|
||||||
"initial": "auto",
|
"initial": "auto",
|
||||||
|
|
|
@ -745,4 +745,10 @@ Optional<CSS::BorderCollapse> StyleProperties::border_collapse() const
|
||||||
return value_id_to_border_collapse(value->to_identifier());
|
return value_id_to_border_collapse(value->to_identifier());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Vector<Vector<String>> StyleProperties::grid_template_areas() const
|
||||||
|
{
|
||||||
|
auto value = property(CSS::PropertyID::GridTemplateAreas);
|
||||||
|
return value->as_grid_template_area().grid_template_area();
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -91,6 +91,7 @@ public:
|
||||||
CSS::GridTrackPlacement grid_row_end() const;
|
CSS::GridTrackPlacement grid_row_end() const;
|
||||||
CSS::GridTrackPlacement grid_row_start() const;
|
CSS::GridTrackPlacement grid_row_start() const;
|
||||||
Optional<CSS::BorderCollapse> border_collapse() const;
|
Optional<CSS::BorderCollapse> border_collapse() const;
|
||||||
|
Vector<Vector<String>> grid_template_areas() const;
|
||||||
|
|
||||||
Vector<CSS::Transformation> transformations() const;
|
Vector<CSS::Transformation> transformations() const;
|
||||||
CSS::TransformOrigin transform_origin() const;
|
CSS::TransformOrigin transform_origin() const;
|
||||||
|
|
|
@ -140,6 +140,12 @@ GridTrackPlacementShorthandStyleValue const& StyleValue::as_grid_track_placement
|
||||||
return static_cast<GridTrackPlacementShorthandStyleValue const&>(*this);
|
return static_cast<GridTrackPlacementShorthandStyleValue const&>(*this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
GridTemplateAreaStyleValue const& StyleValue::as_grid_template_area() const
|
||||||
|
{
|
||||||
|
VERIFY(is_grid_template_area());
|
||||||
|
return static_cast<GridTemplateAreaStyleValue const&>(*this);
|
||||||
|
}
|
||||||
|
|
||||||
GridTrackPlacementStyleValue const& StyleValue::as_grid_track_placement() const
|
GridTrackPlacementStyleValue const& StyleValue::as_grid_track_placement() const
|
||||||
{
|
{
|
||||||
VERIFY(is_grid_track_placement());
|
VERIFY(is_grid_track_placement());
|
||||||
|
@ -1434,6 +1440,29 @@ bool GridTrackPlacementStyleValue::equals(StyleValue const& other) const
|
||||||
return m_grid_track_placement == typed_other.grid_track_placement();
|
return m_grid_track_placement == typed_other.grid_track_placement();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ErrorOr<String> GridTemplateAreaStyleValue::to_string() const
|
||||||
|
{
|
||||||
|
StringBuilder builder;
|
||||||
|
for (size_t y = 0; y < m_grid_template_area.size(); ++y) {
|
||||||
|
for (size_t x = 0; x < m_grid_template_area[y].size(); ++x) {
|
||||||
|
builder.appendff("{}", m_grid_template_area[y][x]);
|
||||||
|
if (x < m_grid_template_area[y].size() - 1)
|
||||||
|
builder.append(" "sv);
|
||||||
|
}
|
||||||
|
if (y < m_grid_template_area.size() - 1)
|
||||||
|
builder.append(", "sv);
|
||||||
|
}
|
||||||
|
return builder.to_string();
|
||||||
|
}
|
||||||
|
|
||||||
|
bool GridTemplateAreaStyleValue::equals(StyleValue const& other) const
|
||||||
|
{
|
||||||
|
if (type() != other.type())
|
||||||
|
return false;
|
||||||
|
auto const& typed_other = other.as_grid_template_area();
|
||||||
|
return m_grid_template_area == typed_other.grid_template_area();
|
||||||
|
}
|
||||||
|
|
||||||
ErrorOr<String> GridTrackSizeStyleValue::to_string() const
|
ErrorOr<String> GridTrackSizeStyleValue::to_string() const
|
||||||
{
|
{
|
||||||
return m_grid_track_size_list.to_string();
|
return m_grid_track_size_list.to_string();
|
||||||
|
@ -2528,6 +2557,11 @@ NonnullRefPtr<ColorStyleValue> ColorStyleValue::create(Color color)
|
||||||
return adopt_ref(*new ColorStyleValue(color));
|
return adopt_ref(*new ColorStyleValue(color));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
NonnullRefPtr<GridTemplateAreaStyleValue> GridTemplateAreaStyleValue::create(Vector<Vector<String>> grid_template_area)
|
||||||
|
{
|
||||||
|
return adopt_ref(*new GridTemplateAreaStyleValue(grid_template_area));
|
||||||
|
}
|
||||||
|
|
||||||
NonnullRefPtr<GridTrackPlacementStyleValue> GridTrackPlacementStyleValue::create(CSS::GridTrackPlacement grid_track_placement)
|
NonnullRefPtr<GridTrackPlacementStyleValue> GridTrackPlacementStyleValue::create(CSS::GridTrackPlacement grid_track_placement)
|
||||||
{
|
{
|
||||||
return adopt_ref(*new GridTrackPlacementStyleValue(grid_track_placement));
|
return adopt_ref(*new GridTrackPlacementStyleValue(grid_track_placement));
|
||||||
|
|
|
@ -228,6 +228,7 @@ public:
|
||||||
FlexFlow,
|
FlexFlow,
|
||||||
Font,
|
Font,
|
||||||
Frequency,
|
Frequency,
|
||||||
|
GridTemplateArea,
|
||||||
GridTrackPlacement,
|
GridTrackPlacement,
|
||||||
GridTrackPlacementShorthand,
|
GridTrackPlacementShorthand,
|
||||||
GridTrackSizeList,
|
GridTrackSizeList,
|
||||||
|
@ -275,6 +276,7 @@ public:
|
||||||
bool is_flex_flow() const { return type() == Type::FlexFlow; }
|
bool is_flex_flow() const { return type() == Type::FlexFlow; }
|
||||||
bool is_font() const { return type() == Type::Font; }
|
bool is_font() const { return type() == Type::Font; }
|
||||||
bool is_frequency() const { return type() == Type::Frequency; }
|
bool is_frequency() const { return type() == Type::Frequency; }
|
||||||
|
bool is_grid_template_area() const { return type() == Type::GridTemplateArea; }
|
||||||
bool is_grid_track_placement() const { return type() == Type::GridTrackPlacement; }
|
bool is_grid_track_placement() const { return type() == Type::GridTrackPlacement; }
|
||||||
bool is_grid_track_placement_shorthand() const { return type() == Type::GridTrackPlacementShorthand; }
|
bool is_grid_track_placement_shorthand() const { return type() == Type::GridTrackPlacementShorthand; }
|
||||||
bool is_grid_track_size_list() const { return type() == Type::GridTrackSizeList; }
|
bool is_grid_track_size_list() const { return type() == Type::GridTrackSizeList; }
|
||||||
|
@ -320,6 +322,7 @@ public:
|
||||||
FlexStyleValue const& as_flex() const;
|
FlexStyleValue const& as_flex() const;
|
||||||
FontStyleValue const& as_font() const;
|
FontStyleValue const& as_font() const;
|
||||||
FrequencyStyleValue const& as_frequency() const;
|
FrequencyStyleValue const& as_frequency() const;
|
||||||
|
GridTemplateAreaStyleValue const& as_grid_template_area() const;
|
||||||
GridTrackPlacementShorthandStyleValue const& as_grid_track_placement_shorthand() const;
|
GridTrackPlacementShorthandStyleValue const& as_grid_track_placement_shorthand() const;
|
||||||
GridTrackPlacementStyleValue const& as_grid_track_placement() const;
|
GridTrackPlacementStyleValue const& as_grid_track_placement() const;
|
||||||
GridTrackSizeStyleValue const& as_grid_track_size_list() const;
|
GridTrackSizeStyleValue const& as_grid_track_size_list() const;
|
||||||
|
@ -363,6 +366,7 @@ public:
|
||||||
FlexStyleValue& as_flex() { return const_cast<FlexStyleValue&>(const_cast<StyleValue const&>(*this).as_flex()); }
|
FlexStyleValue& as_flex() { return const_cast<FlexStyleValue&>(const_cast<StyleValue const&>(*this).as_flex()); }
|
||||||
FontStyleValue& as_font() { return const_cast<FontStyleValue&>(const_cast<StyleValue const&>(*this).as_font()); }
|
FontStyleValue& as_font() { return const_cast<FontStyleValue&>(const_cast<StyleValue const&>(*this).as_font()); }
|
||||||
FrequencyStyleValue& as_frequency() { return const_cast<FrequencyStyleValue&>(const_cast<StyleValue const&>(*this).as_frequency()); }
|
FrequencyStyleValue& as_frequency() { return const_cast<FrequencyStyleValue&>(const_cast<StyleValue const&>(*this).as_frequency()); }
|
||||||
|
GridTemplateAreaStyleValue& as_grid_template_area() { return const_cast<GridTemplateAreaStyleValue&>(const_cast<StyleValue const&>(*this).as_grid_template_area()); }
|
||||||
GridTrackPlacementShorthandStyleValue& as_grid_track_placement_shorthand() { return const_cast<GridTrackPlacementShorthandStyleValue&>(const_cast<StyleValue const&>(*this).as_grid_track_placement_shorthand()); }
|
GridTrackPlacementShorthandStyleValue& as_grid_track_placement_shorthand() { return const_cast<GridTrackPlacementShorthandStyleValue&>(const_cast<StyleValue const&>(*this).as_grid_track_placement_shorthand()); }
|
||||||
GridTrackPlacementStyleValue& as_grid_track_placement() { return const_cast<GridTrackPlacementStyleValue&>(const_cast<StyleValue const&>(*this).as_grid_track_placement()); }
|
GridTrackPlacementStyleValue& as_grid_track_placement() { return const_cast<GridTrackPlacementStyleValue&>(const_cast<StyleValue const&>(*this).as_grid_track_placement()); }
|
||||||
GridTrackSizeStyleValue& as_grid_track_size_list() { return const_cast<GridTrackSizeStyleValue&>(const_cast<StyleValue const&>(*this).as_grid_track_size_list()); }
|
GridTrackSizeStyleValue& as_grid_track_size_list() { return const_cast<GridTrackSizeStyleValue&>(const_cast<StyleValue const&>(*this).as_grid_track_size_list()); }
|
||||||
|
@ -1052,6 +1056,25 @@ private:
|
||||||
Frequency m_frequency;
|
Frequency m_frequency;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
class GridTemplateAreaStyleValue final : public StyleValue {
|
||||||
|
public:
|
||||||
|
static NonnullRefPtr<GridTemplateAreaStyleValue> create(Vector<Vector<String>> grid_template_area);
|
||||||
|
virtual ~GridTemplateAreaStyleValue() override = default;
|
||||||
|
|
||||||
|
Vector<Vector<String>> const& grid_template_area() const { return m_grid_template_area; }
|
||||||
|
virtual ErrorOr<String> to_string() const override;
|
||||||
|
virtual bool equals(StyleValue const& other) const override;
|
||||||
|
|
||||||
|
private:
|
||||||
|
explicit GridTemplateAreaStyleValue(Vector<Vector<String>> grid_template_area)
|
||||||
|
: StyleValue(Type::GridTemplateArea)
|
||||||
|
, m_grid_template_area(grid_template_area)
|
||||||
|
{
|
||||||
|
}
|
||||||
|
|
||||||
|
Vector<Vector<String>> m_grid_template_area;
|
||||||
|
};
|
||||||
|
|
||||||
class GridTrackPlacementStyleValue final : public StyleValue {
|
class GridTrackPlacementStyleValue final : public StyleValue {
|
||||||
public:
|
public:
|
||||||
static NonnullRefPtr<GridTrackPlacementStyleValue> create(CSS::GridTrackPlacement grid_track_placement);
|
static NonnullRefPtr<GridTrackPlacementStyleValue> create(CSS::GridTrackPlacement grid_track_placement);
|
||||||
|
|
|
@ -65,6 +65,7 @@ class FrequencyStyleValue;
|
||||||
class GridMinMax;
|
class GridMinMax;
|
||||||
class GridRepeat;
|
class GridRepeat;
|
||||||
class GridSize;
|
class GridSize;
|
||||||
|
class GridTemplateAreaStyleValue;
|
||||||
class GridTrackPlacement;
|
class GridTrackPlacement;
|
||||||
class GridTrackPlacementShorthandStyleValue;
|
class GridTrackPlacementShorthandStyleValue;
|
||||||
class GridTrackPlacementStyleValue;
|
class GridTrackPlacementStyleValue;
|
||||||
|
|
|
@ -592,6 +592,7 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style)
|
||||||
computed_values.set_grid_column_start(computed_style.grid_column_start());
|
computed_values.set_grid_column_start(computed_style.grid_column_start());
|
||||||
computed_values.set_grid_row_end(computed_style.grid_row_end());
|
computed_values.set_grid_row_end(computed_style.grid_row_end());
|
||||||
computed_values.set_grid_row_start(computed_style.grid_row_start());
|
computed_values.set_grid_row_start(computed_style.grid_row_start());
|
||||||
|
computed_values.set_grid_template_areas(computed_style.grid_template_areas());
|
||||||
|
|
||||||
if (auto fill = computed_style.property(CSS::PropertyID::Fill); fill->has_color())
|
if (auto fill = computed_style.property(CSS::PropertyID::Fill); fill->has_color())
|
||||||
computed_values.set_fill(fill->to_color(*this));
|
computed_values.set_fill(fill->to_color(*this));
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue