Pin the composer prompt stack to a single-column grid track so one wide card stops dragging the rest off-screen

[vburojevic]

What was wrong

The stack of cards above the composer is laid out as a bare grid gap-2 (FollowUpPromptBox.tsx:861), so every card lands in an implicit auto column. An auto column's base size is the widest item's min-content width, and justify-items: stretch then hands that width to every other card. One wide card therefore takes the entire stack off-screen with it — on a phone, all of it.

The cards are not at fault. A row built as min-w-0 flex-1 truncate still reports its full untruncated string as its min-content contribution, because white-space: nowrap makes min-content equal max-content and the truncation only bites once the parent hands the row a definite width. Under intrinsic sizing there is no such width, so the guard never engages.

Measured on a real thread at a 402px viewport, before the change — container 370px, every card 1354px:

card	rendered	min-content
Routing rule (plugin banner)	1354px	1354
Queued messages	1354px	1343
Xcode activity (plugin banner)	1354px	507
Background commands	1354px	485
Active workflows	1354px	281
Thread context	1354px	235

Queued messages and Background commands are first-party cards, both over the 370px budget on their own, so this reproduces with no plugins installed at all. The plugin banners are along for the ride.

What changed

• banner/PromptStackCard.tsx — new exported PROMPT_STACK_TRACK_CLASS (grid-cols-[minmax(0,1fr)]), with the reasoning above recorded next to it. It sits with the other stack chrome constants since it describes the track those cards are laid on.
• FollowUpPromptBox.tsx — applied to both banner stacks (the composer stack at :861 and the stack-only variant at :280).
• NewThreadPromptBox.tsx — applied to the new-thread banner stack, which has the same shape.

No behavior change beyond the track: cards are now handed a definite width, and each one's existing truncation does the rest. No wire, CLI, or doc surface is touched.

How you verified

• Regression test — FollowUpPromptBox.test.tsx asserts the banner stack carries an explicit single-column track. Fails before (expected 'grid gap-2' to contain 'grid-cols-[minmax(0,1fr)]'), passes after. jsdom has no layout engine, so the test guards the declaration; the geometry was verified in a real browser, below.
• Real-browser measurement — drove the running app headlessly at a 402px viewport and read the live DOM. Before: stack container 370px, all six cards 1354px, Xcode activity and Routing rule text running past the viewport edge with no ellipsis. After injecting grid-template-columns: minmax(0, 1fr): every card 370px, right edge at 386px, and each card's own truncation engages (Building Argus · Argus iPhone · iOS latest · m… 54s).
• pnpm exec turbo run typecheck --filter=@bb/app — clean.
• pnpm exec turbo run test --filter=@bb/app — 431 files, 3358 passed, 3 skipped.
• oxfmt --check — clean on all four files.

AGENT GENERATED