@copilotkit/react-core 1.57.3 → 1.58.0-canary.thread-id-propagation

package/src/hooks/use-copilot-additional-instructions.ts

@@ -1,98 +0,0 @@
-/**
- * `useCopilotAdditionalInstructions` is a React hook that provides additional instructions
- * to the Copilot.
- *
- * ## Usage
- *
- * ### Simple Usage
- *
- * In its most basic usage, useCopilotAdditionalInstructions accepts a single string argument
- * representing the instructions to be added to the Copilot.
- *
- * ```tsx
- * import { useCopilotAdditionalInstructions } from "@copilotkit/react-core";
- *
- * export function MyComponent() {
- *   useCopilotAdditionalInstructions({
- *     instructions: "Do not answer questions about the weather.",
- *   });
- * }
- * ```
- *
- * ### Conditional Usage
- *
- * You can also conditionally add instructions based on the state of your app.
- *
- * ```tsx
- * import { useCopilotAdditionalInstructions } from "@copilotkit/react-core";
- *
- * export function MyComponent() {
- *   const [showInstructions, setShowInstructions] = useState(false);
- *
- *   useCopilotAdditionalInstructions({
- *     available: showInstructions ? "enabled" : "disabled",
- *     instructions: "Do not answer questions about the weather.",
- *   });
- * }
- * ```
- */
-import { useEffect } from "react";
-import { useCopilotContext } from "../context/copilot-context";
-
-/**
- * Options for the useCopilotAdditionalInstructions hook.
- */
-export interface UseCopilotAdditionalInstructionsOptions {
-  /**
-   * The instructions to be added to the Copilot. Will be added to the instructions like so:
-   *
-   * ```txt
-   * You are a helpful assistant.
-   * Additionally, follow these instructions:
-   * - Do not answer questions about the weather.
-   * - Do not answer questions about the stock market.
-   * ```
-   */
-  instructions: string;
-
-  /**
-   * Whether the instructions are available to the Copilot.
-   */
-  available?: "enabled" | "disabled";
-}
-
-/**
- * Adds the given instructions to the Copilot context.
- */
-export function useCopilotAdditionalInstructions(
-  {
-    instructions,
-    available = "enabled",
-  }: UseCopilotAdditionalInstructionsOptions,
-  dependencies?: any[],
-) {
-  const { setAdditionalInstructions } = useCopilotContext();
-
-  useEffect(() => {
-    if (available === "disabled") return;
-
-    setAdditionalInstructions((prevInstructions) => [
-      ...(prevInstructions || []),
-      instructions,
-    ]);
-
-    return () => {
-      setAdditionalInstructions(
-        (prevInstructions) =>
-          prevInstructions?.filter(
-            (instruction) => instruction !== instructions,
-          ) || [],
-      );
-    };
-  }, [
-    available,
-    instructions,
-    setAdditionalInstructions,
-    ...(dependencies || []),
-  ]);
-}

package/src/hooks/use-copilot-authenticated-action.ts

@@ -1,73 +0,0 @@
-import { Parameter } from "@copilotkit/shared";
-import { Fragment, useCallback, useRef } from "react";
-import { useCopilotContext } from "../context/copilot-context";
-import { FrontendAction, ActionRenderProps } from "../types/frontend-action";
-import { useCopilotAction } from "./use-copilot-action";
-import React from "react";
-
-/**
- * Hook to create an authenticated action that requires user sign-in before execution.
- *
- * @remarks
- * This feature is only available when using CopilotKit's hosted cloud service.
- * To use this feature, sign up at https://cloud.copilotkit.ai to get your publicApiKey.
- *
- * @param action - The frontend action to be wrapped with authentication
- * @param dependencies - Optional array of dependencies that will trigger recreation of the action when changed
- */
-export function useCopilotAuthenticatedAction_c<T extends Parameter[]>(
-  action: FrontendAction<T>,
-  dependencies?: any[],
-): void {
-  const { authConfig_c, authStates_c, setAuthStates_c } = useCopilotContext();
-  const pendingActionRef = useRef<ActionRenderProps<Parameter[]> | null>(null);
-
-  const executeAction = useCallback(
-    (props: ActionRenderProps<Parameter[]>) => {
-      if (typeof action.render === "function") {
-        return action.render(props);
-      }
-      return action.render || React.createElement(Fragment);
-    },
-    [action],
-  );
-
-  const wrappedRender = useCallback(
-    (props: ActionRenderProps<Parameter[]>): string | React.ReactElement => {
-      const isAuthenticated = Object.values(authStates_c || {}).some(
-        (state) => state.status === "authenticated",
-      );
-
-      if (!isAuthenticated) {
-        // Store action details for later execution
-        pendingActionRef.current = props;
-
-        return authConfig_c?.SignInComponent
-          ? React.createElement(authConfig_c.SignInComponent, {
-              onSignInComplete: (authState) => {
-                setAuthStates_c?.((prev) => ({
-                  ...prev,
-                  [action.name]: authState,
-                }));
-                if (pendingActionRef.current) {
-                  executeAction(pendingActionRef.current);
-                  pendingActionRef.current = null;
-                }
-              },
-            })
-          : React.createElement(Fragment);
-      }
-
-      return executeAction(props);
-    },
-    [action, authStates_c, setAuthStates_c],
-  );
-
-  useCopilotAction(
-    {
-      ...action,
-      render: wrappedRender,
-    } as FrontendAction<T>,
-    dependencies,
-  );
-}

package/src/hooks/use-copilot-chat-headless_c.ts

@@ -1,264 +0,0 @@
-/**
- * `useCopilotChatHeadless_c` is for building fully custom UI (headless UI) implementations.
- *
- * <Callout title="This is a premium-only feature">
- * 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>.
- *
- * Usage is generous, **free** to get started, and works with **either self-hosted or Copilot Cloud** environments.
- * </Callout>
- *
- * ## Key Features
- *
- * - **Fully headless**: Build your own fully custom UI's for your agentic applications.
- * - **Advanced Suggestions**: Direct access to suggestions array with full control
- * - **Interrupt Handling**: Support for advanced interrupt functionality
- * - **MCP Server Support**: Model Context Protocol server configurations
- * - **Chat Controls**: Complete set of chat management functions
- * - **Loading States**: Comprehensive loading state management
- *
- *
- * ## Usage
- *
- * ### Basic Setup
- *
- * ```tsx
- * import { CopilotKit } from "@copilotkit/react-core";
- * import { useCopilotChatHeadless_c } from "@copilotkit/react-core";
- *
- * export function App() {
- *   return (
- *     <CopilotKit publicApiKey="your-free-public-license-key">
- *       <YourComponent />
- *     </CopilotKit>
- *   );
- * }
- *
- * export function YourComponent() {
- *   const { messages, sendMessage, isLoading } = useCopilotChatHeadless_c();
- *
- *   const handleSendMessage = async () => {
- *     await sendMessage({
- *       id: "123",
- *       role: "user",
- *       content: "Hello World",
- *     });
- *   };
- *
- *   return (
- *     <div>
- *       {messages.map(msg => <div key={msg.id}>{msg.content}</div>)}
- *       <button onClick={handleSendMessage} disabled={isLoading}>
- *         Send Message
- *       </button>
- *     </div>
- *   );
- * }
- * ```
- *
- * ### Working with Suggestions
- *
- * ```tsx
- * import { useCopilotChatHeadless_c, useCopilotChatSuggestions } from "@copilotkit/react-core";
- *
- * export function SuggestionExample() {
- *   const {
- *     suggestions,
- *     setSuggestions,
- *     generateSuggestions,
- *     isLoadingSuggestions
- *   } = useCopilotChatHeadless_c();
- *
- *   // Configure AI suggestion generation
- *   useCopilotChatSuggestions({
- *     instructions: "Suggest helpful actions based on the current context",
- *     maxSuggestions: 3
- *   });
- *
- *   return (
- *     <div>
- *       {suggestions.map(suggestion => (
- *         <button key={suggestion.title}>{suggestion.title}</button>
- *       ))}
- *       <button onClick={generateSuggestions} disabled={isLoadingSuggestions}>
- *         Generate Suggestions
- *       </button>
- *     </div>
- *   );
- * }
- * ```
- *
- * ## Return Values
- * The following properties are returned from the hook:
- *
- * <PropertyReference name="messages" type="Message[]">
- * The messages currently in the chat in AG-UI format
- * </PropertyReference>
- *
- * <PropertyReference name="sendMessage" type="(message: Message, options?) => Promise<void>">
- * Send a new message to the chat and trigger AI response
- * </PropertyReference>
- *
- * <PropertyReference name="setMessages" type="(messages: Message[] | DeprecatedGqlMessage[]) => void">
- * Replace all messages in the chat with new array
- * </PropertyReference>
- *
- * <PropertyReference name="deleteMessage" type="(messageId: string) => void">
- * Remove a specific message by ID from the chat
- * </PropertyReference>
- *
- * <PropertyReference name="reloadMessages" type="(messageId: string) => Promise<void>">
- * Regenerate the response for a specific message by ID
- * </PropertyReference>
- *
- * <PropertyReference name="stopGeneration" type="() => void">
- * Stop the current message generation process
- * </PropertyReference>
- *
- * <PropertyReference name="reset" type="() => void">
- * Clear all messages and reset chat state completely
- * </PropertyReference>
- *
- * <PropertyReference name="isLoading" type="boolean">
- * Whether the chat is currently generating a response
- * </PropertyReference>
- *
- * <PropertyReference name="runChatCompletion" type="() => Promise<Message[]>">
- * Manually trigger chat completion for advanced usage
- * </PropertyReference>
- *
- * <PropertyReference name="mcpServers" type="MCPServerConfig[]">
- * Array of Model Context Protocol server configurations
- * </PropertyReference>
- *
- * <PropertyReference name="setMcpServers" type="(servers: MCPServerConfig[]) => void">
- * Update MCP server configurations for enhanced context
- * </PropertyReference>
- *
- * <PropertyReference name="suggestions" type="SuggestionItem[]">
- * Current suggestions array for reading or manual control
- * </PropertyReference>
- *
- * <PropertyReference name="setSuggestions" type="(suggestions: SuggestionItem[]) => void">
- * Manually set suggestions for custom workflows
- * </PropertyReference>
- *
- * <PropertyReference name="generateSuggestions" type="() => Promise<void>">
- * Trigger AI-powered suggestion generation using configured settings
- * </PropertyReference>
- *
- * <PropertyReference name="resetSuggestions" type="() => void">
- * Clear all current suggestions and reset generation state
- * </PropertyReference>
- *
- * <PropertyReference name="isLoadingSuggestions" type="boolean">
- * Whether suggestions are currently being generated
- * </PropertyReference>
- *
- * <PropertyReference name="interrupt" type="string | React.ReactElement | null">
- * Interrupt content for human-in-the-loop workflows
- * </PropertyReference>
- */
-import { useEffect } from "react";
-import { useCopilotContext } from "../context/copilot-context";
-import {
-  useCopilotChatInternal,
-  defaultSystemMessage,
-  UseCopilotChatOptions as UseCopilotChatOptions_c,
-  UseCopilotChatReturn as UseCopilotChatReturn_c,
-  MCPServerConfig,
-} from "./use-copilot-chat_internal";
-
-import {
-  ErrorVisibility,
-  Severity,
-  CopilotKitError,
-  CopilotKitErrorCode,
-  styledConsole,
-} from "@copilotkit/shared";
-
-// Non-functional fallback implementation
-const createNonFunctionalReturn = (): UseCopilotChatReturn_c => ({
-  visibleMessages: [],
-  messages: [],
-  sendMessage: async () => {},
-  appendMessage: async () => {},
-  setMessages: () => {},
-  deleteMessage: () => {},
-  reloadMessages: async () => {},
-  stopGeneration: () => {},
-  reset: () => {},
-  isLoading: false,
-  isAvailable: false,
-  runChatCompletion: async () => [],
-  mcpServers: [],
-  setMcpServers: () => {},
-  suggestions: [],
-  setSuggestions: () => {},
-  generateSuggestions: async () => {},
-  resetSuggestions: () => {},
-  isLoadingSuggestions: false,
-  interrupt: null,
-});
-/**
- * Enterprise React hook that provides complete chat functionality for fully custom UI implementations.
- * Includes all advanced features like direct message access, suggestions array, interrupt handling, and MCP support.
- *
- * **Requires a publicApiKey** - Sign up for free at https://cloud.copilotkit.ai/
- *
- * @param options - Configuration options for the chat
- * @returns Complete chat interface with all enterprise features
- *
- * @example
- * ```tsx
- * const { messages, sendMessage, suggestions, interrupt } = useCopilotChatHeadless_c();
- * ```
- */
-function useCopilotChatHeadless_c(
-  options: UseCopilotChatOptions_c = {},
-): UseCopilotChatReturn_c {
-  const { copilotApiConfig, setBannerError } = useCopilotContext();
-
-  // Check if publicApiKey is available
-  const hasPublicApiKey = Boolean(copilotApiConfig.publicApiKey);
-
-  // Always call the internal hook (follows rules of hooks)
-  const internalResult = useCopilotChatInternal(options);
-
-  // Set banner error when no public API key is provided
-  useEffect(() => {
-    if (!hasPublicApiKey) {
-      setBannerError(
-        new CopilotKitError({
-          message:
-            // add link to documentation here
-            "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.",
-          code: CopilotKitErrorCode.MISSING_PUBLIC_API_KEY_ERROR,
-          severity: Severity.WARNING,
-          visibility: ErrorVisibility.BANNER,
-        }),
-      );
-      styledConsole.logCopilotKitPlatformMessage();
-    } else {
-      setBannerError(null); // Clear banner when API key is provided
-    }
-  }, [hasPublicApiKey]); // Removed setBannerError dependency
-
-  // Return internal result if publicApiKey is available, otherwise return fallback
-  if (hasPublicApiKey) {
-    return internalResult;
-  }
-
-  // Return non-functional fallback when no publicApiKey
-  return createNonFunctionalReturn();
-}
-
-export { defaultSystemMessage, useCopilotChatHeadless_c };
-export type {
-  UseCopilotChatOptions_c,
-  UseCopilotChatReturn_c,
-  MCPServerConfig,
-};
-
-const noKeyWarning = () => {
-  styledConsole.logCopilotKitPlatformMessage();
-};

package/src/hooks/use-copilot-chat-suggestions.tsx

@@ -1,134 +0,0 @@
-/**
- * <Callout type="warning">
- *   useCopilotChatSuggestions is experimental. The interface is not final and
- *   can change without notice.
- * </Callout>
- *
- * `useCopilotReadable` is a React hook that provides app-state and other information
- * to the Copilot. Optionally, the hook can also handle hierarchical state within your
- * application, passing these parent-child relationships to the Copilot.
- *
- * <br/>
- * <img src="https://cdn.copilotkit.ai/docs/copilotkit/images/use-copilot-chat-suggestions/use-copilot-chat-suggestions.gif" width="500" />
- *
- * ## Usage
- *
- * ### Install Dependencies
- *
- * This component is part of the [@copilotkit/react-ui](https://npmjs.com/package/@copilotkit/react-ui) package.
- *
- * ```shell npm2yarn \"@copilotkit/react-ui"\
- * npm install @copilotkit/react-core @copilotkit/react-ui
- * ```
- *
- * ### Simple Usage
- *
- * ```tsx
- * import { useCopilotChatSuggestions } from "@copilotkit/react-ui";
- *
- * export function MyComponent() {
- *   const [employees, setEmployees] = useState([]);
- *
- *   useCopilotChatSuggestions({
- *     instructions: `The following employees are on duty: ${JSON.stringify(employees)}`,
- *   });
- * }
- * ```
- *
- * ### Dependency Management
- *
- * ```tsx
- * import { useCopilotChatSuggestions } from "@copilotkit/react-ui";
- *
- * export function MyComponent() {
- *   useCopilotChatSuggestions(
- *     {
- *       instructions: "Suggest the most relevant next actions.",
- *     },
- *     [appState],
- *   );
- * }
- * ```
- *
- * In the example above, the suggestions are generated based on the given instructions.
- * The hook monitors `appState`, and updates suggestions accordingly whenever it changes.
- *
- * ### Behavior and Lifecycle
- *
- * The hook registers the configuration with the chat context upon component mount and
- * removes it on unmount, ensuring a clean and efficient lifecycle management.
- */
-import {
-  useConfigureSuggestions,
-  useCopilotChatConfiguration,
-  useCopilotKit,
-  useSuggestions,
-} from "../v2";
-import { useEffect } from "react";
-import { StaticSuggestionsConfig, Suggestion } from "@copilotkit/core";
-
-type StaticSuggestionInput = Omit<Suggestion, "isLoading"> &
-  Partial<Pick<Suggestion, "isLoading">>;
-
-type StaticSuggestionsConfigInput = Omit<
-  StaticSuggestionsConfig,
-  "suggestions"
-> & {
-  suggestions: StaticSuggestionInput[];
-};
-
-type DynamicSuggestionsConfigInput = {
-  /**
-   * A prompt or instructions for the GPT to generate suggestions.
-   */
-  instructions: string;
-  /**
-   * The minimum number of suggestions to generate. Defaults to `1`.
-   * @default 1
-   */
-  minSuggestions?: number;
-  /**
-   * The maximum number of suggestions to generate. Defaults to `3`.
-   * @default 1
-   */
-  maxSuggestions?: number;
-
-  /**
-   * Whether the suggestions are available. Defaults to `enabled`.
-   * @default enabled
-   */
-  available?:
-    | "enabled"
-    | "disabled"
-    | "always"
-    | "before-first-message"
-    | "after-first-message";
-
-  /**
-   * An optional class name to apply to the suggestions.
-   */
-  className?: string;
-};
-
-export type UseCopilotChatSuggestionsConfiguration =
-  | DynamicSuggestionsConfigInput
-  | StaticSuggestionsConfigInput;
-
-export function useCopilotChatSuggestions(
-  config: UseCopilotChatSuggestionsConfiguration,
-  dependencies: any[] = [],
-) {
-  const existingConfig = useCopilotChatConfiguration();
-  const resolvedAgentId = existingConfig?.agentId ?? "default";
-
-  const available =
-    (config.available === "enabled" ? "always" : config.available) ??
-    "before-first-message";
-
-  const finalSuggestionConfig = {
-    ...config,
-    available,
-    consumerAgentId: resolvedAgentId, // Use chatConfig.agentId here
-  };
-  useConfigureSuggestions(finalSuggestionConfig, dependencies);
-}

package/src/hooks/use-copilot-chat.ts

@@ -1,132 +0,0 @@
-/**
- * `useCopilotChat` is a lightweight React hook for headless chat interactions.
- * Perfect for controlling the prebuilt chat components programmatically.
- *
- * **Open Source Friendly** - Works without requiring a free public license key.
- *
- * <Callout title="Looking for fully headless UI?">
- * Get started with [useCopilotChatHeadless_c](https://docs.copilotkit.ai/reference/v1/hooks/useCopilotChatHeadless_c).
- * </Callout>
- *
- * ## Use Cases
- *
- * - **Programmatic Messaging**: Send messages without displaying chat UI
- * - **Programmatic control**: Control prebuilt component programmatically
- * - **Background Operations**: Trigger AI interactions in the background
- * - **Fire-and-Forget**: Send messages without needing to read responses
- *
- * ## Usage
- *
- * ```tsx
- * import { TextMessage, MessageRole } from "@copilotkit/runtime-client-gql";
- *
- * const { appendMessage } = useCopilotChat();
- *
- * // Example usage without naming conflicts
- * const handleSendMessage = async (content: string) => {
- *   await appendMessage(
- *     new TextMessage({
- *       role: MessageRole.User,
- *       content,
- *     })
- *   );
- * };
- * ```
- *
- * ## Return Values
- * The following properties are returned from the hook:
- *
- * <PropertyReference name="visibleMessages" type="DeprecatedGqlMessage[]" deprecated>
- * Array of messages in old non-AG-UI format, use for compatibility only
- * </PropertyReference>
- *
- * <PropertyReference name="appendMessage" type="(message: DeprecatedGqlMessage, options?) => Promise<void>" deprecated>
- * Append message using old format, use `sendMessage` instead
- * </PropertyReference>
- *
- * <PropertyReference name="reloadMessages" type="(messageId: string) => Promise<void>">
- * Regenerate the response for a specific message by ID
- * </PropertyReference>
- *
- * <PropertyReference name="stopGeneration" type="() => void">
- * Stop the current message generation process
- * </PropertyReference>
- *
- * <PropertyReference name="reset" type="() => void">
- * Clear all messages and reset chat state completely
- * </PropertyReference>
- *
- * <PropertyReference name="isLoading" type="boolean">
- * Whether the chat is currently generating a response
- * </PropertyReference>
- *
- * <PropertyReference name="runChatCompletion" type="() => Promise<Message[]>">
- * Manually trigger chat completion for advanced usage
- * </PropertyReference>
- *
- * <PropertyReference name="mcpServers" type="MCPServerConfig[]">
- * Array of Model Context Protocol server configurations
- * </PropertyReference>
- *
- * <PropertyReference name="setMcpServers" type="(servers: MCPServerConfig[]) => void">
- * Update MCP server configurations for enhanced context
- * </PropertyReference>
- */
-
-import {
-  UseCopilotChatOptions,
-  useCopilotChatInternal,
-  UseCopilotChatReturn as UseCopilotChatReturnInternal,
-} from "./use-copilot-chat_internal";
-
-// Create a type that excludes message-related properties from the internal type
-export type UseCopilotChatReturn = Omit<
-  UseCopilotChatReturnInternal,
-  | "messages"
-  | "sendMessage"
-  | "suggestions"
-  | "setSuggestions"
-  | "generateSuggestions"
-  | "isLoadingSuggestions"
-  | "resetSuggestions"
-  | "interrupt"
-  | "setMessages"
-  | "deleteMessage"
->;
-
-/**
- * A lightweight React hook for headless chat interactions.
- * Perfect for programmatic messaging, background operations, and custom UI implementations.
- *
- * **Open Source Friendly** - Works without requiring a `publicApiKey`.
- */
-// TODO: Do we need this? If so, does it work properly? test.
-export function useCopilotChat(
-  options: UseCopilotChatOptions = {},
-): UseCopilotChatReturn {
-  const {
-    visibleMessages,
-    appendMessage,
-    reloadMessages,
-    stopGeneration,
-    reset,
-    isLoading,
-    isAvailable,
-    runChatCompletion,
-    mcpServers,
-    setMcpServers,
-  } = useCopilotChatInternal(options);
-
-  return {
-    visibleMessages,
-    appendMessage,
-    reloadMessages,
-    stopGeneration,
-    reset,
-    isLoading,
-    isAvailable,
-    runChatCompletion,
-    mcpServers,
-    setMcpServers,
-  };
-}