Let a nick give way in the people panel
The panel is 150 points wide and every row in it is a fixed mode slot and a nick. In a Flutter Row a button asks for the width of its label and gets it whether or not the row has it, so any nick longer than the remainder painted its lozenge past the right edge and struck the row through with the overflow stripes. So a button in a row is loosely flexible, the way prose already is: it still takes its natural width wherever the row has it, and gives way only where the row does not. What it gives way to is an ellipsis — a label with nowhere to go has to end somewhere, and a nick wrapped down the middle inside a lozenge is not a button any more. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
f50db56 parent: 95d91a2 modified
flutter/src/frq/hiccup.cljd +27 -2 | @@ -295,6 +295,18 @@ | ||
| 295 | 295 | (conj! acc (m/Expanded .child (render n))) |
| 296 | 296 | (and (identical? fills? fills-row?) (flexes-in-row? n)) |
| 297 | 297 | (conj! acc (m/Flexible .child (render n))) |
| 298 | + ;; A button in a row is loosely flexible for the same | |
| 299 | + ;; reason prose is, and it is the people panel that says | |
| 300 | + ;; so: that column is `users-width` wide and every row in | |
| 301 | + ;; it is a mode slot and a nick, so any nick longer than | |
| 302 | + ;; the remainder painted its lozenge off the right edge | |
| 303 | + ;; and struck the row through with Flutter's overflow | |
| 304 | + ;; stripes. Loose rather than Expanded — a button asks for | |
| 305 | + ;; the width of its label and gets it whenever the row has | |
| 306 | + ;; it, and only gives way when the row has not. | |
| 307 | + (and (identical? fills? fills-row?) | |
| 308 | + (vector? n) (= :button (first n))) | |
| 309 | + (conj! acc (m/Flexible .child (render n))) | |
| 298 | 310 | :else (conj! acc (render n))))) |
| 299 | 311 | (transient []) nodes))) |
| 300 | 312 | |
| @@ -343,8 +355,21 @@ | ||
| 343 | 355 | .child (m/Padding |
| 344 | 356 | .padding (m/EdgeInsets.symmetric .horizontal t/space-s |
| 345 | 357 | .vertical t/space-xxs) |
| 346 | - .child (txt ctx (:label p "") t/text-body fg | |
| 347 | - :weight m/FontWeight.w500)))))) | |
| 358 | + ;; Ellipsis and no wrap: a label wider than the row it | |
| 359 | + ;; is in has to end somewhere, and a nick broken across | |
| 360 | + ;; two lines inside a lozenge is not a button any more. | |
| 361 | + ;; It only ever comes up because `flexed` below hands a | |
| 362 | + ;; button a bounded width — unbounded, this changes | |
| 363 | + ;; nothing. | |
| 364 | + .child (m/Text (str (:label p "")) | |
| 365 | + .maxLines 1 | |
| 366 | + .softWrap false | |
| 367 | + .overflow m/TextOverflow.ellipsis | |
| 368 | + .style (m/TextStyle | |
| 369 | + .fontSize t/text-body | |
| 370 | + .color fg | |
| 371 | + .height 1.35 | |
| 372 | + .fontWeight m/FontWeight.w500))))))) | |
| 348 | 373 | |
| 349 | 374 | ;; ----------------------------------------------------------------- widget |
| 350 | 375 | |
| @@ -295,6 +295,18 @@ | |||
| 295 | (conj! acc (m/Expanded .child (render n))) | 295 | (conj! acc (m/Expanded .child (render n))) |
| 296 | (and (identical? fills? fills-row?) (flexes-in-row? n)) | 296 | (and (identical? fills? fills-row?) (flexes-in-row? n)) |
| 297 | (conj! acc (m/Flexible .child (render n))) | 297 | (conj! acc (m/Flexible .child (render n))) |
| 298 | + ;; A button in a row is loosely flexible for the same | ||
| 299 | + ;; reason prose is, and it is the people panel that says | ||
| 300 | + ;; so: that column is `users-width` wide and every row in | ||
| 301 | + ;; it is a mode slot and a nick, so any nick longer than | ||
| 302 | + ;; the remainder painted its lozenge off the right edge | ||
| 303 | + ;; and struck the row through with Flutter's overflow | ||
| 304 | + ;; stripes. Loose rather than Expanded — a button asks for | ||
| 305 | + ;; the width of its label and gets it whenever the row has | ||
| 306 | + ;; it, and only gives way when the row has not. | ||
| 307 | + (and (identical? fills? fills-row?) | ||
| 308 | + (vector? n) (= :button (first n))) | ||
| 309 | + (conj! acc (m/Flexible .child (render n))) | ||
| 298 | :else (conj! acc (render n))))) | 310 | :else (conj! acc (render n))))) |
| 299 | (transient []) nodes))) | 311 | (transient []) nodes))) |
| 300 | 312 | ||
| @@ -343,8 +355,21 @@ | |||
| 343 | .child (m/Padding | 355 | .child (m/Padding |
| 344 | .padding (m/EdgeInsets.symmetric .horizontal t/space-s | 356 | .padding (m/EdgeInsets.symmetric .horizontal t/space-s |
| 345 | .vertical t/space-xxs) | 357 | .vertical t/space-xxs) |
| 346 | - .child (txt ctx (:label p "") t/text-body fg | 358 | + ;; Ellipsis and no wrap: a label wider than the row it |
| 347 | - :weight m/FontWeight.w500)))))) | 359 | + ;; is in has to end somewhere, and a nick broken across |
| 360 | + ;; two lines inside a lozenge is not a button any more. | ||
| 361 | + ;; It only ever comes up because `flexed` below hands a | ||
| 362 | + ;; button a bounded width — unbounded, this changes | ||
| 363 | + ;; nothing. | ||
| 364 | + .child (m/Text (str (:label p "")) | ||
| 365 | + .maxLines 1 | ||
| 366 | + .softWrap false | ||
| 367 | + .overflow m/TextOverflow.ellipsis | ||
| 368 | + .style (m/TextStyle | ||
| 369 | + .fontSize t/text-body | ||
| 370 | + .color fg | ||
| 371 | + .height 1.35 | ||
| 372 | + .fontWeight m/FontWeight.w500))))))) | ||
| 348 | 373 | ||
| 349 | ;; ----------------------------------------------------------------- widget | 374 | ;; ----------------------------------------------------------------- widget |
| 350 | 375 | ||