npm - dsh-better-display - Versions diffs - 0.3.7 → 0.3.9 - Mend

dsh-better-display 0.3.7 → 0.3.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (208) hide show

package/CHANGELOG.md +22 -1
package/DESIGN.md +43 -3
package/README.en.md +9 -1
package/README.md +9 -1
package/docs/dependency-update-policy.md +9 -0
package/docs/extension-points.md +172 -0
package/docs/official-rendering-bridge.md +59 -18
package/docs/openapi.yaml +147 -0
package/docs/runbooks/blank-reader.md +39 -0
package/lib/client.js +1629 -586
package/lib/client.js.map +1 -1
package/lib/dsh-better-display.js +535 -57
package/lib/types/client/AssistantNode.d.ts +20 -0
package/lib/types/client/AssistantNode.d.ts.map +1 -0
package/lib/types/client/AssistantNode.js +46 -0
package/lib/types/client/AssistantNode.js.map +1 -0
package/lib/types/client/Blocks.d.ts.map +1 -1
package/lib/types/client/Blocks.js +33 -10
package/lib/types/client/Blocks.js.map +1 -1
package/lib/types/client/ChoreographedFlow.d.ts.map +1 -1
package/lib/types/client/ChoreographedFlow.js +2 -0
package/lib/types/client/ChoreographedFlow.js.map +1 -1
package/lib/types/client/ClosedProcessSummary.d.ts.map +1 -1
package/lib/types/client/ClosedProcessSummary.js +3 -1
package/lib/types/client/ClosedProcessSummary.js.map +1 -1
package/lib/types/client/McpAppFrame.d.ts.map +1 -1
package/lib/types/client/McpAppFrame.js +5 -11
package/lib/types/client/McpAppFrame.js.map +1 -1
package/lib/types/client/OfficialContent.d.ts +17 -3
package/lib/types/client/OfficialContent.d.ts.map +1 -1
package/lib/types/client/OfficialContent.js +33 -7
package/lib/types/client/OfficialContent.js.map +1 -1
package/lib/types/client/Reader.d.ts.map +1 -1
package/lib/types/client/Reader.js +76 -73
package/lib/types/client/Reader.js.map +1 -1
package/lib/types/client/SettingsSection.d.ts.map +1 -1
package/lib/types/client/SettingsSection.js +0 -5
package/lib/types/client/SettingsSection.js.map +1 -1
package/lib/types/client/StickyLane.d.ts +12 -0
package/lib/types/client/StickyLane.d.ts.map +1 -1
package/lib/types/client/StickyLane.js +78 -2
package/lib/types/client/StickyLane.js.map +1 -1
package/lib/types/client/ToolActivity.d.ts.map +1 -1
package/lib/types/client/ToolActivity.js +10 -5
package/lib/types/client/ToolActivity.js.map +1 -1
package/lib/types/client/deliverables.d.ts.map +1 -1
package/lib/types/client/deliverables.js +2 -0
package/lib/types/client/deliverables.js.map +1 -1
package/lib/types/client/index.d.ts +3 -1
package/lib/types/client/index.d.ts.map +1 -1
package/lib/types/client/index.js +15 -1
package/lib/types/client/index.js.map +1 -1
package/lib/types/client/live-turn.d.ts +17 -5
package/lib/types/client/live-turn.d.ts.map +1 -1
package/lib/types/client/live-turn.js +106 -76
package/lib/types/client/live-turn.js.map +1 -1
package/lib/types/client/motion.d.ts +26 -2
package/lib/types/client/motion.d.ts.map +1 -1
package/lib/types/client/motion.js +144 -10
package/lib/types/client/motion.js.map +1 -1
package/lib/types/client/official-slots.d.ts +9 -0
package/lib/types/client/official-slots.d.ts.map +1 -1
package/lib/types/client/official-slots.js +22 -4
package/lib/types/client/official-slots.js.map +1 -1
package/lib/types/client/open-file.d.ts.map +1 -1
package/lib/types/client/open-file.js +1 -6
package/lib/types/client/open-file.js.map +1 -1
package/lib/types/client/projection.d.ts +15 -2
package/lib/types/client/projection.d.ts.map +1 -1
package/lib/types/client/projection.js +16 -4
package/lib/types/client/projection.js.map +1 -1
package/lib/types/client/rewind-cut.d.ts +131 -0
package/lib/types/client/rewind-cut.d.ts.map +1 -0
package/lib/types/client/rewind-cut.js +321 -0
package/lib/types/client/rewind-cut.js.map +1 -0
package/lib/types/client/styles.d.ts +3 -0
package/lib/types/client/styles.d.ts.map +1 -0
package/lib/types/client/styles.js +25 -0
package/lib/types/client/styles.js.map +1 -0
package/lib/types/client/text-transform.d.ts +93 -0
package/lib/types/client/text-transform.d.ts.map +1 -0
package/lib/types/client/text-transform.js +183 -0
package/lib/types/client/text-transform.js.map +1 -0
package/lib/types/client/timeline.d.ts.map +1 -1
package/lib/types/client/timeline.js.map +1 -1
package/lib/types/client/tool-activity.d.ts +11 -4
package/lib/types/client/tool-activity.d.ts.map +1 -1
package/lib/types/client/tool-activity.js +54 -9
package/lib/types/client/tool-activity.js.map +1 -1
package/lib/types/client/turn-slots.d.ts +29 -0
package/lib/types/client/turn-slots.d.ts.map +1 -0
package/lib/types/client/turn-slots.js +62 -0
package/lib/types/client/turn-slots.js.map +1 -0
package/lib/types/client/types.d.ts +18 -0
package/lib/types/client/types.d.ts.map +1 -1
package/lib/types/dsh-better-display.d.ts +4 -1
package/lib/types/dsh-better-display.d.ts.map +1 -1
package/lib/types/dsh-better-display.js +55 -43
package/lib/types/dsh-better-display.js.map +1 -1
package/lib/types/flags.d.ts +7 -0
package/lib/types/flags.d.ts.map +1 -0
package/lib/types/flags.js +37 -0
package/lib/types/flags.js.map +1 -0
package/lib/types/log.d.ts +17 -0
package/lib/types/log.d.ts.map +1 -0
package/lib/types/log.js +122 -0
package/lib/types/log.js.map +1 -0
package/lib/types/metrics.d.ts +18 -0
package/lib/types/metrics.d.ts.map +1 -0
package/lib/types/metrics.js +35 -0
package/lib/types/metrics.js.map +1 -0
package/lib/types/reveal.d.ts +12 -0
package/lib/types/reveal.d.ts.map +1 -0
package/lib/types/reveal.js +147 -0
package/lib/types/reveal.js.map +1 -0
package/lib/types/workspace-path.d.ts +3 -0
package/lib/types/workspace-path.d.ts.map +1 -0
package/lib/types/workspace-path.js +5 -0
package/lib/types/workspace-path.js.map +1 -0
package/package.json +36 -5
package/scripts/changelog.mjs +20 -0
package/scripts/check-agents-md.mjs +67 -0
package/scripts/check-bundle-size.mjs +38 -0
package/scripts/check-dead-flags.mjs +55 -0
package/scripts/check-todo-debt.mjs +69 -0
package/scripts/security-audit-report.mjs +92 -0
package/scripts/verify-commentary-visible.mjs +627 -0
package/src/client/AssistantNode.tsx +72 -0
package/src/client/Blocks.tsx +49 -10
package/src/client/ChoreographedFlow.tsx +3 -1
package/src/client/ClosedProcessSummary.tsx +3 -1
package/src/client/McpAppFrame.tsx +5 -13
package/src/client/OfficialContent.tsx +47 -9
package/src/client/Reader.module.css +103 -21
package/src/client/Reader.tsx +83 -88
package/src/client/SettingsSection.tsx +1 -7
package/src/client/StickyLane.tsx +81 -2
package/src/client/ToolActivity.tsx +10 -6
package/src/client/deliverables.ts +1 -0
package/src/client/index.tsx +18 -2
package/src/client/live-turn.ts +100 -69
package/src/client/motion.tsx +142 -7
package/src/client/official-slots.tsx +23 -4
package/src/client/open-file.ts +2 -8
package/src/client/projection.ts +16 -4
package/src/client/rewind-cut.ts +340 -0
package/src/client/styles.ts +22 -0
package/src/client/text-transform.ts +265 -0
package/src/client/timeline.ts +0 -2
package/src/client/tool-activity.ts +67 -9
package/src/client/turn-slots.ts +80 -0
package/src/client/types.ts +19 -0
package/src/dsh-better-display.ts +57 -42
package/src/flags.ts +40 -0
package/src/log.ts +137 -0
package/src/metrics.ts +50 -0
package/src/reveal.ts +90 -0
package/src/workspace-path.ts +4 -0
package/tests/browser-commentary.tsx +191 -0
package/tests/chat-flow-hook.test.ts +1 -1
package/tests/cloud-gate.test.ts +1 -1
package/tests/context-tool-update.test.ts +1 -1
package/tests/conversation-scroll.test.ts +1 -1
package/tests/deliverables.test.ts +1 -1
package/tests/entry.test.ts +1 -1
package/tests/fixtures/reader-lane-owners.tsx +46 -0
package/tests/fixtures/reader-official-users.tsx +234 -0
package/tests/fixtures/reader-theme-overlap.html +80 -0
package/tests/fixtures/reader-user-bubble.tsx +222 -0
package/tests/flags.test.ts +66 -0
package/tests/fold-choreography.test.ts +32 -8
package/tests/fold-intensity.test.ts +11 -6
package/tests/footer-precedence.test.ts +9 -1
package/tests/history-word-regression.test.ts +1 -1
package/tests/live-turn.test.ts +125 -54
package/tests/log.test.ts +99 -0
package/tests/mcp-apps.test.ts +1 -1
package/tests/message-chrome.test.ts +1 -1
package/tests/metrics.test.ts +52 -0
package/tests/official-slots.test.ts +41 -2
package/tests/open-file.test.ts +1 -1
package/tests/pending-submission.test.ts +12 -1
package/tests/pinned-selection.test.ts +16 -0
package/tests/platform-media.test.ts +1 -1
package/tests/projection.test.ts +66 -3
package/tests/reader-glass-css.test.ts +28 -0
package/tests/reader-official-users.test.ts +91 -0
package/tests/reader-sticky-surface.test.ts +377 -0
package/tests/reader-theme-lanes.test.ts +54 -0
package/tests/reader-theme-overlap.test.ts +151 -0
package/tests/reader-user-bubble.test.ts +137 -0
package/tests/reasoning-follow.test.ts +1 -1
package/tests/retiring-content.test.ts +229 -0
package/tests/reveal.test.ts +128 -0
package/tests/rewind-cut.test.ts +1090 -0
package/tests/settings-copy.test.ts +1 -1
package/tests/skill-status.test.ts +1 -1
package/tests/stock-install.test.ts +9 -1
package/tests/stream-buffer.test.ts +1 -1
package/tests/styles.test.ts +75 -0
package/tests/terminal-input-preview.test.ts +113 -0
package/tests/text-transform.test.ts +272 -0
package/tests/timeline.test.ts +1 -1
package/tests/tool-clock.test.ts +1 -1
package/tests/tool-diff.test.ts +1 -1
package/tests/waiting-clock.test.ts +1 -1
package/tests/word-timeline.test.ts +1 -1
package/tsdown.config.ts +49 -1

package/tests/fixtures/reader-theme-overlap.html ADDED Viewed

@@ -0,0 +1,80 @@
+<!doctype html>
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8">
+  <title>Reader theme overlap</title>
+  <link rel="stylesheet" href="/Reader.module.css">
+  <link rel="stylesheet" href="/MarkdownText.module.css">
+  <style>
+    :root {
+      --dsh-content-font-size: 24px;
+      --dsh-content-font-delta: 10px;
+      --dsw-alias-bg-base: transparent;
+      --dsw-alias-bg-layer-1: #102040;
+      --dsw-alias-label-primary: #f5f7fa;
+      --dsw-alias-label-secondary: #c5cad3;
+      --dsw-alias-label-tertiary: #9aa3af;
+      --dsw-font-family: ui-sans-serif, sans-serif;
+      --dsw-font-markdown-h2: 700 29px/38px var(--dsw-font-family);
+      --dsw-font-markdown-base: 24px/34px var(--dsw-font-family);
+    }
+    body { margin: 0; background: #ff00aa; }
+    .scroll { height: 280px; overflow: auto; background: #ff00aa; }
+    .spacer { height: 900px; }
+  </style>
+</head>
+<body>
+  <div class="scroll" id="scroll">
+    <div class="root" data-dsh-better-display="fixture">
+      <div class="column" data-chat-flow="">
+        <div class="toolbar" data-reader-lane="toolbar"><button class="textButton">自动折叠开</button></div>
+        <section class="turn" data-reader-turn="1">
+          <div class="turnStickyRegion">
+            <div class="turnStickyLanes">
+              <div class="turnProcessSticky" data-reader-lane="status">
+                <button class="disclosureButton" type="button"><span class="statusText">用时 64 分 24 秒</span></button>
+              </div>
+              <div class="closedProcessSummary" id="summary" data-reader-closed-summary>
+                <div class="summaryRow">
+                  <button class="disclosureButton" type="button"><span class="foldSummary">思考×79 · 输出×15 · 工具×79 · 记录×3</span></button>
+                  <span class="diffStatRoot"><button class="diffStatButton" type="button"><span class="diffAdded">+751</span><span class="diffRemoved">-63</span></button></span>
+                </div>
+              </div>
+            </div>
+            <div class="answer">
+              <div class="markdown">
+                <h2 id="heading">核心对比 (2024/25 赛季, Deloitte 统一口径)</h2>
+                <p class="spacer">回答正文在标题下面继续，用来把标题滚进吸顶带。</p>
+              </div>
+            </div>
+          </div>
+        </section>
+        <section class="turn" data-reader-turn="2">
+          <div class="turnProcessSticky" id="flow-status" data-reader-lane="flow-status">
+            <button class="disclosureButton" type="button"><span class="statusText">用时 64 分 24 秒，字号放大后这一行变高</span></button>
+          </div>
+          <div class="flowCell" id="flow-summary" data-flow-summary>
+            <button class="disclosureButton" type="button"><span class="foldSummary">思考×79 · 输出×15 · 工具×79 · 记录×3</span></button>
+          </div>
+          <div class="spacer"></div>
+        </section>
+      </div>
+    </div>
+  </div>
+  <script>
+    const root = document.querySelector('[data-dsh-better-display]');
+    const turn = document.querySelector('[data-reader-turn="2"]');
+    const toolbar = document.querySelector('.toolbar');
+    const flowStatus = document.querySelector('#flow-status');
+    const flowSummary = document.querySelector('#flow-summary');
+    const publish = () => {
+      root.style.setProperty('--reader-toolbar-height', `${Math.ceil(toolbar.getBoundingClientRect().height)}px`);
+      turn.style.setProperty('--reader-status-height', `${Math.ceil(flowStatus.getBoundingClientRect().height)}px`);
+      turn.style.setProperty('--reader-summary-height', `${Math.ceil(flowSummary.getBoundingClientRect().height)}px`);
+    };
+    publish();
+    for (const el of [toolbar, flowStatus, flowSummary]) new ResizeObserver(publish).observe(el);
+    window.__themeOverlapReady = true;
+  </script>
+</body>
+</html>

package/tests/fixtures/reader-user-bubble.tsx ADDED Viewed

@@ -0,0 +1,222 @@
+import { Context } from '@deepseek-ai/cordis';
+import { createRoot } from 'react-dom/client';
+import { flushSync } from 'react-dom';
+import { SlotRegistry } from '@fixture/registry';
+import { createSlotRenderer } from '@fixture/renderer';
+import { UserMessageNodeView } from '@fixture/user-message';
+import { Reader } from '../../src/client/Reader.js';
+import { createReaderStore } from '../../src/client/store.js';
+import { OFFICIAL_SEATS, OFFICIAL_SLOTS, installOfficialSlots, officialChildren } from '../../src/client/official-slots.js';
+import type { ReaderProps } from '../../src/client/types.js';
+// Real Reader, real slot seats, and the host's user/steering renderer.
+// Session text is the only synthetic part. Width is measured after layout.
+const CASES = [
+  { name: 'short', width: 748, axis: '', text: '升级插件' },
+  { name: 'thirty', width: 748, axis: '', text: '测'.repeat(30) },
+  { name: 'long', width: 748, axis: '', text: '测'.repeat(80) },
+  { name: 'narrow', width: 480, axis: '', text: '测'.repeat(30) },
+  { name: 'wide-axis', width: 1000, axis: '1000px', text: '测'.repeat(80) },
+] as const;
+function turnOf() {
+  return {
+    turn: 1, status: 'closed' as const, start: { seq: 1, time: 1 },
+    end: { time: 2, data: { reason: { kind: 'completed' } } }, data: new Map(), steps: [],
+  };
+}
+function messageNode(kind: 'user' | 'steering', text: string) {
+  const turn = turnOf();
+  return {
+    key: `${kind}-key`, kind, anchorSeq: kind === 'user' ? 1 : 2, visibility: 'visible' as const,
+    location: { kind: 'turn' as const, turn },
+    data: { seq: kind === 'user' ? 1 : 2, time: 1, content: [{ type: 'text', text }] },
+  };
+}
+function readerProps(text: string, renderSlot: ReaderProps['renderSlot'], renderSlotChain: ReaderProps['renderSlotChain']): ReaderProps {
+  const turn = turnOf();
+  const user = messageNode('user', text);
+  const steering = messageNode('steering', text);
+  user.location = { kind: 'turn', turn };
+  steering.location = { kind: 'turn', turn };
+  const nodes = new Map([[user.key, user], [steering.key, steering]]);
+  const chat = { order: [user.key, steering.key], nodes, timeline: { turns: new Map([[1, turn]]) } };
+  const session = {
+    running: false, openState: 'ready', hasMore: false, loadingOlder: false,
+    pendingSubmissions: [{ requestId: `pending-${text.length}`, text, time: 1, placement: 'transcript' }],
+  };
+  const store = createReaderStore().create(`session-${text.length}`);
+  store.actions.setMotion(false);
+  const source = <T,>(value: T) => ({ getSnapshot: () => value, subscribe: () => () => {} });
+  return {
+    sessionId: `session-${text.length}`,
+    useChat: (select: (snapshot: typeof chat) => unknown) => select(chat),
+    useSession: (select: (snapshot: typeof session) => unknown) => select(session),
+    useSessions: (select: (snapshot: { byId: Record<string, { cwd: string }> }) => unknown) => select({ byId: { [`session-${text.length}`]: { cwd: '/fixture' } } }),
+    useSessionStatus: (select: (snapshot: Map<string, unknown>) => unknown) => select(new Map()),
+    useStore: (select: (snapshot: ReturnType<typeof store.getSnapshot>) => unknown) => select(store.getSnapshot()),
+    actions: store.actions,
+    t: (key: string) => key,
+    loadImage: async () => ({ data: new Uint8Array(), mediaType: 'image/png' }),
+    officialImageLoader: Object.assign(async () => null, { peek: () => null }),
+    officialFileMentions: () => undefined,
+    officialPreviewFile: () => {},
+    officialHost: source({ home: '/fixture' }),
+    fillComposer: () => true,
+    openFile: () => {},
+    loadOlder: async () => {},
+    openView: () => {},
+    renderSlot,
+    renderSlotChain,
+  } as ReaderProps;
+}
+function NativeColumn({ renderSlot, kind, text }: {
+  renderSlot: ReaderProps['renderSlot'];
+  kind: 'user' | 'steering';
+  text: string;
+}) {
+  const node = messageNode(kind, text);
+  const owner = {
+    cwd: '/fixture', openFile: () => {}, openSkill: () => {}, forkAt: () => {},
+    inspectCall: () => {}, loadImage: async () => null,
+    renderMessageImages: () => null, fileMentions: () => undefined, node,
+  };
+  return (
+    <div data-native={kind} style={{ width: '100%', maxWidth: 'var(--dsh-chat-content-width, 748px)', display: 'flex', flexDirection: 'column' }}>
+      <div style={{ minWidth: 0 }}>
+        {renderSlot(OFFICIAL_SLOTS.nodes, owner, {
+          entryKey: kind,
+          hookContext: { turnData: node.location.turn.data, disclosureReset: { getSnapshot: () => 0, subscribe: () => () => {}, set: () => {} } },
+          fallback: null,
+        })}
+      </div>
+    </div>
+  );
+}
+function boxOf(root: ParentNode | null, kind: 'user' | 'steering' | 'pending') {
+  const scope = kind === 'pending'
+    ? root?.querySelector('[data-reader-pending-submission]')
+    : root?.querySelector(`[data-reader-key="${kind}-key"]`);
+  if (!scope) return null;
+  if (kind === 'pending') {
+    return [...scope.children].find(element => element instanceof HTMLElement && element.querySelector('button') === null) ?? null;
+  }
+  const slot = scope.querySelector('[data-slot]');
+  return slot?.firstElementChild?.firstElementChild?.firstElementChild ?? null;
+}
+function nativeBox(frame: ParentNode, kind: 'user' | 'steering') {
+  const column = frame.querySelector(`[data-native="${kind}"]`);
+  const slot = column?.querySelector('[data-slot]');
+  return slot?.firstElementChild?.firstElementChild?.firstElementChild ?? null;
+}
+function measure(element: Element | null) {
+  if (!element) return { w: 0, h: 0, font: '', line: '' };
+  const style = getComputedStyle(element);
+  const rect = element.getBoundingClientRect();
+  return {
+    w: Math.round(rect.width * 10) / 10,
+    h: Math.round(rect.height * 10) / 10,
+    font: style.fontSize,
+    line: style.lineHeight,
+  };
+}
+async function verify() {
+  const root = new Context();
+  await root.plugin(SlotRegistry);
+  let run = async () => {};
+  await root.plugin({ name: 'reader-bubble-width', inject: ['slots'], async apply(ctx: Context) {
+    const slots = ctx.slots as any;
+    slots.install(createSlotRenderer());
+    const source = <T,>(value: T) => ({ getSnapshot: () => value, subscribe: () => () => {} });
+    const binding = { key: 'session-width', ctx: new Context(), hooks: {}, keyedHooks: {}, props: { sessionId: 'session-width' } };
+    slots.installScope('session', {
+      current: source(binding), bindingSource: () => source(binding), renderArea: (_: unknown, props: { children?: unknown }) => props.children,
+    });
+    slots.installLocale({ ...source({}), bind: () => (key: string) => key });
+    const HostUser = (props: Record<string, unknown>) => (
+      <UserMessageNodeView
+        {...props as never}
+        t={(props.t as ((key: string) => string) | undefined) ?? ((key: string) => key)}
+        openFile={(props.openFile as (() => void) | undefined) ?? (() => {})}
+        openSkill={(props.openSkill as (() => void) | undefined) ?? (() => {})}
+        renderMessageImages={(props.renderMessageImages as (() => null) | undefined) ?? (() => null)}
+      />
+    );
+    slots.register({ name: 'root', children: {
+      'conversation.chat.node': { kind: 'keyed', scope: 'session', inject: { hooks: {
+        turnData: (_: unknown, context: { turnData?: unknown }) => () => context.turnData,
+        disclosure: (_: unknown, context: { disclosureReset?: { getSnapshot(): number } }) => () => context.disclosureReset,
+      } } },
+      'conversation.message.images': { kind: 'single', scope: 'session' },
+      'fixture.reader': { kind: 'single', scope: 'session' },
+    } }, ({ SessionProvider, renderSlot }: any) => (
+      <SessionProvider>
+        {renderSlot('fixture.reader', {})}
+        {CASES.map(item => (
+          <section key={`native-${item.name}`} data-native-case={item.name} style={{ width: item.width, ['--dsh-chat-content-width' as string]: item.axis || undefined }}>
+            <NativeColumn renderSlot={renderSlot} kind="user" text={item.text} />
+            <NativeColumn renderSlot={renderSlot} kind="steering" text={item.text} />
+          </section>
+        ))}
+      </SessionProvider>
+    ));
+    slots.register({ name: 'fixture.reader', children: {
+      ...officialChildren(slots),
+      'dsh-better-display.block': { kind: 'chain', scope: 'session' },
+    } }, ({ renderSlot, renderSlotChain }: any) => (
+      <>
+        {CASES.map(item => (
+          <section key={item.name} data-case={item.name} style={{ width: item.width, ['--dsh-chat-content-width' as string]: item.axis || undefined }}>
+            <div data-reader-mount>
+              <Reader {...readerProps(item.text, renderSlot, renderSlotChain)} />
+            </div>
+          </section>
+        ))}
+      </>
+    ));
+    slots.register({ name: 'conversation.chat.node', key: 'user', locale: 'chat' }, HostUser);
+    slots.register({ name: 'conversation.chat.node', key: 'steering', locale: 'chat' }, HostUser);
+    const stopMirror = installOfficialSlots(ctx);
+    run = async () => {
+      await new Promise(resolve => queueMicrotask(resolve));
+      const container = document.getElementById('app')!;
+      const reactRoot = createRoot(container);
+      flushSync(() => reactRoot.render(slots.renderSlot('root', {})));
+      for (const reader of container.querySelectorAll<HTMLElement>('[data-dsh-better-display]')) reader.style.padding = '0';
+      await new Promise(resolve => requestAnimationFrame(() => resolve(undefined)));
+      const readerSlot = container.querySelector('[data-reader-key="user-key"] [data-slot]')?.getAttribute('data-slot') ?? '';
+      const nativeSlot = container.querySelector('[data-native="user"] [data-slot]')?.getAttribute('data-slot') ?? '';
+      const rows = CASES.map(item => {
+        const frame = container.querySelector(`[data-case="${item.name}"]`);
+        const nativeFrame = container.querySelector(`[data-native-case="${item.name}"]`);
+        const mount = frame?.querySelector('[data-reader-mount]') ?? null;
+        const user = measure(boxOf(mount, 'user'));
+        const steering = measure(boxOf(mount, 'steering'));
+        const pending = measure(boxOf(mount, 'pending'));
+        const nativeUser = measure(nativeFrame ? nativeBox(nativeFrame, 'user') : null);
+        const nativeSteering = measure(nativeFrame ? nativeBox(nativeFrame, 'steering') : null);
+        return {
+          name: item.name,
+          user, steering, pending, nativeUser, nativeSteering,
+          readerHtml: mount?.querySelector('[data-reader-key="user-key"]')?.innerHTML.slice(0, 400) ?? '',
+        };
+      });
+      stopMirror();
+      Object.assign(window, { readerBubbleResult: { readerSlot, nativeSlot, expectedReaderSlot: OFFICIAL_SEATS.nodes, expectedNativeSlot: OFFICIAL_SLOTS.nodes, rows } });
+    };
+  } });
+  await run();
+}
+verify().catch(error => {
+  console.error(error);
+  Object.assign(window, { readerBubbleResult: { error: `${error instanceof Error ? error.stack : String(error)}\n${document.getElementById('app')?.innerHTML.slice(0, 2000)}` } });
+});

package/tests/flags.test.ts ADDED Viewed

@@ -0,0 +1,66 @@
+import assert from 'node:assert/strict';
+import { spawnSync } from 'node:child_process';
+import { mkdtempSync, readFileSync, rmSync, writeFileSync } from 'node:fs';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import { test } from 'vitest';
+import { fileURLToPath } from 'node:url';
+import { apply } from '../src/dsh-better-display.js';
+import { defaultFlags, loadFlags } from '../src/flags.js';
+test('readerEnabled defaults to true', () => {
+  assert.equal(defaultFlags.readerEnabled, true);
+  const file = JSON.parse(readFileSync(fileURLToPath(new URL('../flags.json', import.meta.url)), 'utf8')) as { readerEnabled: boolean };
+  assert.equal(file.readerEnabled, true);
+  assert.equal(loadFlags().readerEnabled, true);
+  assert.equal(loadFlags({ readerEnabled: false }).readerEnabled, false);
+  const dir = mkdtempSync(join(tmpdir(), 'bd-flags-'));
+  try {
+    const broken = join(dir, 'flags.json');
+    writeFileSync(broken, '{ "readerEnabled": "yes" }');
+    assert.equal(loadFlags(broken).readerEnabled, true);
+    assert.equal(loadFlags(join(dir, 'missing.json')).readerEnabled, true);
+  } finally {
+    rmSync(dir, { recursive: true, force: true });
+  }
+});
+test('apply skips route registration when readerEnabled is false', () => {
+  let registered = 0;
+  let effects = 0;
+  apply({
+    webServer: {
+      register() {
+        registered += 1;
+        return () => undefined;
+      },
+    },
+    effect(run: () => void) {
+      effects += 1;
+      run();
+    },
+  } as never, { flags: { readerEnabled: false } });
+  assert.equal(registered, 0);
+  assert.equal(effects, 0);
+  assert.doesNotThrow(() => apply({} as never, { flags: { readerEnabled: true } }));
+});
+test('check-dead-flags fails when a flags.json key is unused under src', () => {
+  const script = fileURLToPath(new URL('../scripts/check-dead-flags.mjs', import.meta.url));
+  const ok = spawnSync(process.execPath, [script], { encoding: 'utf8' });
+  assert.equal(ok.status, 0, ok.stderr || ok.stdout);
+  const dir = mkdtempSync(join(tmpdir(), 'bd-dead-flags-'));
+  try {
+    const flags = join(dir, 'flags.json');
+    writeFileSync(flags, JSON.stringify({ readerEnabled: true, unusedFlag: false }));
+    const bad = spawnSync(process.execPath, [script], {
+      encoding: 'utf8',
+      env: { ...process.env, FLAGS_JSON: flags },
+    });
+    assert.notEqual(bad.status, 0);
+    assert.match(bad.stderr, /unusedFlag/);
+    assert.doesNotMatch(bad.stderr, /readerEnabled/);
+  } finally {
+    rmSync(dir, { recursive: true, force: true });
+  }
+});

package/tests/fold-choreography.test.ts CHANGED Viewed

@@ -1,28 +1,52 @@
-import test from 'node:test';
+import { test } from 'vitest';
 import assert from 'node:assert/strict';
 import { collapseRows, containsNewUser, flowRows, FOLD_TIMING, retiringKeys } from '../src/client/fold-choreography.js';
 import { presentLiveTurn } from '../src/client/live-turn.js';
 import type { LiveStep } from '../src/client/live-turn.js';
 const reasoning = (n: number): LiveStep => ({ kind: 'reasoning', key: `r${n}`, nodeKey: `n${n}`, start: 0, blocks: [], step: n });
 const body: LiveStep = { kind: 'body', key: 'b1', nodeKey: 'n1', start: 1, blocks: [], step: 1 };
+const tool: LiveStep = {
+  kind: 'tool',
+  key: 't1',
+  entry: {
+    kind: 'tool',
+    key: 't1',
+    callId: 'c1',
+    step: 0,
+    order: 0,
+    draft: { kind: 'tool-call', callId: 'c1', name: 'read', argsRaw: '{"path":"Reader.tsx"}' },
+  },
+};
 const open = { status: 'open' } as const;
 test('first fold retains every visible step key and admits no incoming reasoning', () => {
-  const before = presentLiveTurn([reasoning(1), body], open);
-  const after = presentLiveTurn([reasoning(1), body, reasoning(2)], open);
-  assert.deepEqual(retiringKeys(before, after, {}), ['r1', 'b1']);
+  const before = presentLiveTurn([reasoning(1), tool], open);
+  const after = presentLiveTurn([reasoning(1), tool, reasoning(2)], open);
+  assert.deepEqual(retiringKeys(before, after, {}), ['r1', 't1']);
   const rows = collapseRows(before, after);
-  assert.deepEqual(rows.filter(x => x.kind === 'step').map(x => x.key), ['r1', 'b1']);
+  assert.deepEqual(rows.filter(x => x.kind === 'step').map(x => x.key), ['r1', 't1']);
   assert.equal(rows[0].kind, 'summary');
-  assert.equal(rows[0].kind === 'summary' && rows[0].item.summary, '思考×0 · 输出×0');
+  assert.equal(rows[0].kind === 'summary' && rows[0].item.summary, '思考×0 · 工具×0');
   assert.equal(new Set(flowRows(after).map(row => row.key)).size, flowRows(after).length);
 });
 test('repeat fold retires only displayed open rows, retaining the same summary identity', () => {
-  const before = presentLiveTurn([reasoning(1), body, reasoning(2)], open);
-  const after = presentLiveTurn([reasoning(1), body, reasoning(2), reasoning(3)], open);
+  const before = presentLiveTurn([reasoning(1), tool, reasoning(2)], open);
+  const after = presentLiveTurn([reasoning(1), tool, reasoning(2), reasoning(3)], open);
   assert.deepEqual(retiringKeys(before, after, {}), ['r2']);
   assert.equal(collapseRows(before, after)[0].key, flowRows(before)[0].key);
   assert.deepEqual(retiringKeys(before, after, { 'live-fold:r1': true }), []);
 });
+test('narration never enters a fold cell, so choreography never retires it', () => {
+  const before = presentLiveTurn([reasoning(1)], open);
+  const withNarration = presentLiveTurn([reasoning(1), body], open);
+  assert.deepEqual(retiringKeys(before, withNarration, {}), []);
+  assert.deepEqual(flowRows(withNarration).map(row => row.key), ['r1', 'b1']);
+  const after = presentLiveTurn([reasoning(1), body, tool, reasoning(2)], open);
+  assert.equal(after.some(item => item.kind === 'fold' && item.steps.some(step => step.kind === 'body')), false);
+  // The prior reasoning run folds (r1 retires), but narration itself never does.
+  assert.deepEqual(retiringKeys(withNarration, after, {}), ['r1']);
+  assert.ok(!retiringKeys(withNarration, after, {}).includes('b1'));
+});
 test('user admission bypasses buffered choreography and preserves source ordering', () => {
   const before = presentLiveTurn([reasoning(1)], open);
   const user: LiveStep = { kind: 'user', key: 'u2', nodeKey: 'u2' };

package/tests/fold-intensity.test.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { test } from 'node:test';
+import { test } from 'vitest';
 import assert from 'node:assert/strict';
 import { readFileSync } from 'node:fs';
 import { dirname, resolve } from 'node:path';
@@ -57,17 +57,22 @@ test('fold slider maps 0/1/2 and migrates older persist flags', () => {
   assert.equal(processOnlyFromIntensity(2), true);
 });
-test('autoFold false keeps every step open; autoFold true is current-main fold-on-next-reasoning', () => {
+test('autoFold false keeps every step open; autoFold true folds only thinking/tool runs', () => {
   const steps = [reasoning(1), body, tool, reasoning(2)];
   const none = presentLiveTurn(steps, open, false);
   assert.equal(none.some(item => item.kind === 'fold'), false);
   assert.deepEqual(none.map(item => item.key), ['r1', 'b1', 't1', 'r2']);
+  // Narration stays open; each prior reasoning/tool run folds in its own place.
   const standard = presentLiveTurn(steps, open, true);
-  assert.equal(standard[0]?.kind, 'fold');
-  if (standard[0]?.kind !== 'fold') throw new Error('expected standard fold');
-  assert.deepEqual(standard[0].steps.map(step => step.key), ['r1', 'b1', 't1']);
-  assert.deepEqual(standard.filter(item => item.kind === 'open').map(item => item.key), ['r2']);
+  assert.deepEqual(standard.map(item => item.kind), ['fold', 'open', 'fold', 'open']);
+  assert.deepEqual(standard.filter(item => item.kind === 'open').map(item => item.key), ['b1', 'r2']);
+  const folds = standard.filter(item => item.kind === 'fold');
+  assert.equal(folds.length, 2);
+  if (folds[0]?.kind !== 'fold' || folds[1]?.kind !== 'fold') throw new Error('expected standard folds');
+  assert.deepEqual(folds[0].steps.map(step => step.key), ['r1']);
+  assert.deepEqual(folds[1].steps.map(step => step.key), ['t1']);
+  assert.equal(standard.some(item => item.kind === 'fold' && item.steps.some(step => step.kind === 'body')), false);
 });
 test('root reader store persists glass off and standard fold on dsh.reader.v1', () => {

package/tests/footer-precedence.test.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import assert from 'node:assert/strict';
 import { readFileSync } from 'node:fs';
 import { dirname, resolve } from 'node:path';
-import { test } from 'node:test';
+import { test } from 'vitest';
 import { fileURLToPath } from 'node:url';
 const root = resolve(dirname(fileURLToPath(import.meta.url)), '..');
@@ -21,6 +21,7 @@ const HOST_FOOTER_Z = 7;
 /** Lanes a scroll can clamp into the footer band. */
 const CLAMPED_LANES = [
+  '.turnStickyLanes',
   '.turnProcessSticky',
   '.liveFoldContainer',
   '.flowCell[data-flow-summary]',
@@ -85,6 +86,13 @@ test('the top toolbar lane stays at 7 and pins to the scrollport top', () => {
   assert.equal(declarations.get('top'), '0');
 });
+test('official code block banners stay beneath Reader sticky lanes', () => {
+  const blockZ = Number(mergedDeclarations(css, '.root :global(.md-code-block)').get('z-index'));
+  const summaryZ = Number(mergedDeclarations(css, '.flowCell[data-flow-summary]').get('z-index'));
+  assert.ok(Number.isFinite(blockZ), 'Reader scopes official markdown code blocks into a stacking context');
+  assert.ok(blockZ < summaryZ, `code block banner context (${blockZ}) must stay below the summary lane (${summaryZ})`);
+});
 test('the live status lane pins below the toolbar lane instead of over it', () => {
   const declarations = mergedDeclarations(css, '.turnProcessSticky');
   assert.match(

package/tests/history-word-regression.test.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import assert from 'node:assert/strict';
-import { test } from 'node:test';
+import { test } from 'vitest';
 import { WordTimeline } from '../src/client/word-timeline.js';
 test('opening a long existing answer does not animate every historical word', () => {