@copilotkit/react-core 0.0.0-feat-dynamic-copilotcloud-qa-20250117190454

package/dist/utils/utils.test.mjs

@@ -0,0 +1,7 @@
+// src/utils/utils.test.ts
+describe("emptyTest", () => {
+  it("should be truthy", () => {
+    expect(true).toBeTruthy();
+  });
+});
+//# sourceMappingURL=utils.test.mjs.map

package/dist/utils/utils.test.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/utils.test.ts"],"sourcesContent":["import * as utils from \"./utils\";\n\ndescribe(\"emptyTest\", () => {\n  it(\"should be truthy\", () => {\n    expect(true).toBeTruthy();\n  });\n});\n"],"mappings":";AAEA,SAAS,aAAa,MAAM;AAC1B,KAAG,oBAAoB,MAAM;AAC3B,WAAO,IAAI,EAAE,WAAW;AAAA,EAC1B,CAAC;AACH,CAAC;","names":[]}

package/jest.config.js

@@ -0,0 +1,5 @@
+/** @type {import('ts-jest').JestConfigWithTsJest} */
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'node',
+};

package/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "@copilotkit/react-core",
+  "private": false,
+  "homepage": "https://github.com/CopilotKit/CopilotKit",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/CopilotKit/CopilotKit.git"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "version": "0.0.0-feat-dynamic-copilotcloud-qa-20250117190454",
+  "sideEffects": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "types": "./dist/index.d.ts",
+  "license": "MIT",
+  "peerDependencies": {
+    "react": "^18 || ^19 || ^19.0.0-rc",
+    "react-dom": "^18 || ^19 || ^19.0.0-rc"
+  },
+  "devDependencies": {
+    "@types/jest": "^29.5.4",
+    "@types/react": "^18.2.5",
+    "eslint": "^8.56.0",
+    "jest": "^29.6.4",
+    "react": "^18.2.0",
+    "ts-jest": "^29.1.1",
+    "tsup": "^6.7.0",
+    "typescript": "^5.2.3",
+    "@types/react-dom": "^18.2.4",
+    "eslint-config-custom": "1.4.6",
+    "tsconfig": "1.4.6"
+  },
+  "dependencies": {
+    "@scarf/scarf": "^1.3.0",
+    "untruncate-json": "^0.0.1",
+    "@copilotkit/runtime-client-gql": "0.0.0-feat-dynamic-copilotcloud-qa-20250117190454",
+    "@copilotkit/shared": "0.0.0-feat-dynamic-copilotcloud-qa-20250117190454"
+  },
+  "keywords": [
+    "copilotkit",
+    "copilot",
+    "react",
+    "nextjs",
+    "nodejs",
+    "ai",
+    "assistant",
+    "javascript",
+    "automation",
+    "textarea"
+  ],
+  "scripts": {
+    "build": "tsup --clean",
+    "dev": "tsup --watch",
+    "test": "jest",
+    "check-types": "tsc --noEmit",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist && rm -rf .next",
+    "link:global": "pnpm link --global",
+    "unlink:global": "pnpm unlink --global"
+  }
+}

package/src/components/copilot-provider/copilot-messages.tsx

@@ -0,0 +1,23 @@
+/**
+ * An internal context to separate the messages state (which is constantly changing) from the rest of CopilotKit context
+ */
+
+import { useState } from "react";
+import { CopilotMessagesContext } from "../../context/copilot-messages-context";
+import { Message } from "@copilotkit/runtime-client-gql";
+import { CopilotKitProps } from "./copilotkit-props";
+
+export function CopilotMessages({ children, ...props }: CopilotKitProps) {
+  const [messages, setMessages] = useState<Message[]>([]);
+
+  return (
+    <CopilotMessagesContext.Provider
+      value={{
+        messages,
+        setMessages,
+      }}
+    >
+      {children}
+    </CopilotMessagesContext.Provider>
+  );
+}

package/src/components/copilot-provider/copilotkit-props.tsx

@@ -0,0 +1,97 @@
+import { ForwardedParametersInput } from "@copilotkit/runtime-client-gql";
+import { ReactNode } from "react";
+import { AuthState } from "../../context/copilot-context";
+
+/**
+ * Props for CopilotKit.
+ */
+
+export interface CopilotKitProps {
+  /**
+   *  Your Copilot Cloud API key. Don't have it yet? Go to https://cloud.copilotkit.ai and get one for free.
+   */
+  publicApiKey?: string;
+
+  /**
+   * Restrict input to a specific topic.
+   */
+  cloudRestrictToTopic?: {
+    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.
+   *
+   * For example:
+   * ```json
+   * {
+   *   "Authorization": "Bearer X"
+   * }
+   * ```
+   */
+  headers?: Record<string, string>;
+
+  /**
+   * The children to be rendered within the CopilotKit.
+   */
+  children: ReactNode;
+
+  /**
+   * Custom properties to be sent with the request
+   * For example:
+   * ```js
+   * {
+   *   'user_id': 'users_id',
+   * }
+   * ```
+   */
+  properties?: Record<string, any>;
+
+  /**
+   * Indicates whether the user agent should send or receive cookies from the other domain
+   * in the case of cross-origin requests.
+   */
+  credentials?: RequestCredentials;
+
+  /**
+   * Whether to show the dev console.
+   *
+   * If set to "auto", the dev console will be show on localhost only.
+   */
+  showDevConsole?: boolean | "auto";
+
+  /**
+   * The name of the agent to use.
+   */
+  agent?: string;
+
+  /**
+   * The forwarded parameters to use for the task.
+   */
+  forwardedParameters?: Pick<ForwardedParametersInput, "temperature">;
+
+  /**
+   * The auth config to use for the CopilotKit.
+   */
+  authConfig?: {
+    SignInComponent: React.ComponentType<{
+      onSignInComplete: (authState: AuthState) => void;
+    }>;
+  };
+}

package/src/components/copilot-provider/copilotkit.tsx

@@ -0,0 +1,401 @@
+/**
+ * This component will typically wrap your entire application (or a sub-tree of your application where you want to have a copilot). It provides the copilot context to all other components and hooks.
+ *
+ * ## Example
+ *
+ * You can find more information about self-hosting CopilotKit [here](/guides/self-hosting).
+ *
+ * ```tsx
+ * import { CopilotKit } from "@copilotkit/react-core";
+ *
+ * <CopilotKit runtimeUrl="<your-runtime-url>">
+ *   // ... your app ...
+ * </CopilotKit>
+ * ```
+ */
+
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  CopilotContext,
+  CopilotApiConfig,
+  ChatComponentsCache,
+  AgentSession,
+  AuthState,
+} from "../../context/copilot-context";
+import useTree from "../../hooks/use-tree";
+import { CopilotChatSuggestionConfiguration, DocumentPointer } from "../../types";
+import { flushSync } from "react-dom";
+import {
+  COPILOT_CLOUD_CHAT_URL,
+  CopilotCloudConfig,
+  FunctionCallHandler,
+  COPILOT_CLOUD_PUBLIC_API_KEY_HEADER,
+} from "@copilotkit/shared";
+
+import { FrontendAction } from "../../types/frontend-action";
+import useFlatCategoryStore from "../../hooks/use-flat-category-store";
+import { CopilotKitProps } from "./copilotkit-props";
+import { CoAgentStateRender } from "../../types/coagent-action";
+import { CoagentState } from "../../types/coagent-state";
+import { CopilotMessages } from "./copilot-messages";
+import { ToastProvider } from "../toast/toast-provider";
+import { useCopilotRuntimeClient } from "../../hooks/use-copilot-runtime-client";
+import { shouldShowDevConsole } from "../../utils";
+import { CopilotErrorBoundary } from "../error-boundary/error-boundary";
+import { Agent } from "@copilotkit/runtime-client-gql";
+
+export function CopilotKit({ children, ...props }: CopilotKitProps) {
+  const showDevConsole = props.showDevConsole === undefined ? "auto" : props.showDevConsole;
+  const enabled = shouldShowDevConsole(showDevConsole);
+  return (
+    <ToastProvider enabled={enabled}>
+      <CopilotErrorBoundary>
+        <CopilotKitInternal {...props}>{children}</CopilotKitInternal>
+      </CopilotErrorBoundary>
+    </ToastProvider>
+  );
+}
+
+export function CopilotKitInternal({ children, ...props }: CopilotKitProps) {
+  // Compute all the functions and properties that we need to pass
+  // to the CopilotContext.
+
+  if (!props.runtimeUrl && !props.publicApiKey) {
+    throw new Error(
+      "Please provide either a runtimeUrl or a publicApiKey to the CopilotKit component.",
+    );
+  }
+
+  const chatApiEndpoint = props.runtimeUrl || COPILOT_CLOUD_CHAT_URL;
+
+  const [actions, setActions] = useState<Record<string, FrontendAction<any>>>({});
+  const [coAgentStateRenders, setCoAgentStateRenders] = useState<
+    Record<string, CoAgentStateRender<any>>
+  >({});
+  const chatComponentsCache = useRef<ChatComponentsCache>({
+    actions: {},
+    coAgentStateRenders: {},
+  });
+  const { addElement, removeElement, printTree } = useTree();
+  const [isLoading, setIsLoading] = useState(false);
+  const [chatInstructions, setChatInstructions] = useState("");
+  const [authStates, setAuthStates] = useState<Record<string, AuthState>>({});
+
+  const {
+    addElement: addDocument,
+    removeElement: removeDocument,
+    allElements: allDocuments,
+  } = useFlatCategoryStore<DocumentPointer>();
+
+  const setAction = useCallback((id: string, action: FrontendAction<any>) => {
+    setActions((prevPoints) => {
+      return {
+        ...prevPoints,
+        [id]: action,
+      };
+    });
+  }, []);
+
+  const removeAction = useCallback((id: string) => {
+    setActions((prevPoints) => {
+      const newPoints = { ...prevPoints };
+      delete newPoints[id];
+      return newPoints;
+    });
+  }, []);
+
+  const setCoAgentStateRender = useCallback((id: string, stateRender: CoAgentStateRender<any>) => {
+    setCoAgentStateRenders((prevPoints) => {
+      return {
+        ...prevPoints,
+        [id]: stateRender,
+      };
+    });
+  }, []);
+
+  const removeCoAgentStateRender = useCallback((id: string) => {
+    setCoAgentStateRenders((prevPoints) => {
+      const newPoints = { ...prevPoints };
+      delete newPoints[id];
+      return newPoints;
+    });
+  }, []);
+
+  const getContextString = useCallback(
+    (documents: DocumentPointer[], categories: string[]) => {
+      const documentsString = documents
+        .map((document) => {
+          return `${document.name} (${document.sourceApplication}):\n${document.getContents()}`;
+        })
+        .join("\n\n");
+
+      const nonDocumentStrings = printTree(categories);
+
+      return `${documentsString}\n\n${nonDocumentStrings}`;
+    },
+    [printTree],
+  );
+
+  const addContext = useCallback(
+    (
+      context: string,
+      parentId?: string,
+      categories: string[] = defaultCopilotContextCategories,
+    ) => {
+      return addElement(context, categories, parentId);
+    },
+    [addElement],
+  );
+
+  const removeContext = useCallback(
+    (id: string) => {
+      removeElement(id);
+    },
+    [removeElement],
+  );
+
+  const getFunctionCallHandler = useCallback(
+    (customEntryPoints?: Record<string, FrontendAction<any>>) => {
+      return entryPointsToFunctionCallHandler(Object.values(customEntryPoints || actions));
+    },
+    [actions],
+  );
+
+  const getDocumentsContext = useCallback(
+    (categories: string[]) => {
+      return allDocuments(categories);
+    },
+    [allDocuments],
+  );
+
+  const addDocumentContext = useCallback(
+    (documentPointer: DocumentPointer, categories: string[] = defaultCopilotContextCategories) => {
+      return addDocument(documentPointer, categories);
+    },
+    [addDocument],
+  );
+
+  const removeDocumentContext = useCallback(
+    (documentId: string) => {
+      removeDocument(documentId);
+    },
+    [removeDocument],
+  );
+
+  if (!props.publicApiKey) {
+    if (props.cloudRestrictToTopic) {
+      throw new Error(
+        "To use the cloudRestrictToTopic feature, please sign up at https://copilotkit.ai and provide a publicApiKey.",
+      );
+    }
+  }
+
+  // get the appropriate CopilotApiConfig from the props
+  const copilotApiConfig: CopilotApiConfig = useMemo(() => {
+    let cloud: CopilotCloudConfig | undefined = undefined;
+    if (props.publicApiKey) {
+      cloud = {
+        guardrails: {
+          input: {
+            restrictToTopic: {
+              enabled: props.cloudRestrictToTopic ? true : false,
+              validTopics: props.cloudRestrictToTopic?.validTopics || [],
+              invalidTopics: props.cloudRestrictToTopic?.invalidTopics || [],
+            },
+          },
+        },
+      };
+    }
+
+    return {
+      publicApiKey: props.publicApiKey,
+      ...(cloud ? { cloud } : {}),
+      chatApiEndpoint: chatApiEndpoint,
+      headers: props.headers || {},
+      properties: props.properties || {},
+      transcribeAudioUrl: props.transcribeAudioUrl,
+      textToSpeechUrl: props.textToSpeechUrl,
+      credentials: props.credentials,
+    };
+  }, [
+    props.publicApiKey,
+    props.headers,
+    props.properties,
+    props.transcribeAudioUrl,
+    props.textToSpeechUrl,
+    props.credentials,
+    props.cloudRestrictToTopic,
+  ]);
+
+  const headers = useMemo(() => {
+    const authHeaders = Object.values(authStates || {}).reduce((acc, state) => {
+      if (state.status === "authenticated" && state.authHeaders) {
+        return {
+          ...acc,
+          ...Object.entries(state.authHeaders).reduce(
+            (headers, [key, value]) => ({
+              ...headers,
+              [key.startsWith("X-Custom-") ? key : `X-Custom-${key}`]: value,
+            }),
+            {},
+          ),
+        };
+      }
+      return acc;
+    }, {});
+
+    return {
+      ...(copilotApiConfig.headers || {}),
+      ...(copilotApiConfig.publicApiKey
+        ? { [COPILOT_CLOUD_PUBLIC_API_KEY_HEADER]: copilotApiConfig.publicApiKey }
+        : {}),
+      ...authHeaders,
+    };
+  }, [copilotApiConfig.headers, copilotApiConfig.publicApiKey, authStates]);
+
+  const runtimeClient = useCopilotRuntimeClient({
+    url: copilotApiConfig.chatApiEndpoint,
+    publicApiKey: copilotApiConfig.publicApiKey,
+    headers,
+    credentials: copilotApiConfig.credentials,
+  });
+
+  const [chatSuggestionConfiguration, setChatSuggestionConfiguration] = useState<{
+    [key: string]: CopilotChatSuggestionConfiguration;
+  }>({});
+
+  const addChatSuggestionConfiguration = (
+    id: string,
+    suggestion: CopilotChatSuggestionConfiguration,
+  ) => {
+    setChatSuggestionConfiguration((prev) => ({ ...prev, [id]: suggestion }));
+  };
+
+  const removeChatSuggestionConfiguration = (id: string) => {
+    setChatSuggestionConfiguration((prev) => {
+      const { [id]: _, ...rest } = prev;
+      return rest;
+    });
+  };
+
+  const [availableAgents, setAvailableAgents] = useState<Agent[]>([]);
+  const [coagentStates, setCoagentStates] = useState<Record<string, CoagentState>>({});
+  const coagentStatesRef = useRef<Record<string, CoagentState>>({});
+  const setCoagentStatesWithRef = useCallback(
+    (
+      value:
+        | Record<string, CoagentState>
+        | ((prev: Record<string, CoagentState>) => Record<string, CoagentState>),
+    ) => {
+      const newValue = typeof value === "function" ? value(coagentStatesRef.current) : value;
+      coagentStatesRef.current = newValue;
+      setCoagentStates((prev) => {
+        return newValue;
+      });
+    },
+    [],
+  );
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const result = await runtimeClient.availableAgents();
+      if (result.data?.availableAgents) {
+        setAvailableAgents(result.data.availableAgents.agents);
+      }
+    };
+    void fetchData();
+  }, []);
+
+  let initialAgentSession: AgentSession | null = null;
+  if (props.agent) {
+    initialAgentSession = {
+      agentName: props.agent,
+    };
+  }
+
+  const [agentSession, setAgentSession] = useState<AgentSession | null>(initialAgentSession);
+  const [threadId, setThreadId] = useState<string | null>(null);
+  const [runId, setRunId] = useState<string | null>(null);
+
+  const chatAbortControllerRef = useRef<AbortController | null>(null);
+
+  const showDevConsole = props.showDevConsole === undefined ? "auto" : props.showDevConsole;
+
+  return (
+    <CopilotContext.Provider
+      value={{
+        actions,
+        chatComponentsCache,
+        getFunctionCallHandler,
+        setAction,
+        removeAction,
+        coAgentStateRenders,
+        setCoAgentStateRender,
+        removeCoAgentStateRender,
+        getContextString,
+        addContext,
+        removeContext,
+        getDocumentsContext,
+        addDocumentContext,
+        removeDocumentContext,
+        copilotApiConfig: copilotApiConfig,
+        isLoading,
+        setIsLoading,
+        chatSuggestionConfiguration,
+        addChatSuggestionConfiguration,
+        removeChatSuggestionConfiguration,
+        chatInstructions,
+        setChatInstructions,
+        showDevConsole,
+        coagentStates,
+        setCoagentStates,
+        coagentStatesRef,
+        setCoagentStatesWithRef,
+        agentSession,
+        setAgentSession,
+        runtimeClient,
+        forwardedParameters: props.forwardedParameters || {},
+        agentLock: props.agent || null,
+        threadId,
+        setThreadId,
+        runId,
+        setRunId,
+        chatAbortControllerRef,
+        availableAgents,
+        authConfig: props.authConfig,
+        authStates,
+        setAuthStates,
+      }}
+    >
+      <CopilotMessages>{children}</CopilotMessages>
+    </CopilotContext.Provider>
+  );
+}
+
+export const defaultCopilotContextCategories = ["global"];
+
+function entryPointsToFunctionCallHandler(actions: FrontendAction<any>[]): FunctionCallHandler {
+  return async ({ messages, name, args }) => {
+    let actionsByFunctionName: Record<string, FrontendAction<any>> = {};
+    for (let action of actions) {
+      actionsByFunctionName[action.name] = action;
+    }
+
+    const action = actionsByFunctionName[name];
+    let result: any = undefined;
+    if (action) {
+      await new Promise<void>((resolve, reject) => {
+        flushSync(async () => {
+          try {
+            result = await action.handler?.(args);
+            resolve();
+          } catch (error) {
+            reject(error);
+          }
+        });
+      });
+      await new Promise((resolve) => setTimeout(resolve, 20));
+    }
+    return result;
+  };
+}

package/src/components/copilot-provider/index.ts

@@ -0,0 +1,3 @@
+export { CopilotKit, defaultCopilotContextCategories } from "./copilotkit";
+
+export type { CopilotKitProps } from "./copilotkit-props";

package/src/components/error-boundary/error-boundary.tsx

@@ -0,0 +1,42 @@
+import React, { useEffect } from "react";
+import { useErrorToast } from "./error-utils";
+
+interface Props {
+  children: React.ReactNode;
+}
+
+interface State {
+  hasError: boolean;
+  error?: Error;
+}
+
+export class CopilotErrorBoundary extends React.Component<Props, State> {
+  constructor(props: Props) {
+    super(props);
+    this.state = { hasError: false };
+  }
+
+  static getDerivedStateFromError(error: Error): State {
+    return { hasError: true, error };
+  }
+
+  componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
+    console.error("CopilotKit Error:", error, errorInfo);
+  }
+
+  render() {
+    return <ErrorToast error={this.state.error}>{this.props.children}</ErrorToast>;
+  }
+}
+
+export function ErrorToast({ error, children }: { error?: Error; children: React.ReactNode }) {
+  const addErrorToast = useErrorToast();
+
+  useEffect(() => {
+    if (error) {
+      addErrorToast([error]);
+    }
+  }, [error, addErrorToast]);
+
+  return children;
+}