1.0.0-beta.5

This release adds a new AI component family to @heroui-pro/react: composable primitives for chat conversations, prompt composers, attachments, markdown, code blocks, citations, tool calls, and reasoning traces. It also refreshes the Chat template around those primitives and updates HeroUI OSS peer dependencies to 3.1.0.

⚠️ Breaking change: @heroui/react and @heroui/styles peer dependency minimums are now >=3.1.0.

What's New

AI Components

14 new components are available in the new AI category:

• PromptInput - Composable prompt composer with attachments, toolbar slots, send/stop states, inline layout, and queued prompts
• PromptSuggestion - Suggested prompts and starter actions for empty states
• ChatConversation - Stick-to-bottom conversation viewport with optional jump-to-bottom control
• ChatMessage - Assistant and user message layouts with avatars, bubbles, markdown, actions, and attachments
• ChatMessageActions - Copy, retry, rating, share, or custom message actions
• ChatAttachment - File previews, attachment groups, and composer file input helpers
• ChatListView - Thread list rows for sidebars and conversation pickers
• ChatLoader - Dots, pulse, spinner, and skeleton loaders for assistant responses
• Markdown - AI response markdown with memoized streaming blocks and StreamMarkdown
• CodeBlock - Shiki-highlighted code blocks with language labels and copy actions
• ChainOfThought - Collapsible reasoning timeline for progress, traces, and assistant thinking
• ChatSource - URL/document citation chips and grouped source lists
• ChatTool - Tool-call cards for inputs, outputs, errors, approvals, and grouped tool activity
• TextShimmer - Shimmering status text for streaming and background work

The components are intentionally primitive and composable. You can wire them to any AI runtime, including the AI SDK, a custom backend, or a static chat template.

import {ChatConversation, ChatMessage, Markdown, PromptInput} from "@heroui-pro/react";

<>
  <ChatConversation>
    <ChatConversation.Content>
      <ChatMessage.Assistant>
        <ChatMessage.Avatar fallback="AI" show />
        <ChatMessage.Body>
          <ChatMessage.Content>
            <Markdown>{assistantResponse}</Markdown>
          </ChatMessage.Content>
        </ChatMessage.Body>
      </ChatMessage.Assistant>
    </ChatConversation.Content>
    <ChatConversation.ScrollAnchor />
  </ChatConversation>

  <PromptInput value={value} onSubmit={send} onValueChange={setValue}>
    <PromptInput.Shell>
      <PromptInput.Content>
        <PromptInput.TextArea placeholder="Ask anything..." />
      </PromptInput.Content>
      <PromptInput.Toolbar>
        <PromptInput.ToolbarStart>{/* actions */}</PromptInput.ToolbarStart>
        <PromptInput.ToolbarEnd>
          <PromptInput.Send />
        </PromptInput.ToolbarEnd>
      </PromptInput.Toolbar>
    </PromptInput.Shell>
  </PromptInput>
</>;

PromptInput Queue

PromptInput.Queue adds a compact queued-prompt surface above the composer. It supports Motion-powered reordering, hover actions, attachment indicators, and clamped multi-line prompt previews.

Markdown, Code, Sources, and Tools

AI answers can now be built from focused response primitives:

• Markdown renders response markdown with block-level memoization so streaming updates only re-render changed blocks
• StreamMarkdown wraps Streamdown for incomplete markdown repair, animation, and caret rendering
• CodeBlock uses Shiki for highlighted code and includes a copy button with copied-state feedback
• ChatSource and ChatSources support URL citations, document citations, grouped sources, hover previews, and stacked favicons
• ChatTool and ChatToolGroup support streaming, running, complete, error, and approval states

Chat Template Refresh

The Chat template now uses the new AI components directly. The composer was rebuilt with PromptInput, attachments use ChatAttachment, assistant messages use Markdown, ChainOfThought, ChatSource, and ChatTool, and the template includes richer demo threads for markdown, tools, sources, loading states, and message actions.

The template also gained shared strings, safer attachment URL cleanup, refreshed library/explore pages, and updated package versions for the latest HeroUI stack.

AI Docs

Every AI component has full docs, Storybook coverage, demos, CSS class references, and API tables. The All Components page now includes the AI category so the new primitives are discoverable alongside charts, forms, navigation, and data-display components.

Improvements

• HeroUI OSS 3.1.0 - @heroui/react and @heroui/styles dev and peer dependencies now target 3.1.0
• Rating - Read-only ratings no longer expose hidden radio inputs to pointer interaction or focus outlines
• Navbar - Static mobile menus now position against the navbar and avoid horizontal overflow
• Widget - Header height now supports taller or wrapping header content without clipping
• Mouve theme - Success, warning, and danger tones were tuned for better light/dark contrast
• Build output - Removed terser pure annotation preservation from the React package build output

Dependencies

Added runtime dependencies for the AI response renderer and code highlighting:

• marked
• react-markdown
• remark-breaks
• remark-gfm
• shiki
• streamdown

Breaking Changes

Peer dependency minimums bumped

@heroui/react and @heroui/styles now require >=3.1.0:

- "@heroui/react": ">=3.0.5"
- "@heroui/styles": ">=3.0.5"
+ "@heroui/react": ">=3.1.0"
+ "@heroui/styles": ">=3.1.0"

Update both packages together:

npm install @heroui/react@latest @heroui/styles@latest

Upgrade

npx heroui-pro

Select Update HeroUI Pro React to x.x.x (latest) from the interactive menu.