@copilotkit/react-core 1.50.0-beta.7 → 1.50.0-beta.8

package/dist/hooks/index.mjs

@@ -43,7 +43,7 @@ import {
 } from "../chunk-ZVF5Q6IH.mjs";
 import {
   useCopilotReadable
-} from "../chunk-2CYJN455.mjs";
+} from "../chunk-RQ6LWR6S.mjs";
 import {
   useCopilotRuntimeClient
 } from "../chunk-6ESSSQ7Q.mjs";

package/dist/hooks/use-copilot-readable.d.ts

@@ -1,3 +1,4 @@
+type DataType = object | number | string | boolean | null | undefined;
 /**
  * Options for the useCopilotReadable hook.
  */
@@ -9,7 +10,7 @@ interface UseCopilotReadableOptions {
     /**
      * The value to be added to the Copilot context. Object values are automatically stringified.
      */
-    value: any;
+    value: DataType | Record<string, any> | DataType[];
     /**
      * The ID of the parent context, if any.
      */
@@ -27,11 +28,11 @@ interface UseCopilotReadableOptions {
      * A custom conversion function to use to serialize the value to a string. If not provided, the value
      * will be serialized using `JSON.stringify`.
      */
-    convert?: (description: string, value: any) => string;
+    convert?: (value: any) => string;
 }
 /**
  * Adds the given information to the Copilot context to make it readable by Copilot.
  */
-declare function useCopilotReadable({ description, value }: UseCopilotReadableOptions, dependencies?: any[]): undefined;
+declare function useCopilotReadable({ description, value, convert, available }: UseCopilotReadableOptions, dependencies?: any[]): string | undefined;
 
 export { UseCopilotReadableOptions, useCopilotReadable };

package/dist/hooks/use-copilot-readable.js

@@ -24,12 +24,35 @@ __export(use_copilot_readable_exports, {
 });
 module.exports = __toCommonJS(use_copilot_readable_exports);
 var import_react = require("@copilotkitnext/react");
-function useCopilotReadable({ description, value }, dependencies) {
-  (0, import_react.useAgentContext)({
-    description,
-    value
-  });
-  return;
+var import_react2 = require("react");
+function useCopilotReadable({ description, value, convert, available }, dependencies) {
+  const { copilotkit } = (0, import_react.useCopilotKit)();
+  const ctxIdRef = (0, import_react2.useRef)(void 0);
+  (0, import_react2.useEffect)(() => {
+    if (!copilotkit)
+      return;
+    const found = Object.entries(copilotkit.context).find(([id, ctxItem]) => {
+      return JSON.stringify({ description, value }) == JSON.stringify(ctxItem);
+    });
+    if (found) {
+      ctxIdRef.current = found[0];
+      if (available === "disabled")
+        copilotkit.removeContext(ctxIdRef.current);
+      return;
+    }
+    if (!found && available === "disabled")
+      return;
+    ctxIdRef.current = copilotkit.addContext({
+      description,
+      value: (convert != null ? convert : JSON.stringify)(value)
+    });
+    return () => {
+      if (!ctxIdRef.current)
+        return;
+      copilotkit.removeContext(ctxIdRef.current);
+    };
+  }, [description, value, convert]);
+  return ctxIdRef.current;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/hooks/use-copilot-readable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/use-copilot-readable.ts"],"sourcesContent":["/**\n * `useCopilotReadable` is a React hook that provides app-state and other information\n * to the Copilot. Optionally, the hook can also handle hierarchical state within your\n * application, passing these parent-child relationships to the Copilot.\n *\n * ## Usage\n *\n * ### Simple Usage\n *\n * In its most basic usage, useCopilotReadable accepts a single string argument\n * representing any piece of app state, making it available for the Copilot to use\n * as context when responding to user input.\n *\n * ```tsx\n * import { useCopilotReadable } from \"@copilotkit/react-core\";\n *\n * export function MyComponent() {\n *   const [employees, setEmployees] = useState([]);\n *\n *   useCopilotReadable({\n *     description: \"The list of employees\",\n *     value: employees,\n *   });\n * }\n * ```\n *\n * ### Nested Components\n *\n * Optionally, you can maintain the hierarchical structure of information by passing\n * `parentId`. This allows you to use `useCopilotReadable` in nested components:\n *\n * ```tsx /employeeContextId/1 {17,23}\n * import { useCopilotReadable } from \"@copilotkit/react-core\";\n *\n * function Employee(props: EmployeeProps) {\n *   const { employeeName, workProfile, metadata } = props;\n *\n *   // propagate any information to copilot\n *   const employeeContextId = useCopilotReadable({\n *     description: \"Employee name\",\n *     value: employeeName\n *   });\n *\n *   // Pass a parentID to maintain a hierarchical structure.\n *   // Especially useful with child React components, list elements, etc.\n *   useCopilotReadable({\n *     description: \"Work profile\",\n *     value: workProfile.description(),\n *     parentId: employeeContextId\n *   });\n *\n *   useCopilotReadable({\n *     description: \"Employee metadata\",\n *     value: metadata.description(),\n *     parentId: employeeContextId\n *   });\n *\n *   return (\n *     // Render as usual...\n *   );\n * }\n * ```\n */\nimport { useEffect, useRef } from \"react\";\nimport { useCopilotContext } from \"../context/copilot-context\";\nimport { useAgentContext } from \"@copilotkitnext/react\";\n\n/**\n * Options for the useCopilotReadable hook.\n */\nexport interface UseCopilotReadableOptions {\n  /**\n   * The description of the information to be added to the Copilot context.\n   */\n  description: string;\n  /**\n   * The value to be added to the Copilot context. Object values are automatically stringified.\n   */\n  value: any;\n  /**\n   * The ID of the parent context, if any.\n   */\n  parentId?: string;\n  /**\n   * An array of categories to control which context are visible where. Particularly useful\n   * with CopilotTextarea (see `useMakeAutosuggestionFunction`)\n   */\n  categories?: string[];\n\n  /**\n   * Whether the context is available to the Copilot.\n   */\n  available?: \"enabled\" | \"disabled\";\n\n  /**\n   * A custom conversion function to use to serialize the value to a string. If not provided, the value\n   * will be serialized using `JSON.stringify`.\n   */\n  convert?: (description: string, value: any) => string;\n}\n\nfunction convertToJSON(description: string, value: any): string {\n  return `${description}: ${typeof value === \"string\" ? value : JSON.stringify(value)}`;\n}\n\n/**\n * Adds the given information to the Copilot context to make it readable by Copilot.\n */\nexport function useCopilotReadable(\n  { description, value }: UseCopilotReadableOptions,\n  dependencies?: any[],\n): undefined {\n  useAgentContext({\n    description,\n    value,\n  });\n  return;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiEA,mBAAgC;AA2CzB,SAAS,mBACd,EAAE,aAAa,MAAM,GACrB,cACW;AACX,oCAAgB;AAAA,IACd;AAAA,IACA;AAAA,EACF,CAAC;AACD;AACF;","names":[]}
+{"version":3,"sources":["../../src/hooks/use-copilot-readable.ts"],"sourcesContent":["/**\n * `useCopilotReadable` is a React hook that provides app-state and other information\n * to the Copilot. Optionally, the hook can also handle hierarchical state within your\n * application, passing these parent-child relationships to the Copilot.\n *\n * ## Usage\n *\n * ### Simple Usage\n *\n * In its most basic usage, useCopilotReadable accepts a single string argument\n * representing any piece of app state, making it available for the Copilot to use\n * as context when responding to user input.\n *\n * ```tsx\n * import { useCopilotReadable } from \"@copilotkit/react-core\";\n *\n * export function MyComponent() {\n *   const [employees, setEmployees] = useState([]);\n *\n *   useCopilotReadable({\n *     description: \"The list of employees\",\n *     value: employees,\n *   });\n * }\n * ```\n *\n * ### Nested Components\n *\n * Optionally, you can maintain the hierarchical structure of information by passing\n * `parentId`. This allows you to use `useCopilotReadable` in nested components:\n *\n * ```tsx /employeeContextId/1 {17,23}\n * import { useCopilotReadable } from \"@copilotkit/react-core\";\n *\n * function Employee(props: EmployeeProps) {\n *   const { employeeName, workProfile, metadata } = props;\n *\n *   // propagate any information to copilot\n *   const employeeContextId = useCopilotReadable({\n *     description: \"Employee name\",\n *     value: employeeName\n *   });\n *\n *   // Pass a parentID to maintain a hierarchical structure.\n *   // Especially useful with child React components, list elements, etc.\n *   useCopilotReadable({\n *     description: \"Work profile\",\n *     value: workProfile.description(),\n *     parentId: employeeContextId\n *   });\n *\n *   useCopilotReadable({\n *     description: \"Employee metadata\",\n *     value: metadata.description(),\n *     parentId: employeeContextId\n *   });\n *\n *   return (\n *     // Render as usual...\n *   );\n * }\n * ```\n */\nimport { useCopilotKit } from \"@copilotkitnext/react\";\nimport { useEffect, useRef } from \"react\";\n\ntype DataType = object | number | string | boolean | null | undefined;\n\n/**\n * Options for the useCopilotReadable hook.\n */\nexport interface UseCopilotReadableOptions {\n  /**\n   * The description of the information to be added to the Copilot context.\n   */\n  description: string;\n  /**\n   * The value to be added to the Copilot context. Object values are automatically stringified.\n   */\n  value: DataType | Record<string, any> | DataType[];\n  /**\n   * The ID of the parent context, if any.\n   */\n  parentId?: string;\n  /**\n   * An array of categories to control which context are visible where. Particularly useful\n   * with CopilotTextarea (see `useMakeAutosuggestionFunction`)\n   */\n  categories?: string[];\n\n  /**\n   * Whether the context is available to the Copilot.\n   */\n  available?: \"enabled\" | \"disabled\";\n\n  /**\n   * A custom conversion function to use to serialize the value to a string. If not provided, the value\n   * will be serialized using `JSON.stringify`.\n   */\n  convert?: (value: any) => string;\n}\n\n/**\n * Adds the given information to the Copilot context to make it readable by Copilot.\n */\nexport function useCopilotReadable(\n  { description, value, convert, available }: UseCopilotReadableOptions,\n  dependencies?: any[],\n): string | undefined {\n  const { copilotkit } = useCopilotKit();\n  const ctxIdRef = useRef<string | undefined>(undefined);\n  useEffect(() => {\n    if (!copilotkit) return;\n\n    const found = Object.entries(copilotkit.context).find(([id, ctxItem]) => {\n      return JSON.stringify({ description, value }) == JSON.stringify(ctxItem);\n    });\n    if (found) {\n      ctxIdRef.current = found[0];\n      if (available === \"disabled\") copilotkit.removeContext(ctxIdRef.current);\n      return;\n    }\n    if (!found && available === \"disabled\") return;\n\n    ctxIdRef.current = copilotkit.addContext({\n      description,\n      value: (convert ?? JSON.stringify)(value),\n    });\n\n    return () => {\n      if (!ctxIdRef.current) return;\n      copilotkit.removeContext(ctxIdRef.current);\n    };\n  }, [description, value, convert]);\n\n  return ctxIdRef.current;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA+DA,mBAA8B;AAC9B,IAAAA,gBAAkC;AAyC3B,SAAS,mBACd,EAAE,aAAa,OAAO,SAAS,UAAU,GACzC,cACoB;AACpB,QAAM,EAAE,WAAW,QAAI,4BAAc;AACrC,QAAM,eAAW,sBAA2B,MAAS;AACrD,+BAAU,MAAM;AACd,QAAI,CAAC;AAAY;AAEjB,UAAM,QAAQ,OAAO,QAAQ,WAAW,OAAO,EAAE,KAAK,CAAC,CAAC,IAAI,OAAO,MAAM;AACvE,aAAO,KAAK,UAAU,EAAE,aAAa,MAAM,CAAC,KAAK,KAAK,UAAU,OAAO;AAAA,IACzE,CAAC;AACD,QAAI,OAAO;AACT,eAAS,UAAU,MAAM,CAAC;AAC1B,UAAI,cAAc;AAAY,mBAAW,cAAc,SAAS,OAAO;AACvE;AAAA,IACF;AACA,QAAI,CAAC,SAAS,cAAc;AAAY;AAExC,aAAS,UAAU,WAAW,WAAW;AAAA,MACvC;AAAA,MACA,QAAQ,4BAAW,KAAK,WAAW,KAAK;AAAA,IAC1C,CAAC;AAED,WAAO,MAAM;AACX,UAAI,CAAC,SAAS;AAAS;AACvB,iBAAW,cAAc,SAAS,OAAO;AAAA,IAC3C;AAAA,EACF,GAAG,CAAC,aAAa,OAAO,OAAO,CAAC;AAEhC,SAAO,SAAS;AAClB;","names":["import_react"]}

package/dist/hooks/use-copilot-readable.mjs

@@ -1,6 +1,6 @@
 import {
   useCopilotReadable
-} from "../chunk-2CYJN455.mjs";
+} from "../chunk-RQ6LWR6S.mjs";
 import "../chunk-SKC7AJIV.mjs";
 export {
   useCopilotReadable

package/dist/index.js

@@ -4420,22 +4420,45 @@ function useMakeCopilotDocumentReadable(document2, categories, dependencies = []
 
 // src/hooks/use-copilot-readable.ts
 var import_react39 = require("@copilotkitnext/react");
-function useCopilotReadable({ description, value }, dependencies) {
-  (0, import_react39.useAgentContext)({
-    description,
-    value
-  });
-  return;
+var import_react40 = require("react");
+function useCopilotReadable({ description, value, convert, available }, dependencies) {
+  const { copilotkit } = (0, import_react39.useCopilotKit)();
+  const ctxIdRef = (0, import_react40.useRef)(void 0);
+  (0, import_react40.useEffect)(() => {
+    if (!copilotkit)
+      return;
+    const found = Object.entries(copilotkit.context).find(([id, ctxItem]) => {
+      return JSON.stringify({ description, value }) == JSON.stringify(ctxItem);
+    });
+    if (found) {
+      ctxIdRef.current = found[0];
+      if (available === "disabled")
+        copilotkit.removeContext(ctxIdRef.current);
+      return;
+    }
+    if (!found && available === "disabled")
+      return;
+    ctxIdRef.current = copilotkit.addContext({
+      description,
+      value: (convert != null ? convert : JSON.stringify)(value)
+    });
+    return () => {
+      if (!ctxIdRef.current)
+        return;
+      copilotkit.removeContext(ctxIdRef.current);
+    };
+  }, [description, value, convert]);
+  return ctxIdRef.current;
 }
 
 // src/hooks/use-coagent.ts
-var import_react40 = require("react");
-var import_react41 = require("@copilotkitnext/react");
+var import_react41 = require("react");
+var import_react42 = require("@copilotkitnext/react");
 function useCoAgent(options) {
-  const { agent } = (0, import_react41.useAgent)({ agentId: options.name });
-  const { copilotkit } = (0, import_react41.useCopilotKit)();
+  const { agent } = (0, import_react42.useAgent)({ agentId: options.name });
+  const { copilotkit } = (0, import_react42.useCopilotKit)();
   const nodeName = useAgentNodeName(options.name);
-  const handleStateUpdate = (0, import_react40.useCallback)(
+  const handleStateUpdate = (0, import_react41.useCallback)(
     (newState) => {
       if (!agent)
         return;
@@ -4448,7 +4471,7 @@ function useCoAgent(options) {
     },
     [agent == null ? void 0 : agent.state, agent == null ? void 0 : agent.setState]
   );
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     var _a;
     if (!options.config && !options.configurable)
       return;
@@ -4460,22 +4483,22 @@ function useCoAgent(options) {
     }
     copilotkit.setProperties(config);
   }, [options.config, options.configurable]);
-  const externalStateStr = (0, import_react40.useMemo)(
+  const externalStateStr = (0, import_react41.useMemo)(
     () => isExternalStateManagement(options) ? JSON.stringify(options.state) : void 0,
     [isExternalStateManagement(options) ? JSON.stringify(options.state) : void 0]
   );
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     if ((agent == null ? void 0 : agent.state) && isExternalStateManagement(options) && JSON.stringify(options.state) !== JSON.stringify(agent.state)) {
       handleStateUpdate(options.state);
     }
   }, [agent, externalStateStr, handleStateUpdate]);
-  const hasStateValues = (0, import_react40.useCallback)((value) => {
+  const hasStateValues = (0, import_react41.useCallback)((value) => {
     return Boolean(value && Object.keys(value).length);
   }, []);
-  const initialStateRef = (0, import_react40.useRef)(
+  const initialStateRef = (0, import_react41.useRef)(
     isExternalStateManagement(options) ? options.state : "initialState" in options ? options.initialState : void 0
   );
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     if (isExternalStateManagement(options)) {
       initialStateRef.current = options.state;
     } else if ("initialState" in options) {
@@ -4484,7 +4507,7 @@ function useCoAgent(options) {
   }, [
     isExternalStateManagement(options) ? JSON.stringify(options.state) : "initialState" in options ? JSON.stringify(options.initialState) : void 0
   ]);
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     if (!agent)
       return;
     const subscriber = {
@@ -4512,7 +4535,7 @@ function useCoAgent(options) {
       subscription.unsubscribe();
     };
   }, [agent, handleStateUpdate, hasStateValues]);
-  return (0, import_react40.useMemo)(() => {
+  return (0, import_react41.useMemo)(() => {
     var _a, _b, _c;
     if (!agent) {
       const noop = () => {
@@ -4568,12 +4591,12 @@ var isExternalStateManagement = (options) => {
 
 // src/hooks/use-copilot-runtime-client.ts
 var import_runtime_client_gql3 = require("@copilotkit/runtime-client-gql");
-var import_react42 = require("react");
+var import_react43 = require("react");
 var import_shared22 = require("@copilotkit/shared");
 var useCopilotRuntimeClient = (options) => {
   const { setBannerError } = useToast();
   const _a = options, { showDevConsole, onError } = _a, runtimeOptions = __objRest(_a, ["showDevConsole", "onError"]);
-  const lastStructuredErrorRef = (0, import_react42.useRef)(null);
+  const lastStructuredErrorRef = (0, import_react43.useRef)(null);
   const traceUIError = (error, originalError) => __async(void 0, null, function* () {
     try {
       const errorEvent = {
@@ -4599,7 +4622,7 @@ var useCopilotRuntimeClient = (options) => {
       console.error("Error in onError handler:", error2);
     }
   });
-  const runtimeClient = (0, import_react42.useMemo)(() => {
+  const runtimeClient = (0, import_react43.useMemo)(() => {
     return new import_runtime_client_gql3.CopilotRuntimeClient(__spreadProps(__spreadValues({}, runtimeOptions), {
       handleGQLErrors: (error) => {
         var _a2;
@@ -4678,28 +4701,28 @@ function createStructuredError(gqlError) {
 }
 
 // src/hooks/use-copilot-authenticated-action.ts
-var import_react43 = require("react");
-var import_react44 = __toESM(require("react"));
+var import_react44 = require("react");
+var import_react45 = __toESM(require("react"));
 function useCopilotAuthenticatedAction_c(action, dependencies) {
   const { authConfig_c, authStates_c, setAuthStates_c } = useCopilotContext();
-  const pendingActionRef = (0, import_react43.useRef)(null);
-  const executeAction = (0, import_react43.useCallback)(
+  const pendingActionRef = (0, import_react44.useRef)(null);
+  const executeAction = (0, import_react44.useCallback)(
     (props) => {
       if (typeof action.render === "function") {
         return action.render(props);
       }
-      return action.render || import_react44.default.createElement(import_react43.Fragment);
+      return action.render || import_react45.default.createElement(import_react44.Fragment);
     },
     [action]
   );
-  const wrappedRender = (0, import_react43.useCallback)(
+  const wrappedRender = (0, import_react44.useCallback)(
     (props) => {
       const isAuthenticated = Object.values(authStates_c || {}).some(
         (state) => state.status === "authenticated"
       );
       if (!isAuthenticated) {
         pendingActionRef.current = props;
-        return (authConfig_c == null ? void 0 : authConfig_c.SignInComponent) ? import_react44.default.createElement(authConfig_c.SignInComponent, {
+        return (authConfig_c == null ? void 0 : authConfig_c.SignInComponent) ? import_react45.default.createElement(authConfig_c.SignInComponent, {
           onSignInComplete: (authState) => {
             setAuthStates_c == null ? void 0 : setAuthStates_c((prev) => __spreadProps(__spreadValues({}, prev), { [action.name]: authState }));
             if (pendingActionRef.current) {
@@ -4707,7 +4730,7 @@ function useCopilotAuthenticatedAction_c(action, dependencies) {
               pendingActionRef.current = null;
             }
           }
-        }) : import_react44.default.createElement(import_react43.Fragment);
+        }) : import_react45.default.createElement(import_react44.Fragment);
       }
       return executeAction(props);
     },
@@ -4722,13 +4745,13 @@ function useCopilotAuthenticatedAction_c(action, dependencies) {
 }
 
 // src/hooks/use-langgraph-interrupt.ts
-var import_react45 = require("react");
+var import_react46 = require("react");
 var import_shared23 = require("@copilotkit/shared");
 function useLangGraphInterrupt(action, dependencies) {
-  const { setInterruptAction, removeInterruptAction, interruptActions, threadId } = (0, import_react45.useContext)(CopilotContext);
+  const { setInterruptAction, removeInterruptAction, interruptActions, threadId } = (0, import_react46.useContext)(CopilotContext);
   const { addToast } = useToast();
   const actionId = (0, import_shared23.dataToUUID)(action, "lgAction");
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (!action)
       return;
     setInterruptAction(__spreadProps(__spreadValues({}, action), { id: actionId }));
@@ -4739,10 +4762,10 @@ function useLangGraphInterrupt(action, dependencies) {
 }
 
 // src/hooks/use-copilot-additional-instructions.ts
-var import_react46 = require("react");
+var import_react47 = require("react");
 function useCopilotAdditionalInstructions({ instructions, available = "enabled" }, dependencies) {
   const { setAdditionalInstructions } = useCopilotContext();
-  (0, import_react46.useEffect)(() => {
+  (0, import_react47.useEffect)(() => {
     if (available === "disabled")
       return;
     setAdditionalInstructions((prevInstructions) => [...prevInstructions || [], instructions]);