💡 Stretch sizing (fill the cross axis)

[natemoo-re]

Is your feature request related to a problem?

There's no sizing mode that fills the cross axis. grow() expands a child along the container's main axis, but on the cross axis a child only ever sizes to its content (fit) unless you hardcode a fixed(). In a top-to-bottom container 12 cells wide, a fit-content child holding X computes width: 1—there's no way to say "fill the container's width" so it spans all 12.

Describe the solution you'd like

A stretch() sizing axis, sibling to grow() / fit() / fixed(), that expands the element to fill the available cross-axis space:

open("child", {
  layout: {
    width: stretch(),
    height: fixed(3),
  },
});

The name is stretch (not grow, which is main-axis flex-grow, nor fill)—it's the cross-axis analog, matching the CSS width: stretch sizing keyword. Flexbox also expresses the same fill behavior as align-self: stretch, so this is the sizing-side counterpart to per-child align-self (#70). A stretch width in a ttb container makes the child span the full container width.

Describe alternatives you've considered

Setting width: fixed(containerWidth) works only when the container size is known and static—it hardcodes the dimension, breaks on resize, and can't follow a grow/fit parent. The renderer already knows the cross-axis extent at layout time; stretch just opts the child into it.

Additional context

Failing test case on nm/repro/stretch-sizing (test · diff).

decode_axis (src/clayterm.c:365) handles only FIT / GROW / PERCENT / FIXED; this needs a new stretch axis type there, a stretch() helper and packAxis case in ops.ts, and the cross-axis grow applied in the layout pass.