@copilotkit/react-core

Version:

github.com/CopilotKit/CopilotKit

CopilotKit/CopilotKit

1 lines • 4.95 kB

Source Map (JSON)

View Raw

{"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\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\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":";AA+DA,SAAS,qBAAqB;AAC9B,SAAS,WAAW,cAAc;AAuC3B,SAAS,mBACd,EAAE,aAAa,OAAO,SAAS,UAAU,GACzC,cACoB;AACpB,QAAM,EAAE,WAAW,IAAI,cAAc;AACrC,QAAM,WAAW,OAA2B,MAAS;AACrD,YAAU,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":[]}