#20433 Agent composer: bigger image thumbnails in their own shape, with a clear edge

Leo's dogfood bug (19), a follow-up to (5) in #20378: dark screenshot thumbnails in the composer were still tiny and nearly invisible.

Cause: thumbnail() cropped every image to a centered 112 px square, drawn at 56 px. A wide screenshot became a sliver of its text. The edge was a 0.5 px hairline in the border color, which disappears on a dark composer, especially on Retina.

Fix:

• Image chips are 80 px tall and keep the image's own shape. Aspect ratios between 0.7:1 and 2:1 show uncropped; anything wider or taller is center-cropped to those bounds, and the width is held between 56 and 160 px. The thumbnail is drawn at 2× (160 px tall).
• The edge is a 1 px line in the theme's text color at 45%, drawn over the image. It stands out from both a dark image and the composer, in dark and light themes.

Test (red → green): CMUX_BROWSER_TESTS=1 bun test test/agent-pane-attach-typing.test.ts in Chromium. Three pasted 1200×800 near-black screenshots must each be:

• ≥ 72 px tall;
• wider than 1.3:1;
• edged by pixels that differ by > 45 luminance from both the composer around the chip and the image's middle.

Results:

• Red at the test commit: height 56, expected ≥ 72. The old edge measured 65 against a composer at 34, a margin of 31, below the new bar of 45.
• Green after the fix, three runs, and also passing in local WebKit (run with the engine swapped). The img has an explicit 80 px height so WebKit sizes its width from the image shape, as the review suggested. bun run check, ui-rules, theme-colors and tooltip-rules pass.

Changelog

• Fixed: Image thumbnails in the agent composer are larger, keep the screenshot's shape, and have a visible edge on dark images.

🤖 Generated with Claude Code