[FEATURE] Desktop composer reserves a full-height right gutter, costing ~4 characters per wrapped line

Status Open
Reported on v2.1.220
Maintainer reply None cached
Activity 0 comments · opened Jul 27, 2026

Preflight Checklist

  • [x] I have searched existing requests and this feature hasn't been requested yet
  • [x] This is a single feature request (not multiple features)

Problem Statement

The Claude Code desktop app composer (webview, not the terminal TUI)
wraps text ~34px earlier than its left padding would imply. The gap is
present on every wrapped line, not only the last one, even though the
submit hint occupies just the bottom-right corner.

Measured at the pixel level from screenshots, using an identical input in
both clients: one unbroken run of d characters, so that wrapping is
character-level and there are no break opportunities to confound the
result.

| Client | Inner box width | Left pad | Right gap | Char width |
|-------------|-----------------|----------|-----------|------------|
| claude.ai | 671px | 21px | 17px | ~10px |
| Claude Code | 766px | 11px | 45px | ~9px |

Every wrapped line in Claude Code terminates at the identical x offset,
which rules out ragged-right wrapping and points to a fixed reserved
gutter. The hint sits at x=783..810, leaving 18px of clearance beyond
where text already stops.

A separate test using a string containing \ break opportunities showed a
49px right gap, consistent with the same reserved gutter plus ordinary
wrap raggedness.

Net cost: ~34px, roughly 4 characters or 4.4% of usable width, on every
wrapped line.

Proposed Solution

Right padding should match left padding on all lines except the last,
which is the only line needing clearance for the affordance.

Two approaches that would recover the width:

  1. Float a zero-height spacer at the bottom-right and apply shape-outside

so only the final line flows around the hint icon.

  1. Take the hint icon out of the text flow entirely and place the composer

controls on their own row — which is what the claude.ai web composer
already does, and why its left/right padding comes out balanced at
21px/17px.

Either way the fix is confined to composer CSS and should not affect the
TUI.

Alternative Solutions

No user-facing workaround exists — the padding is not exposed through any
setting, and widening the window scales the gutter along with everything
else rather than eliminating it.

A more conservative variant would be to keep the reserved gutter but shrink
it to the icon's actual footprint (~27px including its own margin) instead
of 45px. That recovers part of the width without touching the layout model,
though it still penalises every line for a last-line affordance.

Priority

Low - Nice to have

Feature Category

Other

Use Case Example

The composer is where long, unbreakable strings get pasted and reviewed
before sending — file paths, stack traces, URLs, base64 blobs, log lines.
These are exactly the strings that wrap character-by-character rather than
at word boundaries, so they hit the reserved gutter on every single line.

Concrete scenario:

  1. Paste a 40-line stack trace into the composer to ask about it
  2. Scan it before sending to confirm the right trace was copied
  3. Each line loses its final ~4 characters to the wrap point, so long

frames break mid-token and reflow across an extra line

  1. The pane needs more scrolling to review the same content, and the

ragged right edge makes it harder to visually align repeated prefixes

The effect is small per line but compounds with paste length, and it is
most visible precisely when the composer is being used for its
highest-value case.

Additional Context

Environment

  • Claude Code (CLI): 2.1.220 (matches npm latest at time of filing)
  • Claude Desktop app: 1.24012.9
  • OS: macOS 26.4 (build 25E5218f), Apple Silicon (arm64)
  • Surface: desktop app — webview composer, not the terminal TUI

Steps to Reproduce

  1. Open the Claude Code desktop composer
  2. Paste 200+ consecutive d characters
  3. Observe the identical right-hand gap on every fully wrapped line
  4. Compare against the same input in the claude.ai web composer

Duplicate Search

Searched title matches for composer, padding, gutter,
input wrap width, and input box width. All hits are TUI-surface issues
(#30316, #7632, #7453) or unrelated. The closest thematic match is #38318
(padding consistency), but that concerns post-submit message rendering in
the TUI, not the desktop composer input. Filing as a separate surface.

Screenshots

Cropped to the input box borders; repo and branch chips removed. Green
marks left padding, red marks the right gap. Both panels show the identical
input string.

<img width="900" height="441" alt="Composer padding comparison" src="https://github.com/user-attachments/assets/6a5d1d5c-d221-4bda-8fb4-fa3e74b31e64" />

Raw, unannotated screenshots available on request.

View original on GitHub ↗