@copilotkitnext/react 0.0.20 → 0.0.21
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/index.d.mts +33 -2
- package/dist/index.d.ts +33 -2
- package/dist/index.js +327 -249
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +246 -169
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +6 -6
package/dist/index.js
CHANGED
|
@@ -63,6 +63,7 @@ __export(index_exports, {
|
|
|
63
63
|
useCopilotKit: () => useCopilotKit,
|
|
64
64
|
useFrontendTool: () => useFrontendTool,
|
|
65
65
|
useHumanInTheLoop: () => useHumanInTheLoop,
|
|
66
|
+
useRenderActivityMessage: () => useRenderActivityMessage,
|
|
66
67
|
useRenderCustomMessages: () => useRenderCustomMessages,
|
|
67
68
|
useRenderToolCall: () => useRenderToolCall,
|
|
68
69
|
useSuggestions: () => useSuggestions
|
|
@@ -1388,7 +1389,7 @@ CopilotChatInput.AddMenuButton.displayName = "CopilotChatInput.AddMenuButton";
|
|
|
1388
1389
|
var CopilotChatInput_default = CopilotChatInput;
|
|
1389
1390
|
|
|
1390
1391
|
// src/components/chat/CopilotChatAssistantMessage.tsx
|
|
1391
|
-
var
|
|
1392
|
+
var import_react17 = require("react");
|
|
1392
1393
|
var import_lucide_react3 = require("lucide-react");
|
|
1393
1394
|
var import_tailwind_merge4 = require("tailwind-merge");
|
|
1394
1395
|
var import_katex_min = require("katex/dist/katex.min.css");
|
|
@@ -1407,14 +1408,19 @@ var import_core = require("@copilotkitnext/core");
|
|
|
1407
1408
|
var CopilotKitCoreReact = class extends import_core.CopilotKitCore {
|
|
1408
1409
|
_renderToolCalls = [];
|
|
1409
1410
|
_renderCustomMessages = [];
|
|
1411
|
+
_renderActivityMessages = [];
|
|
1410
1412
|
constructor(config) {
|
|
1411
1413
|
super(config);
|
|
1412
1414
|
this._renderToolCalls = config.renderToolCalls ?? [];
|
|
1413
1415
|
this._renderCustomMessages = config.renderCustomMessages ?? [];
|
|
1416
|
+
this._renderActivityMessages = config.renderActivityMessages ?? [];
|
|
1414
1417
|
}
|
|
1415
1418
|
get renderCustomMessages() {
|
|
1416
1419
|
return this._renderCustomMessages;
|
|
1417
1420
|
}
|
|
1421
|
+
get renderActivityMessages() {
|
|
1422
|
+
return this._renderActivityMessages;
|
|
1423
|
+
}
|
|
1418
1424
|
get renderToolCalls() {
|
|
1419
1425
|
return this._renderToolCalls;
|
|
1420
1426
|
}
|
|
@@ -1496,10 +1502,12 @@ var CopilotKitProvider = ({
|
|
|
1496
1502
|
properties = {},
|
|
1497
1503
|
agents__unsafe_dev_only: agents = {},
|
|
1498
1504
|
renderToolCalls,
|
|
1505
|
+
renderActivityMessages,
|
|
1499
1506
|
renderCustomMessages,
|
|
1500
1507
|
frontendTools,
|
|
1501
1508
|
humanInTheLoop,
|
|
1502
|
-
showDevConsole = false
|
|
1509
|
+
showDevConsole = false,
|
|
1510
|
+
useSingleEndpoint = false
|
|
1503
1511
|
}) => {
|
|
1504
1512
|
const [shouldRenderInspector, setShouldRenderInspector] = (0, import_react6.useState)(false);
|
|
1505
1513
|
(0, import_react6.useEffect)(() => {
|
|
@@ -1536,6 +1544,10 @@ var CopilotKitProvider = ({
|
|
|
1536
1544
|
renderCustomMessages,
|
|
1537
1545
|
"renderCustomMessages must be a stable array."
|
|
1538
1546
|
);
|
|
1547
|
+
const renderActivityMessagesList = useStableArrayProp(
|
|
1548
|
+
renderActivityMessages,
|
|
1549
|
+
"renderActivityMessages must be a stable array."
|
|
1550
|
+
);
|
|
1539
1551
|
const frontendToolsList = useStableArrayProp(
|
|
1540
1552
|
frontendTools,
|
|
1541
1553
|
"frontendTools must be a stable array. If you want to dynamically add or remove tools, use `useFrontendTool` instead."
|
|
@@ -1599,15 +1611,17 @@ var CopilotKitProvider = ({
|
|
|
1599
1611
|
const copilotkit = (0, import_react6.useMemo)(() => {
|
|
1600
1612
|
const copilotkit2 = new CopilotKitCoreReact({
|
|
1601
1613
|
runtimeUrl,
|
|
1614
|
+
runtimeTransport: useSingleEndpoint ? "single" : "rest",
|
|
1602
1615
|
headers,
|
|
1603
1616
|
properties,
|
|
1604
1617
|
agents__unsafe_dev_only: agents,
|
|
1605
1618
|
tools: allTools,
|
|
1606
1619
|
renderToolCalls: allRenderToolCalls,
|
|
1620
|
+
renderActivityMessages: renderActivityMessagesList,
|
|
1607
1621
|
renderCustomMessages: renderCustomMessagesList
|
|
1608
1622
|
});
|
|
1609
1623
|
return copilotkit2;
|
|
1610
|
-
}, [allTools, allRenderToolCalls, renderCustomMessagesList]);
|
|
1624
|
+
}, [allTools, allRenderToolCalls, renderActivityMessagesList, renderCustomMessagesList, useSingleEndpoint]);
|
|
1611
1625
|
const [, forceUpdate] = (0, import_react6.useReducer)((x) => x + 1, 0);
|
|
1612
1626
|
(0, import_react6.useEffect)(() => {
|
|
1613
1627
|
const unsubscribe = copilotkit.subscribe({
|
|
@@ -1621,10 +1635,11 @@ var CopilotKitProvider = ({
|
|
|
1621
1635
|
}, [copilotkit]);
|
|
1622
1636
|
(0, import_react6.useEffect)(() => {
|
|
1623
1637
|
copilotkit.setRuntimeUrl(runtimeUrl);
|
|
1638
|
+
copilotkit.setRuntimeTransport(useSingleEndpoint ? "single" : "rest");
|
|
1624
1639
|
copilotkit.setHeaders(headers);
|
|
1625
1640
|
copilotkit.setProperties(properties);
|
|
1626
1641
|
copilotkit.setAgents__unsafe_dev_only(agents);
|
|
1627
|
-
}, [runtimeUrl, headers, properties, agents]);
|
|
1642
|
+
}, [runtimeUrl, headers, properties, agents, useSingleEndpoint]);
|
|
1628
1643
|
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
|
|
1629
1644
|
CopilotKitContext.Provider,
|
|
1630
1645
|
{
|
|
@@ -1809,11 +1824,57 @@ function useRenderCustomMessages() {
|
|
|
1809
1824
|
};
|
|
1810
1825
|
}
|
|
1811
1826
|
|
|
1812
|
-
// src/hooks/use-
|
|
1827
|
+
// src/hooks/use-render-activity-message.tsx
|
|
1828
|
+
var import_shared4 = require("@copilotkitnext/shared");
|
|
1813
1829
|
var import_react8 = require("react");
|
|
1830
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
1831
|
+
function useRenderActivityMessage() {
|
|
1832
|
+
const { copilotkit } = useCopilotKit();
|
|
1833
|
+
const config = useCopilotChatConfiguration();
|
|
1834
|
+
const agentId = config?.agentId ?? import_shared4.DEFAULT_AGENT_ID;
|
|
1835
|
+
const renderers = copilotkit.renderActivityMessages;
|
|
1836
|
+
return (0, import_react8.useCallback)(
|
|
1837
|
+
(message) => {
|
|
1838
|
+
if (!renderers.length) {
|
|
1839
|
+
return null;
|
|
1840
|
+
}
|
|
1841
|
+
const matches = renderers.filter(
|
|
1842
|
+
(renderer2) => renderer2.activityType === message.activityType
|
|
1843
|
+
);
|
|
1844
|
+
const renderer = matches.find((candidate) => candidate.agentId === agentId) ?? matches.find((candidate) => candidate.agentId === void 0) ?? renderers.find((candidate) => candidate.activityType === "*");
|
|
1845
|
+
if (!renderer) {
|
|
1846
|
+
return null;
|
|
1847
|
+
}
|
|
1848
|
+
const parseResult = renderer.content.safeParse(message.content);
|
|
1849
|
+
if (!parseResult.success) {
|
|
1850
|
+
console.warn(
|
|
1851
|
+
`Failed to parse content for activity message '${message.activityType}':`,
|
|
1852
|
+
parseResult.error
|
|
1853
|
+
);
|
|
1854
|
+
return null;
|
|
1855
|
+
}
|
|
1856
|
+
const Component = renderer.render;
|
|
1857
|
+
const agent = copilotkit.getAgent(agentId);
|
|
1858
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1859
|
+
Component,
|
|
1860
|
+
{
|
|
1861
|
+
activityType: message.activityType,
|
|
1862
|
+
content: parseResult.data,
|
|
1863
|
+
message,
|
|
1864
|
+
agent
|
|
1865
|
+
},
|
|
1866
|
+
message.id
|
|
1867
|
+
);
|
|
1868
|
+
},
|
|
1869
|
+
[agentId, copilotkit, renderers]
|
|
1870
|
+
);
|
|
1871
|
+
}
|
|
1872
|
+
|
|
1873
|
+
// src/hooks/use-frontend-tool.tsx
|
|
1874
|
+
var import_react9 = require("react");
|
|
1814
1875
|
function useFrontendTool(tool) {
|
|
1815
1876
|
const { copilotkit } = useCopilotKit();
|
|
1816
|
-
(0,
|
|
1877
|
+
(0, import_react9.useEffect)(() => {
|
|
1817
1878
|
const name = tool.name;
|
|
1818
1879
|
if (copilotkit.getTool({ toolName: name, agentId: tool.agentId })) {
|
|
1819
1880
|
console.warn(
|
|
@@ -1845,59 +1906,51 @@ function useFrontendTool(tool) {
|
|
|
1845
1906
|
}
|
|
1846
1907
|
|
|
1847
1908
|
// src/hooks/use-human-in-the-loop.tsx
|
|
1848
|
-
var
|
|
1849
|
-
var
|
|
1909
|
+
var import_react10 = require("react");
|
|
1910
|
+
var import_react11 = __toESM(require("react"));
|
|
1850
1911
|
function useHumanInTheLoop(tool) {
|
|
1851
1912
|
const { copilotkit } = useCopilotKit();
|
|
1852
|
-
const
|
|
1853
|
-
|
|
1854
|
-
);
|
|
1855
|
-
const statusRef = (0, import_react9.useRef)(status);
|
|
1856
|
-
const resolvePromiseRef = (0, import_react9.useRef)(null);
|
|
1857
|
-
statusRef.current = status;
|
|
1858
|
-
const respond = (0, import_react9.useCallback)(async (result) => {
|
|
1913
|
+
const resolvePromiseRef = (0, import_react10.useRef)(null);
|
|
1914
|
+
const respond = (0, import_react10.useCallback)(async (result) => {
|
|
1859
1915
|
if (resolvePromiseRef.current) {
|
|
1860
1916
|
resolvePromiseRef.current(result);
|
|
1861
|
-
setStatus("complete");
|
|
1862
1917
|
resolvePromiseRef.current = null;
|
|
1863
1918
|
}
|
|
1864
1919
|
}, []);
|
|
1865
|
-
const handler = (0,
|
|
1920
|
+
const handler = (0, import_react10.useCallback)(async () => {
|
|
1866
1921
|
return new Promise((resolve) => {
|
|
1867
|
-
setStatus("executing");
|
|
1868
1922
|
resolvePromiseRef.current = resolve;
|
|
1869
1923
|
});
|
|
1870
1924
|
}, []);
|
|
1871
|
-
const RenderComponent = (0,
|
|
1925
|
+
const RenderComponent = (0, import_react10.useCallback)(
|
|
1872
1926
|
(props) => {
|
|
1873
1927
|
const ToolComponent = tool.render;
|
|
1874
|
-
|
|
1875
|
-
if (currentStatus === "inProgress" && props.status === "inProgress") {
|
|
1928
|
+
if (props.status === "inProgress") {
|
|
1876
1929
|
const enhancedProps = {
|
|
1877
1930
|
...props,
|
|
1878
1931
|
name: tool.name,
|
|
1879
1932
|
description: tool.description || "",
|
|
1880
1933
|
respond: void 0
|
|
1881
1934
|
};
|
|
1882
|
-
return
|
|
1883
|
-
} else if (
|
|
1935
|
+
return import_react11.default.createElement(ToolComponent, enhancedProps);
|
|
1936
|
+
} else if (props.status === "executing") {
|
|
1884
1937
|
const enhancedProps = {
|
|
1885
1938
|
...props,
|
|
1886
1939
|
name: tool.name,
|
|
1887
1940
|
description: tool.description || "",
|
|
1888
1941
|
respond
|
|
1889
1942
|
};
|
|
1890
|
-
return
|
|
1891
|
-
} else if (
|
|
1943
|
+
return import_react11.default.createElement(ToolComponent, enhancedProps);
|
|
1944
|
+
} else if (props.status === "complete") {
|
|
1892
1945
|
const enhancedProps = {
|
|
1893
1946
|
...props,
|
|
1894
1947
|
name: tool.name,
|
|
1895
1948
|
description: tool.description || "",
|
|
1896
1949
|
respond: void 0
|
|
1897
1950
|
};
|
|
1898
|
-
return
|
|
1951
|
+
return import_react11.default.createElement(ToolComponent, enhancedProps);
|
|
1899
1952
|
}
|
|
1900
|
-
return
|
|
1953
|
+
return import_react11.default.createElement(ToolComponent, props);
|
|
1901
1954
|
},
|
|
1902
1955
|
[tool.render, tool.name, tool.description, respond]
|
|
1903
1956
|
);
|
|
@@ -1907,7 +1960,7 @@ function useHumanInTheLoop(tool) {
|
|
|
1907
1960
|
render: RenderComponent
|
|
1908
1961
|
};
|
|
1909
1962
|
useFrontendTool(frontendTool);
|
|
1910
|
-
(0,
|
|
1963
|
+
(0, import_react10.useEffect)(() => {
|
|
1911
1964
|
return () => {
|
|
1912
1965
|
const keyOf = (rc) => `${rc.agentId ?? ""}:${rc.name}`;
|
|
1913
1966
|
const currentRenderToolCalls = copilotkit.renderToolCalls;
|
|
@@ -1920,22 +1973,22 @@ function useHumanInTheLoop(tool) {
|
|
|
1920
1973
|
}
|
|
1921
1974
|
|
|
1922
1975
|
// src/hooks/use-agent.tsx
|
|
1923
|
-
var
|
|
1924
|
-
var
|
|
1976
|
+
var import_react12 = require("react");
|
|
1977
|
+
var import_shared5 = require("@copilotkitnext/shared");
|
|
1925
1978
|
var ALL_UPDATES = [
|
|
1926
1979
|
"OnMessagesChanged" /* OnMessagesChanged */,
|
|
1927
1980
|
"OnStateChanged" /* OnStateChanged */,
|
|
1928
1981
|
"OnRunStatusChanged" /* OnRunStatusChanged */
|
|
1929
1982
|
];
|
|
1930
1983
|
function useAgent({ agentId, updates } = {}) {
|
|
1931
|
-
agentId ??=
|
|
1984
|
+
agentId ??= import_shared5.DEFAULT_AGENT_ID;
|
|
1932
1985
|
const { copilotkit } = useCopilotKit();
|
|
1933
|
-
const [, forceUpdate] = (0,
|
|
1934
|
-
const updateFlags = (0,
|
|
1986
|
+
const [, forceUpdate] = (0, import_react12.useReducer)((x) => x + 1, 0);
|
|
1987
|
+
const updateFlags = (0, import_react12.useMemo)(
|
|
1935
1988
|
() => updates ?? ALL_UPDATES,
|
|
1936
1989
|
[JSON.stringify(updates)]
|
|
1937
1990
|
);
|
|
1938
|
-
const agent = (0,
|
|
1991
|
+
const agent = (0, import_react12.useMemo)(() => {
|
|
1939
1992
|
return copilotkit.getAgent(agentId);
|
|
1940
1993
|
}, [
|
|
1941
1994
|
agentId,
|
|
@@ -1943,7 +1996,7 @@ function useAgent({ agentId, updates } = {}) {
|
|
|
1943
1996
|
copilotkit.runtimeConnectionStatus,
|
|
1944
1997
|
copilotkit
|
|
1945
1998
|
]);
|
|
1946
|
-
(0,
|
|
1999
|
+
(0, import_react12.useEffect)(() => {
|
|
1947
2000
|
if (!agent) {
|
|
1948
2001
|
return;
|
|
1949
2002
|
}
|
|
@@ -1981,11 +2034,11 @@ function useAgent({ agentId, updates } = {}) {
|
|
|
1981
2034
|
}
|
|
1982
2035
|
|
|
1983
2036
|
// src/hooks/use-agent-context.tsx
|
|
1984
|
-
var
|
|
2037
|
+
var import_react13 = require("react");
|
|
1985
2038
|
function useAgentContext(context) {
|
|
1986
2039
|
const { description, value } = context;
|
|
1987
2040
|
const { copilotkit } = useCopilotKit();
|
|
1988
|
-
(0,
|
|
2041
|
+
(0, import_react13.useEffect)(() => {
|
|
1989
2042
|
if (!copilotkit) return;
|
|
1990
2043
|
const id = copilotkit.addContext(context);
|
|
1991
2044
|
return () => {
|
|
@@ -1995,26 +2048,26 @@ function useAgentContext(context) {
|
|
|
1995
2048
|
}
|
|
1996
2049
|
|
|
1997
2050
|
// src/hooks/use-suggestions.tsx
|
|
1998
|
-
var
|
|
1999
|
-
var
|
|
2051
|
+
var import_react14 = require("react");
|
|
2052
|
+
var import_shared6 = require("@copilotkitnext/shared");
|
|
2000
2053
|
function useSuggestions({ agentId } = {}) {
|
|
2001
2054
|
const { copilotkit } = useCopilotKit();
|
|
2002
2055
|
const config = useCopilotChatConfiguration();
|
|
2003
|
-
const resolvedAgentId = (0,
|
|
2004
|
-
const [suggestions, setSuggestions] = (0,
|
|
2056
|
+
const resolvedAgentId = (0, import_react14.useMemo)(() => agentId ?? config?.agentId ?? import_shared6.DEFAULT_AGENT_ID, [agentId, config?.agentId]);
|
|
2057
|
+
const [suggestions, setSuggestions] = (0, import_react14.useState)(() => {
|
|
2005
2058
|
const result = copilotkit.getSuggestions(resolvedAgentId);
|
|
2006
2059
|
return result.suggestions;
|
|
2007
2060
|
});
|
|
2008
|
-
const [isLoading, setIsLoading] = (0,
|
|
2061
|
+
const [isLoading, setIsLoading] = (0, import_react14.useState)(() => {
|
|
2009
2062
|
const result = copilotkit.getSuggestions(resolvedAgentId);
|
|
2010
2063
|
return result.isLoading;
|
|
2011
2064
|
});
|
|
2012
|
-
(0,
|
|
2065
|
+
(0, import_react14.useEffect)(() => {
|
|
2013
2066
|
const result = copilotkit.getSuggestions(resolvedAgentId);
|
|
2014
2067
|
setSuggestions(result.suggestions);
|
|
2015
2068
|
setIsLoading(result.isLoading);
|
|
2016
2069
|
}, [copilotkit, resolvedAgentId]);
|
|
2017
|
-
(0,
|
|
2070
|
+
(0, import_react14.useEffect)(() => {
|
|
2018
2071
|
const unsubscribe = copilotkit.subscribe({
|
|
2019
2072
|
onSuggestionsChanged: ({ agentId: changedAgentId, suggestions: suggestions2 }) => {
|
|
2020
2073
|
if (changedAgentId !== resolvedAgentId) {
|
|
@@ -2044,10 +2097,10 @@ function useSuggestions({ agentId } = {}) {
|
|
|
2044
2097
|
unsubscribe();
|
|
2045
2098
|
};
|
|
2046
2099
|
}, [copilotkit, resolvedAgentId]);
|
|
2047
|
-
const reloadSuggestions = (0,
|
|
2100
|
+
const reloadSuggestions = (0, import_react14.useCallback)(() => {
|
|
2048
2101
|
copilotkit.reloadSuggestions(resolvedAgentId);
|
|
2049
2102
|
}, [copilotkit, resolvedAgentId]);
|
|
2050
|
-
const clearSuggestions = (0,
|
|
2103
|
+
const clearSuggestions = (0, import_react14.useCallback)(() => {
|
|
2051
2104
|
copilotkit.clearSuggestions(resolvedAgentId);
|
|
2052
2105
|
}, [copilotkit, resolvedAgentId]);
|
|
2053
2106
|
return {
|
|
@@ -2059,20 +2112,20 @@ function useSuggestions({ agentId } = {}) {
|
|
|
2059
2112
|
}
|
|
2060
2113
|
|
|
2061
2114
|
// src/hooks/use-configure-suggestions.tsx
|
|
2062
|
-
var
|
|
2063
|
-
var
|
|
2115
|
+
var import_react15 = require("react");
|
|
2116
|
+
var import_shared7 = require("@copilotkitnext/shared");
|
|
2064
2117
|
var EMPTY_DEPS = [];
|
|
2065
2118
|
function useConfigureSuggestions(config, options) {
|
|
2066
2119
|
const { copilotkit } = useCopilotKit();
|
|
2067
2120
|
const chatConfig = useCopilotChatConfiguration();
|
|
2068
2121
|
const extraDeps = options?.deps ?? EMPTY_DEPS;
|
|
2069
|
-
const resolvedConsumerAgentId = (0,
|
|
2070
|
-
const rawConsumerAgentId = (0,
|
|
2071
|
-
const normalizationCacheRef = (0,
|
|
2122
|
+
const resolvedConsumerAgentId = (0, import_react15.useMemo)(() => chatConfig?.agentId ?? import_shared7.DEFAULT_AGENT_ID, [chatConfig?.agentId]);
|
|
2123
|
+
const rawConsumerAgentId = (0, import_react15.useMemo)(() => config ? config.consumerAgentId : void 0, [config]);
|
|
2124
|
+
const normalizationCacheRef = (0, import_react15.useRef)({
|
|
2072
2125
|
serialized: null,
|
|
2073
2126
|
config: null
|
|
2074
2127
|
});
|
|
2075
|
-
const { normalizedConfig, serializedConfig } = (0,
|
|
2128
|
+
const { normalizedConfig, serializedConfig } = (0, import_react15.useMemo)(() => {
|
|
2076
2129
|
if (!config) {
|
|
2077
2130
|
normalizationCacheRef.current = { serialized: null, config: null };
|
|
2078
2131
|
return { normalizedConfig: null, serializedConfig: null };
|
|
@@ -2102,10 +2155,10 @@ function useConfigureSuggestions(config, options) {
|
|
|
2102
2155
|
normalizationCacheRef.current = { serialized, config: built };
|
|
2103
2156
|
return { normalizedConfig: built, serializedConfig: serialized };
|
|
2104
2157
|
}, [config, resolvedConsumerAgentId, ...extraDeps]);
|
|
2105
|
-
const latestConfigRef = (0,
|
|
2158
|
+
const latestConfigRef = (0, import_react15.useRef)(null);
|
|
2106
2159
|
latestConfigRef.current = normalizedConfig;
|
|
2107
|
-
const previousSerializedConfigRef = (0,
|
|
2108
|
-
const targetAgentId = (0,
|
|
2160
|
+
const previousSerializedConfigRef = (0, import_react15.useRef)(null);
|
|
2161
|
+
const targetAgentId = (0, import_react15.useMemo)(() => {
|
|
2109
2162
|
if (!normalizedConfig) {
|
|
2110
2163
|
return resolvedConsumerAgentId;
|
|
2111
2164
|
}
|
|
@@ -2116,7 +2169,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2116
2169
|
return consumer;
|
|
2117
2170
|
}, [normalizedConfig, resolvedConsumerAgentId]);
|
|
2118
2171
|
const isGlobalConfig = rawConsumerAgentId === void 0 || rawConsumerAgentId === "*";
|
|
2119
|
-
const requestReload = (0,
|
|
2172
|
+
const requestReload = (0, import_react15.useCallback)(() => {
|
|
2120
2173
|
if (!normalizedConfig) {
|
|
2121
2174
|
return;
|
|
2122
2175
|
}
|
|
@@ -2138,7 +2191,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2138
2191
|
}
|
|
2139
2192
|
copilotkit.reloadSuggestions(targetAgentId);
|
|
2140
2193
|
}, [copilotkit, isGlobalConfig, normalizedConfig, targetAgentId]);
|
|
2141
|
-
(0,
|
|
2194
|
+
(0, import_react15.useEffect)(() => {
|
|
2142
2195
|
if (!serializedConfig || !latestConfigRef.current) {
|
|
2143
2196
|
return;
|
|
2144
2197
|
}
|
|
@@ -2148,7 +2201,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2148
2201
|
copilotkit.removeSuggestionsConfig(id);
|
|
2149
2202
|
};
|
|
2150
2203
|
}, [copilotkit, serializedConfig, requestReload]);
|
|
2151
|
-
(0,
|
|
2204
|
+
(0, import_react15.useEffect)(() => {
|
|
2152
2205
|
if (!normalizedConfig) {
|
|
2153
2206
|
previousSerializedConfigRef.current = null;
|
|
2154
2207
|
return;
|
|
@@ -2161,7 +2214,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2161
2214
|
}
|
|
2162
2215
|
requestReload();
|
|
2163
2216
|
}, [normalizedConfig, requestReload, serializedConfig]);
|
|
2164
|
-
(0,
|
|
2217
|
+
(0, import_react15.useEffect)(() => {
|
|
2165
2218
|
if (!normalizedConfig || extraDeps.length === 0) {
|
|
2166
2219
|
return;
|
|
2167
2220
|
}
|
|
@@ -2179,8 +2232,8 @@ function normalizeStaticSuggestions(suggestions) {
|
|
|
2179
2232
|
}
|
|
2180
2233
|
|
|
2181
2234
|
// src/components/chat/CopilotChatToolCallsView.tsx
|
|
2182
|
-
var
|
|
2183
|
-
var
|
|
2235
|
+
var import_react16 = __toESM(require("react"));
|
|
2236
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
2184
2237
|
function CopilotChatToolCallsView({
|
|
2185
2238
|
message,
|
|
2186
2239
|
messages = []
|
|
@@ -2189,11 +2242,11 @@ function CopilotChatToolCallsView({
|
|
|
2189
2242
|
if (!message.toolCalls || message.toolCalls.length === 0) {
|
|
2190
2243
|
return null;
|
|
2191
2244
|
}
|
|
2192
|
-
return /* @__PURE__ */ (0,
|
|
2245
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, { children: message.toolCalls.map((toolCall) => {
|
|
2193
2246
|
const toolMessage = messages.find(
|
|
2194
2247
|
(m) => m.role === "tool" && m.toolCallId === toolCall.id
|
|
2195
2248
|
);
|
|
2196
|
-
return /* @__PURE__ */ (0,
|
|
2249
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react16.default.Fragment, { children: renderToolCall({
|
|
2197
2250
|
toolCall,
|
|
2198
2251
|
toolMessage
|
|
2199
2252
|
}) }, toolCall.id);
|
|
@@ -2202,7 +2255,7 @@ function CopilotChatToolCallsView({
|
|
|
2202
2255
|
var CopilotChatToolCallsView_default = CopilotChatToolCallsView;
|
|
2203
2256
|
|
|
2204
2257
|
// src/components/chat/CopilotChatAssistantMessage.tsx
|
|
2205
|
-
var
|
|
2258
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
2206
2259
|
function CopilotChatAssistantMessage({
|
|
2207
2260
|
message,
|
|
2208
2261
|
messages,
|
|
@@ -2279,7 +2332,7 @@ function CopilotChatAssistantMessage({
|
|
|
2279
2332
|
toolbar,
|
|
2280
2333
|
CopilotChatAssistantMessage.Toolbar,
|
|
2281
2334
|
{
|
|
2282
|
-
children: /* @__PURE__ */ (0,
|
|
2335
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
2283
2336
|
boundCopyButton,
|
|
2284
2337
|
(onThumbsUp || thumbsUpButton) && boundThumbsUpButton,
|
|
2285
2338
|
(onThumbsDown || thumbsDownButton) && boundThumbsDownButton,
|
|
@@ -2301,7 +2354,7 @@ function CopilotChatAssistantMessage({
|
|
|
2301
2354
|
const isLatestAssistantMessage = message.role === "assistant" && messages?.[messages.length - 1]?.id === message.id;
|
|
2302
2355
|
const shouldShowToolbar = toolbarVisible && hasContent && !(isRunning && isLatestAssistantMessage);
|
|
2303
2356
|
if (children) {
|
|
2304
|
-
return /* @__PURE__ */ (0,
|
|
2357
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_jsx_runtime13.Fragment, { children: children({
|
|
2305
2358
|
markdownRenderer: boundMarkdownRenderer,
|
|
2306
2359
|
toolbar: boundToolbar,
|
|
2307
2360
|
toolCallsView: boundToolCallsView,
|
|
@@ -2321,7 +2374,7 @@ function CopilotChatAssistantMessage({
|
|
|
2321
2374
|
toolbarVisible: shouldShowToolbar
|
|
2322
2375
|
}) });
|
|
2323
2376
|
}
|
|
2324
|
-
return /* @__PURE__ */ (0,
|
|
2377
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
2325
2378
|
"div",
|
|
2326
2379
|
{
|
|
2327
2380
|
className: (0, import_tailwind_merge4.twMerge)(
|
|
@@ -2339,11 +2392,11 @@ function CopilotChatAssistantMessage({
|
|
|
2339
2392
|
);
|
|
2340
2393
|
}
|
|
2341
2394
|
((CopilotChatAssistantMessage2) => {
|
|
2342
|
-
CopilotChatAssistantMessage2.MarkdownRenderer = ({ content, className, ...props }) => /* @__PURE__ */ (0,
|
|
2395
|
+
CopilotChatAssistantMessage2.MarkdownRenderer = ({ content, className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_streamdown.Streamdown, { className, ...props, children: content ?? "" });
|
|
2343
2396
|
CopilotChatAssistantMessage2.Toolbar = ({
|
|
2344
2397
|
className,
|
|
2345
2398
|
...props
|
|
2346
|
-
}) => /* @__PURE__ */ (0,
|
|
2399
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2347
2400
|
"div",
|
|
2348
2401
|
{
|
|
2349
2402
|
className: (0, import_tailwind_merge4.twMerge)(
|
|
@@ -2354,8 +2407,8 @@ function CopilotChatAssistantMessage({
|
|
|
2354
2407
|
}
|
|
2355
2408
|
);
|
|
2356
2409
|
CopilotChatAssistantMessage2.ToolbarButton = ({ title, children, ...props }) => {
|
|
2357
|
-
return /* @__PURE__ */ (0,
|
|
2358
|
-
/* @__PURE__ */ (0,
|
|
2410
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(Tooltip, { children: [
|
|
2411
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2359
2412
|
Button,
|
|
2360
2413
|
{
|
|
2361
2414
|
type: "button",
|
|
@@ -2365,13 +2418,13 @@ function CopilotChatAssistantMessage({
|
|
|
2365
2418
|
children
|
|
2366
2419
|
}
|
|
2367
2420
|
) }),
|
|
2368
|
-
/* @__PURE__ */ (0,
|
|
2421
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(TooltipContent, { side: "bottom", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { children: title }) })
|
|
2369
2422
|
] });
|
|
2370
2423
|
};
|
|
2371
2424
|
CopilotChatAssistantMessage2.CopyButton = ({ className, title, onClick, ...props }) => {
|
|
2372
2425
|
const config = useCopilotChatConfiguration();
|
|
2373
2426
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2374
|
-
const [copied, setCopied] = (0,
|
|
2427
|
+
const [copied, setCopied] = (0, import_react17.useState)(false);
|
|
2375
2428
|
const handleClick = (event) => {
|
|
2376
2429
|
setCopied(true);
|
|
2377
2430
|
setTimeout(() => setCopied(false), 2e3);
|
|
@@ -2379,62 +2432,62 @@ function CopilotChatAssistantMessage({
|
|
|
2379
2432
|
onClick(event);
|
|
2380
2433
|
}
|
|
2381
2434
|
};
|
|
2382
|
-
return /* @__PURE__ */ (0,
|
|
2435
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2383
2436
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2384
2437
|
{
|
|
2385
2438
|
title: title || labels.assistantMessageToolbarCopyMessageLabel,
|
|
2386
2439
|
onClick: handleClick,
|
|
2387
2440
|
className,
|
|
2388
2441
|
...props,
|
|
2389
|
-
children: copied ? /* @__PURE__ */ (0,
|
|
2442
|
+
children: copied ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.Check, { className: "size-[18px]" }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.Copy, { className: "size-[18px]" })
|
|
2390
2443
|
}
|
|
2391
2444
|
);
|
|
2392
2445
|
};
|
|
2393
2446
|
CopilotChatAssistantMessage2.ThumbsUpButton = ({ title, ...props }) => {
|
|
2394
2447
|
const config = useCopilotChatConfiguration();
|
|
2395
2448
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2396
|
-
return /* @__PURE__ */ (0,
|
|
2449
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2397
2450
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2398
2451
|
{
|
|
2399
2452
|
title: title || labels.assistantMessageToolbarThumbsUpLabel,
|
|
2400
2453
|
...props,
|
|
2401
|
-
children: /* @__PURE__ */ (0,
|
|
2454
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.ThumbsUp, { className: "size-[18px]" })
|
|
2402
2455
|
}
|
|
2403
2456
|
);
|
|
2404
2457
|
};
|
|
2405
2458
|
CopilotChatAssistantMessage2.ThumbsDownButton = ({ title, ...props }) => {
|
|
2406
2459
|
const config = useCopilotChatConfiguration();
|
|
2407
2460
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2408
|
-
return /* @__PURE__ */ (0,
|
|
2461
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2409
2462
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2410
2463
|
{
|
|
2411
2464
|
title: title || labels.assistantMessageToolbarThumbsDownLabel,
|
|
2412
2465
|
...props,
|
|
2413
|
-
children: /* @__PURE__ */ (0,
|
|
2466
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.ThumbsDown, { className: "size-[18px]" })
|
|
2414
2467
|
}
|
|
2415
2468
|
);
|
|
2416
2469
|
};
|
|
2417
2470
|
CopilotChatAssistantMessage2.ReadAloudButton = ({ title, ...props }) => {
|
|
2418
2471
|
const config = useCopilotChatConfiguration();
|
|
2419
2472
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2420
|
-
return /* @__PURE__ */ (0,
|
|
2473
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2421
2474
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2422
2475
|
{
|
|
2423
2476
|
title: title || labels.assistantMessageToolbarReadAloudLabel,
|
|
2424
2477
|
...props,
|
|
2425
|
-
children: /* @__PURE__ */ (0,
|
|
2478
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.Volume2, { className: "size-[20px]" })
|
|
2426
2479
|
}
|
|
2427
2480
|
);
|
|
2428
2481
|
};
|
|
2429
2482
|
CopilotChatAssistantMessage2.RegenerateButton = ({ title, ...props }) => {
|
|
2430
2483
|
const config = useCopilotChatConfiguration();
|
|
2431
2484
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2432
|
-
return /* @__PURE__ */ (0,
|
|
2485
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2433
2486
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2434
2487
|
{
|
|
2435
2488
|
title: title || labels.assistantMessageToolbarRegenerateLabel,
|
|
2436
2489
|
...props,
|
|
2437
|
-
children: /* @__PURE__ */ (0,
|
|
2490
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.RefreshCw, { className: "size-[18px]" })
|
|
2438
2491
|
}
|
|
2439
2492
|
);
|
|
2440
2493
|
};
|
|
@@ -2449,10 +2502,24 @@ CopilotChatAssistantMessage.RegenerateButton.displayName = "CopilotChatAssistant
|
|
|
2449
2502
|
var CopilotChatAssistantMessage_default = CopilotChatAssistantMessage;
|
|
2450
2503
|
|
|
2451
2504
|
// src/components/chat/CopilotChatUserMessage.tsx
|
|
2452
|
-
var
|
|
2505
|
+
var import_react18 = require("react");
|
|
2453
2506
|
var import_lucide_react4 = require("lucide-react");
|
|
2454
2507
|
var import_tailwind_merge5 = require("tailwind-merge");
|
|
2455
|
-
var
|
|
2508
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
2509
|
+
function flattenUserMessageContent(content) {
|
|
2510
|
+
if (!content) {
|
|
2511
|
+
return "";
|
|
2512
|
+
}
|
|
2513
|
+
if (typeof content === "string") {
|
|
2514
|
+
return content;
|
|
2515
|
+
}
|
|
2516
|
+
return content.map((part) => {
|
|
2517
|
+
if (part && typeof part === "object" && "type" in part && part.type === "text" && typeof part.text === "string") {
|
|
2518
|
+
return part.text;
|
|
2519
|
+
}
|
|
2520
|
+
return "";
|
|
2521
|
+
}).filter((text) => text.length > 0).join("\n");
|
|
2522
|
+
}
|
|
2456
2523
|
function CopilotChatUserMessage({
|
|
2457
2524
|
message,
|
|
2458
2525
|
onEditMessage,
|
|
@@ -2469,11 +2536,15 @@ function CopilotChatUserMessage({
|
|
|
2469
2536
|
className,
|
|
2470
2537
|
...props
|
|
2471
2538
|
}) {
|
|
2539
|
+
const flattenedContent = (0, import_react18.useMemo)(
|
|
2540
|
+
() => flattenUserMessageContent(message.content),
|
|
2541
|
+
[message.content]
|
|
2542
|
+
);
|
|
2472
2543
|
const BoundMessageRenderer = renderSlot(
|
|
2473
2544
|
messageRenderer,
|
|
2474
2545
|
CopilotChatUserMessage.MessageRenderer,
|
|
2475
2546
|
{
|
|
2476
|
-
content:
|
|
2547
|
+
content: flattenedContent
|
|
2477
2548
|
}
|
|
2478
2549
|
);
|
|
2479
2550
|
const BoundCopyButton = renderSlot(
|
|
@@ -2481,9 +2552,9 @@ function CopilotChatUserMessage({
|
|
|
2481
2552
|
CopilotChatUserMessage.CopyButton,
|
|
2482
2553
|
{
|
|
2483
2554
|
onClick: async () => {
|
|
2484
|
-
if (
|
|
2555
|
+
if (flattenedContent) {
|
|
2485
2556
|
try {
|
|
2486
|
-
await navigator.clipboard.writeText(
|
|
2557
|
+
await navigator.clipboard.writeText(flattenedContent);
|
|
2487
2558
|
} catch (err) {
|
|
2488
2559
|
console.error("Failed to copy message:", err);
|
|
2489
2560
|
}
|
|
@@ -2510,7 +2581,7 @@ function CopilotChatUserMessage({
|
|
|
2510
2581
|
);
|
|
2511
2582
|
const showBranchNavigation = numberOfBranches && numberOfBranches > 1 && onSwitchToBranch;
|
|
2512
2583
|
const BoundToolbar = renderSlot(toolbar, CopilotChatUserMessage.Toolbar, {
|
|
2513
|
-
children: /* @__PURE__ */ (0,
|
|
2584
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center gap-1 justify-end", children: [
|
|
2514
2585
|
additionalToolbarItems,
|
|
2515
2586
|
BoundCopyButton,
|
|
2516
2587
|
onEditMessage && BoundEditButton,
|
|
@@ -2518,7 +2589,7 @@ function CopilotChatUserMessage({
|
|
|
2518
2589
|
] })
|
|
2519
2590
|
});
|
|
2520
2591
|
if (children) {
|
|
2521
|
-
return /* @__PURE__ */ (0,
|
|
2592
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_jsx_runtime14.Fragment, { children: children({
|
|
2522
2593
|
messageRenderer: BoundMessageRenderer,
|
|
2523
2594
|
toolbar: BoundToolbar,
|
|
2524
2595
|
copyButton: BoundCopyButton,
|
|
@@ -2530,7 +2601,7 @@ function CopilotChatUserMessage({
|
|
|
2530
2601
|
additionalToolbarItems
|
|
2531
2602
|
}) });
|
|
2532
2603
|
}
|
|
2533
|
-
return /* @__PURE__ */ (0,
|
|
2604
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
2534
2605
|
"div",
|
|
2535
2606
|
{
|
|
2536
2607
|
className: (0, import_tailwind_merge5.twMerge)("flex flex-col items-end group pt-10", className),
|
|
@@ -2544,7 +2615,7 @@ function CopilotChatUserMessage({
|
|
|
2544
2615
|
);
|
|
2545
2616
|
}
|
|
2546
2617
|
((CopilotChatUserMessage2) => {
|
|
2547
|
-
CopilotChatUserMessage2.Container = ({ children, className, ...props }) => /* @__PURE__ */ (0,
|
|
2618
|
+
CopilotChatUserMessage2.Container = ({ children, className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2548
2619
|
"div",
|
|
2549
2620
|
{
|
|
2550
2621
|
className: (0, import_tailwind_merge5.twMerge)("flex flex-col items-end group", className),
|
|
@@ -2552,7 +2623,7 @@ function CopilotChatUserMessage({
|
|
|
2552
2623
|
children
|
|
2553
2624
|
}
|
|
2554
2625
|
);
|
|
2555
|
-
CopilotChatUserMessage2.MessageRenderer = ({ content, className }) => /* @__PURE__ */ (0,
|
|
2626
|
+
CopilotChatUserMessage2.MessageRenderer = ({ content, className }) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2556
2627
|
"div",
|
|
2557
2628
|
{
|
|
2558
2629
|
className: (0, import_tailwind_merge5.twMerge)(
|
|
@@ -2565,7 +2636,7 @@ function CopilotChatUserMessage({
|
|
|
2565
2636
|
CopilotChatUserMessage2.Toolbar = ({
|
|
2566
2637
|
className,
|
|
2567
2638
|
...props
|
|
2568
|
-
}) => /* @__PURE__ */ (0,
|
|
2639
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2569
2640
|
"div",
|
|
2570
2641
|
{
|
|
2571
2642
|
className: (0, import_tailwind_merge5.twMerge)(
|
|
@@ -2576,8 +2647,8 @@ function CopilotChatUserMessage({
|
|
|
2576
2647
|
}
|
|
2577
2648
|
);
|
|
2578
2649
|
CopilotChatUserMessage2.ToolbarButton = ({ title, children, className, ...props }) => {
|
|
2579
|
-
return /* @__PURE__ */ (0,
|
|
2580
|
-
/* @__PURE__ */ (0,
|
|
2650
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(Tooltip, { children: [
|
|
2651
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2581
2652
|
Button,
|
|
2582
2653
|
{
|
|
2583
2654
|
type: "button",
|
|
@@ -2588,13 +2659,13 @@ function CopilotChatUserMessage({
|
|
|
2588
2659
|
children
|
|
2589
2660
|
}
|
|
2590
2661
|
) }),
|
|
2591
|
-
/* @__PURE__ */ (0,
|
|
2662
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(TooltipContent, { side: "bottom", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { children: title }) })
|
|
2592
2663
|
] });
|
|
2593
2664
|
};
|
|
2594
2665
|
CopilotChatUserMessage2.CopyButton = ({ className, title, onClick, ...props }) => {
|
|
2595
2666
|
const config = useCopilotChatConfiguration();
|
|
2596
2667
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2597
|
-
const [copied, setCopied] = (0,
|
|
2668
|
+
const [copied, setCopied] = (0, import_react18.useState)(false);
|
|
2598
2669
|
const handleClick = (event) => {
|
|
2599
2670
|
setCopied(true);
|
|
2600
2671
|
setTimeout(() => setCopied(false), 2e3);
|
|
@@ -2602,27 +2673,27 @@ function CopilotChatUserMessage({
|
|
|
2602
2673
|
onClick(event);
|
|
2603
2674
|
}
|
|
2604
2675
|
};
|
|
2605
|
-
return /* @__PURE__ */ (0,
|
|
2676
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2606
2677
|
CopilotChatUserMessage2.ToolbarButton,
|
|
2607
2678
|
{
|
|
2608
2679
|
title: title || labels.userMessageToolbarCopyMessageLabel,
|
|
2609
2680
|
onClick: handleClick,
|
|
2610
2681
|
className,
|
|
2611
2682
|
...props,
|
|
2612
|
-
children: copied ? /* @__PURE__ */ (0,
|
|
2683
|
+
children: copied ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.Check, { className: "size-[18px]" }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.Copy, { className: "size-[18px]" })
|
|
2613
2684
|
}
|
|
2614
2685
|
);
|
|
2615
2686
|
};
|
|
2616
2687
|
CopilotChatUserMessage2.EditButton = ({ className, title, ...props }) => {
|
|
2617
2688
|
const config = useCopilotChatConfiguration();
|
|
2618
2689
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2619
|
-
return /* @__PURE__ */ (0,
|
|
2690
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2620
2691
|
CopilotChatUserMessage2.ToolbarButton,
|
|
2621
2692
|
{
|
|
2622
2693
|
title: title || labels.userMessageToolbarEditMessageLabel,
|
|
2623
2694
|
className,
|
|
2624
2695
|
...props,
|
|
2625
|
-
children: /* @__PURE__ */ (0,
|
|
2696
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.Edit, { className: "size-[18px]" })
|
|
2626
2697
|
}
|
|
2627
2698
|
);
|
|
2628
2699
|
};
|
|
@@ -2639,8 +2710,8 @@ function CopilotChatUserMessage({
|
|
|
2639
2710
|
}
|
|
2640
2711
|
const canGoPrev = currentBranch > 0;
|
|
2641
2712
|
const canGoNext = currentBranch < numberOfBranches - 1;
|
|
2642
|
-
return /* @__PURE__ */ (0,
|
|
2643
|
-
/* @__PURE__ */ (0,
|
|
2713
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: (0, import_tailwind_merge5.twMerge)("flex items-center gap-1", className), ...props, children: [
|
|
2714
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2644
2715
|
Button,
|
|
2645
2716
|
{
|
|
2646
2717
|
type: "button",
|
|
@@ -2652,15 +2723,15 @@ function CopilotChatUserMessage({
|
|
|
2652
2723
|
}),
|
|
2653
2724
|
disabled: !canGoPrev,
|
|
2654
2725
|
className: "h-6 w-6 p-0",
|
|
2655
|
-
children: /* @__PURE__ */ (0,
|
|
2726
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.ChevronLeft, { className: "size-[20px]" })
|
|
2656
2727
|
}
|
|
2657
2728
|
),
|
|
2658
|
-
/* @__PURE__ */ (0,
|
|
2729
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("span", { className: "text-sm text-muted-foreground px-0 font-medium", children: [
|
|
2659
2730
|
currentBranch + 1,
|
|
2660
2731
|
"/",
|
|
2661
2732
|
numberOfBranches
|
|
2662
2733
|
] }),
|
|
2663
|
-
/* @__PURE__ */ (0,
|
|
2734
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2664
2735
|
Button,
|
|
2665
2736
|
{
|
|
2666
2737
|
type: "button",
|
|
@@ -2672,7 +2743,7 @@ function CopilotChatUserMessage({
|
|
|
2672
2743
|
}),
|
|
2673
2744
|
disabled: !canGoNext,
|
|
2674
2745
|
className: "h-6 w-6 p-0",
|
|
2675
|
-
children: /* @__PURE__ */ (0,
|
|
2746
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.ChevronRight, { className: "size-[20px]" })
|
|
2676
2747
|
}
|
|
2677
2748
|
)
|
|
2678
2749
|
] });
|
|
@@ -2688,14 +2759,14 @@ CopilotChatUserMessage.BranchNavigation.displayName = "CopilotChatUserMessage.Br
|
|
|
2688
2759
|
var CopilotChatUserMessage_default = CopilotChatUserMessage;
|
|
2689
2760
|
|
|
2690
2761
|
// src/components/chat/CopilotChatSuggestionPill.tsx
|
|
2691
|
-
var
|
|
2762
|
+
var import_react19 = __toESM(require("react"));
|
|
2692
2763
|
var import_lucide_react5 = require("lucide-react");
|
|
2693
|
-
var
|
|
2764
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
2694
2765
|
var baseClasses = "group inline-flex h-7 sm:h-8 items-center gap-1 sm:gap-1.5 rounded-full border border-border/60 bg-background px-2.5 sm:px-3 text-[11px] sm:text-xs leading-none text-foreground transition-colors cursor-pointer hover:bg-accent/60 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:text-muted-foreground disabled:hover:bg-background disabled:hover:text-muted-foreground pointer-events-auto";
|
|
2695
2766
|
var labelClasses = "whitespace-nowrap font-medium leading-none";
|
|
2696
|
-
var CopilotChatSuggestionPill =
|
|
2767
|
+
var CopilotChatSuggestionPill = import_react19.default.forwardRef(function CopilotChatSuggestionPill2({ className, children, icon, isLoading, type, ...props }, ref) {
|
|
2697
2768
|
const showIcon = !isLoading && icon;
|
|
2698
|
-
return /* @__PURE__ */ (0,
|
|
2769
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
2699
2770
|
"button",
|
|
2700
2771
|
{
|
|
2701
2772
|
ref,
|
|
@@ -2706,8 +2777,8 @@ var CopilotChatSuggestionPill = import_react18.default.forwardRef(function Copil
|
|
|
2706
2777
|
disabled: isLoading || props.disabled,
|
|
2707
2778
|
...props,
|
|
2708
2779
|
children: [
|
|
2709
|
-
isLoading ? /* @__PURE__ */ (0,
|
|
2710
|
-
/* @__PURE__ */ (0,
|
|
2780
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "flex h-3.5 sm:h-4 w-3.5 sm:w-4 items-center justify-center text-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react5.Loader2, { className: "h-3.5 sm:h-4 w-3.5 sm:w-4 animate-spin", "aria-hidden": "true" }) }) : showIcon && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "flex h-3.5 sm:h-4 w-3.5 sm:w-4 items-center justify-center text-muted-foreground", children: icon }),
|
|
2781
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: labelClasses, children })
|
|
2711
2782
|
]
|
|
2712
2783
|
}
|
|
2713
2784
|
);
|
|
@@ -2716,10 +2787,10 @@ CopilotChatSuggestionPill.displayName = "CopilotChatSuggestionPill";
|
|
|
2716
2787
|
var CopilotChatSuggestionPill_default = CopilotChatSuggestionPill;
|
|
2717
2788
|
|
|
2718
2789
|
// src/components/chat/CopilotChatSuggestionView.tsx
|
|
2719
|
-
var
|
|
2720
|
-
var
|
|
2721
|
-
var DefaultContainer =
|
|
2722
|
-
return /* @__PURE__ */ (0,
|
|
2790
|
+
var import_react20 = __toESM(require("react"));
|
|
2791
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
2792
|
+
var DefaultContainer = import_react20.default.forwardRef(function DefaultContainer2({ className, ...props }, ref) {
|
|
2793
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
2723
2794
|
"div",
|
|
2724
2795
|
{
|
|
2725
2796
|
ref,
|
|
@@ -2731,7 +2802,7 @@ var DefaultContainer = import_react19.default.forwardRef(function DefaultContain
|
|
|
2731
2802
|
}
|
|
2732
2803
|
);
|
|
2733
2804
|
});
|
|
2734
|
-
var CopilotChatSuggestionView =
|
|
2805
|
+
var CopilotChatSuggestionView = import_react20.default.forwardRef(function CopilotChatSuggestionView2({
|
|
2735
2806
|
suggestions,
|
|
2736
2807
|
onSelectSuggestion,
|
|
2737
2808
|
loadingIndexes,
|
|
@@ -2741,7 +2812,7 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2741
2812
|
children,
|
|
2742
2813
|
...restProps
|
|
2743
2814
|
}, ref) {
|
|
2744
|
-
const loadingSet =
|
|
2815
|
+
const loadingSet = import_react20.default.useMemo(() => {
|
|
2745
2816
|
if (!loadingIndexes || loadingIndexes.length === 0) {
|
|
2746
2817
|
return /* @__PURE__ */ new Set();
|
|
2747
2818
|
}
|
|
@@ -2760,11 +2831,11 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2760
2831
|
type: "button",
|
|
2761
2832
|
onClick: () => onSelectSuggestion?.(suggestion, index)
|
|
2762
2833
|
});
|
|
2763
|
-
return
|
|
2834
|
+
return import_react20.default.cloneElement(pill, {
|
|
2764
2835
|
key: `${suggestion.title}-${index}`
|
|
2765
2836
|
});
|
|
2766
2837
|
});
|
|
2767
|
-
const boundContainer =
|
|
2838
|
+
const boundContainer = import_react20.default.cloneElement(
|
|
2768
2839
|
ContainerElement,
|
|
2769
2840
|
void 0,
|
|
2770
2841
|
suggestionElements
|
|
@@ -2775,7 +2846,7 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2775
2846
|
isLoading: suggestions.length > 0 ? loadingSet.has(0) || suggestions[0]?.isLoading === true : false,
|
|
2776
2847
|
type: "button"
|
|
2777
2848
|
});
|
|
2778
|
-
return /* @__PURE__ */ (0,
|
|
2849
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children: children({
|
|
2779
2850
|
container: boundContainer,
|
|
2780
2851
|
suggestion: sampleSuggestion,
|
|
2781
2852
|
suggestions,
|
|
@@ -2786,7 +2857,7 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2786
2857
|
}) });
|
|
2787
2858
|
}
|
|
2788
2859
|
if (children) {
|
|
2789
|
-
return /* @__PURE__ */ (0,
|
|
2860
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
2790
2861
|
boundContainer,
|
|
2791
2862
|
children
|
|
2792
2863
|
] });
|
|
@@ -2798,7 +2869,7 @@ var CopilotChatSuggestionView_default = CopilotChatSuggestionView;
|
|
|
2798
2869
|
|
|
2799
2870
|
// src/components/chat/CopilotChatMessageView.tsx
|
|
2800
2871
|
var import_tailwind_merge6 = require("tailwind-merge");
|
|
2801
|
-
var
|
|
2872
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
2802
2873
|
function CopilotChatMessageView({
|
|
2803
2874
|
messages = [],
|
|
2804
2875
|
assistantMessage,
|
|
@@ -2810,6 +2881,7 @@ function CopilotChatMessageView({
|
|
|
2810
2881
|
...props
|
|
2811
2882
|
}) {
|
|
2812
2883
|
const renderCustomMessage = useRenderCustomMessages();
|
|
2884
|
+
const renderActivityMessage = useRenderActivityMessage();
|
|
2813
2885
|
const messageElements = messages.flatMap((message) => {
|
|
2814
2886
|
const elements = [];
|
|
2815
2887
|
if (renderCustomMessage) {
|
|
@@ -2836,6 +2908,11 @@ function CopilotChatMessageView({
|
|
|
2836
2908
|
message
|
|
2837
2909
|
})
|
|
2838
2910
|
);
|
|
2911
|
+
} else if (message.role === "activity") {
|
|
2912
|
+
const renderedActivity = renderActivityMessage(message);
|
|
2913
|
+
if (renderedActivity) {
|
|
2914
|
+
elements.push(renderedActivity);
|
|
2915
|
+
}
|
|
2839
2916
|
}
|
|
2840
2917
|
if (renderCustomMessage) {
|
|
2841
2918
|
elements.push(
|
|
@@ -2850,13 +2927,13 @@ function CopilotChatMessageView({
|
|
|
2850
2927
|
if (children) {
|
|
2851
2928
|
return children({ messageElements, messages, isRunning });
|
|
2852
2929
|
}
|
|
2853
|
-
return /* @__PURE__ */ (0,
|
|
2930
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: (0, import_tailwind_merge6.twMerge)("flex flex-col", className), ...props, children: [
|
|
2854
2931
|
messageElements,
|
|
2855
2932
|
isRunning && renderSlot(cursor, CopilotChatMessageView.Cursor, {})
|
|
2856
2933
|
] });
|
|
2857
2934
|
}
|
|
2858
2935
|
CopilotChatMessageView.Cursor = function Cursor({ className, ...props }) {
|
|
2859
|
-
return /* @__PURE__ */ (0,
|
|
2936
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
2860
2937
|
"div",
|
|
2861
2938
|
{
|
|
2862
2939
|
className: (0, import_tailwind_merge6.twMerge)("w-[11px] h-[11px] rounded-full bg-foreground animate-pulse-cursor ml-1", className),
|
|
@@ -2867,21 +2944,21 @@ CopilotChatMessageView.Cursor = function Cursor({ className, ...props }) {
|
|
|
2867
2944
|
var CopilotChatMessageView_default = CopilotChatMessageView;
|
|
2868
2945
|
|
|
2869
2946
|
// src/components/chat/CopilotChatView.tsx
|
|
2870
|
-
var
|
|
2947
|
+
var import_react22 = __toESM(require("react"));
|
|
2871
2948
|
var import_tailwind_merge7 = require("tailwind-merge");
|
|
2872
2949
|
var import_use_stick_to_bottom = require("use-stick-to-bottom");
|
|
2873
2950
|
var import_lucide_react6 = require("lucide-react");
|
|
2874
2951
|
|
|
2875
2952
|
// src/hooks/use-keyboard-height.tsx
|
|
2876
|
-
var
|
|
2953
|
+
var import_react21 = require("react");
|
|
2877
2954
|
function useKeyboardHeight() {
|
|
2878
|
-
const [keyboardState, setKeyboardState] = (0,
|
|
2955
|
+
const [keyboardState, setKeyboardState] = (0, import_react21.useState)({
|
|
2879
2956
|
isKeyboardOpen: false,
|
|
2880
2957
|
keyboardHeight: 0,
|
|
2881
2958
|
availableHeight: typeof window !== "undefined" ? window.innerHeight : 0,
|
|
2882
2959
|
viewportHeight: typeof window !== "undefined" ? window.innerHeight : 0
|
|
2883
2960
|
});
|
|
2884
|
-
(0,
|
|
2961
|
+
(0, import_react21.useEffect)(() => {
|
|
2885
2962
|
if (typeof window === "undefined") {
|
|
2886
2963
|
return;
|
|
2887
2964
|
}
|
|
@@ -2913,7 +2990,7 @@ function useKeyboardHeight() {
|
|
|
2913
2990
|
}
|
|
2914
2991
|
|
|
2915
2992
|
// src/components/chat/CopilotChatView.tsx
|
|
2916
|
-
var
|
|
2993
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
2917
2994
|
function CopilotChatView({
|
|
2918
2995
|
messageView,
|
|
2919
2996
|
input,
|
|
@@ -2934,12 +3011,12 @@ function CopilotChatView({
|
|
|
2934
3011
|
className,
|
|
2935
3012
|
...props
|
|
2936
3013
|
}) {
|
|
2937
|
-
const inputContainerRef = (0,
|
|
2938
|
-
const [inputContainerHeight, setInputContainerHeight] = (0,
|
|
2939
|
-
const [isResizing, setIsResizing] = (0,
|
|
2940
|
-
const resizeTimeoutRef = (0,
|
|
3014
|
+
const inputContainerRef = (0, import_react22.useRef)(null);
|
|
3015
|
+
const [inputContainerHeight, setInputContainerHeight] = (0, import_react22.useState)(0);
|
|
3016
|
+
const [isResizing, setIsResizing] = (0, import_react22.useState)(false);
|
|
3017
|
+
const resizeTimeoutRef = (0, import_react22.useRef)(null);
|
|
2941
3018
|
const { isKeyboardOpen, keyboardHeight, availableHeight } = useKeyboardHeight();
|
|
2942
|
-
(0,
|
|
3019
|
+
(0, import_react22.useEffect)(() => {
|
|
2943
3020
|
const element = inputContainerRef.current;
|
|
2944
3021
|
if (!element) return;
|
|
2945
3022
|
const resizeObserver = new ResizeObserver((entries) => {
|
|
@@ -2991,9 +3068,9 @@ function CopilotChatView({
|
|
|
2991
3068
|
scrollToBottomButton,
|
|
2992
3069
|
inputContainerHeight,
|
|
2993
3070
|
isResizing,
|
|
2994
|
-
children: /* @__PURE__ */ (0,
|
|
3071
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { paddingBottom: `${inputContainerHeight + (hasSuggestions ? 4 : 32)}px` }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "max-w-3xl mx-auto", children: [
|
|
2995
3072
|
BoundMessageView,
|
|
2996
|
-
hasSuggestions ? /* @__PURE__ */ (0,
|
|
3073
|
+
hasSuggestions ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "pl-0 pr-4 sm:px-0 mt-4", children: BoundSuggestionView }) : null
|
|
2997
3074
|
] }) })
|
|
2998
3075
|
});
|
|
2999
3076
|
const BoundScrollToBottomButton = renderSlot(scrollToBottomButton, CopilotChatView.ScrollToBottomButton, {});
|
|
@@ -3001,8 +3078,8 @@ function CopilotChatView({
|
|
|
3001
3078
|
const BoundInputContainer = renderSlot(inputContainer, CopilotChatView.InputContainer, {
|
|
3002
3079
|
ref: inputContainerRef,
|
|
3003
3080
|
keyboardHeight: isKeyboardOpen ? keyboardHeight : 0,
|
|
3004
|
-
children: /* @__PURE__ */ (0,
|
|
3005
|
-
/* @__PURE__ */ (0,
|
|
3081
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
|
|
3082
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "max-w-3xl mx-auto py-0 px-4 sm:px-0 [div[data-sidebar-chat]_&]:px-8 [div[data-popup-chat]_&]:px-6 pointer-events-auto", children: BoundInput }),
|
|
3006
3083
|
BoundDisclaimer
|
|
3007
3084
|
] })
|
|
3008
3085
|
});
|
|
@@ -3015,10 +3092,10 @@ function CopilotChatView({
|
|
|
3015
3092
|
feather: BoundFeather,
|
|
3016
3093
|
inputContainer: BoundInputContainer,
|
|
3017
3094
|
disclaimer: BoundDisclaimer,
|
|
3018
|
-
suggestionView: BoundSuggestionView ?? /* @__PURE__ */ (0,
|
|
3095
|
+
suggestionView: BoundSuggestionView ?? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, {})
|
|
3019
3096
|
});
|
|
3020
3097
|
}
|
|
3021
|
-
return /* @__PURE__ */ (0,
|
|
3098
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: (0, import_tailwind_merge7.twMerge)("relative h-full", className), ...props, children: [
|
|
3022
3099
|
BoundScrollView,
|
|
3023
3100
|
BoundFeather,
|
|
3024
3101
|
BoundInputContainer
|
|
@@ -3027,9 +3104,9 @@ function CopilotChatView({
|
|
|
3027
3104
|
((CopilotChatView2) => {
|
|
3028
3105
|
const ScrollContent = ({ children, scrollToBottomButton, inputContainerHeight, isResizing }) => {
|
|
3029
3106
|
const { isAtBottom, scrollToBottom } = (0, import_use_stick_to_bottom.useStickToBottomContext)();
|
|
3030
|
-
return /* @__PURE__ */ (0,
|
|
3031
|
-
/* @__PURE__ */ (0,
|
|
3032
|
-
!isAtBottom && !isResizing && /* @__PURE__ */ (0,
|
|
3107
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
|
|
3108
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_use_stick_to_bottom.StickToBottom.Content, { className: "overflow-y-scroll overflow-x-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "px-4 sm:px-0 [div[data-sidebar-chat]_&]:px-8 [div[data-popup-chat]_&]:px-6", children }) }),
|
|
3109
|
+
!isAtBottom && !isResizing && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3033
3110
|
"div",
|
|
3034
3111
|
{
|
|
3035
3112
|
className: "absolute inset-x-0 flex justify-center z-10 pointer-events-none",
|
|
@@ -3052,13 +3129,13 @@ function CopilotChatView({
|
|
|
3052
3129
|
className,
|
|
3053
3130
|
...props
|
|
3054
3131
|
}) => {
|
|
3055
|
-
const [hasMounted, setHasMounted] = (0,
|
|
3132
|
+
const [hasMounted, setHasMounted] = (0, import_react22.useState)(false);
|
|
3056
3133
|
const { scrollRef, contentRef, scrollToBottom } = (0, import_use_stick_to_bottom.useStickToBottom)();
|
|
3057
|
-
const [showScrollButton, setShowScrollButton] = (0,
|
|
3058
|
-
(0,
|
|
3134
|
+
const [showScrollButton, setShowScrollButton] = (0, import_react22.useState)(false);
|
|
3135
|
+
(0, import_react22.useEffect)(() => {
|
|
3059
3136
|
setHasMounted(true);
|
|
3060
3137
|
}, []);
|
|
3061
|
-
(0,
|
|
3138
|
+
(0, import_react22.useEffect)(() => {
|
|
3062
3139
|
if (autoScroll) return;
|
|
3063
3140
|
const scrollElement = scrollRef.current;
|
|
3064
3141
|
if (!scrollElement) return;
|
|
@@ -3076,10 +3153,10 @@ function CopilotChatView({
|
|
|
3076
3153
|
};
|
|
3077
3154
|
}, [scrollRef, autoScroll]);
|
|
3078
3155
|
if (!hasMounted) {
|
|
3079
|
-
return /* @__PURE__ */ (0,
|
|
3156
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "h-full max-h-full flex flex-col min-h-0 overflow-y-scroll overflow-x-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "px-4 sm:px-0 [div[data-sidebar-chat]_&]:px-8 [div[data-popup-chat]_&]:px-6", children }) });
|
|
3080
3157
|
}
|
|
3081
3158
|
if (!autoScroll) {
|
|
3082
|
-
return /* @__PURE__ */ (0,
|
|
3159
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
3083
3160
|
"div",
|
|
3084
3161
|
{
|
|
3085
3162
|
ref: scrollRef,
|
|
@@ -3089,8 +3166,8 @@ function CopilotChatView({
|
|
|
3089
3166
|
),
|
|
3090
3167
|
...props,
|
|
3091
3168
|
children: [
|
|
3092
|
-
/* @__PURE__ */ (0,
|
|
3093
|
-
showScrollButton && !isResizing && /* @__PURE__ */ (0,
|
|
3169
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { ref: contentRef, className: "px-4 sm:px-0 [div[data-sidebar-chat]_&]:px-8 [div[data-popup-chat]_&]:px-6", children }),
|
|
3170
|
+
showScrollButton && !isResizing && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3094
3171
|
"div",
|
|
3095
3172
|
{
|
|
3096
3173
|
className: "absolute inset-x-0 flex justify-center z-10 pointer-events-none",
|
|
@@ -3106,14 +3183,14 @@ function CopilotChatView({
|
|
|
3106
3183
|
}
|
|
3107
3184
|
);
|
|
3108
3185
|
}
|
|
3109
|
-
return /* @__PURE__ */ (0,
|
|
3186
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3110
3187
|
import_use_stick_to_bottom.StickToBottom,
|
|
3111
3188
|
{
|
|
3112
3189
|
className: cn("h-full max-h-full flex flex-col min-h-0 relative", className),
|
|
3113
3190
|
resize: "smooth",
|
|
3114
3191
|
initial: "smooth",
|
|
3115
3192
|
...props,
|
|
3116
|
-
children: /* @__PURE__ */ (0,
|
|
3193
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3117
3194
|
ScrollContent,
|
|
3118
3195
|
{
|
|
3119
3196
|
scrollToBottomButton,
|
|
@@ -3128,7 +3205,7 @@ function CopilotChatView({
|
|
|
3128
3205
|
CopilotChatView2.ScrollToBottomButton = ({
|
|
3129
3206
|
className,
|
|
3130
3207
|
...props
|
|
3131
|
-
}) => /* @__PURE__ */ (0,
|
|
3208
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3132
3209
|
Button,
|
|
3133
3210
|
{
|
|
3134
3211
|
variant: "outline",
|
|
@@ -3142,10 +3219,10 @@ function CopilotChatView({
|
|
|
3142
3219
|
className
|
|
3143
3220
|
),
|
|
3144
3221
|
...props,
|
|
3145
|
-
children: /* @__PURE__ */ (0,
|
|
3222
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react6.ChevronDown, { className: "w-4 h-4 text-gray-600 dark:text-white" })
|
|
3146
3223
|
}
|
|
3147
3224
|
);
|
|
3148
|
-
CopilotChatView2.Feather = ({ className, style, ...props }) => /* @__PURE__ */ (0,
|
|
3225
|
+
CopilotChatView2.Feather = ({ className, style, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3149
3226
|
"div",
|
|
3150
3227
|
{
|
|
3151
3228
|
className: cn(
|
|
@@ -3158,7 +3235,7 @@ function CopilotChatView({
|
|
|
3158
3235
|
...props
|
|
3159
3236
|
}
|
|
3160
3237
|
);
|
|
3161
|
-
CopilotChatView2.InputContainer =
|
|
3238
|
+
CopilotChatView2.InputContainer = import_react22.default.forwardRef(({ children, className, keyboardHeight = 0, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3162
3239
|
"div",
|
|
3163
3240
|
{
|
|
3164
3241
|
ref,
|
|
@@ -3176,7 +3253,7 @@ function CopilotChatView({
|
|
|
3176
3253
|
CopilotChatView2.Disclaimer = ({ className, ...props }) => {
|
|
3177
3254
|
const config = useCopilotChatConfiguration();
|
|
3178
3255
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
3179
|
-
return /* @__PURE__ */ (0,
|
|
3256
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3180
3257
|
"div",
|
|
3181
3258
|
{
|
|
3182
3259
|
className: cn("text-center text-xs text-muted-foreground py-3 px-4 max-w-3xl mx-auto", className),
|
|
@@ -3189,16 +3266,16 @@ function CopilotChatView({
|
|
|
3189
3266
|
var CopilotChatView_default = CopilotChatView;
|
|
3190
3267
|
|
|
3191
3268
|
// src/components/chat/CopilotChat.tsx
|
|
3192
|
-
var
|
|
3193
|
-
var
|
|
3269
|
+
var import_shared8 = require("@copilotkitnext/shared");
|
|
3270
|
+
var import_react23 = require("react");
|
|
3194
3271
|
var import_ts_deepmerge = require("ts-deepmerge");
|
|
3195
3272
|
var import_client = require("@ag-ui/client");
|
|
3196
|
-
var
|
|
3273
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
3197
3274
|
function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen, ...props }) {
|
|
3198
3275
|
const existingConfig = useCopilotChatConfiguration();
|
|
3199
|
-
const resolvedAgentId = agentId ?? existingConfig?.agentId ??
|
|
3200
|
-
const resolvedThreadId = (0,
|
|
3201
|
-
() => threadId ?? existingConfig?.threadId ?? (0,
|
|
3276
|
+
const resolvedAgentId = agentId ?? existingConfig?.agentId ?? import_shared8.DEFAULT_AGENT_ID;
|
|
3277
|
+
const resolvedThreadId = (0, import_react23.useMemo)(
|
|
3278
|
+
() => threadId ?? existingConfig?.threadId ?? (0, import_shared8.randomUUID)(),
|
|
3202
3279
|
[threadId, existingConfig?.threadId]
|
|
3203
3280
|
);
|
|
3204
3281
|
const { agent } = useAgent({ agentId: resolvedAgentId });
|
|
@@ -3210,7 +3287,7 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3210
3287
|
suggestionView: providedSuggestionView,
|
|
3211
3288
|
...restProps
|
|
3212
3289
|
} = props;
|
|
3213
|
-
(0,
|
|
3290
|
+
(0, import_react23.useEffect)(() => {
|
|
3214
3291
|
const connect = async (agent2) => {
|
|
3215
3292
|
try {
|
|
3216
3293
|
await copilotkit.connectAgent({ agent: agent2 });
|
|
@@ -3228,10 +3305,10 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3228
3305
|
return () => {
|
|
3229
3306
|
};
|
|
3230
3307
|
}, [resolvedThreadId, agent, copilotkit, resolvedAgentId]);
|
|
3231
|
-
const onSubmitInput = (0,
|
|
3308
|
+
const onSubmitInput = (0, import_react23.useCallback)(
|
|
3232
3309
|
async (value) => {
|
|
3233
3310
|
agent?.addMessage({
|
|
3234
|
-
id: (0,
|
|
3311
|
+
id: (0, import_shared8.randomUUID)(),
|
|
3235
3312
|
role: "user",
|
|
3236
3313
|
content: value
|
|
3237
3314
|
});
|
|
@@ -3245,13 +3322,13 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3245
3322
|
},
|
|
3246
3323
|
[agent, copilotkit]
|
|
3247
3324
|
);
|
|
3248
|
-
const handleSelectSuggestion = (0,
|
|
3325
|
+
const handleSelectSuggestion = (0, import_react23.useCallback)(
|
|
3249
3326
|
async (suggestion) => {
|
|
3250
3327
|
if (!agent) {
|
|
3251
3328
|
return;
|
|
3252
3329
|
}
|
|
3253
3330
|
agent.addMessage({
|
|
3254
|
-
id: (0,
|
|
3331
|
+
id: (0, import_shared8.randomUUID)(),
|
|
3255
3332
|
role: "user",
|
|
3256
3333
|
content: suggestion.message
|
|
3257
3334
|
});
|
|
@@ -3263,7 +3340,7 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3263
3340
|
},
|
|
3264
3341
|
[agent, copilotkit]
|
|
3265
3342
|
);
|
|
3266
|
-
const stopCurrentRun = (0,
|
|
3343
|
+
const stopCurrentRun = (0, import_react23.useCallback)(() => {
|
|
3267
3344
|
if (!agent) {
|
|
3268
3345
|
return;
|
|
3269
3346
|
}
|
|
@@ -3306,7 +3383,7 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3306
3383
|
inputProps: finalInputProps
|
|
3307
3384
|
});
|
|
3308
3385
|
const RenderedChatView = renderSlot(chatView, CopilotChatView, finalProps);
|
|
3309
|
-
return /* @__PURE__ */ (0,
|
|
3386
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3310
3387
|
CopilotChatConfigurationProvider,
|
|
3311
3388
|
{
|
|
3312
3389
|
agentId: resolvedAgentId,
|
|
@@ -3322,17 +3399,17 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3322
3399
|
})(CopilotChat || (CopilotChat = {}));
|
|
3323
3400
|
|
|
3324
3401
|
// src/components/chat/CopilotChatToggleButton.tsx
|
|
3325
|
-
var
|
|
3402
|
+
var import_react24 = __toESM(require("react"));
|
|
3326
3403
|
var import_lucide_react7 = require("lucide-react");
|
|
3327
|
-
var
|
|
3404
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
3328
3405
|
var DefaultOpenIcon = ({
|
|
3329
3406
|
className,
|
|
3330
3407
|
...props
|
|
3331
|
-
}) => /* @__PURE__ */ (0,
|
|
3408
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react7.MessageCircle, { className: cn("h-6 w-6", className), strokeWidth: 1.75, fill: "currentColor", ...props });
|
|
3332
3409
|
var DefaultCloseIcon = ({
|
|
3333
3410
|
className,
|
|
3334
3411
|
...props
|
|
3335
|
-
}) => /* @__PURE__ */ (0,
|
|
3412
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react7.X, { className: cn("h-6 w-6", className), strokeWidth: 1.75, ...props });
|
|
3336
3413
|
DefaultOpenIcon.displayName = "CopilotChatToggleButton.OpenIcon";
|
|
3337
3414
|
DefaultCloseIcon.displayName = "CopilotChatToggleButton.CloseIcon";
|
|
3338
3415
|
var ICON_TRANSITION_STYLE = Object.freeze({
|
|
@@ -3349,11 +3426,11 @@ var BUTTON_BASE_CLASSES = cn(
|
|
|
3349
3426
|
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-background",
|
|
3350
3427
|
"disabled:pointer-events-none disabled:opacity-60"
|
|
3351
3428
|
);
|
|
3352
|
-
var CopilotChatToggleButton =
|
|
3429
|
+
var CopilotChatToggleButton = import_react24.default.forwardRef(function CopilotChatToggleButton2({ openIcon, closeIcon, className, ...buttonProps }, ref) {
|
|
3353
3430
|
const { onClick, type, disabled, ...restProps } = buttonProps;
|
|
3354
3431
|
const configuration = useCopilotChatConfiguration();
|
|
3355
3432
|
const labels = configuration?.labels ?? CopilotChatDefaultLabels;
|
|
3356
|
-
const [fallbackOpen, setFallbackOpen] = (0,
|
|
3433
|
+
const [fallbackOpen, setFallbackOpen] = (0, import_react24.useState)(false);
|
|
3357
3434
|
const isOpen = configuration?.isModalOpen ?? fallbackOpen;
|
|
3358
3435
|
const setModalOpen = configuration?.setModalOpen ?? setFallbackOpen;
|
|
3359
3436
|
const handleClick = (event) => {
|
|
@@ -3387,7 +3464,7 @@ var CopilotChatToggleButton = import_react23.default.forwardRef(function Copilot
|
|
|
3387
3464
|
focusable: false
|
|
3388
3465
|
}
|
|
3389
3466
|
);
|
|
3390
|
-
const openIconElement = /* @__PURE__ */ (0,
|
|
3467
|
+
const openIconElement = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
3391
3468
|
"span",
|
|
3392
3469
|
{
|
|
3393
3470
|
"aria-hidden": "true",
|
|
@@ -3401,7 +3478,7 @@ var CopilotChatToggleButton = import_react23.default.forwardRef(function Copilot
|
|
|
3401
3478
|
children: renderedOpenIcon
|
|
3402
3479
|
}
|
|
3403
3480
|
);
|
|
3404
|
-
const closeIconElement = /* @__PURE__ */ (0,
|
|
3481
|
+
const closeIconElement = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
3405
3482
|
"span",
|
|
3406
3483
|
{
|
|
3407
3484
|
"aria-hidden": "true",
|
|
@@ -3415,7 +3492,7 @@ var CopilotChatToggleButton = import_react23.default.forwardRef(function Copilot
|
|
|
3415
3492
|
children: renderedCloseIcon
|
|
3416
3493
|
}
|
|
3417
3494
|
);
|
|
3418
|
-
return /* @__PURE__ */ (0,
|
|
3495
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
3419
3496
|
"button",
|
|
3420
3497
|
{
|
|
3421
3498
|
ref,
|
|
@@ -3439,12 +3516,12 @@ CopilotChatToggleButton.displayName = "CopilotChatToggleButton";
|
|
|
3439
3516
|
var CopilotChatToggleButton_default = CopilotChatToggleButton;
|
|
3440
3517
|
|
|
3441
3518
|
// src/components/chat/CopilotSidebarView.tsx
|
|
3442
|
-
var
|
|
3519
|
+
var import_react26 = require("react");
|
|
3443
3520
|
|
|
3444
3521
|
// src/components/chat/CopilotModalHeader.tsx
|
|
3445
|
-
var
|
|
3522
|
+
var import_react25 = require("react");
|
|
3446
3523
|
var import_lucide_react8 = require("lucide-react");
|
|
3447
|
-
var
|
|
3524
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
3448
3525
|
function CopilotModalHeader({
|
|
3449
3526
|
title,
|
|
3450
3527
|
titleContent,
|
|
@@ -3456,7 +3533,7 @@ function CopilotModalHeader({
|
|
|
3456
3533
|
const configuration = useCopilotChatConfiguration();
|
|
3457
3534
|
const fallbackTitle = configuration?.labels.modalHeaderTitle ?? CopilotChatDefaultLabels.modalHeaderTitle;
|
|
3458
3535
|
const resolvedTitle = title ?? fallbackTitle;
|
|
3459
|
-
const handleClose = (0,
|
|
3536
|
+
const handleClose = (0, import_react25.useCallback)(() => {
|
|
3460
3537
|
configuration?.setModalOpen(false);
|
|
3461
3538
|
}, [configuration]);
|
|
3462
3539
|
const BoundTitle = renderSlot(titleContent, CopilotModalHeader.Title, {
|
|
@@ -3473,7 +3550,7 @@ function CopilotModalHeader({
|
|
|
3473
3550
|
...rest
|
|
3474
3551
|
});
|
|
3475
3552
|
}
|
|
3476
|
-
return /* @__PURE__ */ (0,
|
|
3553
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
3477
3554
|
"header",
|
|
3478
3555
|
{
|
|
3479
3556
|
"data-slot": "copilot-modal-header",
|
|
@@ -3483,17 +3560,17 @@ function CopilotModalHeader({
|
|
|
3483
3560
|
className
|
|
3484
3561
|
),
|
|
3485
3562
|
...rest,
|
|
3486
|
-
children: /* @__PURE__ */ (0,
|
|
3487
|
-
/* @__PURE__ */ (0,
|
|
3488
|
-
/* @__PURE__ */ (0,
|
|
3489
|
-
/* @__PURE__ */ (0,
|
|
3563
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex w-full items-center gap-2", children: [
|
|
3564
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1", "aria-hidden": "true" }),
|
|
3565
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex flex-1 justify-center text-center", children: BoundTitle }),
|
|
3566
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex flex-1 justify-end", children: BoundCloseButton })
|
|
3490
3567
|
] })
|
|
3491
3568
|
}
|
|
3492
3569
|
);
|
|
3493
3570
|
}
|
|
3494
3571
|
CopilotModalHeader.displayName = "CopilotModalHeader";
|
|
3495
3572
|
((CopilotModalHeader2) => {
|
|
3496
|
-
CopilotModalHeader2.Title = ({ children, className, ...props }) => /* @__PURE__ */ (0,
|
|
3573
|
+
CopilotModalHeader2.Title = ({ children, className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
3497
3574
|
"div",
|
|
3498
3575
|
{
|
|
3499
3576
|
className: cn(
|
|
@@ -3507,7 +3584,7 @@ CopilotModalHeader.displayName = "CopilotModalHeader";
|
|
|
3507
3584
|
CopilotModalHeader2.CloseButton = ({
|
|
3508
3585
|
className,
|
|
3509
3586
|
...props
|
|
3510
|
-
}) => /* @__PURE__ */ (0,
|
|
3587
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
3511
3588
|
"button",
|
|
3512
3589
|
{
|
|
3513
3590
|
type: "button",
|
|
@@ -3518,7 +3595,7 @@ CopilotModalHeader.displayName = "CopilotModalHeader";
|
|
|
3518
3595
|
),
|
|
3519
3596
|
"aria-label": "Close",
|
|
3520
3597
|
...props,
|
|
3521
|
-
children: /* @__PURE__ */ (0,
|
|
3598
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react8.X, { className: "h-4 w-4", "aria-hidden": "true" })
|
|
3522
3599
|
}
|
|
3523
3600
|
);
|
|
3524
3601
|
})(CopilotModalHeader || (CopilotModalHeader = {}));
|
|
@@ -3526,14 +3603,14 @@ CopilotModalHeader.Title.displayName = "CopilotModalHeader.Title";
|
|
|
3526
3603
|
CopilotModalHeader.CloseButton.displayName = "CopilotModalHeader.CloseButton";
|
|
3527
3604
|
|
|
3528
3605
|
// src/components/chat/CopilotSidebarView.tsx
|
|
3529
|
-
var
|
|
3606
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
3530
3607
|
var DEFAULT_SIDEBAR_WIDTH = 480;
|
|
3531
3608
|
var SIDEBAR_TRANSITION_MS = 260;
|
|
3532
3609
|
function CopilotSidebarView({ header, width, ...props }) {
|
|
3533
3610
|
const configuration = useCopilotChatConfiguration();
|
|
3534
3611
|
const isSidebarOpen = configuration?.isModalOpen ?? false;
|
|
3535
|
-
const sidebarRef = (0,
|
|
3536
|
-
const [sidebarWidth, setSidebarWidth] = (0,
|
|
3612
|
+
const sidebarRef = (0, import_react26.useRef)(null);
|
|
3613
|
+
const [sidebarWidth, setSidebarWidth] = (0, import_react26.useState)(width ?? DEFAULT_SIDEBAR_WIDTH);
|
|
3537
3614
|
const widthToCss = (w) => {
|
|
3538
3615
|
return typeof w === "number" ? `${w}px` : w;
|
|
3539
3616
|
};
|
|
@@ -3543,7 +3620,7 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3543
3620
|
}
|
|
3544
3621
|
return w;
|
|
3545
3622
|
};
|
|
3546
|
-
(0,
|
|
3623
|
+
(0, import_react26.useEffect)(() => {
|
|
3547
3624
|
if (width !== void 0) {
|
|
3548
3625
|
return;
|
|
3549
3626
|
}
|
|
@@ -3570,8 +3647,8 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3570
3647
|
return () => window.removeEventListener("resize", updateWidth);
|
|
3571
3648
|
}, [width]);
|
|
3572
3649
|
const headerElement = renderSlot(header, CopilotModalHeader, {});
|
|
3573
|
-
return /* @__PURE__ */ (0,
|
|
3574
|
-
isSidebarOpen && /* @__PURE__ */ (0,
|
|
3650
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
|
|
3651
|
+
isSidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
3575
3652
|
"style",
|
|
3576
3653
|
{
|
|
3577
3654
|
dangerouslySetInnerHTML: {
|
|
@@ -3585,8 +3662,8 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3585
3662
|
}
|
|
3586
3663
|
}
|
|
3587
3664
|
),
|
|
3588
|
-
/* @__PURE__ */ (0,
|
|
3589
|
-
/* @__PURE__ */ (0,
|
|
3665
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CopilotChatToggleButton_default, {}),
|
|
3666
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
3590
3667
|
"aside",
|
|
3591
3668
|
{
|
|
3592
3669
|
ref: sidebarRef,
|
|
@@ -3611,9 +3688,9 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3611
3688
|
"aria-hidden": !isSidebarOpen,
|
|
3612
3689
|
"aria-label": "Copilot chat sidebar",
|
|
3613
3690
|
role: "complementary",
|
|
3614
|
-
children: /* @__PURE__ */ (0,
|
|
3691
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex h-full w-full flex-col overflow-hidden", children: [
|
|
3615
3692
|
headerElement,
|
|
3616
|
-
/* @__PURE__ */ (0,
|
|
3693
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex-1 overflow-hidden", "data-sidebar-chat": true, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CopilotChatView_default, { ...props }) })
|
|
3617
3694
|
] })
|
|
3618
3695
|
}
|
|
3619
3696
|
)
|
|
@@ -3622,8 +3699,8 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3622
3699
|
CopilotSidebarView.displayName = "CopilotSidebarView";
|
|
3623
3700
|
|
|
3624
3701
|
// src/components/chat/CopilotPopupView.tsx
|
|
3625
|
-
var
|
|
3626
|
-
var
|
|
3702
|
+
var import_react27 = require("react");
|
|
3703
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
3627
3704
|
var DEFAULT_POPUP_WIDTH = 420;
|
|
3628
3705
|
var DEFAULT_POPUP_HEIGHT = 560;
|
|
3629
3706
|
var dimensionToCss = (value, fallback) => {
|
|
@@ -3647,10 +3724,10 @@ function CopilotPopupView({
|
|
|
3647
3724
|
const isPopupOpen = configuration?.isModalOpen ?? false;
|
|
3648
3725
|
const setModalOpen = configuration?.setModalOpen;
|
|
3649
3726
|
const labels = configuration?.labels ?? CopilotChatDefaultLabels;
|
|
3650
|
-
const containerRef = (0,
|
|
3651
|
-
const [isRendered, setIsRendered] = (0,
|
|
3652
|
-
const [isAnimatingOut, setIsAnimatingOut] = (0,
|
|
3653
|
-
(0,
|
|
3727
|
+
const containerRef = (0, import_react27.useRef)(null);
|
|
3728
|
+
const [isRendered, setIsRendered] = (0, import_react27.useState)(isPopupOpen);
|
|
3729
|
+
const [isAnimatingOut, setIsAnimatingOut] = (0, import_react27.useState)(false);
|
|
3730
|
+
(0, import_react27.useEffect)(() => {
|
|
3654
3731
|
if (isPopupOpen) {
|
|
3655
3732
|
setIsRendered(true);
|
|
3656
3733
|
setIsAnimatingOut(false);
|
|
@@ -3666,7 +3743,7 @@ function CopilotPopupView({
|
|
|
3666
3743
|
}, 200);
|
|
3667
3744
|
return () => clearTimeout(timeout);
|
|
3668
3745
|
}, [isPopupOpen, isRendered]);
|
|
3669
|
-
(0,
|
|
3746
|
+
(0, import_react27.useEffect)(() => {
|
|
3670
3747
|
if (!isPopupOpen) {
|
|
3671
3748
|
return;
|
|
3672
3749
|
}
|
|
@@ -3682,7 +3759,7 @@ function CopilotPopupView({
|
|
|
3682
3759
|
window.addEventListener("keydown", handleKeyDown);
|
|
3683
3760
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
3684
3761
|
}, [isPopupOpen, setModalOpen]);
|
|
3685
|
-
(0,
|
|
3762
|
+
(0, import_react27.useEffect)(() => {
|
|
3686
3763
|
if (!isPopupOpen) {
|
|
3687
3764
|
return;
|
|
3688
3765
|
}
|
|
@@ -3691,7 +3768,7 @@ function CopilotPopupView({
|
|
|
3691
3768
|
}, 200);
|
|
3692
3769
|
return () => clearTimeout(focusTimer);
|
|
3693
3770
|
}, [isPopupOpen]);
|
|
3694
|
-
(0,
|
|
3771
|
+
(0, import_react27.useEffect)(() => {
|
|
3695
3772
|
if (!isPopupOpen || !clickOutsideToClose) {
|
|
3696
3773
|
return;
|
|
3697
3774
|
}
|
|
@@ -3716,10 +3793,10 @@ function CopilotPopupView({
|
|
|
3716
3793
|
document.addEventListener("pointerdown", handlePointerDown);
|
|
3717
3794
|
return () => document.removeEventListener("pointerdown", handlePointerDown);
|
|
3718
3795
|
}, [isPopupOpen, clickOutsideToClose, setModalOpen]);
|
|
3719
|
-
const headerElement = (0,
|
|
3796
|
+
const headerElement = (0, import_react27.useMemo)(() => renderSlot(header, CopilotModalHeader, {}), [header]);
|
|
3720
3797
|
const resolvedWidth = dimensionToCss(width, DEFAULT_POPUP_WIDTH);
|
|
3721
3798
|
const resolvedHeight = dimensionToCss(height, DEFAULT_POPUP_HEIGHT);
|
|
3722
|
-
const popupStyle = (0,
|
|
3799
|
+
const popupStyle = (0, import_react27.useMemo)(
|
|
3723
3800
|
() => ({
|
|
3724
3801
|
"--copilot-popup-width": resolvedWidth,
|
|
3725
3802
|
"--copilot-popup-height": resolvedHeight,
|
|
@@ -3733,14 +3810,14 @@ function CopilotPopupView({
|
|
|
3733
3810
|
[resolvedHeight, resolvedWidth]
|
|
3734
3811
|
);
|
|
3735
3812
|
const popupAnimationClass = isPopupOpen && !isAnimatingOut ? "pointer-events-auto translate-y-0 opacity-100 md:scale-100" : "pointer-events-none translate-y-4 opacity-0 md:translate-y-5 md:scale-[0.95]";
|
|
3736
|
-
const popupContent = isRendered ? /* @__PURE__ */ (0,
|
|
3813
|
+
const popupContent = isRendered ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
3737
3814
|
"div",
|
|
3738
3815
|
{
|
|
3739
3816
|
className: cn(
|
|
3740
3817
|
"fixed inset-0 z-[1200] flex max-w-full flex-col items-stretch",
|
|
3741
3818
|
"md:inset-auto md:bottom-24 md:right-6 md:items-end md:gap-4"
|
|
3742
3819
|
),
|
|
3743
|
-
children: /* @__PURE__ */ (0,
|
|
3820
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
|
|
3744
3821
|
"div",
|
|
3745
3822
|
{
|
|
3746
3823
|
ref: containerRef,
|
|
@@ -3761,7 +3838,7 @@ function CopilotPopupView({
|
|
|
3761
3838
|
style: popupStyle,
|
|
3762
3839
|
children: [
|
|
3763
3840
|
headerElement,
|
|
3764
|
-
/* @__PURE__ */ (0,
|
|
3841
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex-1 overflow-hidden", "data-popup-chat": true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
3765
3842
|
CopilotChatView_default,
|
|
3766
3843
|
{
|
|
3767
3844
|
...restProps,
|
|
@@ -3773,21 +3850,21 @@ function CopilotPopupView({
|
|
|
3773
3850
|
)
|
|
3774
3851
|
}
|
|
3775
3852
|
) : null;
|
|
3776
|
-
return /* @__PURE__ */ (0,
|
|
3777
|
-
/* @__PURE__ */ (0,
|
|
3853
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
|
|
3854
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CopilotChatToggleButton_default, {}),
|
|
3778
3855
|
popupContent
|
|
3779
3856
|
] });
|
|
3780
3857
|
}
|
|
3781
3858
|
CopilotPopupView.displayName = "CopilotPopupView";
|
|
3782
3859
|
|
|
3783
3860
|
// src/components/chat/CopilotSidebar.tsx
|
|
3784
|
-
var
|
|
3785
|
-
var
|
|
3861
|
+
var import_react28 = require("react");
|
|
3862
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
3786
3863
|
function CopilotSidebar({ header, defaultOpen, width, ...chatProps }) {
|
|
3787
|
-
const SidebarViewOverride = (0,
|
|
3864
|
+
const SidebarViewOverride = (0, import_react28.useMemo)(() => {
|
|
3788
3865
|
const Component = (viewProps) => {
|
|
3789
3866
|
const { header: viewHeader, width: viewWidth, ...restProps } = viewProps;
|
|
3790
|
-
return /* @__PURE__ */ (0,
|
|
3867
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3791
3868
|
CopilotSidebarView,
|
|
3792
3869
|
{
|
|
3793
3870
|
...restProps,
|
|
@@ -3798,7 +3875,7 @@ function CopilotSidebar({ header, defaultOpen, width, ...chatProps }) {
|
|
|
3798
3875
|
};
|
|
3799
3876
|
return Object.assign(Component, CopilotChatView_default);
|
|
3800
3877
|
}, [header, width]);
|
|
3801
|
-
return /* @__PURE__ */ (0,
|
|
3878
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3802
3879
|
CopilotChat,
|
|
3803
3880
|
{
|
|
3804
3881
|
...chatProps,
|
|
@@ -3810,8 +3887,8 @@ function CopilotSidebar({ header, defaultOpen, width, ...chatProps }) {
|
|
|
3810
3887
|
CopilotSidebar.displayName = "CopilotSidebar";
|
|
3811
3888
|
|
|
3812
3889
|
// src/components/chat/CopilotPopup.tsx
|
|
3813
|
-
var
|
|
3814
|
-
var
|
|
3890
|
+
var import_react29 = require("react");
|
|
3891
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
3815
3892
|
function CopilotPopup({
|
|
3816
3893
|
header,
|
|
3817
3894
|
defaultOpen,
|
|
@@ -3820,7 +3897,7 @@ function CopilotPopup({
|
|
|
3820
3897
|
clickOutsideToClose,
|
|
3821
3898
|
...chatProps
|
|
3822
3899
|
}) {
|
|
3823
|
-
const PopupViewOverride = (0,
|
|
3900
|
+
const PopupViewOverride = (0, import_react29.useMemo)(() => {
|
|
3824
3901
|
const Component = (viewProps) => {
|
|
3825
3902
|
const {
|
|
3826
3903
|
header: viewHeader,
|
|
@@ -3829,7 +3906,7 @@ function CopilotPopup({
|
|
|
3829
3906
|
clickOutsideToClose: viewClickOutsideToClose,
|
|
3830
3907
|
...restProps
|
|
3831
3908
|
} = viewProps;
|
|
3832
|
-
return /* @__PURE__ */ (0,
|
|
3909
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3833
3910
|
CopilotPopupView,
|
|
3834
3911
|
{
|
|
3835
3912
|
...restProps,
|
|
@@ -3842,7 +3919,7 @@ function CopilotPopup({
|
|
|
3842
3919
|
};
|
|
3843
3920
|
return Object.assign(Component, CopilotChatView_default);
|
|
3844
3921
|
}, [clickOutsideToClose, header, height, width]);
|
|
3845
|
-
return /* @__PURE__ */ (0,
|
|
3922
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3846
3923
|
CopilotChat,
|
|
3847
3924
|
{
|
|
3848
3925
|
...chatProps,
|
|
@@ -3866,25 +3943,25 @@ function defineToolCallRenderer(def) {
|
|
|
3866
3943
|
}
|
|
3867
3944
|
|
|
3868
3945
|
// src/components/WildcardToolCallRender.tsx
|
|
3869
|
-
var
|
|
3870
|
-
var
|
|
3946
|
+
var import_react30 = require("react");
|
|
3947
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
3871
3948
|
var WildcardToolCallRender = defineToolCallRenderer({
|
|
3872
3949
|
name: "*",
|
|
3873
3950
|
render: ({ args, result, name, status }) => {
|
|
3874
|
-
const [isExpanded, setIsExpanded] = (0,
|
|
3951
|
+
const [isExpanded, setIsExpanded] = (0, import_react30.useState)(false);
|
|
3875
3952
|
const statusString = String(status);
|
|
3876
3953
|
const isActive = statusString === "inProgress" || statusString === "executing";
|
|
3877
3954
|
const isComplete = statusString === "complete";
|
|
3878
3955
|
const statusStyles = isActive ? "bg-amber-100 text-amber-800 dark:bg-amber-500/15 dark:text-amber-400" : isComplete ? "bg-emerald-100 text-emerald-800 dark:bg-emerald-500/15 dark:text-emerald-400" : "bg-zinc-100 text-zinc-800 dark:bg-zinc-700/40 dark:text-zinc-300";
|
|
3879
|
-
return /* @__PURE__ */ (0,
|
|
3880
|
-
/* @__PURE__ */ (0,
|
|
3956
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "mt-2 pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "rounded-xl border border-zinc-200/60 dark:border-zinc-800/60 bg-white/70 dark:bg-zinc-900/50 shadow-sm backdrop-blur p-4", children: [
|
|
3957
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
3881
3958
|
"div",
|
|
3882
3959
|
{
|
|
3883
3960
|
className: "flex items-center justify-between gap-3 cursor-pointer",
|
|
3884
3961
|
onClick: () => setIsExpanded(!isExpanded),
|
|
3885
3962
|
children: [
|
|
3886
|
-
/* @__PURE__ */ (0,
|
|
3887
|
-
/* @__PURE__ */ (0,
|
|
3963
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex items-center gap-2 min-w-0", children: [
|
|
3964
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3888
3965
|
"svg",
|
|
3889
3966
|
{
|
|
3890
3967
|
className: `h-4 w-4 text-zinc-500 dark:text-zinc-400 transition-transform ${isExpanded ? "rotate-90" : ""}`,
|
|
@@ -3892,7 +3969,7 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3892
3969
|
viewBox: "0 0 24 24",
|
|
3893
3970
|
strokeWidth: 2,
|
|
3894
3971
|
stroke: "currentColor",
|
|
3895
|
-
children: /* @__PURE__ */ (0,
|
|
3972
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3896
3973
|
"path",
|
|
3897
3974
|
{
|
|
3898
3975
|
strokeLinecap: "round",
|
|
@@ -3902,10 +3979,10 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3902
3979
|
)
|
|
3903
3980
|
}
|
|
3904
3981
|
),
|
|
3905
|
-
/* @__PURE__ */ (0,
|
|
3906
|
-
/* @__PURE__ */ (0,
|
|
3982
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "inline-block h-2 w-2 rounded-full bg-blue-500" }),
|
|
3983
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "truncate text-sm font-medium text-zinc-900 dark:text-zinc-100", children: name })
|
|
3907
3984
|
] }),
|
|
3908
|
-
/* @__PURE__ */ (0,
|
|
3985
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3909
3986
|
"span",
|
|
3910
3987
|
{
|
|
3911
3988
|
className: `inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ${statusStyles}`,
|
|
@@ -3915,14 +3992,14 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3915
3992
|
]
|
|
3916
3993
|
}
|
|
3917
3994
|
),
|
|
3918
|
-
isExpanded && /* @__PURE__ */ (0,
|
|
3919
|
-
/* @__PURE__ */ (0,
|
|
3920
|
-
/* @__PURE__ */ (0,
|
|
3921
|
-
/* @__PURE__ */ (0,
|
|
3995
|
+
isExpanded && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "mt-3 grid gap-4", children: [
|
|
3996
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { children: [
|
|
3997
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "text-xs uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: "Arguments" }),
|
|
3998
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("pre", { className: "mt-2 max-h-64 overflow-auto rounded-md bg-zinc-50 dark:bg-zinc-800/60 p-3 text-xs leading-relaxed text-zinc-800 dark:text-zinc-200 whitespace-pre-wrap break-words", children: JSON.stringify(args ?? {}, null, 2) })
|
|
3922
3999
|
] }),
|
|
3923
|
-
result !== void 0 && /* @__PURE__ */ (0,
|
|
3924
|
-
/* @__PURE__ */ (0,
|
|
3925
|
-
/* @__PURE__ */ (0,
|
|
4000
|
+
result !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { children: [
|
|
4001
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "text-xs uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: "Result" }),
|
|
4002
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("pre", { className: "mt-2 max-h-64 overflow-auto rounded-md bg-zinc-50 dark:bg-zinc-800/60 p-3 text-xs leading-relaxed text-zinc-800 dark:text-zinc-200 whitespace-pre-wrap break-words", children: typeof result === "string" ? result : JSON.stringify(result, null, 2) })
|
|
3926
4003
|
] })
|
|
3927
4004
|
] })
|
|
3928
4005
|
] }) });
|
|
@@ -3962,6 +4039,7 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3962
4039
|
useCopilotKit,
|
|
3963
4040
|
useFrontendTool,
|
|
3964
4041
|
useHumanInTheLoop,
|
|
4042
|
+
useRenderActivityMessage,
|
|
3965
4043
|
useRenderCustomMessages,
|
|
3966
4044
|
useRenderToolCall,
|
|
3967
4045
|
useSuggestions
|