对话输入框 | astryx-vue

使用方法

草稿需要「敲一个字符弹出候选列表」、行内标签、上下键翻历史、语音转写插入、或者接收文件时，把 ChatComposerInput 放进 ChatComposer 的 input 插槽。

import { ChatComposerInput } from '@astryx-vue/core/Chat'

部分	说明
输入根节点	主题化的容器，负责转发根节点引用和样式入口。
可编辑区	带名字的 contenteditable 文本框或组合框，文字、选区、键盘、粘贴、拖放都由它管。
占位文字	只有序列化后的草稿为空时才会出现的提示。
候选列表	配置的触发字符生效时弹出的建议列表。
行内标签	不可编辑的徽标或自定义内容，带一个稳定的序列化值。

指引	实践
推荐	要用代码往里面塞文字或标签，用组件暴露出来的那组方法；塞进去的内容和手动输入走同一条 `change` 流程。
推荐	粘贴或拖进来的文件通过 `files` 事件接住，文件校验和上传进度留在业务层做。
避免	普通的提及和命令也用自定义标签渲染。用结构化的徽标形式就好，标签才可控、也才能跟着主题走。

常见的用法、变化和状态。

Value: ""

受控的输入框，下面实时显示当前的值。需要在输入区外面读草稿、或者改写草稿时，用受控模式。

禁用状态的输入区。输入框要看得见但不能操作时用它，例如正在流式输出，或者某个前置条件还没满足。

Value: ""

敲 @ 会弹出人员候选列表。选中的人变成行内标签。

Type @ for mentions (blue) or / for commands (yellow)

Value: ""

同时支持 @ 提及和 / 命令。两种标签用不同颜色，用户一眼能分清。

敲 / 选命令的输入框。支持固定指令的 AI 助手或机器可以用它。