@copilotkit/react-core 1.71.0 → 1.71.2
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/dist/{copilotkit-DCIXZawe.d.cts → copilotkit-DoHSqB_u.d.cts} +10 -82
- package/dist/copilotkit-DoHSqB_u.d.cts.map +1 -0
- package/dist/{copilotkit-ChjzWqn6.d.mts → copilotkit-DsMFLrpY.d.mts} +10 -82
- package/dist/copilotkit-DsMFLrpY.d.mts.map +1 -0
- package/dist/{copilotkit-B4Jb1QEy.cjs → copilotkit-gopQXrTQ.cjs} +78 -391
- package/dist/copilotkit-gopQXrTQ.cjs.map +1 -0
- package/dist/{copilotkit-snbJkMqQ.mjs → copilotkit-qK-Q3rmE.mjs} +76 -371
- package/dist/copilotkit-qK-Q3rmE.mjs.map +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.mts +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.umd.js +69 -372
- package/dist/index.umd.js.map +1 -1
- package/dist/v2/headless.cjs +4 -1
- package/dist/v2/headless.cjs.map +1 -1
- package/dist/v2/headless.mjs +4 -1
- package/dist/v2/headless.mjs.map +1 -1
- package/dist/v2/index.cjs +20 -4
- package/dist/v2/index.d.cts +1 -1
- package/dist/v2/index.d.mts +1 -1
- package/dist/v2/index.mjs +1 -1
- package/dist/v2/index.umd.js +98 -379
- package/dist/v2/index.umd.js.map +1 -1
- package/package.json +9 -12
- package/dist/copilotkit-B4Jb1QEy.cjs.map +0 -1
- package/dist/copilotkit-ChjzWqn6.d.mts.map +0 -1
- package/dist/copilotkit-DCIXZawe.d.cts.map +0 -1
- package/dist/copilotkit-snbJkMqQ.mjs.map +0 -1
- package/skills/react-core/SKILL.md +0 -110
- package/skills/react-core/references/agent-access.md +0 -398
- package/skills/react-core/references/attachments.md +0 -311
- package/skills/react-core/references/capabilities.md +0 -138
- package/skills/react-core/references/chat-components.md +0 -246
- package/skills/react-core/references/client-side-tools.md +0 -358
- package/skills/react-core/references/custom-message-renderers.md +0 -223
- package/skills/react-core/references/debug-mode.md +0 -140
- package/skills/react-core/references/human-in-the-loop.md +0 -312
- package/skills/react-core/references/provider-setup.md +0 -358
- package/skills/react-core/references/rendering-activity-messages.md +0 -201
- package/skills/react-core/references/rendering-tool-calls.md +0 -319
- package/skills/react-core/references/suggestions.md +0 -211
- package/skills/react-core/references/switching-agents-recipes.md +0 -161
- package/skills/react-core/references/switching-agents.md +0 -240
- package/skills/react-core/references/threads.md +0 -289
|
@@ -43,6 +43,7 @@ let _radix_ui_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
|
|
|
43
43
|
_radix_ui_react_dropdown_menu = __toESM(_radix_ui_react_dropdown_menu);
|
|
44
44
|
let streamdown = require("streamdown");
|
|
45
45
|
let zod = require("zod");
|
|
46
|
+
let _copilotkit_mcp_apps_renderer_activity = require("@copilotkit/mcp-apps-renderer/activity");
|
|
46
47
|
let _copilotkit_a2ui_renderer = require("@copilotkit/a2ui-renderer");
|
|
47
48
|
let zod_to_json_schema = require("zod-to-json-schema");
|
|
48
49
|
let react_dom = require("react-dom");
|
|
@@ -1856,197 +1857,17 @@ function InlineFeatureWarning({ featureName }) {
|
|
|
1856
1857
|
//#endregion
|
|
1857
1858
|
//#region src/v2/components/MCPAppsActivityRenderer.tsx
|
|
1858
1859
|
/**
|
|
1859
|
-
* Run an MCP app `ui/message` follow-up, scoped to the thread it was enqueued
|
|
1860
|
-
* for (issue #5819).
|
|
1861
|
-
*
|
|
1862
|
-
* The MCP request queue delays follow-up work until the agent is idle. There is
|
|
1863
|
-
* a single shared registry agent per id, and switching threads overwrites its
|
|
1864
|
-
* `threadId`/`messages` in place. So if the host switches threads while a
|
|
1865
|
-
* follow-up is queued, running it now would execute against — and stream into —
|
|
1866
|
-
* the now-foreground thread.
|
|
1867
|
-
*
|
|
1868
|
-
* - **Same thread** (the common case): run on the shared agent, unchanged.
|
|
1869
|
-
* - **Thread changed**: the shared agent has moved on, so the follow-up can no
|
|
1870
|
-
* longer run in its originating thread's context. Drop it rather than leak it
|
|
1871
|
-
* into the current thread. (The MCP app already received its `ui/message` ack
|
|
1872
|
-
* at enqueue time; only the optional agent turn is skipped.)
|
|
1873
|
-
*
|
|
1874
|
-
* @internal exported for testing.
|
|
1875
|
-
*/
|
|
1876
|
-
async function ɵrunMcpFollowUp({ host, agent, capturedThreadId }) {
|
|
1877
|
-
const currentThreadId = agent.threadId || "default";
|
|
1878
|
-
const originThreadId = capturedThreadId || "default";
|
|
1879
|
-
if (currentThreadId === originThreadId) return host.runAgent({ agent });
|
|
1880
|
-
console.warn(`[MCPAppsRenderer] ui/message follow-up dropped: the thread changed (${originThreadId} → ${currentThreadId}) between enqueue and execution, so running it would leak into the now-foreground thread.`);
|
|
1881
|
-
return {
|
|
1882
|
-
result: void 0,
|
|
1883
|
-
newMessages: []
|
|
1884
|
-
};
|
|
1885
|
-
}
|
|
1886
|
-
function buildSandboxHTML(extraCspDomains) {
|
|
1887
|
-
const baseScriptSrc = "'self' 'wasm-unsafe-eval' 'unsafe-inline' 'unsafe-eval' blob: data: http://localhost:* https://localhost:*";
|
|
1888
|
-
const baseFrameSrc = "* blob: data: http://localhost:* https://localhost:*";
|
|
1889
|
-
const extra = extraCspDomains?.length ? " " + extraCspDomains.join(" ") : "";
|
|
1890
|
-
return `<!doctype html>
|
|
1891
|
-
<html>
|
|
1892
|
-
<head>
|
|
1893
|
-
<meta charset="utf-8" />
|
|
1894
|
-
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src * data: blob: 'unsafe-inline'; media-src * blob: data:; font-src * blob: data:; script-src ${baseScriptSrc + extra}; style-src * blob: data: 'unsafe-inline'; connect-src *; frame-src ${baseFrameSrc + extra}; base-uri 'self';" />
|
|
1895
|
-
<style>html,body{margin:0;padding:0;height:100%;width:100%;overflow:hidden}*{box-sizing:border-box}iframe{background-color:transparent;border:none;padding:0;overflow:hidden;width:100%;height:100%}</style>
|
|
1896
|
-
</head>
|
|
1897
|
-
<body>
|
|
1898
|
-
<script>
|
|
1899
|
-
if(window.self===window.top){throw new Error("This file must be used in an iframe.")}
|
|
1900
|
-
const inner=document.createElement("iframe");
|
|
1901
|
-
inner.style="width:100%;height:100%;border:none;";
|
|
1902
|
-
inner.setAttribute("sandbox","allow-scripts allow-same-origin allow-forms");
|
|
1903
|
-
document.body.appendChild(inner);
|
|
1904
|
-
window.addEventListener("message",async(event)=>{
|
|
1905
|
-
if(event.source===window.parent){
|
|
1906
|
-
if(event.data&&event.data.method==="ui/notifications/sandbox-resource-ready"){
|
|
1907
|
-
const{html,sandbox}=event.data.params;
|
|
1908
|
-
if(typeof sandbox==="string")inner.setAttribute("sandbox",sandbox);
|
|
1909
|
-
if(typeof html==="string")inner.srcdoc=html;
|
|
1910
|
-
}else if(inner&&inner.contentWindow){
|
|
1911
|
-
inner.contentWindow.postMessage(event.data,"*");
|
|
1912
|
-
}
|
|
1913
|
-
}else if(event.source===inner.contentWindow){
|
|
1914
|
-
window.parent.postMessage(event.data,"*");
|
|
1915
|
-
}
|
|
1916
|
-
});
|
|
1917
|
-
window.parent.postMessage({jsonrpc:"2.0",method:"ui/notifications/sandbox-proxy-ready",params:{}},"*");
|
|
1918
|
-
<\/script>
|
|
1919
|
-
</body>
|
|
1920
|
-
</html>`;
|
|
1921
|
-
}
|
|
1922
|
-
/**
|
|
1923
|
-
* Queue for serializing MCP app requests to an agent.
|
|
1924
|
-
* Ensures requests wait for the agent to stop running and are processed one at a time.
|
|
1925
|
-
*/
|
|
1926
|
-
var MCPAppsRequestQueue = class {
|
|
1927
|
-
constructor() {
|
|
1928
|
-
this.queues = /* @__PURE__ */ new Map();
|
|
1929
|
-
this.processing = /* @__PURE__ */ new Map();
|
|
1930
|
-
}
|
|
1931
|
-
/**
|
|
1932
|
-
* Add a request to the queue for a specific agent thread.
|
|
1933
|
-
* Returns a promise that resolves when the request completes.
|
|
1934
|
-
*/
|
|
1935
|
-
async enqueue(agent, request) {
|
|
1936
|
-
const threadId = agent.threadId || "default";
|
|
1937
|
-
return new Promise((resolve, reject) => {
|
|
1938
|
-
let queue = this.queues.get(threadId);
|
|
1939
|
-
if (!queue) {
|
|
1940
|
-
queue = [];
|
|
1941
|
-
this.queues.set(threadId, queue);
|
|
1942
|
-
}
|
|
1943
|
-
queue.push({
|
|
1944
|
-
execute: request,
|
|
1945
|
-
resolve,
|
|
1946
|
-
reject
|
|
1947
|
-
});
|
|
1948
|
-
this.processQueue(threadId, agent);
|
|
1949
|
-
});
|
|
1950
|
-
}
|
|
1951
|
-
async processQueue(threadId, agent) {
|
|
1952
|
-
if (this.processing.get(threadId)) return;
|
|
1953
|
-
this.processing.set(threadId, true);
|
|
1954
|
-
try {
|
|
1955
|
-
const queue = this.queues.get(threadId);
|
|
1956
|
-
if (!queue) return;
|
|
1957
|
-
while (queue.length > 0) {
|
|
1958
|
-
const item = queue[0];
|
|
1959
|
-
try {
|
|
1960
|
-
await this.waitForAgentIdle(agent);
|
|
1961
|
-
const result = await item.execute();
|
|
1962
|
-
item.resolve(result);
|
|
1963
|
-
} catch (error) {
|
|
1964
|
-
item.reject(error instanceof Error ? error : new Error(String(error)));
|
|
1965
|
-
}
|
|
1966
|
-
queue.shift();
|
|
1967
|
-
}
|
|
1968
|
-
} finally {
|
|
1969
|
-
this.processing.set(threadId, false);
|
|
1970
|
-
}
|
|
1971
|
-
}
|
|
1972
|
-
waitForAgentIdle(agent) {
|
|
1973
|
-
return new Promise((resolve) => {
|
|
1974
|
-
if (!agent.isRunning) {
|
|
1975
|
-
resolve();
|
|
1976
|
-
return;
|
|
1977
|
-
}
|
|
1978
|
-
let done = false;
|
|
1979
|
-
const finish = () => {
|
|
1980
|
-
if (done) return;
|
|
1981
|
-
done = true;
|
|
1982
|
-
clearInterval(checkInterval);
|
|
1983
|
-
sub.unsubscribe();
|
|
1984
|
-
resolve();
|
|
1985
|
-
};
|
|
1986
|
-
const sub = agent.subscribe({
|
|
1987
|
-
onRunFinalized: finish,
|
|
1988
|
-
onRunFailed: finish
|
|
1989
|
-
});
|
|
1990
|
-
const checkInterval = setInterval(() => {
|
|
1991
|
-
if (!agent.isRunning) finish();
|
|
1992
|
-
}, 500);
|
|
1993
|
-
});
|
|
1994
|
-
}
|
|
1995
|
-
};
|
|
1996
|
-
const mcpAppsRequestQueue = new MCPAppsRequestQueue();
|
|
1997
|
-
const MCP_OPEN_LINK_BLOCKED_SCHEMES = new Set([
|
|
1998
|
-
"javascript:",
|
|
1999
|
-
"data:",
|
|
2000
|
-
"vbscript:",
|
|
2001
|
-
"blob:",
|
|
2002
|
-
"file:"
|
|
2003
|
-
]);
|
|
2004
|
-
/**
|
|
2005
|
-
* Activity type for MCP Apps events - must match the middleware's MCPAppsActivityType
|
|
2006
|
-
*/
|
|
2007
|
-
const MCPAppsActivityType = "mcp-apps";
|
|
2008
|
-
const MCPAppsActivityContentSchema = zod.z.object({
|
|
2009
|
-
result: zod.z.object({
|
|
2010
|
-
content: zod.z.array(zod.z.any()).optional(),
|
|
2011
|
-
structuredContent: zod.z.any().optional(),
|
|
2012
|
-
isError: zod.z.boolean().optional()
|
|
2013
|
-
}),
|
|
2014
|
-
resourceUri: zod.z.string(),
|
|
2015
|
-
serverHash: zod.z.string(),
|
|
2016
|
-
serverId: zod.z.string().optional(),
|
|
2017
|
-
toolInput: zod.z.record(zod.z.string(), zod.z.unknown()).optional()
|
|
2018
|
-
});
|
|
2019
|
-
/**
|
|
2020
1860
|
* MCP Apps Extension Activity Renderer
|
|
2021
1861
|
*
|
|
2022
1862
|
* Renders MCP Apps UI in a sandboxed iframe with full protocol support.
|
|
2023
|
-
* Fetches resource content on-demand via proxied MCP requests.
|
|
2024
|
-
|
|
2025
|
-
/**
|
|
2026
|
-
* Permissive `ui/message` schema. ext-apps restricts the request to
|
|
2027
|
-
* `role: "user"` with no `followUp`, but CopilotKit intentionally extends
|
|
2028
|
-
* `ui/message` with `role` ("user" | "assistant") and `followUp` (documented
|
|
2029
|
-
* behavior with dedicated tests). We register our own handler (instead of the
|
|
2030
|
-
* bridge's strict `onmessage`) so those extensions survive the migration.
|
|
2031
|
-
*
|
|
2032
|
-
* Going forward, widgets SHOULD pass the extensions under
|
|
2033
|
-
* `params._meta.copilotkit`; the top-level `role`/`followUp` fields are the
|
|
2034
|
-
* legacy channel, kept for backward compatibility and slated for deprecation.
|
|
1863
|
+
* Fetches resource content on-demand via proxied MCP requests. The React shell
|
|
1864
|
+
* owns the iframe; `bindMcpApp` owns the protocol.
|
|
2035
1865
|
*/
|
|
2036
|
-
const CopilotKitUiMessageSchema = zod.z.object({
|
|
2037
|
-
method: zod.z.literal("ui/message"),
|
|
2038
|
-
params: zod.z.object({
|
|
2039
|
-
role: zod.z.string().optional(),
|
|
2040
|
-
content: zod.z.array(zod.z.any()).optional(),
|
|
2041
|
-
followUp: zod.z.boolean().optional(),
|
|
2042
|
-
_meta: zod.z.record(zod.z.string(), zod.z.any()).optional()
|
|
2043
|
-
}).passthrough()
|
|
2044
|
-
});
|
|
2045
1866
|
const MCPAppsActivityRenderer = function MCPAppsActivityRenderer({ content, agent }) {
|
|
2046
1867
|
const { copilotkit } = (0, _copilotkit_react_core_v2_context.useCopilotKit)();
|
|
2047
1868
|
const containerRef = (0, react.useRef)(null);
|
|
2048
1869
|
const iframeRef = (0, react.useRef)(null);
|
|
2049
|
-
const
|
|
1870
|
+
const sessionRef = (0, react.useRef)(null);
|
|
2050
1871
|
const [error, setError] = (0, react.useState)(null);
|
|
2051
1872
|
const [isLoading, setIsLoading] = (0, react.useState)(true);
|
|
2052
1873
|
const [iframeSize, setIframeSize] = (0, react.useState)({});
|
|
@@ -2055,207 +1876,81 @@ const MCPAppsActivityRenderer = function MCPAppsActivityRenderer({ content, agen
|
|
|
2055
1876
|
contentRef.current = content;
|
|
2056
1877
|
const agentRef = (0, react.useRef)(agent);
|
|
2057
1878
|
agentRef.current = agent;
|
|
2058
|
-
const bridgeRef = (0, react.useRef)(null);
|
|
2059
|
-
const fetchStateRef = (0, react.useRef)({
|
|
2060
|
-
inProgress: false,
|
|
2061
|
-
promise: null,
|
|
2062
|
-
resourceUri: null
|
|
2063
|
-
});
|
|
2064
1879
|
(0, react.useEffect)(() => {
|
|
2065
|
-
const
|
|
2066
|
-
if (
|
|
2067
|
-
fetchStateRef.current.promise?.then((resource) => {
|
|
2068
|
-
if (resource) {
|
|
2069
|
-
setFetchedResource(resource);
|
|
2070
|
-
setIsLoading(false);
|
|
2071
|
-
}
|
|
2072
|
-
}).catch((err) => {
|
|
2073
|
-
setError(err instanceof Error ? err : new Error(String(err)));
|
|
2074
|
-
setIsLoading(false);
|
|
2075
|
-
});
|
|
2076
|
-
return;
|
|
2077
|
-
}
|
|
1880
|
+
const container = containerRef.current;
|
|
1881
|
+
if (!container) return;
|
|
2078
1882
|
if (!agent) {
|
|
2079
1883
|
setError(/* @__PURE__ */ new Error("No agent available to fetch resource"));
|
|
2080
1884
|
setIsLoading(false);
|
|
2081
1885
|
return;
|
|
2082
1886
|
}
|
|
2083
|
-
fetchStateRef.current.inProgress = true;
|
|
2084
|
-
fetchStateRef.current.resourceUri = resourceUri;
|
|
2085
|
-
const fetchPromise = (async () => {
|
|
2086
|
-
try {
|
|
2087
|
-
const resource = (await mcpAppsRequestQueue.enqueue(agent, () => agent.runAgent({ forwardedProps: { __proxiedMCPRequest: {
|
|
2088
|
-
serverHash,
|
|
2089
|
-
serverId,
|
|
2090
|
-
method: "resources/read",
|
|
2091
|
-
params: { uri: resourceUri }
|
|
2092
|
-
} } }))).result?.contents?.[0];
|
|
2093
|
-
if (!resource) throw new Error("No resource content in response");
|
|
2094
|
-
return resource;
|
|
2095
|
-
} catch (err) {
|
|
2096
|
-
console.error("[MCPAppsRenderer] Failed to fetch resource:", err);
|
|
2097
|
-
throw err;
|
|
2098
|
-
} finally {
|
|
2099
|
-
fetchStateRef.current.inProgress = false;
|
|
2100
|
-
}
|
|
2101
|
-
})();
|
|
2102
|
-
fetchStateRef.current.promise = fetchPromise;
|
|
2103
|
-
fetchPromise.then((resource) => {
|
|
2104
|
-
if (resource) {
|
|
2105
|
-
setFetchedResource(resource);
|
|
2106
|
-
setIsLoading(false);
|
|
2107
|
-
}
|
|
2108
|
-
}).catch((err) => {
|
|
2109
|
-
setError(err instanceof Error ? err : new Error(String(err)));
|
|
2110
|
-
setIsLoading(false);
|
|
2111
|
-
});
|
|
2112
|
-
}, [agent, content]);
|
|
2113
|
-
(0, react.useEffect)(() => {
|
|
2114
|
-
if (isLoading || !fetchedResource) return;
|
|
2115
|
-
const container = containerRef.current;
|
|
2116
|
-
if (!container) return;
|
|
2117
1887
|
let mounted = true;
|
|
2118
|
-
|
|
2119
|
-
|
|
1888
|
+
setIsLoading(true);
|
|
1889
|
+
setError(null);
|
|
1890
|
+
const iframe = document.createElement("iframe");
|
|
1891
|
+
iframe.style.width = "100%";
|
|
1892
|
+
iframe.style.height = "100px";
|
|
1893
|
+
iframe.style.border = "none";
|
|
1894
|
+
iframe.style.backgroundColor = "transparent";
|
|
1895
|
+
iframe.style.display = "block";
|
|
1896
|
+
container.appendChild(iframe);
|
|
1897
|
+
iframeRef.current = iframe;
|
|
2120
1898
|
const setup = async () => {
|
|
2121
1899
|
try {
|
|
2122
|
-
const
|
|
2123
|
-
throw new Error("MCP Apps require '@
|
|
2124
|
-
});
|
|
2125
|
-
if (!mounted) return;
|
|
2126
|
-
const { AppBridge, PostMessageTransport } = bridgeModule;
|
|
2127
|
-
const iframe = document.createElement("iframe");
|
|
2128
|
-
createdIframe = iframe;
|
|
2129
|
-
iframe.style.width = "100%";
|
|
2130
|
-
iframe.style.height = "100px";
|
|
2131
|
-
iframe.style.border = "none";
|
|
2132
|
-
iframe.style.backgroundColor = "transparent";
|
|
2133
|
-
iframe.style.display = "block";
|
|
2134
|
-
iframe.setAttribute("sandbox", "allow-scripts allow-same-origin allow-forms");
|
|
2135
|
-
iframe.setAttribute("data-testid", "mcp-app-iframe");
|
|
2136
|
-
iframe.setAttribute("title", "Interactive MCP application");
|
|
2137
|
-
const cspDomains = fetchedResource._meta?.ui?.csp?.resourceDomains;
|
|
2138
|
-
iframe.srcdoc = buildSandboxHTML(cspDomains);
|
|
2139
|
-
iframeRef.current = iframe;
|
|
2140
|
-
container.appendChild(iframe);
|
|
2141
|
-
const win = iframe.contentWindow;
|
|
2142
|
-
if (!win) throw new Error("Sandbox iframe has no contentWindow");
|
|
2143
|
-
let html;
|
|
2144
|
-
if (fetchedResource.text) html = fetchedResource.text;
|
|
2145
|
-
else if (fetchedResource.blob) html = atob(fetchedResource.blob);
|
|
2146
|
-
else throw new Error("Resource has no text or blob content");
|
|
2147
|
-
bridge = new AppBridge(null, {
|
|
2148
|
-
name: "CopilotKit MCP Apps Host",
|
|
2149
|
-
version: "1.0.0"
|
|
2150
|
-
}, {
|
|
2151
|
-
openLinks: {},
|
|
2152
|
-
logging: {},
|
|
2153
|
-
message: { text: {} }
|
|
2154
|
-
}, { hostContext: {
|
|
2155
|
-
theme: "light",
|
|
2156
|
-
platform: "web"
|
|
2157
|
-
} });
|
|
2158
|
-
bridge.onsandboxready = () => {
|
|
2159
|
-
bridge?.sendSandboxResourceReady({ html });
|
|
2160
|
-
};
|
|
2161
|
-
bridge.setRequestHandler(CopilotKitUiMessageSchema, async (req) => {
|
|
2162
|
-
const currentAgent = agentRef.current;
|
|
2163
|
-
if (!currentAgent) {
|
|
2164
|
-
console.warn("[MCPAppsRenderer] ui/message: No agent available");
|
|
2165
|
-
return { isError: false };
|
|
2166
|
-
}
|
|
2167
|
-
try {
|
|
2168
|
-
const params = req.params;
|
|
2169
|
-
const ck = params._meta?.copilotkit ?? {};
|
|
2170
|
-
const role = ck.role || params.role || "user";
|
|
2171
|
-
const textContent = params.content?.filter((c) => c.type === "text" && c.text).map((c) => c.text).join("\n") || "";
|
|
2172
|
-
if (textContent) currentAgent.addMessage({
|
|
2173
|
-
id: crypto.randomUUID(),
|
|
2174
|
-
role,
|
|
2175
|
-
content: textContent
|
|
2176
|
-
});
|
|
2177
|
-
if ((ck.followUp ?? params.followUp ?? role === "user") && textContent) {
|
|
2178
|
-
const capturedThreadId = currentAgent.threadId || "default";
|
|
2179
|
-
mcpAppsRequestQueue.enqueue(currentAgent, () => ɵrunMcpFollowUp({
|
|
2180
|
-
host: copilotkit,
|
|
2181
|
-
agent: currentAgent,
|
|
2182
|
-
capturedThreadId
|
|
2183
|
-
})).catch((err) => console.error("[MCPAppsRenderer] ui/message agent run failed:", err));
|
|
2184
|
-
}
|
|
2185
|
-
return { isError: false };
|
|
2186
|
-
} catch (err) {
|
|
2187
|
-
console.error("[MCPAppsRenderer] ui/message error:", err);
|
|
2188
|
-
return { isError: true };
|
|
2189
|
-
}
|
|
1900
|
+
const mod = await import("@copilotkit/mcp-apps-renderer").catch((importErr) => {
|
|
1901
|
+
throw new Error("MCP Apps require '@copilotkit/mcp-apps-renderer' and its '@modelcontextprotocol/ext-apps' dependency. Reinstall your dependencies if this package is missing.", { cause: importErr });
|
|
2190
1902
|
});
|
|
2191
|
-
bridge.onopenlink = async ({ url }) => {
|
|
2192
|
-
let parsed;
|
|
2193
|
-
try {
|
|
2194
|
-
parsed = new URL(url);
|
|
2195
|
-
} catch {
|
|
2196
|
-
console.warn("[MCPAppsRenderer] ui/open-link rejected: unparseable url");
|
|
2197
|
-
return { isError: true };
|
|
2198
|
-
}
|
|
2199
|
-
if (MCP_OPEN_LINK_BLOCKED_SCHEMES.has(parsed.protocol)) {
|
|
2200
|
-
console.warn("[MCPAppsRenderer] ui/open-link rejected: blocked scheme", parsed.protocol);
|
|
2201
|
-
return { isError: true };
|
|
2202
|
-
}
|
|
2203
|
-
window.open(url, "_blank", "noopener,noreferrer");
|
|
2204
|
-
return { isError: false };
|
|
2205
|
-
};
|
|
2206
|
-
bridge.oncalltool = async (params) => {
|
|
2207
|
-
const { serverHash, serverId } = contentRef.current;
|
|
2208
|
-
const currentAgent = agentRef.current;
|
|
2209
|
-
if (!serverHash) throw new Error("No server hash available for proxying");
|
|
2210
|
-
if (!currentAgent) throw new Error("No agent available for proxying");
|
|
2211
|
-
return (await mcpAppsRequestQueue.enqueue(currentAgent, () => currentAgent.runAgent({ forwardedProps: { __proxiedMCPRequest: {
|
|
2212
|
-
serverHash,
|
|
2213
|
-
serverId,
|
|
2214
|
-
method: "tools/call",
|
|
2215
|
-
params
|
|
2216
|
-
} } }))).result || { content: [] };
|
|
2217
|
-
};
|
|
2218
|
-
bridge.onsizechange = (p) => {
|
|
2219
|
-
if (!mounted) return;
|
|
2220
|
-
const { width, height } = p || {};
|
|
2221
|
-
setIframeSize({
|
|
2222
|
-
width: typeof width === "number" ? width : void 0,
|
|
2223
|
-
height: typeof height === "number" ? height : void 0
|
|
2224
|
-
});
|
|
2225
|
-
};
|
|
2226
|
-
bridge.oninitialized = () => {
|
|
2227
|
-
if (mounted) setIframeReady(true);
|
|
2228
|
-
};
|
|
2229
|
-
bridge.onloggingmessage = (p) => {
|
|
2230
|
-
console.log("[MCPAppsRenderer] App log:", p);
|
|
2231
|
-
};
|
|
2232
|
-
const transport = new PostMessageTransport(win, win);
|
|
2233
|
-
await bridge.connect(transport);
|
|
2234
1903
|
if (!mounted) {
|
|
2235
|
-
|
|
1904
|
+
iframe.remove();
|
|
2236
1905
|
return;
|
|
2237
1906
|
}
|
|
2238
|
-
|
|
1907
|
+
const session = mod.bindMcpApp({
|
|
1908
|
+
iframe,
|
|
1909
|
+
getContent: () => contentRef.current,
|
|
1910
|
+
getAgent: () => agentRef.current,
|
|
1911
|
+
host: copilotkit,
|
|
1912
|
+
hooks: {
|
|
1913
|
+
onResource: (resource) => {
|
|
1914
|
+
if (!mounted) return;
|
|
1915
|
+
setFetchedResource(resource);
|
|
1916
|
+
setIsLoading(false);
|
|
1917
|
+
},
|
|
1918
|
+
onSizeChanged: (size) => {
|
|
1919
|
+
if (mounted) setIframeSize(size);
|
|
1920
|
+
},
|
|
1921
|
+
onError: (err) => {
|
|
1922
|
+
if (!mounted) return;
|
|
1923
|
+
setError(err);
|
|
1924
|
+
setIsLoading(false);
|
|
1925
|
+
}
|
|
1926
|
+
}
|
|
1927
|
+
});
|
|
1928
|
+
sessionRef.current = session;
|
|
1929
|
+
const current = contentRef.current;
|
|
1930
|
+
if (current.toolInput) session.sendToolInput(current.toolInput);
|
|
1931
|
+
if (current.result) session.sendToolResult(current.result);
|
|
2239
1932
|
} catch (err) {
|
|
2240
1933
|
console.error("[MCPAppsRenderer] Setup error:", err);
|
|
2241
|
-
if (mounted)
|
|
1934
|
+
if (mounted) {
|
|
1935
|
+
setError(err instanceof Error ? err : new Error(String(err)));
|
|
1936
|
+
setIsLoading(false);
|
|
1937
|
+
}
|
|
2242
1938
|
}
|
|
2243
1939
|
};
|
|
2244
1940
|
setup();
|
|
2245
1941
|
return () => {
|
|
2246
1942
|
mounted = false;
|
|
2247
|
-
|
|
2248
|
-
|
|
2249
|
-
|
|
2250
|
-
createdIframe.remove();
|
|
2251
|
-
createdIframe = null;
|
|
2252
|
-
}
|
|
1943
|
+
sessionRef.current?.teardown();
|
|
1944
|
+
sessionRef.current = null;
|
|
1945
|
+
iframe.remove();
|
|
2253
1946
|
iframeRef.current = null;
|
|
2254
1947
|
};
|
|
2255
1948
|
}, [
|
|
2256
|
-
|
|
2257
|
-
|
|
2258
|
-
|
|
1949
|
+
agent,
|
|
1950
|
+
copilotkit,
|
|
1951
|
+
content.resourceUri,
|
|
1952
|
+
content.serverHash,
|
|
1953
|
+
content.serverId
|
|
2259
1954
|
]);
|
|
2260
1955
|
(0, react.useEffect)(() => {
|
|
2261
1956
|
if (iframeRef.current) {
|
|
@@ -2267,11 +1962,11 @@ const MCPAppsActivityRenderer = function MCPAppsActivityRenderer({ content, agen
|
|
|
2267
1962
|
}
|
|
2268
1963
|
}, [iframeSize]);
|
|
2269
1964
|
(0, react.useEffect)(() => {
|
|
2270
|
-
if (
|
|
2271
|
-
}, [
|
|
1965
|
+
if (content.toolInput) sessionRef.current?.sendToolInput(content.toolInput);
|
|
1966
|
+
}, [content.toolInput]);
|
|
2272
1967
|
(0, react.useEffect)(() => {
|
|
2273
|
-
if (
|
|
2274
|
-
}, [
|
|
1968
|
+
if (content.result) sessionRef.current?.sendToolResult(content.result);
|
|
1969
|
+
}, [content.result]);
|
|
2275
1970
|
const borderStyle = fetchedResource?._meta?.ui?.prefersBorder === true ? {
|
|
2276
1971
|
borderRadius: "8px",
|
|
2277
1972
|
backgroundColor: "#f9f9f9",
|
|
@@ -3754,8 +3449,8 @@ const CopilotKitProvider = ({ children, runtimeUrl, headers: headersProp = EMPTY
|
|
|
3754
3449
|
}, [rawCatalog, catalogToggleVersion]);
|
|
3755
3450
|
const builtInActivityRenderers = (0, react.useMemo)(() => {
|
|
3756
3451
|
const renderers = [{
|
|
3757
|
-
activityType: MCPAppsActivityType,
|
|
3758
|
-
content: MCPAppsActivityContentSchema,
|
|
3452
|
+
activityType: _copilotkit_mcp_apps_renderer_activity.MCPAppsActivityType,
|
|
3453
|
+
content: _copilotkit_mcp_apps_renderer_activity.MCPAppsActivityContentSchema,
|
|
3759
3454
|
render: MCPAppsActivityRenderer
|
|
3760
3455
|
}];
|
|
3761
3456
|
if (openGenUIActive) renderers.push({
|
|
@@ -5205,7 +4900,10 @@ function toLegacyEvent(pending) {
|
|
|
5205
4900
|
*/
|
|
5206
4901
|
function useInterrupt(config) {
|
|
5207
4902
|
const { copilotkit } = (0, _copilotkit_react_core_v2_context.useCopilotKit)();
|
|
5208
|
-
const { agent } = useAgent({
|
|
4903
|
+
const { agent } = useAgent({
|
|
4904
|
+
agentId: config.agentId,
|
|
4905
|
+
updates: []
|
|
4906
|
+
});
|
|
5209
4907
|
const [pending, setPending] = (0, react.useState)(null);
|
|
5210
4908
|
const pendingRef = (0, react.useRef)(pending);
|
|
5211
4909
|
pendingRef.current = pending;
|
|
@@ -6856,9 +6554,15 @@ const VideoAttachment = (0, react.memo)(function VideoAttachment({ src, classNam
|
|
|
6856
6554
|
className: cn("cpk:max-w-[400px] cpk:w-full cpk:rounded-lg", className)
|
|
6857
6555
|
});
|
|
6858
6556
|
});
|
|
6859
|
-
const DocumentAttachment = (0, react.memo)(function DocumentAttachment({ source, filename, className }) {
|
|
6860
|
-
|
|
6861
|
-
|
|
6557
|
+
const DocumentAttachment = (0, react.memo)(function DocumentAttachment({ src, source, filename, className }) {
|
|
6558
|
+
const label = filename || source.mimeType || "Document attachment";
|
|
6559
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
|
|
6560
|
+
href: src,
|
|
6561
|
+
download: filename ?? "",
|
|
6562
|
+
target: "_blank",
|
|
6563
|
+
rel: "noopener noreferrer",
|
|
6564
|
+
"aria-label": label,
|
|
6565
|
+
className: cn("cpk:inline-flex cpk:max-w-full cpk:items-center cpk:gap-2 cpk:px-3 cpk:py-2 cpk:border cpk:border-border cpk:rounded-lg cpk:bg-muted", className),
|
|
6862
6566
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
6863
6567
|
className: "cpk:text-xs cpk:font-bold cpk:uppercase",
|
|
6864
6568
|
children: (0, _copilotkit_shared.getDocumentIcon)(source.mimeType ?? "")
|
|
@@ -6885,6 +6589,7 @@ const CopilotChatAttachmentRenderer = ({ type, source, filename, className }) =>
|
|
|
6885
6589
|
className
|
|
6886
6590
|
});
|
|
6887
6591
|
case "document": return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DocumentAttachment, {
|
|
6592
|
+
src,
|
|
6888
6593
|
source,
|
|
6889
6594
|
filename,
|
|
6890
6595
|
className
|
|
@@ -6958,7 +6663,7 @@ function CopilotChatUserMessage({ message, onEditMessage, branchIndex, numberOfB
|
|
|
6958
6663
|
...props,
|
|
6959
6664
|
children: [
|
|
6960
6665
|
mediaParts.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
6961
|
-
className: "cpk:flex cpk:flex-row cpk:flex-wrap cpk:justify-end cpk:gap-2 cpk:mb-2",
|
|
6666
|
+
className: "cpk:flex cpk:flex-row cpk:flex-wrap cpk:max-w-full cpk:justify-end cpk:gap-2 cpk:mb-2",
|
|
6962
6667
|
children: mediaParts.map((part, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CopilotChatAttachmentRenderer, {
|
|
6963
6668
|
type: part.type,
|
|
6964
6669
|
source: part.source,
|
|
@@ -12919,24 +12624,12 @@ Object.defineProperty(exports, 'IntelligenceIndicatorView', {
|
|
|
12919
12624
|
return IntelligenceIndicatorView;
|
|
12920
12625
|
}
|
|
12921
12626
|
});
|
|
12922
|
-
Object.defineProperty(exports, 'MCPAppsActivityContentSchema', {
|
|
12923
|
-
enumerable: true,
|
|
12924
|
-
get: function () {
|
|
12925
|
-
return MCPAppsActivityContentSchema;
|
|
12926
|
-
}
|
|
12927
|
-
});
|
|
12928
12627
|
Object.defineProperty(exports, 'MCPAppsActivityRenderer', {
|
|
12929
12628
|
enumerable: true,
|
|
12930
12629
|
get: function () {
|
|
12931
12630
|
return MCPAppsActivityRenderer;
|
|
12932
12631
|
}
|
|
12933
12632
|
});
|
|
12934
|
-
Object.defineProperty(exports, 'MCPAppsActivityType', {
|
|
12935
|
-
enumerable: true,
|
|
12936
|
-
get: function () {
|
|
12937
|
-
return MCPAppsActivityType;
|
|
12938
|
-
}
|
|
12939
|
-
});
|
|
12940
12633
|
Object.defineProperty(exports, 'OpenGenerativeUIActivityRenderer', {
|
|
12941
12634
|
enumerable: true,
|
|
12942
12635
|
get: function () {
|
|
@@ -13201,10 +12894,4 @@ Object.defineProperty(exports, 'useToast', {
|
|
|
13201
12894
|
return useToast;
|
|
13202
12895
|
}
|
|
13203
12896
|
});
|
|
13204
|
-
|
|
13205
|
-
enumerable: true,
|
|
13206
|
-
get: function () {
|
|
13207
|
-
return ɵrunMcpFollowUp;
|
|
13208
|
-
}
|
|
13209
|
-
});
|
|
13210
|
-
//# sourceMappingURL=copilotkit-B4Jb1QEy.cjs.map
|
|
12897
|
+
//# sourceMappingURL=copilotkit-gopQXrTQ.cjs.map
|