Terminal

The Codex window with a title bar, a scrolling transcript and a pinned composer.

import { CodexMessage } from "../components/codex-message";
import { CodexTerminal } from "../components/codex-terminal";

export default function CodexTerminalExample() {
  return (
    <div className="w-full p-6">
      <CodexTerminal title="codex — ~/acme/web">
        <CodexMessage>Any Codex content goes here.</CodexMessage>
      </CodexTerminal>
    </div>
  );
}

$ bunx --bun shadcn@latest add @notra/codex-terminal

CodexTerminal is a shadcn Card. The title bar is a CardHeader, the transcript scrolls in a ScrollArea, and footer stays pinned under it like the Codex prompt. Rows run edge to edge, so user turns and the composer draw full-width bands. It accepts every Card prop.

Prop	Default	Description
`title`		Text centered in the title bar, like `codex — ~/acme/web`.
`footer`		Pinned below the transcript. Usually a `CodexComposer`.

Used in

Codex

A full recreation of an OpenAI Codex CLI session, from the banner to the pinned prompt.