澄清反问

renderKbClarify 澄清反问卡(快照渲染,重渲重置为未答态):问题行 + 选项 chips 点选(点选非打字)+ 答后回显「已解析:…」并禁用其余选项(同一卡只能答一次)+ reason 弱化小字。点选派 icen:kb-clarify-answer {id, value, label}(onAnswer 双通道);kb-answer 的澄清槽内部复用本组件。

答过即锁定 · 重答 = 数据快照重渲

点选项 → icen:kb-clarify-answer · 回显「已解析:…」并禁用其余选项

<div id="demo-kb-clarify"></div><div class="toolbar" style="margin-top:12px">  <span class="toolbar-label">答过即锁定 · 重答 = 数据快照重渲</span>  <span class="toolbar-spacer"></span>  <button class="btn btn-sm" type="button" id="kb-clarify-reset">重置为未答态</button></div><p class="demo-label" id="kb-clarify-log" style="margin-top:8px">点选项 → icen:kb-clarify-answer · 回显「已解析:…」并禁用其余选项</p>

安装

bun add @icen.ai/ui

一行引入该组件(CSS 与 behavior 自动带上,无需关心内部 CSS 文件名):

import '@icen.ai/ui/kit/kb-clarify';

也可以用脚手架直接打印引入行:

bunx --bun @icen.ai/ui add kb-clarify

Astro 项目注意:kit 入口里的 CSS import 在页面 <script> 里会被 Astro 的 client bundle 摇掉——请改在布局 frontmatter 里引 CSS(import '@icen.ai/ui/components/kb-data.css';),JS 行为仍可走 kit。Vite SPA / webpack 项目无此问题。

用法

import { renderKbClarify } from '@icen.ai/ui/kit/kb-clarify'; renderKbClarify(el, {  id: 'clarify-tax-scope',          // 事件 detail 会带上(可选)  question: '「销售额」指含税还是不含税?',  options: [    { label: '含税口径(默认)', value: 'tax_inc' },    { label: '不含税口径', value: 'tax_exc' },    { label: '两种都看(并列对比)', value: 'both' },  ],  reason: '检测到口径歧义,先确认再生成 SQL',   // 弱化小字,有才渲}, {  onAnswer: ({ id, value, label }) => {},   // 与 icen:kb-clarify-answer 同 detail});