@apteva/apteva-kit 0.1.81 → 0.1.83

package/dist/index.mjs

@@ -691,7 +691,7 @@ function parseWidgetsFromText(text) {
       const trimmedJson = jsonContent.trim();
       const parsed = JSON.parse(trimmedJson);
       const widgetId = `widget-${widgetType}-${simpleHash(trimmedJson)}`;
-      const { meta, actions, ...props } = parsed;
+      const { metadata, actions, ...props } = parsed;
       segments.push({
         type: "widget",
         widget: {
@@ -699,7 +699,7 @@ function parseWidgetsFromText(text) {
           id: widgetId,
           props,
           ...actions && { actions },
-          ...meta && { meta }
+          ...metadata && { metadata }
         }
       });
       hasWidgets = true;
@@ -739,8 +739,8 @@ var WIDGET_DEFINITIONS = {
     example: '@ui:card[{"title": "Summary", "description": "Details here"}]'
   },
   list: {
-    schema: "items: [{id, title, subtitle?, description?, image?, meta?: {any extra data}}], actions?: [{type, label}] - meta is sent as action payload when clicked",
-    example: '@ui:list[{"items": [{"id": "1", "title": "Item", "subtitle": "Info", "meta": {"key": "value"}}]}]'
+    schema: "items: [{id, title, subtitle?, description?, image?, metadata?: {any extra data}}], actions?: [{type, label}] - metadata is sent as action payload when clicked",
+    example: '@ui:list[{"items": [{"id": "1", "title": "Item", "subtitle": "Info", "metadata": {"key": "value"}}]}]'
   },
   button_group: {
     schema: "buttons: [{id, label, variant?}] - Use for standalone buttons only, NOT for form submits",
@@ -772,8 +772,6 @@ SYNTAX: @ui:type[{json}] - MUST use SQUARE BRACKETS [] around the JSON object.
 CORRECT: @ui:list[{"items": [...]}]
 WRONG: @ui:list{"items": [...]} (missing square brackets)
 
-"meta" field (at root level, NOT inside items) holds extended data captured by UI.
-
 `;
   for (const type of widgets) {
     const def = WIDGET_DEFINITIONS[type];
@@ -782,14 +780,14 @@ WRONG: @ui:list{"items": [...]} (missing square brackets)
 `;
   }
   context += `
-Per-item "meta" is sent as payload on action click.
+Per-item "metadata" is sent as payload on action click.
 `;
   return context;
 }
 function generateCompactWidgetContext(enabledWidgets) {
   const widgets = enabledWidgets || ALL_WIDGET_TYPES;
   return `
-Widgets: @ui:type[{json}] - MUST use square brackets []. Example: @ui:list[{"items": [...]}]. Types: ${widgets.join(", ")}. Add "meta" at root for extended data.
+Widgets: @ui:type[{json}] - MUST use square brackets []. Example: @ui:list[{"items": [...]}]. Types: ${widgets.join(", ")}. Per-item "metadata" is sent as action payload.
 `;
 }
 
@@ -872,7 +870,7 @@ function List({ widget, onAction }) {
               {
                 onClick: () => onAction?.({
                   type: action.type,
-                  payload: item.meta || item,
+                  payload: item.metadata || item,
                   widgetId: widget.id,
                   timestamp: /* @__PURE__ */ new Date()
                 }),
@@ -1522,8 +1520,8 @@ function MarkdownContent({ content, className = "" }) {
 }
 
 // src/components/Chat/ToolCall.tsx
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
-function ToolCall({ name, status, isReceiving = false, inputLength = 0 }) {
+import { Fragment, jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+function ToolCall({ name, status, isReceiving = false, inputLength = 0, streamOutput }) {
   if (status === "preparing") {
     return /* @__PURE__ */ jsxs8("div", { className: "apteva-tool-card apteva-tool-card-preparing", children: [
       /* @__PURE__ */ jsxs8("svg", { className: "apteva-tool-icon apteva-tool-icon-spin", fill: "none", viewBox: "0 0 24 24", children: [
@@ -1544,11 +1542,16 @@ function ToolCall({ name, status, isReceiving = false, inputLength = 0 }) {
       ] }),
       /* @__PURE__ */ jsxs8("span", { className: "apteva-tool-label", children: [
         /* @__PURE__ */ jsx11("strong", { children: name }),
-        /* @__PURE__ */ jsx11("span", { className: "apteva-tool-status-text", children: " running" }),
-        /* @__PURE__ */ jsxs8("span", { className: "apteva-tool-dots", children: [
-          /* @__PURE__ */ jsx11("span", { children: "." }),
-          /* @__PURE__ */ jsx11("span", { children: "." }),
-          /* @__PURE__ */ jsx11("span", { children: "." })
+        streamOutput ? /* @__PURE__ */ jsxs8("span", { className: "apteva-tool-stream-output", children: [
+          " ",
+          streamOutput
+        ] }) : /* @__PURE__ */ jsxs8(Fragment, { children: [
+          /* @__PURE__ */ jsx11("span", { className: "apteva-tool-status-text", children: " running" }),
+          /* @__PURE__ */ jsxs8("span", { className: "apteva-tool-dots", children: [
+            /* @__PURE__ */ jsx11("span", { children: "." }),
+            /* @__PURE__ */ jsx11("span", { children: "." }),
+            /* @__PURE__ */ jsx11("span", { children: "." })
+          ] })
         ] })
       ] })
     ] });
@@ -1766,7 +1769,8 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
               name: segment.name,
               status: segment.status || (segment.result !== void 0 ? "completed" : "running"),
               isReceiving: segment.isReceiving,
-              inputLength: segment.inputLength
+              inputLength: segment.inputLength,
+              streamOutput: segment.streamOutput
             }
           ) }, segment.id)
         );
@@ -2001,7 +2005,7 @@ function MessageList({
 
 // src/components/Chat/Composer.tsx
 import { useState as useState4, useRef as useRef5 } from "react";
-import { Fragment, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
 function Composer({ onSendMessage, placeholder = "Type a message...", disabled = false, isLoading = false, onStop, onFileUpload, onSwitchMode }) {
   const [text, setText] = useState4("");
   const [showMenu, setShowMenu] = useState4(false);
@@ -2122,7 +2126,7 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
             children: /* @__PURE__ */ jsx15("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx15("path", { d: "M10 5v10M5 10h10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
           }
         ),
-        showMenu && /* @__PURE__ */ jsxs11(Fragment, { children: [
+        showMenu && /* @__PURE__ */ jsxs11(Fragment2, { children: [
           /* @__PURE__ */ jsx15("div", { className: "fixed inset-0 z-[9998]", onClick: () => setShowMenu(false) }),
           /* @__PURE__ */ jsxs11(
             "div",
@@ -2214,7 +2218,7 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
 
 // src/components/Chat/CommandComposer.tsx
 import { useState as useState5, useRef as useRef6 } from "react";
-import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
 function CommandComposer({
   onExecute,
   state,
@@ -2363,7 +2367,7 @@ function CommandComposer({
                   children: /* @__PURE__ */ jsx16("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx16("path", { d: "M10 5v10M5 10h10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) })
                 }
               ),
-              showMenu && /* @__PURE__ */ jsxs12(Fragment2, { children: [
+              showMenu && /* @__PURE__ */ jsxs12(Fragment3, { children: [
                 /* @__PURE__ */ jsx16("div", { className: "fixed inset-0 z-[9998]", onClick: () => setShowMenu(false) }),
                 /* @__PURE__ */ jsxs12(
                   "div",
@@ -2459,7 +2463,7 @@ function CommandComposer({
                 state === "error" && "!text-red-600 dark:!text-red-400",
                 state === "plan-pending" && "!text-amber-700 dark:!text-amber-300"
               ),
-              children: isToolCall ? /* @__PURE__ */ jsxs12(Fragment2, { children: [
+              children: isToolCall ? /* @__PURE__ */ jsxs12(Fragment3, { children: [
                 /* @__PURE__ */ jsx16("span", { className: "font-mono", children: displayContent }),
                 /* @__PURE__ */ jsx16("span", { className: "text-neutral-400 dark:text-neutral-500", children: "Running..." })
               ] }) : displayContent
@@ -2482,7 +2486,7 @@ function CommandComposer({
                 children: "Modify"
               }
             )
-          ] }) : /* @__PURE__ */ jsxs12(Fragment2, { children: [
+          ] }) : /* @__PURE__ */ jsxs12(Fragment3, { children: [
             state === "loading" && onStop && /* @__PURE__ */ jsx16(
               "button",
               {
@@ -2720,7 +2724,7 @@ var AptevaClient = class {
 var aptevaClient = new AptevaClient();
 
 // src/components/Chat/Chat.tsx
-import { Fragment as Fragment3, jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
 var Chat = forwardRef(function Chat2({
   agentId,
   threadId,
@@ -2988,6 +2992,15 @@ ${widgetContext}` : widgetContext;
                   }
                 }
                 break;
+              case "tool_stream":
+                if (chunk.tool_id && chunk.event === "chunk" && chunk.content) {
+                  const toolSegment = contentSegments.find((s) => s.type === "tool" && s.id === chunk.tool_id);
+                  if (toolSegment) {
+                    toolSegment.streamOutput = (toolSegment.streamOutput || "") + chunk.content;
+                    updateMessage();
+                  }
+                }
+                break;
               case "tool_result":
                 if (chunk.tool_id) {
                   const toolSegment = contentSegments.find((s) => s.type === "tool" && s.id === chunk.tool_id);
@@ -3315,7 +3328,7 @@ ${planToExecute}`;
         isLoading ? chatToolName ? "apteva-chat-status-tool" : "apteva-chat-status-thinking" : "apteva-chat-status-ready"
       ), children: isLoading ? chatToolName ? `Using ${chatToolName}...` : "Thinking..." : "Ready" })
     ] }) }),
-    mode === "chat" && /* @__PURE__ */ jsxs13(Fragment3, { children: [
+    mode === "chat" && /* @__PURE__ */ jsxs13(Fragment4, { children: [
       /* @__PURE__ */ jsx17(
         MessageList,
         {
@@ -3388,7 +3401,7 @@ import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
 
 // src/components/Command/Command.tsx
 import React, { useState as useState8, useEffect as useEffect7 } from "react";
-import { Fragment as Fragment4, jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
 function Command({
   agentId,
   command: initialCommand,
@@ -3854,7 +3867,7 @@ ${planToExecute}`;
       style: { minHeight: isCompact ? "auto" : "180px" },
       children: [
         /* @__PURE__ */ jsxs15("div", { className: cn("flex-1 flex", isCompact ? "flex-row items-center p-3 gap-3" : "flex-col p-4"), children: [
-          state === "idle" && allowInput && !isCompact && /* @__PURE__ */ jsxs15(Fragment4, { children: [
+          state === "idle" && allowInput && !isCompact && /* @__PURE__ */ jsxs15(Fragment5, { children: [
             /* @__PURE__ */ jsx19(
               "textarea",
               {
@@ -3894,7 +3907,7 @@ ${planToExecute}`;
               )
             ] }, index)) })
           ] }),
-          state === "idle" && allowInput && isCompact && /* @__PURE__ */ jsxs15(Fragment4, { children: [
+          state === "idle" && allowInput && isCompact && /* @__PURE__ */ jsxs15(Fragment5, { children: [
             /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-0.5 flex-shrink-0", children: [
               enableFileUpload && /* @__PURE__ */ jsx19(
                 "button",
@@ -4034,7 +4047,7 @@ ${planToExecute}`;
               ] })
             ] })
           ] }),
-          state === "loading" && isCompact && /* @__PURE__ */ jsxs15(Fragment4, { children: [
+          state === "loading" && isCompact && /* @__PURE__ */ jsxs15(Fragment5, { children: [
             /* @__PURE__ */ jsxs15("div", { className: "flex-1 flex items-center gap-3 py-1", children: [
               /* @__PURE__ */ jsx19("div", { className: "w-4 h-4 border-2 border-neutral-300 border-t-blue-500 rounded-full animate-spin" }),
               /* @__PURE__ */ jsx19("div", { className: "text-neutral-600 dark:text-neutral-400 text-sm truncate", children: enableStreaming && streamedContent ? streamedContent : loadingText })
@@ -4082,7 +4095,7 @@ ${planToExecute}`;
               )
             ] })
           ] }) }),
-          state === "plan-pending" && isCompact && /* @__PURE__ */ jsxs15(Fragment4, { children: [
+          state === "plan-pending" && isCompact && /* @__PURE__ */ jsxs15(Fragment5, { children: [
             /* @__PURE__ */ jsxs15(
               "button",
               {
@@ -4156,7 +4169,7 @@ ${planToExecute}`;
               widget.id
             )) })
           ] }) }),
-          state === "success" && result && isCompact && /* @__PURE__ */ jsxs15(Fragment4, { children: [
+          state === "success" && result && isCompact && /* @__PURE__ */ jsxs15(Fragment5, { children: [
             /* @__PURE__ */ jsxs15(
               "div",
               {
@@ -4193,7 +4206,7 @@ ${planToExecute}`;
           ] })
         ] }),
         !isCompact && /* @__PURE__ */ jsxs15("div", { className: "p-3 flex items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsx19("div", { className: "flex items-center gap-1", children: state === "idle" && allowInput && /* @__PURE__ */ jsxs15(Fragment4, { children: [
+          /* @__PURE__ */ jsx19("div", { className: "flex items-center gap-1", children: state === "idle" && allowInput && /* @__PURE__ */ jsxs15(Fragment5, { children: [
             enableFileUpload && /* @__PURE__ */ jsx19(
               "button",
               {