@copilotkitnext/react 0.0.9-alpha.1 → 0.0.9-alpha.3

package/dist/index.d.mts

@@ -2,8 +2,8 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import React__default, { ReactNode } from 'react';
 import { AssistantMessage, Message, UserMessage, ToolCall, ToolMessage } from '@ag-ui/core';
-import { ToolCallStatus, FrontendTool, CopilotKitCore } from '@copilotkitnext/core';
 import { z } from 'zod';
+import { ToolCallStatus, FrontendTool, CopilotKitCore } from '@copilotkitnext/core';
 import { AbstractAgent, Context } from '@ag-ui/client';
 
 declare const CopilotChatDefaultLabels: {
@@ -118,9 +118,8 @@ declare namespace CopilotChatInput {
 type CopilotChatToolCallsViewProps = {
     message: AssistantMessage;
     messages?: Message[];
-    isRunning?: boolean;
 };
-declare function CopilotChatToolCallsView({ message, messages, isRunning, }: CopilotChatToolCallsViewProps): react_jsx_runtime.JSX.Element | null;
+declare function CopilotChatToolCallsView({ message, messages, }: CopilotChatToolCallsViewProps): react_jsx_runtime.JSX.Element | null;
 
 type CopilotChatAssistantMessageProps = WithSlots<{
     markdownRenderer: typeof CopilotChatAssistantMessage.MarkdownRenderer;
@@ -262,10 +261,11 @@ type CopilotChatProps = Omit<CopilotChatViewProps, "messages"> & {
 };
 declare function CopilotChat({ agentId, threadId, ...props }: CopilotChatProps): react_jsx_runtime.JSX.Element;
 
+declare const WildcardToolCallRender: ReactToolCallRender<any>;
+
 interface UseRenderToolCallProps {
     toolCall: ToolCall;
     toolMessage?: ToolMessage;
-    isRunning: boolean;
 }
 /**
  * Hook that returns a function to render tool calls based on the render functions
@@ -273,7 +273,7 @@ interface UseRenderToolCallProps {
  *
  * @returns A function that takes a tool call and optional tool message and returns the rendered component
  */
-declare function useRenderToolCall(): ({ toolCall, toolMessage, isRunning, }: UseRenderToolCallProps) => React__default.ReactElement | null;
+declare function useRenderToolCall(): ({ toolCall, toolMessage, }: UseRenderToolCallProps) => React__default.ReactElement | null;
 
 interface ReactToolCallRender<T> {
     name: string;
@@ -351,7 +351,7 @@ declare function useAgentContext(context: Context): void;
 
 interface CopilotKitContextValue {
     copilotkit: CopilotKitCore;
-    renderToolCalls: ReactToolCallRender<unknown>[];
+    renderToolCalls: ReactToolCallRender<any>[];
     currentRenderToolCalls: ReactToolCallRender<unknown>[];
     setCurrentRenderToolCalls: React__default.Dispatch<React__default.SetStateAction<ReactToolCallRender<unknown>[]>>;
 }
@@ -360,8 +360,8 @@ interface CopilotKitProviderProps {
     runtimeUrl?: string;
     headers?: Record<string, string>;
     properties?: Record<string, unknown>;
-    agents?: Record<string, AbstractAgent>;
-    renderToolCalls?: ReactToolCallRender<unknown>[];
+    agents__unsafe_dev_only?: Record<string, AbstractAgent>;
+    renderToolCalls?: ReactToolCallRender<any>[];
     frontendTools?: ReactFrontendTool[];
     humanInTheLoop?: ReactHumanInTheLoop[];
 }
@@ -403,4 +403,4 @@ declare function defineToolCallRender<S extends z.ZodTypeAny>(def: {
     agentId?: string;
 }): ReactToolCallRender<z.infer<S>>;
 
-export { AudioRecorderError, type AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, type CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, type CopilotChatConfigurationProviderProps, type CopilotChatConfigurationValue, CopilotChatInput, type CopilotChatInputProps, type CopilotChatLabels, CopilotChatMessageView, type CopilotChatMessageViewProps, type CopilotChatProps, CopilotChatToolCallsView, type CopilotChatToolCallsViewProps, CopilotChatUserMessage, type CopilotChatUserMessageProps, CopilotChatView, type CopilotChatViewProps, type CopilotKitContextValue, CopilotKitProvider, type CopilotKitProviderProps, type ReactFrontendTool, type ReactHumanInTheLoop, type ReactToolCallRender, type ToolsMenuItem, defineToolCallRender, useAgent, useAgentContext, useCopilotChatConfiguration, useCopilotKit, useFrontendTool, useHumanInTheLoop, useRenderToolCall };
+export { AudioRecorderError, type AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, type CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, type CopilotChatConfigurationProviderProps, type CopilotChatConfigurationValue, CopilotChatInput, type CopilotChatInputProps, type CopilotChatLabels, CopilotChatMessageView, type CopilotChatMessageViewProps, type CopilotChatProps, CopilotChatToolCallsView, type CopilotChatToolCallsViewProps, CopilotChatUserMessage, type CopilotChatUserMessageProps, CopilotChatView, type CopilotChatViewProps, type CopilotKitContextValue, CopilotKitProvider, type CopilotKitProviderProps, type ReactFrontendTool, type ReactHumanInTheLoop, type ReactToolCallRender, type ToolsMenuItem, WildcardToolCallRender, defineToolCallRender, useAgent, useAgentContext, useCopilotChatConfiguration, useCopilotKit, useFrontendTool, useHumanInTheLoop, useRenderToolCall };

package/dist/index.d.ts

@@ -2,8 +2,8 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
 import React__default, { ReactNode } from 'react';
 import { AssistantMessage, Message, UserMessage, ToolCall, ToolMessage } from '@ag-ui/core';
-import { ToolCallStatus, FrontendTool, CopilotKitCore } from '@copilotkitnext/core';
 import { z } from 'zod';
+import { ToolCallStatus, FrontendTool, CopilotKitCore } from '@copilotkitnext/core';
 import { AbstractAgent, Context } from '@ag-ui/client';
 
 declare const CopilotChatDefaultLabels: {
@@ -118,9 +118,8 @@ declare namespace CopilotChatInput {
 type CopilotChatToolCallsViewProps = {
     message: AssistantMessage;
     messages?: Message[];
-    isRunning?: boolean;
 };
-declare function CopilotChatToolCallsView({ message, messages, isRunning, }: CopilotChatToolCallsViewProps): react_jsx_runtime.JSX.Element | null;
+declare function CopilotChatToolCallsView({ message, messages, }: CopilotChatToolCallsViewProps): react_jsx_runtime.JSX.Element | null;
 
 type CopilotChatAssistantMessageProps = WithSlots<{
     markdownRenderer: typeof CopilotChatAssistantMessage.MarkdownRenderer;
@@ -262,10 +261,11 @@ type CopilotChatProps = Omit<CopilotChatViewProps, "messages"> & {
 };
 declare function CopilotChat({ agentId, threadId, ...props }: CopilotChatProps): react_jsx_runtime.JSX.Element;
 
+declare const WildcardToolCallRender: ReactToolCallRender<any>;
+
 interface UseRenderToolCallProps {
     toolCall: ToolCall;
     toolMessage?: ToolMessage;
-    isRunning: boolean;
 }
 /**
  * Hook that returns a function to render tool calls based on the render functions
@@ -273,7 +273,7 @@ interface UseRenderToolCallProps {
  *
  * @returns A function that takes a tool call and optional tool message and returns the rendered component
  */
-declare function useRenderToolCall(): ({ toolCall, toolMessage, isRunning, }: UseRenderToolCallProps) => React__default.ReactElement | null;
+declare function useRenderToolCall(): ({ toolCall, toolMessage, }: UseRenderToolCallProps) => React__default.ReactElement | null;
 
 interface ReactToolCallRender<T> {
     name: string;
@@ -351,7 +351,7 @@ declare function useAgentContext(context: Context): void;
 
 interface CopilotKitContextValue {
     copilotkit: CopilotKitCore;
-    renderToolCalls: ReactToolCallRender<unknown>[];
+    renderToolCalls: ReactToolCallRender<any>[];
     currentRenderToolCalls: ReactToolCallRender<unknown>[];
     setCurrentRenderToolCalls: React__default.Dispatch<React__default.SetStateAction<ReactToolCallRender<unknown>[]>>;
 }
@@ -360,8 +360,8 @@ interface CopilotKitProviderProps {
     runtimeUrl?: string;
     headers?: Record<string, string>;
     properties?: Record<string, unknown>;
-    agents?: Record<string, AbstractAgent>;
-    renderToolCalls?: ReactToolCallRender<unknown>[];
+    agents__unsafe_dev_only?: Record<string, AbstractAgent>;
+    renderToolCalls?: ReactToolCallRender<any>[];
     frontendTools?: ReactFrontendTool[];
     humanInTheLoop?: ReactHumanInTheLoop[];
 }
@@ -403,4 +403,4 @@ declare function defineToolCallRender<S extends z.ZodTypeAny>(def: {
     agentId?: string;
 }): ReactToolCallRender<z.infer<S>>;
 
-export { AudioRecorderError, type AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, type CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, type CopilotChatConfigurationProviderProps, type CopilotChatConfigurationValue, CopilotChatInput, type CopilotChatInputProps, type CopilotChatLabels, CopilotChatMessageView, type CopilotChatMessageViewProps, type CopilotChatProps, CopilotChatToolCallsView, type CopilotChatToolCallsViewProps, CopilotChatUserMessage, type CopilotChatUserMessageProps, CopilotChatView, type CopilotChatViewProps, type CopilotKitContextValue, CopilotKitProvider, type CopilotKitProviderProps, type ReactFrontendTool, type ReactHumanInTheLoop, type ReactToolCallRender, type ToolsMenuItem, defineToolCallRender, useAgent, useAgentContext, useCopilotChatConfiguration, useCopilotKit, useFrontendTool, useHumanInTheLoop, useRenderToolCall };
+export { AudioRecorderError, type AudioRecorderState, CopilotChat, CopilotChatAssistantMessage, type CopilotChatAssistantMessageProps, CopilotChatAudioRecorder, CopilotChatConfigurationProvider, type CopilotChatConfigurationProviderProps, type CopilotChatConfigurationValue, CopilotChatInput, type CopilotChatInputProps, type CopilotChatLabels, CopilotChatMessageView, type CopilotChatMessageViewProps, type CopilotChatProps, CopilotChatToolCallsView, type CopilotChatToolCallsViewProps, CopilotChatUserMessage, type CopilotChatUserMessageProps, CopilotChatView, type CopilotChatViewProps, type CopilotKitContextValue, CopilotKitProvider, type CopilotKitProviderProps, type ReactFrontendTool, type ReactHumanInTheLoop, type ReactToolCallRender, type ToolsMenuItem, WildcardToolCallRender, defineToolCallRender, useAgent, useAgentContext, useCopilotChatConfiguration, useCopilotKit, useFrontendTool, useHumanInTheLoop, useRenderToolCall };

package/dist/index.js

@@ -41,6 +41,7 @@ __export(index_exports, {
   CopilotChatUserMessage: () => CopilotChatUserMessage_default,
   CopilotChatView: () => CopilotChatView_default,
   CopilotKitProvider: () => CopilotKitProvider,
+  WildcardToolCallRender: () => WildcardToolCallRender,
   defineToolCallRender: () => defineToolCallRender,
   useAgent: () => useAgent,
   useAgentContext: () => useAgentContext,
@@ -972,7 +973,7 @@ var CopilotKitProvider = ({
   runtimeUrl,
   headers = {},
   properties = {},
-  agents = {},
+  agents__unsafe_dev_only: agents = {},
   renderToolCalls,
   frontendTools,
   humanInTheLoop
@@ -1161,8 +1162,7 @@ function useRenderToolCall() {
   const renderToolCall = (0, import_react6.useCallback)(
     ({
       toolCall,
-      toolMessage,
-      isRunning
+      toolMessage
     }) => {
       const exactMatches = currentRenderToolCalls.filter(
         (rc) => rc.name === toolCall.function.name
@@ -1196,7 +1196,7 @@ function useRenderToolCall() {
           },
           toolCall.id
         );
-      } else if (isRunning) {
+      } else {
         return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
           RenderComponent,
           {
@@ -1207,17 +1207,6 @@ function useRenderToolCall() {
           },
           toolCall.id
         );
-      } else {
-        return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-          RenderComponent,
-          {
-            name: toolName,
-            args,
-            status: import_core2.ToolCallStatus.Complete,
-            result: ""
-          },
-          toolCall.id
-        );
       }
     },
     [currentRenderToolCalls, executingToolCallIds, agentId]
@@ -1414,8 +1403,7 @@ var import_react12 = __toESM(require("react"));
 var import_jsx_runtime9 = require("react/jsx-runtime");
 function CopilotChatToolCallsView({
   message,
-  messages = [],
-  isRunning = false
+  messages = []
 }) {
   const renderToolCall = useRenderToolCall();
   if (!message.toolCalls || message.toolCalls.length === 0) {
@@ -1427,8 +1415,7 @@ function CopilotChatToolCallsView({
     );
     return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react12.default.Fragment, { children: renderToolCall({
       toolCall,
-      toolMessage,
-      isRunning
+      toolMessage
     }) }, toolCall.id);
   }) });
 }
@@ -1527,8 +1514,7 @@ function CopilotChatAssistantMessage({
     CopilotChatToolCallsView_default,
     {
       message,
-      messages,
-      isRunning
+      messages
     }
   );
   const hasContent = !!(message.content && message.content.trim().length > 0);
@@ -2441,6 +2427,70 @@ function defineToolCallRender(def) {
     ...def.agentId ? { agentId: def.agentId } : {}
   };
 }
+
+// src/components/WildcardToolCallRender.tsx
+var import_react17 = require("react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var WildcardToolCallRender = defineToolCallRender({
+  name: "*",
+  render: ({ args, result, name, status }) => {
+    const [isExpanded, setIsExpanded] = (0, import_react17.useState)(false);
+    const statusString = String(status);
+    const isActive = statusString === "inProgress" || statusString === "executing";
+    const isComplete = statusString === "complete";
+    const statusStyles = isActive ? "bg-amber-100 text-amber-800 dark:bg-amber-500/15 dark:text-amber-400" : isComplete ? "bg-emerald-100 text-emerald-800 dark:bg-emerald-500/15 dark:text-emerald-400" : "bg-zinc-100 text-zinc-800 dark:bg-zinc-700/40 dark:text-zinc-300";
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "mt-2 pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "rounded-xl border border-zinc-200/60 dark:border-zinc-800/60 bg-white/70 dark:bg-zinc-900/50 shadow-sm backdrop-blur p-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+        "div",
+        {
+          className: "flex items-center justify-between gap-3 cursor-pointer",
+          onClick: () => setIsExpanded(!isExpanded),
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex items-center gap-2 min-w-0", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                "svg",
+                {
+                  className: `h-4 w-4 text-zinc-500 dark:text-zinc-400 transition-transform ${isExpanded ? "rotate-90" : ""}`,
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  strokeWidth: 2,
+                  stroke: "currentColor",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                    "path",
+                    {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      d: "M8.25 4.5l7.5 7.5-7.5 7.5"
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "inline-block h-2 w-2 rounded-full bg-blue-500" }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "truncate text-sm font-medium text-zinc-900 dark:text-zinc-100", children: name })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+              "span",
+              {
+                className: `inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ${statusStyles}`,
+                children: String(status)
+              }
+            )
+          ]
+        }
+      ),
+      isExpanded && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "mt-3 grid gap-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "text-xs uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: "Arguments" }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("pre", { className: "mt-2 max-h-64 overflow-auto rounded-md bg-zinc-50 dark:bg-zinc-800/60 p-3 text-xs leading-relaxed text-zinc-800 dark:text-zinc-200 whitespace-pre-wrap break-words", children: JSON.stringify(args ?? {}, null, 2) })
+        ] }),
+        result !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "text-xs uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: "Result" }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("pre", { className: "mt-2 max-h-64 overflow-auto rounded-md bg-zinc-50 dark:bg-zinc-800/60 p-3 text-xs leading-relaxed text-zinc-800 dark:text-zinc-200 whitespace-pre-wrap break-words", children: typeof result === "string" ? result : JSON.stringify(result, null, 2) })
+        ] })
+      ] })
+    ] }) });
+  }
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AudioRecorderError,
@@ -2454,6 +2504,7 @@ function defineToolCallRender(def) {
   CopilotChatUserMessage,
   CopilotChatView,
   CopilotKitProvider,
+  WildcardToolCallRender,
   defineToolCallRender,
   useAgent,
   useAgentContext,