@cmnd-ai/chatbot-react 1.10.0 → 1.14.0

package/Readme.md

@@ -117,6 +117,110 @@ const App = () => {
 };
 ```
 
+## Headless Usage with `useCMNDChat` Hook
+
+If you want complete control over your UI while maintaining the powerful chatbot logic, you can use the `useCMNDChat` hook. It handles all state management, real-time streaming, conversation history, and tool orchestration.
+
+```tsx
+import { useCMNDChat, MessageRole } from "@cmnd-ai/chatbot-react";
+
+const MyCustomChat = () => {
+  const {
+    messages,
+    input,
+    setInput,
+    isChatLoading,
+    canSendMessage,
+    sendMessage,
+    submitToolResult,
+    conversations,
+    handleNewChat,
+    handleConversationSelect,
+    error,
+  } = useCMNDChat({
+    chatbotId: 123,
+    organizationId: 456,
+    baseUrl: "https://api.cmnd.ai",
+    apiKey: "your-api-key",
+    cleanResponse: true, // Optional: Returns assistant messages as plaintext
+    onData: (data) => console.log("Stream update:", data),
+    onToolCall: async (tool) => {
+      console.log("AI called tool:", tool.name);
+
+      // For UI tools, you must execute and call submitToolResult
+      if (tool.name === "my_custom_tool") {
+        const result = await runMyTool(tool.args);
+        submitToolResult(JSON.stringify(result));
+      }
+    },
+  });
+
+  return (
+    <div className="custom-chat">
+      <div className="message-list">
+        {messages.map((m) => (
+          <div key={m.id} className={`message ${m.role}`}>
+            {m.role === MessageRole.ASSISTANT ? "🤖" : "👤"}: {m.message}
+            {/* Handle tool calls */}
+            {m.role === MessageRole.FUNCTION && (
+              <div className="tool-ui">
+                Rendering Tool: {m.tool.name}
+                {/* Once done, call submitToolResult("result") */}
+              </div>
+            )}
+          </div>
+        ))}
+      </div>
+
+      <div className="controls">
+        <input
+          value={input}
+          onChange={(e) => setInput(e.target.value)}
+          placeholder="Type here..."
+        />
+        <button onClick={() => sendMessage()}>Send</button>
+        <button onClick={handleNewChat}>Clear Chat</button>
+      </div>
+    </div>
+  );
+};
+```
+
+### Hook API Reference
+
+#### `UseCMNDChatOptions`
+
+| Option           | Type                  | Description                                                                |
+| ---------------- | --------------------- | -------------------------------------------------------------------------- |
+| `chatbotId`      | `number`              | **Required**. Your unique chatbot ID.                                      |
+| `organizationId` | `number`              | **Required**. Your unique organization ID.                                 |
+| `baseUrl`        | `string`              | **Required**. The CMND API base URL.                                       |
+| `apiKey`         | `string`              | Optional API key for authentication.                                       |
+| `initialMemory`  | `object`              | Context to send when starting a new conversation.                          |
+| `UITools`        | `CMNDChatbotUITool[]` | Array of custom UI tools.                                                  |
+| `onData`         | `function`            | Triggered for every response chunk or message update.                      |
+| `onToolCall`     | `function`            | Triggered when the AI requests a tool execution.                           |
+| `cleanResponse`  | `boolean`             | If `true`, assistant messages are returned as plaintext. Default: `false`. |
+
+#### `UseCMNDChatResult`
+
+| Property                   | Type                    | Description                                               |
+| -------------------------- | ----------------------- | --------------------------------------------------------- |
+| `messages`                 | `Message[]`             | Array of all messages in the current conversation thread. |
+| `input`                    | `string`                | The current text in the chat input.                       |
+| `setInput`                 | `function`              | Update the chat input text.                               |
+| `isChatLoading`            | `boolean`               | True if a message is being generated or tool is running.  |
+| `canSendMessage`           | `boolean`               | True if the system is ready to receive the next message.  |
+| `sendMessage`              | `(text?) => Promise`    | Send a message. Uses `input` if `text` is omitted.        |
+| `submitToolResult`         | `(output) => Promise`   | Submit results from a UI tool back to the AI.             |
+| `conversations`            | `ChatbotConversation[]` | List of historical conversations.                         |
+| `selectedConversation`     | `ChatbotConversation`   | The currently active conversation metadata.               |
+| `handleNewChat`            | `function`              | Starts a fresh conversation thread.                       |
+| `handleConversationSelect` | `function`              | Loads a specific conversation from history.               |
+| `handleDeleteConversation` | `function`              | Deletes a conversation from history.                      |
+| `tools`                    | `any[]`                 | All available tools (API + UI).                           |
+| `error`                    | `string`                | Contains description of any API or processing errors.     |
+
 ## Props
 
 ### Required Props
@@ -130,15 +234,15 @@ const App = () => {
 
 ### Optional Props
 
-| Prop                    | Type                  | Default     | Description                                           |
-| ----------------------- | --------------------- | ----------- | ----------------------------------------------------- |
-| `theme`                 | `"light" \| "dark"`   | `"light"`   | Theme for the chatbot                                 |
-| `UITools`               | `CMNDChatbotUITool[]` | `[]`        | Array of UI tools                                     |
-| `enabledTools`          | `any[]`               | `[]`        | Array of enabled tools                                |
-| `initialMemory`         | `CMNDChatMemory`      | `undefined` | Initial conversation memory                           |
-| `customStyles`          | `CustomStyles`        | `undefined` | Custom CSS styles                                     |
-| `Components`            | `Components`          | `undefined` | Custom component overrides                            |
-| `chatHistoryStorageKey` | `string`              | `undefined` | The chat history key defined by the client            |
+| Prop                    | Type                  | Default     | Description                                |
+| ----------------------- | --------------------- | ----------- | ------------------------------------------ |
+| `theme`                 | `"light" \| "dark"`   | `"light"`   | Theme for the chatbot                      |
+| `UITools`               | `CMNDChatbotUITool[]` | `[]`        | Array of UI tools                          |
+| `enabledTools`          | `any[]`               | `[]`        | Array of enabled tools                     |
+| `initialMemory`         | `CMNDChatMemory`      | `undefined` | Initial conversation memory                |
+| `customStyles`          | `CustomStyles`        | `undefined` | Custom CSS styles                          |
+| `Components`            | `Components`          | `undefined` | Custom component overrides                 |
+| `chatHistoryStorageKey` | `string`              | `undefined` | The chat history key defined by the client |
 
 ## Custom Components
 

package/dist/ChatProvider/index.d.ts

@@ -5,7 +5,7 @@ export declare const ChatProviderContext: React.Context<CmndChatContext | undefi
 export interface ChatProviderProps extends Omit<CmndChatBotProps, "postSessionMessage"> {
     children?: React.ReactNode | ((props: CmndChatBotProps) => React.ReactNode);
 }
-export declare const setCurrentConversationMemory: (memory: CMNDChatMemory) => Promise<import("axios").AxiosResponse<any, any> | undefined>;
-export declare const deleteCurrentConversationMemory: (memoryKeyToDelete: string) => Promise<import("axios").AxiosResponse<any, any> | undefined>;
+export declare const setCurrentConversationMemory: (memory: CMNDChatMemory) => Promise<import("axios").AxiosResponse<any, any, {}> | undefined>;
+export declare const deleteCurrentConversationMemory: (memoryKeyToDelete: string) => Promise<import("axios").AxiosResponse<any, any, {}> | undefined>;
 declare function ChatProvider(props: ChatProviderProps): JSX.Element | null;
 export default ChatProvider;

package/dist/ChatProvider/index.js

@@ -7,6 +7,8 @@ import deleteChatbotConversationMemory from "../services/deleteChatbotConversati
 import parseUITools from "../utils/parseUITools.js";
 import getTools from "../utils/getTools/index.js";
 import { ConversationsPanel, } from "../components/ConversationsPanel/index.js";
+import socketService from "../services/socketService.js";
+import { SOCKET_EVENTS } from "../constants/socketEvents.js";
 let globalChatbotConversationRef;
 let globalChatbotProps;
 export const ChatProviderContext = React.createContext(undefined);
@@ -64,7 +66,26 @@ function ChatProvider(props) {
     const conversationsPanelRef = useRef(null);
     useEffect(() => {
         globalChatbotConversationRef = chatbotConversationRef;
+        if (chatbotConversationRef && socketService.isConnected()) {
+            socketService.getSocket()?.emit(SOCKET_EVENTS.JOIN_CHATBOT_CONVERSATION, {
+                chatbotConversationRef,
+            });
+        }
     }, [chatbotConversationRef]);
+    const [isConnected, setIsConnected] = useState(false);
+    useEffect(() => {
+        const socket = socketService.connect(baseUrl);
+        const handleConnect = () => setIsConnected(true);
+        const handleDisconnect = () => setIsConnected(false);
+        socket.on(SOCKET_EVENTS.CONNECT, handleConnect);
+        socket.on(SOCKET_EVENTS.DISCONNECT, handleDisconnect);
+        setIsConnected(socket.connected);
+        return () => {
+            socket.off(SOCKET_EVENTS.CONNECT, handleConnect);
+            socket.off(SOCKET_EVENTS.DISCONNECT, handleDisconnect);
+            socketService.disconnect();
+        };
+    }, [baseUrl]);
     useEffect(() => {
         setLoading(true);
         getEmbedChatBotById(baseUrl, organizationId, chatbotId)
@@ -171,6 +192,8 @@ function ChatProvider(props) {
             closeSidePanel,
             setMessageText,
             sendMessage,
+            socket: socketService.getSocket(),
+            isConnected,
         }, children: error ? (_jsx("div", { children: "An error occured" })) : (_jsxs(_Fragment, { children: [props.children, _jsx(ConversationsPanel, { ref: conversationsPanelRef, organizationId: organizationId, chatbotId: chatbotId, baseUrl: baseUrl, chatHistoryStorageKey: props.chatHistoryStorageKey, theme: props.theme, enabledTools: getTools({
                         apiTools: enabledTools,
                         uiTools: parseUITools(UITools),

package/dist/ChatProvider/processStream/index.js

@@ -3,6 +3,7 @@ const processStream = async (reader, onData) => {
     if (!onData)
         return;
     let fullAssistantMessage = "";
+    let functionName = "";
     let buffer = ""; // buffer to store incomplete JSON string fragments
     try {
         while (true) {
@@ -44,17 +45,31 @@ const processStream = async (reader, onData) => {
                         });
                     }
                     else if (dataObject.function_call) {
-                        // console.log("no processing necessary");
+                        const { name } = dataObject.function_call;
+                        if (name)
+                            functionName = name;
+                        onData({
+                            completionFinished: false,
+                            finalResponseWithUsageData: false,
+                            streamingFunctionCall: true,
+                            functionName,
+                        });
+                    }
+                    else if (dataObject.function_result) {
+                        onData({
+                            completionFinished: false,
+                            finalResponseWithUsageData: false,
+                            streamingFunctionCall: false,
+                            functionResult: dataObject.function_result,
+                        });
                     }
                     else {
-                        //at this point, the dataObject does not have a content propery
-                        //and it is completed
-                        //get the last message from the dataObject to check if it is a function call
-                        const { messages, completionFinished, finalResponseWithUsageData, chatbotConversationRef, totalTokens, totalCost, } = dataObject;
+                        const { messages, completionFinished, finalResponseWithUsageData, conversationRef, chatbotConversationRef, totalTokens, totalCost, } = dataObject;
                         onData({
                             messages,
                             completionFinished,
                             finalResponseWithUsageData,
+                            conversationRef,
                             chatbotConversationRef,
                             totalTokens,
                             totalCost,
@@ -68,13 +83,23 @@ const processStream = async (reader, onData) => {
                         continue;
                     }
                     console.error("StreamError caught", error);
-                    onData({
-                        completionFinished: true,
-                        message: error instanceof StreamError
-                            ? error.message
-                            : "Oops! I ran into a problem.",
-                        finalResponseWithUsageData: true,
-                    });
+                    if (error instanceof StreamError) {
+                        onData({
+                            completionFinished: true,
+                            message: error.message,
+                            finalResponseWithUsageData: true,
+                            hasError: true,
+                            errorPath: error.path,
+                        });
+                    }
+                    else {
+                        onData({
+                            completionFinished: true,
+                            message: "Oops! I ran into a problem.",
+                            finalResponseWithUsageData: true,
+                            hasError: true,
+                        });
+                    }
                 }
             }
         }
@@ -84,11 +109,12 @@ const processStream = async (reader, onData) => {
         }
     }
     catch (error) {
-        console.error("Error processing stream", error);
+        console.error("Fatal error in processStream", error);
         onData({
             completionFinished: true,
             message: "Oops! I ran into a problem.",
             finalResponseWithUsageData: true,
+            hasError: true,
         });
     }
 };

package/dist/CmndChatBot/index.d.ts

@@ -20,6 +20,7 @@ export interface CmndChatBotProps {
         LoadingIndicator?: () => JSX.Element;
         error?: any;
     };
+    cleanResponse?: boolean;
 }
-declare function CmndChatBot({ chatbotId, organizationId, apiKey, baseUrl, theme, UITools, customStyles, chatHistoryStorageKey, enabledTools, Components, initialMemory, }: CmndChatBotProps): JSX.Element;
+declare function CmndChatBot({ chatbotId, organizationId, apiKey, baseUrl, theme, UITools, customStyles, chatHistoryStorageKey, enabledTools, Components, initialMemory, cleanResponse, }: CmndChatBotProps): JSX.Element;
 export default CmndChatBot;

package/dist/CmndChatBot/index.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import ChatProvider from "../ChatProvider/index.js";
-function CmndChatBot({ chatbotId, organizationId, apiKey, baseUrl, theme, UITools, customStyles, chatHistoryStorageKey, enabledTools = [], Components, initialMemory, }) {
-    return (_jsx(ChatProvider, { chatbotId: chatbotId, organizationId: organizationId, chatHistoryStorageKey: chatHistoryStorageKey, apiKey: apiKey, baseUrl: baseUrl, theme: theme, UITools: UITools, customStyles: customStyles, enabledTools: enabledTools, Components: Components, initialMemory: initialMemory }));
+function CmndChatBot({ chatbotId, organizationId, apiKey, baseUrl, theme, UITools, customStyles, chatHistoryStorageKey, enabledTools = [], Components, initialMemory, cleanResponse, }) {
+    return (_jsx(ChatProvider, { chatbotId: chatbotId, organizationId: organizationId, chatHistoryStorageKey: chatHistoryStorageKey, apiKey: apiKey, baseUrl: baseUrl, theme: theme, UITools: UITools, customStyles: customStyles, enabledTools: enabledTools, Components: Components, initialMemory: initialMemory, cleanResponse: cleanResponse }));
 }
 export default CmndChatBot;

package/dist/components/ConversationsPanel/index.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState, useEffect, forwardRef, useImperativeHandle, } from "react";
+import React, { useState, useEffect, forwardRef, useImperativeHandle, useCallback, } from "react";
 import useFetchData from "../../hooks/use-fetch-data.js";
 import getChatBotConversationsList from "../../services/getChatBotConversationsList/index.js";
 import Conversation from "../Conversation.js";
@@ -11,6 +11,8 @@ import saveConversationIdToLocalStorage from "../../utils/saveConversationIdToLo
 import getUTCDateTime from "../../utils/getUTCDateTime/index.js";
 import useMessagesScroll from "../../hooks/use-messages-scroll.js";
 import { v4 as uuidv4 } from "uuid";
+import { useSocket } from "../../hooks/use-socket.js";
+import { SOCKET_MESSAGE_TYPES } from "../../constants/socketEvents.js";
 export const ConversationsPanel = forwardRef(({ organizationId, chatbotId, baseUrl, chatHistoryStorageKey, theme = "light", enabledTools = [], setChatbotConversationRef, chatbotConversationRef, postSessionMessage, Components, UITools, customStyles, isSidebarCollapsed, setIsSidebarCollapsed, selectedConversation, setSelectedConversation, messages, setMessages, input, setInput, inputRef, }, ref) => {
     const [isChatLoading, setIsChatLoading] = useState(false);
     const [canSendMessage, setCanSendMessage] = useState(true);
@@ -98,6 +100,41 @@ export const ConversationsPanel = forwardRef(({ organizationId, chatbotId, baseU
             return { chatbotConversations: [] };
         }
     }, [organizationId, chatbotId, conversationIds, baseUrl]);
+    // Socket message handler
+    const handleSocketMessage = useCallback((notification) => {
+        console.log("chatbot notification", notification);
+        if (notification.type === SOCKET_MESSAGE_TYPES.NEW_HUMAN_INBOX_MESSAGE &&
+            notification.chatbotConversationRef === chatbotConversationRef) {
+            setMessages((prev) => {
+                if (prev.some((m) => m.id === notification.message.id))
+                    return prev;
+                return [...prev, notification.message];
+            });
+            resetMessagesScroll();
+        }
+        else if (notification.type === SOCKET_MESSAGE_TYPES.HUMAN_AGENT_JOINED &&
+            notification.chatbotConversationRef === chatbotConversationRef) {
+            // Add a system message to indicate human agent joined
+            const agentName = notification.agentName || "A human agent";
+            const systemMessage = {
+                id: `system-${notification.timestamp}`,
+                role: "assistant",
+                message: `${agentName} has joined the conversation`,
+                unuseful: false,
+                hiddenFromUser: false,
+            };
+            setMessages((prev) => [...prev, systemMessage]);
+            resetMessagesScroll();
+        }
+    }, [chatbotConversationRef, resetMessagesScroll]);
+    // Socket connection
+    useSocket({
+        baseUrl,
+        accessToken: null,
+        chatbotConversationRef,
+        onMessage: handleSocketMessage,
+        enabled: Boolean(chatbotConversationRef),
+    });
     const handleSendClick = () => {
         if (!input.trim() || !canSendMessage)
             return;

package/dist/constants/socketEvents.d.ts

@@ -0,0 +1,14 @@
+export declare const SOCKET_EVENTS: {
+    readonly MESSAGE: "message";
+    readonly CONNECT: "connect";
+    readonly DISCONNECT: "disconnect";
+    readonly ERROR: "error";
+    readonly JOIN_CHATBOT_CONVERSATION: "join_chatbot_conversation";
+};
+export declare const SOCKET_MESSAGE_TYPES: {
+    readonly NEW_HUMAN_INBOX_MESSAGE: "NEW_HUMAN_INBOX_MESSAGE";
+    readonly HUMAN_AGENT_JOINED: "HUMAN_AGENT_JOINED";
+    readonly HANDOVER_REQUEST: "HANDOVER_REQUEST";
+};
+export type SocketEvent = (typeof SOCKET_EVENTS)[keyof typeof SOCKET_EVENTS];
+export type SocketMessageType = (typeof SOCKET_MESSAGE_TYPES)[keyof typeof SOCKET_MESSAGE_TYPES];

package/dist/constants/socketEvents.js

@@ -0,0 +1,12 @@
+export const SOCKET_EVENTS = {
+    MESSAGE: "message",
+    CONNECT: "connect",
+    DISCONNECT: "disconnect",
+    ERROR: "error",
+    JOIN_CHATBOT_CONVERSATION: "join_chatbot_conversation",
+};
+export const SOCKET_MESSAGE_TYPES = {
+    NEW_HUMAN_INBOX_MESSAGE: "NEW_HUMAN_INBOX_MESSAGE",
+    HUMAN_AGENT_JOINED: "HUMAN_AGENT_JOINED",
+    HANDOVER_REQUEST: "HANDOVER_REQUEST",
+};

package/dist/hooks/use-cmnd-chat.d.ts

@@ -0,0 +1,130 @@
+/// <reference types="react" />
+import { ChatbotConversation, Message, CMNDChatMemory, CMNDChatbotUITool, ConversationDataObject, ToolDetails } from "../type.js";
+/**
+ * Options for configuring the useCMNDChat hook.
+ */
+export interface UseCMNDChatOptions {
+    /** The unique identifier for the chatbot. */
+    chatbotId: number;
+    /** The unique identifier for the organization. */
+    organizationId: number;
+    /** The base URL for the CMND API. */
+    baseUrl: string;
+    /** Optional API key for authentication. If provided, it will be sent in the 'x-api-key' header. */
+    apiKey?: string;
+    /** Optional key used for local message persistence. Defaults to a combined string of orgId and chatbotId. */
+    chatHistoryStorageKey?: string;
+    /** Initial memory/context to send when starting a new conversation. */
+    initialMemory?: CMNDChatMemory;
+    /** Array of custom UI tools that the AI can call. */
+    UITools?: CMNDChatbotUITool[];
+    /** Callback triggered whenever new data (chunks or finalized messages) is received from the stream. */
+    onData?: (data: ConversationDataObject) => void;
+    /**
+     * Callback triggered whenever the AI initiates a tool call.
+     *
+     * For **backend tools**: The hook automatically confirms them, which triggers your backend server
+     * to execute the tool and return the output. Use this callback for logging or UI updates.
+     *
+     * For **UI tools**: You must execute the tool in your frontend, then call submitToolResult with the output.
+     *
+     * @example
+     * ```tsx
+     * onToolCall: async (toolDetails) => {
+     *   if (toolDetails.name === 'show_ui_component') {
+     *     // UI tool - execute in frontend
+     *     displayComponent(toolDetails.args);
+     *     submitToolResult('Component displayed');
+     *   }
+     *   // Backend tools are handled automatically by the server
+     * }
+     * ```
+     */
+    onToolCall?: (toolCall: ToolDetails) => void;
+    /**
+     * Whether to clean the AI response by removing markdown characters.
+     * If true, assistant messages will be returned as plaintext.
+     * @default false
+     */
+    cleanResponse?: boolean;
+}
+/**
+ * The object returned by the useCMNDChat hook.
+ */
+export interface UseCMNDChatResult {
+    /** The list of messages in the current active conversation thread. */
+    messages: Message[];
+    /** A setter function for the messages list. */
+    setMessages: React.Dispatch<React.SetStateAction<Message[]>>;
+    /** The current text value of the chat input field. */
+    input: string;
+    /** A setter function for the chat input field. */
+    setInput: React.Dispatch<React.SetStateAction<string>>;
+    /** Indicates if a message is currently being processed or streamed. */
+    isChatLoading: boolean;
+    /** Indicates if the user is allowed to send a message (e.g., not loading, not empty). */
+    canSendMessage: boolean;
+    /**
+     * Sends a message to the chatbot.
+     * @param text Optional text to send. If not provided, it uses the current 'input' state.
+     * @param onData Optional callback for this specific message stream.
+     */
+    sendMessage: (text?: string, onData?: (data: ConversationDataObject) => void) => Promise<void>;
+    /**
+     * Submits the result of a tool call back to the AI.
+     * @param toolOutput The string result of the tool execution.
+     * @param onData Optional callback for the resulting message stream.
+     */
+    submitToolResult: (toolOutput: string, onData?: (data: ConversationDataObject) => void) => Promise<void>;
+    /** The reference ID for the current active conversation. */
+    chatbotConversationRef: string | undefined;
+    /** A list of all historical conversations for the current chatbot/org. */
+    conversations: ChatbotConversation[];
+    /** The currently selected conversation object from history. */
+    selectedConversation: ChatbotConversation | null;
+    /** Resets the chat state and prepares for a new conversation thread. */
+    handleNewChat: () => void;
+    /**
+     * Switches to an existing conversation from history.
+     * @param conversation The conversation object to load.
+     */
+    handleConversationSelect: (conversation: ChatbotConversation) => void;
+    /**
+     * Deletes a conversation from history and local storage.
+     * @param conversationId The ID of the conversation to delete.
+     */
+    handleDeleteConversation: (conversationId: string) => Promise<void>;
+    /** Re-fetches the list of historical conversations. */
+    refreshConversations: () => Promise<void>;
+    /** Combined list of backend tools (from API) and UI tools (provided in options). */
+    tools: any[];
+    /** Holds any error message encountered during API calls. */
+    error: string | null;
+}
+/**
+ * A comprehensive hook to manage CMND.AI chatbot logic without being forced to use the default UI.
+ * This hook handles conversation state, message sending (including streaming), history management, and tool call orchestration.
+ *
+ * @example
+ * ```tsx
+ * const { messages, sendMessage, input, setInput, submitToolResult } = useCMNDChat({
+ *   chatbotId: 1,
+ *   organizationId: 1,
+ *   baseUrl: 'https://api.cmnd.ai',
+ *   cleanResponse: true, // Optional: Returns assistant messages as plaintext
+ *   onToolCall: async (toolDetails) => {
+ *     // Backend tools are auto-confirmed by the hook
+ *     if (toolDetails.name === 'get_playlists') {
+ *       console.log('Fetching playlists from backend...');
+ *     }
+ *
+ *     // UI tools need manual execution and confirmation
+ *     if (toolDetails.name === 'show_notification') {
+ *       showNotification(toolDetails.args.message);
+ *       submitToolResult('Notification displayed');
+ *     }
+ *   }
+ * });
+ * ```
+ */
+export declare const useCMNDChat: (options: UseCMNDChatOptions) => UseCMNDChatResult;