dsh-better-display 0.1.1

package/src/client/index.tsx

@@ -0,0 +1,198 @@
+import type { Context } from '@deepseek-ai/cordis';
+import type {} from '@deepseek-ai/dsh-api-session-controller/client';
+import type { SessionId } from '@deepseek-ai/dsh-session/types';
+import { resolveWorkspacePath } from '@deepseek-ai/dsh-util-workspace-path';
+import * as workspacePathPkg from '@deepseek-ai/dsh-util-workspace-path';
+import { dirname } from './deliverables.js';
+import type {} from '@deepseek-ai/dsh-client-ui-conversation/client';
+import type {} from '@deepseek-ai/dsh-client-ui-renderer/client';
+import { Reader } from './Reader.js';
+import { createReaderStore } from './store.js';
+import { installReaderEntry } from './entry.js';
+import { installBetterDisplaySettings } from './settings.js';
+import { fillComposerDom } from './mcp-app.js';
+import { fileAddressFor, modeFromSnapshot, openDeliverableFile } from './open-file.js';
+import type { ReaderInjected } from './types.js';
+
+/** Structural face of the sanctioned per-session composer writer. */
+interface ComposerShell {
+  setDraft: (text: string) => void;
+}
+interface ConversationFace {
+  input?: { shell?: (id: SessionId) => ComposerShell };
+}
+
+interface SidebarRightFace {
+  openResource?: (address: string, options?: { params?: { line?: number } }) => void;
+}
+
+const officialFileAddressFor = (workspacePathPkg as {
+  fileAddressFor?: typeof fileAddressFor;
+}).fileAddressFor;
+
+async function openWorkspacePath(
+  ctx: Context,
+  path: string,
+): Promise<void> {
+  const remote = ctx.remote as unknown as { session?: { openWorkspacePath: (arg: { path: string }) => Promise<{ ok: boolean; error?: { message: string } }> } } | undefined;
+  const remoteSession = remote?.session
+    ?? (ctx.get?.('remote.session') as unknown as { openWorkspacePath: (arg: { path: string }) => Promise<{ ok: boolean; error?: { message: string } }> } | undefined)
+    ?? ((ctx.get?.('remote') as unknown as { session?: { openWorkspacePath: (arg: { path: string }) => Promise<{ ok: boolean; error?: { message: string } }> } })?.session);
+  if (remoteSession?.openWorkspacePath) {
+    const result = await remoteSession.openWorkspacePath({ path });
+    if (!result?.ok) {
+      console.warn('[dsh-better-display] openWorkspacePath failed:', result?.error?.message);
+    }
+  } else {
+    console.warn('[dsh-better-display] remote.session is not available');
+  }
+}
+
+export type { ReaderBlockOwner } from './types.js';
+export { McpAppFrame } from './McpAppFrame.js';
+export const name = 'dsh-better-display-client';
+export const inject = ['slots', 'sessions', 'conversation', 'remote', 'remote.session'];
+
+export function apply(ctx: Context): void {
+  const store = createReaderStore();
+  // conversation.view is session-scoped, so session persist keys are
+  // `dsh.reader.v1.<sessionId>`. One root instance keeps the open-mode
+  // switch on the unsuffixed `dsh.reader.v1` key.
+  const prefs = store.create();
+  installBetterDisplaySettings(ctx, prefs);
+  ctx.slots.inject('conversation.view', function* () {
+    yield ctx.slots.register({
+    name: 'conversation.view',
+    id: 'reader',
+    order: -5,
+    label: () => '阅读',
+    locale: 'chat',
+    children: { 'dsh-better-display.block': { kind: 'chain', scope: 'session' } },
+    store,
+    inject: (sessionId: SessionId): ReaderInjected => {
+      const session = () => {
+        const current = ctx.sessions.binding(sessionId)?.session;
+        if (!current) throw new Error('阅读页对应的会话已关闭。');
+        return current;
+      };
+      return {
+        openPrefs: prefs,
+        loadOlder: async () => { await session().loadOlder(); },
+        loadImage: async attachment => {
+          const receipt = await session().readAttachment(attachment.attachmentId);
+          if (!receipt.ok) throw new Error(receipt.error.message);
+          return { data: Uint8Array.from(receipt.value.data), mediaType: receipt.value.attachment.mediaType };
+        },
+        openFile: async (path: string) => {
+          try {
+            const cwd = ctx.sessions?.list?.getSnapshot?.()?.byId[sessionId]?.cwd;
+            const sidebar = (
+              ctx.get?.('sidebarRight')
+              ?? (ctx as unknown as { sidebarRight?: SidebarRightFace }).sidebarRight
+            ) as SidebarRightFace | undefined;
+            await openDeliverableFile({
+              path,
+              mode: modeFromSnapshot(prefs),
+              sessionId,
+              cwd,
+              resolveWorkspacePath,
+              openExternal: async (absolutePath) => { await openWorkspacePath(ctx, absolutePath); },
+              openSidebar: typeof sidebar?.openResource === 'function'
+                ? (address) => { sidebar.openResource!(address); }
+                : undefined,
+              fileAddressFor: officialFileAddressFor ?? fileAddressFor,
+              warn: (message, extra) => { console.warn(message, extra); },
+            });
+          } catch (error) {
+            console.warn('[dsh-better-display] openFile error:', error);
+          }
+        },
+        revealFile: async (path: string) => {
+          try {
+            const cwd = ctx.sessions?.list?.getSnapshot?.()?.byId[sessionId]?.cwd;
+            const targetPath = resolveWorkspacePath(cwd, path);
+            // 1. Try dedicated host endpoint for native file highlighting (open -R / explorer /select)
+            try {
+              const res = await fetch('/better-display/reveal', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ path: targetPath }),
+              });
+              if (res.ok) {
+                const data = await res.json();
+                if (data.ok) return;
+              }
+            } catch {
+              // Server endpoint not yet available, fallback to directory open
+            }
+
+            // 2. Fallback to official opener with parent directory
+            const parentDir = dirname(targetPath);
+            const remote = ctx.remote as unknown as { session?: { openWorkspacePath: (arg: { path: string }) => Promise<{ ok: boolean; error?: { message: string } }> } } | undefined;
+            const remoteSession = remote?.session
+              ?? (ctx.get?.('remote.session') as unknown as { openWorkspacePath: (arg: { path: string }) => Promise<{ ok: boolean; error?: { message: string } }> } | undefined);
+            if (remoteSession?.openWorkspacePath) {
+              await remoteSession.openWorkspacePath({ path: parentDir });
+            }
+          } catch (error) {
+            console.warn('[dsh-better-display] revealFile error:', error);
+          }
+        },
+        forkAt: (seq: number) => {
+          // A missing anchor would silently fork the whole session instead of
+          // the intended turn prefix, so refuse it loudly rather than guessing.
+          if (typeof seq !== 'number' || !Number.isFinite(seq)) {
+            console.warn('[dsh-better-display] fork refused: missing anchor seq');
+            return;
+          }
+          try {
+            const sessionsApi = ctx.sessions as unknown as {
+              fork: (arg: { sessionId: string; atSeq: number; increaseTitle: boolean }) => Promise<string>;
+              open: (sessionId: string) => void;
+            } | undefined;
+            if (sessionsApi?.fork) {
+              sessionsApi.fork({ sessionId, atSeq: seq, increaseTitle: true })
+                .then(childId => { sessionsApi.open?.(childId); })
+                .catch(err => { console.warn('[dsh-better-display] fork failed:', err); });
+            }
+          } catch (error) {
+            console.warn('[dsh-better-display] forkAt error:', error);
+          }
+        },
+        loadThrough: async (seq: unknown) => {
+          try {
+            const current = session() as unknown as { loadThrough?: (seq: unknown) => Promise<void> };
+            if (typeof current?.loadThrough === 'function') {
+              await current.loadThrough(seq);
+            } else {
+              await session().loadOlder();
+            }
+          } catch (error) {
+            console.warn('[dsh-better-display] loadThrough error:', error);
+          }
+        },
+        fillComposer: (text: string) => {
+          // Sanctioned path: the conversation input shell owns the Lexical
+          // editor, so setDraft lands in the draft store deterministically.
+          try {
+            const conversation = (ctx as unknown as { conversation?: ConversationFace }).conversation;
+            const shell = conversation?.input?.shell?.(sessionId);
+            if (shell && typeof shell.setDraft === 'function') {
+              shell.setDraft(text);
+              return true;
+            }
+          } catch {
+            // Fall through to the DOM path below.
+          }
+          try {
+            return fillComposerDom(text);
+          } catch {
+            return false;
+          }
+        },
+      };
+    },
+    }, Reader);
+    yield installReaderEntry(ctx);
+  });
+}

package/src/client/live-turn.ts

@@ -0,0 +1,155 @@
+import type { AssistantChatData, ChatConversationViewNode } from '@deepseek-ai/dsh-client-ui-chat/client';
+import type { AssistantBlock } from '@deepseek-ai/dsh-client-ui-conversation/client';
+import { assistantSegments, hasVisibleBody } from './projection.js';
+import type { TurnBoundary } from './projection.js';
+import type { ReaderFlowEntry, ToolActivityEntry } from './tool-activity.js';
+
+export type LiveStep =
+  | { kind: 'reasoning'; key: string; nodeKey: string; start: number; blocks: AssistantBlock[]; step: number }
+  | { kind: 'body'; key: string; nodeKey: string; start: number; blocks: AssistantBlock[]; step: number }
+  | { kind: 'tool'; key: string; entry: ToolActivityEntry }
+  | { kind: 'user'; key: string; nodeKey: string }
+  | { kind: 'other'; key: string; nodeKey: string };
+
+export type LiveTurnItem =
+  | { kind: 'user'; key: string; step: Extract<LiveStep, { kind: 'user' }> }
+  | { kind: 'fold'; key: string; steps: readonly LiveStep[]; summary: string }
+  | { kind: 'open'; key: string; step: LiveStep };
+
+export function liveFoldEnabled(boundary: TurnBoundary): boolean {
+  return boundary.status === 'open';
+}
+
+export function foldSummary(steps: readonly LiveStep[]): string {
+  let reasoning = 0;
+  let body = 0;
+  let tool = 0;
+  let extra = 0;
+  for (const step of steps) {
+    if (step.kind === 'reasoning') reasoning += 1;
+    else if (step.kind === 'body') body += 1;
+    else if (step.kind === 'tool') tool += 1;
+    else if (step.kind !== 'user') extra += 1;
+  }
+  const parts: string[] = [];
+  if (reasoning) parts.push(`思考×${reasoning}`);
+  if (body) parts.push(`输出×${body}`);
+  if (tool) parts.push(`工具×${tool}`);
+  if (extra) parts.push(`记录×${extra}`);
+  return parts.join(' · ') || '此前步骤';
+}
+
+/** One chain: fold only when a new reasoning step has prior body/tool/reasoning. */
+export function splitChain(chain: readonly LiveStep[]): { fold: readonly LiveStep[] | null; open: readonly LiveStep[] } {
+  const lastReasoning = chain.findLastIndex(step => step.kind === 'reasoning');
+  if (lastReasoning < 0) return { fold: null, open: chain };
+  const prior = chain.slice(0, lastReasoning);
+  if (!prior.length) return { fold: null, open: chain };
+  const trigger = prior.some(step => step.kind === 'reasoning' || step.kind === 'body' || step.kind === 'tool');
+  if (!trigger) return { fold: null, open: chain };
+  return { fold: prior, open: chain.slice(lastReasoning) };
+}
+
+function skipReasoning(part: { kind: string; blocks: AssistantBlock[] }): boolean {
+  return part.kind === 'reasoning' && !part.blocks.some(block => block.kind === 'reasoning' && block.text.trim() !== '');
+}
+
+function skipBody(part: { kind: string; blocks: AssistantBlock[] }): boolean {
+  return part.kind === 'body' && !hasVisibleBody(part.blocks);
+}
+
+function stepsFromAssistant(
+  nodeKey: string,
+  data: AssistantChatData,
+  toolsByCallId: Map<string, ToolActivityEntry>,
+  consumed: Set<string>,
+): LiveStep[] {
+  const marks: { at: number; step: LiveStep }[] = [];
+  for (const part of assistantSegments(data.blocks)) {
+    if (skipReasoning(part) || skipBody(part)) continue;
+    marks.push({
+      at: part.start,
+      step: {
+        kind: part.kind,
+        key: `${nodeKey}:${part.kind}:${part.start}`,
+        nodeKey,
+        start: part.start,
+        blocks: part.blocks,
+        step: data.step,
+      },
+    });
+  }
+  data.blocks.forEach((block, index) => {
+    if (block.kind !== 'tool-call' || !block.callId) return;
+    const tool = toolsByCallId.get(block.callId);
+    if (!tool || consumed.has(tool.callId)) return;
+    consumed.add(tool.callId);
+    marks.push({ at: index, step: { kind: 'tool', key: tool.key, entry: tool } });
+  });
+  marks.sort((left, right) => left.at - right.at || left.step.key.localeCompare(right.step.key));
+  return marks.map(mark => mark.step);
+}
+
+/** Expand readerFlow into source-ordered live steps using existing block boundaries. */
+export function segmentLiveTurn(
+  flow: readonly ReaderFlowEntry[],
+  get: (key: string) => ChatConversationViewNode | undefined,
+): LiveStep[] {
+  const steps: LiveStep[] = [];
+  const consumed = new Set<string>();
+  const toolsByCallId = new Map<string, ToolActivityEntry>();
+  for (const entry of flow) {
+    if (entry.kind === 'tool') toolsByCallId.set(entry.callId, entry);
+  }
+  for (const entry of flow) {
+    if (entry.kind === 'tool') {
+      if (!consumed.has(entry.callId)) {
+        steps.push({ kind: 'tool', key: entry.key, entry });
+        consumed.add(entry.callId);
+      }
+      continue;
+    }
+    const node = get(entry.nodeKey);
+    if (!node || node.visibility === 'hidden' || node.kind === 'turn-tail') continue;
+    if (node.kind === 'user' || node.kind === 'steering') {
+      steps.push({ kind: 'user', key: entry.key, nodeKey: entry.nodeKey });
+      continue;
+    }
+    if (node.kind === 'assistant-step') {
+      steps.push(...stepsFromAssistant(entry.nodeKey, node.data as AssistantChatData, toolsByCallId, consumed));
+      continue;
+    }
+    steps.push({ kind: 'other', key: entry.key, nodeKey: entry.nodeKey });
+  }
+  return steps;
+}
+
+export function presentLiveTurn(steps: readonly LiveStep[], boundary: TurnBoundary, autoFold = true): LiveTurnItem[] {
+  const live = autoFold && liveFoldEnabled(boundary);
+  const items: LiveTurnItem[] = [];
+  let chain: LiveStep[] = [];
+  const flush = () => {
+    if (!chain.length) return;
+    if (!live) {
+      for (const step of chain) items.push({ kind: 'open', key: step.key, step });
+      chain = [];
+      return;
+    }
+    const { fold, open } = splitChain(chain);
+    if (fold?.length) {
+      items.push({ kind: 'fold', key: `live-fold:${chain[0]!.key}`, steps: fold, summary: foldSummary(fold) });
+    }
+    for (const step of open) items.push({ kind: 'open', key: step.key, step });
+    chain = [];
+  };
+  for (const step of steps) {
+    if (step.kind === 'user') {
+      flush();
+      items.push({ kind: 'user', key: step.key, step });
+    } else {
+      chain.push(step);
+    }
+  }
+  flush();
+  return items;
+}

package/src/client/markdown/MarkdownText.module.css

@@ -0,0 +1,304 @@
+/* Visual baseline: deepsuite `@deepseek/md` markdown.css, adapted to CSS
+   Modules. Cite pills, header anchors, and thinking-small variants are
+   intentionally absent (no matching DOM). Token names match that sheet. */
+
+.markdown {
+  min-width: 0;
+  overflow-wrap: anywhere;
+  font: var(--dsw-font-markdown-base);
+  color: var(--dsw-alias-label-primary);
+}
+
+.markdown strong {
+  font-weight: 600;
+}
+
+.markdown h1 {
+  font: var(--dsw-font-markdown-h1);
+  margin: 32px 0 16px;
+}
+
+.markdown h2 {
+  font: var(--dsw-font-markdown-h2);
+  margin: 32px 0 16px;
+}
+
+.markdown h3 {
+  font: var(--dsw-font-markdown-h3);
+  margin: 32px 0 16px;
+}
+
+.markdown h4 {
+  font: var(--dsw-font-markdown-h4);
+  margin: 16px 0;
+}
+
+.markdown :where(h5, h6) {
+  font: var(--dsw-font-markdown-base-strong);
+  margin: 16px 0;
+}
+
+.markdown :where(h1, h2, h3, h4, h5, h6) strong {
+  font-weight: inherit;
+}
+
+.markdown p {
+  margin: 16px 0;
+}
+
+/* Tighten h4–h6 against a following list (design: 8px gap). */
+.markdown :where(h4, h5, h6) + :where(ul, ol) {
+  margin-top: 8px;
+}
+
+.markdown :where(h4, h5, h6):has(+ :where(ul, ol)) {
+  margin-bottom: 8px;
+}
+
+.markdown a {
+  /* deepsuite markdown.css uses brand-text (blue in newDesign); this sheet
+     keeps design-platform brand-text as near-black, so links use the blue
+     business-primary alias instead. */
+  color: var(--dsw-alias-state-business-primary);
+  transition: box-shadow var(--ds-transition-duration) var(--ds-ease-in-out);
+  position: relative;
+  text-decoration: none;
+  /* Transparent hit-area padding; literal zero-alpha only (no painted color). */
+  border-left: 3px solid rgb(255 255 255 / 0);
+  border-right: 3px solid rgb(255 255 255 / 0);
+  border-top: 2px solid rgb(255 255 255 / 0);
+  border-bottom: 2px solid rgb(255 255 255 / 0);
+  margin-left: -3px;
+  margin-right: -3px;
+}
+
+.markdown a:hover,
+.markdown a:focus {
+  outline: none;
+  text-decoration: underline var(--dsw-alias-state-business-primary);
+}
+
+.markdown a:focus-visible {
+  box-shadow: 0 0 0 2px var(--dsw-alias-state-business-primary);
+}
+
+.markdown :where(ul, ol) {
+  margin: 16px 0;
+  padding-left: 18px;
+}
+
+.markdown li:not(:first-child) {
+  margin-top: 6px;
+}
+
+.markdown li > :where(ul, ol) {
+  margin-top: 4px;
+}
+
+.markdown li::marker {
+  line-height: 28px;
+  color: var(--dsw-alias-label-secondary);
+}
+
+/* Nested ol under ul/ol: markers inside (models sometimes emit this shape). */
+.markdown :where(ul, ol) ol {
+  list-style-position: inside;
+  padding-left: 0;
+}
+
+.markdown :where(ul, ol) ol li p {
+  display: inline;
+}
+
+.markdown li > p {
+  margin: 8px 0;
+}
+
+.markdown li > *:first-child {
+  margin-top: 0;
+}
+
+/* Keep list-nested code-block vertical margins (design: +4px vs other last children). */
+.markdown li > *:last-child:not(:global(.md-code-block)) {
+  margin-bottom: 0;
+}
+
+.markdown hr {
+  display: block;
+  border: none;
+  height: 1px;
+  margin: 32px 0;
+  background: var(--dsw-alias-border-l2);
+}
+
+.markdown blockquote {
+  border-left: 2px solid var(--dsw-alias-label-caption);
+  margin: 16px 0 0;
+  padding-left: 14px;
+}
+
+.markdown pre {
+  margin: 16px 0;
+  font-family: var(--ds-font-family-code);
+  overflow: auto;
+}
+
+.markdown :not(pre) > code {
+  display: inline-flex;
+  align-items: center;
+  box-sizing: border-box;
+  font: var(--dsw-font-markdown-code);
+  font-family: var(--ds-font-family-code);
+  font-size: 0.875em !important;
+  background-color: var(--dsw-alias-markdown-inline-code);
+  border-radius: 6px;
+  padding: 0 5px;
+}
+
+.markdown :where(h1, h2, h3, h4, h5, h6) code {
+  font: inherit;
+  font-family: var(--ds-font-family-code);
+}
+
+.markdown :global(.katex-display) {
+  max-width: 100%;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.markdown input[type='checkbox'] {
+  margin: 0 8px 0 0;
+  accent-color: var(--dsw-alias-label-secondary);
+}
+
+.tableScroll {
+  max-width: 100%;
+  overflow-x: auto;
+  overscroll-behavior-x: contain;
+}
+
+/* Wide tables reveal their horizontal bar on hover (or keyboard focus)
+   instead of keeping it painted. Chromium never repaints state-conditioned
+   scrollbar STYLES (neither hover-conditioned `::-webkit-scrollbar*` rules
+   nor a :hover `scrollbar-color` change reaches the painted bar), so the
+   toggle is `overflow-x` itself — a layout change repaints reliably. The
+   resting padding matches the themed bar's height, so on an overflowing
+   table the appearing bar exactly replaces it and nothing below shifts.
+   Wheel and trackpad scrolling need the pointer over the table, which is
+   already the hover that re-enables `auto`. */
+.tableScroll:global(.md-table-wide) {
+  overflow-x: hidden;
+  padding-bottom: var(--dsh-scrollbar-width, 8px);
+}
+
+.tableScroll:global(.md-table-wide):hover,
+.tableScroll:global(.md-table-wide):focus-visible {
+  overflow-x: auto;
+  padding-bottom: 0;
+}
+
+/* Chromium keyboard-focuses scrollable containers by default; the ring uses
+   the sheet's link focus color. */
+.tableScroll:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 2px var(--dsw-alias-state-business-primary);
+}
+
+/* Many-column tables (the renderer's `md-table-wide` hook) keep their
+   natural width and scroll inside the wrapper; a hosting layout may widen
+   the wrapper through the hook (deepsuite chat TableWrapper parity). */
+.tableScroll table {
+  border-collapse: collapse;
+  width: max-content;
+  max-width: max-content;
+}
+
+/* Tables under four columns, and any table inside a blockquote, fill the
+   column instead: cells wrap down to their minimum readable width, and the
+   wrapper's scroll only remains for the below-floor case (deepsuite chat
+   parity: `.wrapper:not(:has(th:nth-child(4), td:nth-child(4)))`). */
+.tableFill table {
+  width: 100%;
+  max-width: none;
+}
+
+.tableScroll th {
+  text-align: start;
+  padding: 10px 16px;
+  border-bottom: 1px solid var(--dsw-alias-border-l3);
+  border-top: none;
+  font: var(--dsw-font-markdown-table-head);
+  max-width: 320px;
+  max-width: min(30vw, 320px);
+  min-width: 100px;
+}
+
+.tableScroll td {
+  padding: 10px 16px;
+  border-bottom: 1px solid var(--dsw-alias-border-l2);
+  font: var(--dsw-font-markdown-table);
+  max-width: 320px;
+  max-width: min(30vw, 320px);
+  min-width: 100px;
+}
+
+.tableScroll th:first-child,
+.tableScroll td:first-child {
+  padding-left: 0;
+}
+
+.tableScroll td:last-child {
+  padding-right: 0;
+}
+
+.tableScroll table code {
+  font-size: 13px;
+}
+
+.markdown > *:first-child,
+.markdown p:first-child {
+  margin-top: 0 !important;
+}
+
+.markdown > *:last-child,
+.markdown p:last-child {
+  margin-bottom: 0 !important;
+}
+
+.imageAlt {
+  color: var(--dsw-alias-label-tertiary);
+  font-style: italic;
+}
+
+.image {
+  display: block;
+  width: auto;
+  max-width: 100%;
+  height: auto;
+  margin: 0;
+  border-radius: 8px;
+  background: var(--dsw-alias-bg-base);
+  object-fit: contain;
+}
+
+/* Inline file mention: the same link language this sheet gives anchors (and
+   thereby URL-promoted inline code) — link-blue at rest, underline only on
+   hover/focus. An underline at rest reads badly inside the code chip, where
+   it collides with monospace descenders and the pill background. */
+.fileMention {
+  margin: 0;
+  padding: 0;
+  border: none;
+  background: none;
+  font: inherit;
+  color: var(--dsw-alias-state-business-primary);
+  text-decoration: none;
+  cursor: pointer;
+}
+
+.fileMention:hover,
+.fileMention:focus {
+  outline: none;
+  text-decoration: underline var(--dsw-alias-state-business-primary);
+  text-underline-offset: 3px;
+}