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