@copilotkit/react-core 1.4.1-pre.2 → 1.4.1-pre.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +45 -3
- package/dist/chunk-2KCEHGSI.mjs +192 -0
- package/dist/chunk-2KCEHGSI.mjs.map +1 -0
- package/dist/{chunk-MX2OYLRS.mjs → chunk-DT52QX4H.mjs} +4 -4
- package/dist/{chunk-TRXKPXDE.mjs → chunk-H4VZMKR6.mjs} +2 -2
- package/dist/{chunk-G2K6T2QU.mjs → chunk-JDQCJCAQ.mjs} +38 -11
- package/dist/chunk-JDQCJCAQ.mjs.map +1 -0
- package/dist/chunk-L34MHAXR.mjs +1 -0
- package/dist/{chunk-7DFHFZJT.mjs → chunk-LMFSB5D5.mjs} +2 -2
- package/dist/chunk-LMFSB5D5.mjs.map +1 -0
- package/dist/{chunk-2MPUQRAY.mjs → chunk-LODRWFMB.mjs} +2 -1
- package/dist/chunk-LODRWFMB.mjs.map +1 -0
- package/dist/chunk-MLAS4QUR.mjs +18 -0
- package/dist/chunk-MLAS4QUR.mjs.map +1 -0
- package/dist/{chunk-7LKXEJXM.mjs → chunk-MWZO6TUR.mjs} +3 -2
- package/dist/chunk-MWZO6TUR.mjs.map +1 -0
- package/dist/chunk-O7ARI5CV.mjs +31 -0
- package/dist/chunk-O7ARI5CV.mjs.map +1 -0
- package/dist/chunk-ODN4H66E.mjs +31 -0
- package/dist/chunk-ODN4H66E.mjs.map +1 -0
- package/dist/{chunk-6YEMNWKE.mjs → chunk-P6VS7ST4.mjs} +177 -5
- package/dist/chunk-P6VS7ST4.mjs.map +1 -0
- package/dist/{chunk-ANOG3W5S.mjs → chunk-QDGDXRRJ.mjs} +2 -2
- package/dist/{chunk-K4HZL7SA.mjs → chunk-V22C3DOQ.mjs} +3 -3
- package/dist/{chunk-27IPQFJP.mjs → chunk-XINZBP3J.mjs} +2 -2
- package/dist/chunk-XINZBP3J.mjs.map +1 -0
- package/dist/components/copilot-provider/copilotkit.d.ts +2 -1
- package/dist/components/copilot-provider/copilotkit.js +283 -26
- package/dist/components/copilot-provider/copilotkit.js.map +1 -1
- package/dist/components/copilot-provider/copilotkit.mjs +8 -2
- package/dist/components/copilot-provider/index.js +281 -26
- package/dist/components/copilot-provider/index.js.map +1 -1
- package/dist/components/copilot-provider/index.mjs +6 -3
- package/dist/components/index.js +281 -26
- package/dist/components/index.js.map +1 -1
- package/dist/components/index.mjs +6 -4
- package/dist/components/toast/exclamation-mark-icon.d.ts +9 -0
- package/dist/components/toast/exclamation-mark-icon.js +55 -0
- package/dist/components/toast/exclamation-mark-icon.js.map +1 -0
- package/dist/components/toast/exclamation-mark-icon.mjs +8 -0
- package/dist/components/toast/toast-provider.d.ts +29 -0
- package/dist/components/toast/toast-provider.js +255 -0
- package/dist/components/toast/toast-provider.js.map +1 -0
- package/dist/components/toast/toast-provider.mjs +11 -0
- package/dist/context/copilot-context.d.ts +2 -0
- package/dist/context/copilot-context.js +1 -0
- package/dist/context/copilot-context.js.map +1 -1
- package/dist/context/copilot-context.mjs +1 -1
- package/dist/context/index.js +1 -0
- package/dist/context/index.js.map +1 -1
- package/dist/context/index.mjs +1 -1
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.js +118 -62
- package/dist/hooks/index.js.map +1 -1
- package/dist/hooks/index.mjs +17 -12
- package/dist/hooks/use-chat.js +78 -26
- package/dist/hooks/use-chat.js.map +1 -1
- package/dist/hooks/use-chat.mjs +4 -1
- package/dist/hooks/use-coagent-state-render.d.ts +1 -1
- package/dist/hooks/use-coagent-state-render.js +1 -0
- package/dist/hooks/use-coagent-state-render.js.map +1 -1
- package/dist/hooks/use-coagent-state-render.mjs +2 -2
- package/dist/hooks/use-coagent.js +96 -43
- package/dist/hooks/use-coagent.js.map +1 -1
- package/dist/hooks/use-coagent.mjs +9 -7
- package/dist/hooks/use-copilot-action.d.ts +1 -1
- package/dist/hooks/use-copilot-action.js +2 -0
- package/dist/hooks/use-copilot-action.js.map +1 -1
- package/dist/hooks/use-copilot-action.mjs +2 -2
- package/dist/hooks/use-copilot-chat.js +98 -45
- package/dist/hooks/use-copilot-chat.js.map +1 -1
- package/dist/hooks/use-copilot-chat.mjs +8 -6
- package/dist/hooks/use-copilot-readable.js +1 -0
- package/dist/hooks/use-copilot-readable.js.map +1 -1
- package/dist/hooks/use-copilot-readable.mjs +2 -2
- package/dist/hooks/use-copilot-runtime-client.d.ts +5 -0
- package/dist/hooks/use-copilot-runtime-client.js +76 -0
- package/dist/hooks/use-copilot-runtime-client.js.map +1 -0
- package/dist/hooks/use-copilot-runtime-client.mjs +10 -0
- package/dist/hooks/use-make-copilot-document-readable.js +1 -0
- package/dist/hooks/use-make-copilot-document-readable.js.map +1 -1
- package/dist/hooks/use-make-copilot-document-readable.mjs +2 -2
- package/dist/index.d.ts +2 -0
- package/dist/index.js +513 -240
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +24 -19
- package/dist/lib/copilot-task.d.ts +2 -5
- package/dist/lib/copilot-task.js.map +1 -1
- package/dist/lib/copilot-task.mjs +7 -5
- package/dist/lib/index.d.ts +1 -0
- package/dist/lib/index.js.map +1 -1
- package/dist/lib/index.mjs +7 -5
- package/dist/types/frontend-action.d.ts +8 -1
- package/dist/types/frontend-action.js.map +1 -1
- package/dist/utils/dev-console.d.ts +3 -0
- package/dist/utils/dev-console.js +42 -0
- package/dist/utils/dev-console.js.map +1 -0
- package/dist/utils/dev-console.mjs +8 -0
- package/dist/utils/dev-console.mjs.map +1 -0
- package/dist/utils/extract.js +4 -26
- package/dist/utils/extract.js.map +1 -1
- package/dist/utils/extract.mjs +6 -5
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/index.js +22 -28
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/index.mjs +10 -7
- package/package.json +5 -5
- package/src/components/copilot-provider/copilotkit.tsx +32 -1
- package/src/components/toast/exclamation-mark-icon.tsx +27 -0
- package/src/components/toast/toast-provider.tsx +209 -0
- package/src/context/copilot-context.tsx +5 -0
- package/src/hooks/index.ts +1 -0
- package/src/hooks/use-chat.ts +36 -12
- package/src/hooks/use-coagent-state-render.ts +1 -1
- package/src/hooks/use-copilot-action.ts +2 -1
- package/src/hooks/use-copilot-runtime-client.ts +24 -0
- package/src/lib/copilot-task.ts +1 -5
- package/src/types/frontend-action.ts +8 -0
- package/src/utils/dev-console.ts +18 -0
- package/src/utils/extract.ts +2 -16
- package/src/utils/index.ts +1 -0
- package/dist/chunk-27IPQFJP.mjs.map +0 -1
- package/dist/chunk-2MPUQRAY.mjs.map +0 -1
- package/dist/chunk-6YEMNWKE.mjs.map +0 -1
- package/dist/chunk-7DFHFZJT.mjs.map +0 -1
- package/dist/chunk-7LKXEJXM.mjs.map +0 -1
- package/dist/chunk-BWYAGPEF.mjs +0 -1
- package/dist/chunk-G2K6T2QU.mjs.map +0 -1
- package/dist/chunk-JD7BAH7U.mjs +0 -1
- package/dist/chunk-SPCZTZCY.mjs +0 -1
- package/dist/chunk-YJLRG5U3.mjs +0 -1
- package/dist/chunk-ZM6HV22S.mjs +0 -164
- package/dist/chunk-ZM6HV22S.mjs.map +0 -1
- /package/dist/{chunk-MX2OYLRS.mjs.map → chunk-DT52QX4H.mjs.map} +0 -0
- /package/dist/{chunk-TRXKPXDE.mjs.map → chunk-H4VZMKR6.mjs.map} +0 -0
- /package/dist/{chunk-BWYAGPEF.mjs.map → chunk-L34MHAXR.mjs.map} +0 -0
- /package/dist/{chunk-ANOG3W5S.mjs.map → chunk-QDGDXRRJ.mjs.map} +0 -0
- /package/dist/{chunk-K4HZL7SA.mjs.map → chunk-V22C3DOQ.mjs.map} +0 -0
- /package/dist/{chunk-JD7BAH7U.mjs.map → components/toast/exclamation-mark-icon.mjs.map} +0 -0
- /package/dist/{chunk-SPCZTZCY.mjs.map → components/toast/toast-provider.mjs.map} +0 -0
- /package/dist/{chunk-YJLRG5U3.mjs.map → hooks/use-copilot-runtime-client.mjs.map} +0 -0
|
@@ -0,0 +1,209 @@
|
|
|
1
|
+
import { useCopilotContext } from "../../context";
|
|
2
|
+
import { GraphQLError } from "@copilotkit/runtime-client-gql";
|
|
3
|
+
import React, { createContext, useContext, useState, useCallback } from "react";
|
|
4
|
+
import { ExclamationMarkIcon } from "./exclamation-mark-icon";
|
|
5
|
+
|
|
6
|
+
interface Toast {
|
|
7
|
+
id: string;
|
|
8
|
+
message: string | React.ReactNode;
|
|
9
|
+
type: "info" | "success" | "warning" | "error";
|
|
10
|
+
duration?: number;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
interface ToastContextValue {
|
|
14
|
+
toasts: Toast[];
|
|
15
|
+
addToast: (toast: Omit<Toast, "id">) => void;
|
|
16
|
+
addGraphQLErrorsToast: (errors: GraphQLError[]) => void;
|
|
17
|
+
removeToast: (id: string) => void;
|
|
18
|
+
enabled: boolean;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
const ToastContext = createContext<ToastContextValue | undefined>(undefined);
|
|
22
|
+
|
|
23
|
+
export function useToast() {
|
|
24
|
+
const context = useContext(ToastContext);
|
|
25
|
+
if (!context) {
|
|
26
|
+
throw new Error("useToast must be used within a ToastProvider");
|
|
27
|
+
}
|
|
28
|
+
return context;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
export function ToastProvider({
|
|
32
|
+
enabled,
|
|
33
|
+
children,
|
|
34
|
+
}: {
|
|
35
|
+
enabled: boolean;
|
|
36
|
+
children: React.ReactNode;
|
|
37
|
+
}) {
|
|
38
|
+
const [toasts, setToasts] = useState<Toast[]>([]);
|
|
39
|
+
const addToast = useCallback((toast: Omit<Toast, "id">) => {
|
|
40
|
+
const id = Math.random().toString(36).substring(2, 9);
|
|
41
|
+
|
|
42
|
+
setToasts((currentToasts) => [...currentToasts, { ...toast, id }]);
|
|
43
|
+
|
|
44
|
+
if (toast.duration) {
|
|
45
|
+
setTimeout(() => {
|
|
46
|
+
removeToast(id);
|
|
47
|
+
}, toast.duration);
|
|
48
|
+
}
|
|
49
|
+
}, []);
|
|
50
|
+
|
|
51
|
+
const addGraphQLErrorsToast = useCallback((errors: GraphQLError[]) => {
|
|
52
|
+
// We do not display these errors unless we are in dev mode.
|
|
53
|
+
// if (!showDevConsole) {
|
|
54
|
+
// return;
|
|
55
|
+
// }
|
|
56
|
+
|
|
57
|
+
const errorsToRender = errors.map((error, idx) => {
|
|
58
|
+
const message = error.message;
|
|
59
|
+
const code = error.extensions?.code as string;
|
|
60
|
+
|
|
61
|
+
return (
|
|
62
|
+
<div
|
|
63
|
+
key={idx}
|
|
64
|
+
style={{
|
|
65
|
+
marginTop: idx === 0 ? 0 : 10,
|
|
66
|
+
marginBottom: 14,
|
|
67
|
+
}}
|
|
68
|
+
>
|
|
69
|
+
<ExclamationMarkIcon style={{ marginBottom: 4 }} />
|
|
70
|
+
|
|
71
|
+
{code && (
|
|
72
|
+
<div
|
|
73
|
+
style={{
|
|
74
|
+
fontWeight: "600",
|
|
75
|
+
marginBottom: 4,
|
|
76
|
+
}}
|
|
77
|
+
>
|
|
78
|
+
Copilot Cloud Error:{" "}
|
|
79
|
+
<span style={{ fontFamily: "monospace", fontWeight: "normal" }}>{code}</span>
|
|
80
|
+
</div>
|
|
81
|
+
)}
|
|
82
|
+
<div>{message}</div>
|
|
83
|
+
</div>
|
|
84
|
+
);
|
|
85
|
+
});
|
|
86
|
+
|
|
87
|
+
addToast({
|
|
88
|
+
type: "error",
|
|
89
|
+
message: (
|
|
90
|
+
<div
|
|
91
|
+
style={{
|
|
92
|
+
fontSize: "13px",
|
|
93
|
+
maxWidth: "600px",
|
|
94
|
+
}}
|
|
95
|
+
>
|
|
96
|
+
{errorsToRender}
|
|
97
|
+
<div style={{ fontSize: "11px", opacity: 0.75 }}>
|
|
98
|
+
NOTE: This is a Copilot Cloud error, and it only displays during local development.
|
|
99
|
+
</div>
|
|
100
|
+
</div>
|
|
101
|
+
),
|
|
102
|
+
});
|
|
103
|
+
}, []);
|
|
104
|
+
|
|
105
|
+
const removeToast = useCallback((id: string) => {
|
|
106
|
+
setToasts((currentToasts) => currentToasts.filter((toast) => toast.id !== id));
|
|
107
|
+
}, []);
|
|
108
|
+
|
|
109
|
+
const value = {
|
|
110
|
+
toasts,
|
|
111
|
+
addToast,
|
|
112
|
+
addGraphQLErrorsToast,
|
|
113
|
+
removeToast,
|
|
114
|
+
enabled,
|
|
115
|
+
};
|
|
116
|
+
|
|
117
|
+
return (
|
|
118
|
+
<ToastContext.Provider value={value}>
|
|
119
|
+
<div
|
|
120
|
+
style={{
|
|
121
|
+
position: "fixed",
|
|
122
|
+
bottom: "1rem",
|
|
123
|
+
left: "50%",
|
|
124
|
+
transform: "translateX(-50%)",
|
|
125
|
+
zIndex: 50,
|
|
126
|
+
display: "flex",
|
|
127
|
+
flexDirection: "column",
|
|
128
|
+
gap: "0.5rem",
|
|
129
|
+
}}
|
|
130
|
+
>
|
|
131
|
+
{toasts.length > 1 && (
|
|
132
|
+
<div style={{ textAlign: "right" }}>
|
|
133
|
+
<button
|
|
134
|
+
onClick={() => setToasts([])}
|
|
135
|
+
style={{
|
|
136
|
+
padding: "4px 8px",
|
|
137
|
+
fontSize: "12px",
|
|
138
|
+
cursor: "pointer",
|
|
139
|
+
background: "white",
|
|
140
|
+
border: "1px solid rgba(0,0,0,0.2)",
|
|
141
|
+
borderRadius: "4px",
|
|
142
|
+
}}
|
|
143
|
+
>
|
|
144
|
+
Close All
|
|
145
|
+
</button>
|
|
146
|
+
</div>
|
|
147
|
+
)}
|
|
148
|
+
{toasts.map((toast) => (
|
|
149
|
+
<Toast
|
|
150
|
+
key={toast.id}
|
|
151
|
+
message={toast.message}
|
|
152
|
+
type={toast.type}
|
|
153
|
+
onClose={() => removeToast(toast.id)}
|
|
154
|
+
/>
|
|
155
|
+
))}
|
|
156
|
+
</div>
|
|
157
|
+
{children}
|
|
158
|
+
</ToastContext.Provider>
|
|
159
|
+
);
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
function Toast({
|
|
163
|
+
message,
|
|
164
|
+
type = "info",
|
|
165
|
+
onClose,
|
|
166
|
+
}: {
|
|
167
|
+
message: string | React.ReactNode;
|
|
168
|
+
type: "info" | "success" | "warning" | "error";
|
|
169
|
+
onClose: () => void;
|
|
170
|
+
}) {
|
|
171
|
+
const bgColors = {
|
|
172
|
+
info: "#3b82f6",
|
|
173
|
+
success: "#22c55e",
|
|
174
|
+
warning: "#eab308",
|
|
175
|
+
error: "#ef4444",
|
|
176
|
+
};
|
|
177
|
+
|
|
178
|
+
return (
|
|
179
|
+
<div
|
|
180
|
+
style={{
|
|
181
|
+
backgroundColor: bgColors[type],
|
|
182
|
+
color: "white",
|
|
183
|
+
padding: "0.5rem 1rem",
|
|
184
|
+
borderRadius: "0.25rem",
|
|
185
|
+
boxShadow: "0 2px 4px rgba(0,0,0,0.1)",
|
|
186
|
+
position: "relative",
|
|
187
|
+
minWidth: "200px",
|
|
188
|
+
}}
|
|
189
|
+
>
|
|
190
|
+
<div>{message}</div>
|
|
191
|
+
<button
|
|
192
|
+
onClick={onClose}
|
|
193
|
+
style={{
|
|
194
|
+
position: "absolute",
|
|
195
|
+
top: "0",
|
|
196
|
+
right: "0",
|
|
197
|
+
background: "none",
|
|
198
|
+
border: "none",
|
|
199
|
+
color: "white",
|
|
200
|
+
cursor: "pointer",
|
|
201
|
+
padding: "0.5rem",
|
|
202
|
+
fontSize: "1rem",
|
|
203
|
+
}}
|
|
204
|
+
>
|
|
205
|
+
✕
|
|
206
|
+
</button>
|
|
207
|
+
</div>
|
|
208
|
+
);
|
|
209
|
+
}
|
|
@@ -6,6 +6,7 @@ import { DocumentPointer } from "../types";
|
|
|
6
6
|
import { CopilotChatSuggestionConfiguration } from "../types/chat-suggestion-configuration";
|
|
7
7
|
import { CoAgentStateRender, CoAgentStateRenderProps } from "../types/coagent-action";
|
|
8
8
|
import { CoagentState } from "../types/coagent-state";
|
|
9
|
+
import { CopilotRuntimeClient } from "@copilotkit/runtime-client-gql";
|
|
9
10
|
|
|
10
11
|
/**
|
|
11
12
|
* Interface for the configuration of the Copilot API.
|
|
@@ -133,6 +134,9 @@ export interface CopilotContextParams {
|
|
|
133
134
|
setCoagentStates: React.Dispatch<React.SetStateAction<Record<string, CoagentState>>>;
|
|
134
135
|
agentSession: AgentSession | null;
|
|
135
136
|
setAgentSession: React.Dispatch<React.SetStateAction<AgentSession | null>>;
|
|
137
|
+
|
|
138
|
+
// runtime
|
|
139
|
+
runtimeClient: CopilotRuntimeClient;
|
|
136
140
|
}
|
|
137
141
|
|
|
138
142
|
const emptyCopilotContext: CopilotContextParams = {
|
|
@@ -161,6 +165,7 @@ const emptyCopilotContext: CopilotContextParams = {
|
|
|
161
165
|
getDocumentsContext: (categories: string[]) => returnAndThrowInDebug([]),
|
|
162
166
|
addDocumentContext: () => returnAndThrowInDebug(""),
|
|
163
167
|
removeDocumentContext: () => {},
|
|
168
|
+
runtimeClient: {} as any,
|
|
164
169
|
|
|
165
170
|
copilotApiConfig: new (class implements CopilotApiConfig {
|
|
166
171
|
get chatApiEndpoint(): string {
|
package/src/hooks/index.ts
CHANGED
|
@@ -8,3 +8,4 @@ export { useMakeCopilotDocumentReadable } from "./use-make-copilot-document-read
|
|
|
8
8
|
export { type UseChatHelpers } from "./use-chat";
|
|
9
9
|
export { useCopilotReadable } from "./use-copilot-readable";
|
|
10
10
|
export { useCoAgent } from "./use-coagent";
|
|
11
|
+
export { useCopilotRuntimeClient } from "./use-copilot-runtime-client";
|
package/src/hooks/use-chat.ts
CHANGED
|
@@ -8,9 +8,7 @@ import {
|
|
|
8
8
|
import {
|
|
9
9
|
Message,
|
|
10
10
|
TextMessage,
|
|
11
|
-
ActionExecutionMessage,
|
|
12
11
|
ResultMessage,
|
|
13
|
-
CopilotRuntimeClient,
|
|
14
12
|
convertMessagesToGqlInput,
|
|
15
13
|
filterAdjacentAgentStateMessages,
|
|
16
14
|
filterAgentStateMessages,
|
|
@@ -19,13 +17,15 @@ import {
|
|
|
19
17
|
MessageRole,
|
|
20
18
|
Role,
|
|
21
19
|
CopilotRequestType,
|
|
22
|
-
|
|
20
|
+
ActionInputAvailability,
|
|
23
21
|
} from "@copilotkit/runtime-client-gql";
|
|
24
22
|
|
|
25
23
|
import { CopilotApiConfig } from "../context";
|
|
26
24
|
import { FrontendAction } from "../types/frontend-action";
|
|
27
25
|
import { CoagentState } from "../types/coagent-state";
|
|
28
26
|
import { AgentSession } from "../context/copilot-context";
|
|
27
|
+
import { useToast } from "../components/toast/toast-provider";
|
|
28
|
+
import { useCopilotRuntimeClient } from "./use-copilot-runtime-client";
|
|
29
29
|
|
|
30
30
|
export type UseChatOptions = {
|
|
31
31
|
/**
|
|
@@ -139,6 +139,7 @@ export function useChat(options: UseChatOptions): UseChatHelpers {
|
|
|
139
139
|
const abortControllerRef = useRef<AbortController>();
|
|
140
140
|
const threadIdRef = useRef<string | null>(null);
|
|
141
141
|
const runIdRef = useRef<string | null>(null);
|
|
142
|
+
const { addGraphQLErrorsToast } = useToast();
|
|
142
143
|
|
|
143
144
|
const runChatCompletionRef = useRef<(previousMessages: Message[]) => Promise<Message[]>>();
|
|
144
145
|
// We need to keep a ref of coagent states because of renderAndWait - making sure
|
|
@@ -156,7 +157,7 @@ export function useChat(options: UseChatOptions): UseChatHelpers {
|
|
|
156
157
|
...(publicApiKey ? { [COPILOT_CLOUD_PUBLIC_API_KEY_HEADER]: publicApiKey } : {}),
|
|
157
158
|
};
|
|
158
159
|
|
|
159
|
-
const runtimeClient =
|
|
160
|
+
const runtimeClient = useCopilotRuntimeClient({
|
|
160
161
|
url: copilotConfig.chatApiEndpoint,
|
|
161
162
|
publicApiKey: copilotConfig.publicApiKey,
|
|
162
163
|
headers,
|
|
@@ -183,17 +184,32 @@ export function useChat(options: UseChatOptions): UseChatHelpers {
|
|
|
183
184
|
|
|
184
185
|
const messagesWithContext = [systemMessage, ...(initialMessages || []), ...previousMessages];
|
|
185
186
|
|
|
186
|
-
const stream =
|
|
187
|
+
const stream = runtimeClient.asStream(
|
|
187
188
|
runtimeClient.generateCopilotResponse({
|
|
188
189
|
data: {
|
|
189
190
|
frontend: {
|
|
190
191
|
actions: actions
|
|
191
|
-
.filter(
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
192
|
+
.filter(
|
|
193
|
+
(action) =>
|
|
194
|
+
action.available !== ActionInputAvailability.Disabled || !action.disabled,
|
|
195
|
+
)
|
|
196
|
+
.map((action) => {
|
|
197
|
+
let available: ActionInputAvailability | undefined =
|
|
198
|
+
ActionInputAvailability.Enabled;
|
|
199
|
+
if (action.disabled) {
|
|
200
|
+
available = ActionInputAvailability.Disabled;
|
|
201
|
+
} else if (action.available === "disabled") {
|
|
202
|
+
available = ActionInputAvailability.Disabled;
|
|
203
|
+
} else if (action.available === "remote") {
|
|
204
|
+
available = ActionInputAvailability.Remote;
|
|
205
|
+
}
|
|
206
|
+
return {
|
|
207
|
+
name: action.name,
|
|
208
|
+
description: action.description || "",
|
|
209
|
+
jsonSchema: JSON.stringify(actionParametersToJsonSchema(action.parameters || [])),
|
|
210
|
+
available,
|
|
211
|
+
};
|
|
212
|
+
}),
|
|
197
213
|
url: window.location.href,
|
|
198
214
|
},
|
|
199
215
|
threadId: threadIdRef.current,
|
|
@@ -246,7 +262,15 @@ export function useChat(options: UseChatOptions): UseChatHelpers {
|
|
|
246
262
|
|
|
247
263
|
try {
|
|
248
264
|
while (true) {
|
|
249
|
-
|
|
265
|
+
let done, value;
|
|
266
|
+
|
|
267
|
+
try {
|
|
268
|
+
const readResult = await reader.read();
|
|
269
|
+
done = readResult.done;
|
|
270
|
+
value = readResult.value;
|
|
271
|
+
} catch (readError) {
|
|
272
|
+
break;
|
|
273
|
+
}
|
|
250
274
|
|
|
251
275
|
if (done) {
|
|
252
276
|
break;
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
*
|
|
38
38
|
* ### Example
|
|
39
39
|
* A great example of this is in our Perplexity Clone where we render the progress of an agent's internet search as it is happening.
|
|
40
|
-
* You can play around with it below or learn how to build it with its [demo](/coagents/
|
|
40
|
+
* You can play around with it below or learn how to build it with its [demo](/coagents/videos/perplexity-clone).
|
|
41
41
|
*
|
|
42
42
|
* <Callout type="info">
|
|
43
43
|
* This example is hosted on Vercel and may take a few seconds to load.
|
|
@@ -119,7 +119,7 @@
|
|
|
119
119
|
*
|
|
120
120
|
* ## Generative UI
|
|
121
121
|
*
|
|
122
|
-
* This hooks enables you to dynamically generate UI elements and render them in the copilot chat. For more information, check out the [Generative UI](/
|
|
122
|
+
* This hooks enables you to dynamically generate UI elements and render them in the copilot chat. For more information, check out the [Generative UI](/guides/generative-ui) page.
|
|
123
123
|
*/
|
|
124
124
|
import { Parameter, randomId } from "@copilotkit/shared";
|
|
125
125
|
import { createElement, Fragment, useEffect, useRef } from "react";
|
|
@@ -236,6 +236,7 @@ export function useCopilotAction<const T extends Parameter[] | [] = []>(
|
|
|
236
236
|
action.description,
|
|
237
237
|
action.name,
|
|
238
238
|
action.disabled,
|
|
239
|
+
action.available,
|
|
239
240
|
// This should be faster than deep equality checking
|
|
240
241
|
// In addition, all major JS engines guarantee the order of object keys
|
|
241
242
|
JSON.stringify(action.parameters),
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import {
|
|
2
|
+
CopilotRuntimeClient,
|
|
3
|
+
CopilotRuntimeClientOptions,
|
|
4
|
+
GraphQLError,
|
|
5
|
+
} from "@copilotkit/runtime-client-gql";
|
|
6
|
+
import { useToast } from "../components/toast/toast-provider";
|
|
7
|
+
import { useMemo } from "react";
|
|
8
|
+
|
|
9
|
+
export const useCopilotRuntimeClient = (options: CopilotRuntimeClientOptions) => {
|
|
10
|
+
const { addGraphQLErrorsToast } = useToast();
|
|
11
|
+
|
|
12
|
+
const runtimeClient = useMemo(() => {
|
|
13
|
+
return new CopilotRuntimeClient({
|
|
14
|
+
...options,
|
|
15
|
+
handleGQLErrors: (error) => {
|
|
16
|
+
if ((error as any).graphQLErrors.length) {
|
|
17
|
+
addGraphQLErrorsToast((error as any).graphQLErrors as GraphQLError[]);
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
});
|
|
21
|
+
}, [options, addGraphQLErrorsToast]);
|
|
22
|
+
|
|
23
|
+
return runtimeClient;
|
|
24
|
+
};
|
package/src/lib/copilot-task.ts
CHANGED
|
@@ -40,7 +40,9 @@ interface CompleteStateNoArgs<T extends Parameter[] | [] = []> {
|
|
|
40
40
|
interface InProgressStateWait<T extends Parameter[] | [] = []> {
|
|
41
41
|
status: "inProgress";
|
|
42
42
|
args: Partial<MappedParameterTypes<T>>;
|
|
43
|
+
/** @deprecated use respond instead */
|
|
43
44
|
handler: undefined;
|
|
45
|
+
respond: undefined;
|
|
44
46
|
result: undefined;
|
|
45
47
|
}
|
|
46
48
|
|
|
@@ -108,8 +110,14 @@ export type ActionRenderPropsNoArgsWait<T extends Parameter[] | [] = []> =
|
|
|
108
110
|
| ExecutingStateNoArgsWait<T>
|
|
109
111
|
| InProgressStateNoArgsWait<T>;
|
|
110
112
|
|
|
113
|
+
export type FrontendActionAvailability = "disabled" | "enabled" | "remote";
|
|
114
|
+
|
|
111
115
|
export type FrontendAction<T extends Parameter[] | [] = []> = Action<T> & {
|
|
116
|
+
/**
|
|
117
|
+
* @deprecated Use `available` instead.
|
|
118
|
+
*/
|
|
112
119
|
disabled?: boolean;
|
|
120
|
+
available?: FrontendActionAvailability;
|
|
113
121
|
followUp?: boolean;
|
|
114
122
|
} & (
|
|
115
123
|
| {
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export function shouldShowDevConsole(showDevConsole: boolean | "auto"): boolean {
|
|
2
|
+
if (typeof showDevConsole === "boolean") {
|
|
3
|
+
return showDevConsole;
|
|
4
|
+
}
|
|
5
|
+
return (
|
|
6
|
+
getHostname() === "localhost" ||
|
|
7
|
+
getHostname() === "127.0.0.1" ||
|
|
8
|
+
getHostname() === "0.0.0.0" ||
|
|
9
|
+
getHostname() === "::1"
|
|
10
|
+
);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
function getHostname(): string {
|
|
14
|
+
if (typeof window !== "undefined" && window.location) {
|
|
15
|
+
return window.location.hostname;
|
|
16
|
+
}
|
|
17
|
+
return "";
|
|
18
|
+
}
|
package/src/utils/extract.ts
CHANGED
|
@@ -99,22 +99,8 @@ export async function extract<const T extends Parameter[]>({
|
|
|
99
99
|
role: Role.User,
|
|
100
100
|
});
|
|
101
101
|
|
|
102
|
-
const
|
|
103
|
-
|
|
104
|
-
...(context.copilotApiConfig.publicApiKey
|
|
105
|
-
? { [COPILOT_CLOUD_PUBLIC_API_KEY_HEADER]: context.copilotApiConfig.publicApiKey }
|
|
106
|
-
: {}),
|
|
107
|
-
};
|
|
108
|
-
|
|
109
|
-
const runtimeClient = new CopilotRuntimeClient({
|
|
110
|
-
url: context.copilotApiConfig.chatApiEndpoint,
|
|
111
|
-
publicApiKey: context.copilotApiConfig.publicApiKey,
|
|
112
|
-
headers,
|
|
113
|
-
credentials: context.copilotApiConfig.credentials,
|
|
114
|
-
});
|
|
115
|
-
|
|
116
|
-
const response = CopilotRuntimeClient.asStream(
|
|
117
|
-
runtimeClient.generateCopilotResponse({
|
|
102
|
+
const response = context.runtimeClient.asStream(
|
|
103
|
+
context.runtimeClient.generateCopilotResponse({
|
|
118
104
|
data: {
|
|
119
105
|
frontend: {
|
|
120
106
|
actions: [
|
package/src/utils/index.ts
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/use-coagent-state-render.ts"],"sourcesContent":["/**\n * <Callout type=\"info\">\n * Usage of this hook assumes some additional setup in your application, for more information\n * on that see the CoAgents <span className=\"text-blue-500\">[Agentic Generative UI documentation](/coagents/chat-ui/render-agent-state)</span>.\n * </Callout>\n *\n * The useCoAgentStateRender hook allows you to render UI components or text based on a Agentic Copilot's state.\n * This is particularly useful for showing intermediate state or progress during Agentic Copilot operations.\n *\n * ## Usage\n *\n * ### Simple Usage\n *\n * ```tsx\n * import { useCoagentStateRender } from \"@copilotkit/react-core\";\n *\n * type YourAgentState = {\n * agent_state_property: string;\n * }\n *\n * useCoagentStateRender<YourAgentState>({\n * name: \"basic_agent\",\n * nodeName: \"optionally_specify_a_specific_node\",\n * render: ({ status, state, nodeName }) => {\n * return (\n * <YourComponent\n * agentStateProperty={state.agent_state_property}\n * status={status}\n * nodeName={nodeName}\n * />\n * );\n * },\n * });\n * ```\n *\n * This allows for you to render UI components or text based on what is happening within the agent.\n *\n * ### Example\n * A great example of this is in our Perplexity Clone where we render the progress of an agent's internet search as it is happening.\n * You can play around with it below or learn how to build it with its [demo](/coagents/demos/perplexity-clone).\n *\n * <Callout type=\"info\">\n * This example is hosted on Vercel and may take a few seconds to load.\n * </Callout>\n *\n * <iframe src=\"https://examples-coagents-ai-researcher-ui.vercel.app/\" className=\"w-full rounded-lg border h-[700px] my-4\" />\n */\n\nimport { useRef, useContext, useEffect } from \"react\";\nimport { CopilotContext } from \"../context/copilot-context\";\nimport { randomId } from \"@copilotkit/shared\";\nimport { CoAgentStateRender } from \"../types/coagent-action\";\n\n/**\n * This hook is used to render agent state with custom UI components or text. This is particularly\n * useful for showing intermediate state or progress during Agentic Copilot operations.\n * To get started using rendering intermediate state through this hook, checkout the documentation.\n *\n * https://docs.copilotkit.ai/coagents/chat-ui/render-agent-state.\n */\n\n// We implement useCoAgentStateRender dependency handling so that\n// the developer has the option to not provide any dependencies.\n// see useCopilotAction for more details about this approach.\nexport function useCoAgentStateRender<T = any>(\n action: CoAgentStateRender<T>,\n dependencies?: any[],\n): void {\n const {\n setCoAgentStateRender,\n removeCoAgentStateRender,\n coAgentStateRenders,\n chatComponentsCache,\n } = useContext(CopilotContext);\n const idRef = useRef<string>(randomId());\n\n const key = `${action.name}-${action.nodeName || \"global\"}`;\n\n if (dependencies === undefined) {\n if (coAgentStateRenders[idRef.current]) {\n coAgentStateRenders[idRef.current].handler = action.handler as any;\n if (typeof action.render === \"function\") {\n if (chatComponentsCache.current !== null) {\n chatComponentsCache.current.coAgentStateRenders[key] = action.render;\n }\n }\n }\n }\n\n useEffect(() => {\n setCoAgentStateRender(idRef.current, action as any);\n if (chatComponentsCache.current !== null && action.render !== undefined) {\n chatComponentsCache.current.coAgentStateRenders[key] = action.render;\n }\n return () => {\n removeCoAgentStateRender(idRef.current);\n };\n }, [\n setCoAgentStateRender,\n removeCoAgentStateRender,\n action.name,\n // include render only if it's a string\n typeof action.render === \"string\" ? action.render : undefined,\n // dependencies set by the developer\n ...(dependencies || []),\n ]);\n}\n"],"mappings":";;;;;AAgDA,SAAS,QAAQ,YAAY,iBAAiB;AAE9C,SAAS,gBAAgB;AAclB,SAAS,sBACd,QACA,cACM;AACN,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,cAAc;AAC7B,QAAM,QAAQ,OAAe,SAAS,CAAC;AAEvC,QAAM,MAAM,GAAG,OAAO,QAAQ,OAAO,YAAY;AAEjD,MAAI,iBAAiB,QAAW;AAC9B,QAAI,oBAAoB,MAAM,OAAO,GAAG;AACtC,0BAAoB,MAAM,OAAO,EAAE,UAAU,OAAO;AACpD,UAAI,OAAO,OAAO,WAAW,YAAY;AACvC,YAAI,oBAAoB,YAAY,MAAM;AACxC,8BAAoB,QAAQ,oBAAoB,GAAG,IAAI,OAAO;AAAA,QAChE;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,YAAU,MAAM;AACd,0BAAsB,MAAM,SAAS,MAAa;AAClD,QAAI,oBAAoB,YAAY,QAAQ,OAAO,WAAW,QAAW;AACvE,0BAAoB,QAAQ,oBAAoB,GAAG,IAAI,OAAO;AAAA,IAChE;AACA,WAAO,MAAM;AACX,+BAAyB,MAAM,OAAO;AAAA,IACxC;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA,OAAO;AAAA;AAAA,IAEP,OAAO,OAAO,WAAW,WAAW,OAAO,SAAS;AAAA;AAAA,IAEpD,GAAI,gBAAgB,CAAC;AAAA,EACvB,CAAC;AACH;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/context/copilot-context.tsx"],"sourcesContent":["import { CopilotCloudConfig, FunctionCallHandler } from \"@copilotkit/shared\";\nimport { ActionRenderProps, FrontendAction } from \"../types/frontend-action\";\nimport React from \"react\";\nimport { TreeNodeId } from \"../hooks/use-tree\";\nimport { DocumentPointer } from \"../types\";\nimport { CopilotChatSuggestionConfiguration } from \"../types/chat-suggestion-configuration\";\nimport { CoAgentStateRender, CoAgentStateRenderProps } from \"../types/coagent-action\";\nimport { CoagentState } from \"../types/coagent-state\";\n\n/**\n * Interface for the configuration of the Copilot API.\n */\nexport interface CopilotApiConfig {\n /**\n * The public API key for Copilot Cloud.\n */\n publicApiKey?: string;\n\n /**\n * The configuration for Copilot Cloud.\n */\n cloud?: CopilotCloudConfig;\n\n /**\n * The endpoint for the chat API.\n */\n chatApiEndpoint: string;\n\n /**\n * The endpoint for the Copilot transcribe audio service.\n */\n transcribeAudioUrl?: string;\n\n /**\n * The endpoint for the Copilot text to speech service.\n */\n textToSpeechUrl?: string;\n\n /**\n * additional headers to be sent with the request\n * @default {}\n * @example\n * ```\n * {\n * 'Authorization': 'Bearer your_token_here'\n * }\n * ```\n */\n headers: Record<string, string>;\n\n /**\n * Custom properties to be sent with the request\n * @default {}\n * @example\n * ```\n * {\n * 'user_id': 'user_id'\n * }\n * ```\n */\n properties?: Record<string, any>;\n\n /**\n * Indicates whether the user agent should send or receive cookies from the other domain\n * in the case of cross-origin requests.\n */\n credentials?: RequestCredentials;\n}\n\nexport type InChatRenderFunction = (props: ActionRenderProps<any>) => string | JSX.Element;\nexport type CoagentInChatRenderFunction = (\n props: CoAgentStateRenderProps<any>,\n) => string | JSX.Element | undefined | null;\n\nexport interface ChatComponentsCache {\n actions: Record<string, InChatRenderFunction | string>;\n coAgentStateRenders: Record<string, CoagentInChatRenderFunction | string>;\n}\n\nexport interface AgentSession {\n agentName: string;\n threadId?: string;\n nodeName?: string;\n}\n\nexport interface CopilotContextParams {\n // function-calling\n actions: Record<string, FrontendAction<any>>;\n setAction: (id: string, action: FrontendAction<any>) => void;\n removeAction: (id: string) => void;\n\n // coagent actions\n coAgentStateRenders: Record<string, CoAgentStateRender<any>>;\n setCoAgentStateRender: (id: string, stateRender: CoAgentStateRender<any>) => void;\n removeCoAgentStateRender: (id: string) => void;\n\n chatComponentsCache: React.RefObject<ChatComponentsCache>;\n\n getFunctionCallHandler: (\n customEntryPoints?: Record<string, FrontendAction<any>>,\n ) => FunctionCallHandler;\n\n // text context\n addContext: (context: string, parentId?: string, categories?: string[]) => TreeNodeId;\n removeContext: (id: TreeNodeId) => void;\n getContextString: (documents: DocumentPointer[], categories: string[]) => string;\n\n // document context\n addDocumentContext: (documentPointer: DocumentPointer, categories?: string[]) => TreeNodeId;\n removeDocumentContext: (documentId: string) => void;\n getDocumentsContext: (categories: string[]) => DocumentPointer[];\n\n isLoading: boolean;\n setIsLoading: React.Dispatch<React.SetStateAction<boolean>>;\n\n chatSuggestionConfiguration: { [key: string]: CopilotChatSuggestionConfiguration };\n addChatSuggestionConfiguration: (\n id: string,\n suggestion: CopilotChatSuggestionConfiguration,\n ) => void;\n removeChatSuggestionConfiguration: (id: string) => void;\n\n chatInstructions: string;\n setChatInstructions: React.Dispatch<React.SetStateAction<string>>;\n\n // api endpoints\n copilotApiConfig: CopilotApiConfig;\n\n showDevConsole: boolean | \"auto\";\n\n // agents\n coagentStates: Record<string, CoagentState>;\n setCoagentStates: React.Dispatch<React.SetStateAction<Record<string, CoagentState>>>;\n agentSession: AgentSession | null;\n setAgentSession: React.Dispatch<React.SetStateAction<AgentSession | null>>;\n}\n\nconst emptyCopilotContext: CopilotContextParams = {\n actions: {},\n setAction: () => {},\n removeAction: () => {},\n\n coAgentStateRenders: {},\n setCoAgentStateRender: () => {},\n removeCoAgentStateRender: () => {},\n\n chatComponentsCache: { current: { actions: {}, coAgentStateRenders: {} } },\n getContextString: (documents: DocumentPointer[], categories: string[]) =>\n returnAndThrowInDebug(\"\"),\n addContext: () => \"\",\n removeContext: () => {},\n\n getFunctionCallHandler: () => returnAndThrowInDebug(async () => {}),\n\n isLoading: false,\n setIsLoading: () => returnAndThrowInDebug(false),\n\n chatInstructions: \"\",\n setChatInstructions: () => returnAndThrowInDebug(\"\"),\n\n getDocumentsContext: (categories: string[]) => returnAndThrowInDebug([]),\n addDocumentContext: () => returnAndThrowInDebug(\"\"),\n removeDocumentContext: () => {},\n\n copilotApiConfig: new (class implements CopilotApiConfig {\n get chatApiEndpoint(): string {\n throw new Error(\"Remember to wrap your app in a `<CopilotKit> {...} </CopilotKit>` !!!\");\n }\n\n get headers(): Record<string, string> {\n return {};\n }\n get body(): Record<string, any> {\n return {};\n }\n })(),\n\n chatSuggestionConfiguration: {},\n addChatSuggestionConfiguration: () => {},\n removeChatSuggestionConfiguration: () => {},\n showDevConsole: \"auto\",\n coagentStates: {},\n setCoagentStates: () => {},\n\n agentSession: null,\n setAgentSession: () => {},\n};\n\nexport const CopilotContext = React.createContext<CopilotContextParams>(emptyCopilotContext);\n\nexport function useCopilotContext(): CopilotContextParams {\n const context = React.useContext(CopilotContext);\n if (context === emptyCopilotContext) {\n throw new Error(\"Remember to wrap your app in a `<CopilotKit> {...} </CopilotKit>` !!!\");\n }\n return context;\n}\n\nfunction returnAndThrowInDebug<T>(value: T): T {\n throw new Error(\"Remember to wrap your app in a `<CopilotKit> {...} </CopilotKit>` !!!\");\n return value;\n}\n"],"mappings":";;;;;AAEA,OAAO,WAAW;AAuIlB,IAAM,sBAA4C;AAAA,EAChD,SAAS,CAAC;AAAA,EACV,WAAW,MAAM;AAAA,EAAC;AAAA,EAClB,cAAc,MAAM;AAAA,EAAC;AAAA,EAErB,qBAAqB,CAAC;AAAA,EACtB,uBAAuB,MAAM;AAAA,EAAC;AAAA,EAC9B,0BAA0B,MAAM;AAAA,EAAC;AAAA,EAEjC,qBAAqB,EAAE,SAAS,EAAE,SAAS,CAAC,GAAG,qBAAqB,CAAC,EAAE,EAAE;AAAA,EACzE,kBAAkB,CAAC,WAA8B,eAC/C,sBAAsB,EAAE;AAAA,EAC1B,YAAY,MAAM;AAAA,EAClB,eAAe,MAAM;AAAA,EAAC;AAAA,EAEtB,wBAAwB,MAAM,sBAAsB,MAAY;AAAA,EAAC,EAAC;AAAA,EAElE,WAAW;AAAA,EACX,cAAc,MAAM,sBAAsB,KAAK;AAAA,EAE/C,kBAAkB;AAAA,EAClB,qBAAqB,MAAM,sBAAsB,EAAE;AAAA,EAEnD,qBAAqB,CAAC,eAAyB,sBAAsB,CAAC,CAAC;AAAA,EACvE,oBAAoB,MAAM,sBAAsB,EAAE;AAAA,EAClD,uBAAuB,MAAM;AAAA,EAAC;AAAA,EAE9B,kBAAkB,IAAK,MAAkC;AAAA,IACvD,IAAI,kBAA0B;AAC5B,YAAM,IAAI,MAAM,uEAAuE;AAAA,IACzF;AAAA,IAEA,IAAI,UAAkC;AACpC,aAAO,CAAC;AAAA,IACV;AAAA,IACA,IAAI,OAA4B;AAC9B,aAAO,CAAC;AAAA,IACV;AAAA,EACF,EAAG;AAAA,EAEH,6BAA6B,CAAC;AAAA,EAC9B,gCAAgC,MAAM;AAAA,EAAC;AAAA,EACvC,mCAAmC,MAAM;AAAA,EAAC;AAAA,EAC1C,gBAAgB;AAAA,EAChB,eAAe,CAAC;AAAA,EAChB,kBAAkB,MAAM;AAAA,EAAC;AAAA,EAEzB,cAAc;AAAA,EACd,iBAAiB,MAAM;AAAA,EAAC;AAC1B;AAEO,IAAM,iBAAiB,MAAM,cAAoC,mBAAmB;AAEpF,SAAS,oBAA0C;AACxD,QAAM,UAAU,MAAM,WAAW,cAAc;AAC/C,MAAI,YAAY,qBAAqB;AACnC,UAAM,IAAI,MAAM,uEAAuE;AAAA,EACzF;AACA,SAAO;AACT;AAEA,SAAS,sBAAyB,OAAa;AAC7C,QAAM,IAAI,MAAM,uEAAuE;AACvF,SAAO;AACT;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/copilot-provider/copilotkit.tsx"],"sourcesContent":["/**\n * 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.\n *\n * ## Example\n *\n * You can find more information about self-hosting CopilotKit [here](/guides/self-hosting).\n *\n * ```tsx\n * import { CopilotKit } from \"@copilotkit/react-core\";\n *\n * <CopilotKit runtimeUrl=\"<your-runtime-url>\">\n * // ... your app ...\n * </CopilotKit>\n * ```\n */\n\nimport { useCallback, useMemo, useRef, useState } from \"react\";\nimport {\n CopilotContext,\n CopilotApiConfig,\n ChatComponentsCache,\n AgentSession,\n} from \"../../context/copilot-context\";\nimport useTree from \"../../hooks/use-tree\";\nimport { CopilotChatSuggestionConfiguration, DocumentPointer } from \"../../types\";\nimport { flushSync } from \"react-dom\";\nimport {\n COPILOT_CLOUD_CHAT_URL,\n CopilotCloudConfig,\n FunctionCallHandler,\n} from \"@copilotkit/shared\";\n\nimport { FrontendAction } from \"../../types/frontend-action\";\nimport useFlatCategoryStore from \"../../hooks/use-flat-category-store\";\nimport { CopilotKitProps } from \"./copilotkit-props\";\nimport { CoAgentStateRender } from \"../../types/coagent-action\";\nimport { CoagentState } from \"../../types/coagent-state\";\nimport { CopilotMessages } from \"./copilot-messages\";\n\nexport function CopilotKit({ children, ...props }: CopilotKitProps) {\n // Compute all the functions and properties that we need to pass\n // to the CopilotContext.\n\n if (!props.runtimeUrl && !props.publicApiKey) {\n throw new Error(\n \"Please provide either a runtimeUrl or a publicApiKey to the CopilotKit component.\",\n );\n }\n\n const chatApiEndpoint = props.runtimeUrl || COPILOT_CLOUD_CHAT_URL;\n\n const [actions, setActions] = useState<Record<string, FrontendAction<any>>>({});\n const [coAgentStateRenders, setCoAgentStateRenders] = useState<\n Record<string, CoAgentStateRender<any>>\n >({});\n const chatComponentsCache = useRef<ChatComponentsCache>({\n actions: {},\n coAgentStateRenders: {},\n });\n const { addElement, removeElement, printTree } = useTree();\n const [isLoading, setIsLoading] = useState(false);\n const [chatInstructions, setChatInstructions] = useState(\"\");\n\n const {\n addElement: addDocument,\n removeElement: removeDocument,\n allElements: allDocuments,\n } = useFlatCategoryStore<DocumentPointer>();\n\n const setAction = useCallback((id: string, action: FrontendAction<any>) => {\n setActions((prevPoints) => {\n return {\n ...prevPoints,\n [id]: action,\n };\n });\n }, []);\n\n const removeAction = useCallback((id: string) => {\n setActions((prevPoints) => {\n const newPoints = { ...prevPoints };\n delete newPoints[id];\n return newPoints;\n });\n }, []);\n\n const setCoAgentStateRender = useCallback((id: string, stateRender: CoAgentStateRender<any>) => {\n setCoAgentStateRenders((prevPoints) => {\n return {\n ...prevPoints,\n [id]: stateRender,\n };\n });\n }, []);\n\n const removeCoAgentStateRender = useCallback((id: string) => {\n setCoAgentStateRenders((prevPoints) => {\n const newPoints = { ...prevPoints };\n delete newPoints[id];\n return newPoints;\n });\n }, []);\n\n const getContextString = useCallback(\n (documents: DocumentPointer[], categories: string[]) => {\n const documentsString = documents\n .map((document) => {\n return `${document.name} (${document.sourceApplication}):\\n${document.getContents()}`;\n })\n .join(\"\\n\\n\");\n\n const nonDocumentStrings = printTree(categories);\n\n return `${documentsString}\\n\\n${nonDocumentStrings}`;\n },\n [printTree],\n );\n\n const addContext = useCallback(\n (\n context: string,\n parentId?: string,\n categories: string[] = defaultCopilotContextCategories,\n ) => {\n return addElement(context, categories, parentId);\n },\n [addElement],\n );\n\n const removeContext = useCallback(\n (id: string) => {\n removeElement(id);\n },\n [removeElement],\n );\n\n const getFunctionCallHandler = useCallback(\n (customEntryPoints?: Record<string, FrontendAction<any>>) => {\n return entryPointsToFunctionCallHandler(Object.values(customEntryPoints || actions));\n },\n [actions],\n );\n\n const getDocumentsContext = useCallback(\n (categories: string[]) => {\n return allDocuments(categories);\n },\n [allDocuments],\n );\n\n const addDocumentContext = useCallback(\n (documentPointer: DocumentPointer, categories: string[] = defaultCopilotContextCategories) => {\n return addDocument(documentPointer, categories);\n },\n [addDocument],\n );\n\n const removeDocumentContext = useCallback(\n (documentId: string) => {\n removeDocument(documentId);\n },\n [removeDocument],\n );\n\n if (!props.publicApiKey) {\n if (props.cloudRestrictToTopic) {\n throw new Error(\n \"To use the cloudRestrictToTopic feature, please sign up at https://copilotkit.ai and provide a publicApiKey.\",\n );\n }\n }\n\n // get the appropriate CopilotApiConfig from the props\n const copilotApiConfig: CopilotApiConfig = useMemo(() => {\n let cloud: CopilotCloudConfig | undefined = undefined;\n if (props.publicApiKey) {\n cloud = {\n guardrails: {\n input: {\n restrictToTopic: {\n enabled: props.cloudRestrictToTopic ? true : false,\n validTopics: props.cloudRestrictToTopic?.validTopics || [],\n invalidTopics: props.cloudRestrictToTopic?.invalidTopics || [],\n },\n },\n },\n };\n }\n\n return {\n publicApiKey: props.publicApiKey,\n ...(cloud ? { cloud } : {}),\n chatApiEndpoint: chatApiEndpoint,\n headers: props.headers || {},\n properties: props.properties || {},\n transcribeAudioUrl: props.transcribeAudioUrl,\n textToSpeechUrl: props.textToSpeechUrl,\n credentials: props.credentials,\n };\n }, [\n props.publicApiKey,\n props.headers,\n props.properties,\n props.transcribeAudioUrl,\n props.textToSpeechUrl,\n props.credentials,\n props.cloudRestrictToTopic,\n ]);\n\n const [chatSuggestionConfiguration, setChatSuggestionConfiguration] = useState<{\n [key: string]: CopilotChatSuggestionConfiguration;\n }>({});\n\n const addChatSuggestionConfiguration = (\n id: string,\n suggestion: CopilotChatSuggestionConfiguration,\n ) => {\n setChatSuggestionConfiguration((prev) => ({ ...prev, [id]: suggestion }));\n };\n\n const removeChatSuggestionConfiguration = (id: string) => {\n setChatSuggestionConfiguration((prev) => {\n const { [id]: _, ...rest } = prev;\n return rest;\n });\n };\n\n const [coagentStates, setCoagentStates] = useState<Record<string, CoagentState>>({});\n let initialAgentSession: AgentSession | null = null;\n if (props.agent) {\n initialAgentSession = {\n agentName: props.agent,\n };\n }\n\n const [agentSession, setAgentSession] = useState<AgentSession | null>(initialAgentSession);\n\n return (\n <CopilotContext.Provider\n value={{\n actions,\n chatComponentsCache,\n getFunctionCallHandler,\n setAction,\n removeAction,\n coAgentStateRenders,\n setCoAgentStateRender,\n removeCoAgentStateRender,\n getContextString,\n addContext,\n removeContext,\n getDocumentsContext,\n addDocumentContext,\n removeDocumentContext,\n copilotApiConfig: copilotApiConfig,\n isLoading,\n setIsLoading,\n chatSuggestionConfiguration,\n addChatSuggestionConfiguration,\n removeChatSuggestionConfiguration,\n chatInstructions,\n setChatInstructions,\n showDevConsole: props.showDevConsole === undefined ? \"auto\" : props.showDevConsole,\n coagentStates,\n setCoagentStates,\n agentSession,\n setAgentSession,\n }}\n >\n <CopilotMessages>{children}</CopilotMessages>\n </CopilotContext.Provider>\n );\n}\n\nexport const defaultCopilotContextCategories = [\"global\"];\n\nfunction entryPointsToFunctionCallHandler(actions: FrontendAction<any>[]): FunctionCallHandler {\n return async ({ messages, name, args }) => {\n let actionsByFunctionName: Record<string, FrontendAction<any>> = {};\n for (let action of actions) {\n actionsByFunctionName[action.name] = action;\n }\n\n const action = actionsByFunctionName[name];\n let result: any = undefined;\n if (action) {\n await new Promise<void>((resolve, reject) => {\n flushSync(async () => {\n try {\n result = await action.handler?.(args);\n resolve();\n } catch (error) {\n reject(error);\n }\n });\n });\n await new Promise((resolve) => setTimeout(resolve, 20));\n }\n return result;\n };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAgBA,SAAS,aAAa,SAAS,QAAQ,gBAAgB;AASvD,SAAS,iBAAiB;AAC1B;AAAA,EACE;AAAA,OAGK;AA+OD;AAtOC,SAAS,WAAW,IAAyC;AAAzC,eAAE,WAvC7B,IAuC2B,IAAe,kBAAf,IAAe,CAAb;AAI3B,MAAI,CAAC,MAAM,cAAc,CAAC,MAAM,cAAc;AAC5C,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,QAAM,kBAAkB,MAAM,cAAc;AAE5C,QAAM,CAAC,SAAS,UAAU,IAAI,SAA8C,CAAC,CAAC;AAC9E,QAAM,CAAC,qBAAqB,sBAAsB,IAAI,SAEpD,CAAC,CAAC;AACJ,QAAM,sBAAsB,OAA4B;AAAA,IACtD,SAAS,CAAC;AAAA,IACV,qBAAqB,CAAC;AAAA,EACxB,CAAC;AACD,QAAM,EAAE,YAAY,eAAe,UAAU,IAAI,iBAAQ;AACzD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAS,EAAE;AAE3D,QAAM;AAAA,IACJ,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,aAAa;AAAA,EACf,IAAI,gCAAsC;AAE1C,QAAM,YAAY,YAAY,CAAC,IAAY,WAAgC;AACzE,eAAW,CAAC,eAAe;AACzB,aAAO,iCACF,aADE;AAAA,QAEL,CAAC,EAAE,GAAG;AAAA,MACR;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,QAAM,eAAe,YAAY,CAAC,OAAe;AAC/C,eAAW,CAAC,eAAe;AACzB,YAAM,YAAY,mBAAK;AACvB,aAAO,UAAU,EAAE;AACnB,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,QAAM,wBAAwB,YAAY,CAAC,IAAY,gBAAyC;AAC9F,2BAAuB,CAAC,eAAe;AACrC,aAAO,iCACF,aADE;AAAA,QAEL,CAAC,EAAE,GAAG;AAAA,MACR;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,QAAM,2BAA2B,YAAY,CAAC,OAAe;AAC3D,2BAAuB,CAAC,eAAe;AACrC,YAAM,YAAY,mBAAK;AACvB,aAAO,UAAU,EAAE;AACnB,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,QAAM,mBAAmB;AAAA,IACvB,CAAC,WAA8B,eAAyB;AACtD,YAAM,kBAAkB,UACrB,IAAI,CAAC,aAAa;AACjB,eAAO,GAAG,SAAS,SAAS,SAAS;AAAA,EAAwB,SAAS,YAAY;AAAA,MACpF,CAAC,EACA,KAAK,MAAM;AAEd,YAAM,qBAAqB,UAAU,UAAU;AAE/C,aAAO,GAAG;AAAA;AAAA,EAAsB;AAAA,IAClC;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,aAAa;AAAA,IACjB,CACE,SACA,UACA,aAAuB,oCACpB;AACH,aAAO,WAAW,SAAS,YAAY,QAAQ;AAAA,IACjD;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,QAAM,gBAAgB;AAAA,IACpB,CAAC,OAAe;AACd,oBAAc,EAAE;AAAA,IAClB;AAAA,IACA,CAAC,aAAa;AAAA,EAChB;AAEA,QAAM,yBAAyB;AAAA,IAC7B,CAAC,sBAA4D;AAC3D,aAAO,iCAAiC,OAAO,OAAO,qBAAqB,OAAO,CAAC;AAAA,IACrF;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,sBAAsB;AAAA,IAC1B,CAAC,eAAyB;AACxB,aAAO,aAAa,UAAU;AAAA,IAChC;AAAA,IACA,CAAC,YAAY;AAAA,EACf;AAEA,QAAM,qBAAqB;AAAA,IACzB,CAAC,iBAAkC,aAAuB,oCAAoC;AAC5F,aAAO,YAAY,iBAAiB,UAAU;AAAA,IAChD;AAAA,IACA,CAAC,WAAW;AAAA,EACd;AAEA,QAAM,wBAAwB;AAAA,IAC5B,CAAC,eAAuB;AACtB,qBAAe,UAAU;AAAA,IAC3B;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,MAAI,CAAC,MAAM,cAAc;AACvB,QAAI,MAAM,sBAAsB;AAC9B,YAAM,IAAI;AAAA,QACR;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAGA,QAAM,mBAAqC,QAAQ,MAAM;AA7K3D,QAAAA,KAAAC;AA8KI,QAAI,QAAwC;AAC5C,QAAI,MAAM,cAAc;AACtB,cAAQ;AAAA,QACN,YAAY;AAAA,UACV,OAAO;AAAA,YACL,iBAAiB;AAAA,cACf,SAAS,MAAM,uBAAuB,OAAO;AAAA,cAC7C,eAAaD,MAAA,MAAM,yBAAN,gBAAAA,IAA4B,gBAAe,CAAC;AAAA,cACzD,iBAAeC,MAAA,MAAM,yBAAN,gBAAAA,IAA4B,kBAAiB,CAAC;AAAA,YAC/D;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAEA,WAAO;AAAA,MACL,cAAc,MAAM;AAAA,OAChB,QAAQ,EAAE,MAAM,IAAI,CAAC,IAFpB;AAAA,MAGL;AAAA,MACA,SAAS,MAAM,WAAW,CAAC;AAAA,MAC3B,YAAY,MAAM,cAAc,CAAC;AAAA,MACjC,oBAAoB,MAAM;AAAA,MAC1B,iBAAiB,MAAM;AAAA,MACvB,aAAa,MAAM;AAAA,IACrB;AAAA,EACF,GAAG;AAAA,IACD,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,EACR,CAAC;AAED,QAAM,CAAC,6BAA6B,8BAA8B,IAAI,SAEnE,CAAC,CAAC;AAEL,QAAM,iCAAiC,CACrC,IACA,eACG;AACH,mCAA+B,CAAC,SAAU,iCAAK,OAAL,EAAW,CAAC,EAAE,GAAG,WAAW,EAAE;AAAA,EAC1E;AAEA,QAAM,oCAAoC,CAAC,OAAe;AACxD,mCAA+B,CAAC,SAAS;AACvC,YAA6BD,MAAA,MAApB,EA9Nf,CA8Ne,KAAK,EA9NpB,IA8NmCA,KAAT,iBAASA,KAAT,CAAX;AACT,aAAO;AAAA,IACT,CAAC;AAAA,EACH;AAEA,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAuC,CAAC,CAAC;AACnF,MAAI,sBAA2C;AAC/C,MAAI,MAAM,OAAO;AACf,0BAAsB;AAAA,MACpB,WAAW,MAAM;AAAA,IACnB;AAAA,EACF;AAEA,QAAM,CAAC,cAAc,eAAe,IAAI,SAA8B,mBAAmB;AAEzF,SACE;AAAA,IAAC,eAAe;AAAA,IAAf;AAAA,MACC,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAgB,MAAM,mBAAmB,SAAY,SAAS,MAAM;AAAA,QACpE;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEA,8BAAC,mBAAiB,UAAS;AAAA;AAAA,EAC7B;AAEJ;AAEO,IAAM,kCAAkC,CAAC,QAAQ;AAExD,SAAS,iCAAiC,SAAqD;AAC7F,SAAO,CAAO,OAA6B,eAA7B,KAA6B,WAA7B,EAAE,UAAU,MAAM,KAAK,GAAM;AACzC,QAAI,wBAA6D,CAAC;AAClE,aAASE,WAAU,SAAS;AAC1B,4BAAsBA,QAAO,IAAI,IAAIA;AAAA,IACvC;AAEA,UAAM,SAAS,sBAAsB,IAAI;AACzC,QAAI,SAAc;AAClB,QAAI,QAAQ;AACV,YAAM,IAAI,QAAc,CAAC,SAAS,WAAW;AAC3C,kBAAU,MAAY;AA/R9B;AAgSU,cAAI;AACF,qBAAS,OAAM,YAAO,YAAP,gCAAiB;AAChC,oBAAQ;AAAA,UACV,SAAS,OAAP;AACA,mBAAO,KAAK;AAAA,UACd;AAAA,QACF,EAAC;AAAA,MACH,CAAC;AACD,YAAM,IAAI,QAAQ,CAAC,YAAY,WAAW,SAAS,EAAE,CAAC;AAAA,IACxD;AACA,WAAO;AAAA,EACT;AACF;","names":["_a","_b","action"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/lib/copilot-task.ts"],"sourcesContent":["/**\n * This class is used to execute one-off tasks, for example on button press. It can use the context available via [useCopilotReadable](/reference/hooks/useCopilotReadable) and the actions provided by [useCopilotAction](/reference/hooks/useCopilotAction), or you can provide your own context and actions.\n *\n * ## Example\n * In the simplest case, use CopilotTask in the context of your app by giving it instructions on what to do.\n *\n * ```tsx\n * import { CopilotTask, useCopilotContext } from \"@copilotkit/react-core\";\n *\n * export function MyComponent() {\n * const context = useCopilotContext();\n *\n * const task = new CopilotTask({\n * instructions: \"Set a random message\",\n * actions: [\n * {\n * name: \"setMessage\",\n * description: \"Set the message.\",\n * argumentAnnotations: [\n * {\n * name: \"message\",\n * type: \"string\",\n * description:\n * \"A message to display.\",\n * required: true,\n * },\n * ],\n *\n * implementation: async (message) => {\n * // ...\n * },\n * }\n * ]\n * });\n *\n * const executeTask = async () => {\n * await task.run(context, action);\n * }\n *\n * return (\n * <>\n * <button onClick={executeTask}>\n * Execute task\n * </button>\n * </>\n * )\n * }\n * ```\n *\n * Have a look at the [Presentation Example App](https://github.com/CopilotKit/CopilotKit/blob/main/CopilotKit/examples/next-openai/src/app/presentation/page.tsx) for a more complete example.\n */\n\nimport {\n ActionExecutionMessage,\n CopilotRuntimeClient,\n Message,\n Role,\n TextMessage,\n convertGqlOutputToMessages,\n convertMessagesToGqlInput,\n filterAgentStateMessages,\n CopilotRequestType,\n} from \"@copilotkit/runtime-client-gql\";\nimport { FrontendAction } from \"../types/frontend-action\";\nimport { CopilotContextParams } from \"../context\";\nimport { defaultCopilotContextCategories } from \"../components\";\nimport { MessageStatusCode } from \"@copilotkit/runtime-client-gql\";\nimport { actionParametersToJsonSchema } from \"@copilotkit/shared\";\n\nexport interface CopilotTaskConfig {\n /**\n * The instructions to be given to the assistant.\n */\n instructions: string;\n /**\n * An array of action definitions that can be called.\n */\n actions?: FrontendAction<any>[];\n /**\n * Whether to include the copilot readable context in the task.\n */\n includeCopilotReadable?: boolean;\n\n /**\n * Whether to include actions defined via useCopilotAction in the task.\n */\n includeCopilotActions?: boolean;\n}\n\nexport class CopilotTask<T = any> {\n private instructions: string;\n private actions: FrontendAction<any>[];\n private includeCopilotReadable: boolean;\n private includeCopilotActions: boolean;\n\n constructor(config: CopilotTaskConfig) {\n this.instructions = config.instructions;\n this.actions = config.actions || [];\n this.includeCopilotReadable = config.includeCopilotReadable !== false;\n this.includeCopilotActions = config.includeCopilotActions !== false;\n }\n\n /**\n * Run the task.\n * @param context The CopilotContext to use for the task. Use `useCopilotContext` to obtain the current context.\n * @param data The data to use for the task.\n */\n async run(context: CopilotContextParams, data?: T): Promise<void> {\n const actions = this.includeCopilotActions ? Object.assign({}, context.actions) : {};\n\n // merge functions into entry points\n for (const fn of this.actions) {\n actions[fn.name] = fn;\n }\n\n let contextString = \"\";\n\n if (data) {\n contextString = (typeof data === \"string\" ? data : JSON.stringify(data)) + \"\\n\\n\";\n }\n\n if (this.includeCopilotReadable) {\n contextString += context.getContextString([], defaultCopilotContextCategories);\n }\n\n const systemMessage = new TextMessage({\n content: taskSystemMessage(contextString, this.instructions),\n role: Role.System,\n });\n\n const messages: Message[] = [systemMessage];\n\n const runtimeClient = new CopilotRuntimeClient({\n url: context.copilotApiConfig.chatApiEndpoint,\n publicApiKey: context.copilotApiConfig.publicApiKey,\n headers: context.copilotApiConfig.headers,\n credentials: context.copilotApiConfig.credentials,\n });\n\n const response = await runtimeClient\n .generateCopilotResponse({\n data: {\n frontend: {\n actions: Object.values(actions).map((action) => ({\n name: action.name,\n description: action.description || \"\",\n jsonSchema: JSON.stringify(actionParametersToJsonSchema(action.parameters || [])),\n })),\n url: window.location.href,\n },\n messages: convertMessagesToGqlInput(filterAgentStateMessages(messages)),\n metadata: {\n requestType: CopilotRequestType.Task,\n },\n forwardedParameters: {\n toolChoice: \"required\",\n },\n },\n properties: context.copilotApiConfig.properties,\n })\n .toPromise();\n\n const functionCallHandler = context.getFunctionCallHandler(actions);\n const functionCalls = convertGqlOutputToMessages(\n response.data?.generateCopilotResponse?.messages || [],\n ).filter((m): m is ActionExecutionMessage => m.isActionExecutionMessage());\n\n for (const functionCall of functionCalls) {\n await functionCallHandler({\n messages,\n name: functionCall.name,\n args: functionCall.arguments,\n });\n }\n }\n}\n\nfunction taskSystemMessage(contextString: string, instructions: string): string {\n return `\nPlease act as an efficient, competent, conscientious, and industrious professional assistant.\n\nHelp the user achieve their goals, and you do so in a way that is as efficient as possible, without unnecessary fluff, but also without sacrificing professionalism.\nAlways be polite and respectful, and prefer brevity over verbosity.\n\nThe user has provided you with the following context:\n\\`\\`\\`\n${contextString}\n\\`\\`\\`\n\nThey have also provided you with functions you can call to initiate actions on their behalf.\n\nPlease assist them as best you can.\n\nThis is not a conversation, so please do not ask questions. Just call a function without saying anything else.\n\nThe user has given you the following task to complete:\n\n\\`\\`\\`\n${instructions}\n\\`\\`\\`\n`;\n}\n"],"mappings":";;;;;;;;AAoDA;AAAA,EAEE;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAKP,SAAS,oCAAoC;AAsBtC,IAAM,cAAN,MAA2B;AAAA,EAMhC,YAAY,QAA2B;AACrC,SAAK,eAAe,OAAO;AAC3B,SAAK,UAAU,OAAO,WAAW,CAAC;AAClC,SAAK,yBAAyB,OAAO,2BAA2B;AAChE,SAAK,wBAAwB,OAAO,0BAA0B;AAAA,EAChE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOM,IAAI,SAA+B,MAAyB;AAAA;AA3GpE;AA4GI,YAAM,UAAU,KAAK,wBAAwB,OAAO,OAAO,CAAC,GAAG,QAAQ,OAAO,IAAI,CAAC;AAGnF,iBAAW,MAAM,KAAK,SAAS;AAC7B,gBAAQ,GAAG,IAAI,IAAI;AAAA,MACrB;AAEA,UAAI,gBAAgB;AAEpB,UAAI,MAAM;AACR,yBAAiB,OAAO,SAAS,WAAW,OAAO,KAAK,UAAU,IAAI,KAAK;AAAA,MAC7E;AAEA,UAAI,KAAK,wBAAwB;AAC/B,yBAAiB,QAAQ,iBAAiB,CAAC,GAAG,+BAA+B;AAAA,MAC/E;AAEA,YAAM,gBAAgB,IAAI,YAAY;AAAA,QACpC,SAAS,kBAAkB,eAAe,KAAK,YAAY;AAAA,QAC3D,MAAM,KAAK;AAAA,MACb,CAAC;AAED,YAAM,WAAsB,CAAC,aAAa;AAE1C,YAAM,gBAAgB,IAAI,qBAAqB;AAAA,QAC7C,KAAK,QAAQ,iBAAiB;AAAA,QAC9B,cAAc,QAAQ,iBAAiB;AAAA,QACvC,SAAS,QAAQ,iBAAiB;AAAA,QAClC,aAAa,QAAQ,iBAAiB;AAAA,MACxC,CAAC;AAED,YAAM,WAAW,MAAM,cACpB,wBAAwB;AAAA,QACvB,MAAM;AAAA,UACJ,UAAU;AAAA,YACR,SAAS,OAAO,OAAO,OAAO,EAAE,IAAI,CAAC,YAAY;AAAA,cAC/C,MAAM,OAAO;AAAA,cACb,aAAa,OAAO,eAAe;AAAA,cACnC,YAAY,KAAK,UAAU,6BAA6B,OAAO,cAAc,CAAC,CAAC,CAAC;AAAA,YAClF,EAAE;AAAA,YACF,KAAK,OAAO,SAAS;AAAA,UACvB;AAAA,UACA,UAAU,0BAA0B,yBAAyB,QAAQ,CAAC;AAAA,UACtE,UAAU;AAAA,YACR,aAAa,mBAAmB;AAAA,UAClC;AAAA,UACA,qBAAqB;AAAA,YACnB,YAAY;AAAA,UACd;AAAA,QACF;AAAA,QACA,YAAY,QAAQ,iBAAiB;AAAA,MACvC,CAAC,EACA,UAAU;AAEb,YAAM,sBAAsB,QAAQ,uBAAuB,OAAO;AAClE,YAAM,gBAAgB;AAAA,UACpB,oBAAS,SAAT,mBAAe,4BAAf,mBAAwC,aAAY,CAAC;AAAA,MACvD,EAAE,OAAO,CAAC,MAAmC,EAAE,yBAAyB,CAAC;AAEzE,iBAAW,gBAAgB,eAAe;AACxC,cAAM,oBAAoB;AAAA,UACxB;AAAA,UACA,MAAM,aAAa;AAAA,UACnB,MAAM,aAAa;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,IACF;AAAA;AACF;AAEA,SAAS,kBAAkB,eAAuB,cAA8B;AAC9E,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQP;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYA;AAAA;AAAA;AAGF;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/hooks/use-copilot-action.ts"],"sourcesContent":["/**\n * Example usage of useCopilotAction with complex parameters:\n *\n * @example\n * useCopilotAction({\n * name: \"myAction\",\n * parameters: [\n * { name: \"arg1\", type: \"string\", enum: [\"option1\", \"option2\", \"option3\"], required: false },\n * { name: \"arg2\", type: \"number\" },\n * {\n * name: \"arg3\",\n * type: \"object\",\n * attributes: [\n * { name: \"nestedArg1\", type: \"boolean\" },\n * { name: \"xyz\", required: false },\n * ],\n * },\n * { name: \"arg4\", type: \"number[]\" },\n * ],\n * handler: ({ arg1, arg2, arg3, arg4 }) => {\n * const x = arg3.nestedArg1;\n * const z = arg3.xyz;\n * console.log(arg1, arg2, arg3);\n * },\n * });\n *\n * @example\n * // Simple action without parameters\n * useCopilotAction({\n * name: \"myAction\",\n * handler: () => {\n * console.log(\"No parameters provided.\");\n * },\n * });\n *\n * @example\n * // Interactive action with UI rendering and response handling\n * useCopilotAction({\n * name: \"handleMeeting\",\n * description: \"Handle a meeting by booking or canceling\",\n * parameters: [\n * {\n * name: \"meeting\",\n * type: \"string\",\n * description: \"The meeting to handle\",\n * required: true,\n * },\n * {\n * name: \"date\",\n * type: \"string\",\n * description: \"The date of the meeting\",\n * required: true,\n * },\n * {\n * name: \"title\",\n * type: \"string\",\n * description: \"The title of the meeting\",\n * required: true,\n * },\n * ],\n * renderAndWaitForResponse: ({ args, respond, status }) => {\n * const { meeting, date, title } = args;\n * return (\n * <MeetingConfirmationDialog\n * meeting={meeting}\n * date={date}\n * title={title}\n * onConfirm={() => respond('meeting confirmed')}\n * onCancel={() => respond('meeting canceled')}\n * />\n * );\n * },\n * });\n */\n\n/**\n * <img src=\"/images/use-copilot-action/useCopilotAction.gif\" width=\"500\" />\n * `useCopilotAction` is a React hook that you can use in your application to provide\n * custom actions that can be called by the AI. Essentially, it allows the Copilot to\n * execute these actions contextually during a chat, based on the user's interactions\n * and needs.\n *\n * Here's how it works:\n *\n * Use `useCopilotAction` to set up actions that the Copilot can call. To provide\n * more context to the Copilot, you can provide it with a `description` (for example to explain\n * what the action does, under which conditions it can be called, etc.).\n *\n * Then you define the parameters of the action, which can be simple, e.g. primitives like strings or numbers,\n * or complex, e.g. objects or arrays.\n *\n * Finally, you provide a `handler` function that receives the parameters and returns a result.\n * CopilotKit takes care of automatically inferring the parameter types, so you get type safety\n * and autocompletion for free.\n *\n * To render a custom UI for the action, you can provide a `render()` function. This function\n * lets you render a custom component or return a string to display.\n *\n * ## Usage\n *\n * ### Simple Usage\n *\n * ```tsx\n * useCopilotAction({\n * name: \"sayHello\",\n * description: \"Say hello to someone.\",\n * parameters: [\n * {\n * name: \"name\",\n * type: \"string\",\n * description: \"name of the person to say greet\",\n * },\n * ],\n * handler: async ({ name }) => {\n * alert(`Hello, ${name}!`);\n * },\n * });\n * ```\n *\n * ## Generative UI\n *\n * This hooks enables you to dynamically generate UI elements and render them in the copilot chat. For more information, check out the [Generative UI](/concepts/generative-ui) page.\n */\nimport { Parameter, randomId } from \"@copilotkit/shared\";\nimport { createElement, Fragment, useEffect, useRef } from \"react\";\nimport { useCopilotContext } from \"../context/copilot-context\";\nimport {\n ActionRenderProps,\n ActionRenderPropsNoArgsWait,\n ActionRenderPropsWait,\n FrontendAction,\n} from \"../types/frontend-action\";\n\n// We implement useCopilotAction dependency handling so that\n// the developer has the option to not provide any dependencies.\n// In this case, we assume they want to update the handler on each rerender.\n// To avoid getting stuck in an infinite loop, we update the handler directly,\n// skipping React state updates.\n// This is ok in this case, because the handler is not part of any UI that\n// needs to be updated.\n// useCallback, useMemo or other memoization techniques are not suitable here,\n// because they will cause a infinite rerender loop.\nexport function useCopilotAction<const T extends Parameter[] | [] = []>(\n action: FrontendAction<T>,\n dependencies?: any[],\n): void {\n const { setAction, removeAction, actions, chatComponentsCache } = useCopilotContext();\n const idRef = useRef<string>(randomId());\n const renderAndWaitRef = useRef<RenderAndWaitForResponse | null>(null);\n\n // clone the action to avoid mutating the original object\n action = { ...action };\n\n // If the developer provides a renderAndWait function, we transform the action\n // to use a promise internally, so that we can treat it like a normal action.\n if (action.renderAndWait || action.renderAndWaitForResponse) {\n const renderAndWait = action.renderAndWait || action.renderAndWaitForResponse;\n // remove the renderAndWait function from the action\n action.renderAndWait = undefined;\n action.renderAndWaitForResponse = undefined;\n // add a handler that will be called when the action is executed\n action.handler = (async () => {\n // we create a new promise when the handler is called\n let resolve: (result: any) => void;\n let reject: (error: any) => void;\n const promise = new Promise<any>((resolvePromise, rejectPromise) => {\n resolve = resolvePromise;\n reject = rejectPromise;\n });\n renderAndWaitRef.current = { promise, resolve: resolve!, reject: reject! };\n // then we await the promise (it will be resolved in the original renderAndWait function)\n return await promise;\n }) as any;\n\n // add a render function that will be called when the action is rendered\n action.render = ((props: ActionRenderProps<T>): React.ReactElement => {\n // Create type safe waitProps based on whether T extends empty array or not\n const waitProps = {\n status: props.status,\n args: props.args,\n result: props.result,\n handler: props.status === \"executing\" ? renderAndWaitRef.current!.resolve : undefined,\n respond: props.status === \"executing\" ? renderAndWaitRef.current!.resolve : undefined,\n } as T extends [] ? ActionRenderPropsNoArgsWait<T> : ActionRenderPropsWait<T>;\n\n // Type guard to check if renderAndWait is for no args case\n const isNoArgsRenderWait = (\n _fn:\n | ((props: ActionRenderPropsNoArgsWait<T>) => React.ReactElement)\n | ((props: ActionRenderPropsWait<T>) => React.ReactElement),\n ): _fn is (props: ActionRenderPropsNoArgsWait<T>) => React.ReactElement => {\n return action.parameters?.length === 0;\n };\n\n // Safely call renderAndWait with correct props type\n if (renderAndWait) {\n if (isNoArgsRenderWait(renderAndWait)) {\n return renderAndWait(waitProps as ActionRenderPropsNoArgsWait<T>);\n } else {\n return renderAndWait(waitProps as ActionRenderPropsWait<T>);\n }\n }\n\n // Return empty Fragment instead of null\n return createElement(Fragment);\n }) as any;\n }\n\n // If the developer doesn't provide dependencies, we assume they want to\n // update handler and render function when the action object changes.\n // This ensures that any captured variables in the handler are up to date.\n if (dependencies === undefined) {\n if (actions[idRef.current]) {\n actions[idRef.current].handler = action.handler as any;\n if (typeof action.render === \"function\") {\n if (chatComponentsCache.current !== null) {\n chatComponentsCache.current.actions[action.name] = action.render;\n }\n }\n }\n }\n\n useEffect(() => {\n setAction(idRef.current, action as any);\n if (chatComponentsCache.current !== null && action.render !== undefined) {\n chatComponentsCache.current.actions[action.name] = action.render;\n }\n return () => {\n // NOTE: For now, we don't remove the chatComponentsCache entry when the action is removed.\n // This is because we currently don't have access to the messages array in CopilotContext.\n removeAction(idRef.current);\n };\n }, [\n setAction,\n removeAction,\n action.description,\n action.name,\n action.disabled,\n // This should be faster than deep equality checking\n // In addition, all major JS engines guarantee the order of object keys\n JSON.stringify(action.parameters),\n // include render only if it's a string\n typeof action.render === \"string\" ? action.render : undefined,\n // dependencies set by the developer\n ...(dependencies || []),\n ]);\n}\n\ninterface RenderAndWaitForResponse {\n promise: Promise<any>;\n resolve: (result: any) => void;\n reject: (error: any) => void;\n}\n"],"mappings":";;;;;;;;;AA2HA,SAAoB,gBAAgB;AACpC,SAAS,eAAe,UAAU,WAAW,cAAc;AAkBpD,SAAS,iBACd,QACA,cACM;AACN,QAAM,EAAE,WAAW,cAAc,SAAS,oBAAoB,IAAI,kBAAkB;AACpF,QAAM,QAAQ,OAAe,SAAS,CAAC;AACvC,QAAM,mBAAmB,OAAwC,IAAI;AAGrE,WAAS,mBAAK;AAId,MAAI,OAAO,iBAAiB,OAAO,0BAA0B;AAC3D,UAAM,gBAAgB,OAAO,iBAAiB,OAAO;AAErD,WAAO,gBAAgB;AACvB,WAAO,2BAA2B;AAElC,WAAO,UAAW,MAAY;AAE5B,UAAI;AACJ,UAAI;AACJ,YAAM,UAAU,IAAI,QAAa,CAAC,gBAAgB,kBAAkB;AAClE,kBAAU;AACV,iBAAS;AAAA,MACX,CAAC;AACD,uBAAiB,UAAU,EAAE,SAAS,SAAmB,OAAgB;AAEzE,aAAO,MAAM;AAAA,IACf;AAGA,WAAO,SAAU,CAAC,UAAoD;AAEpE,YAAM,YAAY;AAAA,QAChB,QAAQ,MAAM;AAAA,QACd,MAAM,MAAM;AAAA,QACZ,QAAQ,MAAM;AAAA,QACd,SAAS,MAAM,WAAW,cAAc,iBAAiB,QAAS,UAAU;AAAA,QAC5E,SAAS,MAAM,WAAW,cAAc,iBAAiB,QAAS,UAAU;AAAA,MAC9E;AAGA,YAAM,qBAAqB,CACzB,QAGyE;AA9LjF;AA+LQ,iBAAO,YAAO,eAAP,mBAAmB,YAAW;AAAA,MACvC;AAGA,UAAI,eAAe;AACjB,YAAI,mBAAmB,aAAa,GAAG;AACrC,iBAAO,cAAc,SAA2C;AAAA,QAClE,OAAO;AACL,iBAAO,cAAc,SAAqC;AAAA,QAC5D;AAAA,MACF;AAGA,aAAO,cAAc,QAAQ;AAAA,IAC/B;AAAA,EACF;AAKA,MAAI,iBAAiB,QAAW;AAC9B,QAAI,QAAQ,MAAM,OAAO,GAAG;AAC1B,cAAQ,MAAM,OAAO,EAAE,UAAU,OAAO;AACxC,UAAI,OAAO,OAAO,WAAW,YAAY;AACvC,YAAI,oBAAoB,YAAY,MAAM;AACxC,8BAAoB,QAAQ,QAAQ,OAAO,IAAI,IAAI,OAAO;AAAA,QAC5D;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,YAAU,MAAM;AACd,cAAU,MAAM,SAAS,MAAa;AACtC,QAAI,oBAAoB,YAAY,QAAQ,OAAO,WAAW,QAAW;AACvE,0BAAoB,QAAQ,QAAQ,OAAO,IAAI,IAAI,OAAO;AAAA,IAC5D;AACA,WAAO,MAAM;AAGX,mBAAa,MAAM,OAAO;AAAA,IAC5B;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA;AAAA;AAAA,IAGP,KAAK,UAAU,OAAO,UAAU;AAAA;AAAA,IAEhC,OAAO,OAAO,WAAW,WAAW,OAAO,SAAS;AAAA;AAAA,IAEpD,GAAI,gBAAgB,CAAC;AAAA,EACvB,CAAC;AACH;","names":[]}
|
package/dist/chunk-BWYAGPEF.mjs
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
//# sourceMappingURL=chunk-BWYAGPEF.mjs.map
|