TUI 間隔最適化 PR2 — 半行カラーバンドとコンパクトな間隔
背景
PR1 では、ツールグループ内の不要な空行を削除することで、TUI の垂直間隔を第一段階として詰めました。しかし、実際の利用においては、まだ2つの体験上の問題が残っています：
- ユーザーメッセージとアシスタントの応答の間に視覚的な区切りがない — 長い会話の中で、「自分の質問がどこから始まるか」を素早く特定するのが難しい
- ブロック間の間隔がまだ大きい — 質問と応答が交互になる部分にそれぞれ1行の空白があり、画面スペースを無駄にしている
今回の変更
1. ユーザーメッセージの半行カラーバンド
ユーザーメッセージの上下にそれぞれ半分の高さの淡い色の線を追加し、コンテンツ領域には同じ色の backgroundColor を設定して、3層のシームレスなカラーバンドを形成します：
▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄ ← foreground = bandColor（下半分を着色）
> ユーザーの質問内容 ← backgroundColor = bandColor（行全体の背景）
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ ← foreground = bandColor（上半分を着色）- 色は
subtleBandColor()を介して計算されます：背景色を基準に明度の6%のオフセットを行います（ダークターミナル → やや明るく、ライトターミナル → やや暗く）。色相の変化は導入しません - 24ビットカラーをサポートしないターミナル / スクリーンリーダー /
NO_COLOR環境では、自動的に通常の表示（marginTop=1）にフォールバックします - 負の幅 / 幅ゼロに対する安全保護
2. 質問と応答の間隔を詰める
| 位置 | 変更前 | 変更後 |
|---|---|---|
| ユーザーメッセージの上方 | 1行の空白 | 0（カラーバンドによる視覚的な区切りを提供。フォールバック時は marginTop=1 を維持） |
| モデル出力の上方 | 1行の空白 | 1行の空白（思考プロセスと最終出力を区別するために維持） |
| ツール呼び出し / ステータスメッセージの上方 | 1行の空白 | 0 |
| 思考テキストの末尾 | 余分な改行がある可能性 | trimEnd() により2重の空行を回避 |
同じ会話ラウンド内の「応答 → ツール呼び出し → 応答」のシーケンスには不要な空行がなくなり、情報がよりコンパクトで一貫性を持つようになります。
効果の比較
変更前：
（1行空白）
> package.json を読み取って
（1行空白）
✦ はい、ファイルを読み取ります。
（1行空白）
┌ Read package.json ─────────┐
│ ✓ Read package.json │
└────────────────────────────┘
（1行空白）
✦ ファイルの内容は以下の通りです：...
（1行空白）
┌─ 入力ボックス ──────────────┐変更後：
▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄
> package.json を読み取って
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
✦ はい、ファイルを読み取ります。
┌ Read package.json ─────────┐
│ ✓ Read package.json │
└────────────────────────────┘
（1行空白）
✦ ファイルの内容は以下の通りです：...
（1行空白）
┌─ 入力ボックス ──────────────┐変更なし
- ツール呼び出しのボーダースタイルは変更なし
- Markdown 本文の段落間隔は変更なし（1行はすでにターミナルの最小単位であるため）
- ダーク / ライトテーマのカラーコードは変更なし
- 入力エリア（Composer）の間隔は
marginTop=1のまま変更なし
Last updated on