dsh-better-display 0.2.1 → 0.3.0

package/src/client/markdown/MarkdownText.tsx

@@ -14,6 +14,7 @@
 
 import { memo, useMemo, useRef } from 'react'
 import type { ReactNode } from 'react'
+import type { MarkdownPathImages } from '@deepseek-ai/dsh-client-ui-primitives'
 import { IncrementalMarkdownParser } from './incremental.js'
 import { parseGfm, parseGfmWithMath } from './parse.js'
 import {
@@ -31,6 +32,7 @@ function renderSettled(
   text: string,
   codeLabels: MarkdownCodeLabels | undefined,
   fileMentions: MarkdownFileMentions | undefined,
+  pathImages: MarkdownPathImages | undefined,
   renderText: MarkdownRenderContext['renderText'],
   renderAtom: MarkdownRenderContext['renderAtom'],
 ): ReactNode[] {
@@ -43,6 +45,7 @@ function renderSettled(
     streaming: false,
     codeLabels,
     fileMentions,
+    pathImages,
     targets,
     footnoteOrder: [],
     footnoteCounts: new Map(),
@@ -73,7 +76,7 @@ class StreamingRenderer {
   private lastRendered: ReactNode[] = []
 
   /** @param codeLabels - Fence copy labels baked into cached elements; the owner replaces the renderer when they change. */
-  constructor(private readonly codeLabels: MarkdownCodeLabels | undefined, private readonly renderText: MarkdownRenderContext['renderText'], private readonly renderAtom: MarkdownRenderContext['renderAtom']) {}
+  constructor(private readonly codeLabels: MarkdownCodeLabels | undefined, private readonly renderText: MarkdownRenderContext['renderText'], private readonly renderAtom: MarkdownRenderContext['renderAtom'], private readonly pathImages: MarkdownPathImages | undefined) {}
 
   /**
    * Render the current accumulated text. Idempotent per text value, so React
@@ -109,6 +112,7 @@ class StreamingRenderer {
         streaming: true,
         codeLabels: this.codeLabels,
         fileMentions: undefined,
+        pathImages: this.pathImages,
         targets: frameTargets,
         footnoteOrder: this.frozenFootnoteOrder,
         footnoteCounts: this.frozenFootnoteCounts,
@@ -129,6 +133,7 @@ class StreamingRenderer {
       streaming: true,
       codeLabels: this.codeLabels,
       fileMentions: undefined,
+        pathImages: this.pathImages,
       targets: frameTargets,
       footnoteOrder: [...this.frozenFootnoteOrder],
       footnoteCounts: new Map(this.frozenFootnoteCounts),
@@ -162,26 +167,29 @@ class StreamingRenderer {
  * relative links, and unsafe protocols are disabled, while absolute HTTP(S)
  * images render directly.
  */
-export const MarkdownText = memo(function MarkdownText({ text, streaming = false, codeLabels, fileMentions, renderText, renderAtom }: {
+export const MarkdownText = memo(function MarkdownText({ text, streaming = false, codeLabels, fileMentions, pathImages, renderText, renderAtom }: {
   text: string
   streaming?: boolean
   codeLabels?: MarkdownCodeLabels | undefined
   fileMentions?: MarkdownFileMentions | undefined
+  pathImages?: MarkdownPathImages | undefined
   renderText?: MarkdownRenderContext['renderText']
   renderAtom?: MarkdownRenderContext['renderAtom']
 }) {
   const streamRef = useRef<StreamingRenderer | null>(null)
+  const streamImagesRef = useRef(pathImages)
   const streamLabelsRef = useRef<MarkdownCodeLabels | undefined>(codeLabels)
   const children = useMemo(() => {
     if (!streaming) {
       streamRef.current = null
-      return renderSettled(text, codeLabels, fileMentions, renderText, renderAtom)
+      return renderSettled(text, codeLabels, fileMentions, pathImages, renderText, renderAtom)
     }
-    if (streamRef.current === null || streamLabelsRef.current !== codeLabels) {
-      streamRef.current = new StreamingRenderer(codeLabels, renderText, renderAtom)
+    if (streamRef.current === null || streamLabelsRef.current !== codeLabels || streamImagesRef.current !== pathImages) {
+      streamRef.current = new StreamingRenderer(codeLabels, renderText, renderAtom, pathImages)
       streamLabelsRef.current = codeLabels
+      streamImagesRef.current = pathImages
     }
     return streamRef.current.render(text)
-  }, [text, streaming, codeLabels, fileMentions, renderText, renderAtom])
+  }, [text, streaming, codeLabels, fileMentions, pathImages, renderText, renderAtom])
   return <div className={css.markdown}>{children}</div>
 })

package/src/client/markdown/render.tsx

@@ -17,7 +17,7 @@
  * may add node types this renderer has no mapping for.
  */
 
-import { Fragment, createElement } from 'react'
+import { Fragment, createElement, useState } from 'react'
 import type { Key, ReactNode } from 'react'
 import clsx from 'clsx'
 import type * as Md from 'mdast'
@@ -27,6 +27,7 @@ import { CodeBlock } from '@deepseek-ai/dsh-client-ui-primitives'
 import { renderTexToReact } from './katex.js'
 import { McpAppCodeBlock, StreamingMcpAppPlaceholder } from '../McpAppFrame.js'
 import { isMcpAppCodeBlock, extractMcpAppTitle, extractMcpAppHeight } from '../mcp-app.js'
+import type { MarkdownPathImages } from '@deepseek-ai/dsh-client-ui-primitives'
 import type { PositionedBlock } from './incremental.js'
 import css from './MarkdownText.module.css'
 
@@ -136,6 +137,7 @@ export interface MarkdownRenderContext {
   readonly inBlockquote?: boolean
   /** Inline-code file mentions; absent wherever no opener vocabulary exists. */
   readonly fileMentions: MarkdownFileMentions | undefined
+  readonly pathImages?: MarkdownPathImages
   /** Inside an anchor's children: interactive mentions must not nest there. */
   readonly inLink?: boolean
   /** Reference targets visible to this pass. */
@@ -301,7 +303,7 @@ function renderNode(node: Md.RootContent, key: Key, context: MarkdownRenderConte
     case 'linkReference':
       return renderLinkReference(node, key, context)
     case 'image':
-      return renderImage(node.url, node.alt ?? '', key)
+      return renderImage(node.url, node.alt ?? '', key, context)
     case 'imageReference':
       return renderImageReference(node, key, context)
     case 'footnoteReference':
@@ -515,17 +517,31 @@ function inlineCodeHttpUrl(value: string): string | undefined {
   }
 }
 
-function renderImage(url: string, alt: string, key: Key): ReactNode {
-  const imageSrc = remoteImageUrl(sanitizeUrl(normalizeUri(url)))
+function renderImage(url: string, alt: string, key: Key, context: MarkdownRenderContext): ReactNode {
+  // RC2 semantics, including the revalidation of a trusted vocabulary result.
+  const remote = remoteImageUrl(sanitizeUrl(normalizeUri(url)))
+  const rewritten = remote === undefined ? context.pathImages?.resolve(url) : undefined
+  let imageSrc = remote
+  if (rewritten !== undefined) {
+    try {
+      if (['http:', 'https:', 'blob:', 'data:'].includes(new URL(rewritten).protocol)) imageSrc = rewritten
+    } catch { /* A vocabulary result must be an absolute URL. */ }
+  }
   if (imageSrc === undefined) {
     return <span key={key} className={css.imageAlt}>{alt}</span>
   }
+  return <MarkdownImage key={`${key}:${imageSrc}`} src={imageSrc} alt={alt} destination={url} />
+}
+
+function MarkdownImage({ src, alt, destination }: { src: string; alt: string; destination: string }): ReactNode {
+  const [failed, setFailed] = useState(false)
+  if (failed) return <span className={css.imageAlt}>{alt || destination}</span>
   return (
     <img
-      key={key}
       className={css.image}
-      src={imageSrc}
+      src={src}
       alt={alt}
+      onError={() => { setFailed(true) }}
       loading="lazy"
       decoding="async"
       referrerPolicy="no-referrer"
@@ -563,7 +579,7 @@ function renderImageReference(
 ): ReactNode {
   const definition = context.targets.definitions.get(node.identifier.toUpperCase())
   if (definition === undefined) return `![${node.alt ?? ''}${referenceSuffix(node)}`
-  return renderImage(definition.url, node.alt ?? '', key)
+  return renderImage(definition.url, node.alt ?? '', key, context)
 }
 
 function renderFootnoteReference(

package/src/client/motion.tsx

@@ -126,9 +126,6 @@ export function ProcessFragment({ open, motion, onRead, returnFocusTo, nodeKey,
       setPresent(open);
       return;
     }
-    if (from > target && motion) {
-      document.body.dataset.readerFolding = 'true';
-    }
     const animation = element.animate(
       from > target
         ? [
@@ -149,7 +146,6 @@ export function ProcessFragment({ open, motion, onRead, returnFocusTo, nodeKey,
       if (settled) return;
       settled = true;
       if (running.current === animation) running.current = null;
-      delete document.body.dataset.readerFolding;
       animation.cancel();
       setPresent(open);
     };
@@ -164,7 +160,6 @@ export function ProcessFragment({ open, motion, onRead, returnFocusTo, nodeKey,
     return () => {
       window.clearTimeout(deadline);
       running.current?.cancel();
-      delete document.body.dataset.readerFolding;
     };
   }, [open, motion, returnFocusTo]);
   if (!open && !present) return null;
@@ -299,16 +294,28 @@ export function useReadingScroll(root: RefObject<HTMLElement>, motion: boolean):
       if (followFrame !== 0 || layoutDepth > 0) return;
       // Our easing frames must not be mistaken for a user leaving the bottom.
       if (lastWrittenTop !== null && Math.abs(scroll.scrollTop - lastWrittenTop) < 1) return;
+      // Bind the follow intent to the position observed HERE. Every scroll that
+      // reaches this point is the viewport moving under someone else's hand: a
+      // wheel, a drag, a key, or the browser clamping the offset after a shrink.
+      //
+      // The previous form inferred detaching from a strictly upward delta against
+      // lastWrittenTop, which left two holes. That baseline is nulled by
+      // cancelFollow/onWheel/onTouch/onKey, and the guard above already returned
+      // for any scroll whose delta is under 1px — so a reader parked mid-transcript
+      // by a scrollbar drag stayed following === true AND pinned === true. The next
+      // content growth then took the re-attach branch and yanked the viewport to
+      // the bottom, discarding what they were reading. Reading the position
+      // directly needs no baseline: a fold's clamp lands at the very bottom and
+      // still keeps following, while any other offset detaches.
+      const bottom = atBottom();
+      pinned.current = bottom;
+      if (!bottom) { cancelAnimationFrame(followFrame); followFrame = 0; scheduleCapture(); }
       if (!following.current) {
         // Only an explicit return to the bottom resumes following.
-        if (atBottom()) { following.current = true; setDetached(false); }
+        if (bottom) { following.current = true; setDetached(false); }
         return;
       }
-      // Content growth and our own easing also change scrollTop; only a real
-      // upward move by the reader detaches the tail.
-      if (lastWrittenTop !== null && scroll.scrollTop < lastWrittenTop - 1) {
-        following.current = false; setDetached(true); pinned.current = false; cancelAnimationFrame(followFrame); followFrame = 0; scheduleCapture();
-      }
+      if (!bottom) { following.current = false; setDetached(true); }
     };
     const onWheel = (event: WheelEvent) => {
       cancelAnimationFrame(followFrame); followFrame = 0; lastWrittenTop = null;

package/src/client/native/ContextInjectionRow.tsx

@@ -10,8 +10,17 @@ import css from './ContextInjectionRow.module.css'
 export interface ContextInjectionRowProps {
   content: ContextMessageNode['content']
   source: ContextMessageNode['source']
-  /** Role and producer name projected from the durable source. */
-  provenance: ContextMessageNode['provenance']
+  /**
+   * Role and producer name projected from the durable source.
+   *
+   * Host generations disagree on the field name: newer builds project
+   * `provenance`, the 0.1.6-alpha generations project `producer`. Both are
+   * optional here and resolved below, so the row renders on either host instead
+   * of throwing on `undefined.role` and degrading its whole block boundary.
+   */
+  provenance?: ContextMessageNode['provenance'] | null
+  /** Alpha-generation spelling of {@link provenance}. */
+  producer?: ContextMessageNode['provenance'] | null
   /** Producer-declared information form; null renders the opaque body. */
   form: ContextMessageNode['form']
   /** The owning view's locale seat, passed down as a plain prop. */
@@ -29,8 +38,11 @@ export interface ContextInjectionRowProps {
  * @param props - Durable content, its projected producer role/name and form, and the locale seat.
  * @returns A collapsed context row with a bounded, form-specific body.
  */
-export function ContextInjectionRow({ content, source, provenance, form, t }: ContextInjectionRowProps) {
+export function ContextInjectionRow({ content, source, provenance, producer, form, t }: ContextInjectionRowProps) {
   const [open, setOpen] = useState(false)
+  // Two host generations, one component. A row whose projection is absent
+  // entirely still renders: the marker falls back to a plain injection.
+  const view = provenance ?? producer ?? { role: 'inject' as const, label: null }
   // Resolved rather than declared: a form whose fields are unreadable renders
   // the opaque body, and the marker must say what the row actually shows.
   const { rendered, summary, body } = contextBody(form, { content, source, t })
@@ -38,18 +50,18 @@ export function ContextInjectionRow({ content, source, provenance, form, t }: Co
   return (
     <DisclosureRow
       className={css.root}
-      icon={provenance.role === 'recall'
+      icon={view.role === 'recall'
         ? <span data-context-recall-icon><ReferenceIcon kind="session" /></span>
         : <IconBrowseOutline16 size={14} />}
       chevronClassName={css.chevron}
-      title={t(provenance.role === 'recall' ? 'message.contextRecall' : 'message.contextInjection')}
-      collapsedContent={provenance.label === null ? undefined : (
+      title={t(view.role === 'recall' ? 'message.contextRecall' : 'message.contextInjection')}
+      collapsedContent={view.label === null ? undefined : (
         /* ToolRow's separator shape: an aria-hidden dot, so the accessible name
            stays the two readable parts and the two disclosure rows expose one
            name shape. A source that names no producer drops the dot with it. */
         <>
           <span className={css.sep} aria-hidden />
-          <span className={css.source} data-context-source>{provenance.label}</span>
+          <span className={css.source} data-context-source>{view.label}</span>
           {summary !== null && (
             <>
               <span className={css.sep} aria-hidden />

package/src/client/official-slots.tsx

@@ -0,0 +1,211 @@
+import { createElement, memo, useMemo, type ComponentType, type ReactNode } from 'react';
+import type { Context } from '@deepseek-ai/cordis';
+import type { SlotEntryDef, SlotMap, SlotSpec, StoredEntry } from '@deepseek-ai/dsh-client-ui-slots';
+import type {} from '@deepseek-ai/dsh-client-ui-renderer/client';
+
+/**
+ * RC2 composition adapter. Only public registry operations are used. We lend
+ * registrations a Reader-owned seat, not a second implementation of their UI.
+ * The platform still binds injection, hooks, locale, stores and boundaries.
+ * Original entries, declarations and components are never changed.
+ *
+ * Child seats have unique names because RC2 declarations have one owner. The
+ * sole component wrapper translates those names before delegating to the
+ * framework-provided renderSlot. It does not implement a slot renderer.
+ */
+export const OFFICIAL_SLOTS = {
+  actions: 'conversation.chat.assistant-actions',
+  tools: 'tool.call.toolview',
+  tail: 'conversation.chat.turnTail',
+  nodes: 'conversation.chat.node',
+  images: 'conversation.message.images',
+} as const;
+export type OfficialFamily = keyof typeof OFFICIAL_SLOTS;
+export const OFFICIAL_SEATS = {
+  actions: 'dsh-better-display.official.actions/conversation.chat.assistant-actions',
+  tools: 'dsh-better-display.official.tools/tool.call.toolview',
+  tail: 'dsh-better-display.official.tail/conversation.chat.turnTail',
+  nodes: 'dsh-better-display.official.nodes/conversation.chat.node',
+  images: 'dsh-better-display.official.images/conversation.message.images',
+} as const;
+export type OfficialSeat = typeof OFFICIAL_SEATS[OfficialFamily];
+export const officialSeat = (family: OfficialFamily, source: string = OFFICIAL_SLOTS[family]) =>
+  `dsh-better-display.official.${family}/${source}`;
+
+type Spec = SlotSpec<SlotEntryDef>;
+type Render = (key: string, owner: object, options?: object) => ReactNode;
+type RenderProps = { renderSlot: Render; renderSlotChain?: Render } & Record<string, unknown>;
+type Registration = StoredEntry['options'] & Omit<StoredEntry, 'options' | 'component'> & { name: string };
+
+/** The documented, type-erased registry inspection/registration boundary. */
+export interface CompositionRegistry {
+  spec(key: string): Spec | undefined;
+  entriesOfSlot(key: string): readonly StoredEntry[];
+  subscribe(key: string, listener: () => void): () => void;
+  inject(key: string, effect: () => () => void): () => void;
+  register(options: Registration, component: unknown): () => void;
+}
+
+declare module '@deepseek-ai/dsh-client-ui-slots' {
+  interface SlotMap {
+    'dsh-better-display.official.actions/conversation.chat.assistant-actions': SlotMap['conversation.chat.assistant-actions'];
+    'dsh-better-display.official.tools/tool.call.toolview': SlotMap['tool.call.toolview'];
+    'dsh-better-display.official.tail/conversation.chat.turnTail': SlotMap['conversation.chat.turnTail'];
+    'dsh-better-display.official.nodes/conversation.chat.node': SlotMap['conversation.chat.node'];
+    'dsh-better-display.official.images/conversation.message.images': SlotMap['conversation.message.images'];
+  }
+}
+
+// Existing Reader presentations own these rows. All other node kinds, including
+// future registrations, reach the official renderer through the fallback seat.
+const READER_NODES = new Set(['user', 'steering', 'assistant-step', 'tool-call', 'turn-tail', 'turn-process']);
+const EXPECTED: Record<OfficialFamily, Spec> = {
+  actions: { kind: 'list', scope: 'session' },
+  tools: { kind: 'keyed', scope: 'session' },
+  tail: { kind: 'chain', scope: 'session' },
+  nodes: { kind: 'keyed', scope: 'session' },
+  images: { kind: 'single', scope: 'session' },
+};
+
+/**
+ * Reader already presents produced paths with its copy/reveal actions. RC2's
+ * official tail additionally owns explicit `present` artifacts. Leave those
+ * cards, actions and state intact, and omit only the duplicate produced chips.
+ * This changes a presentation prop, never the source match or session data.
+ * Unrecognized shapes pass through intact for safe forward degradation.
+ */
+export function readerTailMatch(value: unknown, displayedPaths?: readonly string[]): unknown {
+  if (!value || typeof value !== 'object') return value;
+  const match = value as Record<string, unknown>;
+  const displayed = new Set(displayedPaths ?? []);
+  return displayed.size > 0 && Array.isArray(match.produced) && Array.isArray(match.presented)
+    ? { ...match, produced: match.produced.filter(path => !displayed.has(path)) }
+    : value;
+}
+
+function tailPresentation(component: unknown) {
+  const Original = component as ComponentType<Record<string, unknown>>;
+  return memo(function ReaderTailPresentation(props: Record<string, unknown>) {
+    const matched = useMemo(() => readerTailMatch(props.matched, props.readerProducedPaths as readonly string[] | undefined), [props.matched, props.readerProducedPaths]);
+    return createElement(Original, { ...props, matched });
+  });
+}
+
+export function officialChildren(slots: Pick<CompositionRegistry, 'spec'>): { [K in OfficialSeat]: SlotSpec<SlotMap[K]> } {
+  return Object.fromEntries(Object.entries(OFFICIAL_SLOTS).map(([name, source]) => {
+    const family = name as OfficialFamily;
+    const spec = slots.spec(source);
+    if (spec && (spec.kind !== EXPECTED[family].kind || spec.scope !== EXPECTED[family].scope)) {
+      throw new Error(`Official slot contract changed: ${source} (${spec.kind}/${spec.scope})`);
+    }
+    // In particular, retain conversation.chat.node's contextual turn-data hook.
+    return [officialSeat(family), spec ?? EXPECTED[family]];
+  })) as { [K in OfficialSeat]: SlotSpec<SlotMap[K]> };
+}
+
+function translatedComponent(entry: StoredEntry, names: ReadonlyMap<string, string>) {
+  if (names.size === 0) return entry.component;
+  const Original = entry.component as ComponentType<Record<string, unknown>>;
+  return memo(function OfficialSlotChildren(props: RenderProps) {
+    const renders = useMemo(() => {
+      const translate = (render: Render | undefined): Render => (key, owner, options) => {
+        const seat = names.get(key);
+        if (!seat || !render) throw new Error(`Undeclared official child slot: ${key}`);
+        return render(seat, owner, options);
+      };
+      return {
+        renderSlot: translate(props.renderSlot),
+        ...(props.renderSlotChain ? { renderSlotChain: translate(props.renderSlotChain) } : {}),
+      };
+    }, [props.renderSlot, props.renderSlotChain]);
+    return createElement(Original, { ...props, ...renders });
+  });
+}
+
+/**
+ * Mirror one elected contribution set incrementally. Unrelated additions do not
+ * remount existing cards or recreate their subscriptions. A source unload/HMR
+ * disposes the corresponding subtree and closures before its replacement.
+ */
+export function mirrorOfficialSlot(
+  slots: CompositionRegistry,
+  source: string,
+  target: string,
+  namespace: string,
+  accept: (entry: StoredEntry) => boolean = () => true,
+): () => void {
+  const mounted = new Map<StoredEntry, () => void>();
+  let stopped = false;
+  const reconcile = () => {
+    if (stopped) return;
+    const entries = slots.entriesOfSlot(source).filter(accept);
+    const wanted = new Set(entries);
+    for (const [entry, dispose] of mounted) {
+      if (wanted.has(entry)) continue;
+      dispose();
+      mounted.delete(entry);
+    }
+    for (const entry of entries) {
+      if (mounted.has(entry)) continue;
+      const names = new Map(Object.keys(entry.children ?? {}).map(key => [key, `${namespace}/${key}`]));
+      const children = Object.fromEntries([...names].map(([key, seat]) => [seat, entry.children![key]]));
+      const disposers: (() => void)[] = [];
+      const dispose = () => { for (const stop of disposers.splice(0).reverse()) stop(); };
+      try {
+        const { component: _component, options, children: _children, ...metadata } = entry;
+        const presentation = source === OFFICIAL_SLOTS.tail && entry.locale === 'deliverables'
+          ? { ...entry, component: tailPresentation(entry.component) }
+          : entry;
+        disposers.push(slots.register({
+          ...options, ...metadata, name: target,
+          ...(names.size ? { children } : {}),
+          registrant: `dsh-better-display → ${entry.registrant ?? source}`,
+        }, translatedComponent(presentation, names)));
+        for (const [key, seat] of names) {
+          disposers.push(mirrorOfficialSlot(slots, key, seat, namespace));
+        }
+        mounted.set(entry, dispose);
+      } catch (error) {
+        dispose();
+        throw error;
+      }
+    }
+  };
+  const unsubscribe = slots.subscribe(source, reconcile);
+  const dispose = () => {
+    stopped = true;
+    unsubscribe();
+    for (const stop of [...mounted.values()].reverse()) stop();
+    mounted.clear();
+  };
+  try { reconcile(); } catch (error) { dispose(); throw error; }
+  return dispose;
+}
+
+export function installOfficialSlots(ctx: Context): () => void {
+  // The SlotMap overloads are for statically declared keys. Aliases are a
+  // runtime composition, using exactly the public erased metadata contract.
+  const slots = ctx.slots as unknown as CompositionRegistry;
+  const disposers: (() => void)[] = [];
+  try {
+    for (const [name, source] of Object.entries(OFFICIAL_SLOTS)) {
+      const family = name as OfficialFamily;
+      disposers.push(slots.inject(source, () => {
+        const spec = slots.spec(source)!;
+        const target = officialSeat(family);
+        const declared = slots.spec(target);
+        if (spec.kind !== declared?.kind || spec.scope !== declared.scope) {
+          throw new Error(`Official slot contract changed: ${source}`);
+        }
+        return mirrorOfficialSlot(slots, source, target, `dsh-better-display.official.${family}`,
+          family === 'nodes' ? entry => !READER_NODES.has(entry.options.key ?? '') : undefined);
+      }));
+    }
+  } catch (error) {
+    for (const stop of disposers.reverse()) stop();
+    throw error;
+  }
+  return () => { for (const stop of disposers.splice(0).reverse()) stop(); };
+}
+
+export type OfficialSlotKey = typeof OFFICIAL_SLOTS[OfficialFamily] & keyof SlotMap;

package/src/client/platform-media.ts

@@ -0,0 +1,11 @@
+/** RC2 Chat's same-origin local media contract. Authorization stays Host-side. */
+export function localPathMediaUrl(protocol: string, origin: string, value: string): string | undefined {
+  if (protocol !== 'http:' && protocol !== 'https:') return undefined;
+  if (!value.startsWith('/') || value.startsWith('//')) return undefined;
+  return `${origin}/api/file?path=${encodeURIComponent(value)}`;
+}
+
+export const readerPathImages = {
+  resolve: (value: string) => typeof window === 'undefined' ? undefined
+    : localPathMediaUrl(window.location.protocol, window.location.origin, value),
+};

package/src/client/settings.tsx

@@ -38,7 +38,7 @@ function createSkillProbe(ctx: Context): SkillStatusProbe {
       return await res.json() as HostSkillStatus;
     },
     listRemoteSkills: async () => {
-      const remote = ctx.remote as { skills?: RemoteSkillsFace } | undefined;
+      const remote = ctx.remote as unknown as { skills?: RemoteSkillsFace } | undefined;
       const skills = remote?.skills
         ?? (ctx.get?.('remote.skills') as RemoteSkillsFace | undefined)
         ?? ((ctx.get?.('remote') as { skills?: RemoteSkillsFace } | undefined)?.skills);

package/src/client/store.ts

@@ -27,6 +27,7 @@ export interface ReaderState {
 }
 type ReaderActions = {
   setExpanded: (draft: ReaderState, key: string, value: boolean) => void;
+  resetExpanded: (draft: ReaderState) => void;
   setMotion: (draft: ReaderState, value: boolean) => void;
   setAutoFold: (draft: ReaderState, value: boolean) => void;
   setDeliverableOpenMode: (draft: ReaderState, value: DeliverableOpenMode) => void;
@@ -54,6 +55,7 @@ export function createReaderStore(): EngineStoreHandle<ReaderState, ReaderAction
     persist: 'dsh.reader.v1',
     actions: {
       setExpanded: (draft, key: string, value: boolean) => { draft.expanded[key] = value; },
+      resetExpanded: draft => { draft.expanded = {}; },
       setMotion: (draft, value: boolean) => { draft.motion = value; },
       setAutoFold: (draft, value: boolean) => {
         applyFoldIntensity(draft, value

package/src/client/tool-activity.ts

@@ -5,7 +5,7 @@ import type { ReaderGroup } from './projection.js';
 
 export type ToolDraft = Extract<AssistantBlock, { kind: 'tool-call' }>;
 export type ToolPhase = 'preparing' | 'running' | 'returned' | 'succeeded' | 'failed' | 'interrupted';
-export type ToolCategory = 'write' | 'read' | 'terminal' | 'search' | 'web' | 'other';
+export type ToolCategory = 'write' | 'read' | 'terminal' | 'search' | 'web' | 'code' | 'other';
 export interface ToolActivityEntry {
   kind: 'tool'; key: string; callId: string; step: number; order: number;
   draft?: ToolDraft; block?: ToolCallBlock;
@@ -275,12 +275,19 @@ export function activitySummary(entry: Pick<ToolActivityEntry, 'block' | 'draft'
     : /^(read|read_file)$/.test(name) ? 'read'
     : /^(bash|shell|terminal|terminal_send|exec_command|pwsh)$/.test(name) ? 'terminal'
     : /^(grep|glob|find|search)$/.test(name) ? 'search'
-    : /^(web_search|web_fetch|web_open)$/.test(name) ? 'web' : 'other';
+    : /^(web_search|web_fetch|web_open)$/.test(name) ? 'web'
+    // Code interpreters: no file, no shell, no query — the call is a program.
+    // Without this branch `run_code` fell through to `other`, which has no
+    // renderer of its own, so its result text was emitted as ordinary prose
+    // and stayed outside every fold.
+    : /^(run_code|execute_code|code_interpreter|python|node|eval|repl)$/.test(name) ? 'code'
+    : 'other';
   const title = category === 'write' ? `${name === 'write' ? '写入' : '修改'}${file ? ` ${file}` : name === 'apply_patch' ? '代码补丁' : '文件'}`
     : category === 'read' ? `读取${file ? ` ${file}` : '文件'}`
     : category === 'terminal' ? description || '运行命令'
     : category === 'search' ? name === 'glob' ? '查找文件' : '搜索内容'
     : category === 'web' ? name === 'web_search' ? '搜索网页' : '读取网页'
+    : category === 'code' ? (description || '运行代码')
     : name;
   return { name, raw, args, category, title, target: target ?? command ?? stringValue(args, 'query', 'pattern', 'url'), command,
     cwd: stringValue(args, 'workdir', 'cwd'), content: stringValue(args, 'content', 'new_string', 'newText', 'file_text') };

package/src/client/types.ts

@@ -1,12 +1,14 @@
-import type { ComponentType } from 'react';
 import type { ImageAttachmentRef } from '@deepseek-ai/dsh-attachment';
-import type { AssistantBlock } from '@deepseek-ai/dsh-client-ui-conversation/client';
+import type { AssistantBlock, MessageImageLoader } from '@deepseek-ai/dsh-client-ui-conversation/client';
 import type { MarkdownFileMentions } from '@deepseek-ai/dsh-client-ui-primitives';
 import type { PropsLocale, PropsRenderSlots, PropsRuntime, PropsStore } from '@deepseek-ai/dsh-client-ui-slots';
 import type {} from '@deepseek-ai/dsh-client-ui-chat/client';
 import type {} from '@deepseek-ai/dsh-client-ui-conversation/client';
 import type {} from '@deepseek-ai/dsh-client-ui-session/client';
 import type { createReaderStore } from './store.js';
+import type { OfficialSeat } from './official-slots.js';
+import type { OpenFileOptions, TurnTailOwnerProps } from '@deepseek-ai/dsh-client-ui-chat/client';
+import type {} from '@deepseek-ai/dsh-client-ui-tool/client';
 
 export interface ReaderBlockOwner {
   block: AssistantBlock;
@@ -31,7 +33,11 @@ export interface ReaderInjected {
    */
   fillComposer: (text: string) => boolean;
   /** Open a workspace file or directory; mode comes from the Better Display setting. */
-  openFile: (path: string) => Promise<void> | void;
+  openFile: (path: string, options?: OpenFileOptions) => Promise<void> | void;
+  officialImageLoader: MessageImageLoader;
+  officialFileMentions: (owner: TurnTailOwnerProps) => MarkdownFileMentions | undefined;
+  officialPreviewFile: (path: string) => void;
+  officialHost: { getSnapshot: () => { home?: string }; subscribe: (listener: () => void) => () => void };
   /** Root-scoped Better Display prefs (`dsh.reader.v1`), shared with Settings. */
   openPrefs?: {
     getSnapshot: () => {
@@ -55,16 +61,16 @@ export interface ReaderInjected {
   forkAt?: (seq: number) => void;
   /** Load session history through a target sequence number. */
   loadThrough?: (seq: unknown) => Promise<void>;
-  /** Resolve a custom tool view registered in the `tool.call.toolview` slot (e.g. diff cards). */
-  getToolView?: (toolName: string) => ComponentType<any> | null;
 }
 export type ReaderProps = PropsRuntime<'conversation.view'>
   & PropsLocale<'chat'>
-  & PropsRenderSlots<'dsh-better-display.block'>
+  & PropsRenderSlots<'dsh-better-display.block' | OfficialSeat>
   & PropsStore<ReturnType<typeof createReaderStore>>
   & ReaderInjected;
-export type BlockRenderProps = Pick<ReaderProps, 'renderSlotChain' | 'loadImage' | 'fillComposer' | 'getToolView'> & {
-  openFile?: (path: string) => Promise<void> | void;
+export type BlockRenderProps = Pick<ReaderProps, 'renderSlotChain' | 'loadImage' | 'fillComposer'> & {
+  official?: Pick<ReaderProps, 'renderSlot' | 'renderSlotChain' | 'officialImageLoader' | 'officialFileMentions' | 'officialPreviewFile' | 'officialHost' | 'openView'>;
+  cwd?: string;
+  openFile?: (path: string, options?: OpenFileOptions) => Promise<void> | void;
   revealFile?: (path: string) => Promise<void> | void;
   forkAt?: (seq: number) => void;
   /** Durable closing-message seq of this turn (turn-tail closing), used as the fork anchor. */

package/src/client/word-motion.tsx

@@ -2,6 +2,7 @@ import { createContext, useContext, useLayoutEffect, useMemo, useRef } from 'rea
 import type { ReactNode, RefObject } from 'react';
 import type { MarkdownFileMentions } from '@deepseek-ai/dsh-client-ui-primitives';
 import { MarkdownText } from './markdown/MarkdownText.js';
+import { readerPathImages } from './platform-media.js';
 import { WORD_MOTION, WordTimeline } from './word-timeline.js';
 import css from './Reader.module.css';
 
@@ -86,6 +87,6 @@ export function MotionMarkdown({ text, streaming, enabled, revision, fileMention
     return current.hasLiveText ? <MotionAtom born={current.bornAt(offset)} generation={current.generation} offset={offset}>{children}</MotionAtom> : children;
   }, []);
   return <WordScope.Provider value={scope}>
-    <MarkdownText text={text} streaming={streaming} codeLabels={CODE_LABELS} fileMentions={fileMentions} renderText={renderText} renderAtom={renderAtom} />
+    <MarkdownText text={text} streaming={streaming} codeLabels={CODE_LABELS} fileMentions={fileMentions} pathImages={readerPathImages} renderText={renderText} renderAtom={renderAtom} />
   </WordScope.Provider>;
 }