CopilotKitProvider

Overview

CopilotKitProvider is the React Native provider for CopilotKit. Wrap your app (or the sub-tree that needs a copilot) with it to configure the runtime connection. Every hook and component below it reads the configured client from context.

Importing the package auto-installs the polyfills CopilotKit needs on Hermes, so you do not have to import them manually before using the provider.

Import

import { CopilotKitProvider } from "@copilotkit/react-native";

Props

Usage

import { CopilotKitProvider } from "@copilotkit/react-native";
import { SafeAreaProvider } from "react-native-safe-area-context";
import { ChatScreen } from "./ChatScreen";

export default function App() {
  return (
    <SafeAreaProvider>
      <CopilotKitProvider runtimeUrl="https://your-server/api/copilotkit">
        <ChatScreen />
      </CopilotKitProvider>
    </SafeAreaProvider>
  );
}

Behavior

• Auto-polyfills: importing the package installs the Web API polyfills CopilotKit relies on (ReadableStream, TextEncoder, crypto.getRandomValues, DOMException, location) before any CopilotKit code runs.
• Render-tool registry: the provider wraps children in a RenderToolProvider, so useRenderTool works anywhere below it.
• Stable references: header functions and properties are memoized internally to avoid effect churn on re-render.

Related

• useCopilotKit: access the configured client from any descendant
• useAgent: connect to an agent and read its state
• Polyfills: what gets installed and how to bring your own