Home

17. Prompt Input and Message UI

Why the UI Layer Matters

The source tree has a surprisingly large number of files under components/PromptInput/ and components/messages/. That is a clue: the product experience is built through many specialized interaction components, not one generic text console.

Prompt Input Responsibilities

  • Input modes and placeholders
  • Footer hints, suggestions, queued command display
  • History search and stash notices
  • Sandbox and fast-mode hints
  • Voice and swarm indicators

Message Rendering Responsibilities

  • Separate components for assistant text, thinking, tool use, errors, plans, compact boundaries, and attachments
  • Specialized rendering for user tool results and tool failure states
  • Grouped displays for collapsed search/read operations
  • Different visual treatments for system, user, assistant, and background-agent events

Main Lesson

A strong terminal product invests heavily in interaction design. If you want your own CLI agent to feel usable rather than raw, this is the layer to study after you understand the execution core.

Source Navigation

Recommended Source Files

  • source/components/PromptInput
  • source/components/messages
  • source/ink/components/App.tsx
  • source/ink/hooks/use-input.ts
  • source/state/AppStateStore.ts

Next Files to Read

  • source/components/TrustDialog/TrustDialog.tsx
  • source/history.ts
  • source/ink/render-to-screen.ts

Related Chapters