Walk me through the HeroUI Pro AI chat components.
Thinking...
Show me reasoning, markdown, and code highlighting.
AI

Here is a concise answer with markdown support:

ts
export type ChatStatus = "ready" | "streaming" | "submitted";
  • Presentation-only Pro components
  • Your app owns the message array and SDK wiring
  • Compose ChatMessage, Markdown, and ChainOfThought explicitly
Show me tool calls — streaming, grouped, and approval.

What if a tool needs approval?

{"to":"team@acme.com","subject":"Launch update"}
What do skeleton loaders look like while a reply is pending?
Show media and compact actions too.
AI

Assistant messages can include media and a minimal action set beneath the body.

Component architecture diagram placeholder
Show sources and file attachments.
dashboard-wireframe.png
What can you tell me about this wireframe?

The wireframe follows a familiar dashboard shell with a persistent sidebar, top bar, and a scrollable content region for cards and charts.

AI can make mistakes. Check important info.