ICEN UI v0.9.0

QA 对

认证问答对编辑器 .kb-qa（数据域「可信资产」的最小单元）：Q / A 两列表格，单元格 contenteditable 行内编辑（focusout 且内容变化才提交）；新增本地追加空行并聚焦问题格；删除先派事件再删行、后续行序号顺位重排（事件索引稳定）；CSV 模板导入入口（question,answer 每行一对，UTF-8）。事件 icen:kb-qa-change { op: add | edit | remove, index } 与 icen:kb-qa-import { source }。

单元格直接改写（失焦提交）/「+ 新增」追加空行并聚焦 / 删除（序号顺位重排）/「导入 CSV」派导入事件

事件日志：等待交互

<p class="demo-label" style="margin:0 0 8px">单元格直接改写（失焦提交）/「+ 新增」追加空行并聚焦 / 删除（序号顺位重排）/「导入 CSV」派导入事件</p><div id="demo-kb-qa"></div><p class="demo-label" id="demo-kb-qa-log" style="margin-top:8px">事件日志：等待交互</p>

安装

bun add @icen.ai/ui

一行引入该组件（CSS 与 behavior 自动带上，无需关心内部 CSS 文件名）：

import { initKbQa } from '@icen.ai/ui/kit/kb-qa';initKbQa();

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

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

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

用法

import { renderKbQa, initKbQa } from '@icen.ai/ui/kit/kb-qa';initKbQa();   // 行内编辑 / 增删行 / 导入 委托（root 缺省 document，幂等 + 销毁函数） renderKbQa(el, [  { question: '差旅住宿标准是多少？', answer: '一线城市每晚 600 元，其他城市 450 元（财务部 2026-08 终版）。' },  { question: '供应商准入的淘汰线是多少分？', answer: '60 分；低于 60 分不予通过，结果公示 3 个工作日。' },], { importSource: 'csv' });   // 导入事件 detail.source 可覆盖（缺省 'csv'）// 事件：icen:kb-qa-change { op: 'add' | 'edit' | 'remove', index }//      icen:kb-qa-import { source }（宿主弹文件选择，按模板解析后重渲染）