diff --git a/README.md b/README.md
index 994266983..eff94b45e 100644
--- a/README.md
+++ b/README.md
@@ -1,40 +1,104 @@
-# TinyRobot
+<div align="center">
 
-<p align="center">
-  <a href="https://opentiny.design" target="_blank" rel="noopener noreferrer">
-    <img alt="OpenTiny Logo" src="https://raw.githubusercontent.com/opentiny/tiny-robot/HEAD/logo.svg" height="100" style="max-width:100%;">
-  </a>
-</p>
+# 🤖 TinyRobot
 
+**The Vue 3 AI Chat Component Library — Build enterprise-grade AI conversations in minutes, not weeks.**
+
+[![GitHub Stars](https://img.shields.io/github/stars/opentiny/tiny-robot?style=social)](https://github.com/opentiny/tiny-robot/stargazers)
 [![npm version](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot)
+[![npm downloads](https://img.shields.io/npm/dw/@opentiny/tiny-robot)](https://www.npmjs.com/package/@opentiny/tiny-robot)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
+[![Vue 3](https://img.shields.io/badge/Vue-3.x-42b883.svg)](https://vuejs.org/)
+[![TypeScript](https://img.shields.io/badge/TypeScript-Ready-3178c6.svg)](https://www.typescriptlang.org/)
 
-**TinyRobot** is an AI component library built for Vue 3, following the OpenTiny Design system. It provides rich AI interaction components to help developers quickly build enterprise-level AI applications.
+[🚀 Live Demo](https://docs.opentiny.design/tiny-robot/examples/assistant) · [📖 Documentation](https://docs.opentiny.design/tiny-robot/) · [💬 Discussions](https://github.com/opentiny/tiny-robot/discussions) · [🐛 Report Bug](https://github.com/opentiny/tiny-robot/issues)
 
-## ✨ Features
+English | [简体中文](https://github.com/opentiny/tiny-robot/blob/HEAD/README.zh-CN.md)
 
-- 🤖 **Rich AI Components**: Comprehensive set of AI interaction components including chat bubbles, message input, conversation management, and more
-- 🎨 **OpenTiny Design**: Follows OpenTiny Design system for consistent UI/UX
-- 🚀 **Out of the Box**: Get started in minutes with minimal configuration
-- 🎯 **TypeScript Support**: Full TypeScript support with complete type definitions
-- 🌈 **Theme Customization**: Flexible theme system supporting multiple themes and custom styles
-- 📦 **Tree Shaking**: Optimized for tree shaking, import only what you need
-- 🔄 **Streaming Support**: Built-in support for streaming AI responses
-- 💾 **Storage Strategy**: Flexible storage strategies (LocalStorage, IndexedDB, custom)
+</div>
 
-English | [简体中文](https://github.com/opentiny/tiny-robot/blob/HEAD/README.zh-CN.md)
+---
 
-[![Ask DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/opentiny/tiny-robot)
+## ❓ Why TinyRobot?
+
+Building AI chat products from scratch means wrestling with **streaming rendering**, **multi-turn state management**, **tool call display**, **Markdown/code rendering**, and **input enhancements** — all before you even ship.
+
+**TinyRobot solves this.** It gives you production-ready AI interaction components for Vue 3, so you can go from idea to working AI app in hours, not weeks.
+
+```vue
+<!-- That's it. A working AI chat in 3 lines. -->
+<tr-bubble role="ai" content="Hello! How can I help you?" placement="start" />
+<tr-bubble role="user" content="Tell me about TinyRobot" placement="end" />
+<tr-sender placeholder="Type your message..." />
+```
+
+## ✨ Features
+
+| | Feature | Description |
+|---|---------|-------------|
+| 🤖 | **Rich AI Components** | Bubble, Sender, Container, Conversations, Prompts, Attachments, Welcome, Suggestion, MCP, and more |
+| 🔄 | **Streaming Support** | Built-in streaming AI response rendering with abort control |
+| 🧠 | **Agent UI** | ThoughtChain, ToolCall display, MCP Server integration — for AI Agent apps |
+| 🎨 | **OpenTiny Design** | Consistent UI/UX following the OpenTiny Design system |
+| 🚀 | **Out of the Box** | Get started in minutes with minimal configuration |
+| 🎯 | **TypeScript** | Full TypeScript support with complete type definitions |
+| 🌈 | **Theme Customization** | Flexible theme system supporting multiple themes and custom styles |
+| 📦 | **Tree Shaking** | Optimized for tree shaking — import only what you need |
+| 💾 | **Storage Strategy** | Flexible storage strategies (LocalStorage, IndexedDB, custom) |
+| 🔌 | **AI Provider** | Built-in OpenAI-compatible provider with composable `useMessage` / `useConversation` |
+
+## 📊 Comparison
+
+How does TinyRobot compare to other AI chat component libraries?
+
+| Feature | TinyRobot | Ant Design X | Element Plus X | TDesign Chat |
+|---------|-----------|-------------|---------------|-------------|
+| **Framework** | Vue 3 | React | Vue 3 | Vue 3 |
+| **Streaming Render** | ✅ | ✅ | ✅ | ✅ |
+| **Tool Call Display** | ✅ | ✅ | ❌ | ❌ |
+| **MCP Protocol** | ✅ | ❌ | ❌ | ❌ |
+| **Agent UI Components** | ✅ | ❌ | ❌ | ❌ |
+| **AI Provider Composables** | ✅ | ✅ | ❌ | ❌ |
+| **Conversation Management** | ✅ | ✅ | ✅ | ✅ |
+| **Theme Customization** | ✅ | ✅ | ✅ | ✅ |
+| **Tree Shaking** | ✅ | ✅ | ✅ | ✅ |
+| **TypeScript** | ✅ | ✅ | ✅ | ✅ |
+| **Skills / Agent Integration** | ✅ | ❌ | ❌ | ❌ |
+| **License** | MIT | MIT | MIT | MIT |
+
+> 💡 **TinyRobot is the only Vue 3 AI component library with built-in MCP protocol support and Agent UI components.**
+
+## 🧩 Components
+
+TinyRobot provides a comprehensive set of AI interaction components:
+
+| Component | Description |
+|-----------|-------------|
+| `TrBubble` | Chat bubble with streaming text, Markdown, code block, and tool call rendering |
+| `TrSender` | Message input with file attachment, voice input, and send actions |
+| `TrContainer` | Chat layout container with drag-and-drop panel support |
+| `TrConversations` | Multi-conversation management sidebar |
+| `TrPrompts` | Preset prompt suggestions for quick input |
+| `TrAttachments` | File attachment preview and management |
+| `TrWelcome` | Welcome screen with suggestions for new conversations |
+| `TrSuggestionPills` | Quick suggestion pills for common actions |
+| `TrSuggestionPopover` | Popover-style suggestions |
+| `TrMcpServerPicker` | MCP server selection and configuration |
+| `TrMcpAddForm` | MCP server add/edit form |
+| `TrThemeProvider` | Theme configuration provider |
+| `TrHistory` | Conversation history display |
+| `TrFeedback` | Message feedback (thumbs up/down) |
+| `TrActionGroup` | Action button group for messages |
 
 ## 📦 Packages
 
 TinyRobot is a monorepo containing the following packages:
 
-| Package                     | Description                                                  | Version                                                                                                                       |
-| --------------------------- | ------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------- |
-| `@opentiny/tiny-robot`      | Core component library with all AI interaction components    | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot)           |
-| `@opentiny/tiny-robot-kit`  | Utility functions and AI client tools for model interactions | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-kit.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-kit)   |
-| `@opentiny/tiny-robot-svgs` | SVG icon library with all component icons                    | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-svgs.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) |
+| Package | Description | Version |
+|---------|-------------|---------|
+| [`@opentiny/tiny-robot`](https://www.npmjs.com/package/@opentiny/tiny-robot) | Core component library with all AI interaction components | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot) |
+| [`@opentiny/tiny-robot-kit`](https://www.npmjs.com/package/@opentiny/tiny-robot-kit) | AI client tools, Vue composables (`useMessage`, `useConversation`), and storage strategies | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-kit.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-kit) |
+| [`@opentiny/tiny-robot-svgs`](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) | SVG icon library for all components | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-svgs.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) |
 
 ## 🚀 Quick Start
 
@@ -42,151 +106,158 @@ TinyRobot is a monorepo containing the following packages:
 
 - Node.js >= 20.13.0
 - Vue >= 3.2.0
-- Package manager: npm, yarn, or pnpm
-
-### Installation
+- Package manager: pnpm (recommended), npm, or yarn
 
-**Core package** — `@opentiny/tiny-robot` is the main package.
+### 1. Install
 
 ```bash
-# Using pnpm (recommended)
+# Core package (required)
 pnpm add @opentiny/tiny-robot
 
-# Using npm
-npm install @opentiny/tiny-robot
-
-# Using yarn
-yarn add @opentiny/tiny-robot
+# Kit package (optional — for AI model requests and composables)
+pnpm add @opentiny/tiny-robot-kit
 ```
 
-**Optional packages**:
-
-- `@opentiny/tiny-robot-kit` — Only needed if you use AI model request or data-processing features. Add it when required:
-
-  ```bash
-  pnpm add @opentiny/tiny-robot-kit
-  ```
+### 2. Import Styles
 
-- `@opentiny/tiny-robot-svgs` — Optional. Install separately only if you need to use the SVG icon library standalone or with custom icons:
-
-  ```bash
-  pnpm add @opentiny/tiny-robot-svgs
-  ```
-
-### Basic Usage
-
-#### 1. Import Styles
-
-In your `main.js` or `main.ts`:
+In your `main.ts`:
 
 ```ts
-import { createApp } from 'vue'
-import App from './App.vue'
 import '@opentiny/tiny-robot/dist/style.css'
-
-const app = createApp(App)
-app.mount('#app')
 ```
 
-#### 2. Use Components
+### 3. Use Components
 
 ```vue
 <template>
-  <div class="chat-container">
-    <tr-bubble role="ai" content="Hello! I'm TinyRobot, an AI component library for Vue 3." placement="start" />
-    <tr-bubble role="user" content="That's great! How can I get started?" placement="end" />
-  </div>
+  <tr-container>
+    <tr-bubble role="ai" content="Hello! I'm TinyRobot." placement="start" />
+    <tr-bubble role="user" content="How can I get started?" placement="end" />
+    <tr-sender placeholder="Type your message..." />
+  </tr-container>
 </template>
 
 <script setup>
-import { TrBubble } from '@opentiny/tiny-robot'
+import {
+  TrContainer,
+  TrBubble,
+  TrSender
+} from '@opentiny/tiny-robot'
 </script>
 ```
 
+### 4. Use AI Composables (with Kit)
+
+```vue
+<script setup>
+import { useMessage } from '@opentiny/tiny-robot-kit'
+
+const { messages, sendMessage, isLoading } = useMessage({
+  provider: 'openai',
+  model: 'gpt-4o-mini'
+})
+</script>
+
+<template>
+  <tr-container>
+    <tr-bubble
+      v-for="msg in messages"
+      :key="msg.id"
+      :role="msg.role"
+      :content="msg.content"
+      :placement="msg.role === 'user' ? 'end' : 'start'"
+    />
+    <tr-sender @send="sendMessage" :loading="isLoading" />
+  </tr-container>
+</template>
+```
+
 ## 📚 Documentation
 
-- 📖 [Full Documentation](https://docs.opentiny.design/tiny-robot/) - Complete API reference and guides
-- 🎯 [Quick Start Guide](https://docs.opentiny.design/tiny-robot/guide/quick-start) - Get started in minutes
-- 🎨 [Theme Configuration](https://docs.opentiny.design/tiny-robot/guide/theme-config) - Customize themes
-- 📝 [Update Log](https://docs.opentiny.design/tiny-robot/guide/update-log) - Version history
-- 💡 [Examples](https://docs.opentiny.design/tiny-robot/examples/assistant) - Complete application examples
+| Resource | Link |
+|----------|------|
+| 📖 Full Documentation | [docs.opentiny.design/tiny-robot](https://docs.opentiny.design/tiny-robot/) |
+| 🎯 Quick Start Guide | [Get started in minutes](https://docs.opentiny.design/tiny-robot/guide/quick-start) |
+| 🎨 Theme Configuration | [Customize themes](https://docs.opentiny.design/tiny-robot/guide/theme-config) |
+| 📝 Update Log | [Version history](https://docs.opentiny.design/tiny-robot/guide/update-log) |
+| 💡 Examples | [Complete app examples](https://docs.opentiny.design/tiny-robot/examples/assistant) |
+| 🤖 TinyRobot Skills | [AI-assisted development](https://gitcode.csdn.net/69bb9b7f54b52172bc628048.html) |
+
+[![Ask DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/opentiny/tiny-robot)
 
 ## 🏗️ Project Structure
 
-```text
+```
 tiny-robot/
 ├── packages/
 │   ├── components/          # Core component library
-│   │   ├── src/
-│   │   │   ├── bubble/      # Chat bubble components
-│   │   │   ├── sender/      # Message input component
-│   │   │   ├── container/   # Container component
-│   │   │   ├── history/     # Conversation history
-│   │   │   ├── attachments/ # File attachments
-│   │   │   └── ...          # Other components
-│   │   └── package.json
-│   ├── kit/                 # Utility functions and AI tools
-│   │   ├── src/
-│   │   │   ├── providers/   # AI provider implementations
-│   │   │   ├── vue/         # Vue composables
-│   │   │   │   ├── message/ # useMessage composable
-│   │   │   │   └── conversation/ # useConversation composable
-│   │   │   └── storage/     # Storage utilities
-│   │   └── package.json
+│   │   └── src/
+│   │       ├── bubble/      # Chat bubble components
+│   │       ├── sender/      # Message input component
+│   │       ├── container/   # Container component
+│   │       ├── conversations/ # Multi-conversation management
+│   │       ├── prompts/     # Preset prompts
+│   │       ├── attachments/ # File attachments
+│   │       ├── welcome/     # Welcome screen
+│   │       ├── mcp-*/       # MCP server components
+│   │       └── ...          # Other components
+│   ├── kit/                 # AI tools and Vue composables
+│   │   └── src/
+│   │       ├── providers/   # AI provider (OpenAI-compatible)
+│   │       ├── vue/         # useMessage, useConversation
+│   │       └── storage/     # LocalStorage, IndexedDB, custom
 │   ├── svgs/                # SVG icon library
-│   ├── playground/          # Development playground
+│   ├── playground/          # Interactive playground
 │   └── test/                # Test suite
-├── docs/                    # Documentation site
-│   ├── src/                 # Documentation source
-│   └── demos/               # Component demos
-├── scripts/                 # Build and utility scripts
-└── package.json
+├── docs/                    # Documentation site (VitePress)
+└── scripts/                 # Build and utility scripts
 ```
 
 ## 🛠️ Development
 
-### Setup
-
 ```bash
 # Install dependencies
 pnpm install
 
 # Start development server (playground + docs)
 pnpm dev
+
+# Run tests
+pnpm test
+
+# Build all packages
+pnpm build
 ```
 
-### Development Workflow
+## 🤝 Contributing
 
-1. **Start Development Server**:
-   - Run `pnpm dev` in the project root directory
-   - This starts both the playground and documentation site
-   - After modifying components in `packages/components/src/`, changes will be automatically reflected in the documentation page
+We love contributions! Whether it's a bug fix, new component, or documentation improvement:
 
-2. **Documentation**:
-   - Documentation source: `docs/src/`
-   - Component demos: `docs/demos/`
+1. Read the [Contributing Guide](https://github.com/opentiny/tiny-robot/blob/HEAD/CONTRIBUTING.md)
+2. Pick a [Good First Issue](https://github.com/opentiny/tiny-robot/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+issue%22)
+3. Fork → Branch → PR
 
-3. **Testing**:
-   - Run `pnpm test` to execute tests
+[![Contributors](https://img.shields.io/github/contributors/opentiny/tiny-robot)](https://github.com/opentiny/tiny-robot/graphs/contributors)
 
-## 📄 License
+## 🌟 Ecosystem
 
-MIT License - see [LICENSE](https://github.com/opentiny/tiny-robot/blob/HEAD/LICENSE) file for details.
+TinyRobot is part of the [OpenTiny](https://github.com/opentiny) ecosystem:
 
-## 🤝 Contributing
+- [TinyVue](https://github.com/opentiny/vue) — Enterprise-grade Vue 3 component library
+- [TinyEngine](https://github.com/opentiny/tiny-engine) — Low-code engine for building apps
+- [TinyRobot](https://github.com/opentiny/tiny-robot) — AI chat component library *(you are here)*
+- [OpenTiny NEXT](https://opentiny.design) — Next-gen AI-powered development platform
 
-Contributions are welcome! Please read our [Contributing Guide](https://github.com/opentiny/tiny-robot/blob/HEAD/CONTRIBUTING.md) to understand the recommended workflow, commit message conventions, and how to submit Issues and Pull Requests.
+## 📄 License
 
-## 📞 Support
+[MIT](https://github.com/opentiny/tiny-robot/blob/HEAD/LICENSE) — free for personal and commercial use.
 
-- 📖 [Documentation](https://docs.opentiny.design/tiny-robot/)
-- 🐛 [Issue Tracker](https://github.com/opentiny/tiny-robot/issues)
-- 💬 [Discussions](https://github.com/opentiny/tiny-robot/discussions)
+---
 
-## 🙏 Acknowledgments
+<div align="center">
 
-Built with ❤️ by the OpenTiny team.
+**If TinyRobot helps you build better AI apps, please consider giving us a ⭐!**
 
----
+[![Star History Chart](https://api.star-history.com/svg?repos=opentiny/tiny-robot&type=Date)](https://star-history.com/#opentiny/tiny-robot&Date)
 
-**Note**: This project is part of the [OpenTiny](https://github.com/opentiny) ecosystem.
+</div>
diff --git a/README.zh-CN.md b/README.zh-CN.md
index b99ae591e..995555965 100644
--- a/README.zh-CN.md
+++ b/README.zh-CN.md
@@ -1,40 +1,104 @@
-# TinyRobot
+<div align="center">
 
-<p align="center">
-  <a href="https://opentiny.design" target="_blank" rel="noopener noreferrer">
-    <img alt="OpenTiny Logo" src="https://raw.githubusercontent.com/opentiny/tiny-robot/HEAD/logo.svg" height="100" style="max-width:100%;">
-  </a>
-</p>
+# 🤖 TinyRobot
 
+**Vue 3 AI 对话组件库 — 几分钟构建企业级 AI 对话应用，而非几周。**
+
+[![GitHub Stars](https://img.shields.io/github/stars/opentiny/tiny-robot?style=social)](https://github.com/opentiny/tiny-robot/stargazers)
 [![npm version](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot)
+[![npm downloads](https://img.shields.io/npm/dw/@opentiny/tiny-robot)](https://www.npmjs.com/package/@opentiny/tiny-robot)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
+[![Vue 3](https://img.shields.io/badge/Vue-3.x-42b883.svg)](https://vuejs.org/)
+[![TypeScript](https://img.shields.io/badge/TypeScript-Ready-3178c6.svg)](https://www.typescriptlang.org/)
 
-**TinyRobot** 是一个基于 Vue 3 构建的 AI 组件库，遵循 OpenTiny Design 设计体系。它提供了丰富的 AI 交互组件，帮助开发者快速构建企业级 AI 应用。
+[🚀 在线演示](https://docs.opentiny.design/tiny-robot/examples/assistant) · [📖 完整文档](https://docs.opentiny.design/tiny-robot/) · [💬 社区讨论](https://github.com/opentiny/tiny-robot/discussions) · [🐛 提交问题](https://github.com/opentiny/tiny-robot/issues)
 
-## ✨ 特性
+[English](https://github.com/opentiny/tiny-robot/blob/HEAD/README.md) | 简体中文
 
-- 🤖 **丰富的 AI 组件**：包含聊天气泡、消息输入、会话管理等完整的 AI 交互组件
-- 🎨 **OpenTiny Design**：遵循 OpenTiny Design 设计体系，提供一致的 UI/UX
-- 🚀 **开箱即用**：几分钟内即可开始使用，配置简单
-- 🎯 **TypeScript 支持**：完整的 TypeScript 支持，提供完整的类型定义
-- 🌈 **主题定制**：灵活的主题系统，支持多种主题和自定义样式
-- 📦 **Tree Shaking**：针对 Tree Shaking 优化，按需导入
-- 🔄 **流式支持**：内置流式 AI 响应支持
-- 💾 **存储策略**：灵活的存储策略（LocalStorage、IndexedDB、自定义）
+</div>
 
-[English](https://github.com/opentiny/tiny-robot/blob/HEAD/README.md) | 简体中文
+---
 
-[![Ask DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/opentiny/tiny-robot)
+## ❓ 为什么选择 TinyRobot？
+
+从零构建 AI 对话产品，你需要处理**流式渲染**、**多轮会话状态管理**、**工具调用展示**、**Markdown/代码渲染**、**输入增强**……还没上线就已经耗费数周。
+
+**TinyRobot 帮你解决这些问题。** 它为 Vue 3 提供了生产级 AI 交互组件，让你从想法到可运行的 AI 应用只需数小时。
+
+```vue
+<!-- 就这样。3 行代码实现一个 AI 对话界面。 -->
+<tr-bubble role="ai" content="你好！有什么可以帮你的？" placement="start" />
+<tr-bubble role="user" content="介绍一下 TinyRobot" placement="end" />
+<tr-sender placeholder="输入你的消息..." />
+```
+
+## ✨ 特性
+
+| | 特性 | 说明 |
+|---|------|------|
+| 🤖 | **丰富的 AI 组件** | Bubble、Sender、Container、Conversations、Prompts、Attachments、Welcome、Suggestion、MCP 等 |
+| 🔄 | **流式支持** | 内置流式 AI 响应渲染，支持中断控制 |
+| 🧠 | **Agent UI** | ThoughtChain、ToolCall 展示、MCP Server 集成 — 专为 AI Agent 应用设计 |
+| 🎨 | **OpenTiny Design** | 遵循 OpenTiny Design 设计体系，一致的 UI/UX |
+| 🚀 | **开箱即用** | 几分钟内即可开始使用，配置简单 |
+| 🎯 | **TypeScript** | 完整的 TypeScript 支持，提供完整的类型定义 |
+| 🌈 | **主题定制** | 灵活的主题系统，支持多种主题和自定义样式 |
+| 📦 | **Tree Shaking** | 针对 Tree Shaking 优化，按需导入 |
+| 💾 | **存储策略** | 灵活的存储策略（LocalStorage、IndexedDB、自定义） |
+| 🔌 | **AI Provider** | 内置 OpenAI 兼容的 Provider，提供 `useMessage` / `useConversation` 组合式函数 |
+
+## 📊 竞品对比
+
+TinyRobot 与其他 AI 对话组件库的对比：
+
+| 特性 | TinyRobot | Ant Design X | Element Plus X | TDesign Chat |
+|------|-----------|-------------|---------------|-------------|
+| **框架** | Vue 3 | React | Vue 3 | Vue 3 |
+| **流式渲染** | ✅ | ✅ | ✅ | ✅ |
+| **工具调用展示** | ✅ | ✅ | ❌ | ❌ |
+| **MCP 协议** | ✅ | ❌ | ❌ | ❌ |
+| **Agent UI 组件** | ✅ | ❌ | ❌ | ❌ |
+| **AI Provider 组合式函数** | ✅ | ✅ | ❌ | ❌ |
+| **会话管理** | ✅ | ✅ | ✅ | ✅ |
+| **主题定制** | ✅ | ✅ | ✅ | ✅ |
+| **Tree Shaking** | ✅ | ✅ | ✅ | ✅ |
+| **TypeScript** | ✅ | ✅ | ✅ | ✅ |
+| **Skills / Agent 集成** | ✅ | ❌ | ❌ | ❌ |
+| **开源协议** | MIT | MIT | MIT | MIT |
+
+> 💡 **TinyRobot 是目前唯一内置 MCP 协议支持和 Agent UI 组件的 Vue 3 AI 组件库。**
+
+## 🧩 组件一览
+
+TinyRobot 提供了一套完整的 AI 交互组件：
+
+| 组件 | 说明 |
+|------|------|
+| `TrBubble` | 对话气泡，支持流式文本、Markdown、代码块和工具调用渲染 |
+| `TrSender` | 消息输入框，支持文件附件、语音输入和发送操作 |
+| `TrContainer` | 对话布局容器，支持拖拽面板 |
+| `TrConversations` | 多会话管理侧边栏 |
+| `TrPrompts` | 预设提示词，快速输入 |
+| `TrAttachments` | 文件附件预览和管理 |
+| `TrWelcome` | 欢迎页，新会话的建议引导 |
+| `TrSuggestionPills` | 快捷建议胶囊按钮 |
+| `TrSuggestionPopover` | 弹出式建议 |
+| `TrMcpServerPicker` | MCP 服务器选择和配置 |
+| `TrMcpAddForm` | MCP 服务器添加/编辑表单 |
+| `TrThemeProvider` | 主题配置提供者 |
+| `TrHistory` | 会话历史展示 |
+| `TrFeedback` | 消息反馈（点赞/点踩） |
+| `TrActionGroup` | 消息操作按钮组 |
 
 ## 📦 包说明
 
 TinyRobot 是一个 monorepo，包含以下包：
 
-| 包                          | 说明                                   | 版本                                                                                                                          |
-| --------------------------- | -------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- |
-| `@opentiny/tiny-robot`      | 核心组件库，包含所有 AI 交互组件       | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot)           |
-| `@opentiny/tiny-robot-kit`  | 工具函数和 AI 客户端工具，用于模型交互 | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-kit.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-kit)   |
-| `@opentiny/tiny-robot-svgs` | SVG 图标库，包含所有组件所需的图标     | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-svgs.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) |
+| 包 | 说明 | 版本 |
+|---|------|------|
+| [`@opentiny/tiny-robot`](https://www.npmjs.com/package/@opentiny/tiny-robot) | 核心组件库，包含所有 AI 交互组件 | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot) |
+| [`@opentiny/tiny-robot-kit`](https://www.npmjs.com/package/@opentiny/tiny-robot-kit) | AI 客户端工具、Vue 组合式函数（`useMessage`、`useConversation`）和存储策略 | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-kit.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-kit) |
+| [`@opentiny/tiny-robot-svgs`](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) | SVG 图标库，包含所有组件所需的图标 | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-svgs.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) |
 
 ## 🚀 快速开始
 
@@ -42,151 +106,158 @@ TinyRobot 是一个 monorepo，包含以下包：
 
 - Node.js >= 20.13.0
 - Vue >= 3.2.0
-- 包管理器：npm、yarn 或 pnpm
-
-### 安装
+- 包管理器：pnpm（推荐）、npm 或 yarn
 
-**核心包** — `@opentiny/tiny-robot` 是主包。
+### 1. 安装
 
 ```bash
-# 使用 pnpm（推荐）
+# 核心包（必需）
 pnpm add @opentiny/tiny-robot
 
-# 使用 npm
-npm install @opentiny/tiny-robot
-
-# 使用 yarn
-yarn add @opentiny/tiny-robot
+# Kit 包（可选 — 用于 AI 模型请求和组合式函数）
+pnpm add @opentiny/tiny-robot-kit
 ```
 
-**可选包**：
-
-- `@opentiny/tiny-robot-kit` — 仅在需要 AI 模型请求或数据处理功能时使用。需要时添加：
-
-  ```bash
-  pnpm add @opentiny/tiny-robot-kit
-  ```
+### 2. 引入样式
 
-- `@opentiny/tiny-robot-svgs` — 可选。仅在需要单独使用 SVG 图标库或自定义图标时单独安装：
-
-  ```bash
-  pnpm add @opentiny/tiny-robot-svgs
-  ```
-
-### 基本用法
-
-#### 1. 引入样式
-
-在 `main.js` 或 `main.ts` 中：
+在 `main.ts` 中：
 
 ```ts
-import { createApp } from 'vue'
-import App from './App.vue'
 import '@opentiny/tiny-robot/dist/style.css'
-
-const app = createApp(App)
-app.mount('#app')
 ```
 
-#### 2. 使用组件
+### 3. 使用组件
 
 ```vue
 <template>
-  <div class="chat-container">
-    <tr-bubble role="ai" content="Hello! I'm TinyRobot, an AI component library for Vue 3." placement="start" />
-    <tr-bubble role="user" content="That's great! How can I get started?" placement="end" />
-  </div>
+  <tr-container>
+    <tr-bubble role="ai" content="你好！我是 TinyRobot。" placement="start" />
+    <tr-bubble role="user" content="如何快速上手？" placement="end" />
+    <tr-sender placeholder="输入你的消息..." />
+  </tr-container>
 </template>
 
 <script setup>
-import { TrBubble } from '@opentiny/tiny-robot'
+import {
+  TrContainer,
+  TrBubble,
+  TrSender
+} from '@opentiny/tiny-robot'
 </script>
 ```
 
+### 4. 使用 AI 组合式函数（配合 Kit）
+
+```vue
+<script setup>
+import { useMessage } from '@opentiny/tiny-robot-kit'
+
+const { messages, sendMessage, isLoading } = useMessage({
+  provider: 'openai',
+  model: 'gpt-4o-mini'
+})
+</script>
+
+<template>
+  <tr-container>
+    <tr-bubble
+      v-for="msg in messages"
+      :key="msg.id"
+      :role="msg.role"
+      :content="msg.content"
+      :placement="msg.role === 'user' ? 'end' : 'start'"
+    />
+    <tr-sender @send="sendMessage" :loading="isLoading" />
+  </tr-container>
+</template>
+```
+
 ## 📚 文档
 
-- 📖 [完整文档](https://docs.opentiny.design/tiny-robot/) - 完整的 API 参考和指南
-- 🎯 [快速开始指南](https://docs.opentiny.design/tiny-robot/guide/quick-start) - 几分钟内快速上手
-- 🎨 [主题配置](https://docs.opentiny.design/tiny-robot/guide/theme-config) - 自定义主题
-- 📝 [更新日志](https://docs.opentiny.design/tiny-robot/guide/update-log) - 版本历史
-- 💡 [示例](https://docs.opentiny.design/tiny-robot/examples/assistant) - 完整的应用示例
+| 资源 | 链接 |
+|------|------|
+| 📖 完整文档 | [docs.opentiny.design/tiny-robot](https://docs.opentiny.design/tiny-robot/) |
+| 🎯 快速开始指南 | [几分钟快速上手](https://docs.opentiny.design/tiny-robot/guide/quick-start) |
+| 🎨 主题配置 | [自定义主题](https://docs.opentiny.design/tiny-robot/guide/theme-config) |
+| 📝 更新日志 | [版本历史](https://docs.opentiny.design/tiny-robot/guide/update-log) |
+| 💡 示例 | [完整应用示例](https://docs.opentiny.design/tiny-robot/examples/assistant) |
+| 🤖 TinyRobot Skills | [AI 辅助开发](https://gitcode.csdn.net/69bb9b7f54b52172bc628048.html) |
+
+[![Ask DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/opentiny/tiny-robot)
 
 ## 🏗️ 项目结构
 
-```text
+```
 tiny-robot/
 ├── packages/
 │   ├── components/          # 核心组件库
-│   │   ├── src/
-│   │   │   ├── bubble/      # 聊天气泡组件
-│   │   │   ├── sender/      # 消息输入组件
-│   │   │   ├── container/   # 容器组件
-│   │   │   ├── history/     # 会话历史
-│   │   │   ├── attachments/ # 文件附件
-│   │   │   └── ...          # 其他组件
-│   │   └── package.json
-│   ├── kit/                 # 工具函数和 AI 工具
-│   │   ├── src/
-│   │   │   ├── providers/   # AI 提供商实现
-│   │   │   ├── vue/         # Vue 组合式函数
-│   │   │   │   ├── message/ # useMessage 组合式函数
-│   │   │   │   └── conversation/ # useConversation 组合式函数
-│   │   │   └── storage/     # 存储工具
-│   │   └── package.json
+│   │   └── src/
+│   │       ├── bubble/      # 对话气泡组件
+│   │       ├── sender/      # 消息输入组件
+│   │       ├── container/   # 容器组件
+│   │       ├── conversations/ # 多会话管理
+│   │       ├── prompts/     # 预设提示词
+│   │       ├── attachments/ # 文件附件
+│   │       ├── welcome/     # 欢迎页
+│   │       ├── mcp-*/       # MCP 服务器组件
+│   │       └── ...          # 其他组件
+│   ├── kit/                 # AI 工具和 Vue 组合式函数
+│   │   └── src/
+│   │       ├── providers/   # AI Provider（OpenAI 兼容）
+│   │       ├── vue/         # useMessage、useConversation
+│   │       └── storage/     # LocalStorage、IndexedDB、自定义
 │   ├── svgs/                # SVG 图标库
-│   ├── playground/          # 开发演练场
+│   ├── playground/          # 交互式演练场
 │   └── test/                # 测试套件
-├── docs/                    # 文档站点
-│   ├── src/                 # 文档源码
-│   └── demos/               # 组件示例
-├── scripts/                 # 构建和工具脚本
-└── package.json
+├── docs/                    # 文档站点（VitePress）
+└── scripts/                 # 构建和工具脚本
 ```
 
 ## 🛠️ 开发
 
-### 环境设置
-
 ```bash
 # 安装依赖
 pnpm install
 
 # 启动开发服务器（演练场 + 文档）
 pnpm dev
+
+# 运行测试
+pnpm test
+
+# 构建所有包
+pnpm build
 ```
 
-### 开发流程
+## 🤝 贡献
 
-1. **启动开发服务器**：
-   - 在项目根目录运行 `pnpm dev`
-   - 这将同时启动演练场和文档站点
-   - 修改 `packages/components/src/` 中的组件后，更改会自动反映在文档页面中
+我们欢迎各种形式的贡献！无论是修复 Bug、新增组件还是改进文档：
 
-2. **文档**：
-   - 文档源码：`docs/src/`
-   - 组件示例：`docs/demos/`
+1. 阅读[贡献指南](https://github.com/opentiny/tiny-robot/blob/HEAD/CONTRIBUTING_zh.md)
+2. 选择一个 [Good First Issue](https://github.com/opentiny/tiny-robot/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+issue%22)
+3. Fork → Branch → PR
 
-3. **测试**：
-   - 运行 `pnpm test` 执行测试
+[![Contributors](https://img.shields.io/github/contributors/opentiny/tiny-robot)](https://github.com/opentiny/tiny-robot/graphs/contributors)
 
-## 📄 许可证
+## 🌟 生态
 
-MIT 许可证 - 查看 [LICENSE](https://github.com/opentiny/tiny-robot/blob/HEAD/LICENSE) 文件了解详情。
+TinyRobot 是 [OpenTiny](https://github.com/opentiny) 生态的一部分：
 
-## 🤝 贡献
+- [TinyVue](https://github.com/opentiny/vue) — 企业级 Vue 3 组件库
+- [TinyEngine](https://github.com/opentiny/tiny-engine) — 低代码引擎，快速构建应用
+- [TinyRobot](https://github.com/opentiny/tiny-robot) — AI 对话组件库 *（你在这里）*
+- [OpenTiny NEXT](https://opentiny.design) — 下一代 AI 驱动开发平台
 
-欢迎贡献！请阅读[贡献指南](https://github.com/opentiny/tiny-robot/blob/HEAD/CONTRIBUTING_zh.md)了解推荐的工作流程、Commit 规范以及如何提交 Issue 和 Pull Request。
+## 📄 许可证
 
-## 📞 支持
+[MIT](https://github.com/opentiny/tiny-robot/blob/HEAD/LICENSE) — 个人和商业使用均免费。
 
-- 📖 [文档](https://docs.opentiny.design/tiny-robot/)
-- 🐛 [问题追踪](https://github.com/opentiny/tiny-robot/issues)
-- 💬 [讨论](https://github.com/opentiny/tiny-robot/discussions)
+---
 
-## 🙏 致谢
+<div align="center">
 
-由 OpenTiny 团队用 ❤️ 构建。
+**如果 TinyRobot 帮助你构建了更好的 AI 应用，请给我们一个 ⭐！**
 
----
+[![Star History Chart](https://api.star-history.com/svg?repos=opentiny/tiny-robot&type=Date)](https://star-history.com/#opentiny/tiny-robot&Date)
 
-**注意**：本项目是 [OpenTiny](https://github.com/opentiny) 生态系统的一部分。
+</div>