dsh-data-domain-knowledge 0.1.0-alpha.1

package/src/client/convert/styles.css

@@ -0,0 +1,138 @@
+/* Convert panel — semantic classes only; the client bundle inlines this file. */
+
+.tdc-panel {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  min-height: 0;
+  font-size: 13px;
+}
+
+.tdc-header {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  padding: 12px 14px 10px;
+  border-bottom: 1px solid var(--tita-line);
+}
+
+.tdc-header-copy { min-width: 0; flex: 1; }
+.tdc-header-title { margin: 0; font-size: 14px; font-weight: 600; letter-spacing: -0.01em; }
+.tdc-header-subtitle { margin: 2px 0 0; font-size: 11.5px; opacity: 0.65; }
+.tdc-header-actions { display: flex; align-items: center; gap: 6px; }
+
+.tdc-body {
+  flex: 1;
+  min-height: 0;
+  overflow: auto;
+  padding: 12px 14px 20px;
+}
+
+.tdc-section { margin-bottom: 16px; }
+.tdc-section-title {
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  opacity: 0.6;
+  margin: 0 0 8px;
+}
+
+.tdc-row { display: flex; align-items: center; gap: 8px; }
+.tdc-row-between { justify-content: space-between; }
+.tdc-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
+.tdc-field { display: block; margin-bottom: 10px; }
+.tdc-field-label { display: block; font-size: 11.5px; opacity: 0.65; margin-bottom: 4px; }
+.tdc-field-hint { display: block; font-size: 11px; opacity: 0.55; margin-top: 4px; line-height: 1.45; }
+
+.tdc-muted { opacity: 0.65; }
+.tdc-small { font-size: 11.5px; }
+.tdc-error { color: var(--tita-danger); }
+.tdc-notice { color: var(--tita-success); }
+
+.tdc-task-list { display: flex; flex-direction: column; gap: 6px; }
+.tdc-task {
+  display: flex;
+  gap: 10px;
+  padding: 8px 10px;
+  border: 1px solid var(--tita-line);
+  border-radius: 8px;
+}
+.tdc-task-active { border-color: var(--tita-primary-line); }
+.tdc-task-main { flex: 1; min-width: 0; }
+.tdc-task-title { font-weight: 550; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.tdc-task-meta { font-size: 11px; opacity: 0.6; margin-top: 2px; overflow-wrap: anywhere; }
+.tdc-task-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
+.tdc-task-actions { display: flex; gap: 4px; }
+
+.tdc-progress { height: 4px; border-radius: 999px; background: var(--tita-surface-muted); overflow: hidden; width: 100%; }
+.tdc-progress-bar { height: 100%; background: var(--tita-primary); transition: width 240ms ease; }
+
+.tdc-tag {
+  display: inline-block;
+  padding: 1px 7px;
+  border-radius: 999px;
+  font-size: 11px;
+  border: 1px solid var(--tita-line-strong);
+  white-space: nowrap;
+}
+.tdc-tag-ok { color: var(--tita-success); border-color: var(--tita-tone-green-line); }
+.tdc-tag-run { color: var(--tita-primary); border-color: var(--tita-primary-line); }
+.tdc-tag-fail { color: var(--tita-danger); border-color: var(--ddk-danger-line); }
+.tdc-tag-idle { opacity: 0.6; }
+
+.tdc-cap-list { list-style: none; margin: 0; padding: 0; }
+.tdc-cap-item {
+  display: flex;
+  gap: 8px;
+  padding: 7px 0;
+  border-bottom: 1px dashed var(--tita-line);
+}
+.tdc-cap-item:last-child { border-bottom: 0; }
+.tdc-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; flex: none; }
+.tdc-dot-on { background: var(--tita-success); }
+.tdc-dot-off { background: var(--tita-ink-faint); }
+
+.tdc-pre {
+  margin: 0;
+  padding: 9px 10px;
+  border: 1px solid var(--tita-line);
+  border-radius: 7px;
+  background: var(--tita-surface-muted);
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 11.5px;
+  line-height: 1.5;
+  max-height: 260px;
+  overflow: auto;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+.tdc-kv { display: grid; gap: 4px; margin: 0 0 10px; }
+.tdc-kv > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 8px; }
+.tdc-kv dt { font-size: 11.5px; opacity: 0.6; }
+.tdc-kv dd { margin: 0; font-size: 12px; overflow-wrap: anywhere; }
+
+.tdc-asset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
+.tdc-asset-card { border: 1px solid var(--tita-line); border-radius: 7px; padding: 5px; }
+.tdc-asset-card img { width: 100%; height: 68px; object-fit: contain; display: block; }
+.tdc-asset-card figcaption { font-size: 10px; opacity: 0.6; margin-top: 4px; overflow-wrap: anywhere; }
+
+.tdc-empty { padding: 18px 0; text-align: center; opacity: 0.6; font-size: 12px; }
+.tdc-code {
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 11px;
+  background: var(--tita-surface-muted);
+  border-radius: 4px;
+  padding: 1px 4px;
+}
+
+.tdc-file-input {
+  width: 100%;
+  font-size: 12px;
+  padding: 7px 8px;
+  border: 1px dashed var(--tita-line-strong);
+  border-radius: 7px;
+  background: var(--tita-surface-muted);
+  color: inherit;
+  cursor: pointer;
+}

package/src/client/convert/styles.ts

@@ -0,0 +1,49 @@
+/** Class-name registry for the convert panel; definitions live in styles.css. */
+export const styles = {
+  panel: 'tdc-panel',
+  header: 'tdc-header',
+  headerCopy: 'tdc-header-copy',
+  headerTitle: 'tdc-header-title',
+  headerSubtitle: 'tdc-header-subtitle',
+  headerActions: 'tdc-header-actions',
+  body: 'tdc-body',
+  section: 'tdc-section',
+  sectionTitle: 'tdc-section-title',
+  row: 'tdc-row',
+  rowBetween: 'tdc-row tdc-row-between',
+  grid2: 'tdc-grid-2',
+  field: 'tdc-field',
+  fieldLabel: 'tdc-field-label',
+  fieldHint: 'tdc-field-hint',
+  muted: 'tdc-muted',
+  small: 'tdc-small',
+  error: 'tdc-error',
+  notice: 'tdc-notice',
+  taskList: 'tdc-task-list',
+  task: 'tdc-task',
+  taskActive: 'tdc-task-active',
+  taskMain: 'tdc-task-main',
+  taskTitle: 'tdc-task-title',
+  taskMeta: 'tdc-task-meta',
+  taskSide: 'tdc-task-side',
+  taskActions: 'tdc-task-actions',
+  progress: 'tdc-progress',
+  progressBar: 'tdc-progress-bar',
+  tag: 'tdc-tag',
+  tagOk: 'tdc-tag tdc-tag-ok',
+  tagRun: 'tdc-tag tdc-tag-run',
+  tagFail: 'tdc-tag tdc-tag-fail',
+  tagIdle: 'tdc-tag tdc-tag-idle',
+  capList: 'tdc-cap-list',
+  capItem: 'tdc-cap-item',
+  dot: 'tdc-dot',
+  dotOn: 'tdc-dot tdc-dot-on',
+  dotOff: 'tdc-dot tdc-dot-off',
+  pre: 'tdc-pre',
+  kv: 'tdc-kv',
+  assetGrid: 'tdc-asset-grid',
+  assetCard: 'tdc-asset-card',
+  empty: 'tdc-empty',
+  code: 'tdc-code',
+  fileInput: 'tdc-file-input',
+} as const

package/src/client/format.ts

@@ -0,0 +1,39 @@
+/**
+ * 展示层的三个格式化函数：字节、紧凑时间、标准时间。
+ *
+ * 为什么单独一个模块：预览抽屉（`PreviewSections.tsx`）与列表行都要用它们。放在
+ * 某个组件文件里会让另一个组件为了一个格式化函数去 import 组件模块 —— 反向依赖。
+ *
+ * **两种时间是两种读法，不是一个格式没统一**：
+ * - `formatTime` 给**列表行**用（`9/22 09:11`）：窄栏里一行还要放标题、类型、大小。
+ * - `formatDateTime` 给**元信息**用（`2026-09-22 09:11`）：那里是逐字核对事实的地方，
+ *   年份不能省，而且这个字符串要能被复制出去直接用。
+ * 两者都只到分钟 —— 秒是版本号那种需要唯一性的地方的读法，不是这里的。
+ */
+
+export function formatBytes(bytes: number | undefined): string {
+  if (!bytes) return '0 B'
+  const units = ['B', 'KB', 'MB', 'GB']
+  let value = bytes
+  let unit = 0
+  while (value >= 1024 && unit < units.length - 1) { value /= 1024; unit += 1 }
+  return `${value.toFixed(value >= 10 || unit === 0 ? 0 : 1)} ${units[unit]}`
+}
+
+const pad2 = (value: number): string => String(value).padStart(2, '0')
+
+/** 列表行的紧凑时间：`9/22 09:11`。 */
+export function formatTime(value: string | undefined): string {
+  if (!value) return '—'
+  const date = new Date(value)
+  if (Number.isNaN(date.getTime())) return '—'
+  return date.toLocaleString('zh-CN', { month: 'numeric', day: 'numeric', hour: '2-digit', minute: '2-digit' })
+}
+
+/** 元信息里的标准时间：`2026-09-22 09:11`。 */
+export function formatDateTime(value: string | undefined): string {
+  if (!value) return '—'
+  const date = new Date(value)
+  if (Number.isNaN(date.getTime())) return '—'
+  return `${date.getFullYear()}-${pad2(date.getMonth() + 1)}-${pad2(date.getDate())} ${pad2(date.getHours())}:${pad2(date.getMinutes())}`
+}

package/src/client/graph/layout.ts

@@ -0,0 +1,181 @@
+/**
+ * 知识图谱的**几何与筛选**。
+ *
+ * 与「Agent 概览」那张架构图恰好相反：架构图的坐标是**设计结论**（谁必须在谁下面），
+ * 所以手算；知识图谱的坐标是**数据结论**（这张卡片连到哪份来源），节点数随知识库增长，
+ * 所以交给 dagre 分层布局。但它仍然是**确定性**的：同一份图数据每次得到同一个形状 ——
+ * 否则每次刷新都换一个样子，「那张卡片在右边」这种空间记忆就失效了。
+ *
+ * 这里没有 G6 实例，只有数据进、坐标出，所以可以在 node:test 里断言。
+ */
+
+import { DagreLayout } from '@antv/g6'
+
+export interface GraphNodeView { id: string; type: string; title: string; status?: string }
+export interface GraphEdgeView { from: string; to: string; type: string }
+
+/**
+ * 图谱节点的唯一键。
+ *
+ * **接口两边的键不一样，这是实测踩到的坑**：`nodes[].id` 是裸 id（`e062c1bf…`），
+ * 而 `edges[].from / to` 是 `type:id` 的复合键（`diagnosis/case:e062c1bf…`）。
+ * 拿裸 id 去比，一条边都连不上 —— 图上于是只剩一排孤立的卡片，边数永远是 0/26。
+ * 对齐只做一次，就在这里。
+ */
+export function keyOf(node: { id: string; type: string }): string {
+  return `${node.type}:${node.id}`
+}
+
+/** 节点卡片的尺寸。宽度要放得下一张卡片的标题，高度只放得下一行。 */
+export const GRAPH_NODE_W = 176
+export const GRAPH_NODE_H = 34
+/** 画布四周留白。 */
+export const GRAPH_PAD = 28
+/** 卡片列与来源列之间的水平间距。 */
+export const GRAPH_RANK_SEP = 132
+
+export interface PlacedNode extends GraphNodeView {
+  /** 复合键 `type:id`。图上元素的 id、边的两端、选中态用的都是它。 */
+  key: string
+  /** 中心坐标。 */
+  x: number
+  y: number
+  /** 与该节点相连的边数：面板上用它回答「这张卡片被几条边接着」。 */
+  degree: number
+}
+
+export interface PlacedGraph {
+  nodes: PlacedNode[]
+  edges: GraphEdgeView[]
+  width: number
+  height: number
+}
+
+export interface GraphFilter {
+  /** 空数组 = 不筛。 */
+  nodeTypes: string[]
+  edgeTypes: string[]
+  query: string
+}
+
+export interface FilterResult {
+  /** 画布上要画的节点：命中的 + 为了不剪断边而带上的邻居。 */
+  nodes: GraphNodeView[]
+  edges: GraphEdgeView[]
+  /** 直接命中筛选条件的节点数。`nodes.length` 可能更大。 */
+  matched: number
+}
+
+/**
+ * 按类型与关键词筛。
+ *
+ * 两条规则，都是实测逼出来的：
+ *
+ * 1. **不留悬空边**：只留下两端都还在图上的边。一条指向画布外的线比没有线更让人困惑。
+ * 2. **带上邻居**：这张图今天只有 `supported_by`（卡片 → 来源），是**二部图** ——
+ *    按节点类型筛任何一侧，边都会被规则 1 全部剪掉，于是筛完只剩一排孤立卡片，
+ *    看起来像坏了。所以命中节点的**直接邻居一起带上**：边仍然连得起来，
+ *    而「筛的是哪一类」由筛选条和图上的节点自己说清楚。带进来的数量会在计数里标出来。
+ */
+export function filterGraph(
+  nodes: GraphNodeView[],
+  edges: GraphEdgeView[],
+  filter: GraphFilter,
+  options: { includeNeighbors?: boolean } = {},
+): FilterResult {
+  const needle = filter.query.trim().toLocaleLowerCase()
+  const matched = nodes.filter(node =>
+    (filter.nodeTypes.length === 0 || filter.nodeTypes.includes(node.type))
+    && (needle === '' || `${node.title}\n${node.id}`.toLocaleLowerCase().includes(needle)))
+  const byEdgeType = edges.filter(edge => filter.edgeTypes.length === 0 || filter.edgeTypes.includes(edge.type))
+
+  const active = filter.nodeTypes.length > 0 || filter.edgeTypes.length > 0 || needle !== ''
+  const keep = new Set(matched.map(keyOf))
+  if (active && options.includeNeighbors !== false) {
+    const direct = new Set(keep)
+    for (const edge of byEdgeType) {
+      if (direct.has(edge.from)) keep.add(edge.to)
+      if (direct.has(edge.to)) keep.add(edge.from)
+    }
+  }
+  const byKey = new Map(nodes.map(node => [keyOf(node), node]))
+  const kept = [...keep].map(key => byKey.get(key)).filter((node): node is GraphNodeView => Boolean(node))
+  return {
+    nodes: kept,
+    edges: byEdgeType.filter(edge => keep.has(edge.from) && keep.has(edge.to)),
+    matched: matched.length,
+  }
+}
+
+/** 每种节点类型各有多少个。筛选条上的计数读它，不从筛完的结果里再数一次。 */
+export function nodeTypeCounts(nodes: GraphNodeView[]): Array<{ type: string; count: number }> {
+  const counts = new Map<string, number>()
+  for (const node of nodes) counts.set(node.type, (counts.get(node.type) ?? 0) + 1)
+  return [...counts.entries()].map(([type, count]) => ({ type, count })).sort((a, b) => b.count - a.count || a.type.localeCompare(b.type))
+}
+
+/** 每种边类型各有多少条。 */
+export function edgeTypeCounts(edges: GraphEdgeView[]): Array<{ type: string; count: number }> {
+  const counts = new Map<string, number>()
+  for (const edge of edges) counts.set(edge.type, (counts.get(edge.type) ?? 0) + 1)
+  return [...counts.entries()].map(([type, count]) => ({ type, count })).sort((a, b) => b.count - a.count || a.type.localeCompare(b.type))
+}
+
+/** 某个节点直接相连的节点（不分方向）。选中一个节点时，面板列的就是它。 */
+export function neighborsOf(id: string, nodes: GraphNodeView[], edges: GraphEdgeView[]): GraphNodeView[] {
+  const byId = new Map(nodes.map(node => [keyOf(node), node]))
+  const ids = new Set<string>()
+  for (const edge of edges) {
+    if (edge.from === id) ids.add(edge.to)
+    else if (edge.to === id) ids.add(edge.from)
+  }
+  return [...ids].map(other => byId.get(other)).filter((node): node is GraphNodeView => Boolean(node))
+}
+
+/**
+ * 排一次版。
+ *
+ * `rankdir: 'LR'`：卡片在左、来源在右。这张图今天只有 `supported_by` 一种边
+ * （卡片 → 来源），所以它就是一张两层二部图，横向分层正好读出「这张卡片由哪几份
+ * 原始文档支撑」。将来 wiki↔wiki 的关系边抽出来之后，分层仍然成立，不用改这里。
+ */
+export async function layoutGraph(nodes: GraphNodeView[], edges: GraphEdgeView[]): Promise<PlacedGraph> {
+  if (nodes.length === 0) return { nodes: [], edges: [], width: GRAPH_NODE_W + GRAPH_PAD * 2, height: GRAPH_NODE_H + GRAPH_PAD * 2 }
+
+  const layout = new DagreLayout({
+    rankdir: 'LR',
+    nodesep: 12,
+    ranksep: GRAPH_RANK_SEP,
+    nodeSize: [GRAPH_NODE_W, GRAPH_NODE_H],
+  })
+  await layout.execute({
+    // dagre 拿到的键必须是复合键：边的两端用的就是它。
+    nodes: nodes.map(node => ({ id: keyOf(node) })),
+    edges: edges.map((edge, index) => ({ id: `e${index}`, source: edge.from, target: edge.to })),
+  })
+  const positions = new Map<string, { x: number; y: number }>()
+  layout.forEachNode(node => { positions.set(String(node.id), { x: Number(node.x ?? 0), y: Number(node.y ?? 0) }) })
+  layout.destroy()
+
+  const degree = new Map<string, number>()
+  for (const edge of edges) {
+    degree.set(edge.from, (degree.get(edge.from) ?? 0) + 1)
+    degree.set(edge.to, (degree.get(edge.to) ?? 0) + 1)
+  }
+
+  const raw = nodes.map(node => {
+    const key = keyOf(node)
+    const at = positions.get(key) ?? { x: 0, y: 0 }
+    return { ...node, key, x: at.x, y: at.y, degree: degree.get(key) ?? 0 }
+  })
+  // 归一化：把整块内容推到留白之内，坐标因此永远非负，画布尺寸就是它的包围盒。
+  const minX = Math.min(...raw.map(node => node.x)) - GRAPH_NODE_W / 2
+  const minY = Math.min(...raw.map(node => node.y)) - GRAPH_NODE_H / 2
+  const placed = raw.map(node => ({ ...node, x: node.x - minX + GRAPH_PAD, y: node.y - minY + GRAPH_PAD }))
+  return {
+    nodes: placed,
+    edges,
+    width: Math.max(...placed.map(node => node.x)) + GRAPH_NODE_W / 2 + GRAPH_PAD,
+    height: Math.max(...placed.map(node => node.y)) + GRAPH_NODE_H / 2 + GRAPH_PAD,
+  }
+}

package/src/client/graph.css

@@ -0,0 +1,113 @@
+/* =====================================================================
+   知识库 → 知识图谱：一张 AntV 画布 + 一条筛选栏
+   ---------------------------------------------------------------------
+   这个文件跟着 `KnowledgeGraphView` 走，不并进 architecture.css：那一份是
+   「架构图 + 节点面板」的版式，这里是「图谱 + 筛选 + 详情」，共同词汇只有画布本身。
+   ===================================================================== */
+
+.tita-kgStage {
+  position: relative; /* 全屏时的定位上下文 */
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+  border: 1px solid var(--tita-line);
+  border-radius: 10px;
+  background: var(--tita-surface);
+  overflow: hidden;
+}
+
+.tita-kgStage:fullscreen { border: 0; border-radius: 0; }
+
+/* ---------------------------------------------------------------- 筛选栏 */
+
+.tita-kgBar {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 10px;
+  flex-wrap: wrap;
+  border-bottom: 1px solid var(--tita-line);
+  padding: 8px 10px;
+}
+
+.tita-kgFilters { display: flex; flex: 1 1 320px; min-width: 0; flex-direction: column; gap: 6px; }
+.tita-kgSearch { display: flex; align-items: center; gap: 6px; min-width: 0; }
+.tita-kgSearch > svg { flex: 0 0 auto; color: var(--tita-ink-faint); }
+.tita-kgSearch input { min-width: 0; }
+
+.tita-kgChips { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
+/* 类型色点 + schema id + 计数。三样都要在：色点连着图上的节点，id 是真实类型名，
+   计数回答「筛掉它会少几个」。 */
+.tita-kgChip {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  border: 1px solid var(--tita-line);
+  border-radius: 6px;
+  background: var(--tita-surface);
+  padding: 2px 7px;
+  color: var(--tita-ink-muted);
+  font: inherit;
+  font-size: 10.5px;
+  cursor: pointer;
+}
+.tita-kgChip:hover { background: var(--tita-surface-muted); color: var(--tita-ink); }
+.tita-kgChip > i { width: 6px; height: 6px; border-radius: 999px; }
+.tita-kgChip code { font-family: var(--font-tita-mono); font-size: 10px; }
+.tita-kgChip b { color: var(--tita-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
+.tita-kgChipOn { border-color: var(--tita-ink); background: var(--tita-surface-muted); color: var(--tita-ink); font-weight: 600; }
+
+.tita-kgActions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; padding-top: 2px; }
+.tita-kgCounts { color: var(--tita-ink-muted); font-size: 10.5px; }
+.tita-kgCounts b { color: var(--tita-ink); font-variant-numeric: tabular-nums; }
+.tita-kgCounts b:not(:first-child) { margin-left: 6px; }
+.tita-kgCounts em { margin-left: 4px; color: var(--tita-ink-faint); font-style: normal; }
+
+.tita-kgZoom { display: inline-flex; overflow: hidden; border: 1px solid var(--tita-line); border-radius: 7px; background: var(--tita-surface); }
+.tita-kgZoomOption { border: 0; background: transparent; padding: 4px 9px; color: var(--tita-ink-muted); font: inherit; font-size: 11px; cursor: pointer; }
+.tita-kgZoomOption + .tita-kgZoomOption { border-left: 1px solid var(--tita-line); }
+.tita-kgZoomOption:hover { background: var(--tita-surface-muted); color: var(--tita-ink); }
+.tita-kgZoomOn { background: var(--tita-surface-muted); color: var(--tita-ink); font-weight: 600; }
+
+/* ---------------------------------------------------------------- 画布 */
+
+/* 画布永远按设计尺寸渲染，缩放由板上的 transform 承担（见 useFitScale）。
+   外层 `overflow: auto` 承接 1:1 档的滚动；全屏下两个方向都可能有余量，居中。 */
+.tita-kgScroll { position: relative; width: 100%; min-width: 0; overflow: auto; background: var(--tita-surface); }
+.tita-kgStage:fullscreen .tita-kgScroll {
+  flex: 1 1 auto;
+  min-height: 0;
+  display: flex;
+  align-items: safe center;
+  justify-content: safe center;
+}
+.tita-kgBoard { flex: 0 0 auto; }
+.tita-kgCanvas { width: 100%; height: 100%; min-width: 0; }
+
+.tita-kgNode { cursor: pointer; }
+.tita-kgStage .tita-kgNode:hover { border-color: var(--tita-primary) !important; }
+.tita-kgNodeOn { cursor: default; }
+
+.tita-kgEmpty { position: absolute; inset: 0; display: grid; place-content: center; margin: 0; padding: 24px; color: var(--tita-ink-muted); font-size: 11.5px; text-align: center; }
+
+/* ---------------------------------------------------------------- 详情条 */
+
+.tita-kgDetail { display: grid; gap: 6px; flex: 0 0 auto; border-top: 1px solid var(--tita-line); padding: 9px 10px; }
+.tita-kgDetailHead { display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px; min-width: 0; }
+.tita-kgDetailHead > i { align-self: center; width: 6px; height: 6px; border-radius: 999px; }
+.tita-kgDetailHead code { color: var(--tita-ink-muted); font-family: var(--font-tita-mono); font-size: 10px; }
+.tita-kgDetailHead strong { min-width: 0; color: var(--tita-ink); font-size: 12px; font-weight: 650; }
+.tita-kgDetailHead em { margin-left: auto; color: var(--tita-ink-faint); font-size: 10px; font-style: normal; font-variant-numeric: tabular-nums; }
+.tita-kgNeighbors { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; color: var(--tita-ink-muted); font-size: 10.5px; }
+.tita-kgNeighbors button {
+  border: 1px solid var(--tita-line);
+  border-radius: 999px;
+  background: var(--tita-surface);
+  padding: 2px 8px;
+  color: var(--tita-ink);
+  font: inherit;
+  font-size: 10.5px;
+  cursor: pointer;
+}
+.tita-kgNeighbors button:hover { background: var(--tita-surface-muted); }

package/src/client/index.ts

@@ -0,0 +1,98 @@
+import type { Context as ClientContext } from '@deepseek-ai/cordis'
+// 只为一个类型副作用而导入：`configForms` 是 `dsh-client-ui-settings/client` 通过
+// `declare module '@deepseek-ai/cordis'` 挂到 Context 上的，不导入这个模块就看不见它。
+import type {} from '@deepseek-ai/dsh-client-ui-settings/client'
+import type { PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots'
+import type { SidebarRightTabDefinition } from '@deepseek-ai/dsh-client-ui-sidebar-right/client'
+import type {} from '@deepseek-ai/dsh-client-ui-sidebar-right/client'
+import type {} from '@deepseek-ai/dsh-client-ui-renderer/client'
+import { createElement, useEffect, useState, type ReactNode } from 'react'
+import { KnowledgePanel } from './KnowledgePanel.tsx'
+import type { SettingsScopeLike } from './NodeSettings.tsx'
+import { groupScope } from './config-scope.ts'
+import { type AgentPresetRemote } from './AgentPresetCard.tsx'
+
+const ID = 'dsh-data-domain-knowledge'
+const KIND = 'data-domain-knowledge'
+/**
+ * 本插件**Host entry** 的 id —— 注意它不是包名。
+ *
+ * 0.1.7 之后客户端的设置入口是 `configForms.get(entryId)`：设置已经不是一个独立的
+ * 命名空间文档，而是某条 profile entry 的 config。所以这里要写 `cordis.patch.yml`
+ * 里 `insert` 行的 `id`（`tita-data-domain-knowledge`），而不是包名
+ * `dsh-data-domain-knowledge`（那是模块说明符，也是下面 `ID` 的值）。
+ */
+const HOST_ENTRY_ID = 'tita-data-domain-knowledge'
+function Icon({ size = 16 }: { size?: number }): ReactNode { return createElement('svg', { width: size, height: size, viewBox: '0 0 16 16', fill: 'none', 'aria-hidden': true }, createElement('path', { d: 'M2 3.5 8 1l6 2.5v8L8 14l-6-2.5v-8Z M2 3.5 8 6l6-2.5 M8 6v8', stroke: 'currentColor', strokeWidth: 1.2, strokeLinejoin: 'round' })) }
+function definition(): SidebarRightTabDefinition { return { id: ID, kind: KIND, priority: 'extension', title: () => 'TitaAgent', guide: [{ id: `${ID}-guide`, order: 47, title: () => 'TitaAgent', icon: Icon }] } }
+interface TabInjected {
+  intent: SettingsScopeLike
+  knowledge: SettingsScopeLike
+  convert: SettingsScopeLike
+  /**
+   * agent preset 的 Remote 命名空间。取不到成员时「Agent 提示词」卡片会如实说不可用。
+   *
+   * 注意它现在只承载**只读**的两件事：名单（`agentPresets`）与打开真源目录
+   * （`session`）。「默认 preset」那一项已经撤了 —— 它是 DSH 设置里的一项，在这里
+   * 再摆一个只是同一字段的第二个入口。
+   */
+  remote: AgentPresetRemote
+}
+
+function Tab({ useTabInfo }: PropsRuntime<'sidebar.right.pane.tab'>, injected: TabInjected): ReactNode {
+  const { tab } = useTabInfo()
+  return createElement(KnowledgePanel, {
+    visible: tab.visible,
+    onOpenTab: kind => { tab.actions.openTab(kind) },
+    settings: injected,
+    remote: injected.remote,
+  })
+}
+
+/**
+ * `remote.agentPresets` 是「Agent 提示词」卡片读 preset 名单用的。
+ *
+ * **这个命名空间必须写进 `inject`，不能只 inject 顶层的 `remote` 再懒读。**
+ * 一开始就是这么写的（想的是「一张只读卡片不该有能力让整个 tab 消失」），结果
+ * cordis 的 remote 代理对未声明 inject 的属性**直接抛**：
+ *
+ *     Error: cannot get property "remote.agentPresets" without inject
+ *
+ * 而它抛在 `useEffect` 里，于是 React 把整个面板子树卸掉了 —— 打开设置抽屉 =
+ * 面板变空白。浏览器核验才看出来（测试断言不出来），所以这里如实记下来。
+ *
+ * 现在按 DSH 自己的写法声明（`dsh-client-ui-agent-preset` 就是这么 inject 的），
+ * 并且卡片内部再兜一层 try/catch：命名空间万一不在，卡片显示「不可用」，而不是
+ * 把面板带走。
+ *
+ * 两个命名空间，两件事：
+ *
+ * - `remote.agentPresets` —— 读 preset 名单与组合正文（只读）。
+ * - `remote.session` —— 打开提示词的**真源目录**（`openWorkspacePath`）。0.1.7 去掉的
+ *   是 `remote.settings`（它指向 DSH 那边装好的 preset，而那边不再是目录），不是
+ *   「打开一个目录」这件事本身：真源目录是插件自己的 `preset/tita-data-agent/`，
+ *   提示词就住在里面。`dsh-client-ui-open-in-app` 用的也是 `remote.session`。
+ *
+ * `settingsScope`（0.1.5 的客户端设置入口）在 0.1.7 被 `configForms` 取代，所以
+ * 这里换的就是它 —— 名字变了，理由没变：**用哪个服务就必须声明哪个**。
+ */
+export const inject = [
+  'slots', 'sidebarRightTabs', 'configForms',
+  'remote', 'remote.agentPresets', 'remote.session',
+] as const
+export function apply(ctx: ClientContext): void {
+  /**
+   * 三块设置现在住在**同一个 entry** 的 config 里（`knowledge` / `intent` / `convert`
+   * 三个组），所以取一次表单、按组切三次，而不是像 0.1.5 那样 bind 三个命名空间。
+   * `groupScope` 负责把「组」这件事挡住：值切到组内，写操作补上路径前缀。
+   */
+  const form = ctx.configForms.get<Record<string, unknown>>(HOST_ENTRY_ID)
+  const settings = {
+    intent: groupScope(form, 'intent'),
+    knowledge: groupScope(form, 'knowledge'),
+    convert: groupScope(form, 'convert'),
+  }
+  const injected: TabInjected = { ...settings, remote: (ctx as unknown as { remote?: AgentPresetRemote }).remote ?? {} }
+  ctx.effect(() => ctx.sidebarRightTabs.register(definition()), 'tita knowledge: tab type')
+  ctx.effect(() => ctx.slots.inject('sidebar.right.pane.tab', () => ctx.slots.register({ name: 'sidebar.right.pane.tab', key: ID }, props => Tab(props, injected))), 'tita knowledge: tab body')
+}