@apteva/apteva-kit 0.1.87 → 0.1.89

package/dist/index.js

@@ -761,6 +761,10 @@ var WIDGET_DEFINITIONS = {
   chart: {
     schema: "chartType: line|bar|pie, data: {labels, datasets}",
     example: '@ui:chart[{"chartType": "bar", "data": {"labels": ["A"], "datasets": [{"label": "X", "data": [10]}]}}]'
+  },
+  flow: {
+    schema: "title, subtitle?, icon?: research|schedule|analyze|deploy, steps: [{id, label, type?: time|agent|email|slack|build|test|deploy, status?: pending|active|completed|error}], actions?: [{type, label}] - Horizontal pipeline with action button. Use @label for agents.",
+    example: '@ui:flow[{"title": "Deploy to Production", "icon": "deploy", "steps": [{"id": "1", "label": "Test"}, {"id": "2", "label": "Build"}, {"id": "3", "label": "Deploy"}], "actions": [{"type": "run", "label": "Run"}]}]'
   }
 };
 var ALL_WIDGET_TYPES = Object.keys(WIDGET_DEFINITIONS);
@@ -1222,6 +1226,153 @@ function Image({ widget }) {
   ] });
 }
 
+// src/components/Widgets/widget-library/Flow.tsx
+
+function StepIcon({ type, status }) {
+  if (status === "completed") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5 text-emerald-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M5 13l4 4L19 7" }) });
+  }
+  if (status === "error") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5 text-red-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M6 18L18 6M6 6l12 12" }) });
+  }
+  if (status === "active") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-3 h-3 rounded-full bg-blue-400 animate-pulse" });
+  }
+  if (type === "time" || type === "schedule") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) });
+  }
+  if (type === "agent" || _optionalChain([type, 'optionalAccess', _28 => _28.startsWith, 'call', _29 => _29("@")])) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z" }) });
+  }
+  if (type === "email" || type === "mail") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" }) });
+  }
+  if (type === "slack" || type === "message") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" }) });
+  }
+  if (type === "build" || type === "compile") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10" }) });
+  }
+  if (type === "test") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4" }) });
+  }
+  if (type === "deploy" || type === "rocket") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 10V3L4 14h7v7l9-11h-7z" }) });
+  }
+  if (type === "push" || type === "upload") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" }) });
+  }
+  if (type === "generate" || type === "create" || type === "document") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" }) });
+  }
+  if (type === "review" || type === "check") {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" })
+    ] });
+  }
+  if (type === "analyze" || type === "research") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3.5 h-3.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" }) });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-2.5 h-2.5 rounded-full bg-current opacity-60" });
+}
+function HeaderIcon({ icon }) {
+  const baseClass = "w-5 h-5";
+  if (icon === "research" || icon === "multi-agent") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-8 h-8 rounded-lg bg-purple-500/20 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: `${baseClass} text-purple-400`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 10V3L4 14h7v7l9-11h-7z" }) }) });
+  }
+  if (icon === "schedule" || icon === "report") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-8 h-8 rounded-lg bg-amber-500/20 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: `${baseClass} text-amber-400`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) }) });
+  }
+  if (icon === "analyze" || icon === "analysis") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-8 h-8 rounded-lg bg-cyan-500/20 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: `${baseClass} text-cyan-400`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" }) }) });
+  }
+  if (icon === "deploy" || icon === "rocket") {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-8 h-8 rounded-lg bg-blue-500/20 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: `${baseClass} text-blue-400`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 10V3L4 14h7v7l9-11h-7z" }) }) });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-8 h-8 rounded-lg bg-blue-500/20 flex items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: `${baseClass} text-blue-400`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" }) }) });
+}
+function Chevron() {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3 h-3 text-neutral-500 flex-shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) });
+}
+function Flow({ widget, onAction }) {
+  const { title, subtitle, icon, steps, actions } = widget.props;
+  const handleAction = (actionType) => {
+    _optionalChain([onAction, 'optionalCall', _30 => _30({
+      type: actionType,
+      payload: { steps, title },
+      widgetId: widget.id,
+      timestamp: /* @__PURE__ */ new Date()
+    })]);
+  };
+  const handleDismiss = () => {
+    _optionalChain([onAction, 'optionalCall', _31 => _31({
+      type: "dismiss",
+      payload: { title },
+      widgetId: widget.id,
+      timestamp: /* @__PURE__ */ new Date()
+    })]);
+  };
+  const primaryAction = _optionalChain([widget, 'access', _32 => _32.actions, 'optionalAccess', _33 => _33[0]]) || _optionalChain([actions, 'optionalAccess', _34 => _34[0]]);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "rounded-xl bg-neutral-900 border border-neutral-800 overflow-hidden", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "px-4 py-3 flex items-center gap-3", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, HeaderIcon, { icon }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "font-semibold text-sm text-white truncate", children: title }),
+        subtitle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-xs text-neutral-400 truncate", children: subtitle })
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "button",
+          {
+            onClick: handleDismiss,
+            className: "p-1.5 text-neutral-500 hover:text-neutral-300 transition-colors",
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+          }
+        ),
+        primaryAction && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          "button",
+          {
+            onClick: () => handleAction(primaryAction.type),
+            className: "px-3 py-1.5 bg-blue-600 hover:bg-blue-500 text-white text-xs font-medium rounded-lg flex items-center gap-1.5 transition-colors",
+            children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-3 h-3", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M8 5v14l11-7z" }) }),
+              primaryAction.label
+            ]
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "px-4 pb-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex flex-wrap items-center gap-2", children: steps.map((step, index) => {
+      const isLast = index === steps.length - 1;
+      const isActive = step.status === "active";
+      const isCompleted = step.status === "completed";
+      const isError = step.status === "error";
+      const isSkipped = step.status === "skipped";
+      const label = step.label;
+      let stepType = step.type;
+      if (!stepType) {
+        if (label.startsWith("@")) stepType = "agent";
+        else if (label.toLowerCase().includes("am") || label.toLowerCase().includes("pm") || /^\d/.test(label)) stepType = "time";
+        else if (["test", "build", "push", "deploy", "email", "slack", "generate", "review", "analyze"].includes(label.toLowerCase())) {
+          stepType = label.toLowerCase();
+        }
+      }
+      const pillClasses = `
+              inline-flex items-center gap-1.5 px-2.5 py-1.5 rounded-full text-xs font-medium transition-colors
+              ${isActive ? "bg-blue-500/20 text-blue-300 ring-1 ring-blue-500/50" : isCompleted ? "bg-emerald-500/15 text-emerald-300" : isError ? "bg-red-500/15 text-red-300" : isSkipped ? "bg-neutral-700/50 text-neutral-500 line-through" : "bg-neutral-800 text-neutral-300"}
+            `;
+      return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: pillClasses, children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StepIcon, { type: stepType, status: step.status }),
+          label
+        ] }),
+        !isLast && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Chevron, {})
+      ] }, step.id);
+    }) }) })
+  ] });
+}
+
 // src/components/Widgets/WidgetRenderer.tsx
 
 function WidgetRenderer({ widget, onAction }) {
@@ -1241,6 +1392,8 @@ function WidgetRenderer({ widget, onAction }) {
         return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Form, { widget, onAction });
       case "image":
         return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Image, { widget });
+      case "flow":
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Flow, { widget });
       default:
         return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "p-4 border border-yellow-300 bg-yellow-50 rounded-lg", children: [
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "p", { className: "text-sm text-yellow-800", children: [
@@ -1267,7 +1420,7 @@ function Widgets({
 }) {
   _react.useEffect.call(void 0, () => {
     widgets.forEach((widget) => {
-      _optionalChain([onWidgetMount, 'optionalCall', _28 => _28(widget.id)]);
+      _optionalChain([onWidgetMount, 'optionalCall', _35 => _35(widget.id)]);
     });
   }, [widgets, onWidgetMount]);
   const layoutClasses = {
@@ -1593,8 +1746,8 @@ function ToolCall({ name, status, isReceiving = false, inputLength = 0, streamOu
 
 function Message({ message, onAction, enableWidgets, onWidgetRender }) {
   const isUser = message.role === "user";
-  const contentSegments = _optionalChain([message, 'access', _29 => _29.metadata, 'optionalAccess', _30 => _30.content_segments]);
-  const isStreaming = _optionalChain([message, 'access', _31 => _31.metadata, 'optionalAccess', _32 => _32.isStreaming]) === true;
+  const contentSegments = _optionalChain([message, 'access', _36 => _36.metadata, 'optionalAccess', _37 => _37.content_segments]);
+  const isStreaming = _optionalChain([message, 'access', _38 => _38.metadata, 'optionalAccess', _39 => _39.isStreaming]) === true;
   const hasContent = message.content || contentSegments && contentSegments.length > 0;
   const reportedWidgetsRef = _react.useRef.call(void 0, /* @__PURE__ */ new Set());
   const parsedWidgets = _react.useMemo.call(void 0, () => {
@@ -1674,7 +1827,7 @@ function Message({ message, onAction, enableWidgets, onWidgetRender }) {
     }
     return elements.length > 0 ? elements : null;
   };
-  const attachments = _optionalChain([message, 'access', _33 => _33.metadata, 'optionalAccess', _34 => _34.attachments]) || [];
+  const attachments = _optionalChain([message, 'access', _40 => _40.metadata, 'optionalAccess', _41 => _41.attachments]) || [];
   const hasAttachments = attachments.length > 0;
   const renderAttachments = () => {
     if (!hasAttachments) return null;
@@ -2081,7 +2234,7 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
         setFileError(errors.join(", "));
         setTimeout(() => setFileError(null), 5e3);
       }
-      _optionalChain([onFileUpload, 'optionalCall', _35 => _35(e.target.files)]);
+      _optionalChain([onFileUpload, 'optionalCall', _42 => _42(e.target.files)]);
       setShowMenu(false);
       e.target.value = "";
     }
@@ -2151,15 +2304,15 @@ function Composer({ onSendMessage, placeholder = "Type a message...", disabled =
             {
               className: "apteva-composer-menu fixed bg-neutral-800 dark:bg-neutral-800 rounded-xl shadow-lg overflow-hidden z-[9999] min-w-[200px]",
               style: {
-                left: _nullishCoalesce(_optionalChain([menuButtonRef, 'access', _36 => _36.current, 'optionalAccess', _37 => _37.getBoundingClientRect, 'call', _38 => _38(), 'access', _39 => _39.left]), () => ( 0)),
-                top: (_nullishCoalesce(_optionalChain([menuButtonRef, 'access', _40 => _40.current, 'optionalAccess', _41 => _41.getBoundingClientRect, 'call', _42 => _42(), 'access', _43 => _43.bottom]), () => ( 0))) + 8
+                left: _nullishCoalesce(_optionalChain([menuButtonRef, 'access', _43 => _43.current, 'optionalAccess', _44 => _44.getBoundingClientRect, 'call', _45 => _45(), 'access', _46 => _46.left]), () => ( 0)),
+                top: (_nullishCoalesce(_optionalChain([menuButtonRef, 'access', _47 => _47.current, 'optionalAccess', _48 => _48.getBoundingClientRect, 'call', _49 => _49(), 'access', _50 => _50.bottom]), () => ( 0))) + 8
               },
               children: [
                 /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
                   "button",
                   {
                     onClick: () => {
-                      _optionalChain([fileInputRef, 'access', _44 => _44.current, 'optionalAccess', _45 => _45.click, 'call', _46 => _46()]);
+                      _optionalChain([fileInputRef, 'access', _51 => _51.current, 'optionalAccess', _52 => _52.click, 'call', _53 => _53()]);
                       setShowMenu(false);
                     },
                     className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-neutral-700 dark:hover:bg-neutral-700 transition-colors !text-white text-left",
@@ -2277,8 +2430,8 @@ function CommandComposer({
     }
   };
   const handleNewCommand = () => {
-    _optionalChain([onReset, 'optionalCall', _47 => _47()]);
-    _optionalChain([inputRef, 'access', _48 => _48.current, 'optionalAccess', _49 => _49.focus, 'call', _50 => _50()]);
+    _optionalChain([onReset, 'optionalCall', _54 => _54()]);
+    _optionalChain([inputRef, 'access', _55 => _55.current, 'optionalAccess', _56 => _56.focus, 'call', _57 => _57()]);
   };
   const handleInputChange = (value) => {
     setInput(value);
@@ -2392,15 +2545,15 @@ function CommandComposer({
                   {
                     className: "apteva-composer-menu fixed bg-neutral-800 dark:bg-neutral-800 rounded-xl shadow-lg overflow-hidden z-[9999] min-w-[200px]",
                     style: {
-                      left: _nullishCoalesce(_optionalChain([menuButtonRef, 'access', _51 => _51.current, 'optionalAccess', _52 => _52.getBoundingClientRect, 'call', _53 => _53(), 'access', _54 => _54.left]), () => ( 0)),
-                      top: (_nullishCoalesce(_optionalChain([menuButtonRef, 'access', _55 => _55.current, 'optionalAccess', _56 => _56.getBoundingClientRect, 'call', _57 => _57(), 'access', _58 => _58.bottom]), () => ( 0))) + 8
+                      left: _nullishCoalesce(_optionalChain([menuButtonRef, 'access', _58 => _58.current, 'optionalAccess', _59 => _59.getBoundingClientRect, 'call', _60 => _60(), 'access', _61 => _61.left]), () => ( 0)),
+                      top: (_nullishCoalesce(_optionalChain([menuButtonRef, 'access', _62 => _62.current, 'optionalAccess', _63 => _63.getBoundingClientRect, 'call', _64 => _64(), 'access', _65 => _65.bottom]), () => ( 0))) + 8
                     },
                     children: [
                       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
                         "button",
                         {
                           onClick: () => {
-                            _optionalChain([fileInputRef, 'access', _59 => _59.current, 'optionalAccess', _60 => _60.click, 'call', _61 => _61()]);
+                            _optionalChain([fileInputRef, 'access', _66 => _66.current, 'optionalAccess', _67 => _67.click, 'call', _68 => _68()]);
                             setShowMenu(false);
                           },
                           className: "w-full flex items-center gap-3 px-4 py-3 hover:bg-neutral-700 dark:hover:bg-neutral-700 transition-colors !text-white text-left",
@@ -2641,7 +2794,7 @@ var AptevaClient = class {
         const error = await response.json().catch(() => ({ error: "Request failed" }));
         throw new Error(error.error || `Request failed with status ${response.status}`);
       }
-      const reader = _optionalChain([response, 'access', _62 => _62.body, 'optionalAccess', _63 => _63.getReader, 'call', _64 => _64()]);
+      const reader = _optionalChain([response, 'access', _69 => _69.body, 'optionalAccess', _70 => _70.getReader, 'call', _71 => _71()]);
       if (!reader) {
         throw new Error("Response body is not readable");
       }
@@ -2659,7 +2812,7 @@ var AptevaClient = class {
           if (line.startsWith("data: ")) {
             const data = line.slice(6);
             if (data === "[DONE]") {
-              _optionalChain([onComplete, 'optionalCall', _65 => _65(threadId)]);
+              _optionalChain([onComplete, 'optionalCall', _72 => _72(threadId)]);
               return;
             }
             try {
@@ -2674,10 +2827,10 @@ var AptevaClient = class {
           }
         }
       }
-      _optionalChain([onComplete, 'optionalCall', _66 => _66(threadId)]);
+      _optionalChain([onComplete, 'optionalCall', _73 => _73(threadId)]);
     } catch (error) {
       const err = error instanceof Error ? error : new Error("Unknown error");
-      _optionalChain([onError, 'optionalCall', _67 => _67(err)]);
+      _optionalChain([onError, 'optionalCall', _74 => _74(err)]);
       throw err;
     }
   }
@@ -2837,7 +2990,7 @@ ${widgetContext}` : widgetContext;
   }, [apiUrl, apiKey]);
   _react.useEffect.call(void 0, () => {
     if (threadId) {
-      _optionalChain([onThreadChange, 'optionalCall', _68 => _68(threadId)]);
+      _optionalChain([onThreadChange, 'optionalCall', _75 => _75(threadId)]);
     }
   }, [threadId, onThreadChange]);
   _react.useEffect.call(void 0, () => {
@@ -2855,7 +3008,7 @@ ${widgetContext}` : widgetContext;
   }, [showSettingsMenu]);
   const handleModeChange = (newMode) => {
     setMode(newMode);
-    _optionalChain([onModeChange, 'optionalCall', _69 => _69(newMode)]);
+    _optionalChain([onModeChange, 'optionalCall', _76 => _76(newMode)]);
     if (newMode === "command") {
       setCommandState("idle");
       setCommandResult(null);
@@ -2880,7 +3033,7 @@ ${widgetContext}` : widgetContext;
         metadata: hasFiles ? { attachments } : void 0
       };
       setMessages((prev) => [...prev, userMessage]);
-      _optionalChain([onMessageSent, 'optionalCall', _70 => _70(userMessage)]);
+      _optionalChain([onMessageSent, 'optionalCall', _77 => _77(userMessage)]);
     }
     setIsLoading(true);
     try {
@@ -2948,7 +3101,7 @@ ${widgetContext}` : widgetContext;
                   responseThreadId = chunk.thread_id;
                   if (!currentThreadId) {
                     setCurrentThreadId(chunk.thread_id);
-                    _optionalChain([onThreadChange, 'optionalCall', _71 => _71(chunk.thread_id)]);
+                    _optionalChain([onThreadChange, 'optionalCall', _78 => _78(chunk.thread_id)]);
                   }
                 }
                 break;
@@ -2974,7 +3127,7 @@ ${widgetContext}` : widgetContext;
                   contentSegments.push({ type: "tool", id: chunk.tool_id, name: displayName, status: "preparing" });
                   toolInputBuffers[chunk.tool_id] = "";
                   setChatToolName(displayName);
-                  _optionalChain([onToolCall, 'optionalCall', _72 => _72(chunk.tool_name, chunk.tool_id)]);
+                  _optionalChain([onToolCall, 'optionalCall', _79 => _79(chunk.tool_name, chunk.tool_id)]);
                   updateMessage();
                 }
                 break;
@@ -3034,7 +3187,7 @@ ${widgetContext}` : widgetContext;
                     toolSegment.result = chunk.content;
                     toolSegment.status = "completed";
                     toolSegment.isReceiving = false;
-                    _optionalChain([onToolResult, 'optionalCall', _73 => _73(toolSegment.name, chunk.content)]);
+                    _optionalChain([onToolResult, 'optionalCall', _80 => _80(toolSegment.name, chunk.content)]);
                   }
                   setChatToolName(null);
                   updateMessage();
@@ -3077,7 +3230,7 @@ ${widgetContext}` : widgetContext;
             });
             if (threadId2 && threadId2 !== currentThreadId) {
               setCurrentThreadId(threadId2);
-              _optionalChain([onThreadChange, 'optionalCall', _74 => _74(threadId2)]);
+              _optionalChain([onThreadChange, 'optionalCall', _81 => _81(threadId2)]);
             }
             setIsLoading(false);
             setCurrentRequestId(null);
@@ -3101,7 +3254,7 @@ ${widgetContext}` : widgetContext;
             setIsLoading(false);
             setCurrentRequestId(null);
             setChatToolName(null);
-            _optionalChain([onError, 'optionalCall', _75 => _75(error)]);
+            _optionalChain([onError, 'optionalCall', _82 => _82(error)]);
           }
         );
       }
@@ -3114,7 +3267,7 @@ ${widgetContext}` : widgetContext;
         metadata: { error: true }
       };
       setMessages((prev) => [...prev, errorMessage]);
-      _optionalChain([onError, 'optionalCall', _76 => _76(error instanceof Error ? error : new Error("Unknown error"))]);
+      _optionalChain([onError, 'optionalCall', _83 => _83(error instanceof Error ? error : new Error("Unknown error"))]);
     } finally {
       setIsLoading(false);
     }
@@ -3160,7 +3313,7 @@ ${planningInstruction}` : planningInstruction;
           const error = err instanceof Error ? err : new Error("Failed to generate plan");
           setCommandError(error);
           setCommandState("error");
-          _optionalChain([onError, 'optionalCall', _77 => _77(error)]);
+          _optionalChain([onError, 'optionalCall', _84 => _84(error)]);
         }
       }
       return;
@@ -3193,12 +3346,12 @@ ${planningInstruction}` : planningInstruction;
               setCommandResult(result);
               setCommandState("success");
               setProgress(100);
-              _optionalChain([onComplete, 'optionalCall', _78 => _78(result)]);
+              _optionalChain([onComplete, 'optionalCall', _85 => _85(result)]);
             },
             (error) => {
               setCommandError(error);
               setCommandState("error");
-              _optionalChain([onError, 'optionalCall', _79 => _79(error)]);
+              _optionalChain([onError, 'optionalCall', _86 => _86(error)]);
             }
           );
         } else {
@@ -3211,7 +3364,7 @@ ${planningInstruction}` : planningInstruction;
           setCommandResult(result);
           setCommandState("success");
           setProgress(100);
-          _optionalChain([onComplete, 'optionalCall', _80 => _80(result)]);
+          _optionalChain([onComplete, 'optionalCall', _87 => _87(result)]);
         }
       } else {
         const commandInstruction = `CRITICAL COMMAND MODE: Maximum 10 words per response. Execute the command immediately. Make reasonable assumptions based on context. Use sensible defaults for missing details. DO NOT ask questions unless something is truly impossible without user input (e.g., missing required password). State what you're doing or the result. Examples: "Analyzing customer data from last quarter..." or "Created 5 new database entries successfully" or "Search complete: found 12 matching results". NO greetings, NO filler words, NO clarification requests. Action/result only.`;
@@ -3241,16 +3394,16 @@ ${commandInstruction}` : commandInstruction;
                 const displayName = chunk.tool_display_name || chunk.tool_name;
                 lastToolName = chunk.tool_name;
                 setCurrentToolName(displayName);
-                _optionalChain([onToolCall, 'optionalCall', _81 => _81(chunk.tool_name, chunk.tool_id || "")]);
+                _optionalChain([onToolCall, 'optionalCall', _88 => _88(chunk.tool_name, chunk.tool_id || "")]);
                 accumulatedContent = "";
                 setStreamedContent("");
               } else if (chunk.type === "tool_result") {
-                _optionalChain([onToolResult, 'optionalCall', _82 => _82(lastToolName, chunk.content)]);
+                _optionalChain([onToolResult, 'optionalCall', _89 => _89(lastToolName, chunk.content)]);
                 setCurrentToolName(null);
               } else if (chunk.type === "thread_id" && chunk.thread_id) {
                 if (!currentThreadId) {
                   setCurrentThreadId(chunk.thread_id);
-                  _optionalChain([onThreadChange, 'optionalCall', _83 => _83(chunk.thread_id)]);
+                  _optionalChain([onThreadChange, 'optionalCall', _90 => _90(chunk.thread_id)]);
                 }
               } else if (chunk.type === "request_id" && chunk.request_id) {
                 setCurrentRequestId(chunk.request_id);
@@ -3266,13 +3419,13 @@ ${commandInstruction}` : commandInstruction;
               setCommandState("success");
               setProgress(100);
               setCurrentRequestId(null);
-              _optionalChain([onComplete, 'optionalCall', _84 => _84(result)]);
+              _optionalChain([onComplete, 'optionalCall', _91 => _91(result)]);
             },
             (error) => {
               setCommandError(error);
               setCommandState("error");
               setCurrentRequestId(null);
-              _optionalChain([onError, 'optionalCall', _85 => _85(error)]);
+              _optionalChain([onError, 'optionalCall', _92 => _92(error)]);
             }
           );
         } else {
@@ -3292,14 +3445,14 @@ ${commandInstruction}` : commandInstruction;
           setCommandResult(result);
           setCommandState("success");
           setProgress(100);
-          _optionalChain([onComplete, 'optionalCall', _86 => _86(result)]);
+          _optionalChain([onComplete, 'optionalCall', _93 => _93(result)]);
         }
       }
     } catch (err) {
       const error = err instanceof Error ? err : new Error("Unknown error");
       setCommandError(error);
       setCommandState("error");
-      _optionalChain([onError, 'optionalCall', _87 => _87(error)]);
+      _optionalChain([onError, 'optionalCall', _94 => _94(error)]);
     }
   };
   const resetCommand = () => {
@@ -3391,8 +3544,8 @@ ${planToExecute}`;
           executeCommand(text, files);
         },
         state: commandState,
-        response: _optionalChain([commandResult, 'optionalAccess', _88 => _88.data, 'optionalAccess', _89 => _89.summary]) || _optionalChain([commandResult, 'optionalAccess', _90 => _90.message]),
-        error: _optionalChain([commandError, 'optionalAccess', _91 => _91.message]),
+        response: _optionalChain([commandResult, 'optionalAccess', _95 => _95.data, 'optionalAccess', _96 => _96.summary]) || _optionalChain([commandResult, 'optionalAccess', _97 => _97.message]),
+        error: _optionalChain([commandError, 'optionalAccess', _98 => _98.message]),
         plan,
         streamedContent,
         toolName: currentToolName,
@@ -3560,13 +3713,13 @@ ${planningInstruction}` : planningInstruction;
             const error2 = err instanceof Error ? err : new Error("Failed to generate plan");
             setError(error2);
             setState("error");
-            _optionalChain([onError, 'optionalCall', _92 => _92(error2)]);
+            _optionalChain([onError, 'optionalCall', _99 => _99(error2)]);
           });
         } catch (err) {
           const error2 = err instanceof Error ? err : new Error("Failed to generate plan");
           setError(error2);
           setState("error");
-          _optionalChain([onError, 'optionalCall', _93 => _93(error2)]);
+          _optionalChain([onError, 'optionalCall', _100 => _100(error2)]);
         }
       }
       return;
@@ -3577,7 +3730,7 @@ ${planningInstruction}` : planningInstruction;
     setStreamedContent("");
     setCommand("");
     setUploadedFiles([]);
-    _optionalChain([onStart, 'optionalCall', _94 => _94()]);
+    _optionalChain([onStart, 'optionalCall', _101 => _101()]);
     try {
       if (useMock) {
         if (enableStreaming) {
@@ -3588,16 +3741,16 @@ ${planningInstruction}` : planningInstruction;
               if (chunk.type === "token" && chunk.content) {
                 accumulatedContent += chunk.content;
                 setStreamedContent(accumulatedContent);
-                _optionalChain([onChunk, 'optionalCall', _95 => _95(chunk.content)]);
+                _optionalChain([onChunk, 'optionalCall', _102 => _102(chunk.content)]);
                 const estimatedProgress = Math.min(Math.round(accumulatedContent.length / 10), 90);
                 setProgress(estimatedProgress);
-                _optionalChain([onProgress, 'optionalCall', _96 => _96(estimatedProgress)]);
+                _optionalChain([onProgress, 'optionalCall', _103 => _103(estimatedProgress)]);
               } else if (chunk.type === "widget" && chunk.widget) {
                 const widget = chunk.widget;
                 setResult((prev) => ({
                   success: true,
-                  data: _optionalChain([prev, 'optionalAccess', _97 => _97.data]) || {},
-                  widgets: [..._optionalChain([prev, 'optionalAccess', _98 => _98.widgets]) || [], widget],
+                  data: _optionalChain([prev, 'optionalAccess', _104 => _104.data]) || {},
+                  widgets: [..._optionalChain([prev, 'optionalAccess', _105 => _105.widgets]) || [], widget],
                   message: accumulatedContent || "Command executed successfully"
                 }));
               }
@@ -3617,19 +3770,19 @@ ${planningInstruction}` : planningInstruction;
               setResult(result2);
               setState("success");
               setProgress(100);
-              _optionalChain([onComplete, 'optionalCall', _99 => _99(result2)]);
+              _optionalChain([onComplete, 'optionalCall', _106 => _106(result2)]);
             },
             (error2) => {
               setError(error2);
               setState("error");
-              _optionalChain([onError, 'optionalCall', _100 => _100(error2)]);
+              _optionalChain([onError, 'optionalCall', _107 => _107(error2)]);
             }
           );
         } else {
           const progressInterval = setInterval(() => {
             setProgress((prev) => {
               const next = Math.min(prev + 10, 90);
-              _optionalChain([onProgress, 'optionalCall', _101 => _101(next)]);
+              _optionalChain([onProgress, 'optionalCall', _108 => _108(next)]);
               return next;
             });
           }, 200);
@@ -3653,7 +3806,7 @@ ${planningInstruction}` : planningInstruction;
           setResult(result2);
           setState("success");
           setProgress(100);
-          _optionalChain([onComplete, 'optionalCall', _102 => _102(result2)]);
+          _optionalChain([onComplete, 'optionalCall', _109 => _109(result2)]);
         }
       } else {
         if (enableStreaming) {
@@ -3699,16 +3852,16 @@ ${commandInstruction}` : commandInstruction;
               if (chunk.type === "token" && chunk.content) {
                 accumulatedContent += chunk.content;
                 setStreamedContent(accumulatedContent);
-                _optionalChain([onChunk, 'optionalCall', _103 => _103(chunk.content)]);
+                _optionalChain([onChunk, 'optionalCall', _110 => _110(chunk.content)]);
                 const estimatedProgress = Math.min(Math.round(accumulatedContent.length / 10), 90);
                 setProgress(estimatedProgress);
-                _optionalChain([onProgress, 'optionalCall', _104 => _104(estimatedProgress)]);
+                _optionalChain([onProgress, 'optionalCall', _111 => _111(estimatedProgress)]);
               } else if (chunk.type === "widget" && chunk.widget) {
                 const widget = chunk.widget;
                 setResult((prev) => ({
                   success: true,
-                  data: _optionalChain([prev, 'optionalAccess', _105 => _105.data]) || {},
-                  widgets: [..._optionalChain([prev, 'optionalAccess', _106 => _106.widgets]) || [], widget],
+                  data: _optionalChain([prev, 'optionalAccess', _112 => _112.data]) || {},
+                  widgets: [..._optionalChain([prev, 'optionalAccess', _113 => _113.widgets]) || [], widget],
                   message: accumulatedContent || "Command executed successfully"
                 }));
               }
@@ -3728,20 +3881,20 @@ ${commandInstruction}` : commandInstruction;
               setResult(result2);
               setState("success");
               setProgress(100);
-              _optionalChain([onComplete, 'optionalCall', _107 => _107(result2)]);
+              _optionalChain([onComplete, 'optionalCall', _114 => _114(result2)]);
             },
             (error2) => {
               const err = error2 instanceof Error ? error2 : new Error("Unknown error");
               setError(err);
               setState("error");
-              _optionalChain([onError, 'optionalCall', _108 => _108(err)]);
+              _optionalChain([onError, 'optionalCall', _115 => _115(err)]);
             }
           );
         } else {
           const progressInterval = setInterval(() => {
             setProgress((prev) => {
               const next = Math.min(prev + 10, 90);
-              _optionalChain([onProgress, 'optionalCall', _109 => _109(next)]);
+              _optionalChain([onProgress, 'optionalCall', _116 => _116(next)]);
               return next;
             });
           }, 200);
@@ -3797,14 +3950,14 @@ ${commandInstruction}` : commandInstruction;
           setResult(result2);
           setState("success");
           setProgress(100);
-          _optionalChain([onComplete, 'optionalCall', _110 => _110(result2)]);
+          _optionalChain([onComplete, 'optionalCall', _117 => _117(result2)]);
         }
       }
     } catch (err) {
       const error2 = err instanceof Error ? err : new Error("Unknown error");
       setError(error2);
       setState("error");
-      _optionalChain([onError, 'optionalCall', _111 => _111(error2)]);
+      _optionalChain([onError, 'optionalCall', _118 => _118(error2)]);
     }
   };
   const resetCommand = () => {
@@ -3837,14 +3990,14 @@ ${planToExecute}`;
   };
   const handleFileSelect = async (e) => {
     if (e.target.files && e.target.files.length > 0) {
-      _optionalChain([onFileUpload, 'optionalCall', _112 => _112(e.target.files)]);
+      _optionalChain([onFileUpload, 'optionalCall', _119 => _119(e.target.files)]);
       const files = [];
       for (let i = 0; i < e.target.files.length; i++) {
         const file = e.target.files[i];
         const reader = new FileReader();
         await new Promise((resolve) => {
           reader.onload = (event) => {
-            if (_optionalChain([event, 'access', _113 => _113.target, 'optionalAccess', _114 => _114.result])) {
+            if (_optionalChain([event, 'access', _120 => _120.target, 'optionalAccess', _121 => _121.result])) {
               const fullDataUrl = event.target.result;
               const base64Data = fullDataUrl.split(",")[1];
               if (file.type.startsWith("image/")) {
@@ -3938,7 +4091,7 @@ ${planToExecute}`;
               enableFileUpload && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                 "button",
                 {
-                  onClick: () => _optionalChain([fileInputRef, 'access', _115 => _115.current, 'optionalAccess', _116 => _116.click, 'call', _117 => _117()]),
+                  onClick: () => _optionalChain([fileInputRef, 'access', _122 => _122.current, 'optionalAccess', _123 => _123.click, 'call', _124 => _124()]),
                   className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-neutral-500 dark:!text-neutral-500 hover:bg-neutral-100 dark:hover:bg-neutral-800",
                   title: "Attach file",
                   children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
@@ -4157,7 +4310,7 @@ ${planToExecute}`;
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { className: "w-5 h-5 text-red-600 mt-0.5 flex-shrink-0", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
               /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
                 /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "text-sm font-semibold text-red-800 dark:text-red-400", children: "Error" }),
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-red-700 dark:text-red-300 text-sm mt-1", children: _optionalChain([error, 'optionalAccess', _118 => _118.message]) })
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-red-700 dark:text-red-300 text-sm mt-1", children: _optionalChain([error, 'optionalAccess', _125 => _125.message]) })
               ] })
             ] }) }),
             allowInput && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -4185,7 +4338,7 @@ ${planToExecute}`;
                 /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-green-700 dark:text-green-300 text-sm", children: "Command executed successfully" })
               ] })
             ] }),
-            _optionalChain([result, 'access', _119 => _119.data, 'optionalAccess', _120 => _120.summary]) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "text-neutral-700 dark:text-neutral-300 text-sm leading-relaxed whitespace-pre-line", children: result.data.summary }),
+            _optionalChain([result, 'access', _126 => _126.data, 'optionalAccess', _127 => _127.summary]) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "text-neutral-700 dark:text-neutral-300 text-sm leading-relaxed whitespace-pre-line", children: result.data.summary }),
             result.widgets && result.widgets.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "space-y-3", children: result.widgets.map((widget) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               WidgetRenderer,
               {
@@ -4236,7 +4389,7 @@ ${planToExecute}`;
             enableFileUpload && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               "button",
               {
-                onClick: () => _optionalChain([fileInputRef, 'access', _121 => _121.current, 'optionalAccess', _122 => _122.click, 'call', _123 => _123()]),
+                onClick: () => _optionalChain([fileInputRef, 'access', _128 => _128.current, 'optionalAccess', _129 => _129.click, 'call', _130 => _130()]),
                 className: "w-8 h-8 rounded-lg flex items-center justify-center transition-all flex-shrink-0 !text-neutral-500 dark:!text-neutral-500 hover:bg-neutral-100 dark:hover:bg-neutral-800",
                 title: "Attach file",
                 children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M8.4 2.8L4.4 6.8C3.736 7.464 3.736 8.536 4.4 9.2C5.064 9.864 6.136 9.864 6.8 9.2L11.6 4.4C12.704 3.296 12.704 1.504 11.6 0.4C10.496 -0.704 8.704 -0.704 7.6 0.4L2.8 5.2C1.256 6.744 1.256 9.256 2.8 10.8C4.344 12.344 6.856 12.344 8.4 10.8L12.4 6.8", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", transform: "translate(1.6, 2.4)" }) })
@@ -4422,25 +4575,25 @@ function Prompt({
     const newValue = e.target.value;
     if (!maxLength || newValue.length <= maxLength) {
       setValue(newValue);
-      _optionalChain([onChange, 'optionalCall', _124 => _124(newValue)]);
+      _optionalChain([onChange, 'optionalCall', _131 => _131(newValue)]);
     }
   };
   const handleSubmit = async () => {
     if (value.length < minLength) return;
-    _optionalChain([onSubmit, 'optionalCall', _125 => _125(value)]);
+    _optionalChain([onSubmit, 'optionalCall', _132 => _132(value)]);
     setIsLoading(true);
     try {
       if (useMock) {
         await new Promise((resolve) => setTimeout(resolve, 1500));
         const mockResult = `Enhanced version: ${value} [AI-generated content]`;
-        _optionalChain([onResult, 'optionalCall', _126 => _126(mockResult)]);
+        _optionalChain([onResult, 'optionalCall', _133 => _133(mockResult)]);
         setValue("");
       } else {
         const response = await aptevaClient.chat({
           agent_id: agentId,
           message: value
         });
-        _optionalChain([onResult, 'optionalCall', _127 => _127(response.message)]);
+        _optionalChain([onResult, 'optionalCall', _134 => _134(response.message)]);
         setValue("");
       }
     } catch (error) {
@@ -4535,7 +4688,7 @@ function Stream({
   }, [autoStart]);
   const startStreaming = async () => {
     setIsStreaming(true);
-    _optionalChain([onStart, 'optionalCall', _128 => _128()]);
+    _optionalChain([onStart, 'optionalCall', _135 => _135()]);
     try {
       if (useMock) {
         const mockText = "This is a simulated streaming response from the AI agent. In a real implementation, this would stream data from your backend API. The text appears word by word to simulate the streaming effect. You can customize the typing speed and styling based on your needs.";
@@ -4543,13 +4696,13 @@ function Stream({
           mockText,
           (chunk) => {
             setText((prev) => prev + chunk);
-            _optionalChain([onChunk, 'optionalCall', _129 => _129(chunk)]);
+            _optionalChain([onChunk, 'optionalCall', _136 => _136(chunk)]);
           },
           typingSpeed
         );
         setIsComplete(true);
         setIsStreaming(false);
-        _optionalChain([onComplete, 'optionalCall', _130 => _130(text + mockText)]);
+        _optionalChain([onComplete, 'optionalCall', _137 => _137(text + mockText)]);
       } else {
         let accumulatedText = "";
         await aptevaClient.chatStream(
@@ -4562,24 +4715,24 @@ function Stream({
             if (chunk.type === "token" && chunk.content) {
               accumulatedText += chunk.content;
               setText(accumulatedText);
-              _optionalChain([onChunk, 'optionalCall', _131 => _131(chunk.content)]);
+              _optionalChain([onChunk, 'optionalCall', _138 => _138(chunk.content)]);
             }
           },
           () => {
             setIsComplete(true);
             setIsStreaming(false);
-            _optionalChain([onComplete, 'optionalCall', _132 => _132(accumulatedText)]);
+            _optionalChain([onComplete, 'optionalCall', _139 => _139(accumulatedText)]);
           },
           (error) => {
             const err = error instanceof Error ? error : new Error("Streaming error");
-            _optionalChain([onError, 'optionalCall', _133 => _133(err)]);
+            _optionalChain([onError, 'optionalCall', _140 => _140(err)]);
             setIsStreaming(false);
           }
         );
       }
     } catch (error) {
       const err = error instanceof Error ? error : new Error("Streaming error");
-      _optionalChain([onError, 'optionalCall', _134 => _134(err)]);
+      _optionalChain([onError, 'optionalCall', _141 => _141(err)]);
       setIsStreaming(false);
     }
   };
@@ -4671,7 +4824,7 @@ function ThreadList({
 }) {
   const [searchQuery, setSearchQuery] = _react.useState.call(void 0, "");
   const filteredThreads = threads.filter(
-    (thread) => thread.title.toLowerCase().includes(searchQuery.toLowerCase()) || _optionalChain([thread, 'access', _135 => _135.preview, 'optionalAccess', _136 => _136.toLowerCase, 'call', _137 => _137(), 'access', _138 => _138.includes, 'call', _139 => _139(searchQuery.toLowerCase())])
+    (thread) => thread.title.toLowerCase().includes(searchQuery.toLowerCase()) || _optionalChain([thread, 'access', _142 => _142.preview, 'optionalAccess', _143 => _143.toLowerCase, 'call', _144 => _144(), 'access', _145 => _145.includes, 'call', _146 => _146(searchQuery.toLowerCase())])
   );
   const groupedThreads = groupBy === "date" ? groupThreadsByDate(filteredThreads) : { All: filteredThreads };
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col h-full", children: [
@@ -4693,8 +4846,8 @@ function ThreadList({
           {
             thread,
             isActive: thread.id === currentThreadId,
-            onSelect: () => _optionalChain([onThreadSelect, 'optionalCall', _140 => _140(thread.id)]),
-            onDelete: () => _optionalChain([onThreadDelete, 'optionalCall', _141 => _141(thread.id)])
+            onSelect: () => _optionalChain([onThreadSelect, 'optionalCall', _147 => _147(thread.id)]),
+            onDelete: () => _optionalChain([onThreadDelete, 'optionalCall', _148 => _148(thread.id)])
           },
           thread.id
         ))
@@ -4756,7 +4909,7 @@ function Threads({
       threads.slice(0, 5).map((thread) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "button",
         {
-          onClick: () => _optionalChain([onThreadSelect, 'optionalCall', _142 => _142(thread.id)]),
+          onClick: () => _optionalChain([onThreadSelect, 'optionalCall', _149 => _149(thread.id)]),
           className: cn(
             "px-4 py-2 whitespace-nowrap font-medium transition-colors",
             thread.id === currentThreadId ? "border-b-2 border-apteva-500 text-apteva-500" : "text-neutral-600 hover:text-neutral-900"