@copilotkitnext/react 0.0.18 → 0.0.19-alpha.1
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 +32 -2
- package/dist/index.d.ts +32 -2
- package/dist/index.js +321 -238
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +218 -136
- package/dist/index.mjs.map +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,6 +1502,7 @@ 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,
|
|
@@ -1536,6 +1543,10 @@ var CopilotKitProvider = ({
|
|
|
1536
1543
|
renderCustomMessages,
|
|
1537
1544
|
"renderCustomMessages must be a stable array."
|
|
1538
1545
|
);
|
|
1546
|
+
const renderActivityMessagesList = useStableArrayProp(
|
|
1547
|
+
renderActivityMessages,
|
|
1548
|
+
"renderActivityMessages must be a stable array."
|
|
1549
|
+
);
|
|
1539
1550
|
const frontendToolsList = useStableArrayProp(
|
|
1540
1551
|
frontendTools,
|
|
1541
1552
|
"frontendTools must be a stable array. If you want to dynamically add or remove tools, use `useFrontendTool` instead."
|
|
@@ -1604,10 +1615,11 @@ var CopilotKitProvider = ({
|
|
|
1604
1615
|
agents__unsafe_dev_only: agents,
|
|
1605
1616
|
tools: allTools,
|
|
1606
1617
|
renderToolCalls: allRenderToolCalls,
|
|
1618
|
+
renderActivityMessages: renderActivityMessagesList,
|
|
1607
1619
|
renderCustomMessages: renderCustomMessagesList
|
|
1608
1620
|
});
|
|
1609
1621
|
return copilotkit2;
|
|
1610
|
-
}, [allTools, allRenderToolCalls, renderCustomMessagesList]);
|
|
1622
|
+
}, [allTools, allRenderToolCalls, renderActivityMessagesList, renderCustomMessagesList]);
|
|
1611
1623
|
const [, forceUpdate] = (0, import_react6.useReducer)((x) => x + 1, 0);
|
|
1612
1624
|
(0, import_react6.useEffect)(() => {
|
|
1613
1625
|
const unsubscribe = copilotkit.subscribe({
|
|
@@ -1809,11 +1821,57 @@ function useRenderCustomMessages() {
|
|
|
1809
1821
|
};
|
|
1810
1822
|
}
|
|
1811
1823
|
|
|
1812
|
-
// src/hooks/use-
|
|
1824
|
+
// src/hooks/use-render-activity-message.tsx
|
|
1825
|
+
var import_shared4 = require("@copilotkitnext/shared");
|
|
1813
1826
|
var import_react8 = require("react");
|
|
1827
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
1828
|
+
function useRenderActivityMessage() {
|
|
1829
|
+
const { copilotkit } = useCopilotKit();
|
|
1830
|
+
const config = useCopilotChatConfiguration();
|
|
1831
|
+
const agentId = config?.agentId ?? import_shared4.DEFAULT_AGENT_ID;
|
|
1832
|
+
const renderers = copilotkit.renderActivityMessages;
|
|
1833
|
+
return (0, import_react8.useCallback)(
|
|
1834
|
+
(message) => {
|
|
1835
|
+
if (!renderers.length) {
|
|
1836
|
+
return null;
|
|
1837
|
+
}
|
|
1838
|
+
const matches = renderers.filter(
|
|
1839
|
+
(renderer2) => renderer2.activityType === message.activityType
|
|
1840
|
+
);
|
|
1841
|
+
const renderer = matches.find((candidate) => candidate.agentId === agentId) ?? matches.find((candidate) => candidate.agentId === void 0) ?? renderers.find((candidate) => candidate.activityType === "*");
|
|
1842
|
+
if (!renderer) {
|
|
1843
|
+
return null;
|
|
1844
|
+
}
|
|
1845
|
+
const parseResult = renderer.content.safeParse(message.content);
|
|
1846
|
+
if (!parseResult.success) {
|
|
1847
|
+
console.warn(
|
|
1848
|
+
`Failed to parse content for activity message '${message.activityType}':`,
|
|
1849
|
+
parseResult.error
|
|
1850
|
+
);
|
|
1851
|
+
return null;
|
|
1852
|
+
}
|
|
1853
|
+
const Component = renderer.render;
|
|
1854
|
+
const agent = copilotkit.getAgent(agentId);
|
|
1855
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
1856
|
+
Component,
|
|
1857
|
+
{
|
|
1858
|
+
activityType: message.activityType,
|
|
1859
|
+
content: parseResult.data,
|
|
1860
|
+
message,
|
|
1861
|
+
agent
|
|
1862
|
+
},
|
|
1863
|
+
message.id
|
|
1864
|
+
);
|
|
1865
|
+
},
|
|
1866
|
+
[agentId, copilotkit, renderers]
|
|
1867
|
+
);
|
|
1868
|
+
}
|
|
1869
|
+
|
|
1870
|
+
// src/hooks/use-frontend-tool.tsx
|
|
1871
|
+
var import_react9 = require("react");
|
|
1814
1872
|
function useFrontendTool(tool) {
|
|
1815
1873
|
const { copilotkit } = useCopilotKit();
|
|
1816
|
-
(0,
|
|
1874
|
+
(0, import_react9.useEffect)(() => {
|
|
1817
1875
|
const name = tool.name;
|
|
1818
1876
|
if (copilotkit.getTool({ toolName: name, agentId: tool.agentId })) {
|
|
1819
1877
|
console.warn(
|
|
@@ -1845,30 +1903,30 @@ function useFrontendTool(tool) {
|
|
|
1845
1903
|
}
|
|
1846
1904
|
|
|
1847
1905
|
// src/hooks/use-human-in-the-loop.tsx
|
|
1848
|
-
var
|
|
1849
|
-
var
|
|
1906
|
+
var import_react10 = require("react");
|
|
1907
|
+
var import_react11 = __toESM(require("react"));
|
|
1850
1908
|
function useHumanInTheLoop(tool) {
|
|
1851
1909
|
const { copilotkit } = useCopilotKit();
|
|
1852
|
-
const [status, setStatus] = (0,
|
|
1910
|
+
const [status, setStatus] = (0, import_react10.useState)(
|
|
1853
1911
|
"inProgress"
|
|
1854
1912
|
);
|
|
1855
|
-
const statusRef = (0,
|
|
1856
|
-
const resolvePromiseRef = (0,
|
|
1913
|
+
const statusRef = (0, import_react10.useRef)(status);
|
|
1914
|
+
const resolvePromiseRef = (0, import_react10.useRef)(null);
|
|
1857
1915
|
statusRef.current = status;
|
|
1858
|
-
const respond = (0,
|
|
1916
|
+
const respond = (0, import_react10.useCallback)(async (result) => {
|
|
1859
1917
|
if (resolvePromiseRef.current) {
|
|
1860
1918
|
resolvePromiseRef.current(result);
|
|
1861
1919
|
setStatus("complete");
|
|
1862
1920
|
resolvePromiseRef.current = null;
|
|
1863
1921
|
}
|
|
1864
1922
|
}, []);
|
|
1865
|
-
const handler = (0,
|
|
1923
|
+
const handler = (0, import_react10.useCallback)(async () => {
|
|
1866
1924
|
return new Promise((resolve) => {
|
|
1867
1925
|
setStatus("executing");
|
|
1868
1926
|
resolvePromiseRef.current = resolve;
|
|
1869
1927
|
});
|
|
1870
1928
|
}, []);
|
|
1871
|
-
const RenderComponent = (0,
|
|
1929
|
+
const RenderComponent = (0, import_react10.useCallback)(
|
|
1872
1930
|
(props) => {
|
|
1873
1931
|
const ToolComponent = tool.render;
|
|
1874
1932
|
const currentStatus = statusRef.current;
|
|
@@ -1879,7 +1937,7 @@ function useHumanInTheLoop(tool) {
|
|
|
1879
1937
|
description: tool.description || "",
|
|
1880
1938
|
respond: void 0
|
|
1881
1939
|
};
|
|
1882
|
-
return
|
|
1940
|
+
return import_react11.default.createElement(ToolComponent, enhancedProps);
|
|
1883
1941
|
} else if (currentStatus === "executing" && props.status === "executing") {
|
|
1884
1942
|
const enhancedProps = {
|
|
1885
1943
|
...props,
|
|
@@ -1887,7 +1945,7 @@ function useHumanInTheLoop(tool) {
|
|
|
1887
1945
|
description: tool.description || "",
|
|
1888
1946
|
respond
|
|
1889
1947
|
};
|
|
1890
|
-
return
|
|
1948
|
+
return import_react11.default.createElement(ToolComponent, enhancedProps);
|
|
1891
1949
|
} else if (currentStatus === "complete" && props.status === "complete") {
|
|
1892
1950
|
const enhancedProps = {
|
|
1893
1951
|
...props,
|
|
@@ -1895,9 +1953,9 @@ function useHumanInTheLoop(tool) {
|
|
|
1895
1953
|
description: tool.description || "",
|
|
1896
1954
|
respond: void 0
|
|
1897
1955
|
};
|
|
1898
|
-
return
|
|
1956
|
+
return import_react11.default.createElement(ToolComponent, enhancedProps);
|
|
1899
1957
|
}
|
|
1900
|
-
return
|
|
1958
|
+
return import_react11.default.createElement(ToolComponent, props);
|
|
1901
1959
|
},
|
|
1902
1960
|
[tool.render, tool.name, tool.description, respond]
|
|
1903
1961
|
);
|
|
@@ -1907,7 +1965,7 @@ function useHumanInTheLoop(tool) {
|
|
|
1907
1965
|
render: RenderComponent
|
|
1908
1966
|
};
|
|
1909
1967
|
useFrontendTool(frontendTool);
|
|
1910
|
-
(0,
|
|
1968
|
+
(0, import_react10.useEffect)(() => {
|
|
1911
1969
|
return () => {
|
|
1912
1970
|
const keyOf = (rc) => `${rc.agentId ?? ""}:${rc.name}`;
|
|
1913
1971
|
const currentRenderToolCalls = copilotkit.renderToolCalls;
|
|
@@ -1920,22 +1978,22 @@ function useHumanInTheLoop(tool) {
|
|
|
1920
1978
|
}
|
|
1921
1979
|
|
|
1922
1980
|
// src/hooks/use-agent.tsx
|
|
1923
|
-
var
|
|
1924
|
-
var
|
|
1981
|
+
var import_react12 = require("react");
|
|
1982
|
+
var import_shared5 = require("@copilotkitnext/shared");
|
|
1925
1983
|
var ALL_UPDATES = [
|
|
1926
1984
|
"OnMessagesChanged" /* OnMessagesChanged */,
|
|
1927
1985
|
"OnStateChanged" /* OnStateChanged */,
|
|
1928
1986
|
"OnRunStatusChanged" /* OnRunStatusChanged */
|
|
1929
1987
|
];
|
|
1930
1988
|
function useAgent({ agentId, updates } = {}) {
|
|
1931
|
-
agentId ??=
|
|
1989
|
+
agentId ??= import_shared5.DEFAULT_AGENT_ID;
|
|
1932
1990
|
const { copilotkit } = useCopilotKit();
|
|
1933
|
-
const [, forceUpdate] = (0,
|
|
1934
|
-
const updateFlags = (0,
|
|
1991
|
+
const [, forceUpdate] = (0, import_react12.useReducer)((x) => x + 1, 0);
|
|
1992
|
+
const updateFlags = (0, import_react12.useMemo)(
|
|
1935
1993
|
() => updates ?? ALL_UPDATES,
|
|
1936
1994
|
[JSON.stringify(updates)]
|
|
1937
1995
|
);
|
|
1938
|
-
const agent = (0,
|
|
1996
|
+
const agent = (0, import_react12.useMemo)(() => {
|
|
1939
1997
|
return copilotkit.getAgent(agentId);
|
|
1940
1998
|
}, [
|
|
1941
1999
|
agentId,
|
|
@@ -1943,7 +2001,7 @@ function useAgent({ agentId, updates } = {}) {
|
|
|
1943
2001
|
copilotkit.runtimeConnectionStatus,
|
|
1944
2002
|
copilotkit
|
|
1945
2003
|
]);
|
|
1946
|
-
(0,
|
|
2004
|
+
(0, import_react12.useEffect)(() => {
|
|
1947
2005
|
if (!agent) {
|
|
1948
2006
|
return;
|
|
1949
2007
|
}
|
|
@@ -1981,11 +2039,11 @@ function useAgent({ agentId, updates } = {}) {
|
|
|
1981
2039
|
}
|
|
1982
2040
|
|
|
1983
2041
|
// src/hooks/use-agent-context.tsx
|
|
1984
|
-
var
|
|
2042
|
+
var import_react13 = require("react");
|
|
1985
2043
|
function useAgentContext(context) {
|
|
1986
2044
|
const { description, value } = context;
|
|
1987
2045
|
const { copilotkit } = useCopilotKit();
|
|
1988
|
-
(0,
|
|
2046
|
+
(0, import_react13.useEffect)(() => {
|
|
1989
2047
|
if (!copilotkit) return;
|
|
1990
2048
|
const id = copilotkit.addContext(context);
|
|
1991
2049
|
return () => {
|
|
@@ -1995,26 +2053,26 @@ function useAgentContext(context) {
|
|
|
1995
2053
|
}
|
|
1996
2054
|
|
|
1997
2055
|
// src/hooks/use-suggestions.tsx
|
|
1998
|
-
var
|
|
1999
|
-
var
|
|
2056
|
+
var import_react14 = require("react");
|
|
2057
|
+
var import_shared6 = require("@copilotkitnext/shared");
|
|
2000
2058
|
function useSuggestions({ agentId } = {}) {
|
|
2001
2059
|
const { copilotkit } = useCopilotKit();
|
|
2002
2060
|
const config = useCopilotChatConfiguration();
|
|
2003
|
-
const resolvedAgentId = (0,
|
|
2004
|
-
const [suggestions, setSuggestions] = (0,
|
|
2061
|
+
const resolvedAgentId = (0, import_react14.useMemo)(() => agentId ?? config?.agentId ?? import_shared6.DEFAULT_AGENT_ID, [agentId, config?.agentId]);
|
|
2062
|
+
const [suggestions, setSuggestions] = (0, import_react14.useState)(() => {
|
|
2005
2063
|
const result = copilotkit.getSuggestions(resolvedAgentId);
|
|
2006
2064
|
return result.suggestions;
|
|
2007
2065
|
});
|
|
2008
|
-
const [isLoading, setIsLoading] = (0,
|
|
2066
|
+
const [isLoading, setIsLoading] = (0, import_react14.useState)(() => {
|
|
2009
2067
|
const result = copilotkit.getSuggestions(resolvedAgentId);
|
|
2010
2068
|
return result.isLoading;
|
|
2011
2069
|
});
|
|
2012
|
-
(0,
|
|
2070
|
+
(0, import_react14.useEffect)(() => {
|
|
2013
2071
|
const result = copilotkit.getSuggestions(resolvedAgentId);
|
|
2014
2072
|
setSuggestions(result.suggestions);
|
|
2015
2073
|
setIsLoading(result.isLoading);
|
|
2016
2074
|
}, [copilotkit, resolvedAgentId]);
|
|
2017
|
-
(0,
|
|
2075
|
+
(0, import_react14.useEffect)(() => {
|
|
2018
2076
|
const unsubscribe = copilotkit.subscribe({
|
|
2019
2077
|
onSuggestionsChanged: ({ agentId: changedAgentId, suggestions: suggestions2 }) => {
|
|
2020
2078
|
if (changedAgentId !== resolvedAgentId) {
|
|
@@ -2044,10 +2102,10 @@ function useSuggestions({ agentId } = {}) {
|
|
|
2044
2102
|
unsubscribe();
|
|
2045
2103
|
};
|
|
2046
2104
|
}, [copilotkit, resolvedAgentId]);
|
|
2047
|
-
const reloadSuggestions = (0,
|
|
2105
|
+
const reloadSuggestions = (0, import_react14.useCallback)(() => {
|
|
2048
2106
|
copilotkit.reloadSuggestions(resolvedAgentId);
|
|
2049
2107
|
}, [copilotkit, resolvedAgentId]);
|
|
2050
|
-
const clearSuggestions = (0,
|
|
2108
|
+
const clearSuggestions = (0, import_react14.useCallback)(() => {
|
|
2051
2109
|
copilotkit.clearSuggestions(resolvedAgentId);
|
|
2052
2110
|
}, [copilotkit, resolvedAgentId]);
|
|
2053
2111
|
return {
|
|
@@ -2059,20 +2117,20 @@ function useSuggestions({ agentId } = {}) {
|
|
|
2059
2117
|
}
|
|
2060
2118
|
|
|
2061
2119
|
// src/hooks/use-configure-suggestions.tsx
|
|
2062
|
-
var
|
|
2063
|
-
var
|
|
2120
|
+
var import_react15 = require("react");
|
|
2121
|
+
var import_shared7 = require("@copilotkitnext/shared");
|
|
2064
2122
|
var EMPTY_DEPS = [];
|
|
2065
2123
|
function useConfigureSuggestions(config, options) {
|
|
2066
2124
|
const { copilotkit } = useCopilotKit();
|
|
2067
2125
|
const chatConfig = useCopilotChatConfiguration();
|
|
2068
2126
|
const extraDeps = options?.deps ?? EMPTY_DEPS;
|
|
2069
|
-
const resolvedConsumerAgentId = (0,
|
|
2070
|
-
const rawConsumerAgentId = (0,
|
|
2071
|
-
const normalizationCacheRef = (0,
|
|
2127
|
+
const resolvedConsumerAgentId = (0, import_react15.useMemo)(() => chatConfig?.agentId ?? import_shared7.DEFAULT_AGENT_ID, [chatConfig?.agentId]);
|
|
2128
|
+
const rawConsumerAgentId = (0, import_react15.useMemo)(() => config ? config.consumerAgentId : void 0, [config]);
|
|
2129
|
+
const normalizationCacheRef = (0, import_react15.useRef)({
|
|
2072
2130
|
serialized: null,
|
|
2073
2131
|
config: null
|
|
2074
2132
|
});
|
|
2075
|
-
const { normalizedConfig, serializedConfig } = (0,
|
|
2133
|
+
const { normalizedConfig, serializedConfig } = (0, import_react15.useMemo)(() => {
|
|
2076
2134
|
if (!config) {
|
|
2077
2135
|
normalizationCacheRef.current = { serialized: null, config: null };
|
|
2078
2136
|
return { normalizedConfig: null, serializedConfig: null };
|
|
@@ -2102,10 +2160,10 @@ function useConfigureSuggestions(config, options) {
|
|
|
2102
2160
|
normalizationCacheRef.current = { serialized, config: built };
|
|
2103
2161
|
return { normalizedConfig: built, serializedConfig: serialized };
|
|
2104
2162
|
}, [config, resolvedConsumerAgentId, ...extraDeps]);
|
|
2105
|
-
const latestConfigRef = (0,
|
|
2163
|
+
const latestConfigRef = (0, import_react15.useRef)(null);
|
|
2106
2164
|
latestConfigRef.current = normalizedConfig;
|
|
2107
|
-
const previousSerializedConfigRef = (0,
|
|
2108
|
-
const targetAgentId = (0,
|
|
2165
|
+
const previousSerializedConfigRef = (0, import_react15.useRef)(null);
|
|
2166
|
+
const targetAgentId = (0, import_react15.useMemo)(() => {
|
|
2109
2167
|
if (!normalizedConfig) {
|
|
2110
2168
|
return resolvedConsumerAgentId;
|
|
2111
2169
|
}
|
|
@@ -2116,7 +2174,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2116
2174
|
return consumer;
|
|
2117
2175
|
}, [normalizedConfig, resolvedConsumerAgentId]);
|
|
2118
2176
|
const isGlobalConfig = rawConsumerAgentId === void 0 || rawConsumerAgentId === "*";
|
|
2119
|
-
const requestReload = (0,
|
|
2177
|
+
const requestReload = (0, import_react15.useCallback)(() => {
|
|
2120
2178
|
if (!normalizedConfig) {
|
|
2121
2179
|
return;
|
|
2122
2180
|
}
|
|
@@ -2138,7 +2196,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2138
2196
|
}
|
|
2139
2197
|
copilotkit.reloadSuggestions(targetAgentId);
|
|
2140
2198
|
}, [copilotkit, isGlobalConfig, normalizedConfig, targetAgentId]);
|
|
2141
|
-
(0,
|
|
2199
|
+
(0, import_react15.useEffect)(() => {
|
|
2142
2200
|
if (!serializedConfig || !latestConfigRef.current) {
|
|
2143
2201
|
return;
|
|
2144
2202
|
}
|
|
@@ -2148,7 +2206,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2148
2206
|
copilotkit.removeSuggestionsConfig(id);
|
|
2149
2207
|
};
|
|
2150
2208
|
}, [copilotkit, serializedConfig, requestReload]);
|
|
2151
|
-
(0,
|
|
2209
|
+
(0, import_react15.useEffect)(() => {
|
|
2152
2210
|
if (!normalizedConfig) {
|
|
2153
2211
|
previousSerializedConfigRef.current = null;
|
|
2154
2212
|
return;
|
|
@@ -2161,7 +2219,7 @@ function useConfigureSuggestions(config, options) {
|
|
|
2161
2219
|
}
|
|
2162
2220
|
requestReload();
|
|
2163
2221
|
}, [normalizedConfig, requestReload, serializedConfig]);
|
|
2164
|
-
(0,
|
|
2222
|
+
(0, import_react15.useEffect)(() => {
|
|
2165
2223
|
if (!normalizedConfig || extraDeps.length === 0) {
|
|
2166
2224
|
return;
|
|
2167
2225
|
}
|
|
@@ -2179,8 +2237,8 @@ function normalizeStaticSuggestions(suggestions) {
|
|
|
2179
2237
|
}
|
|
2180
2238
|
|
|
2181
2239
|
// src/components/chat/CopilotChatToolCallsView.tsx
|
|
2182
|
-
var
|
|
2183
|
-
var
|
|
2240
|
+
var import_react16 = __toESM(require("react"));
|
|
2241
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
2184
2242
|
function CopilotChatToolCallsView({
|
|
2185
2243
|
message,
|
|
2186
2244
|
messages = []
|
|
@@ -2189,11 +2247,11 @@ function CopilotChatToolCallsView({
|
|
|
2189
2247
|
if (!message.toolCalls || message.toolCalls.length === 0) {
|
|
2190
2248
|
return null;
|
|
2191
2249
|
}
|
|
2192
|
-
return /* @__PURE__ */ (0,
|
|
2250
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, { children: message.toolCalls.map((toolCall) => {
|
|
2193
2251
|
const toolMessage = messages.find(
|
|
2194
2252
|
(m) => m.role === "tool" && m.toolCallId === toolCall.id
|
|
2195
2253
|
);
|
|
2196
|
-
return /* @__PURE__ */ (0,
|
|
2254
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react16.default.Fragment, { children: renderToolCall({
|
|
2197
2255
|
toolCall,
|
|
2198
2256
|
toolMessage
|
|
2199
2257
|
}) }, toolCall.id);
|
|
@@ -2202,7 +2260,7 @@ function CopilotChatToolCallsView({
|
|
|
2202
2260
|
var CopilotChatToolCallsView_default = CopilotChatToolCallsView;
|
|
2203
2261
|
|
|
2204
2262
|
// src/components/chat/CopilotChatAssistantMessage.tsx
|
|
2205
|
-
var
|
|
2263
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
2206
2264
|
function CopilotChatAssistantMessage({
|
|
2207
2265
|
message,
|
|
2208
2266
|
messages,
|
|
@@ -2279,7 +2337,7 @@ function CopilotChatAssistantMessage({
|
|
|
2279
2337
|
toolbar,
|
|
2280
2338
|
CopilotChatAssistantMessage.Toolbar,
|
|
2281
2339
|
{
|
|
2282
|
-
children: /* @__PURE__ */ (0,
|
|
2340
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
2283
2341
|
boundCopyButton,
|
|
2284
2342
|
(onThumbsUp || thumbsUpButton) && boundThumbsUpButton,
|
|
2285
2343
|
(onThumbsDown || thumbsDownButton) && boundThumbsDownButton,
|
|
@@ -2301,7 +2359,7 @@ function CopilotChatAssistantMessage({
|
|
|
2301
2359
|
const isLatestAssistantMessage = message.role === "assistant" && messages?.[messages.length - 1]?.id === message.id;
|
|
2302
2360
|
const shouldShowToolbar = toolbarVisible && hasContent && !(isRunning && isLatestAssistantMessage);
|
|
2303
2361
|
if (children) {
|
|
2304
|
-
return /* @__PURE__ */ (0,
|
|
2362
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_jsx_runtime13.Fragment, { children: children({
|
|
2305
2363
|
markdownRenderer: boundMarkdownRenderer,
|
|
2306
2364
|
toolbar: boundToolbar,
|
|
2307
2365
|
toolCallsView: boundToolCallsView,
|
|
@@ -2321,7 +2379,7 @@ function CopilotChatAssistantMessage({
|
|
|
2321
2379
|
toolbarVisible: shouldShowToolbar
|
|
2322
2380
|
}) });
|
|
2323
2381
|
}
|
|
2324
|
-
return /* @__PURE__ */ (0,
|
|
2382
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
|
|
2325
2383
|
"div",
|
|
2326
2384
|
{
|
|
2327
2385
|
className: (0, import_tailwind_merge4.twMerge)(
|
|
@@ -2339,11 +2397,11 @@ function CopilotChatAssistantMessage({
|
|
|
2339
2397
|
);
|
|
2340
2398
|
}
|
|
2341
2399
|
((CopilotChatAssistantMessage2) => {
|
|
2342
|
-
CopilotChatAssistantMessage2.MarkdownRenderer = ({ content, className, ...props }) => /* @__PURE__ */ (0,
|
|
2400
|
+
CopilotChatAssistantMessage2.MarkdownRenderer = ({ content, className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_streamdown.Streamdown, { className, ...props, children: content ?? "" });
|
|
2343
2401
|
CopilotChatAssistantMessage2.Toolbar = ({
|
|
2344
2402
|
className,
|
|
2345
2403
|
...props
|
|
2346
|
-
}) => /* @__PURE__ */ (0,
|
|
2404
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2347
2405
|
"div",
|
|
2348
2406
|
{
|
|
2349
2407
|
className: (0, import_tailwind_merge4.twMerge)(
|
|
@@ -2354,8 +2412,8 @@ function CopilotChatAssistantMessage({
|
|
|
2354
2412
|
}
|
|
2355
2413
|
);
|
|
2356
2414
|
CopilotChatAssistantMessage2.ToolbarButton = ({ title, children, ...props }) => {
|
|
2357
|
-
return /* @__PURE__ */ (0,
|
|
2358
|
-
/* @__PURE__ */ (0,
|
|
2415
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(Tooltip, { children: [
|
|
2416
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2359
2417
|
Button,
|
|
2360
2418
|
{
|
|
2361
2419
|
type: "button",
|
|
@@ -2365,13 +2423,13 @@ function CopilotChatAssistantMessage({
|
|
|
2365
2423
|
children
|
|
2366
2424
|
}
|
|
2367
2425
|
) }),
|
|
2368
|
-
/* @__PURE__ */ (0,
|
|
2426
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(TooltipContent, { side: "bottom", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { children: title }) })
|
|
2369
2427
|
] });
|
|
2370
2428
|
};
|
|
2371
2429
|
CopilotChatAssistantMessage2.CopyButton = ({ className, title, onClick, ...props }) => {
|
|
2372
2430
|
const config = useCopilotChatConfiguration();
|
|
2373
2431
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2374
|
-
const [copied, setCopied] = (0,
|
|
2432
|
+
const [copied, setCopied] = (0, import_react17.useState)(false);
|
|
2375
2433
|
const handleClick = (event) => {
|
|
2376
2434
|
setCopied(true);
|
|
2377
2435
|
setTimeout(() => setCopied(false), 2e3);
|
|
@@ -2379,62 +2437,62 @@ function CopilotChatAssistantMessage({
|
|
|
2379
2437
|
onClick(event);
|
|
2380
2438
|
}
|
|
2381
2439
|
};
|
|
2382
|
-
return /* @__PURE__ */ (0,
|
|
2440
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2383
2441
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2384
2442
|
{
|
|
2385
2443
|
title: title || labels.assistantMessageToolbarCopyMessageLabel,
|
|
2386
2444
|
onClick: handleClick,
|
|
2387
2445
|
className,
|
|
2388
2446
|
...props,
|
|
2389
|
-
children: copied ? /* @__PURE__ */ (0,
|
|
2447
|
+
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
2448
|
}
|
|
2391
2449
|
);
|
|
2392
2450
|
};
|
|
2393
2451
|
CopilotChatAssistantMessage2.ThumbsUpButton = ({ title, ...props }) => {
|
|
2394
2452
|
const config = useCopilotChatConfiguration();
|
|
2395
2453
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2396
|
-
return /* @__PURE__ */ (0,
|
|
2454
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2397
2455
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2398
2456
|
{
|
|
2399
2457
|
title: title || labels.assistantMessageToolbarThumbsUpLabel,
|
|
2400
2458
|
...props,
|
|
2401
|
-
children: /* @__PURE__ */ (0,
|
|
2459
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.ThumbsUp, { className: "size-[18px]" })
|
|
2402
2460
|
}
|
|
2403
2461
|
);
|
|
2404
2462
|
};
|
|
2405
2463
|
CopilotChatAssistantMessage2.ThumbsDownButton = ({ title, ...props }) => {
|
|
2406
2464
|
const config = useCopilotChatConfiguration();
|
|
2407
2465
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2408
|
-
return /* @__PURE__ */ (0,
|
|
2466
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2409
2467
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2410
2468
|
{
|
|
2411
2469
|
title: title || labels.assistantMessageToolbarThumbsDownLabel,
|
|
2412
2470
|
...props,
|
|
2413
|
-
children: /* @__PURE__ */ (0,
|
|
2471
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.ThumbsDown, { className: "size-[18px]" })
|
|
2414
2472
|
}
|
|
2415
2473
|
);
|
|
2416
2474
|
};
|
|
2417
2475
|
CopilotChatAssistantMessage2.ReadAloudButton = ({ title, ...props }) => {
|
|
2418
2476
|
const config = useCopilotChatConfiguration();
|
|
2419
2477
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2420
|
-
return /* @__PURE__ */ (0,
|
|
2478
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2421
2479
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2422
2480
|
{
|
|
2423
2481
|
title: title || labels.assistantMessageToolbarReadAloudLabel,
|
|
2424
2482
|
...props,
|
|
2425
|
-
children: /* @__PURE__ */ (0,
|
|
2483
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.Volume2, { className: "size-[20px]" })
|
|
2426
2484
|
}
|
|
2427
2485
|
);
|
|
2428
2486
|
};
|
|
2429
2487
|
CopilotChatAssistantMessage2.RegenerateButton = ({ title, ...props }) => {
|
|
2430
2488
|
const config = useCopilotChatConfiguration();
|
|
2431
2489
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2432
|
-
return /* @__PURE__ */ (0,
|
|
2490
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
2433
2491
|
CopilotChatAssistantMessage2.ToolbarButton,
|
|
2434
2492
|
{
|
|
2435
2493
|
title: title || labels.assistantMessageToolbarRegenerateLabel,
|
|
2436
2494
|
...props,
|
|
2437
|
-
children: /* @__PURE__ */ (0,
|
|
2495
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react3.RefreshCw, { className: "size-[18px]" })
|
|
2438
2496
|
}
|
|
2439
2497
|
);
|
|
2440
2498
|
};
|
|
@@ -2449,10 +2507,24 @@ CopilotChatAssistantMessage.RegenerateButton.displayName = "CopilotChatAssistant
|
|
|
2449
2507
|
var CopilotChatAssistantMessage_default = CopilotChatAssistantMessage;
|
|
2450
2508
|
|
|
2451
2509
|
// src/components/chat/CopilotChatUserMessage.tsx
|
|
2452
|
-
var
|
|
2510
|
+
var import_react18 = require("react");
|
|
2453
2511
|
var import_lucide_react4 = require("lucide-react");
|
|
2454
2512
|
var import_tailwind_merge5 = require("tailwind-merge");
|
|
2455
|
-
var
|
|
2513
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
2514
|
+
function flattenUserMessageContent(content) {
|
|
2515
|
+
if (!content) {
|
|
2516
|
+
return "";
|
|
2517
|
+
}
|
|
2518
|
+
if (typeof content === "string") {
|
|
2519
|
+
return content;
|
|
2520
|
+
}
|
|
2521
|
+
return content.map((part) => {
|
|
2522
|
+
if (part && typeof part === "object" && "type" in part && part.type === "text" && typeof part.text === "string") {
|
|
2523
|
+
return part.text;
|
|
2524
|
+
}
|
|
2525
|
+
return "";
|
|
2526
|
+
}).filter((text) => text.length > 0).join("\n");
|
|
2527
|
+
}
|
|
2456
2528
|
function CopilotChatUserMessage({
|
|
2457
2529
|
message,
|
|
2458
2530
|
onEditMessage,
|
|
@@ -2469,11 +2541,15 @@ function CopilotChatUserMessage({
|
|
|
2469
2541
|
className,
|
|
2470
2542
|
...props
|
|
2471
2543
|
}) {
|
|
2544
|
+
const flattenedContent = (0, import_react18.useMemo)(
|
|
2545
|
+
() => flattenUserMessageContent(message.content),
|
|
2546
|
+
[message.content]
|
|
2547
|
+
);
|
|
2472
2548
|
const BoundMessageRenderer = renderSlot(
|
|
2473
2549
|
messageRenderer,
|
|
2474
2550
|
CopilotChatUserMessage.MessageRenderer,
|
|
2475
2551
|
{
|
|
2476
|
-
content:
|
|
2552
|
+
content: flattenedContent
|
|
2477
2553
|
}
|
|
2478
2554
|
);
|
|
2479
2555
|
const BoundCopyButton = renderSlot(
|
|
@@ -2481,9 +2557,9 @@ function CopilotChatUserMessage({
|
|
|
2481
2557
|
CopilotChatUserMessage.CopyButton,
|
|
2482
2558
|
{
|
|
2483
2559
|
onClick: async () => {
|
|
2484
|
-
if (
|
|
2560
|
+
if (flattenedContent) {
|
|
2485
2561
|
try {
|
|
2486
|
-
await navigator.clipboard.writeText(
|
|
2562
|
+
await navigator.clipboard.writeText(flattenedContent);
|
|
2487
2563
|
} catch (err) {
|
|
2488
2564
|
console.error("Failed to copy message:", err);
|
|
2489
2565
|
}
|
|
@@ -2510,7 +2586,7 @@ function CopilotChatUserMessage({
|
|
|
2510
2586
|
);
|
|
2511
2587
|
const showBranchNavigation = numberOfBranches && numberOfBranches > 1 && onSwitchToBranch;
|
|
2512
2588
|
const BoundToolbar = renderSlot(toolbar, CopilotChatUserMessage.Toolbar, {
|
|
2513
|
-
children: /* @__PURE__ */ (0,
|
|
2589
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex items-center gap-1 justify-end", children: [
|
|
2514
2590
|
additionalToolbarItems,
|
|
2515
2591
|
BoundCopyButton,
|
|
2516
2592
|
onEditMessage && BoundEditButton,
|
|
@@ -2518,7 +2594,7 @@ function CopilotChatUserMessage({
|
|
|
2518
2594
|
] })
|
|
2519
2595
|
});
|
|
2520
2596
|
if (children) {
|
|
2521
|
-
return /* @__PURE__ */ (0,
|
|
2597
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_jsx_runtime14.Fragment, { children: children({
|
|
2522
2598
|
messageRenderer: BoundMessageRenderer,
|
|
2523
2599
|
toolbar: BoundToolbar,
|
|
2524
2600
|
copyButton: BoundCopyButton,
|
|
@@ -2530,7 +2606,7 @@ function CopilotChatUserMessage({
|
|
|
2530
2606
|
additionalToolbarItems
|
|
2531
2607
|
}) });
|
|
2532
2608
|
}
|
|
2533
|
-
return /* @__PURE__ */ (0,
|
|
2609
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
|
|
2534
2610
|
"div",
|
|
2535
2611
|
{
|
|
2536
2612
|
className: (0, import_tailwind_merge5.twMerge)("flex flex-col items-end group pt-10", className),
|
|
@@ -2544,7 +2620,7 @@ function CopilotChatUserMessage({
|
|
|
2544
2620
|
);
|
|
2545
2621
|
}
|
|
2546
2622
|
((CopilotChatUserMessage2) => {
|
|
2547
|
-
CopilotChatUserMessage2.Container = ({ children, className, ...props }) => /* @__PURE__ */ (0,
|
|
2623
|
+
CopilotChatUserMessage2.Container = ({ children, className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2548
2624
|
"div",
|
|
2549
2625
|
{
|
|
2550
2626
|
className: (0, import_tailwind_merge5.twMerge)("flex flex-col items-end group", className),
|
|
@@ -2552,7 +2628,7 @@ function CopilotChatUserMessage({
|
|
|
2552
2628
|
children
|
|
2553
2629
|
}
|
|
2554
2630
|
);
|
|
2555
|
-
CopilotChatUserMessage2.MessageRenderer = ({ content, className }) => /* @__PURE__ */ (0,
|
|
2631
|
+
CopilotChatUserMessage2.MessageRenderer = ({ content, className }) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2556
2632
|
"div",
|
|
2557
2633
|
{
|
|
2558
2634
|
className: (0, import_tailwind_merge5.twMerge)(
|
|
@@ -2565,7 +2641,7 @@ function CopilotChatUserMessage({
|
|
|
2565
2641
|
CopilotChatUserMessage2.Toolbar = ({
|
|
2566
2642
|
className,
|
|
2567
2643
|
...props
|
|
2568
|
-
}) => /* @__PURE__ */ (0,
|
|
2644
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2569
2645
|
"div",
|
|
2570
2646
|
{
|
|
2571
2647
|
className: (0, import_tailwind_merge5.twMerge)(
|
|
@@ -2576,8 +2652,8 @@ function CopilotChatUserMessage({
|
|
|
2576
2652
|
}
|
|
2577
2653
|
);
|
|
2578
2654
|
CopilotChatUserMessage2.ToolbarButton = ({ title, children, className, ...props }) => {
|
|
2579
|
-
return /* @__PURE__ */ (0,
|
|
2580
|
-
/* @__PURE__ */ (0,
|
|
2655
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(Tooltip, { children: [
|
|
2656
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2581
2657
|
Button,
|
|
2582
2658
|
{
|
|
2583
2659
|
type: "button",
|
|
@@ -2588,13 +2664,13 @@ function CopilotChatUserMessage({
|
|
|
2588
2664
|
children
|
|
2589
2665
|
}
|
|
2590
2666
|
) }),
|
|
2591
|
-
/* @__PURE__ */ (0,
|
|
2667
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(TooltipContent, { side: "bottom", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { children: title }) })
|
|
2592
2668
|
] });
|
|
2593
2669
|
};
|
|
2594
2670
|
CopilotChatUserMessage2.CopyButton = ({ className, title, onClick, ...props }) => {
|
|
2595
2671
|
const config = useCopilotChatConfiguration();
|
|
2596
2672
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2597
|
-
const [copied, setCopied] = (0,
|
|
2673
|
+
const [copied, setCopied] = (0, import_react18.useState)(false);
|
|
2598
2674
|
const handleClick = (event) => {
|
|
2599
2675
|
setCopied(true);
|
|
2600
2676
|
setTimeout(() => setCopied(false), 2e3);
|
|
@@ -2602,27 +2678,27 @@ function CopilotChatUserMessage({
|
|
|
2602
2678
|
onClick(event);
|
|
2603
2679
|
}
|
|
2604
2680
|
};
|
|
2605
|
-
return /* @__PURE__ */ (0,
|
|
2681
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2606
2682
|
CopilotChatUserMessage2.ToolbarButton,
|
|
2607
2683
|
{
|
|
2608
2684
|
title: title || labels.userMessageToolbarCopyMessageLabel,
|
|
2609
2685
|
onClick: handleClick,
|
|
2610
2686
|
className,
|
|
2611
2687
|
...props,
|
|
2612
|
-
children: copied ? /* @__PURE__ */ (0,
|
|
2688
|
+
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
2689
|
}
|
|
2614
2690
|
);
|
|
2615
2691
|
};
|
|
2616
2692
|
CopilotChatUserMessage2.EditButton = ({ className, title, ...props }) => {
|
|
2617
2693
|
const config = useCopilotChatConfiguration();
|
|
2618
2694
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
2619
|
-
return /* @__PURE__ */ (0,
|
|
2695
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2620
2696
|
CopilotChatUserMessage2.ToolbarButton,
|
|
2621
2697
|
{
|
|
2622
2698
|
title: title || labels.userMessageToolbarEditMessageLabel,
|
|
2623
2699
|
className,
|
|
2624
2700
|
...props,
|
|
2625
|
-
children: /* @__PURE__ */ (0,
|
|
2701
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.Edit, { className: "size-[18px]" })
|
|
2626
2702
|
}
|
|
2627
2703
|
);
|
|
2628
2704
|
};
|
|
@@ -2639,8 +2715,8 @@ function CopilotChatUserMessage({
|
|
|
2639
2715
|
}
|
|
2640
2716
|
const canGoPrev = currentBranch > 0;
|
|
2641
2717
|
const canGoNext = currentBranch < numberOfBranches - 1;
|
|
2642
|
-
return /* @__PURE__ */ (0,
|
|
2643
|
-
/* @__PURE__ */ (0,
|
|
2718
|
+
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: (0, import_tailwind_merge5.twMerge)("flex items-center gap-1", className), ...props, children: [
|
|
2719
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2644
2720
|
Button,
|
|
2645
2721
|
{
|
|
2646
2722
|
type: "button",
|
|
@@ -2652,15 +2728,15 @@ function CopilotChatUserMessage({
|
|
|
2652
2728
|
}),
|
|
2653
2729
|
disabled: !canGoPrev,
|
|
2654
2730
|
className: "h-6 w-6 p-0",
|
|
2655
|
-
children: /* @__PURE__ */ (0,
|
|
2731
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.ChevronLeft, { className: "size-[20px]" })
|
|
2656
2732
|
}
|
|
2657
2733
|
),
|
|
2658
|
-
/* @__PURE__ */ (0,
|
|
2734
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("span", { className: "text-sm text-muted-foreground px-0 font-medium", children: [
|
|
2659
2735
|
currentBranch + 1,
|
|
2660
2736
|
"/",
|
|
2661
2737
|
numberOfBranches
|
|
2662
2738
|
] }),
|
|
2663
|
-
/* @__PURE__ */ (0,
|
|
2739
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
|
2664
2740
|
Button,
|
|
2665
2741
|
{
|
|
2666
2742
|
type: "button",
|
|
@@ -2672,7 +2748,7 @@ function CopilotChatUserMessage({
|
|
|
2672
2748
|
}),
|
|
2673
2749
|
disabled: !canGoNext,
|
|
2674
2750
|
className: "h-6 w-6 p-0",
|
|
2675
|
-
children: /* @__PURE__ */ (0,
|
|
2751
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react4.ChevronRight, { className: "size-[20px]" })
|
|
2676
2752
|
}
|
|
2677
2753
|
)
|
|
2678
2754
|
] });
|
|
@@ -2688,14 +2764,14 @@ CopilotChatUserMessage.BranchNavigation.displayName = "CopilotChatUserMessage.Br
|
|
|
2688
2764
|
var CopilotChatUserMessage_default = CopilotChatUserMessage;
|
|
2689
2765
|
|
|
2690
2766
|
// src/components/chat/CopilotChatSuggestionPill.tsx
|
|
2691
|
-
var
|
|
2767
|
+
var import_react19 = __toESM(require("react"));
|
|
2692
2768
|
var import_lucide_react5 = require("lucide-react");
|
|
2693
|
-
var
|
|
2769
|
+
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
2694
2770
|
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
2771
|
var labelClasses = "whitespace-nowrap font-medium leading-none";
|
|
2696
|
-
var CopilotChatSuggestionPill =
|
|
2772
|
+
var CopilotChatSuggestionPill = import_react19.default.forwardRef(function CopilotChatSuggestionPill2({ className, children, icon, isLoading, type, ...props }, ref) {
|
|
2697
2773
|
const showIcon = !isLoading && icon;
|
|
2698
|
-
return /* @__PURE__ */ (0,
|
|
2774
|
+
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
|
|
2699
2775
|
"button",
|
|
2700
2776
|
{
|
|
2701
2777
|
ref,
|
|
@@ -2706,8 +2782,8 @@ var CopilotChatSuggestionPill = import_react18.default.forwardRef(function Copil
|
|
|
2706
2782
|
disabled: isLoading || props.disabled,
|
|
2707
2783
|
...props,
|
|
2708
2784
|
children: [
|
|
2709
|
-
isLoading ? /* @__PURE__ */ (0,
|
|
2710
|
-
/* @__PURE__ */ (0,
|
|
2785
|
+
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 }),
|
|
2786
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: labelClasses, children })
|
|
2711
2787
|
]
|
|
2712
2788
|
}
|
|
2713
2789
|
);
|
|
@@ -2716,10 +2792,10 @@ CopilotChatSuggestionPill.displayName = "CopilotChatSuggestionPill";
|
|
|
2716
2792
|
var CopilotChatSuggestionPill_default = CopilotChatSuggestionPill;
|
|
2717
2793
|
|
|
2718
2794
|
// src/components/chat/CopilotChatSuggestionView.tsx
|
|
2719
|
-
var
|
|
2720
|
-
var
|
|
2721
|
-
var DefaultContainer =
|
|
2722
|
-
return /* @__PURE__ */ (0,
|
|
2795
|
+
var import_react20 = __toESM(require("react"));
|
|
2796
|
+
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
2797
|
+
var DefaultContainer = import_react20.default.forwardRef(function DefaultContainer2({ className, ...props }, ref) {
|
|
2798
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
2723
2799
|
"div",
|
|
2724
2800
|
{
|
|
2725
2801
|
ref,
|
|
@@ -2731,7 +2807,7 @@ var DefaultContainer = import_react19.default.forwardRef(function DefaultContain
|
|
|
2731
2807
|
}
|
|
2732
2808
|
);
|
|
2733
2809
|
});
|
|
2734
|
-
var CopilotChatSuggestionView =
|
|
2810
|
+
var CopilotChatSuggestionView = import_react20.default.forwardRef(function CopilotChatSuggestionView2({
|
|
2735
2811
|
suggestions,
|
|
2736
2812
|
onSelectSuggestion,
|
|
2737
2813
|
loadingIndexes,
|
|
@@ -2741,7 +2817,7 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2741
2817
|
children,
|
|
2742
2818
|
...restProps
|
|
2743
2819
|
}, ref) {
|
|
2744
|
-
const loadingSet =
|
|
2820
|
+
const loadingSet = import_react20.default.useMemo(() => {
|
|
2745
2821
|
if (!loadingIndexes || loadingIndexes.length === 0) {
|
|
2746
2822
|
return /* @__PURE__ */ new Set();
|
|
2747
2823
|
}
|
|
@@ -2760,11 +2836,11 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2760
2836
|
type: "button",
|
|
2761
2837
|
onClick: () => onSelectSuggestion?.(suggestion, index)
|
|
2762
2838
|
});
|
|
2763
|
-
return
|
|
2839
|
+
return import_react20.default.cloneElement(pill, {
|
|
2764
2840
|
key: `${suggestion.title}-${index}`
|
|
2765
2841
|
});
|
|
2766
2842
|
});
|
|
2767
|
-
const boundContainer =
|
|
2843
|
+
const boundContainer = import_react20.default.cloneElement(
|
|
2768
2844
|
ContainerElement,
|
|
2769
2845
|
void 0,
|
|
2770
2846
|
suggestionElements
|
|
@@ -2775,7 +2851,7 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2775
2851
|
isLoading: suggestions.length > 0 ? loadingSet.has(0) || suggestions[0]?.isLoading === true : false,
|
|
2776
2852
|
type: "button"
|
|
2777
2853
|
});
|
|
2778
|
-
return /* @__PURE__ */ (0,
|
|
2854
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children: children({
|
|
2779
2855
|
container: boundContainer,
|
|
2780
2856
|
suggestion: sampleSuggestion,
|
|
2781
2857
|
suggestions,
|
|
@@ -2786,7 +2862,7 @@ var CopilotChatSuggestionView = import_react19.default.forwardRef(function Copil
|
|
|
2786
2862
|
}) });
|
|
2787
2863
|
}
|
|
2788
2864
|
if (children) {
|
|
2789
|
-
return /* @__PURE__ */ (0,
|
|
2865
|
+
return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
|
|
2790
2866
|
boundContainer,
|
|
2791
2867
|
children
|
|
2792
2868
|
] });
|
|
@@ -2798,7 +2874,7 @@ var CopilotChatSuggestionView_default = CopilotChatSuggestionView;
|
|
|
2798
2874
|
|
|
2799
2875
|
// src/components/chat/CopilotChatMessageView.tsx
|
|
2800
2876
|
var import_tailwind_merge6 = require("tailwind-merge");
|
|
2801
|
-
var
|
|
2877
|
+
var import_jsx_runtime17 = require("react/jsx-runtime");
|
|
2802
2878
|
function CopilotChatMessageView({
|
|
2803
2879
|
messages = [],
|
|
2804
2880
|
assistantMessage,
|
|
@@ -2810,6 +2886,7 @@ function CopilotChatMessageView({
|
|
|
2810
2886
|
...props
|
|
2811
2887
|
}) {
|
|
2812
2888
|
const renderCustomMessage = useRenderCustomMessages();
|
|
2889
|
+
const renderActivityMessage = useRenderActivityMessage();
|
|
2813
2890
|
const messageElements = messages.flatMap((message) => {
|
|
2814
2891
|
const elements = [];
|
|
2815
2892
|
if (renderCustomMessage) {
|
|
@@ -2836,6 +2913,11 @@ function CopilotChatMessageView({
|
|
|
2836
2913
|
message
|
|
2837
2914
|
})
|
|
2838
2915
|
);
|
|
2916
|
+
} else if (message.role === "activity") {
|
|
2917
|
+
const renderedActivity = renderActivityMessage(message);
|
|
2918
|
+
if (renderedActivity) {
|
|
2919
|
+
elements.push(renderedActivity);
|
|
2920
|
+
}
|
|
2839
2921
|
}
|
|
2840
2922
|
if (renderCustomMessage) {
|
|
2841
2923
|
elements.push(
|
|
@@ -2850,13 +2932,13 @@ function CopilotChatMessageView({
|
|
|
2850
2932
|
if (children) {
|
|
2851
2933
|
return children({ messageElements, messages, isRunning });
|
|
2852
2934
|
}
|
|
2853
|
-
return /* @__PURE__ */ (0,
|
|
2935
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: (0, import_tailwind_merge6.twMerge)("flex flex-col", className), ...props, children: [
|
|
2854
2936
|
messageElements,
|
|
2855
2937
|
isRunning && renderSlot(cursor, CopilotChatMessageView.Cursor, {})
|
|
2856
2938
|
] });
|
|
2857
2939
|
}
|
|
2858
2940
|
CopilotChatMessageView.Cursor = function Cursor({ className, ...props }) {
|
|
2859
|
-
return /* @__PURE__ */ (0,
|
|
2941
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
2860
2942
|
"div",
|
|
2861
2943
|
{
|
|
2862
2944
|
className: (0, import_tailwind_merge6.twMerge)("w-[11px] h-[11px] rounded-full bg-foreground animate-pulse-cursor ml-1", className),
|
|
@@ -2867,21 +2949,21 @@ CopilotChatMessageView.Cursor = function Cursor({ className, ...props }) {
|
|
|
2867
2949
|
var CopilotChatMessageView_default = CopilotChatMessageView;
|
|
2868
2950
|
|
|
2869
2951
|
// src/components/chat/CopilotChatView.tsx
|
|
2870
|
-
var
|
|
2952
|
+
var import_react22 = __toESM(require("react"));
|
|
2871
2953
|
var import_tailwind_merge7 = require("tailwind-merge");
|
|
2872
2954
|
var import_use_stick_to_bottom = require("use-stick-to-bottom");
|
|
2873
2955
|
var import_lucide_react6 = require("lucide-react");
|
|
2874
2956
|
|
|
2875
2957
|
// src/hooks/use-keyboard-height.tsx
|
|
2876
|
-
var
|
|
2958
|
+
var import_react21 = require("react");
|
|
2877
2959
|
function useKeyboardHeight() {
|
|
2878
|
-
const [keyboardState, setKeyboardState] = (0,
|
|
2960
|
+
const [keyboardState, setKeyboardState] = (0, import_react21.useState)({
|
|
2879
2961
|
isKeyboardOpen: false,
|
|
2880
2962
|
keyboardHeight: 0,
|
|
2881
2963
|
availableHeight: typeof window !== "undefined" ? window.innerHeight : 0,
|
|
2882
2964
|
viewportHeight: typeof window !== "undefined" ? window.innerHeight : 0
|
|
2883
2965
|
});
|
|
2884
|
-
(0,
|
|
2966
|
+
(0, import_react21.useEffect)(() => {
|
|
2885
2967
|
if (typeof window === "undefined") {
|
|
2886
2968
|
return;
|
|
2887
2969
|
}
|
|
@@ -2913,7 +2995,7 @@ function useKeyboardHeight() {
|
|
|
2913
2995
|
}
|
|
2914
2996
|
|
|
2915
2997
|
// src/components/chat/CopilotChatView.tsx
|
|
2916
|
-
var
|
|
2998
|
+
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
2917
2999
|
function CopilotChatView({
|
|
2918
3000
|
messageView,
|
|
2919
3001
|
input,
|
|
@@ -2934,12 +3016,12 @@ function CopilotChatView({
|
|
|
2934
3016
|
className,
|
|
2935
3017
|
...props
|
|
2936
3018
|
}) {
|
|
2937
|
-
const inputContainerRef = (0,
|
|
2938
|
-
const [inputContainerHeight, setInputContainerHeight] = (0,
|
|
2939
|
-
const [isResizing, setIsResizing] = (0,
|
|
2940
|
-
const resizeTimeoutRef = (0,
|
|
3019
|
+
const inputContainerRef = (0, import_react22.useRef)(null);
|
|
3020
|
+
const [inputContainerHeight, setInputContainerHeight] = (0, import_react22.useState)(0);
|
|
3021
|
+
const [isResizing, setIsResizing] = (0, import_react22.useState)(false);
|
|
3022
|
+
const resizeTimeoutRef = (0, import_react22.useRef)(null);
|
|
2941
3023
|
const { isKeyboardOpen, keyboardHeight, availableHeight } = useKeyboardHeight();
|
|
2942
|
-
(0,
|
|
3024
|
+
(0, import_react22.useEffect)(() => {
|
|
2943
3025
|
const element = inputContainerRef.current;
|
|
2944
3026
|
if (!element) return;
|
|
2945
3027
|
const resizeObserver = new ResizeObserver((entries) => {
|
|
@@ -2991,9 +3073,9 @@ function CopilotChatView({
|
|
|
2991
3073
|
scrollToBottomButton,
|
|
2992
3074
|
inputContainerHeight,
|
|
2993
3075
|
isResizing,
|
|
2994
|
-
children: /* @__PURE__ */ (0,
|
|
3076
|
+
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
3077
|
BoundMessageView,
|
|
2996
|
-
hasSuggestions ? /* @__PURE__ */ (0,
|
|
3078
|
+
hasSuggestions ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "pl-0 pr-4 sm:px-0 mt-4", children: BoundSuggestionView }) : null
|
|
2997
3079
|
] }) })
|
|
2998
3080
|
});
|
|
2999
3081
|
const BoundScrollToBottomButton = renderSlot(scrollToBottomButton, CopilotChatView.ScrollToBottomButton, {});
|
|
@@ -3001,8 +3083,8 @@ function CopilotChatView({
|
|
|
3001
3083
|
const BoundInputContainer = renderSlot(inputContainer, CopilotChatView.InputContainer, {
|
|
3002
3084
|
ref: inputContainerRef,
|
|
3003
3085
|
keyboardHeight: isKeyboardOpen ? keyboardHeight : 0,
|
|
3004
|
-
children: /* @__PURE__ */ (0,
|
|
3005
|
-
/* @__PURE__ */ (0,
|
|
3086
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
|
|
3087
|
+
/* @__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
3088
|
BoundDisclaimer
|
|
3007
3089
|
] })
|
|
3008
3090
|
});
|
|
@@ -3015,10 +3097,10 @@ function CopilotChatView({
|
|
|
3015
3097
|
feather: BoundFeather,
|
|
3016
3098
|
inputContainer: BoundInputContainer,
|
|
3017
3099
|
disclaimer: BoundDisclaimer,
|
|
3018
|
-
suggestionView: BoundSuggestionView ?? /* @__PURE__ */ (0,
|
|
3100
|
+
suggestionView: BoundSuggestionView ?? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, {})
|
|
3019
3101
|
});
|
|
3020
3102
|
}
|
|
3021
|
-
return /* @__PURE__ */ (0,
|
|
3103
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: (0, import_tailwind_merge7.twMerge)("relative h-full", className), ...props, children: [
|
|
3022
3104
|
BoundScrollView,
|
|
3023
3105
|
BoundFeather,
|
|
3024
3106
|
BoundInputContainer
|
|
@@ -3027,9 +3109,9 @@ function CopilotChatView({
|
|
|
3027
3109
|
((CopilotChatView2) => {
|
|
3028
3110
|
const ScrollContent = ({ children, scrollToBottomButton, inputContainerHeight, isResizing }) => {
|
|
3029
3111
|
const { isAtBottom, scrollToBottom } = (0, import_use_stick_to_bottom.useStickToBottomContext)();
|
|
3030
|
-
return /* @__PURE__ */ (0,
|
|
3031
|
-
/* @__PURE__ */ (0,
|
|
3032
|
-
!isAtBottom && !isResizing && /* @__PURE__ */ (0,
|
|
3112
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
|
|
3113
|
+
/* @__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 }) }),
|
|
3114
|
+
!isAtBottom && !isResizing && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3033
3115
|
"div",
|
|
3034
3116
|
{
|
|
3035
3117
|
className: "absolute inset-x-0 flex justify-center z-10 pointer-events-none",
|
|
@@ -3052,13 +3134,13 @@ function CopilotChatView({
|
|
|
3052
3134
|
className,
|
|
3053
3135
|
...props
|
|
3054
3136
|
}) => {
|
|
3055
|
-
const [hasMounted, setHasMounted] = (0,
|
|
3137
|
+
const [hasMounted, setHasMounted] = (0, import_react22.useState)(false);
|
|
3056
3138
|
const { scrollRef, contentRef, scrollToBottom } = (0, import_use_stick_to_bottom.useStickToBottom)();
|
|
3057
|
-
const [showScrollButton, setShowScrollButton] = (0,
|
|
3058
|
-
(0,
|
|
3139
|
+
const [showScrollButton, setShowScrollButton] = (0, import_react22.useState)(false);
|
|
3140
|
+
(0, import_react22.useEffect)(() => {
|
|
3059
3141
|
setHasMounted(true);
|
|
3060
3142
|
}, []);
|
|
3061
|
-
(0,
|
|
3143
|
+
(0, import_react22.useEffect)(() => {
|
|
3062
3144
|
if (autoScroll) return;
|
|
3063
3145
|
const scrollElement = scrollRef.current;
|
|
3064
3146
|
if (!scrollElement) return;
|
|
@@ -3076,10 +3158,10 @@ function CopilotChatView({
|
|
|
3076
3158
|
};
|
|
3077
3159
|
}, [scrollRef, autoScroll]);
|
|
3078
3160
|
if (!hasMounted) {
|
|
3079
|
-
return /* @__PURE__ */ (0,
|
|
3161
|
+
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
3162
|
}
|
|
3081
3163
|
if (!autoScroll) {
|
|
3082
|
-
return /* @__PURE__ */ (0,
|
|
3164
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
3083
3165
|
"div",
|
|
3084
3166
|
{
|
|
3085
3167
|
ref: scrollRef,
|
|
@@ -3089,8 +3171,8 @@ function CopilotChatView({
|
|
|
3089
3171
|
),
|
|
3090
3172
|
...props,
|
|
3091
3173
|
children: [
|
|
3092
|
-
/* @__PURE__ */ (0,
|
|
3093
|
-
showScrollButton && !isResizing && /* @__PURE__ */ (0,
|
|
3174
|
+
/* @__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 }),
|
|
3175
|
+
showScrollButton && !isResizing && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3094
3176
|
"div",
|
|
3095
3177
|
{
|
|
3096
3178
|
className: "absolute inset-x-0 flex justify-center z-10 pointer-events-none",
|
|
@@ -3106,14 +3188,14 @@ function CopilotChatView({
|
|
|
3106
3188
|
}
|
|
3107
3189
|
);
|
|
3108
3190
|
}
|
|
3109
|
-
return /* @__PURE__ */ (0,
|
|
3191
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3110
3192
|
import_use_stick_to_bottom.StickToBottom,
|
|
3111
3193
|
{
|
|
3112
3194
|
className: cn("h-full max-h-full flex flex-col min-h-0 relative", className),
|
|
3113
3195
|
resize: "smooth",
|
|
3114
3196
|
initial: "smooth",
|
|
3115
3197
|
...props,
|
|
3116
|
-
children: /* @__PURE__ */ (0,
|
|
3198
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3117
3199
|
ScrollContent,
|
|
3118
3200
|
{
|
|
3119
3201
|
scrollToBottomButton,
|
|
@@ -3128,7 +3210,7 @@ function CopilotChatView({
|
|
|
3128
3210
|
CopilotChatView2.ScrollToBottomButton = ({
|
|
3129
3211
|
className,
|
|
3130
3212
|
...props
|
|
3131
|
-
}) => /* @__PURE__ */ (0,
|
|
3213
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3132
3214
|
Button,
|
|
3133
3215
|
{
|
|
3134
3216
|
variant: "outline",
|
|
@@ -3142,10 +3224,10 @@ function CopilotChatView({
|
|
|
3142
3224
|
className
|
|
3143
3225
|
),
|
|
3144
3226
|
...props,
|
|
3145
|
-
children: /* @__PURE__ */ (0,
|
|
3227
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react6.ChevronDown, { className: "w-4 h-4 text-gray-600 dark:text-white" })
|
|
3146
3228
|
}
|
|
3147
3229
|
);
|
|
3148
|
-
CopilotChatView2.Feather = ({ className, style, ...props }) => /* @__PURE__ */ (0,
|
|
3230
|
+
CopilotChatView2.Feather = ({ className, style, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3149
3231
|
"div",
|
|
3150
3232
|
{
|
|
3151
3233
|
className: cn(
|
|
@@ -3158,7 +3240,7 @@ function CopilotChatView({
|
|
|
3158
3240
|
...props
|
|
3159
3241
|
}
|
|
3160
3242
|
);
|
|
3161
|
-
CopilotChatView2.InputContainer =
|
|
3243
|
+
CopilotChatView2.InputContainer = import_react22.default.forwardRef(({ children, className, keyboardHeight = 0, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3162
3244
|
"div",
|
|
3163
3245
|
{
|
|
3164
3246
|
ref,
|
|
@@ -3176,7 +3258,7 @@ function CopilotChatView({
|
|
|
3176
3258
|
CopilotChatView2.Disclaimer = ({ className, ...props }) => {
|
|
3177
3259
|
const config = useCopilotChatConfiguration();
|
|
3178
3260
|
const labels = config?.labels ?? CopilotChatDefaultLabels;
|
|
3179
|
-
return /* @__PURE__ */ (0,
|
|
3261
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
3180
3262
|
"div",
|
|
3181
3263
|
{
|
|
3182
3264
|
className: cn("text-center text-xs text-muted-foreground py-3 px-4 max-w-3xl mx-auto", className),
|
|
@@ -3189,16 +3271,16 @@ function CopilotChatView({
|
|
|
3189
3271
|
var CopilotChatView_default = CopilotChatView;
|
|
3190
3272
|
|
|
3191
3273
|
// src/components/chat/CopilotChat.tsx
|
|
3192
|
-
var
|
|
3193
|
-
var
|
|
3274
|
+
var import_shared8 = require("@copilotkitnext/shared");
|
|
3275
|
+
var import_react23 = require("react");
|
|
3194
3276
|
var import_ts_deepmerge = require("ts-deepmerge");
|
|
3195
3277
|
var import_client = require("@ag-ui/client");
|
|
3196
|
-
var
|
|
3278
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
3197
3279
|
function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen, ...props }) {
|
|
3198
3280
|
const existingConfig = useCopilotChatConfiguration();
|
|
3199
|
-
const resolvedAgentId = agentId ?? existingConfig?.agentId ??
|
|
3200
|
-
const resolvedThreadId = (0,
|
|
3201
|
-
() => threadId ?? existingConfig?.threadId ?? (0,
|
|
3281
|
+
const resolvedAgentId = agentId ?? existingConfig?.agentId ?? import_shared8.DEFAULT_AGENT_ID;
|
|
3282
|
+
const resolvedThreadId = (0, import_react23.useMemo)(
|
|
3283
|
+
() => threadId ?? existingConfig?.threadId ?? (0, import_shared8.randomUUID)(),
|
|
3202
3284
|
[threadId, existingConfig?.threadId]
|
|
3203
3285
|
);
|
|
3204
3286
|
const { agent } = useAgent({ agentId: resolvedAgentId });
|
|
@@ -3210,7 +3292,7 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3210
3292
|
suggestionView: providedSuggestionView,
|
|
3211
3293
|
...restProps
|
|
3212
3294
|
} = props;
|
|
3213
|
-
(0,
|
|
3295
|
+
(0, import_react23.useEffect)(() => {
|
|
3214
3296
|
const connect = async (agent2) => {
|
|
3215
3297
|
try {
|
|
3216
3298
|
await copilotkit.connectAgent({ agent: agent2 });
|
|
@@ -3228,10 +3310,10 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3228
3310
|
return () => {
|
|
3229
3311
|
};
|
|
3230
3312
|
}, [resolvedThreadId, agent, copilotkit, resolvedAgentId]);
|
|
3231
|
-
const onSubmitInput = (0,
|
|
3313
|
+
const onSubmitInput = (0, import_react23.useCallback)(
|
|
3232
3314
|
async (value) => {
|
|
3233
3315
|
agent?.addMessage({
|
|
3234
|
-
id: (0,
|
|
3316
|
+
id: (0, import_shared8.randomUUID)(),
|
|
3235
3317
|
role: "user",
|
|
3236
3318
|
content: value
|
|
3237
3319
|
});
|
|
@@ -3245,13 +3327,13 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3245
3327
|
},
|
|
3246
3328
|
[agent, copilotkit]
|
|
3247
3329
|
);
|
|
3248
|
-
const handleSelectSuggestion = (0,
|
|
3330
|
+
const handleSelectSuggestion = (0, import_react23.useCallback)(
|
|
3249
3331
|
async (suggestion) => {
|
|
3250
3332
|
if (!agent) {
|
|
3251
3333
|
return;
|
|
3252
3334
|
}
|
|
3253
3335
|
agent.addMessage({
|
|
3254
|
-
id: (0,
|
|
3336
|
+
id: (0, import_shared8.randomUUID)(),
|
|
3255
3337
|
role: "user",
|
|
3256
3338
|
content: suggestion.message
|
|
3257
3339
|
});
|
|
@@ -3263,7 +3345,7 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3263
3345
|
},
|
|
3264
3346
|
[agent, copilotkit]
|
|
3265
3347
|
);
|
|
3266
|
-
const stopCurrentRun = (0,
|
|
3348
|
+
const stopCurrentRun = (0, import_react23.useCallback)(() => {
|
|
3267
3349
|
if (!agent) {
|
|
3268
3350
|
return;
|
|
3269
3351
|
}
|
|
@@ -3306,7 +3388,7 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3306
3388
|
inputProps: finalInputProps
|
|
3307
3389
|
});
|
|
3308
3390
|
const RenderedChatView = renderSlot(chatView, CopilotChatView, finalProps);
|
|
3309
|
-
return /* @__PURE__ */ (0,
|
|
3391
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
3310
3392
|
CopilotChatConfigurationProvider,
|
|
3311
3393
|
{
|
|
3312
3394
|
agentId: resolvedAgentId,
|
|
@@ -3322,17 +3404,17 @@ function CopilotChat({ agentId, threadId, labels, chatView, isModalDefaultOpen,
|
|
|
3322
3404
|
})(CopilotChat || (CopilotChat = {}));
|
|
3323
3405
|
|
|
3324
3406
|
// src/components/chat/CopilotChatToggleButton.tsx
|
|
3325
|
-
var
|
|
3407
|
+
var import_react24 = __toESM(require("react"));
|
|
3326
3408
|
var import_lucide_react7 = require("lucide-react");
|
|
3327
|
-
var
|
|
3409
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
3328
3410
|
var DefaultOpenIcon = ({
|
|
3329
3411
|
className,
|
|
3330
3412
|
...props
|
|
3331
|
-
}) => /* @__PURE__ */ (0,
|
|
3413
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react7.MessageCircle, { className: cn("h-6 w-6", className), strokeWidth: 1.75, fill: "currentColor", ...props });
|
|
3332
3414
|
var DefaultCloseIcon = ({
|
|
3333
3415
|
className,
|
|
3334
3416
|
...props
|
|
3335
|
-
}) => /* @__PURE__ */ (0,
|
|
3417
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react7.X, { className: cn("h-6 w-6", className), strokeWidth: 1.75, ...props });
|
|
3336
3418
|
DefaultOpenIcon.displayName = "CopilotChatToggleButton.OpenIcon";
|
|
3337
3419
|
DefaultCloseIcon.displayName = "CopilotChatToggleButton.CloseIcon";
|
|
3338
3420
|
var ICON_TRANSITION_STYLE = Object.freeze({
|
|
@@ -3349,11 +3431,11 @@ var BUTTON_BASE_CLASSES = cn(
|
|
|
3349
3431
|
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50 focus-visible:ring-offset-2 focus-visible:ring-offset-background",
|
|
3350
3432
|
"disabled:pointer-events-none disabled:opacity-60"
|
|
3351
3433
|
);
|
|
3352
|
-
var CopilotChatToggleButton =
|
|
3434
|
+
var CopilotChatToggleButton = import_react24.default.forwardRef(function CopilotChatToggleButton2({ openIcon, closeIcon, className, ...buttonProps }, ref) {
|
|
3353
3435
|
const { onClick, type, disabled, ...restProps } = buttonProps;
|
|
3354
3436
|
const configuration = useCopilotChatConfiguration();
|
|
3355
3437
|
const labels = configuration?.labels ?? CopilotChatDefaultLabels;
|
|
3356
|
-
const [fallbackOpen, setFallbackOpen] = (0,
|
|
3438
|
+
const [fallbackOpen, setFallbackOpen] = (0, import_react24.useState)(false);
|
|
3357
3439
|
const isOpen = configuration?.isModalOpen ?? fallbackOpen;
|
|
3358
3440
|
const setModalOpen = configuration?.setModalOpen ?? setFallbackOpen;
|
|
3359
3441
|
const handleClick = (event) => {
|
|
@@ -3387,7 +3469,7 @@ var CopilotChatToggleButton = import_react23.default.forwardRef(function Copilot
|
|
|
3387
3469
|
focusable: false
|
|
3388
3470
|
}
|
|
3389
3471
|
);
|
|
3390
|
-
const openIconElement = /* @__PURE__ */ (0,
|
|
3472
|
+
const openIconElement = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
3391
3473
|
"span",
|
|
3392
3474
|
{
|
|
3393
3475
|
"aria-hidden": "true",
|
|
@@ -3401,7 +3483,7 @@ var CopilotChatToggleButton = import_react23.default.forwardRef(function Copilot
|
|
|
3401
3483
|
children: renderedOpenIcon
|
|
3402
3484
|
}
|
|
3403
3485
|
);
|
|
3404
|
-
const closeIconElement = /* @__PURE__ */ (0,
|
|
3486
|
+
const closeIconElement = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
|
|
3405
3487
|
"span",
|
|
3406
3488
|
{
|
|
3407
3489
|
"aria-hidden": "true",
|
|
@@ -3415,7 +3497,7 @@ var CopilotChatToggleButton = import_react23.default.forwardRef(function Copilot
|
|
|
3415
3497
|
children: renderedCloseIcon
|
|
3416
3498
|
}
|
|
3417
3499
|
);
|
|
3418
|
-
return /* @__PURE__ */ (0,
|
|
3500
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
|
|
3419
3501
|
"button",
|
|
3420
3502
|
{
|
|
3421
3503
|
ref,
|
|
@@ -3439,12 +3521,12 @@ CopilotChatToggleButton.displayName = "CopilotChatToggleButton";
|
|
|
3439
3521
|
var CopilotChatToggleButton_default = CopilotChatToggleButton;
|
|
3440
3522
|
|
|
3441
3523
|
// src/components/chat/CopilotSidebarView.tsx
|
|
3442
|
-
var
|
|
3524
|
+
var import_react26 = require("react");
|
|
3443
3525
|
|
|
3444
3526
|
// src/components/chat/CopilotModalHeader.tsx
|
|
3445
|
-
var
|
|
3527
|
+
var import_react25 = require("react");
|
|
3446
3528
|
var import_lucide_react8 = require("lucide-react");
|
|
3447
|
-
var
|
|
3529
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
3448
3530
|
function CopilotModalHeader({
|
|
3449
3531
|
title,
|
|
3450
3532
|
titleContent,
|
|
@@ -3456,7 +3538,7 @@ function CopilotModalHeader({
|
|
|
3456
3538
|
const configuration = useCopilotChatConfiguration();
|
|
3457
3539
|
const fallbackTitle = configuration?.labels.modalHeaderTitle ?? CopilotChatDefaultLabels.modalHeaderTitle;
|
|
3458
3540
|
const resolvedTitle = title ?? fallbackTitle;
|
|
3459
|
-
const handleClose = (0,
|
|
3541
|
+
const handleClose = (0, import_react25.useCallback)(() => {
|
|
3460
3542
|
configuration?.setModalOpen(false);
|
|
3461
3543
|
}, [configuration]);
|
|
3462
3544
|
const BoundTitle = renderSlot(titleContent, CopilotModalHeader.Title, {
|
|
@@ -3473,7 +3555,7 @@ function CopilotModalHeader({
|
|
|
3473
3555
|
...rest
|
|
3474
3556
|
});
|
|
3475
3557
|
}
|
|
3476
|
-
return /* @__PURE__ */ (0,
|
|
3558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
3477
3559
|
"header",
|
|
3478
3560
|
{
|
|
3479
3561
|
"data-slot": "copilot-modal-header",
|
|
@@ -3483,17 +3565,17 @@ function CopilotModalHeader({
|
|
|
3483
3565
|
className
|
|
3484
3566
|
),
|
|
3485
3567
|
...rest,
|
|
3486
|
-
children: /* @__PURE__ */ (0,
|
|
3487
|
-
/* @__PURE__ */ (0,
|
|
3488
|
-
/* @__PURE__ */ (0,
|
|
3489
|
-
/* @__PURE__ */ (0,
|
|
3568
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex w-full items-center gap-2", children: [
|
|
3569
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1", "aria-hidden": "true" }),
|
|
3570
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex flex-1 justify-center text-center", children: BoundTitle }),
|
|
3571
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex flex-1 justify-end", children: BoundCloseButton })
|
|
3490
3572
|
] })
|
|
3491
3573
|
}
|
|
3492
3574
|
);
|
|
3493
3575
|
}
|
|
3494
3576
|
CopilotModalHeader.displayName = "CopilotModalHeader";
|
|
3495
3577
|
((CopilotModalHeader2) => {
|
|
3496
|
-
CopilotModalHeader2.Title = ({ children, className, ...props }) => /* @__PURE__ */ (0,
|
|
3578
|
+
CopilotModalHeader2.Title = ({ children, className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
3497
3579
|
"div",
|
|
3498
3580
|
{
|
|
3499
3581
|
className: cn(
|
|
@@ -3507,7 +3589,7 @@ CopilotModalHeader.displayName = "CopilotModalHeader";
|
|
|
3507
3589
|
CopilotModalHeader2.CloseButton = ({
|
|
3508
3590
|
className,
|
|
3509
3591
|
...props
|
|
3510
|
-
}) => /* @__PURE__ */ (0,
|
|
3592
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
3511
3593
|
"button",
|
|
3512
3594
|
{
|
|
3513
3595
|
type: "button",
|
|
@@ -3518,7 +3600,7 @@ CopilotModalHeader.displayName = "CopilotModalHeader";
|
|
|
3518
3600
|
),
|
|
3519
3601
|
"aria-label": "Close",
|
|
3520
3602
|
...props,
|
|
3521
|
-
children: /* @__PURE__ */ (0,
|
|
3603
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react8.X, { className: "h-4 w-4", "aria-hidden": "true" })
|
|
3522
3604
|
}
|
|
3523
3605
|
);
|
|
3524
3606
|
})(CopilotModalHeader || (CopilotModalHeader = {}));
|
|
@@ -3526,14 +3608,14 @@ CopilotModalHeader.Title.displayName = "CopilotModalHeader.Title";
|
|
|
3526
3608
|
CopilotModalHeader.CloseButton.displayName = "CopilotModalHeader.CloseButton";
|
|
3527
3609
|
|
|
3528
3610
|
// src/components/chat/CopilotSidebarView.tsx
|
|
3529
|
-
var
|
|
3611
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
3530
3612
|
var DEFAULT_SIDEBAR_WIDTH = 480;
|
|
3531
3613
|
var SIDEBAR_TRANSITION_MS = 260;
|
|
3532
3614
|
function CopilotSidebarView({ header, width, ...props }) {
|
|
3533
3615
|
const configuration = useCopilotChatConfiguration();
|
|
3534
3616
|
const isSidebarOpen = configuration?.isModalOpen ?? false;
|
|
3535
|
-
const sidebarRef = (0,
|
|
3536
|
-
const [sidebarWidth, setSidebarWidth] = (0,
|
|
3617
|
+
const sidebarRef = (0, import_react26.useRef)(null);
|
|
3618
|
+
const [sidebarWidth, setSidebarWidth] = (0, import_react26.useState)(width ?? DEFAULT_SIDEBAR_WIDTH);
|
|
3537
3619
|
const widthToCss = (w) => {
|
|
3538
3620
|
return typeof w === "number" ? `${w}px` : w;
|
|
3539
3621
|
};
|
|
@@ -3543,7 +3625,7 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3543
3625
|
}
|
|
3544
3626
|
return w;
|
|
3545
3627
|
};
|
|
3546
|
-
(0,
|
|
3628
|
+
(0, import_react26.useEffect)(() => {
|
|
3547
3629
|
if (width !== void 0) {
|
|
3548
3630
|
return;
|
|
3549
3631
|
}
|
|
@@ -3570,8 +3652,8 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3570
3652
|
return () => window.removeEventListener("resize", updateWidth);
|
|
3571
3653
|
}, [width]);
|
|
3572
3654
|
const headerElement = renderSlot(header, CopilotModalHeader, {});
|
|
3573
|
-
return /* @__PURE__ */ (0,
|
|
3574
|
-
isSidebarOpen && /* @__PURE__ */ (0,
|
|
3655
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
|
|
3656
|
+
isSidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
3575
3657
|
"style",
|
|
3576
3658
|
{
|
|
3577
3659
|
dangerouslySetInnerHTML: {
|
|
@@ -3585,8 +3667,8 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3585
3667
|
}
|
|
3586
3668
|
}
|
|
3587
3669
|
),
|
|
3588
|
-
/* @__PURE__ */ (0,
|
|
3589
|
-
/* @__PURE__ */ (0,
|
|
3670
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CopilotChatToggleButton_default, {}),
|
|
3671
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
3590
3672
|
"aside",
|
|
3591
3673
|
{
|
|
3592
3674
|
ref: sidebarRef,
|
|
@@ -3611,9 +3693,9 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3611
3693
|
"aria-hidden": !isSidebarOpen,
|
|
3612
3694
|
"aria-label": "Copilot chat sidebar",
|
|
3613
3695
|
role: "complementary",
|
|
3614
|
-
children: /* @__PURE__ */ (0,
|
|
3696
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex h-full w-full flex-col overflow-hidden", children: [
|
|
3615
3697
|
headerElement,
|
|
3616
|
-
/* @__PURE__ */ (0,
|
|
3698
|
+
/* @__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
3699
|
] })
|
|
3618
3700
|
}
|
|
3619
3701
|
)
|
|
@@ -3622,8 +3704,8 @@ function CopilotSidebarView({ header, width, ...props }) {
|
|
|
3622
3704
|
CopilotSidebarView.displayName = "CopilotSidebarView";
|
|
3623
3705
|
|
|
3624
3706
|
// src/components/chat/CopilotPopupView.tsx
|
|
3625
|
-
var
|
|
3626
|
-
var
|
|
3707
|
+
var import_react27 = require("react");
|
|
3708
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
3627
3709
|
var DEFAULT_POPUP_WIDTH = 420;
|
|
3628
3710
|
var DEFAULT_POPUP_HEIGHT = 560;
|
|
3629
3711
|
var dimensionToCss = (value, fallback) => {
|
|
@@ -3647,10 +3729,10 @@ function CopilotPopupView({
|
|
|
3647
3729
|
const isPopupOpen = configuration?.isModalOpen ?? false;
|
|
3648
3730
|
const setModalOpen = configuration?.setModalOpen;
|
|
3649
3731
|
const labels = configuration?.labels ?? CopilotChatDefaultLabels;
|
|
3650
|
-
const containerRef = (0,
|
|
3651
|
-
const [isRendered, setIsRendered] = (0,
|
|
3652
|
-
const [isAnimatingOut, setIsAnimatingOut] = (0,
|
|
3653
|
-
(0,
|
|
3732
|
+
const containerRef = (0, import_react27.useRef)(null);
|
|
3733
|
+
const [isRendered, setIsRendered] = (0, import_react27.useState)(isPopupOpen);
|
|
3734
|
+
const [isAnimatingOut, setIsAnimatingOut] = (0, import_react27.useState)(false);
|
|
3735
|
+
(0, import_react27.useEffect)(() => {
|
|
3654
3736
|
if (isPopupOpen) {
|
|
3655
3737
|
setIsRendered(true);
|
|
3656
3738
|
setIsAnimatingOut(false);
|
|
@@ -3666,7 +3748,7 @@ function CopilotPopupView({
|
|
|
3666
3748
|
}, 200);
|
|
3667
3749
|
return () => clearTimeout(timeout);
|
|
3668
3750
|
}, [isPopupOpen, isRendered]);
|
|
3669
|
-
(0,
|
|
3751
|
+
(0, import_react27.useEffect)(() => {
|
|
3670
3752
|
if (!isPopupOpen) {
|
|
3671
3753
|
return;
|
|
3672
3754
|
}
|
|
@@ -3682,7 +3764,7 @@ function CopilotPopupView({
|
|
|
3682
3764
|
window.addEventListener("keydown", handleKeyDown);
|
|
3683
3765
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
3684
3766
|
}, [isPopupOpen, setModalOpen]);
|
|
3685
|
-
(0,
|
|
3767
|
+
(0, import_react27.useEffect)(() => {
|
|
3686
3768
|
if (!isPopupOpen) {
|
|
3687
3769
|
return;
|
|
3688
3770
|
}
|
|
@@ -3691,7 +3773,7 @@ function CopilotPopupView({
|
|
|
3691
3773
|
}, 200);
|
|
3692
3774
|
return () => clearTimeout(focusTimer);
|
|
3693
3775
|
}, [isPopupOpen]);
|
|
3694
|
-
(0,
|
|
3776
|
+
(0, import_react27.useEffect)(() => {
|
|
3695
3777
|
if (!isPopupOpen || !clickOutsideToClose) {
|
|
3696
3778
|
return;
|
|
3697
3779
|
}
|
|
@@ -3716,10 +3798,10 @@ function CopilotPopupView({
|
|
|
3716
3798
|
document.addEventListener("pointerdown", handlePointerDown);
|
|
3717
3799
|
return () => document.removeEventListener("pointerdown", handlePointerDown);
|
|
3718
3800
|
}, [isPopupOpen, clickOutsideToClose, setModalOpen]);
|
|
3719
|
-
const headerElement = (0,
|
|
3801
|
+
const headerElement = (0, import_react27.useMemo)(() => renderSlot(header, CopilotModalHeader, {}), [header]);
|
|
3720
3802
|
const resolvedWidth = dimensionToCss(width, DEFAULT_POPUP_WIDTH);
|
|
3721
3803
|
const resolvedHeight = dimensionToCss(height, DEFAULT_POPUP_HEIGHT);
|
|
3722
|
-
const popupStyle = (0,
|
|
3804
|
+
const popupStyle = (0, import_react27.useMemo)(
|
|
3723
3805
|
() => ({
|
|
3724
3806
|
"--copilot-popup-width": resolvedWidth,
|
|
3725
3807
|
"--copilot-popup-height": resolvedHeight,
|
|
@@ -3733,14 +3815,14 @@ function CopilotPopupView({
|
|
|
3733
3815
|
[resolvedHeight, resolvedWidth]
|
|
3734
3816
|
);
|
|
3735
3817
|
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,
|
|
3818
|
+
const popupContent = isRendered ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
3737
3819
|
"div",
|
|
3738
3820
|
{
|
|
3739
3821
|
className: cn(
|
|
3740
3822
|
"fixed inset-0 z-[1200] flex max-w-full flex-col items-stretch",
|
|
3741
3823
|
"md:inset-auto md:bottom-24 md:right-6 md:items-end md:gap-4"
|
|
3742
3824
|
),
|
|
3743
|
-
children: /* @__PURE__ */ (0,
|
|
3825
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
|
|
3744
3826
|
"div",
|
|
3745
3827
|
{
|
|
3746
3828
|
ref: containerRef,
|
|
@@ -3761,7 +3843,7 @@ function CopilotPopupView({
|
|
|
3761
3843
|
style: popupStyle,
|
|
3762
3844
|
children: [
|
|
3763
3845
|
headerElement,
|
|
3764
|
-
/* @__PURE__ */ (0,
|
|
3846
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex-1 overflow-hidden", "data-popup-chat": true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
3765
3847
|
CopilotChatView_default,
|
|
3766
3848
|
{
|
|
3767
3849
|
...restProps,
|
|
@@ -3773,21 +3855,21 @@ function CopilotPopupView({
|
|
|
3773
3855
|
)
|
|
3774
3856
|
}
|
|
3775
3857
|
) : null;
|
|
3776
|
-
return /* @__PURE__ */ (0,
|
|
3777
|
-
/* @__PURE__ */ (0,
|
|
3858
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
|
|
3859
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CopilotChatToggleButton_default, {}),
|
|
3778
3860
|
popupContent
|
|
3779
3861
|
] });
|
|
3780
3862
|
}
|
|
3781
3863
|
CopilotPopupView.displayName = "CopilotPopupView";
|
|
3782
3864
|
|
|
3783
3865
|
// src/components/chat/CopilotSidebar.tsx
|
|
3784
|
-
var
|
|
3785
|
-
var
|
|
3866
|
+
var import_react28 = require("react");
|
|
3867
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
3786
3868
|
function CopilotSidebar({ header, defaultOpen, width, ...chatProps }) {
|
|
3787
|
-
const SidebarViewOverride = (0,
|
|
3869
|
+
const SidebarViewOverride = (0, import_react28.useMemo)(() => {
|
|
3788
3870
|
const Component = (viewProps) => {
|
|
3789
3871
|
const { header: viewHeader, width: viewWidth, ...restProps } = viewProps;
|
|
3790
|
-
return /* @__PURE__ */ (0,
|
|
3872
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3791
3873
|
CopilotSidebarView,
|
|
3792
3874
|
{
|
|
3793
3875
|
...restProps,
|
|
@@ -3798,7 +3880,7 @@ function CopilotSidebar({ header, defaultOpen, width, ...chatProps }) {
|
|
|
3798
3880
|
};
|
|
3799
3881
|
return Object.assign(Component, CopilotChatView_default);
|
|
3800
3882
|
}, [header, width]);
|
|
3801
|
-
return /* @__PURE__ */ (0,
|
|
3883
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3802
3884
|
CopilotChat,
|
|
3803
3885
|
{
|
|
3804
3886
|
...chatProps,
|
|
@@ -3810,8 +3892,8 @@ function CopilotSidebar({ header, defaultOpen, width, ...chatProps }) {
|
|
|
3810
3892
|
CopilotSidebar.displayName = "CopilotSidebar";
|
|
3811
3893
|
|
|
3812
3894
|
// src/components/chat/CopilotPopup.tsx
|
|
3813
|
-
var
|
|
3814
|
-
var
|
|
3895
|
+
var import_react29 = require("react");
|
|
3896
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
3815
3897
|
function CopilotPopup({
|
|
3816
3898
|
header,
|
|
3817
3899
|
defaultOpen,
|
|
@@ -3820,7 +3902,7 @@ function CopilotPopup({
|
|
|
3820
3902
|
clickOutsideToClose,
|
|
3821
3903
|
...chatProps
|
|
3822
3904
|
}) {
|
|
3823
|
-
const PopupViewOverride = (0,
|
|
3905
|
+
const PopupViewOverride = (0, import_react29.useMemo)(() => {
|
|
3824
3906
|
const Component = (viewProps) => {
|
|
3825
3907
|
const {
|
|
3826
3908
|
header: viewHeader,
|
|
@@ -3829,7 +3911,7 @@ function CopilotPopup({
|
|
|
3829
3911
|
clickOutsideToClose: viewClickOutsideToClose,
|
|
3830
3912
|
...restProps
|
|
3831
3913
|
} = viewProps;
|
|
3832
|
-
return /* @__PURE__ */ (0,
|
|
3914
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3833
3915
|
CopilotPopupView,
|
|
3834
3916
|
{
|
|
3835
3917
|
...restProps,
|
|
@@ -3842,7 +3924,7 @@ function CopilotPopup({
|
|
|
3842
3924
|
};
|
|
3843
3925
|
return Object.assign(Component, CopilotChatView_default);
|
|
3844
3926
|
}, [clickOutsideToClose, header, height, width]);
|
|
3845
|
-
return /* @__PURE__ */ (0,
|
|
3927
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
3846
3928
|
CopilotChat,
|
|
3847
3929
|
{
|
|
3848
3930
|
...chatProps,
|
|
@@ -3866,25 +3948,25 @@ function defineToolCallRenderer(def) {
|
|
|
3866
3948
|
}
|
|
3867
3949
|
|
|
3868
3950
|
// src/components/WildcardToolCallRender.tsx
|
|
3869
|
-
var
|
|
3870
|
-
var
|
|
3951
|
+
var import_react30 = require("react");
|
|
3952
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
3871
3953
|
var WildcardToolCallRender = defineToolCallRenderer({
|
|
3872
3954
|
name: "*",
|
|
3873
3955
|
render: ({ args, result, name, status }) => {
|
|
3874
|
-
const [isExpanded, setIsExpanded] = (0,
|
|
3956
|
+
const [isExpanded, setIsExpanded] = (0, import_react30.useState)(false);
|
|
3875
3957
|
const statusString = String(status);
|
|
3876
3958
|
const isActive = statusString === "inProgress" || statusString === "executing";
|
|
3877
3959
|
const isComplete = statusString === "complete";
|
|
3878
3960
|
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,
|
|
3961
|
+
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: [
|
|
3962
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
|
|
3881
3963
|
"div",
|
|
3882
3964
|
{
|
|
3883
3965
|
className: "flex items-center justify-between gap-3 cursor-pointer",
|
|
3884
3966
|
onClick: () => setIsExpanded(!isExpanded),
|
|
3885
3967
|
children: [
|
|
3886
|
-
/* @__PURE__ */ (0,
|
|
3887
|
-
/* @__PURE__ */ (0,
|
|
3968
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex items-center gap-2 min-w-0", children: [
|
|
3969
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3888
3970
|
"svg",
|
|
3889
3971
|
{
|
|
3890
3972
|
className: `h-4 w-4 text-zinc-500 dark:text-zinc-400 transition-transform ${isExpanded ? "rotate-90" : ""}`,
|
|
@@ -3892,7 +3974,7 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3892
3974
|
viewBox: "0 0 24 24",
|
|
3893
3975
|
strokeWidth: 2,
|
|
3894
3976
|
stroke: "currentColor",
|
|
3895
|
-
children: /* @__PURE__ */ (0,
|
|
3977
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3896
3978
|
"path",
|
|
3897
3979
|
{
|
|
3898
3980
|
strokeLinecap: "round",
|
|
@@ -3902,10 +3984,10 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3902
3984
|
)
|
|
3903
3985
|
}
|
|
3904
3986
|
),
|
|
3905
|
-
/* @__PURE__ */ (0,
|
|
3906
|
-
/* @__PURE__ */ (0,
|
|
3987
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "inline-block h-2 w-2 rounded-full bg-blue-500" }),
|
|
3988
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "truncate text-sm font-medium text-zinc-900 dark:text-zinc-100", children: name })
|
|
3907
3989
|
] }),
|
|
3908
|
-
/* @__PURE__ */ (0,
|
|
3990
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
|
|
3909
3991
|
"span",
|
|
3910
3992
|
{
|
|
3911
3993
|
className: `inline-flex items-center rounded-full px-2 py-1 text-xs font-medium ${statusStyles}`,
|
|
@@ -3915,14 +3997,14 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3915
3997
|
]
|
|
3916
3998
|
}
|
|
3917
3999
|
),
|
|
3918
|
-
isExpanded && /* @__PURE__ */ (0,
|
|
3919
|
-
/* @__PURE__ */ (0,
|
|
3920
|
-
/* @__PURE__ */ (0,
|
|
3921
|
-
/* @__PURE__ */ (0,
|
|
4000
|
+
isExpanded && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "mt-3 grid gap-4", children: [
|
|
4001
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { children: [
|
|
4002
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "text-xs uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: "Arguments" }),
|
|
4003
|
+
/* @__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
4004
|
] }),
|
|
3923
|
-
result !== void 0 && /* @__PURE__ */ (0,
|
|
3924
|
-
/* @__PURE__ */ (0,
|
|
3925
|
-
/* @__PURE__ */ (0,
|
|
4005
|
+
result !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { children: [
|
|
4006
|
+
/* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "text-xs uppercase tracking-wide text-zinc-500 dark:text-zinc-400", children: "Result" }),
|
|
4007
|
+
/* @__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
4008
|
] })
|
|
3927
4009
|
] })
|
|
3928
4010
|
] }) });
|
|
@@ -3962,6 +4044,7 @@ var WildcardToolCallRender = defineToolCallRenderer({
|
|
|
3962
4044
|
useCopilotKit,
|
|
3963
4045
|
useFrontendTool,
|
|
3964
4046
|
useHumanInTheLoop,
|
|
4047
|
+
useRenderActivityMessage,
|
|
3965
4048
|
useRenderCustomMessages,
|
|
3966
4049
|
useRenderToolCall,
|
|
3967
4050
|
useSuggestions
|