import { ForwardedParametersInput } from "@copilotkit/runtime-client-gql"; import { ReactNode } from "react"; import { AuthState } from "../../context/copilot-context"; import { CopilotErrorHandler, DebugConfig } from "@copilotkit/shared"; import { CopilotKitProviderProps } from "../../v2"; /** * Props for CopilotKit. */ /** * We shouldn't need this `Omit` here, but using it because `CopilotKitProps` * and `CopilotKitProviderProps` have non-identical `children` types * * TODO: Remove this `Omit` once this is resolved. */ export interface CopilotKitProps extends Omit< CopilotKitProviderProps, "children" > { /** * Your Copilot Cloud API key. * * Don't have it yet? Go to https://cloud.copilotkit.ai and get one for free. */ publicApiKey?: string; /** * Your public license key for accessing premium CopilotKit features. * * Don't have it yet? Go to https://cloud.copilotkit.ai and get one for free. */ publicLicenseKey?: string; /** * Restrict input to a specific topic. * @deprecated Use `guardrails_c` instead to control input restrictions */ cloudRestrictToTopic?: { validTopics?: string[]; invalidTopics?: string[]; }; /** * Restrict input to specific topics using guardrails. * @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. The feature allows restricting chat conversations to specific topics. */ guardrails_c?: { validTopics?: string[]; invalidTopics?: string[]; }; /** * The endpoint for the Copilot Runtime instance. [Click here for more information](/concepts/copilot-runtime). */ runtimeUrl?: string; /** * The endpoint for the Copilot transcribe audio service. */ transcribeAudioUrl?: string; /** * The endpoint for the Copilot text to speech service. */ textToSpeechUrl?: string; /** * Additional headers to be sent with the request. * Can be a static object or a function that returns headers dynamically * (useful for refreshing auth tokens). * * For example: * ```tsx * // Static headers * headers={{ "Authorization": "Bearer X" }} * * // Dynamic headers (re-evaluated on each render) * headers={() => ({ "Authorization": `Bearer ${getToken()}` })} * ``` */ headers?: Record | (() => Record); /** * The children to be rendered within the CopilotKit. */ children: ReactNode; /** * Custom properties to be sent with the request. * Can include threadMetadata for thread creation and authorization for LangGraph Platform authentication. * For example: * ```js * { * 'user_id': 'users_id', * 'authorization': 'your-auth-token', // For LangGraph Platform authentication * threadMetadata: { * 'account_id': '123', * 'user_type': 'premium' * } * } * ``` * * **Note**: The `authorization` property is automatically forwarded to LangGraph agents. See the [LangGraph Agent Authentication Guide](/coagents/shared/guides/langgraph-platform-authentication) for details. */ properties?: Record; /** * Indicates whether the user agent should send or receive cookies from the other domain * in the case of cross-origin requests. * * To enable HTTP-only cookie authentication, set `credentials="include"` and configure * CORS on your runtime endpoint: * * ```tsx * // Frontend (https://myapp.com) * * {children} * * * // Backend (https://api.myapp.com) * copilotRuntimeNextJSAppRouterEndpoint({ * runtime, * endpoint: "/copilotkit", * cors: { * origin: "https://myapp.com", * credentials: true, * }, * }); * ``` */ credentials?: RequestCredentials; /** * Whether to show the dev console (error banners and toasts). * * @deprecated Use `enableInspector` to control the AG-UI inspector, * which is what most users want. `showDevConsole` only controls * error toasts/banners, not the inspector button. * Defaults to `false` for production safety. */ showDevConsole?: boolean; /** * The name of the agent to use. */ agent?: string; /** * The forwarded parameters to use for the task. */ forwardedParameters?: Pick; /** * The auth config to use for the CopilotKit. * @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. The feature allows restricting chat conversations to specific topics. */ authConfig_c?: { SignInComponent: React.ComponentType<{ onSignInComplete: (authState: AuthState) => void; }>; }; /** * The thread id to use for the CopilotKit. */ threadId?: string; /** * Optional error handler for comprehensive debugging and observability. * * **Requires publicApiKey**: Error handling only works when publicApiKey is provided. * This is a premium Copilot Cloud feature. * * @param errorEvent - Structured error event with rich debugging context * * @example * ```typescript * { * debugDashboard.capture(errorEvent); * }} * > * ``` */ onError?: CopilotErrorHandler; /** * Enable or disable the CopilotKit Inspector, letting you inspect AG-UI events, * view agent messages, check agent state, and visualize agent context. Defaults * to enabled. */ enableInspector?: boolean; /** * Enable debug logging. On the server (`CopilotRuntime`), this enables * structured Pino logging of the AG-UI event pipeline. On the client, * this configuration is forwarded to the AG-UI transport layer * (`transformChunks`) for transport-level debug output. * * Pass `true` for full output, or an object for granular control: * * ```tsx * * {children} * * ``` */ debug?: DebugConfig; }