Suggestion · Pactor UI 资产库

元信息

字段	值
规范 ID	`component.suggestion`
名称	Suggestion
二级分类	AI 与会话（`ai-chat`）
用途	提供追问、补全或下一步建议
描述	中文惯用名：建议项。

预览

静态结构：flex-wrap chips 组——rounded-full border 小按钮（可选前缀图标），点击经 onSelect 传出 value（对象项缺省取 label）。

DSL 结构

DslNode

{
  "type": "Suggestion",
  "props": {
    "justify": "start",
    "items": [
      {
        "label": "生成月报",
        "value": "generate-monthly-report"
      },
      {
        "label": "分析销售趋势",
        "icon": "chart"
      },
      "总结会议纪要"
    ]
  },
  "events": {
    "onSelect": {
      "action": "setState",
      "params": {
        "prompt": "${event}"
      }
    }
  }
}

何时用

何时使用

提供追问、补全或下一步建议：回答后的引导 chips。

何时不用

起始任务入口：使用 Welcome / Prompt（卡片式更醒目）。

变体

变体	视觉形态	适用场景
纯文本	文字 chips	追问建议
带图标	图标 + 文字	动作型建议

API 属性

属性	类型	默认值	说明
`items`	`SuggestionItem[]`	[]	建议项：字符串或 { label, value?, icon? }
`justify`	`'start'	'center'`	'start'
`onSelect`	`event`	—	选择事件，传出 value（${event}）
`className / style`	`string / CSSProperties`	—	通用：根节点 class 合并 / 内联样式

使用规范

建议 2~4 条，文案是动作而非问题（「总结本文」优于「要总结吗」）。

正例

✓ 回答末尾：Suggestion 给出「换个角度 / 展开第三点 / 生成表格」。

反例

✕ 用 Suggestion 做主导航（应使用 Menu / Tabs）。

Design Token 映射

不适用：组件 tokenRefs 为空：样式 Token 数据尚未接入，三层映射（Primitive → Semantic → Component）待样式 Token 接入后回填。

关联资产