[scasella]

In the desktop app, a Flightdeck pane narrower than 40 columns had the right side of every box cut off: the main box, the receipt, the log and the connector lines.

Cause

The pane drew at Math.max(40, e.props.bodyColumns). On a remote surface, bodyColumns is the pane's width over its code font's character width (host types, RenderViewport), so a narrow desktop pane reports fewer than 40 and the drawing ran 40 wide. A terminal dock can be as narrow as 24 ($.ui.open docs), so the terminal had the same problem. This dates from 0.4.0.

Change

The pane now draws at the body's real width, down to 24, the narrowest dock Claude Code seats. Each panel fits there:

• Title rows (main, architect, gate): the left side truncates and the right side stays whole, instead of wrapping onto a second line.
• Below 40 columns:
  • The agents header reads agents · 2/3.
  • Lanes narrow their label below 34 columns and their bar below 36.
  • Other loops reads loops 4 · 1 active.
  • The session log keeps HH:MM and a 9-cell name column.
  • The inline summary's agent rows narrow their title.
• Gate buttons: the file, shell and other buttons wrap onto a second line rather than run past the box. They already overflowed at exactly 40 columns with a drill-down open.
• Time axis: the agents' SVG time axis has no fixed pixel size, so it scales down to a narrow pane instead of running past it at 520px. Per the host's SvgProps, it takes the markup's own width, capped at the pane's.

From 40 columns up the drawing is unchanged. I dumped every visible Text and Button of a busy session on main and on this branch: all four surfaces, both placements, at 40, 41, 52, 64, 86 and 120 columns, with and without a drill-down and an expanded card open. All 96 renderings match line for line.

Tests

The test kit lays nothing out, so the new tests add a small width check over the drawn tree. It works out the fewest cells each element needs without spilling:

• a truncating Text, or a Box that clips, needs none;
• a Text that asks to wrap needs its longest word;
• any other Text needs its whole length;
• a plain Button with a hotkey needs 3 more cells than its label.

It then fails any Box whose contents need more cells than its width.

• Every width: a busy session at every width from 24 to 40, and at 64 and 120, on all four surfaces and both placements. The session has every panel populated, a drill-down open, an expanded card, and a running turn. On main it fails at every width below 40, and the per-panel failures it reported are what this PR fixes.
• Single card: one agent card from 24 to 40 columns, plus a check that the time axis has no fixed pixel size.
• Reverting the 24-column floor, the lane sizing, the gate-button wrap or the SVG size each fails a test.

Checks

• claude plugin validate . passes (the only warning is the missing icon, which was already there).
• claude plugin test .: 48 pass.
• npx -p typescript tsc -p .: clean against the 2.1.309 declarations.
• Not checked on screen yet. The width check approximates layout in cells, and the desktop app draws text in a proportional font, so a look at a narrow desktop pane is still worth doing before release.

CONTRIBUTING's narrow-pane rule now says 24, 40, 64 and 120 columns. #15 also adds a line to CONTRIBUTING.md, so whichever of the two merges second may need that line rebased.

🤖 Generated with Claude Code