GridFormattingContext.cpp 105 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989
  1. /*
  2. * Copyright (c) 2022, Martin Falisse <mfalisse@outlook.com>
  3. *
  4. * SPDX-License-Identifier: BSD-2-Clause
  5. */
  6. #include <LibWeb/DOM/Node.h>
  7. #include <LibWeb/Layout/Box.h>
  8. #include <LibWeb/Layout/GridFormattingContext.h>
  9. namespace Web::Layout {
  10. GridFormattingContext::GridFormattingContext(LayoutState& state, BlockContainer const& block_container, FormattingContext* parent)
  11. : BlockFormattingContext(state, block_container, parent)
  12. {
  13. }
  14. GridFormattingContext::~GridFormattingContext() = default;
  15. CSSPixels GridFormattingContext::resolve_definite_track_size(CSS::GridSize const& grid_size, AvailableSpace const& available_space, Box const& box)
  16. {
  17. VERIFY(grid_size.is_definite());
  18. switch (grid_size.type()) {
  19. case CSS::GridSize::Type::Length:
  20. if (grid_size.length().is_auto())
  21. break;
  22. return grid_size.length().to_px(box);
  23. case CSS::GridSize::Type::Percentage:
  24. if (available_space.width.is_definite())
  25. return grid_size.percentage().as_fraction() * available_space.width.to_px().value();
  26. break;
  27. default:
  28. VERIFY_NOT_REACHED();
  29. }
  30. return 0;
  31. }
  32. size_t GridFormattingContext::count_of_gap_columns()
  33. {
  34. size_t count = 0;
  35. for (auto& grid_column : m_grid_columns) {
  36. if (grid_column.is_gap)
  37. count++;
  38. }
  39. return count;
  40. }
  41. size_t GridFormattingContext::count_of_gap_rows()
  42. {
  43. size_t count = 0;
  44. for (auto& grid_row : m_grid_rows) {
  45. if (grid_row.is_gap)
  46. count++;
  47. }
  48. return count;
  49. }
  50. CSSPixels GridFormattingContext::resolve_size(CSS::Size const& size, AvailableSize const& available_size, Box const& box)
  51. {
  52. if (size.is_length() && size.length().is_calculated()) {
  53. if (size.length().calculated_style_value()->contains_percentage()) {
  54. if (!available_size.is_definite())
  55. return 0;
  56. auto& calc_value = *size.length().calculated_style_value();
  57. return calc_value.resolve_length_percentage(box, CSS::Length::make_px(available_size.to_px())).value_or(CSS::Length::make_auto()).to_px(box);
  58. }
  59. return size.length().to_px(box);
  60. }
  61. if (size.is_length()) {
  62. return size.length().to_px(box);
  63. }
  64. if (size.is_percentage()) {
  65. if (!available_size.is_definite())
  66. return 0;
  67. return available_size.to_px() * size.percentage().as_fraction();
  68. }
  69. return 0;
  70. }
  71. int GridFormattingContext::get_count_of_tracks(Vector<CSS::ExplicitGridTrack> const& track_list, AvailableSpace const& available_space, Box const& box)
  72. {
  73. auto track_count = 0;
  74. for (auto const& explicit_grid_track : track_list) {
  75. if (explicit_grid_track.is_repeat() && explicit_grid_track.repeat().is_default())
  76. track_count += explicit_grid_track.repeat().repeat_count() * explicit_grid_track.repeat().grid_track_size_list().track_list().size();
  77. else
  78. track_count += 1;
  79. }
  80. if (track_list.size() == 1
  81. && track_list.first().is_repeat()
  82. && (track_list.first().repeat().is_auto_fill() || track_list.first().repeat().is_auto_fit())) {
  83. track_count = count_of_repeated_auto_fill_or_fit_tracks(track_list, available_space, box);
  84. }
  85. return track_count;
  86. }
  87. int GridFormattingContext::count_of_repeated_auto_fill_or_fit_tracks(Vector<CSS::ExplicitGridTrack> const& track_list, AvailableSpace const& available_space, Box const& box)
  88. {
  89. // https://www.w3.org/TR/css-grid-2/#auto-repeat
  90. // 7.2.3.2. Repeat-to-fill: auto-fill and auto-fit repetitions
  91. // On a subgridded axis, the auto-fill keyword is only valid once per <line-name-list>, and repeats
  92. // enough times for the name list to match the subgrid’s specified grid span (falling back to 0 if
  93. // the span is already fulfilled).
  94. // Otherwise on a standalone axis, when auto-fill is given as the repetition number
  95. // If the grid container has a definite size or max size in the relevant axis, then the number of
  96. // repetitions is the largest possible positive integer that does not cause the grid to overflow the
  97. // content box of its grid container
  98. CSSPixels sum_of_grid_track_sizes = 0;
  99. // (treating each track as its max track sizing function if that is definite or its minimum track sizing
  100. // function otherwise, flooring the max track sizing function by the min track sizing function if both
  101. // are definite, and taking gap into account)
  102. // FIXME: take gap into account
  103. for (auto& explicit_grid_track : track_list.first().repeat().grid_track_size_list().track_list()) {
  104. auto track_sizing_function = explicit_grid_track;
  105. if (track_sizing_function.is_minmax()) {
  106. if (track_sizing_function.minmax().max_grid_size().is_definite() && !track_sizing_function.minmax().min_grid_size().is_definite())
  107. sum_of_grid_track_sizes += resolve_definite_track_size(track_sizing_function.minmax().max_grid_size(), available_space, box);
  108. else if (track_sizing_function.minmax().min_grid_size().is_definite() && !track_sizing_function.minmax().max_grid_size().is_definite())
  109. sum_of_grid_track_sizes += resolve_definite_track_size(track_sizing_function.minmax().min_grid_size(), available_space, box);
  110. else if (track_sizing_function.minmax().min_grid_size().is_definite() && track_sizing_function.minmax().max_grid_size().is_definite())
  111. sum_of_grid_track_sizes += min(resolve_definite_track_size(track_sizing_function.minmax().min_grid_size(), available_space, box), resolve_definite_track_size(track_sizing_function.minmax().max_grid_size(), available_space, box));
  112. } else {
  113. sum_of_grid_track_sizes += min(resolve_definite_track_size(track_sizing_function.grid_size(), available_space, box), resolve_definite_track_size(track_sizing_function.grid_size(), available_space, box));
  114. }
  115. }
  116. return max(1, static_cast<int>((get_free_space_x(available_space) / sum_of_grid_track_sizes).value()));
  117. // For the purpose of finding the number of auto-repeated tracks in a standalone axis, the UA must
  118. // floor the track size to a UA-specified value to avoid division by zero. It is suggested that this
  119. // floor be 1px.
  120. }
  121. void GridFormattingContext::place_item_with_row_and_column_position(Box const& box, Box const& child_box)
  122. {
  123. int row_start = child_box.computed_values().grid_row_start().raw_value() - 1;
  124. int row_end = child_box.computed_values().grid_row_end().raw_value() - 1;
  125. int column_start = child_box.computed_values().grid_column_start().raw_value() - 1;
  126. int column_end = child_box.computed_values().grid_column_end().raw_value() - 1;
  127. // https://www.w3.org/TR/css-grid-2/#line-placement
  128. // 8.3. Line-based Placement: the grid-row-start, grid-column-start, grid-row-end, and grid-column-end properties
  129. // https://www.w3.org/TR/css-grid-2/#grid-placement-slot
  130. // First attempt to match the grid area’s edge to a named grid area: if there is a grid line whose
  131. // line name is <custom-ident>-start (for grid-*-start) / <custom-ident>-end (for grid-*-end),
  132. // contributes the first such line to the grid item’s placement.
  133. // Otherwise, treat this as if the integer 1 had been specified along with the <custom-ident>.
  134. // https://www.w3.org/TR/css-grid-2/#grid-placement-int
  135. // Contributes the Nth grid line to the grid item’s placement. If a negative integer is given, it
  136. // instead counts in reverse, starting from the end edge of the explicit grid.
  137. if (row_end < 0)
  138. row_end = m_occupation_grid.row_count() + row_end + 2;
  139. if (column_end < 0)
  140. column_end = m_occupation_grid.column_count() + column_end + 2;
  141. // If a name is given as a <custom-ident>, only lines with that name are counted. If not enough
  142. // lines with that name exist, all implicit grid lines are assumed to have that name for the purpose
  143. // of finding this position.
  144. // https://www.w3.org/TR/css-grid-2/#grid-placement-span-int
  145. // Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid
  146. // item’s grid area is N lines from its opposite edge in the corresponding direction. For example,
  147. // grid-column-end: span 2 indicates the second grid line in the endward direction from the
  148. // grid-column-start line.
  149. int row_span = 1;
  150. int column_span = 1;
  151. if (child_box.computed_values().grid_row_start().is_position() && child_box.computed_values().grid_row_end().is_span())
  152. row_span = child_box.computed_values().grid_row_end().raw_value();
  153. if (child_box.computed_values().grid_column_start().is_position() && child_box.computed_values().grid_column_end().is_span())
  154. column_span = child_box.computed_values().grid_column_end().raw_value();
  155. if (child_box.computed_values().grid_row_end().is_position() && child_box.computed_values().grid_row_start().is_span()) {
  156. row_span = child_box.computed_values().grid_row_start().raw_value();
  157. row_start = row_end - row_span;
  158. }
  159. if (child_box.computed_values().grid_column_end().is_position() && child_box.computed_values().grid_column_start().is_span()) {
  160. column_span = child_box.computed_values().grid_column_start().raw_value();
  161. column_start = column_end - column_span;
  162. }
  163. // If a name is given as a <custom-ident>, only lines with that name are counted. If not enough
  164. // lines with that name exist, all implicit grid lines on the side of the explicit grid
  165. // corresponding to the search direction are assumed to have that name for the purpose of counting
  166. // this span.
  167. // https://drafts.csswg.org/css-grid/#grid-placement-auto
  168. // auto
  169. // The property contributes nothing to the grid item’s placement, indicating auto-placement or a
  170. // default span of one. (See § 8 Placing Grid Items, above.)
  171. // https://www.w3.org/TR/css-grid-2/#common-uses-named-lines
  172. // 8.1.3. Named Lines and Spans
  173. // Instead of counting lines by number, lines can be referenced by their line name:
  174. if (child_box.computed_values().grid_column_start().has_line_name()) {
  175. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_column_start().line_name(), box.computed_values().grid_template_columns());
  176. if (found_flag_and_index > -1)
  177. column_start = found_flag_and_index;
  178. else
  179. column_start = 0;
  180. }
  181. if (child_box.computed_values().grid_column_end().has_line_name()) {
  182. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_column_end().line_name(), box.computed_values().grid_template_columns());
  183. if (found_flag_and_index > -1) {
  184. column_end = found_flag_and_index;
  185. if (!child_box.computed_values().grid_column_start().is_position())
  186. column_start = column_end - column_span;
  187. } else {
  188. column_end = 1;
  189. column_start = 0;
  190. }
  191. }
  192. if (child_box.computed_values().grid_row_start().has_line_name()) {
  193. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_row_start().line_name(), box.computed_values().grid_template_rows());
  194. if (found_flag_and_index > -1)
  195. row_start = found_flag_and_index;
  196. else
  197. row_start = 0;
  198. }
  199. if (child_box.computed_values().grid_row_end().has_line_name()) {
  200. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_row_end().line_name(), box.computed_values().grid_template_rows());
  201. if (found_flag_and_index > -1) {
  202. row_end = found_flag_and_index;
  203. if (!child_box.computed_values().grid_row_start().is_position())
  204. row_start = row_end - row_span;
  205. } else {
  206. row_end = 1;
  207. row_start = 0;
  208. }
  209. }
  210. // If there are multiple lines of the same name, they effectively establish a named set of grid
  211. // lines, which can be exclusively indexed by filtering the placement by name:
  212. // https://drafts.csswg.org/css-grid/#grid-placement-errors
  213. // 8.3.1. Grid Placement Conflict Handling
  214. // If the placement for a grid item contains two lines, and the start line is further end-ward than
  215. // the end line, swap the two lines. If the start line is equal to the end line, remove the end
  216. // line.
  217. if (child_box.computed_values().grid_row_start().is_position() && child_box.computed_values().grid_row_end().is_position()) {
  218. if (row_start > row_end)
  219. swap(row_start, row_end);
  220. if (row_start != row_end)
  221. row_span = row_end - row_start;
  222. }
  223. if (child_box.computed_values().grid_column_start().is_position() && child_box.computed_values().grid_column_end().is_position()) {
  224. if (column_start > column_end)
  225. swap(column_start, column_end);
  226. if (column_start != column_end)
  227. column_span = column_end - column_start;
  228. }
  229. // If the placement contains two spans, remove the one contributed by the end grid-placement
  230. // property.
  231. if (child_box.computed_values().grid_row_start().is_span() && child_box.computed_values().grid_row_end().is_span())
  232. row_span = child_box.computed_values().grid_row_start().raw_value();
  233. if (child_box.computed_values().grid_column_start().is_span() && child_box.computed_values().grid_column_end().is_span())
  234. column_span = child_box.computed_values().grid_column_start().raw_value();
  235. // FIXME: If the placement contains only a span for a named line, replace it with a span of 1.
  236. m_positioned_boxes.append({ child_box, row_start, row_span, column_start, column_span });
  237. m_occupation_grid.maybe_add_row(row_start + 1);
  238. m_occupation_grid.maybe_add_column(column_start + 1);
  239. m_occupation_grid.set_occupied(column_start, column_start + column_span, row_start, row_start + row_span);
  240. }
  241. void GridFormattingContext::place_item_with_row_position(Box const& box, Box const& child_box)
  242. {
  243. int row_start = child_box.computed_values().grid_row_start().raw_value() - 1;
  244. int row_end = child_box.computed_values().grid_row_end().raw_value() - 1;
  245. // https://www.w3.org/TR/css-grid-2/#line-placement
  246. // 8.3. Line-based Placement: the grid-row-start, grid-column-start, grid-row-end, and grid-column-end properties
  247. // https://www.w3.org/TR/css-grid-2/#grid-placement-slot
  248. // First attempt to match the grid area’s edge to a named grid area: if there is a grid line whose
  249. // line name is <custom-ident>-start (for grid-*-start) / <custom-ident>-end (for grid-*-end),
  250. // contributes the first such line to the grid item’s placement.
  251. // Otherwise, treat this as if the integer 1 had been specified along with the <custom-ident>.
  252. // https://www.w3.org/TR/css-grid-2/#grid-placement-int
  253. // Contributes the Nth grid line to the grid item’s placement. If a negative integer is given, it
  254. // instead counts in reverse, starting from the end edge of the explicit grid.
  255. if (row_end < 0)
  256. row_end = m_occupation_grid.row_count() + row_end + 2;
  257. // If a name is given as a <custom-ident>, only lines with that name are counted. If not enough
  258. // lines with that name exist, all implicit grid lines are assumed to have that name for the purpose
  259. // of finding this position.
  260. // https://www.w3.org/TR/css-grid-2/#grid-placement-span-int
  261. // Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid
  262. // item’s grid area is N lines from its opposite edge in the corresponding direction. For example,
  263. // grid-column-end: span 2 indicates the second grid line in the endward direction from the
  264. // grid-column-start line.
  265. int row_span = 1;
  266. if (child_box.computed_values().grid_row_start().is_position() && child_box.computed_values().grid_row_end().is_span())
  267. row_span = child_box.computed_values().grid_row_end().raw_value();
  268. if (child_box.computed_values().grid_row_end().is_position() && child_box.computed_values().grid_row_start().is_span()) {
  269. row_span = child_box.computed_values().grid_row_start().raw_value();
  270. row_start = row_end - row_span;
  271. // FIXME: Remove me once have implemented spans overflowing into negative indexes, e.g., grid-row: span 2 / 1
  272. if (row_start < 0)
  273. row_start = 0;
  274. }
  275. // If a name is given as a <custom-ident>, only lines with that name are counted. If not enough
  276. // lines with that name exist, all implicit grid lines on the side of the explicit grid
  277. // corresponding to the search direction are assumed to have that name for the purpose of counting
  278. // this span.
  279. // https://drafts.csswg.org/css-grid/#grid-placement-auto
  280. // auto
  281. // The property contributes nothing to the grid item’s placement, indicating auto-placement or a
  282. // default span of one. (See § 8 Placing Grid Items, above.)
  283. // https://www.w3.org/TR/css-grid-2/#common-uses-named-lines
  284. // 8.1.3. Named Lines and Spans
  285. // Instead of counting lines by number, lines can be referenced by their line name:
  286. if (child_box.computed_values().grid_row_start().has_line_name()) {
  287. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_row_start().line_name(), box.computed_values().grid_template_rows());
  288. if (found_flag_and_index > -1)
  289. row_start = found_flag_and_index;
  290. else
  291. row_start = 0;
  292. }
  293. if (child_box.computed_values().grid_row_end().has_line_name()) {
  294. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_row_end().line_name(), box.computed_values().grid_template_rows());
  295. if (found_flag_and_index > -1) {
  296. row_end = found_flag_and_index;
  297. if (!child_box.computed_values().grid_row_start().is_position())
  298. row_start = row_end - row_span;
  299. } else {
  300. row_start = 0;
  301. row_end = 1;
  302. }
  303. }
  304. // If there are multiple lines of the same name, they effectively establish a named set of grid
  305. // lines, which can be exclusively indexed by filtering the placement by name:
  306. // https://drafts.csswg.org/css-grid/#grid-placement-errors
  307. // 8.3.1. Grid Placement Conflict Handling
  308. // If the placement for a grid item contains two lines, and the start line is further end-ward than
  309. // the end line, swap the two lines. If the start line is equal to the end line, remove the end
  310. // line.
  311. if (child_box.computed_values().grid_row_start().is_position() && child_box.computed_values().grid_row_end().is_position()) {
  312. if (row_start > row_end)
  313. swap(row_start, row_end);
  314. if (row_start != row_end)
  315. row_span = row_end - row_start;
  316. }
  317. // FIXME: Have yet to find the spec for this.
  318. if (!child_box.computed_values().grid_row_start().is_position() && child_box.computed_values().grid_row_end().is_position() && row_end == 0)
  319. row_start = 0;
  320. // If the placement contains two spans, remove the one contributed by the end grid-placement
  321. // property.
  322. if (child_box.computed_values().grid_row_start().is_span() && child_box.computed_values().grid_row_end().is_span())
  323. row_span = child_box.computed_values().grid_row_start().raw_value();
  324. // FIXME: If the placement contains only a span for a named line, replace it with a span of 1.
  325. m_occupation_grid.maybe_add_row(row_start + row_span);
  326. int column_start = 0;
  327. auto column_span = child_box.computed_values().grid_column_start().is_span() ? child_box.computed_values().grid_column_start().raw_value() : 1;
  328. // https://drafts.csswg.org/css-grid/#auto-placement-algo
  329. // 8.5. Grid Item Placement Algorithm
  330. // 3.3. If the largest column span among all the items without a definite column position is larger
  331. // than the width of the implicit grid, add columns to the end of the implicit grid to accommodate
  332. // that column span.
  333. m_occupation_grid.maybe_add_column(column_span);
  334. bool found_available_column = false;
  335. for (int column_index = column_start; column_index < m_occupation_grid.column_count(); column_index++) {
  336. if (!m_occupation_grid.is_occupied(column_index, row_start)) {
  337. found_available_column = true;
  338. column_start = column_index;
  339. break;
  340. }
  341. }
  342. if (!found_available_column) {
  343. column_start = m_occupation_grid.column_count();
  344. m_occupation_grid.maybe_add_column(column_start + column_span);
  345. }
  346. m_occupation_grid.set_occupied(column_start, column_start + column_span, row_start, row_start + row_span);
  347. m_positioned_boxes.append({ child_box, row_start, row_span, column_start, column_span });
  348. }
  349. void GridFormattingContext::place_item_with_column_position(Box const& box, Box const& child_box, int& auto_placement_cursor_x, int& auto_placement_cursor_y)
  350. {
  351. int column_start = child_box.computed_values().grid_column_start().raw_value() - 1;
  352. int column_end = child_box.computed_values().grid_column_end().raw_value() - 1;
  353. // https://www.w3.org/TR/css-grid-2/#line-placement
  354. // 8.3. Line-based Placement: the grid-row-start, grid-column-start, grid-row-end, and grid-column-end properties
  355. // https://www.w3.org/TR/css-grid-2/#grid-placement-slot
  356. // First attempt to match the grid area’s edge to a named grid area: if there is a grid line whose
  357. // line name is <custom-ident>-start (for grid-*-start) / <custom-ident>-end (for grid-*-end),
  358. // contributes the first such line to the grid item’s placement.
  359. // Otherwise, treat this as if the integer 1 had been specified along with the <custom-ident>.
  360. // https://www.w3.org/TR/css-grid-2/#grid-placement-int
  361. // Contributes the Nth grid line to the grid item’s placement. If a negative integer is given, it
  362. // instead counts in reverse, starting from the end edge of the explicit grid.
  363. if (column_end < 0)
  364. column_end = m_occupation_grid.column_count() + column_end + 2;
  365. // If a name is given as a <custom-ident>, only lines with that name are counted. If not enough
  366. // lines with that name exist, all implicit grid lines are assumed to have that name for the purpose
  367. // of finding this position.
  368. // https://www.w3.org/TR/css-grid-2/#grid-placement-span-int
  369. // Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid
  370. // item’s grid area is N lines from its opposite edge in the corresponding direction. For example,
  371. // grid-column-end: span 2 indicates the second grid line in the endward direction from the
  372. // grid-column-start line.
  373. int column_span = 1;
  374. auto row_span = child_box.computed_values().grid_row_start().is_span() ? child_box.computed_values().grid_row_start().raw_value() : 1;
  375. if (child_box.computed_values().grid_column_start().is_position() && child_box.computed_values().grid_column_end().is_span())
  376. column_span = child_box.computed_values().grid_column_end().raw_value();
  377. if (child_box.computed_values().grid_column_end().is_position() && child_box.computed_values().grid_column_start().is_span()) {
  378. column_span = child_box.computed_values().grid_column_start().raw_value();
  379. column_start = column_end - column_span;
  380. // FIXME: Remove me once have implemented spans overflowing into negative indexes, e.g., grid-column: span 2 / 1
  381. if (column_start < 0)
  382. column_start = 0;
  383. }
  384. // FIXME: Have yet to find the spec for this.
  385. if (!child_box.computed_values().grid_column_start().is_position() && child_box.computed_values().grid_column_end().is_position() && column_end == 0)
  386. column_start = 0;
  387. // If a name is given as a <custom-ident>, only lines with that name are counted. If not enough
  388. // lines with that name exist, all implicit grid lines on the side of the explicit grid
  389. // corresponding to the search direction are assumed to have that name for the purpose of counting
  390. // this span.
  391. // https://drafts.csswg.org/css-grid/#grid-placement-auto
  392. // auto
  393. // The property contributes nothing to the grid item’s placement, indicating auto-placement or a
  394. // default span of one. (See § 8 Placing Grid Items, above.)
  395. // https://www.w3.org/TR/css-grid-2/#common-uses-named-lines
  396. // 8.1.3. Named Lines and Spans
  397. // Instead of counting lines by number, lines can be referenced by their line name:
  398. if (child_box.computed_values().grid_column_start().has_line_name()) {
  399. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_column_start().line_name(), box.computed_values().grid_template_columns());
  400. if (found_flag_and_index > -1)
  401. column_start = found_flag_and_index;
  402. else
  403. column_start = 0;
  404. }
  405. if (child_box.computed_values().grid_column_end().has_line_name()) {
  406. auto found_flag_and_index = get_line_index_by_line_name(child_box.computed_values().grid_column_end().line_name(), box.computed_values().grid_template_columns());
  407. if (found_flag_and_index > -1) {
  408. column_end = found_flag_and_index;
  409. if (!child_box.computed_values().grid_column_start().is_position())
  410. column_start = column_end - column_span;
  411. } else {
  412. column_end = 1;
  413. column_start = 0;
  414. }
  415. }
  416. // If there are multiple lines of the same name, they effectively establish a named set of grid
  417. // lines, which can be exclusively indexed by filtering the placement by name:
  418. // https://drafts.csswg.org/css-grid/#grid-placement-errors
  419. // 8.3.1. Grid Placement Conflict Handling
  420. // If the placement for a grid item contains two lines, and the start line is further end-ward than
  421. // the end line, swap the two lines. If the start line is equal to the end line, remove the end
  422. // line.
  423. if (child_box.computed_values().grid_column_start().is_position() && child_box.computed_values().grid_column_end().is_position()) {
  424. if (column_start > column_end)
  425. swap(column_start, column_end);
  426. if (column_start != column_end)
  427. column_span = column_end - column_start;
  428. }
  429. // If the placement contains two spans, remove the one contributed by the end grid-placement
  430. // property.
  431. if (child_box.computed_values().grid_column_start().is_span() && child_box.computed_values().grid_column_end().is_span())
  432. column_span = child_box.computed_values().grid_column_start().raw_value();
  433. // FIXME: If the placement contains only a span for a named line, replace it with a span of 1.
  434. // 4.1.1.1. Set the column position of the cursor to the grid item's column-start line. If this is
  435. // less than the previous column position of the cursor, increment the row position by 1.
  436. if (column_start < auto_placement_cursor_x)
  437. auto_placement_cursor_y++;
  438. auto_placement_cursor_x = column_start;
  439. m_occupation_grid.maybe_add_column(auto_placement_cursor_x + 1);
  440. m_occupation_grid.maybe_add_row(auto_placement_cursor_y + 1);
  441. // 4.1.1.2. Increment the cursor's row position until a value is found where the grid item does not
  442. // overlap any occupied grid cells (creating new rows in the implicit grid as necessary).
  443. while (true) {
  444. if (!m_occupation_grid.is_occupied(column_start, auto_placement_cursor_y)) {
  445. break;
  446. }
  447. auto_placement_cursor_y++;
  448. m_occupation_grid.maybe_add_row(auto_placement_cursor_y + row_span);
  449. }
  450. // 4.1.1.3. Set the item's row-start line to the cursor's row position, and set the item's row-end
  451. // line according to its span from that position.
  452. m_occupation_grid.set_occupied(column_start, column_start + column_span, auto_placement_cursor_y, auto_placement_cursor_y + row_span);
  453. m_positioned_boxes.append({ child_box, auto_placement_cursor_y, row_span, column_start, column_span });
  454. }
  455. void GridFormattingContext::place_item_with_no_declared_position(Box const& child_box, int& auto_placement_cursor_x, int& auto_placement_cursor_y)
  456. {
  457. // 4.1.2.1. Increment the column position of the auto-placement cursor until either this item's grid
  458. // area does not overlap any occupied grid cells, or the cursor's column position, plus the item's
  459. // column span, overflow the number of columns in the implicit grid, as determined earlier in this
  460. // algorithm.
  461. auto column_start = 0;
  462. auto column_span = 1;
  463. if (child_box.computed_values().grid_column_start().is_span())
  464. column_span = child_box.computed_values().grid_column_start().raw_value();
  465. else if (child_box.computed_values().grid_column_end().is_span())
  466. column_span = child_box.computed_values().grid_column_end().raw_value();
  467. // https://drafts.csswg.org/css-grid/#auto-placement-algo
  468. // 8.5. Grid Item Placement Algorithm
  469. // 3.3. If the largest column span among all the items without a definite column position is larger
  470. // than the width of the implicit grid, add columns to the end of the implicit grid to accommodate
  471. // that column span.
  472. m_occupation_grid.maybe_add_column(column_span);
  473. auto row_start = 0;
  474. auto row_span = 1;
  475. if (child_box.computed_values().grid_row_start().is_span())
  476. row_span = child_box.computed_values().grid_row_start().raw_value();
  477. else if (child_box.computed_values().grid_row_end().is_span())
  478. row_span = child_box.computed_values().grid_row_end().raw_value();
  479. auto found_unoccupied_area = false;
  480. for (int row_index = auto_placement_cursor_y; row_index < m_occupation_grid.row_count(); row_index++) {
  481. for (int column_index = auto_placement_cursor_x; column_index < m_occupation_grid.column_count(); column_index++) {
  482. if (column_span + column_index <= m_occupation_grid.column_count()) {
  483. auto found_all_available = true;
  484. for (int span_index = 0; span_index < column_span; span_index++) {
  485. if (m_occupation_grid.is_occupied(column_index + span_index, row_index))
  486. found_all_available = false;
  487. }
  488. if (found_all_available) {
  489. found_unoccupied_area = true;
  490. column_start = column_index;
  491. row_start = row_index;
  492. goto finish;
  493. }
  494. }
  495. }
  496. auto_placement_cursor_x = 0;
  497. auto_placement_cursor_y++;
  498. }
  499. finish:
  500. // 4.1.2.2. If a non-overlapping position was found in the previous step, set the item's row-start
  501. // and column-start lines to the cursor's position. Otherwise, increment the auto-placement cursor's
  502. // row position (creating new rows in the implicit grid as necessary), set its column position to the
  503. // start-most column line in the implicit grid, and return to the previous step.
  504. if (!found_unoccupied_area) {
  505. row_start = m_occupation_grid.row_count();
  506. m_occupation_grid.maybe_add_row(m_occupation_grid.row_count() + 1);
  507. }
  508. m_occupation_grid.set_occupied(column_start, column_start + column_span, row_start, row_start + row_span);
  509. m_positioned_boxes.append({ child_box, row_start, row_span, column_start, column_span });
  510. }
  511. void GridFormattingContext::initialize_grid_tracks(Box const& box, AvailableSpace const& available_space, int column_count, int row_count)
  512. {
  513. for (auto const& track_in_list : box.computed_values().grid_template_columns().track_list()) {
  514. auto repeat_count = (track_in_list.is_repeat() && track_in_list.repeat().is_default()) ? track_in_list.repeat().repeat_count() : 1;
  515. if (track_in_list.is_repeat()) {
  516. if (track_in_list.repeat().is_auto_fill() || track_in_list.repeat().is_auto_fit())
  517. repeat_count = column_count;
  518. }
  519. for (auto _ = 0; _ < repeat_count; _++) {
  520. switch (track_in_list.type()) {
  521. case CSS::ExplicitGridTrack::Type::MinMax:
  522. m_grid_columns.append(TemporaryTrack(track_in_list.minmax().min_grid_size(), track_in_list.minmax().max_grid_size()));
  523. break;
  524. case CSS::ExplicitGridTrack::Type::Repeat:
  525. for (auto& explicit_grid_track : track_in_list.repeat().grid_track_size_list().track_list()) {
  526. auto track_sizing_function = explicit_grid_track;
  527. if (track_sizing_function.is_minmax())
  528. m_grid_columns.append(TemporaryTrack(track_sizing_function.minmax().min_grid_size(), track_sizing_function.minmax().max_grid_size()));
  529. else
  530. m_grid_columns.append(TemporaryTrack(track_sizing_function.grid_size()));
  531. }
  532. break;
  533. case CSS::ExplicitGridTrack::Type::Default:
  534. m_grid_columns.append(TemporaryTrack(track_in_list.grid_size()));
  535. break;
  536. default:
  537. VERIFY_NOT_REACHED();
  538. }
  539. }
  540. }
  541. for (auto const& track_in_list : box.computed_values().grid_template_rows().track_list()) {
  542. auto repeat_count = (track_in_list.is_repeat() && track_in_list.repeat().is_default()) ? track_in_list.repeat().repeat_count() : 1;
  543. if (track_in_list.is_repeat()) {
  544. if (track_in_list.repeat().is_auto_fill() || track_in_list.repeat().is_auto_fit())
  545. repeat_count = row_count;
  546. }
  547. for (auto _ = 0; _ < repeat_count; _++) {
  548. switch (track_in_list.type()) {
  549. case CSS::ExplicitGridTrack::Type::MinMax:
  550. m_grid_rows.append(TemporaryTrack(track_in_list.minmax().min_grid_size(), track_in_list.minmax().max_grid_size()));
  551. break;
  552. case CSS::ExplicitGridTrack::Type::Repeat:
  553. for (auto& explicit_grid_track : track_in_list.repeat().grid_track_size_list().track_list()) {
  554. auto track_sizing_function = explicit_grid_track;
  555. if (track_sizing_function.is_minmax())
  556. m_grid_rows.append(TemporaryTrack(track_sizing_function.minmax().min_grid_size(), track_sizing_function.minmax().max_grid_size()));
  557. else
  558. m_grid_rows.append(TemporaryTrack(track_sizing_function.grid_size()));
  559. }
  560. break;
  561. case CSS::ExplicitGridTrack::Type::Default:
  562. m_grid_rows.append(TemporaryTrack(track_in_list.grid_size()));
  563. break;
  564. default:
  565. VERIFY_NOT_REACHED();
  566. }
  567. }
  568. }
  569. for (int column_index = m_grid_columns.size(); column_index < m_occupation_grid.column_count(); column_index++)
  570. m_grid_columns.append(TemporaryTrack());
  571. for (int row_index = m_grid_rows.size(); row_index < m_occupation_grid.row_count(); row_index++)
  572. m_grid_rows.append(TemporaryTrack());
  573. // https://www.w3.org/TR/css-grid-2/#gutters
  574. // 11.1. Gutters: the row-gap, column-gap, and gap properties
  575. // For the purpose of track sizing, each gutter is treated as an extra, empty, fixed-size track of
  576. // the specified size, which is spanned by any grid items that span across its corresponding grid
  577. // line.
  578. if (!box.computed_values().column_gap().is_auto()) {
  579. for (int column_index = 1; column_index < (m_occupation_grid.column_count() * 2) - 1; column_index += 2)
  580. m_grid_columns.insert(column_index, TemporaryTrack(resolve_size(box.computed_values().column_gap(), available_space.width, box), true));
  581. }
  582. if (!box.computed_values().row_gap().is_auto()) {
  583. for (int row_index = 1; row_index < (m_occupation_grid.row_count() * 2) - 1; row_index += 2)
  584. m_grid_rows.insert(row_index, TemporaryTrack(resolve_size(box.computed_values().row_gap(), available_space.height, box), true));
  585. }
  586. }
  587. void GridFormattingContext::calculate_sizes_of_columns(Box const& box, AvailableSpace const& available_space)
  588. {
  589. // https://www.w3.org/TR/css-grid-2/#algo-init
  590. // 12.4. Initialize Track Sizes
  591. // Initialize each track’s base size and growth limit.
  592. for (auto& grid_column : m_grid_columns) {
  593. if (grid_column.is_gap)
  594. continue;
  595. // For each track, if the track’s min track sizing function is:
  596. switch (grid_column.min_track_sizing_function.type()) {
  597. // - A fixed sizing function
  598. // Resolve to an absolute length and use that size as the track’s initial base size.
  599. case CSS::GridSize::Type::Length:
  600. if (!grid_column.min_track_sizing_function.length().is_auto())
  601. grid_column.base_size = grid_column.min_track_sizing_function.length().to_px(box);
  602. break;
  603. case CSS::GridSize::Type::Percentage:
  604. if (available_space.width.is_definite())
  605. grid_column.base_size = grid_column.min_track_sizing_function.percentage().as_fraction() * available_space.width.to_px().value();
  606. break;
  607. // - An intrinsic sizing function
  608. // Use an initial base size of zero.
  609. case CSS::GridSize::Type::FlexibleLength:
  610. case CSS::GridSize::Type::MaxContent:
  611. case CSS::GridSize::Type::MinContent:
  612. break;
  613. default:
  614. VERIFY_NOT_REACHED();
  615. }
  616. // For each track, if the track’s max track sizing function is:
  617. switch (grid_column.max_track_sizing_function.type()) {
  618. // - A fixed sizing function
  619. // Resolve to an absolute length and use that size as the track’s initial growth limit.
  620. case CSS::GridSize::Type::Length:
  621. if (!grid_column.max_track_sizing_function.length().is_auto())
  622. grid_column.growth_limit = grid_column.max_track_sizing_function.length().to_px(box);
  623. else
  624. // - An intrinsic sizing function
  625. // Use an initial growth limit of infinity.
  626. grid_column.growth_limit = -1;
  627. break;
  628. case CSS::GridSize::Type::Percentage:
  629. if (available_space.width.is_definite())
  630. grid_column.growth_limit = grid_column.max_track_sizing_function.percentage().as_fraction() * available_space.width.to_px().value();
  631. break;
  632. // - A flexible sizing function
  633. // Use an initial growth limit of infinity.
  634. case CSS::GridSize::Type::FlexibleLength:
  635. grid_column.growth_limit = -1;
  636. break;
  637. // - An intrinsic sizing function
  638. // Use an initial growth limit of infinity.
  639. case CSS::GridSize::Type::MaxContent:
  640. case CSS::GridSize::Type::MinContent:
  641. grid_column.growth_limit = -1;
  642. break;
  643. default:
  644. VERIFY_NOT_REACHED();
  645. }
  646. // In all cases, if the growth limit is less than the base size, increase the growth limit to match
  647. // the base size.
  648. if (grid_column.growth_limit != -1 && grid_column.growth_limit < grid_column.base_size)
  649. grid_column.growth_limit = grid_column.base_size;
  650. }
  651. // https://www.w3.org/TR/css-grid-2/#algo-content
  652. // 12.5. Resolve Intrinsic Track Sizes
  653. // This step resolves intrinsic track sizing functions to absolute lengths. First it resolves those
  654. // sizes based on items that are contained wholly within a single track. Then it gradually adds in
  655. // the space requirements of items that span multiple tracks, evenly distributing the extra space
  656. // across those tracks insofar as possible.
  657. // FIXME: 1. Shim baseline-aligned items so their intrinsic size contributions reflect their baseline
  658. // alignment. For the items in each baseline-sharing group, add a “shim” (effectively, additional
  659. // margin) on the start/end side (for first/last-baseline alignment) of each item so that, when
  660. // start/end-aligned together their baselines align as specified.
  661. // Consider these “shims” as part of the items’ intrinsic size contribution for the purpose of track
  662. // sizing, below. If an item uses multiple intrinsic size contributions, it can have different shims
  663. // for each one.
  664. // 2. Size tracks to fit non-spanning items: For each track with an intrinsic track sizing function and
  665. // not a flexible sizing function, consider the items in it with a span of 1:
  666. int index = 0;
  667. for (auto& grid_column : m_grid_columns) {
  668. if (grid_column.is_gap)
  669. continue;
  670. if (!grid_column.min_track_sizing_function.is_intrinsic_track_sizing()) {
  671. ++index;
  672. continue;
  673. }
  674. Vector<Box const&> boxes_of_column;
  675. for (auto& positioned_box : m_positioned_boxes) {
  676. if (positioned_box.column == index && positioned_box.column_span == 1)
  677. boxes_of_column.append(positioned_box.box);
  678. }
  679. switch (grid_column.min_track_sizing_function.type()) {
  680. // - For min-content minimums:
  681. // If the track has a min-content min track sizing function, set its base size to the maximum of the
  682. // items’ min-content contributions, floored at zero.
  683. case CSS::GridSize::Type::MinContent: {
  684. CSSPixels column_width = 0;
  685. for (auto& box_of_column : boxes_of_column)
  686. column_width = max(column_width, calculate_min_content_width(box_of_column));
  687. grid_column.base_size = column_width;
  688. } break;
  689. // - For max-content minimums:
  690. // If the track has a max-content min track sizing function, set its base size to the maximum of the
  691. // items’ max-content contributions, floored at zero.
  692. case CSS::GridSize::Type::MaxContent: {
  693. CSSPixels column_width = 0;
  694. for (auto& box_of_column : boxes_of_column)
  695. column_width = max(column_width, calculate_max_content_width(box_of_column));
  696. grid_column.base_size = column_width;
  697. } break;
  698. // - For auto minimums:
  699. // If the track has an auto min track sizing function and the grid container is being sized under a
  700. // min-/max-content constraint, set the track’s base size to the maximum of its items’ limited
  701. // min-/max-content contributions (respectively), floored at zero. The limited min-/max-content
  702. // contribution of an item is (for this purpose) its min-/max-content contribution (accordingly),
  703. // limited by the max track sizing function (which could be the argument to a fit-content() track
  704. // sizing function) if that is fixed and ultimately floored by its minimum contribution (defined
  705. // below).
  706. // FIXME: Container min/max-content
  707. case CSS::GridSize::Type::Length:
  708. // Otherwise, set the track’s base size to the maximum of its items’ minimum contributions, floored
  709. // at zero. The minimum contribution of an item is the smallest outer size it can have.
  710. // Specifically, if the item’s computed preferred size behaves as auto or depends on the size of its
  711. // containing block in the relevant axis, its minimum contribution is the outer size that would
  712. // result from assuming the item’s used minimum size as its preferred size; else the item’s minimum
  713. // contribution is its min-content contribution. Because the minimum contribution often depends on
  714. // the size of the item’s content, it is considered a type of intrinsic size contribution.
  715. case CSS::GridSize::Type::Percentage:
  716. case CSS::GridSize::Type::FlexibleLength: {
  717. CSSPixels grid_column_width = 0;
  718. for (auto& box_of_column : boxes_of_column)
  719. grid_column_width = max(grid_column_width, calculate_min_content_width(box_of_column).value());
  720. grid_column.base_size = grid_column_width;
  721. } break;
  722. default:
  723. VERIFY_NOT_REACHED();
  724. }
  725. switch (grid_column.max_track_sizing_function.type()) {
  726. // - For min-content maximums:
  727. // If the track has a min-content max track sizing function, set its growth limit to the maximum of
  728. // the items’ min-content contributions.
  729. case CSS::GridSize::Type::MinContent: {
  730. CSSPixels column_width = 0;
  731. for (auto& box_of_column : boxes_of_column)
  732. column_width = max(column_width, calculate_min_content_width(box_of_column));
  733. grid_column.growth_limit = column_width;
  734. } break;
  735. // - For max-content maximums:
  736. // If the track has a max-content max track sizing function, set its growth limit to the maximum of
  737. // the items’ max-content contributions. For fit-content() maximums, furthermore clamp this growth
  738. // limit by the fit-content() argument.
  739. case CSS::GridSize::Type::MaxContent: {
  740. CSSPixels column_width = 0;
  741. for (auto& box_of_column : boxes_of_column)
  742. column_width = max(column_width, calculate_max_content_width(box_of_column));
  743. grid_column.growth_limit = column_width;
  744. } break;
  745. case CSS::GridSize::Type::Length:
  746. case CSS::GridSize::Type::Percentage:
  747. case CSS::GridSize::Type::FlexibleLength:
  748. break;
  749. default:
  750. VERIFY_NOT_REACHED();
  751. }
  752. // In all cases, if a track’s growth limit is now less than its base size, increase the growth limit
  753. // to match the base size.
  754. if (grid_column.growth_limit != -1 && grid_column.growth_limit < grid_column.base_size)
  755. grid_column.growth_limit = grid_column.base_size;
  756. ++index;
  757. }
  758. // https://www.w3.org/TR/css-grid-2/#auto-repeat
  759. // The auto-fit keyword behaves the same as auto-fill, except that after grid item placement any
  760. // empty repeated tracks are collapsed. An empty track is one with no in-flow grid items placed into
  761. // or spanning across it. (This can result in all tracks being collapsed, if they’re all empty.)
  762. if (box.computed_values().grid_template_columns().track_list().size() == 1
  763. && box.computed_values().grid_template_columns().track_list().first().is_repeat()
  764. && box.computed_values().grid_template_columns().track_list().first().repeat().is_auto_fit()) {
  765. for (size_t idx = 0; idx < m_grid_columns.size(); idx++) {
  766. auto column_to_check = box.computed_values().column_gap().is_auto() ? idx : idx / 2;
  767. if (m_occupation_grid.is_occupied(column_to_check, 0))
  768. continue;
  769. if (!box.computed_values().column_gap().is_auto() && idx % 2 != 0)
  770. continue;
  771. // A collapsed track is treated as having a fixed track sizing function of 0px
  772. m_grid_columns[idx].base_size = 0;
  773. m_grid_columns[idx].growth_limit = 0;
  774. // FIXME: And the gutters on either side of it—including any space allotted through distributed
  775. // alignment—collapse.
  776. }
  777. }
  778. // 3. Increase sizes to accommodate spanning items crossing content-sized tracks: Next, consider the
  779. // items with a span of 2 that do not span a track with a flexible sizing function.
  780. // FIXME: Content-sized tracks not implemented (min-content, etc.)
  781. // 3.1. For intrinsic minimums: First increase the base size of tracks with an intrinsic min track sizing
  782. // function by distributing extra space as needed to accommodate these items’ minimum contributions.
  783. // If the grid container is being sized under a min- or max-content constraint, use the items’
  784. // limited min-content contributions in place of their minimum contributions here. (For an item
  785. // spanning multiple tracks, the upper limit used to calculate its limited min-/max-content
  786. // contribution is the sum of the fixed max track sizing functions of any tracks it spans, and is
  787. // applied if it only spans such tracks.)
  788. // 3.2. For content-based minimums: Next continue to increase the base size of tracks with a min track
  789. // sizing function of min-content or max-content by distributing extra space as needed to account
  790. // for these items' min-content contributions.
  791. // 3.3. For max-content minimums: Next, if the grid container is being sized under a max-content
  792. // constraint, continue to increase the base size of tracks with a min track sizing function of auto
  793. // or max-content by distributing extra space as needed to account for these items' limited
  794. // max-content contributions.
  795. // In all cases, continue to increase the base size of tracks with a min track sizing function of
  796. // max-content by distributing extra space as needed to account for these items' max-content
  797. // contributions.
  798. // 3.4. If at this point any track’s growth limit is now less than its base size, increase its growth
  799. // limit to match its base size.
  800. // 3.5. For intrinsic maximums: Next increase the growth limit of tracks with an intrinsic max track
  801. // sizing function by distributing extra space as needed to account for these items' min-content
  802. // contributions. Mark any tracks whose growth limit changed from infinite to finite in this step as
  803. // infinitely growable for the next step.
  804. // 3.6. For max-content maximums: Lastly continue to increase the growth limit of tracks with a max track
  805. // sizing function of max-content by distributing extra space as needed to account for these items'
  806. // max-content contributions. However, limit the growth of any fit-content() tracks by their
  807. // fit-content() argument.
  808. // Repeat incrementally for items with greater spans until all items have been considered.
  809. // FIXME: 4. Increase sizes to accommodate spanning items crossing flexible tracks: Next, repeat the previous
  810. // step instead considering (together, rather than grouped by span size) all items that do span a
  811. // track with a flexible sizing function while
  812. // - distributing space only to flexible tracks (i.e. treating all other tracks as having a fixed
  813. // sizing function)
  814. // - if the sum of the flexible sizing functions of all flexible tracks spanned by the item is greater
  815. // than zero, distributing space to such tracks according to the ratios of their flexible sizing
  816. // functions rather than distributing space equally
  817. // FIXME: 5. If any track still has an infinite growth limit (because, for example, it had no items placed in
  818. // it or it is a flexible track), set its growth limit to its base size.
  819. // https://www.w3.org/TR/css-grid-2/#extra-space
  820. // 12.5.1. Distributing Extra Space Across Spanned Tracks
  821. // To distribute extra space by increasing the affected sizes of a set of tracks as required by a
  822. // set of intrinsic size contributions,
  823. CSSPixels sum_of_track_sizes = 0;
  824. for (auto& it : m_grid_columns)
  825. sum_of_track_sizes += it.base_size;
  826. // 1. Maintain separately for each affected base size or growth limit a planned increase, initially
  827. // set to 0. (This prevents the size increases from becoming order-dependent.)
  828. // 2. For each considered item,
  829. // 2.1. Find the space to distribute: Subtract the corresponding size (base size or growth limit) of
  830. // every spanned track from the item’s size contribution to find the item’s remaining size
  831. // contribution. (For infinite growth limits, substitute the track’s base size.) This is the space
  832. // to distribute. Floor it at zero.
  833. // For base sizes, the limit is its growth limit. For growth limits, the limit is infinity if it is
  834. // marked as infinitely growable, and equal to the growth limit otherwise. If the affected size was
  835. // a growth limit and the track is not marked infinitely growable, then each item-incurred increase
  836. // will be zero.
  837. // extra-space = max(0, size-contribution - ∑track-sizes)
  838. for (auto& grid_column : m_grid_columns) {
  839. if (grid_column.is_gap)
  840. continue;
  841. grid_column.space_to_distribute = max(CSSPixels(0), (grid_column.growth_limit == -1 ? grid_column.base_size : grid_column.growth_limit) - grid_column.base_size);
  842. }
  843. auto remaining_free_space = available_space.width.is_definite() ? available_space.width.to_px() - sum_of_track_sizes : 0;
  844. // 2.2. Distribute space up to limits: Find the item-incurred increase for each spanned track with an
  845. // affected size by: distributing the space equally among such tracks, freezing a track’s
  846. // item-incurred increase as its affected size + item-incurred increase reaches its limit (and
  847. // continuing to grow the unfrozen tracks as needed).
  848. auto count_of_unfrozen_tracks = 0;
  849. for (auto& grid_column : m_grid_columns) {
  850. if (grid_column.space_to_distribute > 0)
  851. count_of_unfrozen_tracks++;
  852. }
  853. while (remaining_free_space > 0) {
  854. if (count_of_unfrozen_tracks == 0)
  855. break;
  856. auto free_space_to_distribute_per_track = remaining_free_space / count_of_unfrozen_tracks;
  857. for (auto& grid_column : m_grid_columns) {
  858. if (grid_column.space_to_distribute == 0)
  859. continue;
  860. // 2.4. For each affected track, if the track’s item-incurred increase is larger than the track’s planned
  861. // increase set the track’s planned increase to that value.
  862. if (grid_column.space_to_distribute <= free_space_to_distribute_per_track) {
  863. grid_column.planned_increase += grid_column.space_to_distribute;
  864. remaining_free_space -= grid_column.space_to_distribute;
  865. grid_column.space_to_distribute = 0;
  866. } else {
  867. grid_column.space_to_distribute -= free_space_to_distribute_per_track;
  868. grid_column.planned_increase += free_space_to_distribute_per_track;
  869. remaining_free_space -= free_space_to_distribute_per_track;
  870. }
  871. }
  872. count_of_unfrozen_tracks = 0;
  873. for (auto& grid_column : m_grid_columns) {
  874. if (grid_column.space_to_distribute > 0)
  875. count_of_unfrozen_tracks++;
  876. }
  877. if (remaining_free_space == 0)
  878. break;
  879. }
  880. // 2.3. Distribute space beyond limits: If space remains after all tracks are frozen, unfreeze and
  881. // continue to distribute space to the item-incurred increase of…
  882. // - when accommodating minimum contributions or accommodating min-content contributions: any affected
  883. // track that happens to also have an intrinsic max track sizing function; if there are no such
  884. // tracks, then all affected tracks.
  885. // - when accommodating max-content contributions: any affected track that happens to also have a
  886. // max-content max track sizing function; if there are no such tracks, then all affected tracks.
  887. // - when handling any intrinsic growth limit: all affected tracks.
  888. // For this purpose, the max track sizing function of a fit-content() track is treated as
  889. // max-content until it reaches the limit specified as the fit-content() argument, after which it is
  890. // treated as having a fixed sizing function of that argument.
  891. // This step prioritizes the distribution of space for accommodating space required by the
  892. // tracks’ min track sizing functions beyond their current growth limits based on the types of their
  893. // max track sizing functions.
  894. // 3. Update the tracks' affected sizes by adding in the planned increase so that the next round of
  895. // space distribution will account for the increase. (If the affected size is an infinite growth
  896. // limit, set it to the track’s base size plus the planned increase.)
  897. for (auto& grid_column : m_grid_columns)
  898. grid_column.base_size += grid_column.planned_increase;
  899. // https://www.w3.org/TR/css-grid-2/#algo-grow-tracks
  900. // 12.6. Maximize Tracks
  901. // If the free space is positive, distribute it equally to the base sizes of all tracks, freezing
  902. // tracks as they reach their growth limits (and continuing to grow the unfrozen tracks as needed).
  903. auto free_space = get_free_space_x(available_space);
  904. while (free_space > 0) {
  905. auto free_space_to_distribute_per_track = free_space / (m_grid_columns.size() - count_of_gap_columns());
  906. for (auto& grid_column : m_grid_columns) {
  907. if (grid_column.is_gap)
  908. continue;
  909. if (grid_column.growth_limit != -1)
  910. grid_column.base_size = min(grid_column.growth_limit, grid_column.base_size + free_space_to_distribute_per_track);
  911. else
  912. grid_column.base_size = grid_column.base_size + free_space_to_distribute_per_track;
  913. }
  914. if (get_free_space_x(available_space) == free_space)
  915. break;
  916. free_space = get_free_space_x(available_space);
  917. }
  918. // For the purpose of this step: if sizing the grid container under a max-content constraint, the
  919. // free space is infinite; if sizing under a min-content constraint, the free space is zero.
  920. // If this would cause the grid to be larger than the grid container’s inner size as limited by its
  921. // max-width/height, then redo this step, treating the available grid space as equal to the grid
  922. // container’s inner size when it’s sized to its max-width/height.
  923. // https://drafts.csswg.org/css-grid/#algo-flex-tracks
  924. // 12.7. Expand Flexible Tracks
  925. // This step sizes flexible tracks using the largest value it can assign to an fr without exceeding
  926. // the available space.
  927. // First, find the grid’s used flex fraction:
  928. auto column_flex_factor_sum = 0;
  929. for (auto& grid_column : m_grid_columns) {
  930. if (grid_column.min_track_sizing_function.is_flexible_length())
  931. column_flex_factor_sum++;
  932. }
  933. // See 12.7.1.
  934. // Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less
  935. // than 1, set it to 1 instead.
  936. if (column_flex_factor_sum < 1)
  937. column_flex_factor_sum = 1;
  938. // See 12.7.1.
  939. CSSPixels sized_column_widths = 0;
  940. for (auto& grid_column : m_grid_columns) {
  941. if (!grid_column.min_track_sizing_function.is_flexible_length())
  942. sized_column_widths += grid_column.base_size;
  943. }
  944. // Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks.
  945. CSSPixels free_horizontal_space = available_space.width.is_definite() ? available_space.width.to_px() - sized_column_widths : 0;
  946. // If the free space is zero or if sizing the grid container under a min-content constraint:
  947. // The used flex fraction is zero.
  948. // FIXME: Add min-content constraint check.
  949. // Otherwise, if the free space is a definite length:
  950. // The used flex fraction is the result of finding the size of an fr using all of the grid tracks
  951. // and a space to fill of the available grid space.
  952. if (free_horizontal_space > 0) {
  953. for (auto& grid_column : m_grid_columns) {
  954. if (grid_column.min_track_sizing_function.is_flexible_length()) {
  955. // See 12.7.1.
  956. // Let the hypothetical fr size be the leftover space divided by the flex factor sum.
  957. auto hypothetical_fr_size = free_horizontal_space / column_flex_factor_sum;
  958. // For each flexible track, if the product of the used flex fraction and the track’s flex factor is
  959. // greater than the track’s base size, set its base size to that product.
  960. grid_column.base_size = max(grid_column.base_size, hypothetical_fr_size);
  961. }
  962. }
  963. }
  964. // Otherwise, if the free space is an indefinite length:
  965. // FIXME: No tracks will have indefinite length as per current implementation.
  966. // The used flex fraction is the maximum of:
  967. // For each flexible track, if the flexible track’s flex factor is greater than one, the result of
  968. // dividing the track’s base size by its flex factor; otherwise, the track’s base size.
  969. // For each grid item that crosses a flexible track, the result of finding the size of an fr using
  970. // all the grid tracks that the item crosses and a space to fill of the item’s max-content
  971. // contribution.
  972. // If using this flex fraction would cause the grid to be smaller than the grid container’s
  973. // min-width/height (or larger than the grid container’s max-width/height), then redo this step,
  974. // treating the free space as definite and the available grid space as equal to the grid container’s
  975. // inner size when it’s sized to its min-width/height (max-width/height).
  976. // For each flexible track, if the product of the used flex fraction and the track’s flex factor is
  977. // greater than the track’s base size, set its base size to that product.
  978. // https://drafts.csswg.org/css-grid/#algo-find-fr-size
  979. // 12.7.1. Find the Size of an fr
  980. // This algorithm finds the largest size that an fr unit can be without exceeding the target size.
  981. // It must be called with a set of grid tracks and some quantity of space to fill.
  982. // 1. Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks.
  983. // 2. Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less
  984. // than 1, set it to 1 instead.
  985. // 3. Let the hypothetical fr size be the leftover space divided by the flex factor sum.
  986. // FIXME: 4. If the product of the hypothetical fr size and a flexible track’s flex factor is less than the
  987. // track’s base size, restart this algorithm treating all such tracks as inflexible.
  988. // 5. Return the hypothetical fr size.
  989. // https://drafts.csswg.org/css-grid/#algo-stretch
  990. // 12.8. Stretch auto Tracks
  991. // When the content-distribution property of the grid container is normal or stretch in this axis,
  992. // this step expands tracks that have an auto max track sizing function by dividing any remaining
  993. // positive, definite free space equally amongst them. If the free space is indefinite, but the grid
  994. // container has a definite min-width/height, use that size to calculate the free space for this
  995. // step instead.
  996. CSSPixels used_horizontal_space = 0;
  997. for (auto& grid_column : m_grid_columns) {
  998. if (!(grid_column.max_track_sizing_function.is_length() && grid_column.max_track_sizing_function.length().is_auto()))
  999. used_horizontal_space += grid_column.base_size;
  1000. }
  1001. CSSPixels remaining_horizontal_space = available_space.width.is_definite() ? available_space.width.to_px() - used_horizontal_space : 0;
  1002. auto count_of_auto_max_column_tracks = 0;
  1003. for (auto& grid_column : m_grid_columns) {
  1004. if (grid_column.max_track_sizing_function.is_length() && grid_column.max_track_sizing_function.length().is_auto())
  1005. count_of_auto_max_column_tracks++;
  1006. }
  1007. for (auto& grid_column : m_grid_columns) {
  1008. if (grid_column.max_track_sizing_function.is_length() && grid_column.max_track_sizing_function.length().is_auto())
  1009. grid_column.base_size = max(grid_column.base_size, remaining_horizontal_space / count_of_auto_max_column_tracks);
  1010. }
  1011. // If calculating the layout of a grid item in this step depends on the available space in the block
  1012. // axis, assume the available space that it would have if any row with a definite max track sizing
  1013. // function had that size and all other rows were infinite. If both the grid container and all
  1014. // tracks have definite sizes, also apply align-content to find the final effective size of any gaps
  1015. // spanned by such items; otherwise ignore the effects of track alignment in this estimation.
  1016. }
  1017. void GridFormattingContext::calculate_sizes_of_rows(Box const& box)
  1018. {
  1019. // https://www.w3.org/TR/css-grid-2/#algo-init
  1020. // 12.4. Initialize Track Sizes
  1021. // Initialize each track’s base size and growth limit.
  1022. auto& box_state = m_state.get_mutable(box);
  1023. for (auto& grid_row : m_grid_rows) {
  1024. if (grid_row.is_gap)
  1025. continue;
  1026. // For each track, if the track’s min track sizing function is:
  1027. switch (grid_row.min_track_sizing_function.type()) {
  1028. // - A fixed sizing function
  1029. // Resolve to an absolute length and use that size as the track’s initial base size.
  1030. case CSS::GridSize::Type::Length:
  1031. if (!grid_row.min_track_sizing_function.length().is_auto())
  1032. grid_row.base_size = grid_row.min_track_sizing_function.length().to_px(box);
  1033. break;
  1034. case CSS::GridSize::Type::Percentage:
  1035. grid_row.base_size = grid_row.min_track_sizing_function.percentage().as_fraction() * box_state.content_height();
  1036. break;
  1037. // - An intrinsic sizing function
  1038. // Use an initial base size of zero.
  1039. case CSS::GridSize::Type::FlexibleLength:
  1040. case CSS::GridSize::Type::MaxContent:
  1041. case CSS::GridSize::Type::MinContent:
  1042. break;
  1043. default:
  1044. VERIFY_NOT_REACHED();
  1045. }
  1046. // For each track, if the track’s max track sizing function is:
  1047. switch (grid_row.max_track_sizing_function.type()) {
  1048. // - A fixed sizing function
  1049. // Resolve to an absolute length and use that size as the track’s initial growth limit.
  1050. case CSS::GridSize::Type::Length:
  1051. if (!grid_row.max_track_sizing_function.length().is_auto())
  1052. grid_row.growth_limit = grid_row.max_track_sizing_function.length().to_px(box);
  1053. else
  1054. // - An intrinsic sizing function
  1055. // Use an initial growth limit of infinity.
  1056. grid_row.growth_limit = -1;
  1057. break;
  1058. case CSS::GridSize::Type::Percentage:
  1059. grid_row.growth_limit = grid_row.max_track_sizing_function.percentage().as_fraction() * box_state.content_height();
  1060. break;
  1061. // - A flexible sizing function
  1062. // Use an initial growth limit of infinity.
  1063. case CSS::GridSize::Type::FlexibleLength:
  1064. grid_row.growth_limit = -1;
  1065. break;
  1066. // - An intrinsic sizing function
  1067. // Use an initial growth limit of infinity.
  1068. case CSS::GridSize::Type::MaxContent:
  1069. case CSS::GridSize::Type::MinContent:
  1070. grid_row.growth_limit = -1;
  1071. break;
  1072. default:
  1073. VERIFY_NOT_REACHED();
  1074. }
  1075. // In all cases, if the growth limit is less than the base size, increase the growth limit to match
  1076. // the base size.
  1077. if (grid_row.growth_limit != -1 && grid_row.growth_limit < grid_row.base_size)
  1078. grid_row.growth_limit = grid_row.base_size;
  1079. }
  1080. // https://www.w3.org/TR/css-grid-2/#algo-content
  1081. // 12.5. Resolve Intrinsic Track Sizes
  1082. // This step resolves intrinsic track sizing functions to absolute lengths. First it resolves those
  1083. // sizes based on items that are contained wholly within a single track. Then it gradually adds in
  1084. // the space requirements of items that span multiple tracks, evenly distributing the extra space
  1085. // across those tracks insofar as possible.
  1086. // FIXME: 1. Shim baseline-aligned items so their intrinsic size contributions reflect their baseline
  1087. // alignment. For the items in each baseline-sharing group, add a “shim” (effectively, additional
  1088. // margin) on the start/end side (for first/last-baseline alignment) of each item so that, when
  1089. // start/end-aligned together their baselines align as specified.
  1090. // Consider these “shims” as part of the items’ intrinsic size contribution for the purpose of track
  1091. // sizing, below. If an item uses multiple intrinsic size contributions, it can have different shims
  1092. // for each one.
  1093. // 2. Size tracks to fit non-spanning items: For each track with an intrinsic track sizing function and
  1094. // not a flexible sizing function, consider the items in it with a span of 1:
  1095. auto index = 0;
  1096. for (auto& grid_row : m_grid_rows) {
  1097. if (grid_row.is_gap)
  1098. continue;
  1099. if (!grid_row.min_track_sizing_function.is_intrinsic_track_sizing()) {
  1100. ++index;
  1101. continue;
  1102. }
  1103. Vector<PositionedBox&> positioned_boxes_of_row;
  1104. for (auto& positioned_box : m_positioned_boxes) {
  1105. if (positioned_box.row == index && positioned_box.row_span == 1)
  1106. positioned_boxes_of_row.append(positioned_box);
  1107. }
  1108. switch (grid_row.min_track_sizing_function.type()) {
  1109. // - For min-content minimums:
  1110. // If the track has a min-content min track sizing function, set its base size to the maximum of the
  1111. // items’ min-content contributions, floored at zero.
  1112. case CSS::GridSize::Type::MinContent: {
  1113. CSSPixels row_height = 0;
  1114. for (auto& positioned_box : positioned_boxes_of_row)
  1115. row_height = max(row_height, calculate_min_content_height(positioned_box.box, AvailableSize::make_definite(m_grid_columns[positioned_box.column].base_size)));
  1116. grid_row.base_size = row_height;
  1117. } break;
  1118. // - For max-content minimums:
  1119. // If the track has a max-content min track sizing function, set its base size to the maximum of the
  1120. // items’ max-content contributions, floored at zero.
  1121. case CSS::GridSize::Type::MaxContent: {
  1122. CSSPixels row_height = 0;
  1123. for (auto& positioned_box : positioned_boxes_of_row)
  1124. row_height = max(row_height, calculate_max_content_height(positioned_box.box, AvailableSize::make_definite(m_grid_columns[positioned_box.column].base_size)));
  1125. grid_row.base_size = row_height;
  1126. } break;
  1127. // - For auto minimums:
  1128. // If the track has an auto min track sizing function and the grid container is being sized under a
  1129. // min-/max-content constraint, set the track’s base size to the maximum of its items’ limited
  1130. // min-/max-content contributions (respectively), floored at zero. The limited min-/max-content
  1131. // contribution of an item is (for this purpose) its min-/max-content contribution (accordingly),
  1132. // limited by the max track sizing function (which could be the argument to a fit-content() track
  1133. // sizing function) if that is fixed and ultimately floored by its minimum contribution (defined
  1134. // below).
  1135. // FIXME: Container min/max-content
  1136. case CSS::GridSize::Type::Length:
  1137. // Otherwise, set the track’s base size to the maximum of its items’ minimum contributions, floored
  1138. // at zero. The minimum contribution of an item is the smallest outer size it can have.
  1139. // Specifically, if the item’s computed preferred size behaves as auto or depends on the size of its
  1140. // containing block in the relevant axis, its minimum contribution is the outer size that would
  1141. // result from assuming the item’s used minimum size as its preferred size; else the item’s minimum
  1142. // contribution is its min-content contribution. Because the minimum contribution often depends on
  1143. // the size of the item’s content, it is considered a type of intrinsic size contribution.
  1144. case CSS::GridSize::Type::Percentage:
  1145. case CSS::GridSize::Type::FlexibleLength: {
  1146. CSSPixels grid_row_height = 0;
  1147. for (auto& positioned_box : positioned_boxes_of_row)
  1148. grid_row_height = max(grid_row_height, calculate_min_content_height(positioned_box.box, AvailableSize::make_definite(m_grid_columns[positioned_box.column].base_size)));
  1149. grid_row.base_size = grid_row_height;
  1150. } break;
  1151. default:
  1152. VERIFY_NOT_REACHED();
  1153. }
  1154. switch (grid_row.max_track_sizing_function.type()) {
  1155. // - For min-content maximums:
  1156. // If the track has a min-content max track sizing function, set its growth limit to the maximum of
  1157. // the items’ min-content contributions.
  1158. case CSS::GridSize::Type::MinContent: {
  1159. CSSPixels row_height = 0;
  1160. for (auto& positioned_box : positioned_boxes_of_row)
  1161. row_height = max(row_height, calculate_max_content_height(positioned_box.box, AvailableSize::make_definite(m_grid_columns[positioned_box.column].base_size)));
  1162. grid_row.base_size = row_height;
  1163. } break;
  1164. // - For max-content maximums:
  1165. // If the track has a max-content max track sizing function, set its growth limit to the maximum of
  1166. // the items’ max-content contributions. For fit-content() maximums, furthermore clamp this growth
  1167. // limit by the fit-content() argument.
  1168. case CSS::GridSize::Type::MaxContent: {
  1169. CSSPixels row_height = 0;
  1170. for (auto& positioned_box : positioned_boxes_of_row)
  1171. row_height = max(row_height, calculate_max_content_height(positioned_box.box, AvailableSize::make_definite(m_grid_columns[positioned_box.column].base_size)));
  1172. grid_row.base_size = row_height;
  1173. } break;
  1174. case CSS::GridSize::Type::Length:
  1175. case CSS::GridSize::Type::Percentage:
  1176. case CSS::GridSize::Type::FlexibleLength:
  1177. break;
  1178. default:
  1179. VERIFY_NOT_REACHED();
  1180. }
  1181. // In all cases, if a track’s growth limit is now less than its base size, increase the growth limit
  1182. // to match the base size.
  1183. if (grid_row.growth_limit != -1 && grid_row.growth_limit < grid_row.base_size)
  1184. grid_row.growth_limit = grid_row.base_size;
  1185. ++index;
  1186. }
  1187. // https://www.w3.org/TR/css-grid-2/#auto-repeat
  1188. // The auto-fit keyword behaves the same as auto-fill, except that after grid item placement any
  1189. // empty repeated tracks are collapsed. An empty track is one with no in-flow grid items placed into
  1190. // or spanning across it. (This can result in all tracks being collapsed, if they’re all empty.)
  1191. // 3. Increase sizes to accommodate spanning items crossing content-sized tracks: Next, consider the
  1192. // items with a span of 2 that do not span a track with a flexible sizing function.
  1193. // FIXME: Content-sized tracks not implemented (min-content, etc.)
  1194. // 3.1. For intrinsic minimums: First increase the base size of tracks with an intrinsic min track sizing
  1195. // function by distributing extra space as needed to accommodate these items’ minimum contributions.
  1196. // If the grid container is being sized under a min- or max-content constraint, use the items’
  1197. // limited min-content contributions in place of their minimum contributions here. (For an item
  1198. // spanning multiple tracks, the upper limit used to calculate its limited min-/max-content
  1199. // contribution is the sum of the fixed max track sizing functions of any tracks it spans, and is
  1200. // applied if it only spans such tracks.)
  1201. // 3.2. For content-based minimums: Next continue to increase the base size of tracks with a min track
  1202. // sizing function of min-content or max-content by distributing extra space as needed to account
  1203. // for these items' min-content contributions.
  1204. // 3.3. For max-content minimums: Next, if the grid container is being sized under a max-content
  1205. // constraint, continue to increase the base size of tracks with a min track sizing function of auto
  1206. // or max-content by distributing extra space as needed to account for these items' limited
  1207. // max-content contributions.
  1208. // In all cases, continue to increase the base size of tracks with a min track sizing function of
  1209. // max-content by distributing extra space as needed to account for these items' max-content
  1210. // contributions.
  1211. // 3.4. If at this point any track’s growth limit is now less than its base size, increase its growth
  1212. // limit to match its base size.
  1213. // 3.5. For intrinsic maximums: Next increase the growth limit of tracks with an intrinsic max track
  1214. // sizing function by distributing extra space as needed to account for these items' min-content
  1215. // contributions. Mark any tracks whose growth limit changed from infinite to finite in this step as
  1216. // infinitely growable for the next step.
  1217. // 3.6. For max-content maximums: Lastly continue to increase the growth limit of tracks with a max track
  1218. // sizing function of max-content by distributing extra space as needed to account for these items'
  1219. // max-content contributions. However, limit the growth of any fit-content() tracks by their
  1220. // fit-content() argument.
  1221. // Repeat incrementally for items with greater spans until all items have been considered.
  1222. // FIXME: 4. Increase sizes to accommodate spanning items crossing flexible tracks: Next, repeat the previous
  1223. // step instead considering (together, rather than grouped by span size) all items that do span a
  1224. // track with a flexible sizing function while
  1225. // - distributing space only to flexible tracks (i.e. treating all other tracks as having a fixed
  1226. // sizing function)
  1227. // - if the sum of the flexible sizing functions of all flexible tracks spanned by the item is greater
  1228. // than zero, distributing space to such tracks according to the ratios of their flexible sizing
  1229. // functions rather than distributing space equally
  1230. // FIXME: 5. If any track still has an infinite growth limit (because, for example, it had no items placed in
  1231. // it or it is a flexible track), set its growth limit to its base size.
  1232. // https://www.w3.org/TR/css-grid-2/#extra-space
  1233. // 12.5.1. Distributing Extra Space Across Spanned Tracks
  1234. // To distribute extra space by increasing the affected sizes of a set of tracks as required by a
  1235. // set of intrinsic size contributions,
  1236. // 1. Maintain separately for each affected base size or growth limit a planned increase, initially
  1237. // set to 0. (This prevents the size increases from becoming order-dependent.)
  1238. // 2. For each considered item,
  1239. // 2.1. Find the space to distribute: Subtract the corresponding size (base size or growth limit) of
  1240. // every spanned track from the item’s size contribution to find the item’s remaining size
  1241. // contribution. (For infinite growth limits, substitute the track’s base size.) This is the space
  1242. // to distribute. Floor it at zero.
  1243. // For base sizes, the limit is its growth limit. For growth limits, the limit is infinity if it is
  1244. // marked as infinitely growable, and equal to the growth limit otherwise. If the affected size was
  1245. // a growth limit and the track is not marked infinitely growable, then each item-incurred increase
  1246. // will be zero.
  1247. // extra-space = max(0, size-contribution - ∑track-sizes)
  1248. // 2.2. Distribute space up to limits: Find the item-incurred increase for each spanned track with an
  1249. // affected size by: distributing the space equally among such tracks, freezing a track’s
  1250. // item-incurred increase as its affected size + item-incurred increase reaches its limit (and
  1251. // continuing to grow the unfrozen tracks as needed).
  1252. // 2.3. Distribute space beyond limits: If space remains after all tracks are frozen, unfreeze and
  1253. // continue to distribute space to the item-incurred increase of…
  1254. // - when accommodating minimum contributions or accommodating min-content contributions: any affected
  1255. // track that happens to also have an intrinsic max track sizing function; if there are no such
  1256. // tracks, then all affected tracks.
  1257. // - when accommodating max-content contributions: any affected track that happens to also have a
  1258. // max-content max track sizing function; if there are no such tracks, then all affected tracks.
  1259. // - when handling any intrinsic growth limit: all affected tracks.
  1260. // For this purpose, the max track sizing function of a fit-content() track is treated as
  1261. // max-content until it reaches the limit specified as the fit-content() argument, after which it is
  1262. // treated as having a fixed sizing function of that argument.
  1263. // This step prioritizes the distribution of space for accommodating space required by the
  1264. // tracks’ min track sizing functions beyond their current growth limits based on the types of their
  1265. // max track sizing functions.
  1266. // 3. Update the tracks' affected sizes by adding in the planned increase so that the next round of
  1267. // space distribution will account for the increase. (If the affected size is an infinite growth
  1268. // limit, set it to the track’s base size plus the planned increase.)
  1269. // FIXME: Do for rows.
  1270. // https://www.w3.org/TR/css-grid-2/#algo-grow-tracks
  1271. // 12.6. Maximize Tracks
  1272. // If the free space is positive, distribute it equally to the base sizes of all tracks, freezing
  1273. // tracks as they reach their growth limits (and continuing to grow the unfrozen tracks as needed).
  1274. auto free_space = get_free_space_y(box);
  1275. while (free_space > 0) {
  1276. auto free_space_to_distribute_per_track = free_space / (m_grid_rows.size() - count_of_gap_rows());
  1277. for (auto& grid_row : m_grid_rows) {
  1278. if (grid_row.is_gap)
  1279. continue;
  1280. grid_row.base_size = min(grid_row.growth_limit, grid_row.base_size + free_space_to_distribute_per_track);
  1281. }
  1282. if (get_free_space_y(box) == free_space)
  1283. break;
  1284. free_space = get_free_space_y(box);
  1285. }
  1286. if (free_space == -1) {
  1287. for (auto& grid_row : m_grid_rows) {
  1288. if (grid_row.is_gap)
  1289. continue;
  1290. if (grid_row.growth_limit != -1)
  1291. grid_row.base_size = grid_row.growth_limit;
  1292. }
  1293. }
  1294. // For the purpose of this step: if sizing the grid container under a max-content constraint, the
  1295. // free space is infinite; if sizing under a min-content constraint, the free space is zero.
  1296. // If this would cause the grid to be larger than the grid container’s inner size as limited by its
  1297. // max-width/height, then redo this step, treating the available grid space as equal to the grid
  1298. // container’s inner size when it’s sized to its max-width/height.
  1299. // https://drafts.csswg.org/css-grid/#algo-flex-tracks
  1300. // 12.7. Expand Flexible Tracks
  1301. // This step sizes flexible tracks using the largest value it can assign to an fr without exceeding
  1302. // the available space.
  1303. // First, find the grid’s used flex fraction:
  1304. auto row_flex_factor_sum = 0;
  1305. for (auto& grid_row : m_grid_rows) {
  1306. if (grid_row.min_track_sizing_function.is_flexible_length())
  1307. row_flex_factor_sum++;
  1308. }
  1309. // See 12.7.1.
  1310. // Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less
  1311. // than 1, set it to 1 instead.
  1312. if (row_flex_factor_sum < 1)
  1313. row_flex_factor_sum = 1;
  1314. // See 12.7.1.
  1315. CSSPixels sized_row_heights = 0;
  1316. for (auto& grid_row : m_grid_rows) {
  1317. if (!grid_row.min_track_sizing_function.is_flexible_length())
  1318. sized_row_heights += grid_row.base_size;
  1319. }
  1320. // Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks.
  1321. CSSPixels free_vertical_space = CSSPixels(box_state.content_height()) - sized_row_heights;
  1322. // If the free space is zero or if sizing the grid container under a min-content constraint:
  1323. // The used flex fraction is zero.
  1324. // FIXME: Add min-content constraint check.
  1325. // Otherwise, if the free space is a definite length:
  1326. // The used flex fraction is the result of finding the size of an fr using all of the grid tracks
  1327. // and a space to fill of the available grid space.
  1328. if (free_vertical_space > 0) {
  1329. for (auto& grid_row : m_grid_rows) {
  1330. if (grid_row.min_track_sizing_function.is_flexible_length()) {
  1331. // See 12.7.1.
  1332. // Let the hypothetical fr size be the leftover space divided by the flex factor sum.
  1333. auto hypothetical_fr_size = free_vertical_space / row_flex_factor_sum;
  1334. // For each flexible track, if the product of the used flex fraction and the track’s flex factor is
  1335. // greater than the track’s base size, set its base size to that product.
  1336. grid_row.base_size = max(grid_row.base_size, hypothetical_fr_size);
  1337. }
  1338. }
  1339. }
  1340. // Otherwise, if the free space is an indefinite length:
  1341. // FIXME: No tracks will have indefinite length as per current implementation.
  1342. // The used flex fraction is the maximum of:
  1343. // For each flexible track, if the flexible track’s flex factor is greater than one, the result of
  1344. // dividing the track’s base size by its flex factor; otherwise, the track’s base size.
  1345. // For each grid item that crosses a flexible track, the result of finding the size of an fr using
  1346. // all the grid tracks that the item crosses and a space to fill of the item’s max-content
  1347. // contribution.
  1348. // If using this flex fraction would cause the grid to be smaller than the grid container’s
  1349. // min-width/height (or larger than the grid container’s max-width/height), then redo this step,
  1350. // treating the free space as definite and the available grid space as equal to the grid container’s
  1351. // inner size when it’s sized to its min-width/height (max-width/height).
  1352. // For each flexible track, if the product of the used flex fraction and the track’s flex factor is
  1353. // greater than the track’s base size, set its base size to that product.
  1354. // https://drafts.csswg.org/css-grid/#algo-find-fr-size
  1355. // 12.7.1. Find the Size of an fr
  1356. // This algorithm finds the largest size that an fr unit can be without exceeding the target size.
  1357. // It must be called with a set of grid tracks and some quantity of space to fill.
  1358. // 1. Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks.
  1359. // 2. Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less
  1360. // than 1, set it to 1 instead.
  1361. // 3. Let the hypothetical fr size be the leftover space divided by the flex factor sum.
  1362. // FIXME: 4. If the product of the hypothetical fr size and a flexible track’s flex factor is less than the
  1363. // track’s base size, restart this algorithm treating all such tracks as inflexible.
  1364. // 5. Return the hypothetical fr size.
  1365. // https://drafts.csswg.org/css-grid/#algo-stretch
  1366. // 12.8. Stretch auto Tracks
  1367. // When the content-distribution property of the grid container is normal or stretch in this axis,
  1368. // this step expands tracks that have an auto max track sizing function by dividing any remaining
  1369. // positive, definite free space equally amongst them. If the free space is indefinite, but the grid
  1370. // container has a definite min-width/height, use that size to calculate the free space for this
  1371. // step instead.
  1372. CSSPixels used_vertical_space = 0;
  1373. for (auto& grid_row : m_grid_rows) {
  1374. if (!(grid_row.max_track_sizing_function.is_length() && grid_row.max_track_sizing_function.length().is_auto()))
  1375. used_vertical_space += grid_row.base_size;
  1376. }
  1377. CSSPixels remaining_vertical_space = CSSPixels(box_state.content_height()) - used_vertical_space;
  1378. auto count_of_auto_max_row_tracks = 0;
  1379. for (auto& grid_row : m_grid_rows) {
  1380. if (grid_row.max_track_sizing_function.is_length() && grid_row.max_track_sizing_function.length().is_auto())
  1381. count_of_auto_max_row_tracks++;
  1382. }
  1383. for (auto& grid_row : m_grid_rows) {
  1384. if (grid_row.max_track_sizing_function.is_length() && grid_row.max_track_sizing_function.length().is_auto())
  1385. grid_row.base_size = max(grid_row.base_size, remaining_vertical_space / count_of_auto_max_row_tracks);
  1386. }
  1387. }
  1388. void GridFormattingContext::run(Box const& box, LayoutMode, AvailableSpace const& available_space)
  1389. {
  1390. auto grid_template_columns = box.computed_values().grid_template_columns();
  1391. auto grid_template_rows = box.computed_values().grid_template_rows();
  1392. // https://drafts.csswg.org/css-grid/#overview-placement
  1393. // 2.2. Placing Items
  1394. // The contents of the grid container are organized into individual grid items (analogous to
  1395. // flex items), which are then assigned to predefined areas in the grid. They can be explicitly
  1396. // placed using coordinates through the grid-placement properties or implicitly placed into
  1397. // empty areas using auto-placement.
  1398. box.for_each_child_of_type<Box>([&](Box& child_box) {
  1399. if (can_skip_is_anonymous_text_run(child_box))
  1400. return IterationDecision::Continue;
  1401. m_boxes_to_place.append(child_box);
  1402. return IterationDecision::Continue;
  1403. });
  1404. auto column_count = get_count_of_tracks(grid_template_columns.track_list(), available_space, box);
  1405. auto row_count = get_count_of_tracks(grid_template_rows.track_list(), available_space, box);
  1406. m_occupation_grid = OccupationGrid(column_count, row_count);
  1407. // https://drafts.csswg.org/css-grid/#auto-placement-algo
  1408. // 8.5. Grid Item Placement Algorithm
  1409. // FIXME: 0. Generate anonymous grid items
  1410. // 1. Position anything that's not auto-positioned.
  1411. for (size_t i = 0; i < m_boxes_to_place.size(); i++) {
  1412. auto const& child_box = m_boxes_to_place[i];
  1413. if (is_auto_positioned_row(child_box.computed_values().grid_row_start(), child_box.computed_values().grid_row_end())
  1414. || is_auto_positioned_column(child_box.computed_values().grid_column_start(), child_box.computed_values().grid_column_end()))
  1415. continue;
  1416. place_item_with_row_and_column_position(box, child_box);
  1417. m_boxes_to_place.remove(i);
  1418. i--;
  1419. }
  1420. // 2. Process the items locked to a given row.
  1421. // FIXME: Do "dense" packing
  1422. for (size_t i = 0; i < m_boxes_to_place.size(); i++) {
  1423. auto const& child_box = m_boxes_to_place[i];
  1424. if (is_auto_positioned_row(child_box.computed_values().grid_row_start(), child_box.computed_values().grid_row_end()))
  1425. continue;
  1426. place_item_with_row_position(box, child_box);
  1427. m_boxes_to_place.remove(i);
  1428. i--;
  1429. }
  1430. // 3. Determine the columns in the implicit grid.
  1431. // NOTE: "implicit grid" here is the same as the m_occupation_grid
  1432. // 3.1. Start with the columns from the explicit grid.
  1433. // NOTE: Done in step 1.
  1434. // 3.2. Among all the items with a definite column position (explicitly positioned items, items
  1435. // positioned in the previous step, and items not yet positioned but with a definite column) add
  1436. // columns to the beginning and end of the implicit grid as necessary to accommodate those items.
  1437. // NOTE: "Explicitly positioned items" and "items positioned in the previous step" done in step 1
  1438. // and 2, respectively. Adding columns for "items not yet positioned but with a definite column"
  1439. // will be done in step 4.
  1440. // 4. Position the remaining grid items.
  1441. // For each grid item that hasn't been positioned by the previous steps, in order-modified document
  1442. // order:
  1443. auto auto_placement_cursor_x = 0;
  1444. auto auto_placement_cursor_y = 0;
  1445. for (size_t i = 0; i < m_boxes_to_place.size(); i++) {
  1446. auto const& child_box = m_boxes_to_place[i];
  1447. // 4.1. For sparse packing:
  1448. // FIXME: no distinction made. See #4.2
  1449. // 4.1.1. If the item has a definite column position:
  1450. if (!is_auto_positioned_column(child_box.computed_values().grid_column_start(), child_box.computed_values().grid_column_end()))
  1451. place_item_with_column_position(box, child_box, auto_placement_cursor_x, auto_placement_cursor_y);
  1452. // 4.1.2. If the item has an automatic grid position in both axes:
  1453. else
  1454. place_item_with_no_declared_position(child_box, auto_placement_cursor_x, auto_placement_cursor_y);
  1455. m_boxes_to_place.remove(i);
  1456. i--;
  1457. // FIXME: 4.2. For dense packing:
  1458. }
  1459. // https://drafts.csswg.org/css-grid/#overview-sizing
  1460. // 2.3. Sizing the Grid
  1461. // Once the grid items have been placed, the sizes of the grid tracks (rows and columns) are
  1462. // calculated, accounting for the sizes of their contents and/or available space as specified in
  1463. // the grid definition.
  1464. // https://www.w3.org/TR/css-grid-2/#layout-algorithm
  1465. // 12. Grid Sizing
  1466. // This section defines the grid sizing algorithm, which determines the size of all grid tracks and,
  1467. // by extension, the entire grid.
  1468. // Each track has specified minimum and maximum sizing functions (which may be the same). Each
  1469. // sizing function is either:
  1470. // - A fixed sizing function (<length> or resolvable <percentage>).
  1471. // - An intrinsic sizing function (min-content, max-content, auto, fit-content()).
  1472. // - A flexible sizing function (<flex>).
  1473. // The grid sizing algorithm defines how to resolve these sizing constraints into used track sizes.
  1474. initialize_grid_tracks(box, available_space, column_count, row_count);
  1475. // https://www.w3.org/TR/css-grid-2/#algo-overview
  1476. // 12.1. Grid Sizing Algorithm
  1477. // 1. First, the track sizing algorithm is used to resolve the sizes of the grid columns.
  1478. // In this process, any grid item which is subgridded in the grid container’s inline axis is treated
  1479. // as empty and its grid items (the grandchildren) are treated as direct children of the grid
  1480. // container (their grandparent). This introspection is recursive.
  1481. // Items which are subgridded only in the block axis, and whose grid container size in the inline
  1482. // axis depends on the size of its contents are also introspected: since the size of the item in
  1483. // this dimension can be dependent on the sizing of its subgridded tracks in the other, the size
  1484. // contribution of any such item to this grid’s column sizing (see Resolve Intrinsic Track Sizes) is
  1485. // taken under the provision of having determined its track sizing only up to the same point in the
  1486. // Grid Sizing Algorithm as this itself. E.g. for the first pass through this step, the item will
  1487. // have its tracks sized only through this first step; if a second pass of this step is triggered
  1488. // then the item will have completed a first pass through steps 1-3 as well as the second pass of
  1489. // this step prior to returning its size for consideration in this grid’s column sizing. Again, this
  1490. // introspection is recursive.
  1491. // https://www.w3.org/TR/css-grid-2/#algo-track-sizing
  1492. // 12.3. Track Sizing Algorithm
  1493. // The remainder of this section is the track sizing algorithm, which calculates from the min and
  1494. // max track sizing functions the used track size. Each track has a base size, a <length> which
  1495. // grows throughout the algorithm and which will eventually be the track’s final size, and a growth
  1496. // limit, a <length> which provides a desired maximum size for the base size. There are 5 steps:
  1497. // 1. Initialize Track Sizes
  1498. // 2. Resolve Intrinsic Track Sizes
  1499. // 3. Maximize Tracks
  1500. // 4. Expand Flexible Tracks
  1501. // 5. Expand Stretched auto Tracks
  1502. calculate_sizes_of_columns(box, available_space);
  1503. // https://www.w3.org/TR/css-grid-2/#algo-overview
  1504. // 12.1. Grid Sizing Algorithm
  1505. // 2. Next, the track sizing algorithm resolves the sizes of the grid rows.
  1506. // In this process, any grid item which is subgridded in the grid container’s block axis is treated
  1507. // as empty and its grid items (the grandchildren) are treated as direct children of the grid
  1508. // container (their grandparent). This introspection is recursive.
  1509. // As with sizing columns, items which are subgridded only in the inline axis, and whose grid
  1510. // container size in the block axis depends on the size of its contents are also introspected. (As
  1511. // with sizing columns, the size contribution to this grid’s row sizing is taken under the provision
  1512. // of having determined its track sizing only up to this corresponding point in the algorithm; and
  1513. // again, this introspection is recursive.)
  1514. // To find the inline-axis available space for any items whose block-axis size contributions require
  1515. // it, use the grid column sizes calculated in the previous step. If the grid container’s inline
  1516. // size is definite, also apply justify-content to account for the effective column gap sizes.
  1517. // https://www.w3.org/TR/css-grid-2/#algo-track-sizing
  1518. // 12.3. Track Sizing Algorithm
  1519. // The remainder of this section is the track sizing algorithm, which calculates from the min and
  1520. // max track sizing functions the used track size. Each track has a base size, a <length> which
  1521. // grows throughout the algorithm and which will eventually be the track’s final size, and a growth
  1522. // limit, a <length> which provides a desired maximum size for the base size. There are 5 steps:
  1523. // 1. Initialize Track Sizes
  1524. // 2. Resolve Intrinsic Track Sizes
  1525. // 3. Maximize Tracks
  1526. // 4. Expand Flexible Tracks
  1527. // 5. Expand Stretched auto Tracks
  1528. calculate_sizes_of_rows(box);
  1529. // https://www.w3.org/TR/css-grid-2/#algo-overview
  1530. // 12.1. Grid Sizing Algorithm
  1531. // 3. Then, if the min-content contribution of any grid item has changed based on the row sizes and
  1532. // alignment calculated in step 2, re-resolve the sizes of the grid columns with the new min-content
  1533. // and max-content contributions (once only).
  1534. // To find the block-axis available space for any items whose inline-axis size contributions require
  1535. // it, use the grid row sizes calculated in the previous step. If the grid container’s block size is
  1536. // definite, also apply align-content to account for the effective row gap sizes
  1537. // 4. Next, if the min-content contribution of any grid item has changed based on the column sizes and
  1538. // alignment calculated in step 3, re-resolve the sizes of the grid rows with the new min-content
  1539. // and max-content contributions (once only).
  1540. // To find the inline-axis available space for any items whose block-axis size contributions require
  1541. // it, use the grid column sizes calculated in the previous step. If the grid container’s inline
  1542. // size is definite, also apply justify-content to account for the effective column gap sizes.
  1543. // 5. Finally, the grid container is sized using the resulting size of the grid as its content size,
  1544. // and the tracks are aligned within the grid container according to the align-content and
  1545. // justify-content properties.
  1546. // Once the size of each grid area is thus established, the grid items are laid out into their
  1547. // respective containing blocks. The grid area’s width and height are considered definite for this
  1548. // purpose.
  1549. auto layout_box = [&](int row_start, int row_end, int column_start, int column_end, Box const& child_box) -> void {
  1550. auto& child_box_state = m_state.get_mutable(child_box);
  1551. CSSPixels x_start = 0;
  1552. CSSPixels x_end = 0;
  1553. CSSPixels y_start = 0;
  1554. CSSPixels y_end = 0;
  1555. for (int i = 0; i < column_start; i++)
  1556. x_start += m_grid_columns[i].base_size;
  1557. for (int i = 0; i < column_end; i++)
  1558. x_end += m_grid_columns[i].base_size;
  1559. for (int i = 0; i < row_start; i++)
  1560. y_start += m_grid_rows[i].base_size;
  1561. for (int i = 0; i < row_end; i++)
  1562. y_end += m_grid_rows[i].base_size;
  1563. child_box_state.set_content_width((x_end - x_start));
  1564. child_box_state.set_content_height((y_end - y_start));
  1565. child_box_state.offset = { x_start, y_start };
  1566. auto available_space_for_children = AvailableSpace(AvailableSize::make_definite(child_box_state.content_width()), AvailableSize::make_definite(child_box_state.content_height()));
  1567. if (auto independent_formatting_context = layout_inside(child_box, LayoutMode::Normal, available_space_for_children))
  1568. independent_formatting_context->parent_context_did_dimension_child_root_box();
  1569. };
  1570. for (auto& positioned_box : m_positioned_boxes) {
  1571. auto resolved_row_start = box.computed_values().row_gap().is_auto() ? positioned_box.row : positioned_box.row * 2;
  1572. auto resolved_row_span = box.computed_values().row_gap().is_auto() ? positioned_box.row_span : positioned_box.row_span * 2;
  1573. if (!box.computed_values().row_gap().is_auto() && resolved_row_start == 0)
  1574. resolved_row_span -= 1;
  1575. if (resolved_row_start + resolved_row_span > static_cast<int>(m_grid_rows.size()))
  1576. resolved_row_span = m_grid_rows.size() - resolved_row_start;
  1577. auto resolved_column_start = box.computed_values().column_gap().is_auto() ? positioned_box.column : positioned_box.column * 2;
  1578. auto resolved_column_span = box.computed_values().column_gap().is_auto() ? positioned_box.column_span : positioned_box.column_span * 2;
  1579. if (!box.computed_values().column_gap().is_auto() && resolved_column_start == 0)
  1580. resolved_column_span -= 1;
  1581. if (resolved_column_start + resolved_column_span > static_cast<int>(m_grid_columns.size()))
  1582. resolved_column_span = m_grid_columns.size() - resolved_column_start;
  1583. layout_box(
  1584. resolved_row_start,
  1585. resolved_row_start + resolved_row_span,
  1586. resolved_column_start,
  1587. resolved_column_start + resolved_column_span,
  1588. positioned_box.box);
  1589. }
  1590. CSSPixels total_y = 0;
  1591. for (auto& grid_row : m_grid_rows)
  1592. total_y += grid_row.base_size;
  1593. m_automatic_content_height = total_y;
  1594. }
  1595. CSSPixels GridFormattingContext::automatic_content_height() const
  1596. {
  1597. return m_automatic_content_height;
  1598. }
  1599. bool GridFormattingContext::is_auto_positioned_row(CSS::GridTrackPlacement const& grid_row_start, CSS::GridTrackPlacement const& grid_row_end) const
  1600. {
  1601. return is_auto_positioned_track(grid_row_start, grid_row_end);
  1602. }
  1603. bool GridFormattingContext::is_auto_positioned_column(CSS::GridTrackPlacement const& grid_column_start, CSS::GridTrackPlacement const& grid_column_end) const
  1604. {
  1605. return is_auto_positioned_track(grid_column_start, grid_column_end);
  1606. }
  1607. bool GridFormattingContext::is_auto_positioned_track(CSS::GridTrackPlacement const& grid_track_start, CSS::GridTrackPlacement const& grid_track_end) const
  1608. {
  1609. return grid_track_start.is_auto_positioned() && grid_track_end.is_auto_positioned();
  1610. }
  1611. CSSPixels GridFormattingContext::get_free_space_x(AvailableSpace const& available_space)
  1612. {
  1613. // https://www.w3.org/TR/css-grid-2/#algo-terms
  1614. // free space: Equal to the available grid space minus the sum of the base sizes of all the grid
  1615. // tracks (including gutters), floored at zero. If available grid space is indefinite, the free
  1616. // space is indefinite as well.
  1617. // FIXME: do indefinite space
  1618. if (!available_space.width.is_definite())
  1619. return 0;
  1620. CSSPixels sum_base_sizes = 0;
  1621. for (auto& grid_column : m_grid_columns)
  1622. sum_base_sizes += grid_column.base_size;
  1623. return max(CSSPixels(0), available_space.width.to_px() - sum_base_sizes);
  1624. }
  1625. CSSPixels GridFormattingContext::get_free_space_y(Box const& box)
  1626. {
  1627. // https://www.w3.org/TR/css-grid-2/#algo-terms
  1628. // free space: Equal to the available grid space minus the sum of the base sizes of all the grid
  1629. // tracks (including gutters), floored at zero. If available grid space is indefinite, the free
  1630. // space is indefinite as well.
  1631. CSSPixels sum_base_sizes = 0;
  1632. for (auto& grid_row : m_grid_rows)
  1633. sum_base_sizes += grid_row.base_size;
  1634. auto& box_state = m_state.get_mutable(box);
  1635. if (box_state.has_definite_height())
  1636. return max(CSSPixels(0), CSSPixels(absolute_content_rect(box, m_state).height()) - sum_base_sizes);
  1637. return -1;
  1638. }
  1639. int GridFormattingContext::get_line_index_by_line_name(String const& needle, CSS::GridTrackSizeList grid_track_size_list)
  1640. {
  1641. if (grid_track_size_list.track_list().size() == 0)
  1642. return -1;
  1643. auto repeated_tracks_count = 0;
  1644. for (size_t x = 0; x < grid_track_size_list.track_list().size(); x++) {
  1645. if (grid_track_size_list.track_list()[x].is_repeat()) {
  1646. // FIXME: Calculate amount of columns/rows if auto-fill/fit
  1647. if (!grid_track_size_list.track_list()[x].repeat().is_default())
  1648. return -1;
  1649. auto repeat = grid_track_size_list.track_list()[x].repeat().grid_track_size_list();
  1650. for (size_t y = 0; y < repeat.track_list().size(); y++) {
  1651. for (size_t z = 0; z < repeat.line_names()[y].size(); z++) {
  1652. if (repeat.line_names()[y][z] == needle)
  1653. return x + repeated_tracks_count;
  1654. repeated_tracks_count++;
  1655. }
  1656. }
  1657. } else {
  1658. for (size_t y = 0; y < grid_track_size_list.line_names()[x].size(); y++) {
  1659. if (grid_track_size_list.line_names()[x][y] == needle)
  1660. return x + repeated_tracks_count;
  1661. }
  1662. }
  1663. }
  1664. for (size_t y = 0; y < grid_track_size_list.line_names()[grid_track_size_list.track_list().size()].size(); y++) {
  1665. if (grid_track_size_list.line_names()[grid_track_size_list.track_list().size()][y] == needle)
  1666. return grid_track_size_list.track_list().size() + repeated_tracks_count;
  1667. }
  1668. return -1;
  1669. }
  1670. OccupationGrid::OccupationGrid(int column_count, int row_count)
  1671. {
  1672. Vector<bool> occupation_grid_row;
  1673. for (int column_index = 0; column_index < max(column_count, 1); column_index++)
  1674. occupation_grid_row.append(false);
  1675. for (int row_index = 0; row_index < max(row_count, 1); row_index++)
  1676. m_occupation_grid.append(occupation_grid_row);
  1677. }
  1678. OccupationGrid::OccupationGrid()
  1679. {
  1680. }
  1681. void OccupationGrid::maybe_add_column(int needed_number_of_columns)
  1682. {
  1683. if (needed_number_of_columns <= column_count())
  1684. return;
  1685. auto column_count_before_modification = column_count();
  1686. for (auto& occupation_grid_row : m_occupation_grid)
  1687. for (int idx = 0; idx < needed_number_of_columns - column_count_before_modification; idx++)
  1688. occupation_grid_row.append(false);
  1689. }
  1690. void OccupationGrid::maybe_add_row(int needed_number_of_rows)
  1691. {
  1692. if (needed_number_of_rows <= row_count())
  1693. return;
  1694. Vector<bool> new_occupation_grid_row;
  1695. for (int idx = 0; idx < column_count(); idx++)
  1696. new_occupation_grid_row.append(false);
  1697. for (int idx = 0; idx < needed_number_of_rows - row_count(); idx++)
  1698. m_occupation_grid.append(new_occupation_grid_row);
  1699. }
  1700. void OccupationGrid::set_occupied(int column_start, int column_end, int row_start, int row_end)
  1701. {
  1702. for (int row_index = 0; row_index < row_count(); row_index++) {
  1703. if (row_index >= row_start && row_index < row_end) {
  1704. for (int column_index = 0; column_index < column_count(); column_index++) {
  1705. if (column_index >= column_start && column_index < column_end)
  1706. set_occupied(column_index, row_index);
  1707. }
  1708. }
  1709. }
  1710. }
  1711. void OccupationGrid::set_occupied(int column_index, int row_index)
  1712. {
  1713. m_occupation_grid[row_index][column_index] = true;
  1714. }
  1715. bool OccupationGrid::is_occupied(int column_index, int row_index)
  1716. {
  1717. return m_occupation_grid[row_index][column_index];
  1718. }
  1719. }