@copilotkit/react-core

Version:

github.com/CopilotKit/CopilotKit

CopilotKit/CopilotKit

1 lines • 10.3 kB

Source Map (JSON)

View Raw

{"version":3,"sources":["../src/hooks/use-copilot-chat-headless_c.ts"],"sourcesContent":["/**\n * `useCopilotChatHeadless_c` is for building fully custom UI (headless UI) implementations.\n *\n * <Callout title=\"This is a premium-only feature\">\n * Sign up for free on [Copilot Cloud](https://cloud.copilotkit.ai) to get your public license key or read more about <a href=\"/premium/overview\">premium features</a>.\n *\n * Usage is generous, **free** to get started, and works with **either self-hosted or Copilot Cloud** environments.\n * </Callout>\n *\n * ## Key Features\n *\n * - **Fully headless**: Build your own fully custom UI's for your agentic applications.\n * - **Advanced Suggestions**: Direct access to suggestions array with full control\n * - **Interrupt Handling**: Support for advanced interrupt functionality\n * - **MCP Server Support**: Model Context Protocol server configurations\n * - **Chat Controls**: Complete set of chat management functions\n * - **Loading States**: Comprehensive loading state management\n *\n *\n * ## Usage\n *\n * ### Basic Setup\n *\n * ```tsx\n * import { CopilotKit } from \"@copilotkit/react-core\";\n * import { useCopilotChatHeadless_c } from \"@copilotkit/react-core\";\n *\n * export function App() {\n * return (\n * <CopilotKit publicApiKey=\"your-free-public-license-key\">\n * <YourComponent />\n * </CopilotKit>\n * );\n * }\n *\n * export function YourComponent() {\n * const { messages, sendMessage, isLoading } = useCopilotChatHeadless_c();\n *\n * const handleSendMessage = async () => {\n * await sendMessage({\n * id: \"123\",\n * role: \"user\",\n * content: \"Hello World\",\n * });\n * };\n *\n * return (\n * <div>\n * {messages.map(msg => <div key={msg.id}>{msg.content}</div>)}\n * <button onClick={handleSendMessage} disabled={isLoading}>\n * Send Message\n * </button>\n * </div>\n * );\n * }\n * ```\n *\n * ### Working with Suggestions\n *\n * ```tsx\n * import { useCopilotChatHeadless_c, useCopilotChatSuggestions } from \"@copilotkit/react-core\";\n *\n * export function SuggestionExample() {\n * const {\n * suggestions,\n * setSuggestions,\n * generateSuggestions,\n * isLoadingSuggestions\n * } = useCopilotChatHeadless_c();\n *\n * // Configure AI suggestion generation\n * useCopilotChatSuggestions({\n * instructions: \"Suggest helpful actions based on the current context\",\n * maxSuggestions: 3\n * });\n *\n * return (\n * <div>\n * {suggestions.map(suggestion => (\n * <button key={suggestion.title}>{suggestion.title}</button>\n * ))}\n * <button onClick={generateSuggestions} disabled={isLoadingSuggestions}>\n * Generate Suggestions\n * </button>\n * </div>\n * );\n * }\n * ```\n *\n * ## Return Values\n * The following properties are returned from the hook:\n *\n * <PropertyReference name=\"messages\" type=\"Message[]\">\n * The messages currently in the chat in AG-UI format\n * </PropertyReference>\n *\n * <PropertyReference name=\"sendMessage\" type=\"(message: Message, options?) => Promise<void>\">\n * Send a new message to the chat and trigger AI response\n * </PropertyReference>\n *\n * <PropertyReference name=\"setMessages\" type=\"(messages: Message[] | DeprecatedGqlMessage[]) => void\">\n * Replace all messages in the chat with new array\n * </PropertyReference>\n *\n * <PropertyReference name=\"deleteMessage\" type=\"(messageId: string) => void\">\n * Remove a specific message by ID from the chat\n * </PropertyReference>\n *\n * <PropertyReference name=\"reloadMessages\" type=\"(messageId: string) => Promise<void>\">\n * Regenerate the response for a specific message by ID\n * </PropertyReference>\n *\n * <PropertyReference name=\"stopGeneration\" type=\"() => void\">\n * Stop the current message generation process\n * </PropertyReference>\n *\n * <PropertyReference name=\"reset\" type=\"() => void\">\n * Clear all messages and reset chat state completely\n * </PropertyReference>\n *\n * <PropertyReference name=\"isLoading\" type=\"boolean\">\n * Whether the chat is currently generating a response\n * </PropertyReference>\n *\n * <PropertyReference name=\"runChatCompletion\" type=\"() => Promise<Message[]>\">\n * Manually trigger chat completion for advanced usage\n * </PropertyReference>\n *\n * <PropertyReference name=\"mcpServers\" type=\"MCPServerConfig[]\">\n * Array of Model Context Protocol server configurations\n * </PropertyReference>\n *\n * <PropertyReference name=\"setMcpServers\" type=\"(servers: MCPServerConfig[]) => void\">\n * Update MCP server configurations for enhanced context\n * </PropertyReference>\n *\n * <PropertyReference name=\"suggestions\" type=\"SuggestionItem[]\">\n * Current suggestions array for reading or manual control\n * </PropertyReference>\n *\n * <PropertyReference name=\"setSuggestions\" type=\"(suggestions: SuggestionItem[]) => void\">\n * Manually set suggestions for custom workflows\n * </PropertyReference>\n *\n * <PropertyReference name=\"generateSuggestions\" type=\"() => Promise<void>\">\n * Trigger AI-powered suggestion generation using configured settings\n * </PropertyReference>\n *\n * <PropertyReference name=\"resetSuggestions\" type=\"() => void\">\n * Clear all current suggestions and reset generation state\n * </PropertyReference>\n *\n * <PropertyReference name=\"isLoadingSuggestions\" type=\"boolean\">\n * Whether suggestions are currently being generated\n * </PropertyReference>\n *\n * <PropertyReference name=\"interrupt\" type=\"string | React.ReactElement | null\">\n * Interrupt content for human-in-the-loop workflows\n * </PropertyReference>\n */\nimport { useEffect } from \"react\";\nimport { useCopilotContext } from \"../context/copilot-context\";\nimport {\n useCopilotChat as useCopilotChatInternal,\n defaultSystemMessage,\n UseCopilotChatOptions as UseCopilotChatOptions_c,\n UseCopilotChatReturn as UseCopilotChatReturn_c,\n MCPServerConfig,\n} from \"./use-copilot-chat_internal\";\n\nimport {\n ErrorVisibility,\n Severity,\n CopilotKitError,\n CopilotKitErrorCode,\n styledConsole,\n} from \"@copilotkit/shared\";\n\n// Non-functional fallback implementation\nconst createNonFunctionalReturn = (): UseCopilotChatReturn_c => ({\n visibleMessages: [],\n messages: [],\n sendMessage: async () => {},\n appendMessage: async () => {},\n setMessages: () => {},\n deleteMessage: () => {},\n reloadMessages: async () => {},\n stopGeneration: () => {},\n reset: () => {},\n isLoading: false,\n runChatCompletion: async () => [],\n mcpServers: [],\n setMcpServers: () => {},\n suggestions: [],\n setSuggestions: () => {},\n generateSuggestions: async () => {},\n resetSuggestions: () => {},\n isLoadingSuggestions: false,\n interrupt: null,\n});\n/**\n * Enterprise React hook that provides complete chat functionality for fully custom UI implementations.\n * Includes all advanced features like direct message access, suggestions array, interrupt handling, and MCP support.\n *\n * **Requires a publicApiKey** - Sign up for free at https://cloud.copilotkit.ai/\n *\n * @param options - Configuration options for the chat\n * @returns Complete chat interface with all enterprise features\n *\n * @example\n * ```tsx\n * const { messages, sendMessage, suggestions, interrupt } = useCopilotChatHeadless_c();\n * ```\n */\nfunction useCopilotChatHeadless_c(options: UseCopilotChatOptions_c = {}): UseCopilotChatReturn_c {\n const { copilotApiConfig, setBannerError } = useCopilotContext();\n\n // Check if publicApiKey is available\n const hasPublicApiKey = Boolean(copilotApiConfig.publicApiKey);\n\n // Always call the internal hook (follows rules of hooks)\n const internalResult = useCopilotChatInternal(options);\n\n // Set banner error when no public API key is provided\n useEffect(() => {\n if (!hasPublicApiKey) {\n setBannerError(\n new CopilotKitError({\n message:\n // add link to documentation here\n \"You're using useCopilotChatHeadless_c, a premium-only feature, which offers extensive headless chat capabilities. To continue, you'll need to provide a free public license key.\",\n code: CopilotKitErrorCode.MISSING_PUBLIC_API_KEY_ERROR,\n severity: Severity.WARNING,\n visibility: ErrorVisibility.BANNER,\n }),\n );\n styledConsole.logCopilotKitPlatformMessage();\n } else {\n setBannerError(null); // Clear banner when API key is provided\n }\n }, [hasPublicApiKey]); // Removed setBannerError dependency\n\n // Return internal result if publicApiKey is available, otherwise return fallback\n if (hasPublicApiKey) {\n return internalResult;\n }\n\n // Return non-functional fallback when no publicApiKey\n return createNonFunctionalReturn();\n}\n\nexport { defaultSystemMessage, useCopilotChatHeadless_c };\nexport type { UseCopilotChatOptions_c, UseCopilotChatReturn_c, MCPServerConfig };\n\nconst noKeyWarning = () => {\n styledConsole.logCopilotKitPlatformMessage();\n};\n"],"mappings":";;;;;;;;;;;AAgKA,SAAS,iBAAiB;AAU1B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,IAAM,4BAA4B,OAA+B;AAAA,EAC/D,iBAAiB,CAAC;AAAA,EAClB,UAAU,CAAC;AAAA,EACX,aAAa,MAAY;AAAA,EAAC;AAAA,EAC1B,eAAe,MAAY;AAAA,EAAC;AAAA,EAC5B,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,eAAe,MAAM;AAAA,EAAC;AAAA,EACtB,gBAAgB,MAAY;AAAA,EAAC;AAAA,EAC7B,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,OAAO,MAAM;AAAA,EAAC;AAAA,EACd,WAAW;AAAA,EACX,mBAAmB,MAAS;AAAG,YAAC;AAAA;AAAA,EAChC,YAAY,CAAC;AAAA,EACb,eAAe,MAAM;AAAA,EAAC;AAAA,EACtB,aAAa,CAAC;AAAA,EACd,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,qBAAqB,MAAY;AAAA,EAAC;AAAA,EAClC,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB,sBAAsB;AAAA,EACtB,WAAW;AACb;AAeA,SAAS,yBAAyB,UAAmC,CAAC,GAA2B;AAC/F,QAAM,EAAE,kBAAkB,eAAe,IAAI,kBAAkB;AAG/D,QAAM,kBAAkB,QAAQ,iBAAiB,YAAY;AAG7D,QAAM,iBAAiB,eAAuB,OAAO;AAGrD,YAAU,MAAM;AACd,QAAI,CAAC,iBAAiB;AACpB;AAAA,QACE,IAAI,gBAAgB;AAAA,UAClB;AAAA;AAAA,YAEE;AAAA;AAAA,UACF,MAAM,oBAAoB;AAAA,UAC1B,UAAU,SAAS;AAAA,UACnB,YAAY,gBAAgB;AAAA,QAC9B,CAAC;AAAA,MACH;AACA,oBAAc,6BAA6B;AAAA,IAC7C,OAAO;AACL,qBAAe,IAAI;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,eAAe,CAAC;AAGpB,MAAI,iBAAiB;AACnB,WAAO;AAAA,EACT;AAGA,SAAO,0BAA0B;AACnC;","names":[]}