@prettier-ai/dsh-client-ui-tool 0.1.2-alpha.5 → 0.1.3-alpha.1

package/README.i18n.yaml

@@ -2,5 +2,5 @@
 # side as of the last confirmed-consistent state. Both languages carry equal authority;
 # after editing either side, bring the other along and re-record with:
 #   pnpm run verify-translation-pairing --write packages/client/ui-tool/README.md
-README.md: ac2105c5932717bf58e7bba9268240765c4c3ae3
-README.zh.md: df9a8afe1096856afac6fbc7dfda88a6190d4ba8
+README.md: 2fe410425935aed46ab95844c81568037ac929e9
+README.zh.md: 83440881fe16582a75fd8dd762577dc7b4d5335b

package/README.md

@@ -39,11 +39,11 @@ ctx.slots.inject('tool.call.toolview', () =>
   }, BusinessToolRow))
 ```
 
-The owner payload is `ToolCallOwnerProps`: `callId`, `toolName`, the frozen `block`, optional `cwd` and `home`, and plain `openFile`/`inspect` callbacks. A Code Dispatch block retains its event's `parentCallId`; a root Session call has no such field, so descendants keep the generic flattened form without another placement flag. Path summaries relativize to the Session cwd first, then replace a leftover POSIX Host home with `~`; `filePath` and Host open keep the authored filesystem path. The registration receives the normal Session slot runtime share but no React node or Runtime service.
+The owner payload is `ToolCallOwnerProps`: `callId`, `toolName`, the frozen `block`, optional `cwd` and `home`, the session-authorized `loadImage` loader (for a view whose result carries durable images), and plain `openFile`/`inspect` callbacks. A Code Dispatch block retains its event's `parentCallId`; a root Session call has no such field, so descendants route through the same keyed dispatch — a registered view such as `read_image` renders its card there, and unregistered descendants keep the generic flattened form. Path summaries relativize to the Session cwd first, then replace a leftover POSIX Host home with `~`; `filePath` and Host open keep the authored filesystem path. The registration receives the normal Session slot runtime share but no React node or Runtime service.
 
 ### Built-in views
 
-This package owns the generic fallback and the built-in shell/pwsh, read, write/edit, running `str_replace_editor` `create`/`str_replace`, grep/glob, web, todo, question, and Code Dispatch presentations. Structured cards derive directly from first-party raw event fields; Host `presentCall` and `presentResult` values never enter the Client. Foreground one-shot shell results use terminal cards. Settled persistent-shell results use the expandable generic input/output card because reset and partial-output diagnostics do not always describe one process exit status; background acknowledgements remain collapsed. A successful question row pairs call questions with result answers by their stable ids and shows readable question/answer lines when expanded. A cancelled or interrupted row shows its verdict and original questions without inventing answers. Unsupported, malformed, or ambiguous inputs fall back to flattened Tool input/result text. `ui-skill` demonstrates a business-owned registration for `skill`.
+This package owns the generic fallback and the built-in shell/pwsh, read, read_image, write/edit, running `str_replace_editor` `create`/`str_replace`, grep/glob, web, todo, question, and Code Dispatch presentations. Structured cards derive directly from first-party raw event fields; Host `presentCall` and `presentResult` values never enter the Client. Foreground one-shot shell results use terminal cards. Settled persistent-shell results use the expandable generic input/output card because reset and partial-output diagnostics do not always describe one process exit status; background acknowledgements remain collapsed. A successful question row pairs call questions with result answers by their stable ids and shows readable question/answer lines when expanded. A cancelled or interrupted row shows its verdict and original questions without inventing answers. Unsupported, malformed, or ambiguous inputs fall back to flattened Tool input/result text. `ui-skill` demonstrates a business-owned registration for `skill`.
 
 -----
 
@@ -61,8 +61,8 @@ The package realizes one dispatch rule: atomic Tool views are keyed by wire Tool
 
 ### Details and cards
 
-The package fills `conversation.details.tool` with `ToolDetails`. Row and Details renderers share one pure card model for each terminal, read, diff, search, and web card. These models validate raw call arguments, result content, failure state, persisted metadata, Code Dispatch `parentCallId`, and Session path facts. Generic rows retain the original `argsRaw` reference and format their input body only while it is expanded; structured cards skip generic-body formatting. Unsupported or malformed inputs use flattened Tool result text. Card-specific limits and fallback rules remain in the owning [terminal](../../../.agents/notes/implemented/feature/2026-07-28-web-terminal-card.md), [diff](../../../.agents/notes/implemented/feature/2026-07-30-web-diff-card.md), [read](../../../.agents/notes/implemented/feature/2026-07-30-web-read-card-frontend.md), [search](../../../.agents/notes/implemented/feature/2026-07-30-web-search-card.md), [web](../../../.agents/notes/implemented/feature/2026-07-30-web-result-card-frontend.md), and [question](../../../.agents/notes/implemented/feature/2026-07-29-ask-question-web-presentation.md) notes.
 
+The package fills `conversation.details.tool` with `ToolDetails`. Row and Details renderers share one pure card model for each terminal, read, diff, search, and web card; the image card is row-only because its gallery renders through the tool-owned `tool.call.images` slot the details panel does not declare. These models validate raw call arguments, result content, failure state, persisted metadata, Code Dispatch `parentCallId`, and Session path facts. Unsupported or malformed inputs use flattened Tool result text. Card-specific limits and fallback rules remain in the owning [terminal](../../../.agents/notes/implemented/feature/2026-07-28-web-terminal-card.md), [diff](../../../.agents/notes/implemented/feature/2026-07-30-web-diff-card.md), [read](../../../.agents/notes/implemented/feature/2026-07-30-web-read-card-frontend.md), [image](../../../.agents/notes/implemented/feature/2026-08-20-tool-card-image-results.md), [search](../../../.agents/notes/implemented/feature/2026-07-30-web-search-card.md), [web](../../../.agents/notes/implemented/feature/2026-07-30-web-result-card-frontend.md), and [question](../../../.agents/notes/implemented/feature/2026-07-29-ask-question-web-presentation.md) notes.
 </details>
 
 -----

package/README.zh.md

@@ -39,11 +39,11 @@ ctx.slots.inject('tool.call.toolview', () =>
   }, BusinessToolRow))
 ```
 
-owner 载荷为 `ToolCallOwnerProps`：`callId`、`toolName`、冻结的 `block`、可选 `cwd` 与 `home`，以及普通的 `openFile`/`inspect` 回调。Code Dispatch block 保留事件的 `parentCallId`；root Session call 没有该字段，因此 descendant 无需另一项 placement 标志即可保持 generic 压平形态。路径摘要先相对 Session cwd 缩短，再把剩余的 POSIX Host home 写成 `~`；`filePath` 与 Host 打开仍使用作者给出的文件系统路径。注册项会收到常规 Session slot runtime share，但不会收到 React node 或 runtime service。
+owner 载荷为 `ToolCallOwnerProps`：`callId`、`toolName`、冻结的 `block`、可选 `cwd` 与 `home`、会话授权的 `loadImage` loader（供结果携带持久图像的视图使用），以及普通的 `openFile`/`inspect` 回调。Code Dispatch block 保留事件的 `parentCallId`；root Session call 没有该字段，因此 descendant 走同一条按 key 分发——注册过视图的调用（如 `read_image`）在嵌套处也渲染其卡片，未注册的 descendant 保持 generic 压平形式。路径摘要先相对 Session cwd 缩短，再把剩余的 POSIX Host home 写成 `~`；`filePath` 与 Host 打开仍使用作者给出的文件系统路径。注册项会收到常规 Session slot runtime share，但不会收到 React node 或 runtime service。
 
 ### 内置视图
 
-本包拥有 generic fallback，以及 shell/pwsh、read、write/edit、running `str_replace_editor` `create`／`str_replace`、grep/glob、web、todo、question 与 Code Dispatch 的内置展示。结构化卡片直接从第一方原始 event 字段派生；Host `presentCall` 与 `presentResult` 值不会进入 Client。前台一次性 shell 结果使用 terminal 卡片。已完成的持久 shell 结果使用可展开的 generic 输入／输出卡片，因为 reset 与部分输出诊断不一定描述单个进程的退出状态；后台启动回执保持折叠。成功的问题行按稳定 id 配对调用中的问题与结果中的回答，展开后显示可读的问答行。已取消或已中断的问题行显示其裁决与原始问题，不虚构回答。不受支持、格式错误或含糊的输入回退为压平的工具输入／结果文本。`ui-skill` 展示了业务包自行拥有的 `skill` 注册项。
+本包拥有 generic fallback，以及 shell/pwsh、read、read_image、write/edit、running `str_replace_editor` `create`／`str_replace`、grep/glob、web、todo、question 与 Code Dispatch 的内置展示。结构化卡片直接从第一方原始 event 字段派生；Host `presentCall` 与 `presentResult` 值不会进入 Client。前台一次性 shell 结果使用 terminal 卡片。已完成的持久 shell 结果使用可展开的 generic 输入／输出卡片，因为 reset 与部分输出诊断不一定描述单个进程的退出状态；后台启动回执保持折叠。成功的问题行按稳定 id 配对调用中的问题与结果中的回答，展开后显示可读的问答行。已取消或已中断的问题行显示其裁决与原始问题，不虚构回答。不受支持、格式错误或含糊的输入回退为压平的工具输入／结果文本。`ui-skill` 展示了业务包自行拥有的 `skill` 注册项。
 
 -----
 
@@ -61,8 +61,8 @@ owner 载荷为 `ToolCallOwnerProps`：`callId`、`toolName`、冻结的 `block`
 
 ### 详情与卡片
 
-本包通过 `ToolDetails` 填充 `conversation.details.tool`。行 renderer 与 Details renderer 分别为 terminal、read、diff、search 和 web 卡片复用同一个纯 card model。这些 model 校验原始调用参数、结果内容、失败状态、持久 metadata、Code Dispatch `parentCallId` 与 Session 路径事实。Generic row 保留原始 `argsRaw` 引用，只在展开期间格式化 input body；结构化卡片跳过 generic body 格式化。不受支持或格式错误的输入使用压平的工具结果文本。各类卡片的上限与 fallback 规则仍由对应的 [terminal](../../../.agents/notes/implemented/feature/2026-07-28-web-terminal-card.zh.md)、[diff](../../../.agents/notes/implemented/feature/2026-07-30-web-diff-card.zh.md)、[read](../../../.agents/notes/implemented/feature/2026-07-30-web-read-card-frontend.zh.md)、[search](../../../.agents/notes/implemented/feature/2026-07-30-web-search-card.zh.md)、[web](../../../.agents/notes/implemented/feature/2026-07-30-web-result-card-frontend.zh.md) 与 [question](../../../.agents/notes/implemented/feature/2026-07-29-ask-question-web-presentation.zh.md) 笔记负责。
 
+本包通过 `ToolDetails` 填充 `conversation.details.tool`。行 renderer 与 Details renderer 分别为 terminal、read、diff、search 和 web 卡片复用同一个纯 card model；image 卡片仅属于行，因为其图库经由工具自有 `tool.call.images` 槽位渲染，而 details 面板不声明该槽位。这些 model 校验原始调用参数、结果内容、失败状态、持久 metadata、Code Dispatch `parentCallId` 与 Session 路径事实。不受支持或格式错误的输入使用压平的工具结果文本。各类卡片的上限与 fallback 规则仍由对应的 [terminal](../../../.agents/notes/implemented/feature/2026-07-28-web-terminal-card.zh.md)、[diff](../../../.agents/notes/implemented/feature/2026-07-30-web-diff-card.zh.md)、[read](../../../.agents/notes/implemented/feature/2026-07-30-web-read-card-frontend.zh.md)、[image](../../../.agents/notes/implemented/feature/2026-08-20-tool-card-image-results.zh.md)、[search](../../../.agents/notes/implemented/feature/2026-07-30-web-search-card.zh.md)、[web](../../../.agents/notes/implemented/feature/2026-07-30-web-result-card-frontend.zh.md) 与 [question](../../../.agents/notes/implemented/feature/2026-07-29-ask-question-web-presentation.zh.md) 笔记负责。
 </details>
 
 -----

package/lib/client.js

@@ -25,7 +25,8 @@ window.__ModuleLoader__.load({
 		function resolveWorkspacePath(cwd, path) {
 			if (path.startsWith("/") || isWindowsStylePath(path)) return path;
 			if (cwd === void 0 || cwd === "") return path;
-			return `${cwd.replace(/[/\\]+$/, "")}/${path.replace(/^[/\\]+/, "")}`;
+			const separator = isWindowsStylePath(cwd) && cwd.includes("\\") ? "\\" : "/";
+			return `${cwd.replace(/[/\\]+$/, "")}${separator}${path.replace(/^[/\\]+/, "")}`;
 		}
 		/**
 		* Abbreviate a POSIX home directory for display.
@@ -67,6 +68,7 @@ window.__ModuleLoader__.load({
 			bash: "bash",
 			pwsh: "bash",
 			read: "read",
+			read_image: "read",
 			web_fetch: "read",
 			web_search: "search",
 			grep: "search",
@@ -87,7 +89,8 @@ window.__ModuleLoader__.load({
 			cordis_run: "tool.title.runCordis",
 			cordis_stop: "tool.title.stopCordis",
 			cordis_undefine: "tool.title.removeCordis",
-			pwsh: "tool.title.pwsh"
+			pwsh: "tool.title.pwsh",
+			read_image: "tool.title.readImage"
 		};
 		/**
 		* Classify a tool name into its row variant.
@@ -1042,7 +1045,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-css:/home/runner/work/dsh-publisher/dsh-publisher/upstream/packages/client/ui-tool/src/client/tool/components/ToolRow.module.css.mjs
-		const css$3 = ".RAJz1a_root{flex-direction:column;display:flex}.RAJz1a_row{position:relative;overflow:hidden}.RAJz1a_root[data-state=running] .RAJz1a_row:after{content:\"\";background:linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--dsw-alias-bg-base) 60%, transparent) 55%, transparent 100%);pointer-events:none;width:300px;animation:2.6s ease-out infinite RAJz1a_dsh-tool-row-sweep;position:absolute;top:0;bottom:0;left:0}@keyframes RAJz1a_dsh-tool-row-sweep{0%{left:-300px}90%,to{left:100%}}.RAJz1a_leading{flex-shrink:0}.RAJz1a_root[data-tool^=cordis_] .RAJz1a_leading,.RAJz1a_root[data-tool^=cordis_] .RAJz1a_title{color:var(--dsw-alias-state-business-primary)}.RAJz1a_root[data-tool^=cordis_] .RAJz1a_title{font-weight:500}.RAJz1a_root[data-tool^=cordis_] .RAJz1a_sep{background:var(--dsw-alias-state-business-primary)}.RAJz1a_chevron{color:var(--dsw-alias-label-secondary)}.RAJz1a_title{font-weight:400}.RAJz1a_sep{background:var(--dsw-alias-label-caption);border-radius:1px;flex:none;width:2px;height:2px;margin:0 8px}.RAJz1a_summary{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--dsh-content-font-size-secondary,13px);line-height:calc(24px + var(--dsh-content-font-delta,0px));color:var(--dsw-alias-label-tertiary);flex:auto;overflow:hidden}.RAJz1a_summarySuffix{white-space:nowrap;font-size:var(--dsh-content-font-size-secondary,13px);line-height:calc(24px + var(--dsh-content-font-delta,0px));color:var(--dsw-alias-label-tertiary);flex:none;margin-left:4px}.RAJz1a_diffStat{font-family:var(--ds-font-family-code);font-size:calc(var(--dsh-content-font-size-secondary,13px) - 2px);color:var(--dsw-alias-label-caption);margin-left:10px;transform:translateY(.5px)}.RAJz1a_fileLink{text-overflow:ellipsis;white-space:nowrap;min-width:0;font:inherit;text-align:left;font-size:var(--dsh-content-font-size-secondary,13px);line-height:calc(24px + var(--dsh-content-font-delta,0px));color:var(--dsw-alias-label-secondary);text-decoration:underline dotted;text-decoration-color:var(--dsw-alias-label-tertiary);text-underline-offset:3px;cursor:pointer;background:0 0;border:none;flex:0 auto;margin:0;padding:0;text-decoration-thickness:1px;overflow:hidden}.RAJz1a_fileLink:hover{color:var(--dsw-alias-label-primary);text-decoration-color:currentColor}.RAJz1a_errorSummary{color:var(--dsw-alias-state-error-primary)}.RAJz1a_bodyWrap{flex-direction:column;display:flex}.RAJz1a_inspectButton{border:.5px solid var(--dsw-alias-border-l3);corner-shape:round;background:var(--dsw-alias-bg-base);color:var(--dsw-alias-label-secondary);cursor:pointer;opacity:0;border-radius:999px;align-self:flex-start;align-items:center;gap:4px;margin:4px 0 2px 4px;padding:2px 8px;font-size:11px;line-height:16px;transition:opacity .1s;display:inline-flex}.RAJz1a_root:hover .RAJz1a_inspectButton,.RAJz1a_inspectButton:focus-visible{opacity:1}.RAJz1a_inspectButton:hover{background:var(--dsw-alias-interactive-bg-hover-solid);color:var(--dsw-alias-label-primary)}.RAJz1a_bodyScroll{max-height:260px;overflow-y:auto}.RAJz1a_ioCard{border:.5px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-markdown-code-block);font:var(--dsw-font-markdown-code-block-small);border-radius:12px;flex-direction:column;margin:4px 0 4px 4px;display:flex}.RAJz1a_ioSection{grid-template-columns:max-content 1fr;align-items:baseline;column-gap:14px;max-height:150px;padding:12px 16px;display:grid;overflow-y:auto}.RAJz1a_ioSection::-webkit-scrollbar-thumb{background-clip:padding-box;border:2px solid #0000;border-radius:6px}.RAJz1a_ioSection::-webkit-scrollbar-track{margin:6px 0}.RAJz1a_ioLabel{color:var(--dsw-alias-label-caption);align-self:start;position:sticky;top:0}.RAJz1a_ioDivider{background:var(--dsw-alias-border-l2);flex:none;height:.5px}.RAJz1a_ioText{white-space:pre-wrap;word-break:break-word;min-width:0;color:var(--dsw-alias-label-secondary)}.RAJz1a_ioText[data-error]{color:var(--dsw-alias-state-error-primary)}.RAJz1a_codeBody,.RAJz1a_terminalBody,.RAJz1a_diffBody,.RAJz1a_readBody,.RAJz1a_searchBody,.RAJz1a_webBody{margin:4px 0 4px 4px}.RAJz1a_searchRecovery{white-space:pre-wrap;overflow-wrap:anywhere;font:var(--dsw-font-xs-13);color:var(--dsw-alias-label-tertiary);margin:4px 0 4px 4px}.RAJz1a_codeBody{--dsl-code-block-content-font:var(--dsw-font-markdown-code-block-small)}.RAJz1a_terminalBody{--dsl-terminal-font:var(--dsw-font-markdown-code-block-small);--dsl-terminal-line-height:18px;--dsl-terminal-output-max-height:224px;border:.5px solid var(--dsw-alias-border-l1)}.RAJz1a_visuallyHidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}";
+		const css$3 = ".RAJz1a_root{flex-direction:column;display:flex}.RAJz1a_row{position:relative;overflow:hidden}.RAJz1a_root[data-state=running] .RAJz1a_row:after{content:\"\";background:linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--dsw-alias-bg-base) 60%, transparent) 55%, transparent 100%);pointer-events:none;width:300px;animation:2.6s ease-out infinite RAJz1a_dsh-tool-row-sweep;position:absolute;top:0;bottom:0;left:0}@keyframes RAJz1a_dsh-tool-row-sweep{0%{left:-300px}90%,to{left:100%}}.RAJz1a_leading{flex-shrink:0}.RAJz1a_root[data-tool^=cordis_] .RAJz1a_leading,.RAJz1a_root[data-tool^=cordis_] .RAJz1a_title{color:var(--dsw-alias-state-business-primary)}.RAJz1a_root[data-tool^=cordis_] .RAJz1a_title{font-weight:500}.RAJz1a_root[data-tool^=cordis_] .RAJz1a_sep{background:var(--dsw-alias-state-business-primary)}.RAJz1a_chevron{color:var(--dsw-alias-label-secondary)}.RAJz1a_title{font-weight:400}.RAJz1a_sep{background:var(--dsw-alias-label-caption);border-radius:1px;flex:none;width:2px;height:2px;margin:0 8px}.RAJz1a_summary{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--dsh-content-font-size-secondary,13px);line-height:calc(24px + var(--dsh-content-font-delta,0px));color:var(--dsw-alias-label-tertiary);flex:auto;overflow:hidden}.RAJz1a_summarySuffix{white-space:nowrap;font-size:var(--dsh-content-font-size-secondary,13px);line-height:calc(24px + var(--dsh-content-font-delta,0px));color:var(--dsw-alias-label-tertiary);flex:none;margin-left:4px}.RAJz1a_diffStat{font-family:var(--ds-font-family-code);font-size:calc(var(--dsh-content-font-size-secondary,13px) - 2px);color:var(--dsw-alias-label-caption);margin-left:10px;transform:translateY(.5px)}.RAJz1a_fileLink{text-overflow:ellipsis;white-space:nowrap;min-width:0;font:inherit;text-align:left;font-size:var(--dsh-content-font-size-secondary,13px);line-height:calc(24px + var(--dsh-content-font-delta,0px));color:var(--dsw-alias-label-secondary);text-decoration:underline dotted;text-decoration-color:var(--dsw-alias-label-tertiary);text-underline-offset:3px;cursor:pointer;background:0 0;border:none;flex:0 auto;margin:0;padding:0;text-decoration-thickness:1px;overflow:hidden}.RAJz1a_fileLink:hover{color:var(--dsw-alias-label-primary);text-decoration-color:currentColor}.RAJz1a_errorSummary{color:var(--dsw-alias-state-error-primary)}.RAJz1a_bodyWrap{flex-direction:column;display:flex}.RAJz1a_inspectButton{border:.5px solid var(--dsw-alias-border-l3);corner-shape:round;background:var(--dsw-alias-bg-base);color:var(--dsw-alias-label-secondary);cursor:pointer;opacity:0;border-radius:999px;align-self:flex-start;align-items:center;gap:4px;margin:4px 0 2px 4px;padding:2px 8px;font-size:11px;line-height:16px;transition:opacity .1s;display:inline-flex}.RAJz1a_root:hover .RAJz1a_inspectButton,.RAJz1a_inspectButton:focus-visible{opacity:1}.RAJz1a_inspectButton:hover{background:var(--dsw-alias-interactive-bg-hover-solid);color:var(--dsw-alias-label-primary)}.RAJz1a_bodyScroll{max-height:260px;overflow-y:auto}.RAJz1a_ioCard{border:.5px solid var(--dsw-alias-border-l1);background:var(--dsw-alias-markdown-code-block);font:var(--dsw-font-markdown-code-block-small);border-radius:12px;flex-direction:column;margin:4px 0 4px 4px;display:flex}.RAJz1a_ioSection{grid-template-columns:max-content 1fr;align-items:baseline;column-gap:14px;max-height:150px;padding:12px 16px;display:grid;overflow-y:auto}.RAJz1a_ioSection::-webkit-scrollbar-thumb{background-clip:padding-box;border:2px solid #0000;border-radius:6px}.RAJz1a_ioSection::-webkit-scrollbar-track{margin:6px 0}.RAJz1a_ioLabel{color:var(--dsw-alias-label-caption);align-self:start;position:sticky;top:0}.RAJz1a_ioDivider{background:var(--dsw-alias-border-l2);flex:none;height:.5px}.RAJz1a_ioText{white-space:pre-wrap;word-break:break-word;min-width:0;color:var(--dsw-alias-label-secondary)}.RAJz1a_ioText[data-error]{color:var(--dsw-alias-state-error-primary)}.RAJz1a_codeBody,.RAJz1a_terminalBody,.RAJz1a_diffBody,.RAJz1a_readBody,.RAJz1a_imageBody,.RAJz1a_searchBody,.RAJz1a_webBody{margin:4px 0 4px 4px}.RAJz1a_searchRecovery{white-space:pre-wrap;overflow-wrap:anywhere;font:var(--dsw-font-xs-13);color:var(--dsw-alias-label-tertiary);margin:4px 0 4px 4px}.RAJz1a_imageLabel{overflow-wrap:anywhere;font:var(--dsw-font-sm-13);color:var(--dsw-alias-label-secondary);margin-bottom:4px}.RAJz1a_imageMeta{white-space:pre-wrap;overflow-wrap:anywhere;font:var(--dsw-font-xs-13);color:var(--dsw-alias-label-tertiary)}.RAJz1a_codeBody{--dsl-code-block-content-font:var(--dsw-font-markdown-code-block-small)}.RAJz1a_terminalBody{--dsl-terminal-font:var(--dsw-font-markdown-code-block-small);--dsl-terminal-line-height:18px;--dsl-terminal-output-max-height:224px;border:.5px solid var(--dsw-alias-border-l1)}.RAJz1a_visuallyHidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}";
 		const tagId$3 = "@prettier-ai/dsh-client-ui-tool/ToolRow.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$3) + "]") === null) {
 			const tag = document.createElement("style");
@@ -1061,6 +1064,9 @@ window.__ModuleLoader__.load({
 			"dsh-tool-row-sweep": "RAJz1a_dsh-tool-row-sweep",
 			"errorSummary": "RAJz1a_errorSummary",
 			"fileLink": "RAJz1a_fileLink",
+			"imageBody": "RAJz1a_imageBody",
+			"imageLabel": "RAJz1a_imageLabel",
+			"imageMeta": "RAJz1a_imageMeta",
 			"inspectButton": "RAJz1a_inspectButton",
 			"ioCard": "RAJz1a_ioCard",
 			"ioDivider": "RAJz1a_ioDivider",
@@ -1102,7 +1108,7 @@ window.__ModuleLoader__.load({
 				default: return null;
 			}
 		}
-		function ToolRow({ t, variant, toolName, icon, title, summary, summarySuffix, bodyRaw, output, askQuestion, errorSummary, terminal, diff, read, search, web, state, filePath, onOpenFile, inspect }) {
+		function ToolRow({ t, variant, toolName, icon, title, summary, summarySuffix, bodyRaw, output, askQuestion, errorSummary, terminal, diff, read, image, renderSlot, loadImage, search, web, state, filePath, onOpenFile, inspect }) {
 			const [expanded, setExpanded] = (0, react.useState)(false);
 			const terminalLabels = (0, react.useMemo)(() => terminalBlockLabels(t), [t]);
 			const diffLabels = (0, react.useMemo)(() => diffBlockLabels(t), [t]);
@@ -1112,11 +1118,12 @@ window.__ModuleLoader__.load({
 			const terminalBody = terminal === void 0 || terminal === null ? null : localizeTerminalCardModel(terminal, t);
 			const diffBody = diff ?? null;
 			const readBody = read ?? null;
+			const imageBody = image !== void 0 && image !== null && renderSlot !== void 0 && loadImage !== void 0 ? image : null;
 			const searchBody = search ?? null;
 			const webBody = web ?? null;
 			const askQuestionBody = askQuestion ?? null;
 			const outputText = output ?? null;
-			const card = askQuestionBody ?? terminalBody ?? diffBody ?? readBody ?? searchBody ?? webBody;
+			const card = askQuestionBody ?? terminalBody ?? diffBody ?? readBody ?? imageBody ?? searchBody ?? webBody;
 			const expandable = bodyRaw != null || outputText !== null || card !== null;
 			const open = expanded && expandable;
 			const bodyText = (0, react.useMemo)(() => open && card === null && bodyRaw != null ? formatToolBody(variant, bodyRaw) : null, [
@@ -1203,6 +1210,23 @@ window.__ModuleLoader__.load({
 							labels: readLabels,
 							maxLines: 8,
 							className: ToolRow_module_css_default.readBody
+						}) : imageBody !== null ? (0, react_jsx_runtime.jsxs)("div", {
+							className: ToolRow_module_css_default.imageBody,
+							children: [
+								(0, react_jsx_runtime.jsx)("div", {
+									className: ToolRow_module_css_default.imageLabel,
+									children: imageBody.label
+								}),
+								renderSlot !== void 0 && loadImage !== void 0 && renderSlot("tool.call.images", {
+									images: imageBody.images,
+									loadImage,
+									align: "start"
+								}),
+								(0, react_jsx_runtime.jsx)("div", {
+									className: ToolRow_module_css_default.imageMeta,
+									children: imageBody.text
+								})
+							]
 						}) : searchBody !== null ? (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [(0, react_jsx_runtime.jsx)(_prettier_ai_dsh_client_ui_primitives.SearchBlock, {
 							...searchBody.card,
 							labels: searchLabels,
@@ -1328,7 +1352,7 @@ window.__ModuleLoader__.load({
 			return "kind" in node ? node.call?.name ?? "" : node.name;
 		}
 		/** One atomic call dispatched through the Tool-owned keyed slot. */
-		const ToolCall = (0, react.memo)(function ToolCall({ renderSlot, callId, toolName, block, openFile, selected, cwd, home, inspectCall, t, children }) {
+		const ToolCall = (0, react.memo)(function ToolCall({ renderSlot, callId, toolName, block, openFile, selected, cwd, home, inspectCall, loadImage, t, children }) {
 			const owner = (0, react.useMemo)(() => ({
 				callId,
 				toolName,
@@ -1336,6 +1360,7 @@ window.__ModuleLoader__.load({
 				openFile,
 				cwd,
 				home,
+				loadImage,
 				inspect: () => {
 					inspectCall(callId);
 				}
@@ -1346,6 +1371,7 @@ window.__ModuleLoader__.load({
 				openFile,
 				cwd,
 				home,
+				loadImage,
 				inspectCall
 			]);
 			return (0, react_jsx_runtime.jsxs)("div", {
@@ -1362,7 +1388,7 @@ window.__ModuleLoader__.load({
 				}), children]
 			});
 		});
-		const ToolCallBranch = (0, react.memo)(function ToolCallBranch({ renderSlot, block, selectedCallId, cwd, home, openFile, inspectCall, t }) {
+		const ToolCallBranch = (0, react.memo)(function ToolCallBranch({ renderSlot, block, selectedCallId, cwd, home, openFile, inspectCall, loadImage, t }) {
 			return (0, react_jsx_runtime.jsx)(ToolCall, {
 				renderSlot,
 				callId: block.callId,
@@ -1373,6 +1399,7 @@ window.__ModuleLoader__.load({
 				cwd,
 				home,
 				inspectCall,
+				loadImage,
 				t,
 				children: block.subCalls.length > 0 ? (0, react_jsx_runtime.jsx)("div", {
 					className: ToolCallTree_module_css_default.subCalls,
@@ -1385,6 +1412,7 @@ window.__ModuleLoader__.load({
 						home,
 						openFile,
 						inspectCall,
+						loadImage,
 						t
 					}, child.callId))
 				}) : null
@@ -1396,7 +1424,7 @@ window.__ModuleLoader__.load({
 		* @param props - whole-Tool owner data and the Tool-owned child-slot share.
 		* @returns the Tool call tree.
 		*/
-		function ToolCallTree({ renderSlot, node, selectedCallId, cwd, openFile, inspectCall, useHostInfo, t }) {
+		function ToolCallTree({ renderSlot, node, selectedCallId, cwd, openFile, inspectCall, loadImage, useHostInfo, t }) {
 			const home = useHostInfo((info) => info.home);
 			const block = node.data.root;
 			return (0, react_jsx_runtime.jsx)(ToolCallBranch, {
@@ -1407,6 +1435,7 @@ window.__ModuleLoader__.load({
 				home,
 				openFile,
 				inspectCall,
+				loadImage,
 				t
 			});
 		}
@@ -1872,13 +1901,16 @@ window.__ModuleLoader__.load({
 			}
 		};
 		//#endregion
-		//#region lib/types/client/tool/toolviews/read-row.js
+		//#region lib/types/client/tool/toolviews/read-family-row.js
 		/**
-		* Lets users expand a completed read result and open its reported path.
+		* Compose a read-family row: the shared chrome and model-derived fields, plus the
+		* caller's card material.
+		* @param props - the toolview runtime share and locale seat.
+		* @param card - the card props this row owns.
+		* @returns the assembled ToolRow.
 		*/
-		function ReadRow({ toolName, block, cwd, home, openFile, inspect, t }) {
+		function readFamilyRow({ toolName, block, cwd, home, openFile, inspect, t }, card) {
 			const model = toolRowModel(toolName, block, cwd, home);
-			const read = readCardModel(block, cwd, home);
 			return (0, react_jsx_runtime.jsx)(ToolRow, {
 				t,
 				variant: model.variant,
@@ -1886,15 +1918,25 @@ window.__ModuleLoader__.load({
 				icon: (0, react_jsx_runtime.jsx)(_prettier_ai_dsh_client_ui_primitives.IconBrowseOutline16, { size: 14 }),
 				title: t(model.titleKey),
 				summary: model.summary,
+				bodyRaw: null,
 				output: model.output,
 				errorSummary: model.errorSummary,
-				read,
+				...card,
 				state: model.state,
 				filePath: model.filePath,
 				onOpenFile: openFile,
 				inspect
 			});
 		}
+		//#endregion
+		//#region lib/types/client/tool/toolviews/read-row.js
+		/**
+		* Lets users expand a completed read result and open its reported path.
+		*/
+		function ReadRow(props) {
+			const { block, cwd, home } = props;
+			return readFamilyRow(props, { read: readCardModel(block, cwd, home) });
+		}
 		/** Registers the read tool's conversation row. */
 		const readToolview = {
 			name: "read-toolview",
@@ -1908,6 +1950,214 @@ window.__ModuleLoader__.load({
 			}
 		};
 		//#endregion
+		//#region lib/types/client/tool/models/image-card-model.js
+		/**
+		* Whether a wire value is a usable pixel or byte measure.
+		* @param value - unvalidated wire value.
+		* @returns true when it is a positive integer.
+		*/
+		function positiveInteger(value) {
+			return typeof value === "number" && Number.isInteger(value) && value > 0;
+		}
+		/** The envelope `formatImageReadOutput` writes, matched by shape. */
+		const IMAGE_ENVELOPE = /^<path>[^\n]*<\/path>\n<type>image<\/type>\n<content>\n[\s\S]*\n<\/content>$/u;
+		/** The media types a durable image block may claim; anything else declines.
+		*  Hand-written mirror of `ImageMediaType` from dsh-attachment — the wire
+		*  boundary needs a runtime check and feature plugins must not import values
+		*  from each other; a new member added there must be added here too, or the
+		*  decline point below silently degrades that image to the generic card. */
+		const IMAGE_MEDIA_TYPES = new Set([
+			"image/png",
+			"image/jpeg",
+			"image/webp",
+			"image/gif"
+		]);
+		/** Runtime membership check; the cast is safe because the set holds exactly the four members. */
+		function isImageMediaType(value) {
+			return IMAGE_MEDIA_TYPES.has(value);
+		}
+		/**
+		* Narrow the persisted metadata, defensively. Every field arrives unvalidated on
+		* replay (an obsolete or hand-edited log reaches here), so any mismatch declines
+		* to the generic card rather than throwing. An absent `meta` (a nested call
+		* persists none) leaves the path to the call's own `file_path` argument.
+		*
+		* The attachment id is checked for existence only: it is opaque and
+		* provider-owned, and consumers must not parse that representation, so
+		* pattern-matching the local content-address form would reject a legitimate id
+		* minted by an alternative store.
+		* @param meta - persisted presentation metadata of unknown shape.
+		* @returns the narrowed path, or null when it does not match.
+		*/
+		function imageMeta(meta) {
+			if (typeof meta !== "object" || meta === null || Array.isArray(meta)) return null;
+			const { path } = meta;
+			if (typeof path !== "string" || path === "") return null;
+			return { path };
+		}
+		/**
+		* Narrow every attachment reference carried by the result's image blocks, in
+		* order.
+		*
+		* The content is the single source of truth for the references: it is what the
+		* tool actually returned and what a post-execute hook would replace together
+		* with the rest of the content. Every field arrives unvalidated over the wire,
+		* so any malformed image block declines to the generic card rather than
+		* rendering a partial gallery.
+		*
+		* The attachment id is checked for existence only — it is opaque and
+		* provider-owned, so pattern-matching the local content-address form would reject
+		* a legitimate id minted by an alternative store.
+		* @param content - the settled result's content blocks.
+		* @returns the narrowed references, or null when no valid image block is present.
+		*/
+		function imageReferences(content) {
+			const refs = [];
+			for (const part of content) {
+				if (typeof part !== "object" || part === null) continue;
+				const { type, attachment } = part;
+				if (type !== "image") continue;
+				if (typeof attachment !== "object" || attachment === null || Array.isArray(attachment)) return null;
+				const { attachmentId, mediaType, bytes, width, height, name, originalDimensions } = attachment;
+				if (typeof attachmentId !== "string" || attachmentId === "") return null;
+				if (typeof mediaType !== "string" || !isImageMediaType(mediaType)) return null;
+				if (!positiveInteger(bytes) || !positiveInteger(width) || !positiveInteger(height)) return null;
+				if (name !== void 0 && typeof name !== "string") return null;
+				let inputDimensions;
+				if (originalDimensions !== void 0) {
+					if (typeof originalDimensions !== "object" || originalDimensions === null || Array.isArray(originalDimensions)) return null;
+					const { width: inputWidth, height: inputHeight } = originalDimensions;
+					if (!positiveInteger(inputWidth) || !positiveInteger(inputHeight)) return null;
+					inputDimensions = {
+						width: inputWidth,
+						height: inputHeight
+					};
+				}
+				refs.push({
+					attachmentId,
+					mediaType,
+					bytes,
+					width,
+					height,
+					...name === void 0 ? {} : { name },
+					...inputDimensions === void 0 ? {} : { originalDimensions: inputDimensions }
+				});
+			}
+			return refs.length > 0 ? refs : null;
+		}
+		/**
+		* Read the text of every text block of a settled image result, joined in order.
+		*
+		* The envelope is one of them; a post-execute hook that appends further text
+		* blocks keeps them visible under the gallery instead of being dropped. The
+		* envelope shape is still the recognition gate: a result without it is not a
+		* well-formed image read and declines.
+		* @param content - the settled result's content blocks.
+		* @returns the joined text, or null when no envelope-shaped block is present.
+		*/
+		function imageTexts(content) {
+			const parts = [];
+			let sawEnvelope = false;
+			for (const part of content) {
+				if (part.type !== "text" || typeof part.text !== "string") continue;
+				if (IMAGE_ENVELOPE.test(part.text)) sawEnvelope = true;
+				parts.push(part.text);
+			}
+			return sawEnvelope && parts.length > 0 ? parts.join("\n") : null;
+		}
+		/**
+		* Whether the content carries only blocks the card consumes.
+		*
+		* `ContentBlock` is a merge-extensible union, so a post-execute hook could
+		* append a block of a type this card does not render (reasoning, an extension
+		* type, or a non-object). Rendering the card anyway would silently hide that
+		* block, so anything beyond a well-formed text or image object declines to the
+		* generic card, which shows the flattened content.
+		* @param content - the settled result's content blocks.
+		* @returns true when every block is a text or image object with usable fields.
+		*/
+		function fullyRendered(content) {
+			return content.every((part) => {
+				if (typeof part !== "object" || part === null) return false;
+				const { type, text } = part;
+				return type === "image" || type === "text" && typeof text === "string";
+			});
+		}
+		/**
+		* Derive a settled image card after validating the call head, persisted
+		* metadata (or its argument fallback), and the model-facing image envelope.
+		*
+		* The card is result-side only: a call carries no content until `execute`
+		* returns, so a running `read_image` has none and this returns null for it.
+		* Both root and nested calls settle as ToolResultNode; the nested one (a
+		* read_image dispatched from inside run_code) persists no presentationMeta, so
+		* its label falls back to the call's own `file_path` argument.
+		* @param block - running or settled Tool block.
+		* @param sessionCwd - the session workspace root; a workspace-rooted absolute
+		*   path label displays relative to it. Absent leaves the path as authored.
+		* @param home - host account home; a leftover POSIX home path displays as `~`.
+		* @returns the image-card props, or null for the generic path.
+		*/
+		function imageCardModel(block, sessionCwd, home) {
+			if (!("kind" in block) || block.isError) return null;
+			const call = parsedToolCall(block);
+			if (call?.name !== "read_image") return null;
+			const { file_path: filePath } = call.args;
+			if (typeof filePath !== "string" || filePath.trim() === "") return null;
+			const path = imageMeta(block.meta)?.path ?? (block.parentCallId !== void 0 ? filePath : null);
+			if (path === null) return null;
+			if (!fullyRendered(block.content)) return null;
+			const refs = imageReferences(block.content);
+			if (refs === null) return null;
+			const text = imageTexts(block.content);
+			if (text === null) return null;
+			return {
+				label: abbreviateHomePath(relativizeToCwd(path, sessionCwd), home),
+				images: refs.map((ref) => ({ attachment: ref })),
+				text
+			};
+		}
+		//#endregion
+		//#region lib/types/client/tool/toolviews/read-image-row.js
+		/**
+		* read_image row: the read-family chrome with the durably committed image as the
+		* row's collapsed-by-default card body, rendered through the `tool.call.images`
+		* slot this entry declares.
+		*/
+		function ReadImageRow(props) {
+			const { block, cwd, home, renderSlot, loadImage } = props;
+			return readFamilyRow(props, {
+				image: imageCardModel(block, cwd, home),
+				renderSlot,
+				loadImage
+			});
+		}
+		/**
+		* The read_image row as a plain registrant plugin following the atomic Tool-view
+		* declaration across independent activation and reload lifetimes. Declaring
+		* `tool.call.images` as a child slot authorizes this entry's `renderSlot` to
+		* dispatch the gallery.
+		*/
+		const readImageToolview = {
+			name: "read-image-toolview",
+			inject: ["slots"],
+			/**
+			* Register the read_image row into the Tool-owned keyed view slot.
+			* @param ctx - registrant context (disposal rides ctx.effect inside slots.register).
+			*/
+			apply(ctx) {
+				ctx.slots.inject("tool.call.toolview", () => ctx.slots.register({
+					name: "tool.call.toolview",
+					key: "read_image",
+					locale: CONVERSATION_NS,
+					children: { "tool.call.images": {
+						kind: "single",
+						scope: "session"
+					} }
+				}, ReadImageRow));
+			}
+		};
+		//#endregion
 		//#region lib/types/client/tool/toolviews/search-row.js
 		const SEARCH_TITLE_KEYS = {
 			grep: "tool.title.grep",
@@ -2120,6 +2370,7 @@ window.__ModuleLoader__.load({
 			}, ToolDetails));
 			ctx.plugin(bashToolviewSample);
 			ctx.plugin(readToolview);
+			ctx.plugin(readImageToolview);
 			ctx.plugin(fileMutationToolview);
 			ctx.plugin(searchToolview);
 			ctx.plugin(webToolview);

package/lib/types/client/contract/slots.d.ts

@@ -2,6 +2,7 @@
 import type { HostObservable, InjectFace, PropsLocale, PropsRenderSlots, PropsRuntime } from '@prettier-ai/dsh-client-ui-slots';
 import type { RemoteHostFacts } from '@prettier-ai/dsh-api-remotes/client';
 import type { ToolCallBlock } from '@prettier-ai/dsh-client-ui-chat/client';
+import type { MessageImageLoader, MessageImageSource } from '@prettier-ai/dsh-client-ui-conversation/client';
 declare module '@prettier-ai/dsh-client-ui-slots' {
     interface SlotMap {
         /**
@@ -23,8 +24,35 @@ declare module '@prettier-ai/dsh-client-ui-slots' {
             scope: 'session';
             owner: ToolCallOwnerProps;
         };
+        /**
+         * Durable images of a settled image-bearing Tool call, rendered through
+         * the attachment presentation plugin. The Tool layer never imports an
+         * attachment implementation: a toolview declares this slot as a child and
+         * renders it with the image card's references plus the session-authorized
+         * loader it received in its owner, and the attachment plugin fills the
+         * gallery. Composing no attachment presentation plugin renders nothing,
+         * which is why the image card keeps its own envelope text beside the
+         * gallery. A child slot is declared by exactly one entry: registering a
+         * second toolview that declares the same child throws at load, so a
+         * future image-bearing tool must reuse this entry or own a distinct
+         * slot.
+         */
+        'tool.call.images': {
+            kind: 'single';
+            scope: 'session';
+            owner: ToolImagesOwnerProps;
+        };
     }
 }
+/** Owner currency of the Tool image gallery slot: references plus the loader. */
+export interface ToolImagesOwnerProps {
+    /** Durable references or submission-echo previews in result order. */
+    images: readonly MessageImageSource[];
+    /** Session-authorized image URL loader for the durable arm. */
+    loadImage: MessageImageLoader;
+    /** Horizontal placement inside the owning record. */
+    align: 'start' | 'end';
+}
 /** Standard owner currency supplied to every atomic Tool view. */
 export interface ToolCallOwnerProps {
     /** Tool call identity, stable across running and settled forms. */
@@ -39,6 +67,14 @@ export interface ToolCallOwnerProps {
     home?: string | undefined;
     /** Open a Tool argument path through the Host. */
     openFile: (path: string) => void;
+    /**
+     * Session-authorized image loader for the `tool.call.images` slot, supplied
+     * by the chat node that owns this call. A composed chat node always
+     * supplies it (`ChatNodeOwnerProps.loadImage` is required), so the tool
+     * layer never imports an attachment implementation nor handles URL
+     * authorization.
+     */
+    loadImage: MessageImageLoader;
     /** Inspect this call in the trajectory view when available. */
     inspect?: (() => void) | undefined;
 }

package/lib/types/client/tool/ToolCallTree.d.ts

@@ -5,5 +5,5 @@ import type { ToolTreeProps } from '../contract/slots.ts';
  * @param props - whole-Tool owner data and the Tool-owned child-slot share.
  * @returns the Tool call tree.
  */
-export declare function ToolCallTree({ renderSlot, node, selectedCallId, cwd, openFile, inspectCall, useHostInfo, t, }: ToolTreeProps): import("react").JSX.Element;
+export declare function ToolCallTree({ renderSlot, node, selectedCallId, cwd, openFile, inspectCall, loadImage, useHostInfo, t, }: ToolTreeProps): import("react").JSX.Element;
 //# sourceMappingURL=ToolCallTree.d.ts.map

package/lib/types/client/tool/components/ToolRow.d.ts

@@ -1,7 +1,9 @@
 import { type ReactNode } from 'react';
-import type { TranslateNS } from '@prettier-ai/dsh-client-ui-slots';
+import type { PropsRenderSlots, TranslateNS } from '@prettier-ai/dsh-client-ui-slots';
+import type { MessageImageLoader } from '@prettier-ai/dsh-client-ui-conversation/client';
 import { type DiffCardModel } from '../models/diff-card-model.ts';
 import { type ReadCardModel } from '../models/read-card-model.ts';
+import type { ImageCardModel } from '../models/image-card-model.ts';
 import { type SearchCardModel } from '../models/search-card-model.ts';
 import { type TerminalCardModel } from '../models/terminal-card-model.ts';
 import type { AskQuestionCardModel } from '../models/ask-question-card-model.ts';
@@ -35,6 +37,21 @@ export interface ToolRowProps {
     terminal?: TerminalCardModel | null | undefined;
     diff?: DiffCardModel | null | undefined;
     read?: ReadCardModel | null | undefined;
+    /**
+     * Image-card material for a call whose result is an image (derived by
+     * `imageCardModel`). Rendered through the `tool.call.images` slot, so the
+     * tool layer never imports an attachment implementation nor handles URL
+     * authorization.
+     */
+    image?: ImageCardModel | null | undefined;
+    /**
+     * Dispatch the image gallery through the tool-owned `tool.call.images`
+     * slot, supplied by the toolview that owns this row together with the
+     * session-authorized loader.
+     */
+    renderSlot?: PropsRenderSlots<'tool.call.images'>['renderSlot'] | undefined;
+    /** Session-authorized image URL loader for the gallery slot. */
+    loadImage?: MessageImageLoader | undefined;
     search?: SearchCardModel | null | undefined;
     web?: WebCardModelProps | null | undefined;
     state: ToolRowState;
@@ -51,5 +68,5 @@ export interface ToolRowProps {
      */
     inspect?: (() => void) | undefined;
 }
-export declare function ToolRow({ t, variant, toolName, icon, title, summary, summarySuffix, bodyRaw, output, askQuestion, errorSummary, terminal, diff, read, search, web, state, filePath, onOpenFile, inspect, }: ToolRowProps): import("react").JSX.Element;
+export declare function ToolRow({ t, variant, toolName, icon, title, summary, summarySuffix, bodyRaw, output, askQuestion, errorSummary, terminal, diff, read, image, renderSlot, loadImage, search, web, state, filePath, onOpenFile, inspect, }: ToolRowProps): import("react").JSX.Element;
 //# sourceMappingURL=ToolRow.d.ts.map

package/lib/types/client/tool/models/image-card-model.d.ts

@@ -0,0 +1,45 @@
+/** Pure image-card derivation from raw result content and metadata. @module */
+import type { ImageAttachmentRef } from '@prettier-ai/dsh-attachment';
+import { type ToolCallBlock } from './tool-call-model.ts';
+/**
+ * The image-card material one settled call contributes: the display label plus
+ * the durable references the attachment slot renders as a gallery.
+ *
+ * The bytes are not here. `attachmentId` is opaque and provider-owned, so a UI
+ * resolves it to a session-authorized URL at render time; this model never parses
+ * it nor derives a path from it.
+ */
+export interface ImageCardModel {
+    /** Card label: the read path, shortened the way every other card's is. */
+    label: string;
+    /** The durable images this result returned, in result order. */
+    images: readonly {
+        readonly attachment: ImageAttachmentRef;
+    }[];
+    /**
+     * The model-facing envelope text, for the line under the gallery.
+     *
+     * Taken from the result's own text block rather than the row's flattened
+     * result text: an image read's content is `[text envelope, image block]`, and
+     * flattening JSON.stringifies the image block, which would print the raw
+     * attachment object under the picture — the symptom this card exists to remove.
+     */
+    text: string;
+}
+/**
+ * Derive a settled image card after validating the call head, persisted
+ * metadata (or its argument fallback), and the model-facing image envelope.
+ *
+ * The card is result-side only: a call carries no content until `execute`
+ * returns, so a running `read_image` has none and this returns null for it.
+ * Both root and nested calls settle as ToolResultNode; the nested one (a
+ * read_image dispatched from inside run_code) persists no presentationMeta, so
+ * its label falls back to the call's own `file_path` argument.
+ * @param block - running or settled Tool block.
+ * @param sessionCwd - the session workspace root; a workspace-rooted absolute
+ *   path label displays relative to it. Absent leaves the path as authored.
+ * @param home - host account home; a leftover POSIX home path displays as `~`.
+ * @returns the image-card props, or null for the generic path.
+ */
+export declare function imageCardModel(block: ToolCallBlock, sessionCwd?: string, home?: string): ImageCardModel | null;
+//# sourceMappingURL=image-card-model.d.ts.map

package/lib/types/client/tool/toolviews/read-family-row.d.ts

@@ -0,0 +1,25 @@
+import type { ReactNode } from 'react';
+import type { PropsRenderSlots } from '@prettier-ai/dsh-client-ui-slots';
+import type { ToolCallViewProps } from '../../contract/slots.ts';
+import { type ToolRowProps } from '../components/ToolRow.tsx';
+/** Full row props of a read-family toolview: the runtime share plus its locale seat. */
+export type ReadFamilyRowProps = ToolCallViewProps & {
+    t: ToolRowProps['t'];
+};
+/** read_image row props: the runtime share, the declared image child slot, and the locale seat. */
+export type ReadImageRowProps = ReadFamilyRowProps & PropsRenderSlots<'tool.call.images'>;
+/**
+ * The card material one read-family row contributes: exactly the ToolRow card
+ * props that row owns. `read` supplies `read`; `read_image` supplies `image`
+ * together with the slot dispatcher and loader that draw it.
+ */
+export type ReadFamilyCard = Pick<ToolRowProps, 'read' | 'image' | 'renderSlot' | 'loadImage'>;
+/**
+ * Compose a read-family row: the shared chrome and model-derived fields, plus the
+ * caller's card material.
+ * @param props - the toolview runtime share and locale seat.
+ * @param card - the card props this row owns.
+ * @returns the assembled ToolRow.
+ */
+export declare function readFamilyRow({ toolName, block, cwd, home, openFile, inspect, t }: ReadFamilyRowProps, card: ReadFamilyCard): ReactNode;
+//# sourceMappingURL=read-family-row.d.ts.map

package/lib/types/client/tool/toolviews/read-image-row.d.ts

@@ -0,0 +1,24 @@
+import type { Context } from '@prettier-ai/cordis';
+import { type ReadImageRowProps } from './read-family-row.tsx';
+/**
+ * read_image row: the read-family chrome with the durably committed image as the
+ * row's collapsed-by-default card body, rendered through the `tool.call.images`
+ * slot this entry declares.
+ */
+export declare function ReadImageRow(props: ReadImageRowProps): import("react").ReactNode;
+/**
+ * The read_image row as a plain registrant plugin following the atomic Tool-view
+ * declaration across independent activation and reload lifetimes. Declaring
+ * `tool.call.images` as a child slot authorizes this entry's `renderSlot` to
+ * dispatch the gallery.
+ */
+export declare const readImageToolview: {
+    name: string;
+    inject: string[];
+    /**
+     * Register the read_image row into the Tool-owned keyed view slot.
+     * @param ctx - registrant context (disposal rides ctx.effect inside slots.register).
+     */
+    apply(ctx: Context): void;
+};
+//# sourceMappingURL=read-image-row.d.ts.map

package/lib/types/client/tool/toolviews/read-row.d.ts

@@ -5,7 +5,7 @@ type ReadRowProps = ToolCallViewProps & PropsLocale<'conversation'>;
 /**
  * Lets users expand a completed read result and open its reported path.
  */
-export declare function ReadRow({ toolName, block, cwd, home, openFile, inspect, t }: ReadRowProps): import("react").JSX.Element;
+export declare function ReadRow(props: ReadRowProps): import("react").ReactNode;
 /** Registers the read tool's conversation row. */
 export declare const readToolview: {
     name: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@prettier-ai/dsh-client-ui-tool",
   "description": "Client Tool call-tree renderer and keyed per-tool presentation slot",
-  "version": "0.1.2-alpha.5",
+  "version": "0.1.3-alpha.1",
   "publishConfig": {
     "access": "public"
   },
@@ -48,19 +48,20 @@
     "@types/react": "~18.3.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "@prettier-ai/dsh-api-remotes": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-connection": "^0.1.3-alpha.1",
     "@prettier-ai/cordis": "^4.0.2",
-    "@prettier-ai/dsh-api-remotes": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-locale": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-connection": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-ui-conversation": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-test-runtime": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-ui-primitives": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-ui-slots": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-api-workspace-controller": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-ui-renderer": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-util-workspace-path": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-ui-chat": "^0.1.2-alpha.5",
-    "@prettier-ai/dsh-client-ui-session": "^0.1.2-alpha.5"
+    "@prettier-ai/dsh-client-locale": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-ui-conversation": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-test-runtime": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-ui-slots": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-ui-chat": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-api-workspace-controller": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-ui-renderer": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-ui-primitives": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-attachment": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-client-ui-session": "^0.1.3-alpha.1",
+    "@prettier-ai/dsh-util-workspace-path": "^0.1.3-alpha.1"
   },
   "files": [
     "lib/index.js",