ICEN UI v0.9.0

评估对比

评估 run 对比表（Braintrust 心智）：头部 runA/runB 下拉切换 → icen:kb-eval-compare，Summary 行自动判级徽章（提升 / 回归 / 权衡 / 持平，kb-core evalGrade）+ 全行均分与百分点差；结果表每指标 A / B / Δ 三列（正绿负负红、null 显「—」），行点击展开双栏字符级 diff（A 独有红 / B 独有绿，零依赖自写简版）；存在回归行时自动出现「仅看回归」过滤钮。

点行展开双栏字符级 diff · Q-03 是回归行（v4 忠实度掉到 0.4）→「仅看回归」过滤钮自动出现 · 切头部下拉派发 icen:kb-eval-compare

<div id="kb-eval-demo"></div><p class="demo-label" id="kb-eval-log" style="margin-top:8px">点行展开双栏字符级 diff · Q-03 是回归行（v4 忠实度掉到 0.4）→「仅看回归」过滤钮自动出现 · 切头部下拉派发 icen:kb-eval-compare</p>

安装

bun add @icen.ai/ui

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

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

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

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

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

用法

import { renderKbEvalCompare } from '@icen.ai/ui/kit/kb-eval'; renderKbEvalCompare(el, {  runs: [{ id: 'v3', label: '提示词 v3' }, { id: 'v4', label: '提示词 v4' }],  metrics: ['相关性', '忠实度'],          // 缺省从 scoresA/scoresB 键序并集推导  rows: [{    key: 'Q-01', input: '差旅报销上限是多少？',    outputA: '报销上限 5000 元。', outputB: '国内差旅单笔上限 5000 元，超标需事前审批。',    expected: '单笔 5000 元',    scoresA: { '相关性': 0.8, '忠实度': 0.75 }, scoresB: { '相关性': 0.9, '忠实度': 0.85 },  }],});// Summary 判级走 kb-core evalGrade（分数提升但成本/时延恶化 → tradeoff）；// 行点击展开双栏 diff + 期望；回归行存在时出现「仅看回归」过滤钮el.addEventListener('icen:kb-eval-compare', (e) => refetch(e.detail.runA, e.detail.runB));