@copilotkit/react-ui 1.8.4 → 1.8.5-next.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.
Files changed (69) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/{chunk-6F2ZAK7T.mjs → chunk-4TWPMWD4.mjs} +2 -2
  3. package/dist/{chunk-7RIBDD4K.mjs → chunk-62QMTKMJ.mjs} +22 -7
  4. package/dist/chunk-62QMTKMJ.mjs.map +1 -0
  5. package/dist/{chunk-LGMQR7XG.mjs → chunk-6QV7AIIG.mjs} +2 -2
  6. package/dist/{chunk-7EDMOLGH.mjs → chunk-MYUOPOIL.mjs} +15 -14
  7. package/dist/chunk-MYUOPOIL.mjs.map +1 -0
  8. package/dist/{chunk-XB6QCUPB.mjs → chunk-NMNC4ROZ.mjs} +20 -8
  9. package/dist/chunk-NMNC4ROZ.mjs.map +1 -0
  10. package/dist/{chunk-UWWMAJ7R.mjs → chunk-Q2YY2NX3.mjs} +20 -8
  11. package/dist/chunk-Q2YY2NX3.mjs.map +1 -0
  12. package/dist/{chunk-QTD2KREC.mjs → chunk-U6ISBBRF.mjs} +2 -2
  13. package/dist/{chunk-WEYDZBT7.mjs → chunk-WNC6OCIB.mjs} +16 -4
  14. package/dist/chunk-WNC6OCIB.mjs.map +1 -0
  15. package/dist/components/chat/Chat.d.ts +8 -3
  16. package/dist/components/chat/Chat.js +327 -306
  17. package/dist/components/chat/Chat.js.map +1 -1
  18. package/dist/components/chat/Chat.mjs +5 -5
  19. package/dist/components/chat/Modal.js +327 -306
  20. package/dist/components/chat/Modal.js.map +1 -1
  21. package/dist/components/chat/Modal.mjs +6 -6
  22. package/dist/components/chat/Popup.js +327 -306
  23. package/dist/components/chat/Popup.js.map +1 -1
  24. package/dist/components/chat/Popup.mjs +7 -7
  25. package/dist/components/chat/Sidebar.js +327 -306
  26. package/dist/components/chat/Sidebar.js.map +1 -1
  27. package/dist/components/chat/Sidebar.mjs +7 -7
  28. package/dist/components/chat/index.js +327 -306
  29. package/dist/components/chat/index.js.map +1 -1
  30. package/dist/components/chat/index.mjs +8 -8
  31. package/dist/components/chat/messages/RenderActionExecutionMessage.d.ts +1 -1
  32. package/dist/components/chat/messages/RenderActionExecutionMessage.js +696 -15
  33. package/dist/components/chat/messages/RenderActionExecutionMessage.js.map +1 -1
  34. package/dist/components/chat/messages/RenderActionExecutionMessage.mjs +7 -1
  35. package/dist/components/chat/messages/RenderAgentStateMessage.d.ts +1 -1
  36. package/dist/components/chat/messages/RenderAgentStateMessage.js +693 -12
  37. package/dist/components/chat/messages/RenderAgentStateMessage.js.map +1 -1
  38. package/dist/components/chat/messages/RenderAgentStateMessage.mjs +7 -1
  39. package/dist/components/chat/messages/RenderResultMessage.d.ts +1 -1
  40. package/dist/components/chat/messages/RenderResultMessage.js +685 -4
  41. package/dist/components/chat/messages/RenderResultMessage.js.map +1 -1
  42. package/dist/components/chat/messages/RenderResultMessage.mjs +7 -1
  43. package/dist/components/chat/messages/RenderTextMessage.d.ts +1 -1
  44. package/dist/components/chat/messages/RenderTextMessage.js +695 -8
  45. package/dist/components/chat/messages/RenderTextMessage.js.map +1 -1
  46. package/dist/components/chat/messages/RenderTextMessage.mjs +8 -1
  47. package/dist/components/chat/props.d.ts +4 -4
  48. package/dist/components/chat/props.js.map +1 -1
  49. package/dist/components/index.js +327 -306
  50. package/dist/components/index.js.map +1 -1
  51. package/dist/components/index.mjs +8 -8
  52. package/dist/index.js +327 -306
  53. package/dist/index.js.map +1 -1
  54. package/dist/index.mjs +8 -8
  55. package/package.json +4 -4
  56. package/src/components/chat/Chat.tsx +13 -7
  57. package/src/components/chat/messages/RenderActionExecutionMessage.tsx +6 -2
  58. package/src/components/chat/messages/RenderAgentStateMessage.tsx +6 -2
  59. package/src/components/chat/messages/RenderResultMessage.tsx +6 -2
  60. package/src/components/chat/messages/RenderTextMessage.tsx +8 -4
  61. package/src/components/chat/props.ts +4 -4
  62. package/dist/chunk-7EDMOLGH.mjs.map +0 -1
  63. package/dist/chunk-7RIBDD4K.mjs.map +0 -1
  64. package/dist/chunk-UWWMAJ7R.mjs.map +0 -1
  65. package/dist/chunk-WEYDZBT7.mjs.map +0 -1
  66. package/dist/chunk-XB6QCUPB.mjs.map +0 -1
  67. /package/dist/{chunk-6F2ZAK7T.mjs.map → chunk-4TWPMWD4.mjs.map} +0 -0
  68. /package/dist/{chunk-LGMQR7XG.mjs.map → chunk-6QV7AIIG.mjs.map} +0 -0
  69. /package/dist/{chunk-QTD2KREC.mjs.map → chunk-U6ISBBRF.mjs.map} +0 -0
@@ -1,8 +1,39 @@
1
1
  "use strict";
2
+ var __create = Object.create;
2
3
  var __defProp = Object.defineProperty;
4
+ var __defProps = Object.defineProperties;
3
5
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
7
  var __getOwnPropNames = Object.getOwnPropertyNames;
8
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
9
+ var __getProtoOf = Object.getPrototypeOf;
5
10
  var __hasOwnProp = Object.prototype.hasOwnProperty;
11
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
12
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
13
+ var __spreadValues = (a, b) => {
14
+ for (var prop in b || (b = {}))
15
+ if (__hasOwnProp.call(b, prop))
16
+ __defNormalProp(a, prop, b[prop]);
17
+ if (__getOwnPropSymbols)
18
+ for (var prop of __getOwnPropSymbols(b)) {
19
+ if (__propIsEnum.call(b, prop))
20
+ __defNormalProp(a, prop, b[prop]);
21
+ }
22
+ return a;
23
+ };
24
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
25
+ var __objRest = (source, exclude) => {
26
+ var target = {};
27
+ for (var prop in source)
28
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
29
+ target[prop] = source[prop];
30
+ if (source != null && __getOwnPropSymbols)
31
+ for (var prop of __getOwnPropSymbols(source)) {
32
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
33
+ target[prop] = source[prop];
34
+ }
35
+ return target;
36
+ };
6
37
  var __export = (target, all) => {
7
38
  for (var name in all)
8
39
  __defProp(target, name, { get: all[name], enumerable: true });
@@ -15,6 +46,14 @@ var __copyProps = (to, from, except, desc) => {
15
46
  }
16
47
  return to;
17
48
  };
49
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
50
+ // If the importer is in node compatibility mode or this is not an ESM
51
+ // file that has been converted to a CommonJS file using a Babel-
52
+ // compatible transform (i.e. "__esModule" has not been set), then set
53
+ // "default" to the CommonJS "module.exports" for node compatibility.
54
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
55
+ mod
56
+ ));
18
57
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
58
 
20
59
  // src/components/chat/messages/RenderResultMessage.tsx
@@ -23,12 +62,654 @@ __export(RenderResultMessage_exports, {
23
62
  RenderResultMessage: () => RenderResultMessage
24
63
  });
25
64
  module.exports = __toCommonJS(RenderResultMessage_exports);
65
+
66
+ // src/components/chat/ChatContext.tsx
67
+ var import_react = __toESM(require("react"));
68
+
69
+ // src/components/chat/Icons.tsx
26
70
  var import_jsx_runtime = require("react/jsx-runtime");
27
- function RenderResultMessage(props) {
28
- const { message, inProgress, index, isCurrentMessage, AssistantMessage } = props;
71
+ var CopyIcon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
72
+ "svg",
73
+ {
74
+ xmlns: "http://www.w3.org/2000/svg",
75
+ fill: "none",
76
+ viewBox: "0 0 24 24",
77
+ strokeWidth: "2",
78
+ stroke: "currentColor",
79
+ width: "16",
80
+ height: "16",
81
+ style: { minWidth: "16px", minHeight: "16px" },
82
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
83
+ "path",
84
+ {
85
+ strokeLinecap: "round",
86
+ strokeLinejoin: "round",
87
+ d: "M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 01-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 011.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 00-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 01-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5a3.375 3.375 0 00-3.375-3.375H9.75"
88
+ }
89
+ )
90
+ }
91
+ );
92
+ var DownloadIcon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
93
+ "svg",
94
+ {
95
+ xmlns: "http://www.w3.org/2000/svg",
96
+ fill: "none",
97
+ viewBox: "0 0 24 24",
98
+ strokeWidth: "2",
99
+ stroke: "currentColor",
100
+ width: "16",
101
+ height: "16",
102
+ style: { minWidth: "16px", minHeight: "16px" },
103
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
104
+ "path",
105
+ {
106
+ strokeLinecap: "round",
107
+ strokeLinejoin: "round",
108
+ d: "M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3"
109
+ }
110
+ )
111
+ }
112
+ );
113
+ var CheckIcon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
114
+ "svg",
115
+ {
116
+ xmlns: "http://www.w3.org/2000/svg",
117
+ fill: "none",
118
+ viewBox: "0 0 24 24",
119
+ strokeWidth: "2",
120
+ stroke: "currentColor",
121
+ width: "16",
122
+ height: "16",
123
+ style: { minWidth: "16px", minHeight: "16px" },
124
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M4.5 12.75l6 6 9-13.5" })
125
+ }
126
+ );
127
+
128
+ // src/components/chat/ChatContext.tsx
129
+ var import_jsx_runtime2 = require("react/jsx-runtime");
130
+ var ChatContext = import_react.default.createContext(void 0);
131
+ function useChatContext() {
132
+ const context = import_react.default.useContext(ChatContext);
133
+ if (context === void 0) {
134
+ throw new Error(
135
+ "Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?"
136
+ );
137
+ }
138
+ return context;
139
+ }
140
+
141
+ // src/components/chat/Markdown.tsx
142
+ var import_react3 = require("react");
143
+ var import_react_markdown = __toESM(require("react-markdown"));
144
+
145
+ // src/components/chat/CodeBlock.tsx
146
+ var import_react2 = require("react");
147
+ var import_react_syntax_highlighter = require("react-syntax-highlighter");
148
+
149
+ // src/hooks/use-copy-to-clipboard.tsx
150
+ var React2 = __toESM(require("react"));
151
+ function useCopyToClipboard({ timeout = 2e3 }) {
152
+ const [isCopied, setIsCopied] = React2.useState(false);
153
+ const copyToClipboard = (value) => {
154
+ var _a;
155
+ if (typeof window === "undefined" || !((_a = navigator.clipboard) == null ? void 0 : _a.writeText)) {
156
+ return;
157
+ }
158
+ if (!value) {
159
+ return;
160
+ }
161
+ navigator.clipboard.writeText(value).then(() => {
162
+ setIsCopied(true);
163
+ setTimeout(() => {
164
+ setIsCopied(false);
165
+ }, timeout);
166
+ });
167
+ };
168
+ return { isCopied, copyToClipboard };
169
+ }
170
+
171
+ // src/components/chat/CodeBlock.tsx
172
+ var import_jsx_runtime3 = require("react/jsx-runtime");
173
+ var programmingLanguages = {
174
+ javascript: ".js",
175
+ python: ".py",
176
+ java: ".java",
177
+ c: ".c",
178
+ cpp: ".cpp",
179
+ "c++": ".cpp",
180
+ "c#": ".cs",
181
+ ruby: ".rb",
182
+ php: ".php",
183
+ swift: ".swift",
184
+ "objective-c": ".m",
185
+ kotlin: ".kt",
186
+ typescript: ".ts",
187
+ go: ".go",
188
+ perl: ".pl",
189
+ rust: ".rs",
190
+ scala: ".scala",
191
+ haskell: ".hs",
192
+ lua: ".lua",
193
+ shell: ".sh",
194
+ sql: ".sql",
195
+ html: ".html",
196
+ css: ".css"
197
+ // add more file extensions here, make sure the key is same as language prop in CodeBlock.tsx component
198
+ };
199
+ var generateRandomString = (length, lowercase = false) => {
200
+ const chars = "ABCDEFGHJKLMNPQRSTUVWXY3456789";
201
+ let result = "";
202
+ for (let i = 0; i < length; i++) {
203
+ result += chars.charAt(Math.floor(Math.random() * chars.length));
204
+ }
205
+ return lowercase ? result.toLowerCase() : result;
206
+ };
207
+ var CodeBlock = (0, import_react2.memo)(({ language, value }) => {
208
+ const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 2e3 });
209
+ const downloadAsFile = () => {
210
+ if (typeof window === "undefined") {
211
+ return;
212
+ }
213
+ const fileExtension = programmingLanguages[language] || ".file";
214
+ const suggestedFileName = `file-${generateRandomString(3, true)}${fileExtension}`;
215
+ const fileName = window.prompt("Enter file name", suggestedFileName);
216
+ if (!fileName) {
217
+ return;
218
+ }
219
+ const blob = new Blob([value], { type: "text/plain" });
220
+ const url = URL.createObjectURL(blob);
221
+ const link = document.createElement("a");
222
+ link.download = fileName;
223
+ link.href = url;
224
+ link.style.display = "none";
225
+ document.body.appendChild(link);
226
+ link.click();
227
+ document.body.removeChild(link);
228
+ URL.revokeObjectURL(url);
229
+ };
230
+ const onCopy = () => {
231
+ if (isCopied)
232
+ return;
233
+ copyToClipboard(value);
234
+ };
235
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "copilotKitCodeBlock", children: [
236
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "copilotKitCodeBlockToolbar", children: [
237
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "copilotKitCodeBlockToolbarLanguage", children: language }),
238
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "copilotKitCodeBlockToolbarButtons", children: [
239
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { className: "copilotKitCodeBlockToolbarButton", onClick: downloadAsFile, children: DownloadIcon }),
240
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { className: "copilotKitCodeBlockToolbarButton", onClick: onCopy, children: isCopied ? CheckIcon : CopyIcon })
241
+ ] })
242
+ ] }),
243
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
244
+ import_react_syntax_highlighter.Prism,
245
+ {
246
+ language,
247
+ style: highlightStyle,
248
+ PreTag: "div",
249
+ customStyle: {
250
+ margin: 0,
251
+ borderBottomLeftRadius: "0.375rem",
252
+ borderBottomRightRadius: "0.375rem"
253
+ },
254
+ children: value
255
+ }
256
+ )
257
+ ] });
258
+ });
259
+ CodeBlock.displayName = "CodeBlock";
260
+ var highlightStyle = {
261
+ 'pre[class*="language-"]': {
262
+ color: "#d4d4d4",
263
+ fontSize: "13px",
264
+ textShadow: "none",
265
+ fontFamily: 'Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono", "Courier New", monospace',
266
+ direction: "ltr",
267
+ textAlign: "left",
268
+ whiteSpace: "pre",
269
+ wordSpacing: "normal",
270
+ wordBreak: "normal",
271
+ lineHeight: "1.5",
272
+ MozTabSize: "4",
273
+ OTabSize: "4",
274
+ tabSize: "4",
275
+ WebkitHyphens: "none",
276
+ MozHyphens: "none",
277
+ msHyphens: "none",
278
+ hyphens: "none",
279
+ padding: "1em",
280
+ margin: ".5em 0",
281
+ overflow: "auto",
282
+ background: "#1e1e1e"
283
+ },
284
+ 'code[class*="language-"]': {
285
+ color: "#d4d4d4",
286
+ fontSize: "13px",
287
+ textShadow: "none",
288
+ fontFamily: 'Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono", "Courier New", monospace',
289
+ direction: "ltr",
290
+ textAlign: "left",
291
+ whiteSpace: "pre",
292
+ wordSpacing: "normal",
293
+ wordBreak: "normal",
294
+ lineHeight: "1.5",
295
+ MozTabSize: "4",
296
+ OTabSize: "4",
297
+ tabSize: "4",
298
+ WebkitHyphens: "none",
299
+ MozHyphens: "none",
300
+ msHyphens: "none",
301
+ hyphens: "none"
302
+ },
303
+ 'pre[class*="language-"]::selection': {
304
+ textShadow: "none",
305
+ background: "#264F78"
306
+ },
307
+ 'code[class*="language-"]::selection': {
308
+ textShadow: "none",
309
+ background: "#264F78"
310
+ },
311
+ 'pre[class*="language-"] *::selection': {
312
+ textShadow: "none",
313
+ background: "#264F78"
314
+ },
315
+ 'code[class*="language-"] *::selection': {
316
+ textShadow: "none",
317
+ background: "#264F78"
318
+ },
319
+ ':not(pre) > code[class*="language-"]': {
320
+ padding: ".1em .3em",
321
+ borderRadius: ".3em",
322
+ color: "#db4c69",
323
+ background: "#1e1e1e"
324
+ },
325
+ ".namespace": {
326
+ Opacity: ".7"
327
+ },
328
+ "doctype.doctype-tag": {
329
+ color: "#569CD6"
330
+ },
331
+ "doctype.name": {
332
+ color: "#9cdcfe"
333
+ },
334
+ comment: {
335
+ color: "#6a9955"
336
+ },
337
+ prolog: {
338
+ color: "#6a9955"
339
+ },
340
+ punctuation: {
341
+ color: "#d4d4d4"
342
+ },
343
+ ".language-html .language-css .token.punctuation": {
344
+ color: "#d4d4d4"
345
+ },
346
+ ".language-html .language-javascript .token.punctuation": {
347
+ color: "#d4d4d4"
348
+ },
349
+ property: {
350
+ color: "#9cdcfe"
351
+ },
352
+ tag: {
353
+ color: "#569cd6"
354
+ },
355
+ boolean: {
356
+ color: "#569cd6"
357
+ },
358
+ number: {
359
+ color: "#b5cea8"
360
+ },
361
+ constant: {
362
+ color: "#9cdcfe"
363
+ },
364
+ symbol: {
365
+ color: "#b5cea8"
366
+ },
367
+ inserted: {
368
+ color: "#b5cea8"
369
+ },
370
+ unit: {
371
+ color: "#b5cea8"
372
+ },
373
+ selector: {
374
+ color: "#d7ba7d"
375
+ },
376
+ "attr-name": {
377
+ color: "#9cdcfe"
378
+ },
379
+ string: {
380
+ color: "#ce9178"
381
+ },
382
+ char: {
383
+ color: "#ce9178"
384
+ },
385
+ builtin: {
386
+ color: "#ce9178"
387
+ },
388
+ deleted: {
389
+ color: "#ce9178"
390
+ },
391
+ ".language-css .token.string.url": {
392
+ textDecoration: "underline"
393
+ },
394
+ operator: {
395
+ color: "#d4d4d4"
396
+ },
397
+ entity: {
398
+ color: "#569cd6"
399
+ },
400
+ "operator.arrow": {
401
+ color: "#569CD6"
402
+ },
403
+ atrule: {
404
+ color: "#ce9178"
405
+ },
406
+ "atrule.rule": {
407
+ color: "#c586c0"
408
+ },
409
+ "atrule.url": {
410
+ color: "#9cdcfe"
411
+ },
412
+ "atrule.url.function": {
413
+ color: "#dcdcaa"
414
+ },
415
+ "atrule.url.punctuation": {
416
+ color: "#d4d4d4"
417
+ },
418
+ keyword: {
419
+ color: "#569CD6"
420
+ },
421
+ "keyword.module": {
422
+ color: "#c586c0"
423
+ },
424
+ "keyword.control-flow": {
425
+ color: "#c586c0"
426
+ },
427
+ function: {
428
+ color: "#dcdcaa"
429
+ },
430
+ "function.maybe-class-name": {
431
+ color: "#dcdcaa"
432
+ },
433
+ regex: {
434
+ color: "#d16969"
435
+ },
436
+ important: {
437
+ color: "#569cd6"
438
+ },
439
+ italic: {
440
+ fontStyle: "italic"
441
+ },
442
+ "class-name": {
443
+ color: "#4ec9b0"
444
+ },
445
+ "maybe-class-name": {
446
+ color: "#4ec9b0"
447
+ },
448
+ console: {
449
+ color: "#9cdcfe"
450
+ },
451
+ parameter: {
452
+ color: "#9cdcfe"
453
+ },
454
+ interpolation: {
455
+ color: "#9cdcfe"
456
+ },
457
+ "punctuation.interpolation-punctuation": {
458
+ color: "#569cd6"
459
+ },
460
+ variable: {
461
+ color: "#9cdcfe"
462
+ },
463
+ "imports.maybe-class-name": {
464
+ color: "#9cdcfe"
465
+ },
466
+ "exports.maybe-class-name": {
467
+ color: "#9cdcfe"
468
+ },
469
+ escape: {
470
+ color: "#d7ba7d"
471
+ },
472
+ "tag.punctuation": {
473
+ color: "#808080"
474
+ },
475
+ cdata: {
476
+ color: "#808080"
477
+ },
478
+ "attr-value": {
479
+ color: "#ce9178"
480
+ },
481
+ "attr-value.punctuation": {
482
+ color: "#ce9178"
483
+ },
484
+ "attr-value.punctuation.attr-equals": {
485
+ color: "#d4d4d4"
486
+ },
487
+ namespace: {
488
+ color: "#4ec9b0"
489
+ },
490
+ 'pre[class*="language-javascript"]': {
491
+ color: "#9cdcfe"
492
+ },
493
+ 'code[class*="language-javascript"]': {
494
+ color: "#9cdcfe"
495
+ },
496
+ 'pre[class*="language-jsx"]': {
497
+ color: "#9cdcfe"
498
+ },
499
+ 'code[class*="language-jsx"]': {
500
+ color: "#9cdcfe"
501
+ },
502
+ 'pre[class*="language-typescript"]': {
503
+ color: "#9cdcfe"
504
+ },
505
+ 'code[class*="language-typescript"]': {
506
+ color: "#9cdcfe"
507
+ },
508
+ 'pre[class*="language-tsx"]': {
509
+ color: "#9cdcfe"
510
+ },
511
+ 'code[class*="language-tsx"]': {
512
+ color: "#9cdcfe"
513
+ },
514
+ 'pre[class*="language-css"]': {
515
+ color: "#ce9178"
516
+ },
517
+ 'code[class*="language-css"]': {
518
+ color: "#ce9178"
519
+ },
520
+ 'pre[class*="language-html"]': {
521
+ color: "#d4d4d4"
522
+ },
523
+ 'code[class*="language-html"]': {
524
+ color: "#d4d4d4"
525
+ },
526
+ ".language-regex .token.anchor": {
527
+ color: "#dcdcaa"
528
+ },
529
+ ".language-html .token.punctuation": {
530
+ color: "#808080"
531
+ },
532
+ 'pre[class*="language-"] > code[class*="language-"]': {
533
+ position: "relative",
534
+ zIndex: "1"
535
+ },
536
+ ".line-highlight.line-highlight": {
537
+ background: "#f7ebc6",
538
+ boxShadow: "inset 5px 0 0 #f7d87c",
539
+ zIndex: "0"
540
+ }
541
+ };
542
+
543
+ // src/components/chat/Markdown.tsx
544
+ var import_remark_gfm = __toESM(require("remark-gfm"));
545
+ var import_remark_math = __toESM(require("remark-math"));
546
+ var import_jsx_runtime4 = require("react/jsx-runtime");
547
+ var MemoizedReactMarkdown = (0, import_react3.memo)(
548
+ import_react_markdown.default,
549
+ (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.className === nextProps.className
550
+ );
551
+ var Markdown = ({ content }) => {
552
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "copilotKitMarkdown", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MemoizedReactMarkdown, { components, remarkPlugins: [import_remark_gfm.default, import_remark_math.default], children: content }) });
553
+ };
554
+ var components = {
555
+ a(_a) {
556
+ var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
557
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
558
+ "a",
559
+ __spreadProps(__spreadValues({
560
+ style: { color: "blue", textDecoration: "underline" }
561
+ }, props), {
562
+ target: "_blank",
563
+ rel: "noopener noreferrer",
564
+ children
565
+ })
566
+ );
567
+ },
568
+ code(_c) {
569
+ var _d = _c, { children, className, inline } = _d, props = __objRest(_d, ["children", "className", "inline"]);
570
+ if (children.length) {
571
+ if (children[0] == "\u258D") {
572
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
573
+ "span",
574
+ {
575
+ style: {
576
+ animation: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite",
577
+ marginTop: "0.25rem"
578
+ },
579
+ children: "\u258D"
580
+ }
581
+ );
582
+ }
583
+ children[0] = children[0].replace("`\u258D`", "\u258D");
584
+ }
585
+ const match = /language-(\w+)/.exec(className || "");
586
+ if (inline) {
587
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("code", __spreadProps(__spreadValues({ className }, props), { children }));
588
+ }
589
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
590
+ CodeBlock,
591
+ __spreadValues({
592
+ language: match && match[1] || "",
593
+ value: String(children).replace(/\n$/, "")
594
+ }, props),
595
+ Math.random()
596
+ );
597
+ }
598
+ };
599
+
600
+ // src/components/chat/messages/AssistantMessage.tsx
601
+ var import_react4 = require("react");
602
+ var import_jsx_runtime5 = require("react/jsx-runtime");
603
+ var AssistantMessage = (props) => {
604
+ const { icons, labels } = useChatContext();
605
+ const {
606
+ message,
607
+ isLoading,
608
+ subComponent,
609
+ onRegenerate,
610
+ onCopy,
611
+ onThumbsUp,
612
+ onThumbsDown,
613
+ isCurrentMessage
614
+ } = props;
615
+ const [copied, setCopied] = (0, import_react4.useState)(false);
616
+ const handleCopy = () => {
617
+ if (message && onCopy) {
618
+ navigator.clipboard.writeText(message);
619
+ setCopied(true);
620
+ onCopy(message);
621
+ setTimeout(() => setCopied(false), 2e3);
622
+ } else if (message) {
623
+ navigator.clipboard.writeText(message);
624
+ setCopied(true);
625
+ setTimeout(() => setCopied(false), 2e3);
626
+ }
627
+ };
628
+ const handleRegenerate = () => {
629
+ if (onRegenerate) {
630
+ onRegenerate();
631
+ }
632
+ };
633
+ const handleThumbsUp = () => {
634
+ if (onThumbsUp && message) {
635
+ onThumbsUp(message);
636
+ }
637
+ };
638
+ const handleThumbsDown = () => {
639
+ if (onThumbsDown && message) {
640
+ onThumbsDown(message);
641
+ }
642
+ };
643
+ const LoadingIcon = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: icons.activityIcon });
644
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
645
+ (message || isLoading) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "copilotKitMessage copilotKitAssistantMessage", children: [
646
+ message && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Markdown, { content: message || "" }),
647
+ isLoading && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(LoadingIcon, {}),
648
+ message && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
649
+ "div",
650
+ {
651
+ className: `copilotKitMessageControls ${isCurrentMessage ? "currentMessage" : ""}`,
652
+ children: [
653
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
654
+ "button",
655
+ {
656
+ className: "copilotKitMessageControlButton",
657
+ onClick: handleRegenerate,
658
+ "aria-label": labels.regenerateResponse,
659
+ title: labels.regenerateResponse,
660
+ children: icons.regenerateIcon
661
+ }
662
+ ),
663
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
664
+ "button",
665
+ {
666
+ className: "copilotKitMessageControlButton",
667
+ onClick: handleCopy,
668
+ "aria-label": labels.copyToClipboard,
669
+ title: labels.copyToClipboard,
670
+ children: copied ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { style: { fontSize: "10px", fontWeight: "bold" }, children: "\u2713" }) : icons.copyIcon
671
+ }
672
+ ),
673
+ onThumbsUp && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
674
+ "button",
675
+ {
676
+ className: "copilotKitMessageControlButton",
677
+ onClick: handleThumbsUp,
678
+ "aria-label": labels.thumbsUp,
679
+ title: labels.thumbsUp,
680
+ children: icons.thumbsUpIcon
681
+ }
682
+ ),
683
+ onThumbsDown && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
684
+ "button",
685
+ {
686
+ className: "copilotKitMessageControlButton",
687
+ onClick: handleThumbsDown,
688
+ "aria-label": labels.thumbsDown,
689
+ title: labels.thumbsDown,
690
+ children: icons.thumbsDownIcon
691
+ }
692
+ )
693
+ ]
694
+ }
695
+ )
696
+ ] }),
697
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { marginBottom: "0.5rem" }, children: subComponent })
698
+ ] });
699
+ };
700
+
701
+ // src/components/chat/messages/RenderResultMessage.tsx
702
+ var import_jsx_runtime6 = require("react/jsx-runtime");
703
+ function RenderResultMessage(_a) {
704
+ var _b = _a, {
705
+ AssistantMessage: AssistantMessage2 = AssistantMessage
706
+ } = _b, props = __objRest(_b, [
707
+ "AssistantMessage"
708
+ ]);
709
+ const { message, inProgress, index, isCurrentMessage } = props;
29
710
  if (message.isResultMessage() && inProgress && isCurrentMessage) {
30
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
31
- AssistantMessage,
711
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
712
+ AssistantMessage2,
32
713
  {
33
714
  "data-message-role": "assistant",
34
715
  rawData: message,