npm - @nextclaw/ui - Versions diffs - 0.11.20 → 0.11.21 - Mend

@nextclaw/ui 0.11.20 → 0.11.21

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

Files changed (72) hide show

package/dist/index.html CHANGED Viewed

@@ -6,24 +6,24 @@
   <link rel="icon" type="image/svg+xml" href="/logo.svg" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>NextClaw</title>
-  <script type="module" crossorigin src="/assets/index-B0DzQqwv.js"></script>
-  <link rel="modulepreload" crossorigin href="/assets/i18n-CXBpwAwA.js">
-  <link rel="modulepreload" crossorigin href="/assets/chunk-JZWAC4HX-C1vpvW4r.js">
-  <link rel="modulepreload" crossorigin href="/assets/dist-Dii9v3X9.js">
-  <link rel="modulepreload" crossorigin href="/assets/createLucideIcon-CcR5wVoU.js">
-  <link rel="modulepreload" crossorigin href="/assets/select-Cz82gl01.js">
-  <link rel="modulepreload" crossorigin href="/assets/dist-BMlnBah3.js">
-  <link rel="modulepreload" crossorigin href="/assets/react-ji6GGP_j.js">
-  <link rel="modulepreload" crossorigin href="/assets/useMutation-s2sn2yzh.js">
-  <link rel="modulepreload" crossorigin href="/assets/book-open-DzSduAaw.js">
-  <link rel="modulepreload" crossorigin href="/assets/external-link-CnSDrvJE.js">
-  <link rel="modulepreload" crossorigin href="/assets/plus-C9cYVbL-.js">
-  <link rel="modulepreload" crossorigin href="/assets/search-sl1OeJFl.js">
-  <link rel="modulepreload" crossorigin href="/assets/x-MIimOGs6.js">
-  <link rel="modulepreload" crossorigin href="/assets/DocBrowserContext-BcZRBsCg.js">
-  <link rel="modulepreload" crossorigin href="/assets/DocBrowser-DKkE3Y4I.js">
-  <link rel="modulepreload" crossorigin href="/assets/config-Df97LeLR.js">
-  <link rel="stylesheet" crossorigin href="/assets/index-BahpXJg8.css">
+  <script type="module" crossorigin src="/assets/index-DvKS3L9j.js"></script>
+  <link rel="modulepreload" crossorigin href="/assets/i18n-CSytxMFI.js">
+  <link rel="modulepreload" crossorigin href="/assets/chunk-JZWAC4HX-B-4B29RN.js">
+  <link rel="modulepreload" crossorigin href="/assets/dist-pCfWPG1A.js">
+  <link rel="modulepreload" crossorigin href="/assets/createLucideIcon-DiFAvXmK.js">
+  <link rel="modulepreload" crossorigin href="/assets/select-CT50pzod.js">
+  <link rel="modulepreload" crossorigin href="/assets/dist-kW_O3kyZ.js">
+  <link rel="modulepreload" crossorigin href="/assets/react-BuSP2-8B.js">
+  <link rel="modulepreload" crossorigin href="/assets/useMutation-BzCrO8j-.js">
+  <link rel="modulepreload" crossorigin href="/assets/book-open-B26jGBjY.js">
+  <link rel="modulepreload" crossorigin href="/assets/external-link-D5-p-Gmm.js">
+  <link rel="modulepreload" crossorigin href="/assets/plus-CM9XJ0Tf.js">
+  <link rel="modulepreload" crossorigin href="/assets/search-Ctaw34Kp.js">
+  <link rel="modulepreload" crossorigin href="/assets/x-CHOBE-63.js">
+  <link rel="modulepreload" crossorigin href="/assets/DocBrowserContext-CVJuwCcw.js">
+  <link rel="modulepreload" crossorigin href="/assets/DocBrowser-3y_NHZ71.js">
+  <link rel="modulepreload" crossorigin href="/assets/config-BaC29Qf-.js">
+  <link rel="stylesheet" crossorigin href="/assets/index-CUy6doWo.css">
 </head>
 <body>

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@nextclaw/ui",
-  "version": "0.11.20",
+  "version": "0.11.21",
   "private": false,
   "type": "module",
   "license": "MIT",
@@ -28,11 +28,11 @@
     "tailwind-merge": "^2.5.4",
     "zod": "^3.23.8",
     "zustand": "^5.0.2",
-    "@nextclaw/ncp": "0.4.5",
-    "@nextclaw/agent-chat-ui": "0.2.18",
-    "@nextclaw/ncp-http-agent-client": "0.3.9",
-    "@nextclaw/agent-chat": "0.1.6",
-    "@nextclaw/ncp-react": "0.4.11"
+    "@nextclaw/ncp-react": "0.4.12",
+    "@nextclaw/ncp": "0.4.6",
+    "@nextclaw/ncp-http-agent-client": "0.3.10",
+    "@nextclaw/agent-chat-ui": "0.2.19",
+    "@nextclaw/agent-chat": "0.1.6"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.0",

package/src/components/chat/adapters/chat-message-part.adapter.ts CHANGED Viewed

@@ -10,6 +10,7 @@ import {
   buildRenderableText,
   buildTextPart,
 } from "@/components/chat/adapters/chat-message-inline-content.adapter";
+import { buildFileOperationCardData } from "@/components/chat/adapters/chat-message.file-operation-card";
 import { buildSubagentToolCard } from "@/components/chat/adapters/chat-message.subagent-tool-card";
 import type {
   ChatMessagePartViewModel,
@@ -27,6 +28,7 @@ export type ChatMessageAdapterTexts = {
   reasoningLabel: string;
   toolCallLabel: string;
   toolResultLabel: string;
+  toolInputLabel: string;
   toolNoOutputLabel: string;
   toolOutputLabel: string;
   toolStatusPreparingLabel: string;
@@ -77,6 +79,8 @@ export type ChatMessagePartSource =
 type ToolCardViewSource = ToolCard & {
   statusTone: ChatToolPartViewModel["statusTone"];
   statusLabel: string;
+  fileOperation?: ChatToolPartViewModel["fileOperation"];
+  outputData?: unknown;
 };
 type ChatMessagePartAdapterParams = {
@@ -112,6 +116,21 @@ function readOptionalNumber(value: unknown): number | null {
   return Number.isFinite(parsed) && parsed >= 0 ? parsed : null;
 }
+function isTerminalResultRecord(value: unknown): value is Record<string, unknown> {
+  if (!isRecord(value)) {
+    return false;
+  }
+  return (
+    "command" in value ||
+    "workingDir" in value ||
+    "exitCode" in value ||
+    "stdout" in value ||
+    "stderr" in value ||
+    "aggregated_output" in value ||
+    "combinedOutput" in value
+  );
+}
 function extractAssetFileView(
   value: unknown,
   texts: ChatMessageAdapterTexts,
@@ -161,7 +180,12 @@ function buildToolCard(
     kind: toolCard.kind,
     toolName: toolCard.name,
     summary: toolCard.detail,
+    inputLabel: texts.toolInputLabel,
+    input: "input" in toolCard && typeof toolCard.input === "string"
+      ? toolCard.input
+      : undefined,
     output: toolCard.text,
+    outputData: toolCard.outputData,
     hasResult: Boolean(toolCard.hasResult),
     statusTone: toolCard.statusTone,
     statusLabel: toolCard.statusLabel,
@@ -169,6 +193,9 @@ function buildToolCard(
       toolCard.kind === "call" ? texts.toolCallLabel : texts.toolResultLabel,
     outputLabel: texts.toolOutputLabel,
     emptyLabel: texts.toolNoOutputLabel,
+    ...("fileOperation" in toolCard && toolCard.fileOperation
+      ? { fileOperation: toolCard.fileOperation }
+      : {}),
   };
 }
@@ -216,7 +243,7 @@ function resolveToolCardStatus(params: {
       kind: "call",
       hasResult: false,
       statusTone: "running",
-      statusLabel: params.texts.toolStatusPreparingLabel,
+      statusLabel: params.texts.toolStatusRunningLabel,
     };
   }
   return {
@@ -227,6 +254,27 @@ function resolveToolCardStatus(params: {
   };
 }
+function parseStructuredValue(value: unknown): unknown {
+  if (typeof value !== "string") {
+    return value;
+  }
+  const trimmed = value.trim();
+  if (!trimmed.startsWith("{") && !trimmed.startsWith("[")) {
+    return value;
+  }
+  try {
+    return JSON.parse(trimmed) as unknown;
+  } catch {
+    return value;
+  }
+}
+function buildToolInvocationInput(args?: unknown, parsedArgs?: unknown): string | undefined {
+  const source = parsedArgs ?? parseStructuredValue(args);
+  const text = stringifyUnknown(source).trim();
+  return text || undefined;
+}
 function buildReasoningPart(
   part: Extract<ChatMessagePartSource, { type: "reasoning" }>,
   texts: ChatMessageAdapterTexts,
@@ -296,22 +344,45 @@ function buildToolInvocationPart(
     result: invocation.result,
     texts,
   });
-  const detail = summarizeToolArgs(invocation.parsedArgs ?? invocation.args);
+  const fileOperationCardData = buildFileOperationCardData({
+    toolName: invocation.toolName,
+    status: invocation.status,
+    toolCallId: invocation.toolCallId,
+    args: invocation.args,
+    parsedArgs: invocation.parsedArgs,
+    result: invocation.result,
+  });
+  const detail =
+    fileOperationCardData?.summary ??
+    summarizeToolArgs(invocation.parsedArgs ?? invocation.args);
+  const input = fileOperationCardData
+    ? undefined
+    : buildToolInvocationInput(invocation.args, invocation.parsedArgs);
   const rawResult =
     typeof invocation.error === "string" && invocation.error.trim()
       ? invocation.error.trim()
       : invocation.result != null
         ? stringifyUnknown(invocation.result).trim()
         : "";
+  const shouldHideStructuredTerminalJson =
+    !invocation.error && isTerminalResultRecord(invocation.result);
+  const shouldShowRawResult =
+    (!fileOperationCardData?.fileOperation || Boolean(invocation.error)) &&
+    !shouldHideStructuredTerminalJson;
   const card: ToolCardViewSource = {
     kind: statusView.kind,
     name: invocation.toolName,
     detail,
-    text: rawResult || undefined,
+    ...(input ? { input } : {}),
+    text: shouldShowRawResult && rawResult ? rawResult : undefined,
+    outputData: invocation.result,
     callId: invocation.toolCallId || undefined,
     hasResult: statusView.hasResult,
     statusTone: statusView.statusTone,
     statusLabel: statusView.statusLabel,
+    ...(fileOperationCardData?.fileOperation
+      ? { fileOperation: fileOperationCardData.fileOperation }
+      : {}),
   };
   return {
     type: "tool-card",

package/src/components/chat/adapters/chat-message.adapter.test.ts CHANGED Viewed

@@ -17,8 +17,9 @@ const defaultTexts = {
   reasoningLabel: "Reasoning",
   toolCallLabel: "Tool Call",
   toolResultLabel: "Tool Result",
+  toolInputLabel: "Input",
   toolNoOutputLabel: "No output",
-  toolOutputLabel: "View Output",
+  toolOutputLabel: "Output",
   toolStatusPreparingLabel: "Preparing",
   toolStatusRunningLabel: "Running",
   toolStatusCompletedLabel: "Completed",
@@ -88,7 +89,7 @@ it("maps markdown, reasoning, and tool parts into UI view models", () => {
       statusLabel: "Completed",
       statusTone: "success",
       titleLabel: "Tool Result",
-      outputLabel: "View Output",
+      outputLabel: "Output",
     },
   });
 });
@@ -126,7 +127,7 @@ it("maps tool lifecycle statuses into visible card state feedback", () => {
     type: "tool-card",
     card: {
       statusTone: "running",
-      statusLabel: "Preparing",
+      statusLabel: "Running",
       titleLabel: "Tool Call",
     },
   });
@@ -141,6 +142,87 @@ it("maps tool lifecycle statuses into visible card state feedback", () => {
   });
 });
+it("preserves full generic tool args for the expanded body while keeping the header summary short", () => {
+  const adapted = adapt([
+    {
+      id: "assistant-generic-tool-input",
+      role: "assistant",
+      parts: [
+        {
+          type: "tool-invocation",
+          toolInvocation: {
+            status: ToolInvocationStatus.PARTIAL_CALL,
+            toolCallId: "call-generic-input",
+            toolName: "open_url",
+            args: JSON.stringify({
+              url: "https://example.com/really/long/path",
+              headers: {
+                authorization: "Bearer secret-token",
+              },
+              mode: "reader",
+            }),
+          },
+        },
+      ],
+    },
+  ] as unknown as ChatMessageSource[]);
+  expect(adapted[0]?.parts[0]).toMatchObject({
+    type: "tool-card",
+    card: {
+      toolName: "open_url",
+      statusTone: "running",
+      summary: "url: https://example.com/really/long/path",
+      input: `{
+  "url": "https://example.com/really/long/path",
+  "headers": {
+    "authorization": "Bearer secret-token"
+  },
+  "mode": "reader"
+}`,
+    },
+  });
+});
+it("keeps structured terminal results as structured data instead of raw json output", () => {
+  const terminalResult = {
+    status: "completed",
+    command: "python3 -m http.server 8765",
+    aggregated_output: "",
+    exit_code: 0,
+  };
+  const adapted = adapt([
+    {
+      id: "assistant-terminal-result",
+      role: "assistant",
+      parts: [
+        {
+          type: "tool-invocation",
+          toolInvocation: {
+            status: ToolInvocationStatus.RESULT,
+            toolCallId: "call-terminal-result",
+            toolName: "command_execution",
+            args: '{"command":"python3 -m http.server 8765"}',
+            result: terminalResult,
+          },
+        },
+      ],
+    },
+  ] as unknown as ChatMessageSource[]);
+  expect(adapted[0]?.parts[0]).toMatchObject({
+    type: "tool-card",
+    card: {
+      toolName: "command_execution",
+      summary: "command: python3 -m http.server 8765",
+      output: undefined,
+      outputData: terminalResult,
+      statusTone: "success",
+    },
+  });
+});
 it("renders spawn tool cards from structured subagent status updates", () => {
   const adapted = adapt([
     {
@@ -377,3 +459,239 @@ it("renders asset tool results as previewable files", () => {
     },
   });
 });
+it("builds edit-file previews from structured args before the tool finishes", () => {
+  const adapted = adapt([
+    {
+      id: "assistant-edit-preview",
+      role: "assistant",
+      parts: [
+        {
+          type: "tool-invocation",
+          toolInvocation: {
+            status: ToolInvocationStatus.CALL,
+            toolCallId: "edit-call-1",
+            toolName: "edit_file",
+            args: JSON.stringify({
+              path: "src/app.ts",
+              oldText: "const color = 'red';",
+              newText: "const color = 'blue';",
+            }),
+            parsedArgs: {
+              path: "src/app.ts",
+              oldText: "const color = 'red';",
+              newText: "const color = 'blue';",
+            },
+          },
+        },
+      ],
+    },
+  ] as unknown as ChatMessageSource[]);
+  expect(adapted[0]?.parts[0]).toMatchObject({
+    type: "tool-card",
+    card: {
+      toolName: "edit_file",
+      summary: "src/app.ts",
+      statusTone: "running",
+      fileOperation: {
+        blocks: [
+          {
+            path: "src/app.ts",
+            lines: [
+              {
+                kind: "remove",
+                text: "const color = 'red';",
+              },
+              {
+                kind: "add",
+                text: "const color = 'blue';",
+              },
+            ],
+          },
+        ],
+      },
+    },
+  });
+});
+it("builds write-file previews from partial native args before the JSON is complete", () => {
+  const adapted = adapt([
+    {
+      id: "assistant-write-preview",
+      role: "assistant",
+      parts: [
+        {
+          type: "tool-invocation",
+          toolInvocation: {
+            status: ToolInvocationStatus.PARTIAL_CALL,
+            toolCallId: "write-call-1",
+            toolName: "write_file",
+            args: '{"path":"games/snake.html","content":"<!DOCTYPE html>\\n<canvas id=\\"game\\"></canvas>\\n<script>const score = 1;',
+          },
+        },
+      ],
+    },
+  ] as unknown as ChatMessageSource[]);
+  expect(adapted[0]?.parts[0]).toMatchObject({
+    type: "tool-card",
+    card: {
+      toolName: "write_file",
+      summary: "games/snake.html",
+      statusTone: "running",
+      statusLabel: "Running",
+      fileOperation: {
+        blocks: [
+          {
+            display: "preview",
+            path: "games/snake.html",
+            lines: expect.arrayContaining([
+              expect.objectContaining({
+                kind: "add",
+                text: "<!DOCTYPE html>",
+              }),
+              expect.objectContaining({
+                kind: "add",
+                text: '<canvas id="game"></canvas>',
+              }),
+            ]),
+          },
+        ],
+      },
+    },
+  });
+});
+it("keeps completed write-file cards in preview mode instead of falling back to raw byte summaries", () => {
+  const adapted = adapt([
+    {
+      id: "assistant-write-result",
+      role: "assistant",
+      parts: [
+        {
+          type: "tool-invocation",
+          toolInvocation: {
+            status: ToolInvocationStatus.RESULT,
+            toolCallId: "write-result-1",
+            toolName: "write_file",
+            args: JSON.stringify({
+              path: "games/snake.html",
+              content: "<!DOCTYPE html>\n<canvas id=\"game\"></canvas>",
+            }),
+            result: "Wrote 3906 bytes to games/snake.html",
+          },
+        },
+      ],
+    },
+  ] as unknown as ChatMessageSource[]);
+  expect(adapted[0]?.parts[0]).toMatchObject({
+    type: "tool-card",
+    card: {
+      toolName: "write_file",
+      summary: "games/snake.html",
+      statusTone: "success",
+      fileOperation: {
+        blocks: [
+          {
+            display: "preview",
+            path: "games/snake.html",
+            lines: [
+              {
+                kind: "add",
+                text: "<!DOCTYPE html>",
+                newLineNumber: 1,
+              },
+              {
+                kind: "add",
+                text: "<canvas id=\"game\"></canvas>",
+                newLineNumber: 2,
+              },
+            ],
+          },
+        ],
+      },
+    },
+  });
+  expect(adapted[0]?.parts[0]).not.toMatchObject({
+    type: "tool-card",
+    card: {
+      output: "Wrote 3906 bytes to games/snake.html",
+    },
+  });
+});
+it("renders codex file_change results as structured diff previews", () => {
+  const adapted = adapt([
+    {
+      id: "assistant-file-change",
+      role: "assistant",
+      parts: [
+        {
+          type: "tool-invocation",
+          toolInvocation: {
+            status: ToolInvocationStatus.RESULT,
+            toolCallId: "file-change-1",
+            toolName: "file_change",
+            args: JSON.stringify({
+              changes: [
+                {
+                  path: "src/main.ts",
+                  diff: [
+                    "--- a/src/main.ts",
+                    "+++ b/src/main.ts",
+                    "@@",
+                    "-console.log('old');",
+                    "+console.log('new');",
+                  ].join("\n"),
+                },
+              ],
+            }),
+            result: {
+              status: "completed",
+              changes: [
+                {
+                  path: "src/main.ts",
+                  diff: [
+                    "--- a/src/main.ts",
+                    "+++ b/src/main.ts",
+                    "@@",
+                    "-console.log('old');",
+                    "+console.log('new');",
+                  ].join("\n"),
+                },
+              ],
+            },
+          },
+        },
+      ],
+    },
+  ] as unknown as ChatMessageSource[]);
+  expect(adapted[0]?.parts[0]).toMatchObject({
+    type: "tool-card",
+    card: {
+      toolName: "file_change",
+      summary: "src/main.ts",
+      statusTone: "success",
+      fileOperation: {
+        blocks: [
+          {
+            path: "src/main.ts",
+            lines: [
+              {
+                kind: "remove",
+                text: "console.log('old');",
+              },
+              {
+                kind: "add",
+                text: "console.log('new');",
+              },
+            ],
+          },
+        ],
+      },
+    },
+  });
+});