← 回 aily-ui 总站

akong ChatBubble

iMessage / 微信 / 小红书私信风 · 跨端 · 一份 props

1. 单行 text · user / assistant

嗨，我能帮你做点什么？
帮我写一段广告文案

2. 长文 + line break · pre-line

好的，我给你写三版： 第一版（理性）：每天 5 分钟，掌控你的英语进度。 第二版（情绪）：你不是不努力，是没找对方法。 第三版（行动）：现在就打开 App，开始第一节课。
12:35

3. 极长 single 消息 · 自动换行

这是一段非常非常非常长的消息，没有任何换行符，目的是测试 word-break 跟 overflow-wrap 是否能让文本在气泡内自动换行而不撑爆容器 abcdefghijklmnopqrstuvwxyz0123456789

4. user 三态 status (sending / sent / failed)

发送中...
12:36
已送达
12:36
网络断了
12:36

5. system 居中

对方撤回了一条消息
管理员 撤销了 张三 的禁言
昨天 12:34

6. image variant · max-w 240

12:40

7. file variant · icon + name + size

2026-Q1-OKR.pdf 2.3 MB

8. voice variant · icon + 时长

12"
1'05"

9. 完整对话 · 混合 variant

2026-05-08 周五
早上好，今天的早报来了～
谢啦
08:02
8"
08:03