dsh-wsr-execution 0.2.1 → 0.2.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-wsr-execution",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "DeepSeek Harness adapter bundle for WSR Intake, Delivery resources, Session state, Actions, and final results.",
   "type": "module",
   "main": "./src/index.js",

package/src/action-presentation/model.js

@@ -61,9 +61,12 @@ function hasValidTypedData(value) {
       && (channel === "action" || channel === "tool");
   }
   if (value.kind === "terminal-result") {
-    const outputValid = Object.hasOwn(value.data, "finalOutput")
+    const hasFinalOutput = Object.hasOwn(value.data, "finalOutput");
+    const hasSummary = Object.hasOwn(value.data, "summary");
+    const outputValid = hasFinalOutput
       ? typeof value.data.finalOutput === "string" && value.data.finalOutput.length > 0
-      : typeof value.data.summary === "string" && value.data.summary.length > 0;
+      : hasSummary ? typeof value.data.summary === "string" && value.data.summary.length > 0
+        : value.data.outcome === "SUCCEEDED";
     return typeof value.data.outcome === "string" && TERMINAL_OUTCOMES.has(value.data.outcome) && outputValid;
   }
   if (value.kind === "delivery-running" || value.kind === "delivery-status") {
@@ -145,7 +148,7 @@ export function projectExecutionPresentation(event) {
     return model({
       correlation, layer: "final", state, title: "Final result",
       summary: data.outcome[0] + data.outcome.slice(1).toLowerCase(), body,
-      defaultOpen: true, focusPolicy: "none", role: "article",
+      defaultOpen: false, focusPolicy: "none", role: "article",
       compatibility: typeof data.finalOutput === "string" ? "current" : "legacy-summary",
     });
   }
@@ -163,7 +166,7 @@ export function projectExecutionPresentation(event) {
       correlation, layer: data.channel === "tool" ? "tool" : "action", state,
       title: typeof data.label === "string" ? data.label : "Workflow Action",
       summary: STATE_LABELS[state], body: text(data.content) ?? "WSR content unavailable",
-      defaultOpen: state !== "completed", focusPolicy: "none", role: "status", compatibility: "current",
+      defaultOpen: false, focusPolicy: "none", role: "status", compatibility: "current",
     });
   }
   if (event.kind === "error") {
@@ -171,7 +174,7 @@ export function projectExecutionPresentation(event) {
       correlation, layer: "progress", state: "failed", title: "Workflow presentation",
       summary: typeof data.code === "string" ? data.code : "WSR_ERROR",
       body: typeof data.message === "string" ? data.message : "WSR presentation unavailable",
-      defaultOpen: true, focusPolicy: "none", role: "alert", compatibility: "current",
+      defaultOpen: false, focusPolicy: "none", role: "alert", compatibility: "current",
     });
   }
 
@@ -182,7 +185,7 @@ export function projectExecutionPresentation(event) {
   return model({
     correlation, layer: "progress", state, title: "Workflow delivery",
     summary: `${STATE_LABELS[state]}${deliveryId === undefined ? "" : ` · ${deliveryId}`}`,
-    body: undefined, defaultOpen: state !== "completed", focusPolicy: "none", role: "status", compatibility: "current",
+    body: undefined, defaultOpen: false, focusPolicy: "none", role: "status", compatibility: "current",
   });
 }
 
@@ -190,7 +193,6 @@ export function projectExecutionPresentation(event) {
 export function resolveDisclosureOpen({ current, previousState, nextState, containsFocus }) {
   if (nextState === "waiting") return true;
   if (nextState === "completed" && previousState !== "completed") return containsFocus ? true : false;
-  if (["running", "recovering", "failed", "cancelled"].includes(nextState) && nextState !== previousState) return true;
   return current;
 }
 
@@ -217,6 +219,10 @@ export function createExecutionPresentationDefinition() {
       if (event.kind === "delivery-list") {
         return Object.freeze({ ...context.state, presentation: undefined });
       }
+      if (event.kind === "terminal-result" && event.data.outcome === "SUCCEEDED"
+        && !Object.hasOwn(event.data, "finalOutput") && !Object.hasOwn(event.data, "summary")) {
+        return Object.freeze({ ...context.state, presentation: undefined });
+      }
       return Object.freeze({ ...context.state, presentation: projectExecutionPresentation(event) });
     },
     buildViewNode(context) {

package/src/action-presentation/view.js

@@ -1,7 +1,4 @@
-import {
-  createExecutionPresentationDefinition,
-  resolveDisclosureOpen,
-} from "./model.js";
+import { parseExecutionPresentation, projectExecutionPresentation, resolveDisclosureOpen } from "./model.js";
 
 const DOT_STATE = Object.freeze({
   running: "ongoing",
@@ -12,18 +9,46 @@ const DOT_STATE = Object.freeze({
   cancelled: "error",
 });
 
+const ACTIONS_STYLE_ID = "dsh-wsr-execution-final-actions";
+const ACTIONS_CSS = ".wsr-answer-actions{align-items:center;gap:10px;height:28px;margin-top:16px;margin-left:-6px;display:flex}.wsr-answer-action{width:28px;height:28px;color:var(--dsw-alias-label-tertiary);cursor:pointer;background:transparent;border:none;border-radius:28px;justify-content:center;align-items:center;padding:6px;display:inline-flex}.wsr-answer-action:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-secondary)}";
+
+export function installActionPresentationStyle() {
+  if (typeof document === "undefined" || document.getElementById(ACTIONS_STYLE_ID) !== null) return;
+  const tag = document.createElement("style");
+  tag.id = ACTIONS_STYLE_ID;
+  tag.dataset.plugin = "dsh-wsr-execution";
+  tag.textContent = ACTIONS_CSS;
+  document.head.append(tag);
+}
+
 /**
  * Build the WSR renderer from Harness-owned, public UI primitives. Dependency
  * injection keeps the projection testable without copying any DSH component.
  */
-export function createActionPresentationView({ React, DisclosureRow, MessageText, StateDot, observe = () => undefined }) {
+export function createActionPresentationView({
+  React,
+  DisclosureRow,
+  MessageText,
+  StateDot,
+  JsonTree,
+  Tooltip,
+  IconCopyOutline16,
+  IconCheckOutline16,
+  writeClipboard,
+  observe = () => undefined,
+}) {
   if (typeof DisclosureRow !== "function") throw new TypeError("DSH_DISCLOSURE_ROW_REQUIRED");
+  installActionPresentationStyle();
 
-  return function WsrExecutionPresentationView({ node }) {
+  return function WsrExecutionPresentationView({ node, technicalDetails }) {
     const presentation = node.data;
     const [open, setOpen] = React.useState(presentation.defaultOpen);
+    const [copyState, setCopyState] = React.useState("idle");
     const bodyRef = React.useRef(null);
     const previousState = React.useRef(presentation.state);
+    const copyPending = React.useRef(false);
+    const copyEpoch = React.useRef(0);
+    const copyTimer = React.useRef(null);
 
     React.useEffect(() => {
       setOpen((current) => resolveDisclosureOpen({
@@ -37,9 +62,38 @@ export function createActionPresentationView({ React, DisclosureRow, MessageText
       previousState.current = presentation.state;
     }, [presentation.state]);
 
+    React.useEffect(() => {
+      copyEpoch.current += 1;
+      copyPending.current = false;
+      if (copyTimer.current !== null) clearTimeout(copyTimer.current);
+      copyTimer.current = null;
+      setCopyState("idle");
+      return () => {
+        copyEpoch.current += 1;
+        copyPending.current = false;
+        if (copyTimer.current !== null) clearTimeout(copyTimer.current);
+      };
+    }, [presentation.body, presentation.correlation]);
+
     observe(presentation);
 
-    if (presentation.layer === "final") {
+    if (presentation.layer === "final" && presentation.state === "completed") {
+      const label = copyState === "copied" ? "Copied" : copyState === "failed" ? "Copy failed" : "Copy";
+      const onCopy = async () => {
+        if (copyState === "copied" || copyPending.current) return;
+        const epoch = copyEpoch.current;
+        copyPending.current = true;
+        let accepted = false;
+        try { accepted = await writeClipboard(presentation.body); }
+        catch { accepted = false; }
+        if (epoch !== copyEpoch.current) return;
+        copyPending.current = false;
+        setCopyState(accepted ? "copied" : "failed");
+        copyTimer.current = globalThis.setTimeout(() => {
+          copyTimer.current = null;
+          setCopyState("idle");
+        }, 1_000);
+      };
       return React.createElement("article", {
         "data-wsr-presentation": "true",
         "data-wsr-layer": "final",
@@ -48,12 +102,23 @@ export function createActionPresentationView({ React, DisclosureRow, MessageText
         "data-wsr-chat-role": "assistant",
         "data-wsr-compatibility": presentation.compatibility,
         "aria-label": presentation.title,
-      }, React.createElement(MessageText, { text: presentation.body }));
+      },
+      React.createElement(MessageText, { text: presentation.body }),
+      React.createElement("div", {
+        className: "wsr-answer-actions",
+        "data-wsr-answer-actions": "true",
+      }, React.createElement(Tooltip, { label, side: "bottom" }, React.createElement("button", {
+        type: "button",
+        className: "wsr-answer-action",
+        "aria-label": label,
+        "data-copy-state": copyState,
+        onClick: onCopy,
+      }, React.createElement(copyState === "copied" ? IconCheckOutline16 : IconCopyOutline16, null)))));
     }
 
     const waiting = presentation.state === "waiting";
-    const expandable = presentation.body !== undefined && !waiting;
-    const body = presentation.body === undefined ? undefined : React.createElement("div", {
+    const expandable = (presentation.body !== undefined || technicalDetails !== undefined) && !waiting;
+    const body = presentation.body === undefined && technicalDetails === undefined ? undefined : React.createElement("div", {
       ref: bodyRef,
       "data-wsr-presentation": "true",
       "data-wsr-layer": presentation.layer,
@@ -64,9 +129,13 @@ export function createActionPresentationView({ React, DisclosureRow, MessageText
       tabIndex: waiting ? 0 : undefined,
       "aria-label": waiting ? presentation.summary : undefined,
       "aria-live": waiting ? "polite" : undefined,
-    }, React.createElement("pre", {
+    }, presentation.body === undefined ? null : React.createElement("pre", {
       style: { margin: 0, maxHeight: "20rem", overflow: "auto", whiteSpace: "pre-wrap", wordBreak: "break-word" },
-    }, presentation.body));
+    }, presentation.body), technicalDetails === undefined ? null : React.createElement("details", null,
+      React.createElement("summary", null, "Technical details"),
+      JsonTree === undefined
+        ? React.createElement("pre", null, JSON.stringify(technicalDetails, null, 2))
+        : React.createElement(JsonTree, { data: technicalDetails, label: "WSR presentation", copyable: true, expandTopLevel: true })));
 
     return React.createElement(DisclosureRow, {
       icon: React.createElement(StateDot, { state: DOT_STATE[presentation.state], size: 10 }),
@@ -88,11 +157,69 @@ export function createActionPresentationView({ React, DisclosureRow, MessageText
   };
 }
 
-/** Register the feature-owned event projection and its one keyed chat node. */
+const TERMINAL_PRESENTATION = Object.freeze({
+  SUCCEEDED: Object.freeze({ state: "completed", label: "Succeeded" }),
+  FAILED: Object.freeze({ state: "failed", label: "Failed" }),
+  CANCELLED: Object.freeze({ state: "cancelled", label: "Cancelled" }),
+});
+
+function reconcileDeliveryPresentation(presentation, admitted, inventoryState) {
+  const deliveryId = admitted?.kind === "delivery-running" && typeof admitted.data.deliveryId === "string"
+    ? admitted.data.deliveryId
+    : undefined;
+  const deliveries = ["ready", "reconnecting"].includes(inventoryState?.kind)
+    && Array.isArray(inventoryState.snapshot?.deliveries)
+    ? inventoryState.snapshot.deliveries
+    : [];
+  const matches = deliveryId === undefined ? [] : deliveries.filter((delivery) => delivery?.deliveryId === deliveryId);
+  const terminal = matches.length === 1 && matches[0]?.lifecycle === "TERMINAL"
+    ? TERMINAL_PRESENTATION[matches[0]?.terminal?.outcome]
+    : undefined;
+  if (terminal === undefined) return presentation;
+  return Object.freeze({
+    ...presentation,
+    state: terminal.state,
+    summary: `${terminal.label} · ${deliveryId}`,
+    defaultOpen: false,
+  });
+}
+
+function commandPresentation(node, admitted, inventoryState) {
+  if (node.outcome === null) return Object.freeze({
+    correlation: String(node.commandId), layer: "progress", state: "running",
+    title: "Workflow delivery", summary: "Running", body: undefined,
+    defaultOpen: false, focusPolicy: "none", role: "status", compatibility: "current",
+  });
+  const event = admitted ?? parseExecutionPresentation(node.outcome?.text);
+  if (event.kind === "delivery-list") {
+    const count = Array.isArray(event.data.items) ? event.data.items.length : 0;
+    return Object.freeze({
+      correlation: event.correlation, layer: "progress", state: "completed",
+      title: "Delivery list", summary: `${count} ${count === 1 ? "delivery" : "deliveries"}`,
+      body: count === 0 ? "No deliveries." : JSON.stringify(event.data.items, null, 2),
+      defaultOpen: false, focusPolicy: "none", role: "status", compatibility: "current",
+    });
+  }
+  return reconcileDeliveryPresentation(projectExecutionPresentation(event), event, inventoryState);
+}
+
+/** Replace the generic command card so one-line durable JSON remains inspectable. */
+export function createWsrCommandView(options) {
+  const View = createActionPresentationView(options);
+  const { React, inventory } = options;
+  return function WsrCommandView({ node }) {
+    const admitted = node.outcome === null ? undefined : parseExecutionPresentation(node.outcome?.text);
+    const inventoryState = inventory === undefined
+      ? undefined
+      : React.useSyncExternalStore(inventory.subscribe, inventory.getSnapshot, inventory.getSnapshot);
+    return View({ node: { data: commandPresentation(node, admitted, inventoryState) }, technicalDetails: admitted });
+  };
+}
+
+/** Hide the earlier native command row and render the ordered presentation row. */
 export function registerActionPresentation(ctx, View) {
-  ctx.conversationEvents.register(createExecutionPresentationDefinition());
-  ctx.slots.inject("conversation.chat.node", () => ctx.slots.register({
-    name: "conversation.chat.node",
-    key: "wsr-execution-presentation",
-  }, View));
+  ctx.slots.inject("conversation.chat.commandview", () => {
+    ctx.slots.register({ name: "conversation.chat.commandview", key: "wsr" }, () => null);
+    ctx.slots.register({ name: "conversation.chat.commandview", key: "wsr-presentation" }, View);
+  });
 }

package/src/client/browser-entry.js

@@ -1,15 +1,15 @@
 import React from "react";
-import { DisclosureRow, MessageText, StateDot } from "@deepseek-ai/dsh-client-ui-primitives";
+import { Button, DisclosureRow, IconCheckOutline16, IconCopyOutline16, JsonTree, MessageText, Pill, StateDot, Tooltip, writeClipboard } from "@deepseek-ai/dsh-client-ui-primitives";
 import * as workspaceUi from "@deepseek-ai/dsh-client-ui-workspace";
 
-import { createActionPresentationView, registerActionPresentation } from "../action-presentation/view.js";
+import { createWsrCommandView, registerActionPresentation } from "../action-presentation/view.js";
 import { createDeliveryControlPlaneClient } from "./delivery/control-plane-port.js";
 import { registerSessionDeliveryView } from "./delivery/session-delivery-view.js";
 import { applyDeliverySidebar } from "./delivery-inventory/sidebar.js";
 
 export const name = "wsr-execution-client";
 export const inject = Object.freeze([
-  "connection", "conversationEvents", "sessions", "slots", "workspaces", "locale",
+  "connection", "sessions", "slots", "workspaces", "locale",
 ]);
 
 export function apply(ctx) {
@@ -22,11 +22,30 @@ export function apply(ctx) {
   applyDeliverySidebar(ctx, { React, workspaceUi, inventory: controlPlane.inventory });
   registerSessionDeliveryView(ctx, {
     React,
+    Button,
+    DisclosureRow,
+    IconCheckOutline16,
+    IconCopyOutline16,
+    Pill,
+    StateDot,
+    Tooltip,
+    writeClipboard,
     bindProjection(sessionId) {
       const source = controlPlane.bindSession(String(sessionId));
       void source.refresh();
       return source;
     },
   });
-  registerActionPresentation(ctx, createActionPresentationView({ React, DisclosureRow, MessageText, StateDot }));
+  registerActionPresentation(ctx, createWsrCommandView({
+    React,
+    DisclosureRow,
+    IconCheckOutline16,
+    IconCopyOutline16,
+    JsonTree,
+    MessageText,
+    StateDot,
+    Tooltip,
+    writeClipboard,
+    inventory: controlPlane.inventory,
+  }));
 }

package/src/client/delivery/control-plane-port.js

@@ -1,4 +1,10 @@
 const CHANNEL = "/wsr-execution";
+const ERROR_CODES = new Set([
+  "DELIVERY_PROJECTION_CORRUPT",
+  "DELIVERY_PROJECTION_STALE_BINDING",
+  "DELIVERY_PROJECTION_RECOVERY_MISMATCH",
+  "DELIVERY_PROJECTION_UNAVAILABLE",
+]);
 
 function createStore(initial) {
   let snapshot = initial;
@@ -23,7 +29,9 @@ export function createDeliveryControlPlaneClient(rpc) {
   const sessions = new Map();
   const read = async (endpoint, payload) => {
     const result = await rpc.call(CHANNEL, endpoint, payload);
-    if (result?.ok !== true) throw new Error(message(result?.error));
+    if (result?.ok !== true) throw Object.assign(new Error(message(result?.error)), {
+      code: ERROR_CODES.has(result?.error?.code) ? result.error.code : "DELIVERY_PROJECTION_UNAVAILABLE",
+    });
     return result.value;
   };
   const client = {
@@ -37,6 +45,7 @@ export function createDeliveryControlPlaneClient(rpc) {
         const previous = inventory.getSnapshot();
         inventory.publish({
           kind: previous.kind === "ready" ? "reconnecting" : "error",
+          code: typeof error?.code === "string" ? error.code : "DELIVERY_PROJECTION_UNAVAILABLE",
           message: message(error),
           ...(previous.kind === "ready" ? { snapshot: previous.snapshot } : {}),
         });
@@ -53,7 +62,7 @@ export function createDeliveryControlPlaneClient(rpc) {
         subscribe: store.subscribe,
         async refresh() {
           try { store.publish({ kind: "ready", view: await read("session/read", { sessionCorrelation }) }); }
-          catch (error) { store.publish({ kind: "error", code: "DELIVERY_PROJECTION_UNAVAILABLE", message: message(error) }); }
+          catch (error) { store.publish({ kind: "error", code: typeof error?.code === "string" ? error.code : "DELIVERY_PROJECTION_UNAVAILABLE", message: message(error) }); }
         },
       });
       sessions.set(sessionCorrelation, source);

package/src/client/delivery/session-delivery-view.js

@@ -6,6 +6,39 @@ const LIFECYCLES = new Set([
   "BOUND", "START_UNCERTAIN", "RUNNING_CORRELATED", "START_FAILED",
   "RESULT_UNRESOLVED", "TERMINAL_HANDLING", "TERMINAL",
 ]);
+const DELIVERY_STYLE_ID = "dsh-wsr-execution-delivery-view";
+const DELIVERY_CSS = `
+.wsr-delivery-view { box-sizing: border-box; width: 100%; max-width: 960px; margin: 0 auto; padding: 20px; color: var(--dsw-alias-label-primary); }
+.wsr-delivery-heading { margin: 0 0 16px; font-size: 20px; line-height: 28px; }
+.wsr-delivery-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 8px; margin: 0 0 16px; }
+.wsr-delivery-summary-item { min-width: 0; padding: 10px 12px; border: 1px solid var(--dsw-alias-border-l2); border-radius: 8px; background: var(--dsw-alias-bg-layer-1); }
+.wsr-delivery-summary-item dt, .wsr-delivery-identity dt { margin: 0 0 3px; color: var(--dsw-alias-label-tertiary); font-size: 12px; line-height: 16px; }
+.wsr-delivery-summary-item dd, .wsr-delivery-identity dd { min-width: 0; margin: 0; font-size: 13px; line-height: 20px; overflow-wrap: anywhere; }
+.wsr-delivery-status { display: inline-flex; min-width: 0; align-items: center; gap: 6px; }
+.wsr-delivery-status > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.wsr-delivery-identities { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 8px 16px; margin: 8px 0 0; }
+.wsr-delivery-identity { min-width: 0; margin: 0; }
+.wsr-delivery-identity dd { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 6px; }
+.wsr-delivery-identity code { display: block; min-width: 0; max-width: 100%; color: inherit; font-family: var(--dsw-font-family-mono, ui-monospace, monospace); overflow-wrap: anywhere; white-space: normal; }
+.wsr-delivery-preview { display: block; min-width: 0; max-width: 100%; margin-inline-start: 8px; overflow: hidden; color: var(--dsw-alias-label-tertiary); text-overflow: ellipsis; white-space: nowrap; }
+.wsr-delivery-copy-feedback { min-height: 20px; margin: 8px 0 0; color: var(--dsw-alias-label-secondary); font-size: 12px; line-height: 20px; }
+.wsr-delivery-condition { margin-top: 12px; padding: 10px 12px; border-left: 3px solid var(--dsw-alias-state-warn-primary); border-radius: 4px; background: var(--dsw-alias-bg-layer-1); }
+.wsr-delivery-condition h3 { margin: 0 0 4px; font-size: 13px; line-height: 20px; }
+.wsr-delivery-condition code, .wsr-delivery-state code { overflow-wrap: anywhere; }
+.wsr-delivery-state { display: grid; gap: 8px; }
+.wsr-delivery-state p { margin: 0; }
+@media (max-width: 720px) { .wsr-delivery-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
+@media (max-width: 420px) { .wsr-delivery-view { padding: 12px; } .wsr-delivery-summary, .wsr-delivery-identities { grid-template-columns: minmax(0, 1fr); } }
+@media (prefers-reduced-motion: reduce) { .wsr-delivery-view, .wsr-delivery-view * { scroll-behavior: auto !important; transition: none !important; } }
+`;
+
+function ensureDeliveryStyles() {
+  if (typeof document === "undefined" || document.getElementById(DELIVERY_STYLE_ID) !== null) return;
+  const tag = document.createElement("style");
+  tag.id = DELIVERY_STYLE_ID;
+  tag.textContent = DELIVERY_CSS;
+  document.head.appendChild(tag);
+}
 
 function nonEmpty(value) {
   return typeof value === "string" && value.length > 0;
@@ -46,79 +79,157 @@ function safeSubscribe(source, notify) {
   catch { return () => undefined; }
 }
 
-function pair(React, label, value) {
-  return [
-    React.createElement("dt", { key: `${label}-label` }, label),
-    React.createElement("dd", { key: `${label}-value` }, value),
-  ];
+function summaryItem(React, label, value, extra = {}) {
+  return React.createElement("div", { className: "wsr-delivery-summary-item", ...extra },
+    React.createElement("dt", null, label),
+    React.createElement("dd", null, value));
 }
 
-function statePanel(React, role, code, message) {
+function statePanel(React, StateDot, role, code, message) {
   return React.createElement("section", {
+    className: "wsr-delivery-view wsr-delivery-state",
     "aria-labelledby": "wsr-delivery-view-title", "aria-live": role === "alert" ? "assertive" : "polite",
     "data-wsr-delivery-view": "true", role,
-  }, React.createElement("h2", { id: "wsr-delivery-view-title" }, "Delivery"),
-  React.createElement("p", null, message), code === undefined ? null : React.createElement("code", null, code));
+  }, React.createElement("h2", { className: "wsr-delivery-heading", id: "wsr-delivery-view-title" }, "Delivery"),
+  React.createElement("p", null,
+    React.createElement(StateDot, { state: role === "alert" ? "error" : "ongoing", size: 10 }), " ", message),
+  code === undefined ? null : React.createElement("code", null, code));
+}
+
+function statusState(delivery, failed) {
+  if (failed) return "error";
+  if (delivery.terminal?.outcome === "SUCCEEDED") return "done";
+  if (delivery.terminal !== null || ["START_UNCERTAIN", "RESULT_UNRESOLVED", "START_FAILED"].includes(delivery.lifecycle)) return "warning";
+  return "ongoing";
+}
+
+function identityCard(React, primitives, label, value, displayValue = value) {
+  const { Button, IconCheckOutline16, IconCopyOutline16, Tooltip, onCopy, copiedLabel } = primitives;
+  const exact = React.createElement("code", {
+    "aria-label": `${label}: ${value}`,
+    "data-wsr-delivery-identity": label,
+    title: value,
+  }, displayValue);
+  const copied = copiedLabel === label;
+  const control = React.createElement(Tooltip, { label: copied ? `${label} copied` : `Copy ${label}`, side: "bottom" },
+    React.createElement(Button, {
+      "aria-label": `Copy ${label}`,
+      icon: React.createElement(copied ? IconCheckOutline16 : IconCopyOutline16, null),
+      onClick: () => onCopy(label, value),
+      size: "sm",
+      type: "button",
+      variant: "toolbar",
+    }, copied ? "Copied" : "Copy"));
+  return React.createElement("div", { className: "wsr-delivery-identity", key: label },
+    React.createElement("dt", null, label),
+    React.createElement("dd", null, exact, control));
 }
 
 /** Render the exact owner `SessionDeliveryView` without a shadow projection. */
-export function createSessionDeliveryView(React) {
+export function createSessionDeliveryView(React, primitives = {}) {
   if (typeof React?.createElement !== "function" || typeof React?.useSyncExternalStore !== "function") {
     throw new TypeError("DELIVERY_VIEW_REACT_INVALID");
   }
+  const DisclosureRow = primitives.DisclosureRow ?? "div";
+  const Button = primitives.Button ?? "button";
+  const IconCheckOutline16 = primitives.IconCheckOutline16 ?? "span";
+  const IconCopyOutline16 = primitives.IconCopyOutline16 ?? "span";
+  const Pill = primitives.Pill ?? "span";
+  const StateDot = primitives.StateDot ?? "span";
+  const Tooltip = primitives.Tooltip ?? "span";
+  const writeClipboard = primitives.writeClipboard ?? (async () => false);
+  ensureDeliveryStyles();
   return function SessionDeliveryView({ sessionId, source }) {
+    const [identitiesOpen, setIdentitiesOpen] = typeof React.useState === "function"
+      ? React.useState(false)
+      : [false, () => undefined];
+    const [copiedLabel, setCopiedLabel] = typeof React.useState === "function"
+      ? React.useState("")
+      : ["", () => undefined];
     const state = React.useSyncExternalStore(
       (notify) => safeSubscribe(source, notify),
       () => safeSnapshot(source),
       () => safeSnapshot(source),
     );
-    if (state.kind === "loading") return statePanel(React, "status", undefined, "Loading Delivery…");
-    if (state.kind === "error") return statePanel(React, "alert", state.code ?? "DELIVERY_PROJECTION_UNAVAILABLE", state.message ?? "Execution projection unavailable");
+    if (state.kind === "loading") return statePanel(React, StateDot, "status", undefined, "Loading Delivery…");
+    if (state.kind === "error") return statePanel(React, StateDot, "alert", state.code ?? "DELIVERY_PROJECTION_UNAVAILABLE", state.message ?? "Execution projection unavailable");
     const view = state.view;
     if (state.kind !== "ready" || view?.sessionCorrelation !== sessionId) {
-      return statePanel(React, "alert", "DELIVERY_PROJECTION_CORRUPT", "Delivery projection invalid");
+      return statePanel(React, StateDot, "alert", "DELIVERY_PROJECTION_CORRUPT", "Delivery projection invalid");
     }
-    if (view.kind === "UNBOUND") return statePanel(React, "status", undefined, "No Delivery bound to this Session");
+    if (view.kind === "UNBOUND") return statePanel(React, StateDot, "status", undefined, "No Delivery bound to this Session");
     if (view.kind !== "BOUND" || !validDelivery(view.delivery, sessionId)) {
-      return statePanel(React, "alert", "DELIVERY_PROJECTION_CORRUPT", "Delivery projection invalid");
+      return statePanel(React, StateDot, "alert", "DELIVERY_PROJECTION_CORRUPT", "Delivery projection invalid");
     }
     const delivery = view.delivery;
     const failed = delivery.terminal?.outcome === "FAILED" || delivery.error !== null;
     const identityRows = [
-      ...pair(React, "Delivery", delivery.deliveryId),
-      ...pair(React, "Task", delivery.task.displayName ?? delivery.task.identity),
-      ...pair(React, "Workflow", delivery.workflow.identity),
-      ...pair(React, "Package", `${delivery.workflow.packageName}@${delivery.workflow.exactPackageVersion}`),
-      ...pair(React, "Package digest", delivery.workflow.packageDigest),
-      ...pair(React, "Snapshot", delivery.workflow.snapshotIdentity),
-      ...pair(React, "Snapshot digest", delivery.workflow.snapshotDigest),
-      ...pair(React, "Binding", delivery.deliveryBindingIdentity),
+      ["Delivery", delivery.deliveryId],
+      ["Task", delivery.task.identity, delivery.task.displayName === null ? delivery.task.identity : `${delivery.task.displayName} · ${delivery.task.identity}`],
+      ["Workflow", delivery.workflow.identity],
+      ["Package", `${delivery.workflow.packageName}@${delivery.workflow.exactPackageVersion}`],
+      ["Package digest", delivery.workflow.packageDigest],
+      ["Snapshot", delivery.workflow.snapshotIdentity],
+      ["Snapshot digest", delivery.workflow.snapshotDigest],
+      ["Binding", delivery.deliveryBindingIdentity],
+      ...(nonEmpty(delivery.worktree) ? [["Worktree", delivery.worktree]] : []),
     ];
-    const lifecycleRows = [
-      ...pair(React, "Lifecycle", delivery.lifecycle),
-      ...pair(React, "Recoverable", delivery.recoverable ? "yes" : "no"),
-      ...(delivery.current === null ? [] : pair(React, delivery.current.kind === "ACTION" ? "Current Action" : "Current Intervention", delivery.current.identity)),
-      ...pair(React, "Started", new Date(delivery.timing.startedAt).toISOString()),
-      ...pair(React, "Elapsed", duration(delivery.timing.elapsedMs)),
-      ...(delivery.terminal === null ? [] : [
-        ...pair(React, "Ended", new Date(delivery.terminal.finishedAt).toISOString()),
-        ...pair(React, "Outcome", delivery.terminal.outcome),
-      ]),
-      ...(delivery.error === null ? [] : pair(React, "Error", delivery.error.code)),
+    const statusLabel = delivery.terminal?.outcome ?? delivery.lifecycle;
+    const workflowLabel = `${delivery.workflow.identity} · ${delivery.workflow.packageName}@${delivery.workflow.exactPackageVersion}`;
+    const summary = [
+      summaryItem(React, "Status", React.createElement("span", { className: "wsr-delivery-status" },
+        React.createElement(StateDot, { state: statusState(delivery, failed), size: 10 }),
+        React.createElement(Pill, { "aria-label": `Delivery status ${statusLabel}` }, statusLabel))),
+      summaryItem(React, "Workflow", workflowLabel),
+      ...(delivery.current === null ? [] : [summaryItem(
+        React,
+        delivery.current.kind === "ACTION" ? "Current Action" : "Current Intervention",
+        delivery.current.identity,
+        { "data-wsr-delivery-conditional": "current" },
+      )]),
+      ...(delivery.terminal === null ? [] : [summaryItem(React, "Outcome", delivery.terminal.outcome, { "data-wsr-delivery-conditional": "terminal" })]),
+      summaryItem(React, "Elapsed", duration(delivery.timing.elapsedMs)),
+      summaryItem(React, "Started", new Date(delivery.timing.startedAt).toISOString()),
+      ...(delivery.terminal === null ? [] : [summaryItem(React, "Ended", new Date(delivery.terminal.finishedAt).toISOString())]),
     ];
     return React.createElement("section", {
+      className: "wsr-delivery-view",
       "aria-labelledby": "wsr-delivery-view-title", "aria-live": failed ? "assertive" : "polite",
       "data-wsr-delivery-id": delivery.deliveryId, "data-wsr-delivery-view": "true", role: failed ? "alert" : "region",
-    }, React.createElement("h2", { id: "wsr-delivery-view-title" }, "Delivery"),
-    React.createElement("dl", { "aria-label": "Delivery identity" }, identityRows),
-    React.createElement("dl", { "aria-label": "Delivery lifecycle" }, lifecycleRows));
+    }, React.createElement("h2", { className: "wsr-delivery-heading", id: "wsr-delivery-view-title" }, "Delivery"),
+    React.createElement("dl", { "aria-label": "Delivery summary", "data-wsr-delivery-summary": "true", className: "wsr-delivery-summary" }, summary),
+    React.createElement(DisclosureRow, {
+      title: "Identity details",
+      icon: React.createElement(StateDot, { state: statusState(delivery, failed), size: 10 }),
+      open: identitiesOpen,
+      expandable: true,
+      expandOnRowClick: true,
+      onToggle: () => setIdentitiesOpen((open) => !open),
+      collapsedContent: React.createElement("code", { className: "wsr-delivery-preview" }, delivery.deliveryId),
+    }, React.createElement("dl", { "aria-label": "Delivery identity", className: "wsr-delivery-identities" },
+      identityRows.map(([label, value, displayValue]) => identityCard(React, {
+        Button,
+        IconCheckOutline16,
+        IconCopyOutline16,
+        Tooltip,
+        copiedLabel,
+        async onCopy(copyLabel, value) {
+          setCopiedLabel(await writeClipboard(value) ? copyLabel : `${copyLabel} copy failed`);
+        },
+      }, label, value, displayValue))),
+    React.createElement("p", {
+      "aria-live": "polite", className: "wsr-delivery-copy-feedback", role: "status",
+    }, copiedLabel === "" ? "" : copiedLabel.endsWith("copy failed") ? copiedLabel : `${copiedLabel} copied`)),
+    delivery.error === null ? null : React.createElement("section", {
+      className: "wsr-delivery-condition", "data-wsr-delivery-conditional": "error", role: "alert",
+    }, React.createElement("h3", null, "Failure diagnostic"), React.createElement("code", null, delivery.error.code)));
   };
 }
 
 export function registerSessionDeliveryView(ctx, options) {
   if (typeof ctx?.slots?.inject !== "function" || typeof ctx?.slots?.register !== "function"
     || typeof options?.bindProjection !== "function") throw new TypeError("DELIVERY_VIEW_REGISTRATION_INVALID");
-  const View = createSessionDeliveryView(options.React);
+  const View = createSessionDeliveryView(options.React, options);
   ctx.slots.inject("conversation.view", () => ctx.slots.register({
     name: "conversation.view", id: DELIVERY_VIEW_ID, order: DELIVERY_VIEW_ORDER, label: "Delivery",
     inject: (sessionId) => ({ source: options.bindProjection(sessionId) }),