Ant Design X

Active
GitHub TypeScript No License

Description

Ant Design X is an enterprise-grade React component library for AI conversation interfaces and intelligent agent experiences, with streaming Markdown and A2UI card rendering.

Key Features

  • RICH interaction paradigm components - atomic UI for AI conversation stages
  • Streaming Markdown renderer - high-performance streaming of formulas, code, and mermaid
  • A2UI dynamic card renderer - agents build interactive UIs from structured JSON streams
  • Utility SDK for data streams - connect to model agents and manage streaming out of the box
  • Skill library - pre-built Agent skills for rapid AI conversation development
  • Ant Design ecosystem integration - consistent design language and themeability

Use Cases

💡 Building an enterprise-grade AI chat product with Ant Design look and feel
💡 Rendering streaming Markdown responses with code highlighting and math formulas
💡 Letting agents emit dynamic interactive cards via A2UI JSON streams
💡 Composing a customer-support assistant with rich message components
💡 Bootstrapping AI applications with the bundled x-skill library

Tags

chat-ui react typescript markdown ant-design

Categories

💬 Chat UI

Quick Start

# Install the core components
npm install @ant-design/x
# Optional: streaming markdown and A2UI card renderer
npm install @ant-design/x-markdown @ant-design/x-card
# Utility SDK for data streams
npm install @ant-design/x-sdk

import { Bubble, Sender, Conversations } from "@ant-design/x";
import { XMarkdown } from "@ant-design/x-markdown";

export default function App() {
  return (
    <>
      <Conversations />
      <Bubble content="Hello! How can I help you today?" />
      <XMarkdown content={"Streaming **markdown** with `code`."} streaming />
      <Sender />
    </>
  );
}
Visit GitHub Visit Website View Docs

Related Projects