@copilotkit/react-ui 1.10.5 → 1.10.6-next.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.
Files changed (43) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/{chunk-QPONDGDJ.mjs → chunk-5HQD6ZPA.mjs} +2 -2
  3. package/dist/{chunk-DSNTTAJX.mjs → chunk-7HAFY2YK.mjs} +3 -3
  4. package/dist/{chunk-CGEAG65D.mjs → chunk-ELGRNEAO.mjs} +7 -2
  5. package/dist/chunk-ELGRNEAO.mjs.map +1 -0
  6. package/dist/{chunk-K2FLPUR5.mjs → chunk-G7VB7A4O.mjs} +2 -2
  7. package/dist/{chunk-SDQTGCT2.mjs → chunk-SNGWNZNH.mjs} +2 -2
  8. package/dist/{chunk-DTRPPNSA.mjs → chunk-ZJCHKHE4.mjs} +2 -2
  9. package/dist/components/chat/Chat.js +36 -29
  10. package/dist/components/chat/Chat.js.map +1 -1
  11. package/dist/components/chat/Chat.mjs +3 -3
  12. package/dist/components/chat/Input.js +14 -7
  13. package/dist/components/chat/Input.js.map +1 -1
  14. package/dist/components/chat/Input.mjs +2 -2
  15. package/dist/components/chat/Modal.js +43 -36
  16. package/dist/components/chat/Modal.js.map +1 -1
  17. package/dist/components/chat/Modal.mjs +4 -4
  18. package/dist/components/chat/Popup.js +43 -36
  19. package/dist/components/chat/Popup.js.map +1 -1
  20. package/dist/components/chat/Popup.mjs +5 -5
  21. package/dist/components/chat/PoweredByTag.js +6 -1
  22. package/dist/components/chat/PoweredByTag.js.map +1 -1
  23. package/dist/components/chat/PoweredByTag.mjs +1 -1
  24. package/dist/components/chat/Sidebar.js +45 -38
  25. package/dist/components/chat/Sidebar.js.map +1 -1
  26. package/dist/components/chat/Sidebar.mjs +5 -5
  27. package/dist/components/chat/index.js +45 -38
  28. package/dist/components/chat/index.js.map +1 -1
  29. package/dist/components/chat/index.mjs +6 -6
  30. package/dist/components/index.js +45 -38
  31. package/dist/components/index.js.map +1 -1
  32. package/dist/components/index.mjs +6 -6
  33. package/dist/index.js +47 -40
  34. package/dist/index.js.map +1 -1
  35. package/dist/index.mjs +11 -11
  36. package/package.json +4 -4
  37. package/src/components/chat/PoweredByTag.tsx +15 -2
  38. package/dist/chunk-CGEAG65D.mjs.map +0 -1
  39. /package/dist/{chunk-QPONDGDJ.mjs.map → chunk-5HQD6ZPA.mjs.map} +0 -0
  40. /package/dist/{chunk-DSNTTAJX.mjs.map → chunk-7HAFY2YK.mjs.map} +0 -0
  41. /package/dist/{chunk-K2FLPUR5.mjs.map → chunk-G7VB7A4O.mjs.map} +0 -0
  42. /package/dist/{chunk-SDQTGCT2.mjs.map → chunk-SNGWNZNH.mjs.map} +0 -0
  43. /package/dist/{chunk-DTRPPNSA.mjs.map → chunk-ZJCHKHE4.mjs.map} +0 -0
@@ -1,12 +1,12 @@
1
1
  import "../../chunk-SC6JRFAJ.mjs";
2
2
  import {
3
3
  CopilotSidebar
4
- } from "../../chunk-SDQTGCT2.mjs";
4
+ } from "../../chunk-SNGWNZNH.mjs";
5
5
  import "../../chunk-WB3YULQ4.mjs";
6
6
  import {
7
7
  CopilotPopup
8
- } from "../../chunk-QPONDGDJ.mjs";
9
- import "../../chunk-DSNTTAJX.mjs";
8
+ } from "../../chunk-5HQD6ZPA.mjs";
9
+ import "../../chunk-7HAFY2YK.mjs";
10
10
  import "../../chunk-C3GSYRC3.mjs";
11
11
  import "../../chunk-GDSZGYCE.mjs";
12
12
  import "../../chunk-V7W6IM2V.mjs";
@@ -19,7 +19,7 @@ import "../../chunk-BH6PCAAL.mjs";
19
19
  import "../../chunk-UFN2VWSR.mjs";
20
20
  import {
21
21
  CopilotChat
22
- } from "../../chunk-K2FLPUR5.mjs";
22
+ } from "../../chunk-G7VB7A4O.mjs";
23
23
  import {
24
24
  Suggestions
25
25
  } from "../../chunk-226ZMOE3.mjs";
@@ -27,8 +27,8 @@ import {
27
27
  Suggestion
28
28
  } from "../../chunk-W26XFBEG.mjs";
29
29
  import "../../chunk-PLHTVHUW.mjs";
30
- import "../../chunk-DTRPPNSA.mjs";
31
- import "../../chunk-CGEAG65D.mjs";
30
+ import "../../chunk-ZJCHKHE4.mjs";
31
+ import "../../chunk-ELGRNEAO.mjs";
32
32
  import "../../chunk-QIOJXTIQ.mjs";
33
33
  import "../../chunk-W7ONZTSW.mjs";
34
34
  import "../../chunk-2LIO4Z3E.mjs";
@@ -95,7 +95,7 @@ __export(components_exports, {
95
95
  module.exports = __toCommonJS(components_exports);
96
96
 
97
97
  // src/components/chat/Modal.tsx
98
- var import_react15 = __toESM(require("react"));
98
+ var import_react16 = __toESM(require("react"));
99
99
 
100
100
  // src/components/chat/ChatContext.tsx
101
101
  var import_react = __toESM(require("react"));
@@ -2047,7 +2047,7 @@ function useScrollToBottom(messages) {
2047
2047
  }
2048
2048
 
2049
2049
  // src/components/chat/Input.tsx
2050
- var import_react13 = require("react");
2050
+ var import_react14 = require("react");
2051
2051
 
2052
2052
  // src/components/chat/Textarea.tsx
2053
2053
  var import_react11 = require("react");
@@ -2216,6 +2216,9 @@ var usePushToTalk = ({
2216
2216
  // src/components/chat/Input.tsx
2217
2217
  var import_react_core7 = require("@copilotkit/react-core");
2218
2218
 
2219
+ // src/components/chat/PoweredByTag.tsx
2220
+ var import_react13 = require("react");
2221
+
2219
2222
  // src/hooks/use-dark-mode.ts
2220
2223
  var useDarkMode = () => {
2221
2224
  if (typeof window === "undefined")
@@ -2226,7 +2229,11 @@ var useDarkMode = () => {
2226
2229
  // src/components/chat/PoweredByTag.tsx
2227
2230
  var import_jsx_runtime19 = require("react/jsx-runtime");
2228
2231
  function PoweredByTag({ showPoweredBy = true }) {
2232
+ const [mounted, setMounted] = (0, import_react13.useState)(false);
2229
2233
  const isDark = useDarkMode();
2234
+ (0, import_react13.useEffect)(() => {
2235
+ setMounted(true);
2236
+ }, []);
2230
2237
  if (!showPoweredBy) {
2231
2238
  return null;
2232
2239
  }
@@ -2237,7 +2244,7 @@ function PoweredByTag({ showPoweredBy = true }) {
2237
2244
  textAlign: "center",
2238
2245
  fontSize: "12px",
2239
2246
  padding: "3px 0",
2240
- color: isDark ? "rgb(69, 69, 69)" : "rgb(214, 214, 214)"
2247
+ color: mounted && isDark ? "rgb(69, 69, 69)" : "rgb(214, 214, 214)"
2241
2248
  };
2242
2249
  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "poweredBy", style: poweredByStyle, children: "Powered by CopilotKit" }) });
2243
2250
  }
@@ -2258,8 +2265,8 @@ var Input = ({
2258
2265
  const copilotContext = (0, import_react_core7.useCopilotContext)();
2259
2266
  const showPoweredBy = !((_a = copilotContext.copilotApiConfig) == null ? void 0 : _a.publicApiKey);
2260
2267
  const pushToTalkConfigured = copilotContext.copilotApiConfig.textToSpeechUrl !== void 0 && copilotContext.copilotApiConfig.transcribeAudioUrl !== void 0;
2261
- const textareaRef = (0, import_react13.useRef)(null);
2262
- const [isComposing, setIsComposing] = (0, import_react13.useState)(false);
2268
+ const textareaRef = (0, import_react14.useRef)(null);
2269
+ const [isComposing, setIsComposing] = (0, import_react14.useState)(false);
2263
2270
  const handleDivClick = (event) => {
2264
2271
  var _a2;
2265
2272
  const target = event.target;
@@ -2269,7 +2276,7 @@ var Input = ({
2269
2276
  return;
2270
2277
  (_a2 = textareaRef.current) == null ? void 0 : _a2.focus();
2271
2278
  };
2272
- const [text, setText] = (0, import_react13.useState)("");
2279
+ const [text, setText] = (0, import_react14.useState)("");
2273
2280
  const send = () => {
2274
2281
  var _a2;
2275
2282
  if (inProgress)
@@ -2285,13 +2292,13 @@ var Input = ({
2285
2292
  const isInProgress = inProgress || pushToTalkState === "transcribing";
2286
2293
  const buttonIcon = isInProgress && !hideStopButton ? context.icons.stopIcon : context.icons.sendIcon;
2287
2294
  const showPushToTalk = pushToTalkConfigured && (pushToTalkState === "idle" || pushToTalkState === "recording") && !inProgress;
2288
- const canSend = (0, import_react13.useMemo)(() => {
2295
+ const canSend = (0, import_react14.useMemo)(() => {
2289
2296
  var _a2;
2290
2297
  const interruptEvent = (_a2 = copilotContext.langGraphInterruptAction) == null ? void 0 : _a2.event;
2291
2298
  const interruptInProgress = (interruptEvent == null ? void 0 : interruptEvent.name) === "LangGraphInterruptEvent" && !(interruptEvent == null ? void 0 : interruptEvent.response);
2292
2299
  return !isInProgress && text.trim().length > 0 && pushToTalkState === "idle" && !interruptInProgress;
2293
2300
  }, [(_b = copilotContext.langGraphInterruptAction) == null ? void 0 : _b.event, isInProgress, text, pushToTalkState]);
2294
- const canStop = (0, import_react13.useMemo)(() => {
2301
+ const canStop = (0, import_react14.useMemo)(() => {
2295
2302
  return isInProgress && !hideStopButton;
2296
2303
  }, [isInProgress, hideStopButton]);
2297
2304
  const sendDisabled = !canSend && !canStop;
@@ -2347,7 +2354,7 @@ var Input = ({
2347
2354
  };
2348
2355
 
2349
2356
  // src/components/chat/Chat.tsx
2350
- var import_react14 = __toESM(require("react"));
2357
+ var import_react15 = __toESM(require("react"));
2351
2358
  var import_react_core9 = require("@copilotkit/react-core");
2352
2359
  var import_shared3 = require("@copilotkit/shared");
2353
2360
  var import_shared4 = require("@copilotkit/shared");
@@ -2518,10 +2525,10 @@ function CopilotChat({
2518
2525
  removeInternalErrorHandler
2519
2526
  } = (0, import_react_core9.useCopilotContext)();
2520
2527
  const { publicApiKey, chatApiEndpoint } = copilotApiConfig;
2521
- const [selectedImages, setSelectedImages] = (0, import_react14.useState)([]);
2522
- const [chatError, setChatError] = (0, import_react14.useState)(null);
2523
- const fileInputRef = (0, import_react14.useRef)(null);
2524
- const triggerObservabilityHook = (0, import_react14.useCallback)(
2528
+ const [selectedImages, setSelectedImages] = (0, import_react15.useState)([]);
2529
+ const [chatError, setChatError] = (0, import_react15.useState)(null);
2530
+ const fileInputRef = (0, import_react15.useRef)(null);
2531
+ const triggerObservabilityHook = (0, import_react15.useCallback)(
2525
2532
  (hookName, ...args) => {
2526
2533
  if (publicApiKey && (observabilityHooks == null ? void 0 : observabilityHooks[hookName])) {
2527
2534
  observabilityHooks[hookName](...args);
@@ -2540,7 +2547,7 @@ function CopilotChat({
2540
2547
  },
2541
2548
  [publicApiKey, observabilityHooks, setBannerError]
2542
2549
  );
2543
- const triggerChatError = (0, import_react14.useCallback)(
2550
+ const triggerChatError = (0, import_react15.useCallback)(
2544
2551
  (error, operation, originalError) => {
2545
2552
  const errorMessage = (error == null ? void 0 : error.message) || (error == null ? void 0 : error.toString()) || "An error occurred";
2546
2553
  setChatError({
@@ -2586,7 +2593,7 @@ function CopilotChat({
2586
2593
  },
2587
2594
  [publicApiKey, chatApiEndpoint, observabilityHooks, setBannerError]
2588
2595
  );
2589
- (0, import_react14.useEffect)(() => {
2596
+ (0, import_react15.useEffect)(() => {
2590
2597
  const id = "chat-component";
2591
2598
  setInternalErrorHandler({
2592
2599
  [id]: (error) => {
@@ -2599,7 +2606,7 @@ function CopilotChat({
2599
2606
  removeInternalErrorHandler == null ? void 0 : removeInternalErrorHandler(id);
2600
2607
  };
2601
2608
  }, [triggerChatError, setInternalErrorHandler, removeInternalErrorHandler]);
2602
- (0, import_react14.useEffect)(() => {
2609
+ (0, import_react15.useEffect)(() => {
2603
2610
  if (!imageUploadsEnabled)
2604
2611
  return;
2605
2612
  const handlePaste = (e) => __async(this, null, function* () {
@@ -2645,7 +2652,7 @@ function CopilotChat({
2645
2652
  document.addEventListener("paste", handlePaste);
2646
2653
  return () => document.removeEventListener("paste", handlePaste);
2647
2654
  }, [imageUploadsEnabled, triggerChatError]);
2648
- (0, import_react14.useEffect)(() => {
2655
+ (0, import_react15.useEffect)(() => {
2649
2656
  if (!(additionalInstructions == null ? void 0 : additionalInstructions.length)) {
2650
2657
  setChatInstructions(instructions || "");
2651
2658
  return;
@@ -2673,8 +2680,8 @@ function CopilotChat({
2673
2680
  onStopGeneration,
2674
2681
  onReloadMessages
2675
2682
  );
2676
- const prevIsLoading = (0, import_react14.useRef)(isLoading);
2677
- (0, import_react14.useEffect)(() => {
2683
+ const prevIsLoading = (0, import_react15.useRef)(isLoading);
2684
+ (0, import_react15.useEffect)(() => {
2678
2685
  if (prevIsLoading.current !== isLoading) {
2679
2686
  if (isLoading) {
2680
2687
  triggerObservabilityHook("onChatStarted");
@@ -2693,7 +2700,7 @@ function CopilotChat({
2693
2700
  triggerObservabilityHook("onMessageSent", text);
2694
2701
  return sendMessage(text, images);
2695
2702
  };
2696
- const chatContext = import_react14.default.useContext(ChatContext);
2703
+ const chatContext = import_react15.default.useContext(ChatContext);
2697
2704
  const isVisible = chatContext ? chatContext.open : true;
2698
2705
  const handleRegenerate = (messageId) => {
2699
2706
  if (onRegenerate) {
@@ -2828,7 +2835,7 @@ function WrappedCopilotChat({
2828
2835
  labels,
2829
2836
  className
2830
2837
  }) {
2831
- const chatContext = import_react14.default.useContext(ChatContext);
2838
+ const chatContext = import_react15.default.useContext(ChatContext);
2832
2839
  if (!chatContext) {
2833
2840
  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChatContextProvider, { icons, labels, open: true, setOpen: () => {
2834
2841
  }, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: `copilotKitChat ${className != null ? className : ""}`, children }) });
@@ -2857,15 +2864,15 @@ var useCopilotChatLogic = (chatSuggestions, makeSystemMessage, disableSystemMess
2857
2864
  const generalContext = (0, import_react_core9.useCopilotContext)();
2858
2865
  const messagesContext = (0, import_react_core9.useCopilotMessagesContext)();
2859
2866
  const { actions } = generalContext;
2860
- const [suggestionsFailed, setSuggestionsFailed] = (0, import_react14.useState)(false);
2861
- const hasGeneratedInitialSuggestions = (0, import_react14.useRef)(false);
2862
- (0, import_react14.useEffect)(() => {
2867
+ const [suggestionsFailed, setSuggestionsFailed] = (0, import_react15.useState)(false);
2868
+ const hasGeneratedInitialSuggestions = (0, import_react15.useRef)(false);
2869
+ (0, import_react15.useEffect)(() => {
2863
2870
  if (Array.isArray(chatSuggestions)) {
2864
2871
  setSuggestions(chatSuggestions);
2865
2872
  hasGeneratedInitialSuggestions.current = true;
2866
2873
  }
2867
2874
  }, [JSON.stringify(chatSuggestions), setSuggestions]);
2868
- const generateSuggestionsWithErrorHandling = (0, import_react14.useCallback)(
2875
+ const generateSuggestionsWithErrorHandling = (0, import_react15.useCallback)(
2869
2876
  (context) => __async(void 0, null, function* () {
2870
2877
  try {
2871
2878
  yield generateSuggestions();
@@ -2876,7 +2883,7 @@ var useCopilotChatLogic = (chatSuggestions, makeSystemMessage, disableSystemMess
2876
2883
  }),
2877
2884
  [generateSuggestions]
2878
2885
  );
2879
- (0, import_react14.useEffect)(() => {
2886
+ (0, import_react15.useEffect)(() => {
2880
2887
  if (chatSuggestions !== "auto" || isLoadingSuggestions || suggestionsFailed) {
2881
2888
  return;
2882
2889
  }
@@ -2906,13 +2913,13 @@ var useCopilotChatLogic = (chatSuggestions, makeSystemMessage, disableSystemMess
2906
2913
  // Use stable string instead of object reference
2907
2914
  generateSuggestionsWithErrorHandling
2908
2915
  ]);
2909
- (0, import_react14.useEffect)(() => {
2916
+ (0, import_react15.useEffect)(() => {
2910
2917
  if (chatSuggestions !== "auto") {
2911
2918
  hasGeneratedInitialSuggestions.current = false;
2912
2919
  setSuggestionsFailed(false);
2913
2920
  }
2914
2921
  }, [chatSuggestions]);
2915
- const stableContext = (0, import_react14.useMemo)(
2922
+ const stableContext = (0, import_react15.useMemo)(
2916
2923
  () => __spreadValues(__spreadValues({}, generalContext), messagesContext),
2917
2924
  [
2918
2925
  // Only include stable dependencies
@@ -2921,12 +2928,12 @@ var useCopilotChatLogic = (chatSuggestions, makeSystemMessage, disableSystemMess
2921
2928
  generalContext.isLoading
2922
2929
  ]
2923
2930
  );
2924
- const resetSuggestions = (0, import_react14.useCallback)(() => {
2931
+ const resetSuggestions = (0, import_react15.useCallback)(() => {
2925
2932
  resetSuggestionsFromHook();
2926
2933
  setSuggestionsFailed(false);
2927
2934
  hasGeneratedInitialSuggestions.current = false;
2928
2935
  }, [resetSuggestionsFromHook]);
2929
- (0, import_react14.useEffect)(() => {
2936
+ (0, import_react15.useEffect)(() => {
2930
2937
  onInProgress == null ? void 0 : onInProgress(isLoading);
2931
2938
  }, [onInProgress, isLoading]);
2932
2939
  const safelySendMessage = (messageContent, imagesToUse) => __async(void 0, null, function* () {
@@ -3099,7 +3106,7 @@ var CopilotModalInner = (_a) => {
3099
3106
  ]);
3100
3107
  const { copilotApiConfig, setBannerError } = (0, import_react_core11.useCopilotContext)();
3101
3108
  const { publicApiKey } = copilotApiConfig;
3102
- const triggerObservabilityHook = (0, import_react15.useCallback)(
3109
+ const triggerObservabilityHook = (0, import_react16.useCallback)(
3103
3110
  (hookName, ...args) => {
3104
3111
  if (publicApiKey && (observabilityHooks == null ? void 0 : observabilityHooks[hookName])) {
3105
3112
  observabilityHooks[hookName](...args);
@@ -3119,8 +3126,8 @@ var CopilotModalInner = (_a) => {
3119
3126
  [publicApiKey, observabilityHooks, setBannerError]
3120
3127
  );
3121
3128
  const { open } = useChatContext();
3122
- const prevOpen = (0, import_react15.useRef)(open);
3123
- (0, import_react15.useEffect)(() => {
3129
+ const prevOpen = (0, import_react16.useRef)(open);
3130
+ (0, import_react16.useEffect)(() => {
3124
3131
  if (prevOpen.current !== open) {
3125
3132
  onSetOpen == null ? void 0 : onSetOpen(open);
3126
3133
  if (open) {
@@ -3131,8 +3138,8 @@ var CopilotModalInner = (_a) => {
3131
3138
  prevOpen.current = open;
3132
3139
  }
3133
3140
  }, [open, onSetOpen, triggerObservabilityHook]);
3134
- const memoizedHeader = (0, import_react15.useMemo)(() => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Header2, {}), [Header2]);
3135
- const memoizedChildren = (0, import_react15.useMemo)(() => children, [children]);
3141
+ const memoizedHeader = (0, import_react16.useMemo)(() => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Header2, {}), [Header2]);
3142
+ const memoizedChildren = (0, import_react16.useMemo)(() => children, [children]);
3136
3143
  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
3137
3144
  memoizedChildren,
3138
3145
  /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className, children: [
@@ -3212,7 +3219,7 @@ var CopilotModal = (_a) => {
3212
3219
  "children",
3213
3220
  "observabilityHooks"
3214
3221
  ]);
3215
- const [openState, setOpenState] = import_react15.default.useState(defaultOpen);
3222
+ const [openState, setOpenState] = import_react16.default.useState(defaultOpen);
3216
3223
  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChatContextProvider, { icons, labels, open: openState, setOpen: setOpenState, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
3217
3224
  CopilotModalInner,
3218
3225
  __spreadProps(__spreadValues({
@@ -3256,13 +3263,13 @@ function CopilotPopup(props) {
3256
3263
  }
3257
3264
 
3258
3265
  // src/components/chat/Sidebar.tsx
3259
- var import_react16 = require("react");
3266
+ var import_react17 = require("react");
3260
3267
  var import_jsx_runtime27 = require("react/jsx-runtime");
3261
3268
  function CopilotSidebar(props) {
3262
3269
  props = __spreadProps(__spreadValues({}, props), {
3263
3270
  className: props.className ? props.className + " copilotKitSidebar" : "copilotKitSidebar"
3264
3271
  });
3265
- const [expandedClassName, setExpandedClassName] = (0, import_react16.useState)(
3272
+ const [expandedClassName, setExpandedClassName] = (0, import_react17.useState)(
3266
3273
  props.defaultOpen ? "sidebarExpanded" : ""
3267
3274
  );
3268
3275
  const onSetOpen = (open) => {