MessageActions
message-actions消息操作条 · 复制(剪贴板+Check反馈)/重新生成/赞/踩 · 各键按需渲染 · 复用内联图标 · 挂 ChatMessage actions 槽
用法
全套操作
提供 content + 各回调，渲染复制/重新生成/赞/踩四键。
tsx
<MessageActions
content="瑚琏支持明暗双主题 0 闪烁。"
onRegenerate={() => regenerate()}
onLike={() => rate("up")}
onDislike={() => rate("down")}
/>仅复制
只传 content 时单独显示复制键，点击后 Check 反馈 1.5s。
tsx
<MessageActions content="只读片段，仅供复制。" />追加自定义键
children 在末尾追加任意操作（如收藏、分享）。
tsx
<MessageActions content={text} onRegenerate={regen}>
<button
type="button"
className="inline-flex h-7 items-center rounded-[var(--radius)] px-2 text-xs text-muted hover:bg-surface-hover hover:text-foreground"
>
收藏
</button>
</MessageActions>挂在 ChatMessage 下
作为 ChatMessage 的 actions 槽，跟随气泡显示在消息下方。
AI
瑚琏 AI
支持，明暗双主题 0 闪烁，SSR 注入变量先于绘制。
tsx
<ChatMessage
role="assistant"
name="瑚琏 AI"
actions={<MessageActions content={text} onRegenerate={regen} onLike={up} onDislike={down} />}
>
支持，明暗双主题 0 闪烁，SSR 注入变量先于绘制。
</ChatMessage>何时用
挂在已生成的 assistant 消息下，提供复制/重新生成/赞/踩等操作时用（通常填进 ChatMessage 的 actions 槽）。区别于 PromptSuggestions（引导下一步提问），本组件针对「这条消息」的反馈与复用。各按钮按相应回调/content 是否提供而按需渲染。
导入
ts
import { MessageActions } from "@hulianui/ui"Props
继承 HTMLAttributes<HTMLDivElement>，额外：
| 名称 | 类型 | 默认 | 说明 |
|---|---|---|---|
| content | string | — | 复制目标文本；提供则显示复制键（点后 Check 反馈 1.5s） |
Events
| 事件 | 类型 | 说明 |
|---|---|---|
| onCopy | () => void | 复制后回调（与内置剪贴板并行） |
| onRegenerate | () => void | 提供则显示重新生成键 |
| onLike | () => void | 提供则显示赞键 |
| onDislike | () => void | 提供则显示踩键 |
Slots
| 插槽 | 类型 | 说明 |
|---|---|---|
| children | ReactNode | 追加自定义操作键 |
禁忌 / 坑
- 每个按钮按需渲染：复制键看
content，其余看对应回调是否传入——不传就不显示，无需额外开关。 - 复制内置剪贴板写入 + Check 反馈 1.5s，
onCopy是并行附加回调（埋点/toast），不需要你自己再写navigator.clipboard。 - 暂无其它已知坑。
相关
StreamingText · PromptSuggestions · Citation · Conversation · ChatMessage · PromptInput