@usecrow/ui 0.1.50 → 0.1.52

package/dist/index.d.cts

@@ -201,6 +201,10 @@ interface WidgetConfigResponse {
         label: string;
         message: string;
     }>;
+    /** Per-tool consent settings from dashboard (shield icon) */
+    toolConsentSettings?: Record<string, {
+        requires_consent: boolean;
+    }>;
 }
 
 /**
@@ -649,6 +653,10 @@ interface UseChatOptions {
     welcomeMessage?: string;
     /** AI model to use for this chat (defaults to DEFAULT_MODEL) */
     selectedModel?: string;
+    /** Per-tool consent settings — when a tool has requires_consent, show Allow/Deny before executing */
+    toolConsentSettings?: Record<string, {
+        requires_consent: boolean;
+    }>;
     onVerificationStatus?: (isVerified: boolean) => void;
     onConversationId?: (id: string) => void;
     onWorkflowEvent?: (event: WorkflowEvent) => void;
@@ -656,7 +664,7 @@ interface UseChatOptions {
     onToolResult?: (toolName: string, result: Record<string, unknown>) => void;
     onRestoredConversation?: (conversationId: string) => void;
 }
-declare function useChat({ productId, apiUrl, persistAnonymousConversations, welcomeMessage, selectedModel: initialSelectedModel, onVerificationStatus, onConversationId, onWorkflowEvent, onToolCall, onToolResult, onRestoredConversation, }: UseChatOptions): {
+declare function useChat({ productId, apiUrl, persistAnonymousConversations, welcomeMessage, selectedModel: initialSelectedModel, toolConsentSettings, onVerificationStatus, onConversationId, onWorkflowEvent, onToolCall, onToolResult, onRestoredConversation, }: UseChatOptions): {
     messages: Message[];
     isLoading: boolean;
     activeToolCalls: ToolCall[];
@@ -781,6 +789,10 @@ interface UseWidgetStylesResult {
         label: string;
         message: string;
     }>;
+    /** Per-tool consent settings from dashboard */
+    toolConsentSettings: Record<string, {
+        requires_consent: boolean;
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }
@@ -822,6 +834,10 @@ interface UseCopilotStylesResult {
     welcomeMessage: string | undefined;
     /** AI model configured for this product */
     selectedModel: string | undefined;
+    /** Per-tool consent settings from dashboard */
+    toolConsentSettings: Record<string, {
+        requires_consent: boolean;
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }
@@ -1087,10 +1103,9 @@ interface WidgetHeaderProps {
     onNewChat: () => void;
     onToggleHistory: () => void;
     showMinimize?: boolean;
-    isMinimized?: boolean;
     onToggleMinimize?: () => void;
 }
-declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat, onToggleHistory, showMinimize, isMinimized, onToggleMinimize, }: WidgetHeaderProps): react_jsx_runtime.JSX.Element;
+declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat, onToggleHistory, showMinimize, onToggleMinimize, }: WidgetHeaderProps): react_jsx_runtime.JSX.Element;
 
 /**
  * CopilotToggleButton - Edge toggle button for floating copilot

package/dist/index.d.ts

@@ -201,6 +201,10 @@ interface WidgetConfigResponse {
         label: string;
         message: string;
     }>;
+    /** Per-tool consent settings from dashboard (shield icon) */
+    toolConsentSettings?: Record<string, {
+        requires_consent: boolean;
+    }>;
 }
 
 /**
@@ -649,6 +653,10 @@ interface UseChatOptions {
     welcomeMessage?: string;
     /** AI model to use for this chat (defaults to DEFAULT_MODEL) */
     selectedModel?: string;
+    /** Per-tool consent settings — when a tool has requires_consent, show Allow/Deny before executing */
+    toolConsentSettings?: Record<string, {
+        requires_consent: boolean;
+    }>;
     onVerificationStatus?: (isVerified: boolean) => void;
     onConversationId?: (id: string) => void;
     onWorkflowEvent?: (event: WorkflowEvent) => void;
@@ -656,7 +664,7 @@ interface UseChatOptions {
     onToolResult?: (toolName: string, result: Record<string, unknown>) => void;
     onRestoredConversation?: (conversationId: string) => void;
 }
-declare function useChat({ productId, apiUrl, persistAnonymousConversations, welcomeMessage, selectedModel: initialSelectedModel, onVerificationStatus, onConversationId, onWorkflowEvent, onToolCall, onToolResult, onRestoredConversation, }: UseChatOptions): {
+declare function useChat({ productId, apiUrl, persistAnonymousConversations, welcomeMessage, selectedModel: initialSelectedModel, toolConsentSettings, onVerificationStatus, onConversationId, onWorkflowEvent, onToolCall, onToolResult, onRestoredConversation, }: UseChatOptions): {
     messages: Message[];
     isLoading: boolean;
     activeToolCalls: ToolCall[];
@@ -781,6 +789,10 @@ interface UseWidgetStylesResult {
         label: string;
         message: string;
     }>;
+    /** Per-tool consent settings from dashboard */
+    toolConsentSettings: Record<string, {
+        requires_consent: boolean;
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }
@@ -822,6 +834,10 @@ interface UseCopilotStylesResult {
     welcomeMessage: string | undefined;
     /** AI model configured for this product */
     selectedModel: string | undefined;
+    /** Per-tool consent settings from dashboard */
+    toolConsentSettings: Record<string, {
+        requires_consent: boolean;
+    }>;
     /** Refetch styles from API */
     refetch: () => Promise<void>;
 }
@@ -1087,10 +1103,9 @@ interface WidgetHeaderProps {
     onNewChat: () => void;
     onToggleHistory: () => void;
     showMinimize?: boolean;
-    isMinimized?: boolean;
     onToggleMinimize?: () => void;
 }
-declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat, onToggleHistory, showMinimize, isMinimized, onToggleMinimize, }: WidgetHeaderProps): react_jsx_runtime.JSX.Element;
+declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat, onToggleHistory, showMinimize, onToggleMinimize, }: WidgetHeaderProps): react_jsx_runtime.JSX.Element;
 
 /**
  * CopilotToggleButton - Edge toggle button for floating copilot

package/dist/index.js

@@ -3,7 +3,7 @@ import { motion, AnimatePresence } from 'framer-motion';
 import { DEFAULT_TOOLS, CrowClient } from '@usecrow/client';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
-import { Square, ArrowUp, ChevronDown, Check, MessageCircle, Plus, History, ChevronUp, Brain, ChevronRight, Loader2, X } from 'lucide-react';
+import { Square, ArrowUp, ChevronDown, Check, MessageCircle, Plus, RotateCcw, History, X, Brain, ChevronRight, Loader2 } from 'lucide-react';
 import ReactMarkdown from 'react-markdown';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 
@@ -44,6 +44,7 @@ function useChat({
   persistAnonymousConversations,
   welcomeMessage,
   selectedModel: initialSelectedModel,
+  toolConsentSettings,
   onVerificationStatus,
   onConversationId,
   onWorkflowEvent,
@@ -68,6 +69,8 @@ function useChat({
   const abortControllerRef = useRef(null);
   const hasCheckedPersistRef = useRef(false);
   const streamingToolCallsRef = useRef([]);
+  const toolConsentSettingsRef = useRef(toolConsentSettings);
+  toolConsentSettingsRef.current = toolConsentSettings;
   useEffect(() => {
     if (initialSelectedModel) {
       setSelectedModel((prev) => prev !== initialSelectedModel ? initialSelectedModel : prev);
@@ -319,26 +322,43 @@ function useChat({
                       }
                       break;
                     case "client_tool_call":
-                      onToolCall?.({
-                        type: "start",
-                        toolName: parsed.tool_name,
-                        arguments: parsed.arguments
-                      });
-                      const clientToolCall = {
-                        id: parsed.tool_call_id || `tool-${Date.now()}`,
-                        name: parsed.tool_name,
-                        displayName: parsed.display_name || void 0,
-                        arguments: parsed.arguments || {},
-                        status: "executing",
-                        timestamp: /* @__PURE__ */ new Date()
-                      };
-                      streamingToolCallsRef.current = [...streamingToolCallsRef.current, clientToolCall];
-                      setActiveToolCalls((prev) => [...prev, clientToolCall]);
-                      pendingClientTools.push({
-                        toolName: parsed.tool_name,
-                        toolCallId: parsed.tool_call_id,
-                        arguments: parsed.arguments
-                      });
+                      {
+                        const needsConsent = toolConsentSettingsRef.current?.[parsed.tool_name]?.requires_consent === true;
+                        onToolCall?.({
+                          type: "start",
+                          toolName: parsed.tool_name,
+                          arguments: parsed.arguments
+                        });
+                        if (needsConsent) {
+                          const consentClientTc = {
+                            id: parsed.tool_call_id || `tool-${Date.now()}`,
+                            name: parsed.tool_name,
+                            displayName: parsed.display_name || void 0,
+                            arguments: parsed.arguments || {},
+                            status: "awaiting_consent",
+                            requiresConsent: true,
+                            timestamp: /* @__PURE__ */ new Date()
+                          };
+                          streamingToolCallsRef.current = [...streamingToolCallsRef.current, consentClientTc];
+                          setActiveToolCalls((prev) => [...prev, consentClientTc]);
+                        } else {
+                          const clientToolCall = {
+                            id: parsed.tool_call_id || `tool-${Date.now()}`,
+                            name: parsed.tool_name,
+                            displayName: parsed.display_name || void 0,
+                            arguments: parsed.arguments || {},
+                            status: "executing",
+                            timestamp: /* @__PURE__ */ new Date()
+                          };
+                          streamingToolCallsRef.current = [...streamingToolCallsRef.current, clientToolCall];
+                          setActiveToolCalls((prev) => [...prev, clientToolCall]);
+                          pendingClientTools.push({
+                            toolName: parsed.tool_name,
+                            toolCallId: parsed.tool_call_id,
+                            arguments: parsed.arguments
+                          });
+                        }
+                      }
                       break;
                     case "tool_consent_required":
                       onToolCall?.({
@@ -720,21 +740,36 @@ function useChat({
                       break;
                     case "client_tool_call":
                       {
-                        const toolCallEntry = {
-                          id: parsed.tool_call_id || `tool-${Date.now()}`,
-                          name: parsed.tool_name,
-                          displayName: parsed.display_name || void 0,
-                          arguments: parsed.arguments || {},
-                          status: "executing",
-                          timestamp: /* @__PURE__ */ new Date()
-                        };
-                        streamingToolCallsRef.current = [...streamingToolCallsRef.current, toolCallEntry];
-                        setActiveToolCalls((prev) => [...prev, toolCallEntry]);
-                        pendingClientTools.push({
-                          toolName: parsed.tool_name,
-                          toolCallId: parsed.tool_call_id,
-                          arguments: parsed.arguments
-                        });
+                        const needsConsent2 = toolConsentSettingsRef.current?.[parsed.tool_name]?.requires_consent === true;
+                        if (needsConsent2) {
+                          const consentEntry2 = {
+                            id: parsed.tool_call_id || `tool-${Date.now()}`,
+                            name: parsed.tool_name,
+                            displayName: parsed.display_name || void 0,
+                            arguments: parsed.arguments || {},
+                            status: "awaiting_consent",
+                            requiresConsent: true,
+                            timestamp: /* @__PURE__ */ new Date()
+                          };
+                          streamingToolCallsRef.current = [...streamingToolCallsRef.current, consentEntry2];
+                          setActiveToolCalls((prev) => [...prev, consentEntry2]);
+                        } else {
+                          const toolCallEntry = {
+                            id: parsed.tool_call_id || `tool-${Date.now()}`,
+                            name: parsed.tool_name,
+                            displayName: parsed.display_name || void 0,
+                            arguments: parsed.arguments || {},
+                            status: "executing",
+                            timestamp: /* @__PURE__ */ new Date()
+                          };
+                          streamingToolCallsRef.current = [...streamingToolCallsRef.current, toolCallEntry];
+                          setActiveToolCalls((prev) => [...prev, toolCallEntry]);
+                          pendingClientTools.push({
+                            toolName: parsed.tool_name,
+                            toolCallId: parsed.tool_call_id,
+                            arguments: parsed.arguments
+                          });
+                        }
                       }
                       break;
                     case "tool_consent_required":
@@ -1501,6 +1536,9 @@ function useWidgetStyles({
   const [initialSuggestions, setInitialSuggestions] = useState(
     styleCache.get(key)?.initialSuggestions || []
   );
+  const [toolConsentSettings, setToolConsentSettings] = useState(
+    styleCache.get(key)?.toolConsentSettings || {}
+  );
   const [agentName, setAgentName] = useState(
     styleCache.get(key)?.agentName || "Assistant"
   );
@@ -1541,6 +1579,7 @@ function useWidgetStyles({
       setWelcomeMessage(config.welcomeMessage ?? void 0);
       setSelectedModel(config.model ?? void 0);
       setInitialSuggestions(config.initialSuggestions || []);
+      setToolConsentSettings(config.toolConsentSettings || {});
     } catch (err) {
       console.error("[CrowWidget] Failed to fetch styles:", err);
       setError(err instanceof Error ? err : new Error(String(err)));
@@ -1579,6 +1618,7 @@ function useWidgetStyles({
     welcomeMessage,
     selectedModel,
     initialSuggestions,
+    toolConsentSettings,
     refetch: fetchStyles
   };
 }
@@ -1614,6 +1654,9 @@ function useCopilotStyles({
   const [selectedModel, setSelectedModel] = useState(
     styleCache.get(key)?.model ?? void 0
   );
+  const [toolConsentSettings, setToolConsentSettings] = useState(
+    styleCache.get(key)?.toolConsentSettings || {}
+  );
   const hasFetchedRef = useRef(false);
   const fetchStyles = async () => {
     if (skip) return;
@@ -1630,6 +1673,7 @@ function useCopilotStyles({
       setPersistAnonymousConversations(config.persistAnonymousConversations ?? true);
       setWelcomeMessage(config.welcomeMessage ?? void 0);
       setSelectedModel(config.model ?? void 0);
+      setToolConsentSettings(config.toolConsentSettings || {});
     } catch (err) {
       console.error("[CrowCopilot] Failed to fetch styles:", err);
       setError(err instanceof Error ? err : new Error(String(err)));
@@ -1667,6 +1711,7 @@ function useCopilotStyles({
     persistAnonymousConversations,
     welcomeMessage,
     selectedModel,
+    toolConsentSettings,
     refetch: fetchStyles
   };
 }
@@ -1911,7 +1956,6 @@ function WidgetHeader({
   onNewChat,
   onToggleHistory,
   showMinimize = false,
-  isMinimized = false,
   onToggleMinimize
 }) {
   const { agentName, styles } = useWidgetStyleContext();
@@ -1933,7 +1977,7 @@ function WidgetHeader({
           }
         ) }),
         /* @__PURE__ */ jsxs("div", { className: "crow-flex crow-items-center crow-gap-1", children: [
-          /* @__PURE__ */ jsx(
+          isVerifiedUser ? /* @__PURE__ */ jsx(
             "button",
             {
               onClick: onNewChat,
@@ -1942,6 +1986,15 @@ function WidgetHeader({
               title: "New Chat",
               children: /* @__PURE__ */ jsx(Plus, { size: 18, className: "crow-text-gray-700" })
             }
+          ) : /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: onNewChat,
+              className: "crow-p-1.5 hover:crow-bg-gray-200 crow-rounded crow-transition-colors",
+              "aria-label": "Restart Chat",
+              title: "Restart Chat",
+              children: /* @__PURE__ */ jsx(RotateCcw, { size: 16, className: "crow-text-gray-700" })
+            }
           ),
           isVerifiedUser && /* @__PURE__ */ jsx(
             "button",
@@ -1957,9 +2010,10 @@ function WidgetHeader({
             "button",
             {
               onClick: onToggleMinimize,
-              className: "crow-p-1 hover:crow-bg-gray-200 crow-rounded crow-transition-colors",
-              "aria-label": isMinimized ? "Expand" : "Minimize",
-              children: isMinimized ? /* @__PURE__ */ jsx(ChevronUp, { size: 18, className: "crow-text-gray-900" }) : /* @__PURE__ */ jsx(ChevronDown, { size: 18, className: "crow-text-gray-900" })
+              className: "crow-p-1.5 hover:crow-bg-gray-200 crow-rounded crow-transition-colors",
+              "aria-label": "Close chat",
+              title: "Close chat",
+              children: /* @__PURE__ */ jsx(X, { size: 18, className: "crow-text-gray-700" })
             }
           )
         ] })
@@ -3322,7 +3376,8 @@ function CrowWidget({
     persistAnonymousConversations,
     welcomeMessage: welcomeMessageFromAPI,
     selectedModel: selectedModelFromAPI,
-    initialSuggestions
+    initialSuggestions,
+    toolConsentSettings
   } = useWidgetStyles({
     productId,
     apiUrl,
@@ -3365,6 +3420,7 @@ function CrowWidget({
     persistAnonymousConversations,
     welcomeMessage,
     selectedModel,
+    toolConsentSettings,
     onVerificationStatus: (isVerified) => {
       setIsVerifiedUser(isVerified);
     },
@@ -3667,14 +3723,47 @@ function CrowWidget({
   const handleToolConsent = async (toolCallId, approved) => {
     const toolCall = chat.activeToolCalls.find((tc) => tc.id === toolCallId) || chat.messages.flatMap((m) => m.toolCalls || []).find((tc) => tc.id === toolCallId);
     if (!toolCall) return;
+    const isClientSide = !toolCall.serverSideExecution;
     if (approved) {
       chat.updateToolCallStatus(toolCallId, "executing");
-      if (submitToolResultRef.current) {
-        await submitToolResultRef.current(
-          toolCallId,
-          toolCall.name,
-          { consent_approved: true, tool_arguments: toolCall.arguments || {} }
-        );
+      if (isClientSide) {
+        try {
+          const result = await executeClientToolRef.current?.(
+            toolCall.name,
+            toolCall.arguments || {}
+          );
+          const resultObj = result;
+          const dataObj = resultObj?.data;
+          const wasUserCancelled = dataObj?.declined === true || typeof resultObj?.error === "string" && resultObj.error.includes("cancelled by user") || typeof resultObj?.error === "string" && resultObj.error.includes("declined");
+          if (wasUserCancelled) {
+            console.log("[Crow Widget] Tool was cancelled by user after consent");
+            return;
+          }
+          if (result && submitToolResultRef.current) {
+            await submitToolResultRef.current(
+              toolCallId,
+              toolCall.name,
+              result
+            );
+          }
+        } catch (e) {
+          console.error("[Crow Widget] Tool error after consent:", e);
+          if (submitToolResultRef.current) {
+            await submitToolResultRef.current(
+              toolCallId,
+              toolCall.name,
+              { success: false, error: String(e) }
+            );
+          }
+        }
+      } else {
+        if (submitToolResultRef.current) {
+          await submitToolResultRef.current(
+            toolCallId,
+            toolCall.name,
+            { consent_approved: true, tool_arguments: toolCall.arguments || {} }
+          );
+        }
       }
     } else {
       chat.updateToolCallStatus(toolCallId, "denied");
@@ -3722,7 +3811,9 @@ function CrowWidget({
         isVerifiedUser,
         showConversationList,
         onNewChat: handleNewChat,
-        onToggleHistory: handleToggleHistory
+        onToggleHistory: handleToggleHistory,
+        showMinimize: variant === "floating",
+        onToggleMinimize: () => setIsCollapsed(true)
       }
     ),
     /* @__PURE__ */ jsx(AnimatePresence, { children: showConversationList && isVerifiedUser && /* @__PURE__ */ jsx(
@@ -4103,7 +4194,8 @@ function CrowCopilot({
     pageNavigationRoutes,
     persistAnonymousConversations,
     welcomeMessage: welcomeMessageFromAPI,
-    selectedModel
+    selectedModel,
+    toolConsentSettings
   } = useCopilotStyles({
     productId,
     apiUrl,
@@ -4294,6 +4386,7 @@ function CrowCopilot({
     persistAnonymousConversations,
     welcomeMessage,
     selectedModel,
+    toolConsentSettings,
     onVerificationStatus: (isVerified) => {
       setIsVerifiedUser(isVerified);
     },
@@ -4492,14 +4585,54 @@ function CrowCopilot({
   const handleToolConsent = async (toolCallId, approved) => {
     const toolCall = chat.activeToolCalls.find((tc) => tc.id === toolCallId) || chat.messages.flatMap((m) => m.toolCalls || []).find((tc) => tc.id === toolCallId);
     if (!toolCall) return;
+    const isClientSide = !toolCall.serverSideExecution;
     if (approved) {
       chat.updateToolCallStatus(toolCallId, "executing");
-      if (submitToolResultRef.current) {
-        await submitToolResultRef.current(
-          toolCallId,
-          toolCall.name,
-          { consent_approved: true, tool_arguments: toolCall.arguments || {} }
-        );
+      if (isClientSide) {
+        try {
+          const result = await executeClientToolRef.current?.(
+            toolCall.name,
+            toolCall.arguments || {}
+          );
+          const resultObj = result;
+          const dataObj = resultObj?.data;
+          const wasUserCancelled = dataObj?.declined === true || typeof resultObj?.error === "string" && resultObj.error.includes("cancelled by user") || typeof resultObj?.error === "string" && resultObj.error.includes("declined");
+          if (wasUserCancelled) {
+            console.log("[Crow Copilot] Tool was cancelled by user after consent");
+            if (submitToolResultRef.current) {
+              await submitToolResultRef.current(
+                toolCallId,
+                toolCall.name,
+                { success: false, cancelled: true, error: "Action was cancelled by the user." }
+              );
+            }
+            return;
+          }
+          if (result && submitToolResultRef.current) {
+            await submitToolResultRef.current(
+              toolCallId,
+              toolCall.name,
+              result
+            );
+          }
+        } catch (e) {
+          console.error("[Crow Copilot] Tool error after consent:", e);
+          if (submitToolResultRef.current) {
+            await submitToolResultRef.current(
+              toolCallId,
+              toolCall.name,
+              { success: false, error: String(e) }
+            );
+          }
+        }
+      } else {
+        if (submitToolResultRef.current) {
+          await submitToolResultRef.current(
+            toolCallId,
+            toolCall.name,
+            { consent_approved: true, tool_arguments: toolCall.arguments || {} }
+          );
+        }
       }
     } else {
       chat.updateToolCallStatus(toolCallId, "denied");