Badge component displaying agent identity with color-coded styling.

Renders a pill-shaped badge with agent avatar/initial and name, using colors from AGENT_COLORS for visual distinction. Supports three size presets (sm, md, lg) and active/inactive states.

When isActive is true, applies the agent’s brand colors; otherwise uses neutral gray styling. The optional pulse animation (via showPulse) provides real-time feedback during agent activity.

Avatar display prioritizes avatarUrl if provided, otherwise renders the first character of the agent name as a circular initial badge.

Used by AgentSwitcher for multi-agent conversations to indicate which agent is responding.

Example

<AgentBadge
  agentId="code"
  agentName="Code Assistant"
  isActive
  showPulse={isStreaming}
  size="md"
/>

function AgentBadge(props: AgentBadgeProps): React.ReactElement

Parameters

props