Commit 9dbff05
Layout breaks when the first element has a different minWidth than the rest
Summary:
fixes react/yoga#2006
`distributeFreeSpaceFirstPass` decrements `totalFlexGrowFactors` /
`totalFlexShrinkScaledFactors` as it freezes items, but only reduces `remainingFreeSpace`
after the loop. Items after the first frozen one get an inflated fair share and freeze
spuriously. When the first item clamps, the whole line freezes and `remainingFreeSpace`
drains to 0, so the second pass has nothing to distribute and everything falls back to its
flex basis — a 540px row of three `flexGrow: 1` items with `maxWidth: 180` and minWidths
60/30/30 lays out as 60/30/30 instead of 180/180/180.
Snapshot both totals before the loop and divide by the snapshot. The first pass is then
iteration 1 of CSS Flexbox §9.7, and independent of child order.
Changelog:
[General][Fixed] - Fix a flex line collapsing to its minimum sizes when the first item clamps to its min or max main size
X-link: react/yoga#2021
Reviewed By: javache
Differential Revision: D119142409
Pulled By: pasqualeanatriello1 parent 25b6fd5 commit 9dbff05
1 file changed
Lines changed: 16 additions & 4 deletions
Lines changed: 16 additions & 4 deletions
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
1280 | 1280 | | |
1281 | 1281 | | |
1282 | 1282 | | |
| 1283 | + | |
| 1284 | + | |
| 1285 | + | |
| 1286 | + | |
| 1287 | + | |
| 1288 | + | |
| 1289 | + | |
| 1290 | + | |
| 1291 | + | |
| 1292 | + | |
| 1293 | + | |
| 1294 | + | |
| 1295 | + | |
1283 | 1296 | | |
1284 | 1297 | | |
1285 | 1298 | | |
| |||
1299 | 1312 | | |
1300 | 1313 | | |
1301 | 1314 | | |
1302 | | - | |
1303 | | - | |
| 1315 | + | |
1304 | 1316 | | |
1305 | 1317 | | |
1306 | 1318 | | |
| |||
1328 | 1340 | | |
1329 | 1341 | | |
1330 | 1342 | | |
1331 | | - | |
1332 | | - | |
| 1343 | + | |
| 1344 | + | |
1333 | 1345 | | |
1334 | 1346 | | |
1335 | 1347 | | |
| |||
0 commit comments