@changfenhuang/dsh-genui 0.11.2 → 0.11.4

package/src/client/blocks/charts.tsx

@@ -20,6 +20,7 @@ import { t as tr, useT } from '../i18n/index.ts'
 import css from '../GenuiBlock.module.css'
 import { GENUI_LIMITS } from '../genui-runtime/index.ts'
 import type { GenuiChart, GenuiTable } from '../spec.ts'
+import { isTableGroupHeaderRow, tableRowsForDetails } from '../table-details.ts'
 
 export const CHART_COLORS = [
   'var(--dsw-static-deepseek-400)',
@@ -85,6 +86,33 @@ function numericColumns(rows: GenuiTable['rows'], nCols: number): boolean[] {
   })
 }
 
+/**
+ * Does this cell carry real line breaks? Table cells default to `nowrap` (the
+ * data voice), which also collapses the leading whitespace of a pasted code
+ * block — indentation is lost and the snippet no longer runs. Cells that do
+ * contain a line break get `pre-line` (see `.tdMultiline`), so the line
+ * structure survives and the text still copies back as multiple lines.
+ */
+function hasLineBreak(value: string | number): boolean {
+  return typeof value === 'string' && /[\n\r]/.test(value)
+}
+
+/**
+ * Is this cell code rather than prose? Only then is leading indentation
+ * significant (`pre-wrap`), while a prose line break stays `pre-line` so its
+ * surrounding spaces collapse exactly like the rest of the UI.
+ */
+function isCodeCell(value: string | number): boolean {
+  if (typeof value !== 'string') return false
+  return /(^|\n)[ \t]/.test(value) || value.includes('```')
+}
+
+/** The whitespace class a multi-line cell needs, or undefined for single-line. */
+function cellWrapClass(value: string | number): string | undefined {
+  if (!hasLineBreak(value)) return undefined
+  return isCodeCell(value) ? css.tdCode : css.tdMultiline
+}
+
 /** Signed cell text (`+12.4%`, `-3`, `−2.1k`) reads as a delta without any
  *  new spec field — the renderer classifies the string. */
 function deltaTone(value: unknown): 'up' | 'down' | null {
@@ -206,9 +234,8 @@ export const TableNode = memo(function TableNode({ node, renderDetail, filterVal
 }) {
   useT()
   const columns = node.columns.slice(0, GENUI_LIMITS.maxTableCols)
-  const rows = node.rows.slice(0, GENUI_LIMITS.maxTableRows)
+  const rows = tableRowsForDetails<GenuiTable['rows'][number]>(node)
   const types = node.types ?? []
-  const groupMode = types[0] === 'group'
   const [sort, setSort] = useState<{ col: number; dir: 1 | -1 } | null>(null)
   const [collapsed, setCollapsed] = useState<ReadonlySet<number>>(() => new Set())
   const [expanded, setExpanded] = useState<ReadonlySet<number>>(() => new Set())
@@ -227,9 +254,7 @@ export const TableNode = memo(function TableNode({ node, renderDetail, filterVal
   // filled and every other cell empty opens a section. Data rows after it are
   // its CHILDREN — indented, counted, and collapsible — so the relationship is
   // unmistakable instead of "one more row at the same level".
-  const isGroupRow = (row: GenuiTable['rows'][number]): boolean =>
-    groupMode && String(row[0] ?? '').trim() !== ''
-    && row.slice(1).every(cell => String(cell ?? '').trim() === '')
+  const isGroupRow = (row: GenuiTable['rows'][number]): boolean => isTableGroupHeaderRow(row, types)
 
   // Local filtering (bound control): the model ships the full data set once and
   // the reader narrows it live — no round trip, no re-generation.
@@ -308,11 +333,17 @@ export const TableNode = memo(function TableNode({ node, renderDetail, filterVal
 
   const renderCell = (cell: string | number, j: number, rowIndex: number): ReactNode => {
     const type = types[j]
+    const wrap = cellWrapClass(cell)
     const tone = type === 'delta'
       ? (String(cell).trim().startsWith('-') ? 'down' : 'up')
       : deltaTone(cell)
     return (
-      <td key={j} className={numeric[j] || type === 'num' ? css.tdNum : undefined}>
+      <td
+        key={j}
+        className={[numeric[j] || type === 'num' ? css.tdNum : undefined, wrap]
+          .filter(part => part !== undefined)
+          .join(' ') || undefined}
+      >
         {type === 'badge'
           ? <span className={css.cellBadge}>{renderInline(String(cell), false)}</span>
           : type === 'bar'
@@ -340,7 +371,9 @@ export const TableNode = memo(function TableNode({ node, renderDetail, filterVal
             {columns.map((c, i) => (
               <th
                 key={i}
-                className={numeric[i] ? css.thNum : undefined}
+                className={[numeric[i] ? css.thNum : undefined, cellWrapClass(c)]
+                  .filter(part => part !== undefined)
+                  .join(' ') || undefined}
                 aria-sort={sort !== null && sort.col === i ? (sort.dir === 1 ? 'ascending' : 'descending') : 'none'}
               >
                 <button type="button" className={css.thSort} onClick={() => clickHeader(i)}>
@@ -359,7 +392,7 @@ export const TableNode = memo(function TableNode({ node, renderDetail, filterVal
               <Fragment key={section.header === null ? `s-${si}` : `g-${section.header.index}`}>
                 {section.header !== null && (
                   <tr className={css.groupRow}>
-                    <td colSpan={columns.length}>
+                    <td colSpan={columns.length} className={cellWrapClass(String(section.header.row[0]))}>
                       <button
                         type="button"
                         className={css.groupToggle}

package/src/client/blocks/forms.tsx

@@ -8,7 +8,9 @@ import { useEffect, useId, useRef, useState } from 'react'
 import css from '../GenuiBlock.module.css'
 import { GENUI_LIMITS } from '../genui-runtime/index.ts'
 import { useT } from '../i18n/index.ts'
-import type { AnswersState, GenuiBlockProps, QuestionMeta } from './state.ts'
+import { resolveSubmitState } from '../submission-registry.ts'
+import type { RadioSubmissionMember } from '../submission-registry.ts'
+import type { AnswersState, GenuiBlockProps } from './state.ts'
 import type { GenuiInput, GenuiRadio, GenuiSelect, GenuiSlider, GenuiSubmit, GenuiSwitch, GenuiTextarea } from '../spec.ts'
 
 export function RadioNode({ node, onAction, answers }: {
@@ -22,7 +24,7 @@ export function RadioNode({ node, onAction, answers }: {
   const options = node.options.slice(0, GENUI_LIMITS.maxOptions)
   // No default selection unless the model explicitly sets `selected` — a
   // pre-checked first option silently swallows the user's "keep the default"
-  // answer (the registry only records real change events). A DURABLE answer
+  // answer (the interaction state only records selected values). A DURABLE answer
   // (restored from localStorage) wins over both. The parent key includes the
   // reset round, so 重新作答 remounts this radio with a clean selection —
   // no sync effect needed.
@@ -32,17 +34,8 @@ export function RadioNode({ node, onAction, answers }: {
   const [selected, setSelected] = useState<number | null>(restoredIndex >= 0 ? restoredIndex : (node.selected ?? null))
   const uid = useId()
   const locked = grouped && answers?.locked === true
-  // Register question metadata for local grading (mount + when the question
-  // changes). `answers` is deliberately NOT a dep: the callback identity is
-  // stable and re-registering on every answers update is needless churn.
   useEffect(() => {
     if (group === undefined) return
-    answers?.registerMeta(group, {
-      label: node.label ?? group,
-      options,
-      answer: node.answer,
-      explanation: node.explanation,
-    })
     // A model-provided default selection IS the answer — but only when the
     // group has no durable answer yet (a restored user choice must win).
     if (node.selected !== undefined && options[node.selected] !== undefined && answers?.answers[group] === undefined) {
@@ -77,16 +70,14 @@ export function RadioNode({ node, onAction, answers }: {
   )
 }
 
-/** Resolve a question's correct label from its metadata. */
-export function correctLabelOf(m: QuestionMeta): string | undefined {
+/** 根据静态 radio member 获取正确选项的标签。 */
+export function correctLabelOf(m: RadioSubmissionMember): string | undefined {
   if (m.answer === undefined) return undefined
   if (typeof m.answer === 'number') return m.options[m.answer]
   return m.answer
 }
 
-/** Submit: collect grouped radio and checkbox answers. Radio-only scopes keep
- * LOCAL-FIRST grading; when checkbox selections participate, the click falls
- * back to the aggregation action so multi-select data is never discarded. */
+/** 汇总当前 block 的表单状态，并根据 resolver 的结果提交或本地判卷。 */
 export function SubmitNode({ node, onAction, answers }: {
   node: GenuiSubmit
   onAction?: GenuiBlockProps['onAction']
@@ -96,34 +87,21 @@ export function SubmitNode({ node, onAction, answers }: {
   const recorded = answers?.answers ?? {}
   const multiRecorded = answers?.multiAnswers ?? {}
   const fields = answers?.fields ?? {}
-  const meta = answers?.meta ?? {}
   const expected = node.groups
   // One shared notion of "filled fields" for answered/ready/payload: non-blank
   // values only, secrets (password inputs) never collected into submit.
   const filledFields = Object.fromEntries(
     Object.entries(fields).filter(([id, v]) => v.trim() !== '' && !answers?.secretFields.has(id)),
   )
-  const nonEmptyMultiGroups = Object.entries(multiRecorded)
-    .filter(([, values]) => Array.isArray(values) && values.length > 0)
-    .map(([group]) => group)
-  const recordedGroups = new Set([...Object.keys(recorded), ...nonEmptyMultiGroups])
-  const hasRecordedAnswer = (group: string): boolean =>
-    recorded[group] !== undefined || (Array.isArray(multiRecorded[group]) && multiRecorded[group]!.length > 0)
-
-  // Explicit groups require at least one selected checkbox (or a radio answer)
-  // per group. Empty checkbox arrays remain durable state but are deliberately
-  // not considered "answered".
-  const answered = expected === undefined
-    ? Math.max(recordedGroups.size, Object.keys(filledFields).length)
-    : expected.filter(hasRecordedAnswer).length
-  const total = expected?.length ?? answered
-  const scope = expected ?? [...recordedGroups]
-  const hasMultiInScope = scope.some(group =>
-    Array.isArray(multiRecorded[group]) && multiRecorded[group]!.length > 0,
-  )
-  // Local grading must be radio-only. Otherwise grading would consume the
-  // click and silently omit checkbox selections that need model delivery.
-  const canGradeLocally = !hasMultiInScope && scope.some(group => meta[group]?.answer !== undefined)
+  const resolved = answers === undefined ? { scope: [], answered: 0, total: expected?.length ?? 0, localGradeEligible: false, hasOutOfScopePayload: false }
+    : resolveSubmitState({
+      registry: answers.registry,
+      ...(expected === undefined ? {} : { groups: expected }),
+      state: { answers: recorded, multiAnswers: multiRecorded, fields, secretFields: answers.secretFields },
+    })
+  const { scope, answered, total } = resolved
+  const canSendAction = node.action !== undefined && onAction !== undefined
+  const shouldGradeLocally = resolved.localGradeEligible && (!resolved.hasOutOfScopePayload || !canSendAction)
   const submitted = answers?.locked === true
   const collectedAnswers: Record<string, string | string[]> = {
     ...recorded,
@@ -133,12 +111,12 @@ export function SubmitNode({ node, onAction, answers }: {
   // grading, or a real action name + provider. A submit with neither is a
   // display-only control — honest disabled affordance.
   const ready = answered > 0 && answered >= total
-    && (canGradeLocally || (node.action !== undefined && onAction !== undefined))
+    && (shouldGradeLocally || canSendAction)
 
   if (submitted) {
     // ── local grading result ──
-    const graded = scope.filter(g => recorded[g] !== undefined && meta[g]?.answer !== undefined)
-    const score = graded.filter(g => recorded[g] === correctLabelOf(meta[g]!)).length
+    const graded = scope.filter((member): member is RadioSubmissionMember => member.kind === 'radio' && recorded[member.key] !== undefined && member.answer !== undefined)
+    const score = graded.filter(member => recorded[member.key] === correctLabelOf(member)).length
     return (
       <div className={css.gradeWrap} data-genui-grade>
         <div className={css.gradeScore}>
@@ -146,14 +124,14 @@ export function SubmitNode({ node, onAction, answers }: {
           <span className={css.gradeScoreLabel}>{t('block.score')}{graded.length < scope.length ? t('block.scoreUngraded', { count: scope.length - graded.length }) : ''}</span>
         </div>
         <div className={css.gradeList}>
-          {scope.map(g => {
-            const entry = recorded[g]
-            const m = meta[g]
-            if (entry === undefined || m === undefined) return null
+          {scope.map(m => {
+            if (m.kind !== 'radio') return null
+            const entry = recorded[m.key]
+            if (entry === undefined) return null
             const correct = correctLabelOf(m)
             if (correct === undefined) {
               return (
-                <div key={g} className={css.gradeItem}>
+                <div key={m.key} className={css.gradeItem}>
                   <span className={css.gradeQ}>{renderInline(m.label)}</span>
                   <span className={css.gradeAns}>{t('block.yourAnswer')}{renderInline(entry)}</span>
                 </div>
@@ -161,7 +139,7 @@ export function SubmitNode({ node, onAction, answers }: {
             }
             const isCorrect = entry === correct
             return (
-              <div key={g} className={`${css.gradeItem} ${isCorrect ? css.gradeItemOk : css.gradeItemNo}`}>
+              <div key={m.key} className={`${css.gradeItem} ${isCorrect ? css.gradeItemOk : css.gradeItemNo}`}>
                 <span className={css.gradeQ}>{renderInline(m.label)}</span>
                 <span className={css.gradeTag}>{isCorrect ? '✓' : '✗'}</span>
                 <span className={css.gradeAns}>
@@ -196,7 +174,7 @@ export function SubmitNode({ node, onAction, answers }: {
         className={`${css.button} ${css.primary} ${css.submit}`}
         disabled={!ready}
         onClick={ready ? () => {
-          if (canGradeLocally) {
+          if (shouldGradeLocally) {
             // Local grading: immediate in-place result, no model round trip.
             answers?.setLocked(true)
           } else if (node.action !== undefined && onAction !== undefined) {

package/src/client/blocks/render-node.tsx

@@ -299,7 +299,7 @@ export function renderNode(
       return (
         <span key={key} className={`${css.badge} ${css[tone] || ''}`}>
           {node.icon !== undefined && <span aria-hidden>{node.icon} </span>}
-          {renderInline(node.label, false)}
+          <span className={css.badgeLabel}>{renderInline(node.label, false)}</span>
         </span>
       )
     }

package/src/client/blocks/state.ts

@@ -7,6 +7,7 @@
  */
 import type { GenuiSpec } from '../spec.ts'
 import type { BlockInteractionState } from '../interaction-store.ts'
+import type { SubmissionRegistry } from '../submission-registry.ts'
 
 export interface GenuiBlockProps {
   /** Parsed spec to render. */
@@ -35,16 +36,6 @@ export interface GenuiBlockProps {
   onStateSnapshot?: ((state: BlockInteractionState) => void) | undefined
 }
 
-/** Per-question metadata registered by grouped radios for local grading. */
-export interface QuestionMeta {
-  label: string
-  options: string[]
-  /** Correct option: index (number) or label (string); absent = no local grading. */
-  answer?: number | string | undefined
-  /** Shown after local grading. */
-  explanation?: string | undefined
-}
-
 /** Block-wide aggregation state. Grouped radios store one selected label in
  * `answers`; grouped checkboxes store a selected-label array in
  * `multiAnswers`. Keeping the registries separate preserves the existing
@@ -60,7 +51,7 @@ export interface AnswersState {
   fields: Record<string, string>
   /** Field ids whose value must never be persisted or collected (secrets). */
   secretFields: ReadonlySet<string>
-  meta: Record<string, QuestionMeta>
+  registry: SubmissionRegistry
   /** True after a local grading: questions are locked until 重新作答. */
   locked: boolean
   /** Bumped by every reset; radios use it as their remount key. */
@@ -69,7 +60,6 @@ export interface AnswersState {
   setMultiAnswer: (group: string, choice: string, checked: boolean) => void
   setField: (id: string, value: string) => void
   registerSecretField: (id: string) => void
-  registerMeta: (group: string, meta: QuestionMeta) => void
   clear: () => void
   setLocked: (locked: boolean) => void
 }

package/src/client/dom-fence.tsx

@@ -4,8 +4,9 @@
  * Stock DSH renders every fenced code block through the shared CodeBlock
  * surface (stable class `md-code-block`, language label rendered as the
  * banner's childless label div). This channel observes the conversation DOM,
- * finds blocks labelled `dsh-ui`, parses the raw fence body and mounts the
- * plugin's own React tree next to the (hidden) stock block:
+ * finds blocks labelled `dsh-ui` or complete `<dsh-ui>…</dsh-ui>` text spans,
+ * parses the raw fence body and mounts the plugin's own React tree next to
+ * the hidden host element:
  *
  * Fence discovery is **multi-surface** (issue #6): besides `md-code-block`,
  * the channel also matches the deepsuite-style surfaces some host builds
@@ -13,8 +14,9 @@
  * structural backstop — ANY element whose banner labels it `dsh-ui` and
  * which contains a `<pre>` body. The only invariants are the language label
  * (a leaf element with the exact text `dsh-ui`, outside the code body) and
- * the `<pre>`, so a host DOM drift degrades to a rendered fence, never a
- * silently skipped one:
+ * the `<pre>`. Desktop 0.11.0 instead emits a plain-text tag span for the
+ * same fence; the DOM channel recognizes that exact wrapper in assistant
+ * messages:
  *
  * - **Streaming takeover**: the channel takes over a dsh-ui block as soon as
  *   ONE finished component parses (the partial parser), and re-renders the
@@ -46,7 +48,7 @@
  *
  * Security posture matches the registry channel: only code shipped in this
  * plugin's browser bundle mounts React roots, the model can only author
- * fence text, and unrepairable bodies stay stock code blocks.
+ * fence text, and unrepairable bodies remain visible in their host form.
  */
 import { Fragment, isValidElement, type Key, type ReactNode } from 'react'
 import { createRoot, type Root } from 'react-dom/client'
@@ -58,6 +60,7 @@ import type { SessionId } from '@deepseek-ai/dsh-session/types'
 import { GenuiActionContext, type GenuiActionHandler } from './action-context.ts'
 import css from './GenuiBlock.module.css'
 import { renderSvgFence } from './svg-fence.tsx'
+import { repairFenceJson, trimToBalancedRoot } from '../shared/fence-repair.ts'
 import { describeFenceFailure, FenceDiagnostic, renderResolvedFenceNode, type GenuiFenceContext } from './fence-render.tsx'
 import { resolveViewedSessionId } from './session-resolver.ts'
 import { validateCanonicalGenuiSpec } from './guard.ts'
@@ -161,6 +164,18 @@ function isTextNode(node: Node): node is Text {
   return node.nodeType === Node.TEXT_NODE
 }
 
+/** 读取 DSH Desktop 0.11.0 将 dsh-ui 围栏呈现为纯文本标签时的正文。 */
+function tagTextBodyOf(block: Element): string | null {
+  if (block.tagName !== 'SPAN' || block.childElementCount !== 0) return null
+  const flowKind = block.closest('[data-chat-flow-kind]')?.getAttribute('data-chat-flow-kind')
+  if (flowKind !== undefined && flowKind !== null && flowKind !== 'assistant-step') return null
+  const text = block.textContent?.trim() ?? ''
+  const opening = '<dsh-ui>'
+  const closing = '</dsh-ui>'
+  if (!text.startsWith(opening) || !text.endsWith(closing)) return null
+  return text.slice(opening.length, -closing.length).trim()
+}
+
 /** The banner's language label: a leaf element whose text is exactly the
  * lang. CodeBlock renders the label as a childless div; deepsuite-style
  * surfaces use a span; the ONLY structural invariants across hosts are "a
@@ -188,12 +203,39 @@ function infostringOf(block: Element): 'dsh-ui' | 'svg' | null {
   return null
 }
 
-const GENERIC_CODE_LABELS = new Set(['Code', 'Code block', '代码块'])
+/**
+ * 已知**真实语言标识符**的闭集：语言 id 有限、由本插件维护，白名单列它是对的。
+ * 反例——宿主各语言里通用代码块标题的叫法（`Code` / `代码块` / «Код» / Código /
+ * Codice / Kode …）——是**无界集合**，白名单永远列不全：旧实现 `GENERIC_CODE_LABELS`
+ * 只列了英/中两种，宿主 locale 为其它语言时本地化标题被当成真语言，围栏永远不被
+ * 接管（issue #258）。因此判定反转：标签命中本集合才视为「带语言」，其余（空标签、
+ * 本地化通用词）一律视为「无语言」，由 {@link isGenericGenuiFence} 的内容校验把关——
+ * 同一份正文的渲染结果不因宿主语言而不同。
+ */
+const KNOWN_LANGUAGE_LABELS = new Set([
+  // 插件自有语言
+  'dsh-ui', 'svg',
+  // 数据 / 标记 / 纯文本
+  'json', 'json5', 'yaml', 'yml', 'toml', 'ini', 'xml', 'html', 'css', 'scss', 'sass', 'less',
+  'markdown', 'md', 'text', 'txt', 'plain', 'plaintext', 'log', 'console', 'diff', 'patch',
+  // 助手回复里常见的编程语言
+  'js', 'jsx', 'javascript', 'ts', 'tsx', 'typescript', 'python', 'py', 'bash', 'sh', 'shell', 'zsh',
+  'sql', 'graphql', 'gql', 'rust', 'go', 'golang', 'java', 'kotlin', 'kt', 'swift', 'scala', 'dart',
+  'c', 'h', 'cpp', 'c++', 'cxx', 'cs', 'csharp', 'php', 'ruby', 'rb', 'perl', 'lua', 'r', 'matlab',
+  'haskell', 'hs', 'elixir', 'ex', 'erlang', 'clojure', 'clj', 'groovy', 'objc', 'objective-c',
+  'dockerfile', 'docker', 'makefile', 'make', 'cmake', 'protobuf', 'proto',
+])
 
-/** Read a language that the host still exposes in its CodeBlock banner. */
+/**
+ * Read a language that the host still exposes in its CodeBlock banner.
+ *
+ * 只有标签命中 {@link KNOWN_LANGUAGE_LABELS} 才返回语言；空标签与本地化通用词
+ * （«Код» / Código / 代码块 …）是宿主的**呈现文案**、不是语义，一律返回 null——
+ * 此前它们会被当成真语言，连 ChatSnapshot 来源都被短路（issue #258）。
+ */
 function domLanguageOf(block: Element): string | null {
   const label = labelTextOf(block)
-  return label === '' || GENERIC_CODE_LABELS.has(label) ? null : label
+  return label !== '' && KNOWN_LANGUAGE_LABELS.has(label.toLowerCase()) ? label : null
 }
 
 /** The banner label's raw text (empty while streaming — the host renders the
@@ -210,7 +252,18 @@ function labelTextOf(block: Element): string {
   return ''
 }
 
-/** 仅在通用 CodeBlock 的完整 JSON 通过现有 GenUI 规范时恢复丢失的围栏语言。
+/**
+ * 仅在通用 CodeBlock 的内容经过**与带标签路径相同的标点级修复**后仍是合规 GenUI
+ * 规范时，恢复丢失的围栏语言。
+ *
+ * 宿主会隐去它不认识的语言（高亮器不支持 `dsh-ui`），于是同一份围栏在 DOM 里表现为
+ * 一个通用标题的普通代码块（标题随宿主 locale 本地化：`Code` / `代码块` / «Код» …）；
+ * ChatSnapshot 的语言来源在部分行上不可用
+ * 时，内容识别是唯一出路。此前这里要求 `JSON.parse(raw)` 直接通过，导致**正文只差一个
+ * 未转义引号（tier-1 能修）的围栏永远不会被接管**——用户看到一个能渲染却始终是代码块的
+ * 围栏（真实会话 seq 40530：正文经 tier-1 修 14 处后可渲染，界面却停在代码块）。
+ * 结构级修复（tier-2）刻意不参与：内容识别是兜底，不该接管只是"长得像 JSON"的普通代码。
+
  *
  * @param block - 宿主提供的代码块元素。
  * @param raw - 未修改的围栏正文。
@@ -219,20 +272,33 @@ function labelTextOf(block: Element): string {
 function isGenericGenuiFence(block: Element, raw: string): boolean {
   const row = block.closest<HTMLElement>(ASSISTANT_FLOW_ROW)
   if (row === null || row.dataset.chatGroupPart === 'reasoning') return false
+  // domLanguageOf 已反转（#258）：banner 是已知真实语言 ⇒ 不是通用块；空标签或
+  // 本地化通用词 ⇒ null，进入内容校验。这里不再要求标题命中任何白名单。
   if (domLanguageOf(block) !== null || !block.querySelector('[data-code-block-banner]')) return false
-  if (!GENERIC_CODE_LABELS.has(labelTextOf(block))) return false
+  const repaired = repairFenceJson(raw)
+  const candidate = repaired === null ? raw : repaired.text
   let value: unknown
   try {
-    value = JSON.parse(raw)
+    value = JSON.parse(candidate)
   } catch {
-    return false
+    // 「合法 JSON + 尾部杂字符」（真实样本：模型把工具调用模板泄漏在 JSON 之后，
+    // 而且围栏没闭合）同样要能认出来：裁到平衡根值再试一次。只裁剪、不补全结构。
+    const trimmed = trimToBalancedRoot(candidate)
+    if (trimmed === null) return false
+    try {
+      value = JSON.parse(trimmed)
+    } catch {
+      return false
+    }
   }
   if (!validateCanonicalGenuiSpec(value).ok || diagnoseUnknownGenuiFields(value).length > 0) return false
   return JSON.stringify(normalizeGenuiSpec(value).value) === JSON.stringify(value)
 }
 
-/** Raw fence body from the stock block's code surface. */
+/** 读取宿主代码块或纯文本标签中的围栏正文。 */
 function rawOf(block: Element): string {
+  const tagTextBody = tagTextBodyOf(block)
+  if (tagTextBody !== null) return tagTextBody
   const pre = block.querySelector('pre')
   if (pre === null) return ''
   let text = ''
@@ -274,7 +340,7 @@ function implausibleLabeledAncestorOf(pre: HTMLElement, scope: ParentNode = docu
 }
 
 /**
- * Every dsh-ui fence surface under `scope`, outer-most first, deduped.
+ * Every dsh-ui fence surface or complete tag-text span under `scope`, in DOM order.
  * Known surface classes first (cheap, ordered), then a structural sweep —
  * every `<pre>` whose banner labels it `dsh-ui` — so a host with an
  * unlisted surface shape still renders. The label + `<pre>` gates make the
@@ -327,7 +393,12 @@ function findFenceCandidates(scope: ParentNode = document): HTMLElement[] {
     out.push(surface)
     seen.add(surface)
   }
-  return out
+  for (const span of scope.querySelectorAll<HTMLElement>('span')) {
+    if (span.closest(`.${CONTAINER_CLASS}, .${DIAGNOSTIC_CLASS}, ${CODE_BLOCK_SELECTORS}, [data-chat-group-part="reasoning"], [data-tool], [data-sidebar-chat], [data-sidebar-right-session], [data-sidebar-right-panel], [data-panel-conversation], [data-plugin-panel]`) !== null) continue
+    if (tagTextBodyOf(span) === null) continue
+    out.push(span)
+  }
+  return out.sort((left, right) => left.compareDocumentPosition(right) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1)
 }
 
 /** One-time-per-install drift diagnostic flag (reset per install, so tests
@@ -383,7 +454,7 @@ function fenceIndexOf(ctx: Context, row: Element, block: Element, sourceLanguage
     let fallbackIndex = 0
     for (const candidate of findFenceCandidates(scope)) {
       if (candidate.closest(STREAMING) !== null) continue
-      const language = domLanguageOf(candidate) ?? sourceLanguage(candidate)
+      const language = tagTextBodyOf(candidate) !== null ? 'dsh-ui' : domLanguageOf(candidate) ?? sourceLanguage(candidate)
       if (language !== 'dsh-ui' && !(language === undefined && isGenericGenuiFence(candidate, rawOf(candidate)))) continue
       fallbackIndex += 1
       if (candidate === block) return fallbackIndex
@@ -391,9 +462,11 @@ function fenceIndexOf(ctx: Context, row: Element, block: Element, sourceLanguage
     return fallbackIndex + 1
   }
   let index = 0
-  for (const candidate of hostFenceBlocksOf(row)) {
+  for (const candidate of findFenceCandidates(row)) {
     if (candidate.closest(STREAMING) !== null) continue
-    const language = domLanguageOf(candidate) ?? sourceLanguage(candidate)
+    if (candidate.closest(ASSISTANT_FLOW_ROW) !== row) continue
+    if (candidate.closest('[data-chat-group-part="reasoning"]') !== null) continue
+    const language = tagTextBodyOf(candidate) !== null ? 'dsh-ui' : domLanguageOf(candidate) ?? sourceLanguage(candidate)
     if (language !== 'dsh-ui' && !(language === undefined && isGenericGenuiFence(candidate, rawOf(candidate)))) continue
     index += 1
     if (candidate === block) return index
@@ -744,7 +817,7 @@ export function installDomFenceRenderer(
     if (block.hasAttribute(PROCESSED)) return
     const row = rowOf(block)
     const settled = isSettled(block)
-    const domLanguage = domLanguageOf(block)
+    const domLanguage = tagTextBodyOf(block) !== null ? 'dsh-ui' : domLanguageOf(block)
     const sourceLanguage = domLanguage === null ? sourceLanguages.get(block) : undefined
     const language = domLanguage ?? sourceLanguage
     const raw = rawOf(block)
@@ -877,7 +950,7 @@ export function installDomFenceRenderer(
       }
       const raw = rawOf(block)
       const settled = isSettled(block)
-      const domLanguage = domLanguageOf(block)
+      const domLanguage = tagTextBodyOf(block) !== null ? 'dsh-ui' : domLanguageOf(block)
       const sourceLanguage = domLanguage === null ? sourceLanguages.get(block) : undefined
       const language = domLanguage ?? sourceLanguage
       const validGenui = language === 'dsh-ui'
@@ -972,7 +1045,7 @@ export function installDomFenceRenderer(
       // label is no longer dsh-ui is somebody else's fence, so our explanation
       // would be about the wrong block.
       if (isSettled(block)) {
-        const domLanguage = domLanguageOf(block)
+        const domLanguage = tagTextBodyOf(block) !== null ? 'dsh-ui' : domLanguageOf(block)
         const sourceLanguage = domLanguage === null ? sourceLanguages.get(block) : undefined
         if ((domLanguage ?? sourceLanguage) !== 'dsh-ui') {
           clearDiagnostic(block)

package/src/client/genui-runtime/diagnostics.ts

@@ -2,6 +2,7 @@
 import { COMPONENT_SCHEMAS, GENUI_SPEC_SCHEMA } from './schema.ts'
 import { isComponentRoot } from '../spec.ts'
 import type { ComponentRecordSchema, ComponentSchema } from './schema.ts'
+import { isTableDetailReachable } from '../table-details.ts'
 
 export interface GenuiDiagnostic {
   readonly kind: 'alias' | 'unknown-field'
@@ -47,6 +48,13 @@ function visitNativeNodes(value: unknown, path: string, visit: (node: Record<str
       const holder = record(item)
       if (holder?.items !== undefined && Array.isArray(holder.items)) holder.items.forEach((child, childIndex) => children(child, `${path}.items[${index}].items[${childIndex}]`))
     })
+  } else if (type === 'table' && Array.isArray(value.details)) {
+    const table = { columns: value.columns, rows: value.rows, types: value.types }
+    value.details.forEach((detail, rowIndex) => {
+      if (Array.isArray(detail) && isTableDetailReachable(table, rowIndex)) {
+        detail.forEach((child, childIndex) => children(child, `${path}.details[${rowIndex}][${childIndex}]`))
+      }
+    })
   }
 }
 
@@ -123,6 +131,18 @@ export function diagnoseUnknownGenuiFields(value: unknown): GenuiDiagnostic[] {
       pushUnknownField(warnings, path, field, node.type as string)
     }
     diagnoseNestedFields(node, path, definition, warnings)
+    if (node.type === 'list' && Array.isArray(node.items)) {
+      node.items.forEach((item, index) => {
+        if (isNode(item)) return
+        const holder = record(item)
+        if (holder === undefined) return
+        for (const field of Object.keys(holder)) {
+          if (field === 'title' || field === 'desc') continue
+          const itemPath = `${path}.items[${index}]`
+          warnings.push({ kind: 'unknown-field', path: `${itemPath}.${field}`, message: `${itemPath}.${field}: list items render 'title' and 'desc' only — '${field}' is dropped`, type: 'list', field })
+        }
+      })
+    }
   }
   if (Array.isArray(root.items) && !isComponentRoot(root)) {
     for (const field of Object.keys(root)) {