---
group:
  title: 输出
  order: 3
title: Bubble
description: 对话气泡
---

<DemoTitle title="Bubble" desc="对话气泡"></DemoTitle>

<code src="./demo/basic.tsx" height="auto">示例</code>

#### 用户气泡示例

以下是此组件的示例和变体
<code src="./demo/avatar.tsx" height="auto">头像</code>
<code src="./demo/userWithImage.tsx" height="auto">附带图片</code>
<code src="./demo/userWithFile.tsx" height="auto">附带文件</code>

#### 模型气泡示例

以下是此组件的示例和变体

<code src="./demo/assistantWithCode.tsx" height="auto">附带 Code</code>
<code src="./demo/assistantWithImage.tsx" height="auto">附带图片</code>
<code src="./demo/assistantWithThinking.tsx" height="auto">包含思考</code>
<code src="./demo/assistantWithProcess.tsx" height="auto">包含步骤处理</code>
<code src="./demo/assistantWithSearch.tsx" height="auto">包含链接引用</code>
<code src="./demo/assistantWithErrorStatus.tsx" height="auto">状态展示</code>

#### API

<ApiParser source="./interface.ts" id="BubbleProps"></ApiParser>