Codex Message

1import * as React from "react";
2import { cn } from "@/lib/utils";
3 
4/**
5 * CodexMessage — a Codex turn. User prompts show a bold `›` marker (default
6 * foreground — not cyan); the assistant reply is plain text.
7 */
8export function CodexMessage({
9  role = "assistant",
10  className,
11  children,
12}: {
13  role?: "user" | "assistant";
14  className?: string;
15  children: React.ReactNode;
16}) {
17  if (role === "user") {
18    return (
19      <div
20        className={cn(
21          "flex min-w-0 gap-2 font-mono text-[13px] leading-[1.6] text-[#ededed]",
22          className,
23        )}
24      >
25        <span aria-hidden className="shrink-0 font-bold">
26          ›
27        </span>
28        <span className="min-w-0 flex-1 break-words">{children}</span>
29      </div>
30    );
31  }
32  return (
33    <div
34      className={cn("font-mono text-[13px] leading-[1.6] text-[#c9c9c9]", className)}
35    >
36      {children}
37    </div>
38  );
39}