ICEN UI v0.9.0

检索调试台

createKbRetrieval 装配检索 playground：参数栏（向量/关键词/混合模式 · topK 步进 · alpha 混合权重滑杆 · 重排开关 · 阈值滑杆联动「存活 N 条」）+ 可复制参数 JSON 行 + 命中列表。分数纪律：score null → 值「—」不渲条、scoreKind 必显 chip、vectorPart/keywordPart 微型双段条、explain 折叠拆解；Enter 或「运行」派 icen:kb-retrieval-run（onRun 双通道）。

Enter 或点「运行」→ 300ms mock 检索回填命中 · 切模式看 scoreKind 变化 · 第 5 条为无分命中（「—」态）· 点「拆解」看打分构成

<div id="demo-kb-retrieval"></div><p class="demo-label" id="kb-retrieval-log" style="margin-top:8px">Enter 或点「运行」→ 300ms mock 检索回填命中 · 切模式看 scoreKind 变化 · 第 5 条为无分命中（「—」态）· 点「拆解」看打分构成</p>

安装

bun add @icen.ai/ui

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

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

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

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

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

用法

import { createKbRetrieval } from '@icen.ai/ui/kit/kb-retrieval'; const handle = createKbRetrieval(el, {  params: { mode: 'hybrid', topK: 5, alpha: 0.6, rerank: true },   // 宽进严出（normalizeRetrievalParams）  onRun: (query) => {    // 与 icen:kb-retrieval-run {query} 双通道；真实检索由宿主执行    handle.setBusy(true);                     // 运行钮禁用 + .is-busy    search(query).then((hits) => {      handle.renderHits(hits);                // KbRetrievalHit[]：score 可 null、scoreKind 必带      handle.setBusy(false);    });  },}); handle.getParams();              // 归一副本（threshold 投影：rerank 关闭 → null）handle.setParams({ topK: 8 });handle.setThreshold(0.35);       // 阈值滑杆 + 「存活 N/M 条」联动（score null 在任何正阈值下不存活）