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