@copilotkit/react-ui 1.8.12-next.4 → 1.8.12-next.6

package/dist/components/chat/Chat.js

@@ -752,30 +752,60 @@ var usePushToTalk = ({
 
 // src/components/chat/Input.tsx
 var import_react_core3 = require("@copilotkit/react-core");
+
+// src/hooks/use-dark-mode.ts
+var useDarkMode = () => {
+  if (typeof window === "undefined")
+    return false;
+  return document.documentElement.classList.contains("dark") || document.body.classList.contains("dark") || document.documentElement.getAttribute("data-theme") === "dark" || document.body.getAttribute("data-theme") === "dark" || window.matchMedia("(prefers-color-scheme: dark)").matches;
+};
+
+// src/components/chat/PoweredByTag.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
+function PoweredByTag({ showPoweredBy = true }) {
+  const isDark = useDarkMode();
+  if (!showPoweredBy) {
+    return null;
+  }
+  const poweredByStyle = {
+    visibility: "visible",
+    display: "block",
+    position: "static",
+    textAlign: "center",
+    fontSize: "12px",
+    padding: "3px 0",
+    color: isDark ? "rgb(69, 69, 69)" : "rgb(214, 214, 214)"
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "poweredBy", style: poweredByStyle, children: "Powered by CopilotKit" }) });
+}
+
+// src/components/chat/Input.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var MAX_NEWLINES = 6;
 var Input = ({ inProgress, onSend, isVisible = false, onStop, onUpload }) => {
+  var _a;
   const context = useChatContext();
   const copilotContext = (0, import_react_core3.useCopilotContext)();
+  const showPoweredBy = !((_a = copilotContext.copilotApiConfig) == null ? void 0 : _a.publicApiKey);
   const pushToTalkConfigured = copilotContext.copilotApiConfig.textToSpeechUrl !== void 0 && copilotContext.copilotApiConfig.transcribeAudioUrl !== void 0;
   const textareaRef = (0, import_react5.useRef)(null);
   const handleDivClick = (event) => {
-    var _a;
+    var _a2;
     const target = event.target;
     if (target.closest("button"))
       return;
     if (target.tagName === "TEXTAREA")
       return;
-    (_a = textareaRef.current) == null ? void 0 : _a.focus();
+    (_a2 = textareaRef.current) == null ? void 0 : _a2.focus();
   };
   const [text, setText] = (0, import_react5.useState)("");
   const send = () => {
-    var _a;
+    var _a2;
     if (inProgress)
       return;
     onSend(text);
     setText("");
-    (_a = textareaRef.current) == null ? void 0 : _a.focus();
+    (_a2 = textareaRef.current) == null ? void 0 : _a2.focus();
   };
   const { pushToTalkState, setPushToTalkState } = usePushToTalk({
     sendFunction: onSend,
@@ -785,62 +815,65 @@ var Input = ({ inProgress, onSend, isVisible = false, onStop, onUpload }) => {
   const buttonIcon = isInProgress ? context.icons.stopIcon : context.icons.sendIcon;
   const showPushToTalk = pushToTalkConfigured && (pushToTalkState === "idle" || pushToTalkState === "recording") && !inProgress;
   const canSend = () => {
-    var _a;
-    const interruptEvent = (_a = copilotContext.langGraphInterruptAction) == null ? void 0 : _a.event;
+    var _a2;
+    const interruptEvent = (_a2 = copilotContext.langGraphInterruptAction) == null ? void 0 : _a2.event;
     const interruptInProgress = (interruptEvent == null ? void 0 : interruptEvent.name) === "LangGraphInterruptEvent" && !(interruptEvent == null ? void 0 : interruptEvent.response);
     return (isInProgress || !isInProgress && text.trim().length > 0) && pushToTalkState === "idle" && !interruptInProgress;
   };
   const sendDisabled = !canSend();
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "copilotKitInputContainer", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "copilotKitInput", onClick: handleDivClick, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-      Textarea_default,
-      {
-        ref: textareaRef,
-        placeholder: context.labels.placeholder,
-        autoFocus: false,
-        maxRows: MAX_NEWLINES,
-        value: text,
-        onChange: (event) => setText(event.target.value),
-        onKeyDown: (event) => {
-          if (event.key === "Enter" && !event.shiftKey) {
-            event.preventDefault();
-            if (canSend()) {
-              send();
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: `copilotKitInputContainer ${showPoweredBy ? "poweredByContainer" : ""}`, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "copilotKitInput", onClick: handleDivClick, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        Textarea_default,
+        {
+          ref: textareaRef,
+          placeholder: context.labels.placeholder,
+          autoFocus: false,
+          maxRows: MAX_NEWLINES,
+          value: text,
+          onChange: (event) => setText(event.target.value),
+          onKeyDown: (event) => {
+            if (event.key === "Enter" && !event.shiftKey) {
+              event.preventDefault();
+              if (canSend()) {
+                send();
+              }
             }
           }
         }
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "copilotKitInputControls", children: [
-      onUpload && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { onClick: onUpload, className: "copilotKitInputControlButton", children: context.icons.uploadIcon }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { style: { flexGrow: 1 } }),
-      showPushToTalk && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-        "button",
-        {
-          onClick: () => setPushToTalkState(pushToTalkState === "idle" ? "recording" : "transcribing"),
-          className: pushToTalkState === "recording" ? "copilotKitInputControlButton copilotKitPushToTalkRecording" : "copilotKitInputControlButton",
-          children: context.icons.pushToTalkIcon
-        }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-        "button",
-        {
-          disabled: sendDisabled,
-          onClick: isInProgress ? onStop : send,
-          "data-copilotkit-in-progress": inProgress,
-          "data-test-id": inProgress ? "copilot-chat-request-in-progress" : "copilot-chat-ready",
-          className: "copilotKitInputControlButton",
-          children: buttonIcon
-        }
-      )
-    ] })
-  ] }) });
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "copilotKitInputControls", children: [
+        onUpload && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { onClick: onUpload, className: "copilotKitInputControlButton", children: context.icons.uploadIcon }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { style: { flexGrow: 1 } }),
+        showPushToTalk && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          "button",
+          {
+            onClick: () => setPushToTalkState(pushToTalkState === "idle" ? "recording" : "transcribing"),
+            className: pushToTalkState === "recording" ? "copilotKitInputControlButton copilotKitPushToTalkRecording" : "copilotKitInputControlButton",
+            children: context.icons.pushToTalkIcon
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          "button",
+          {
+            disabled: sendDisabled,
+            onClick: isInProgress ? onStop : send,
+            "data-copilotkit-in-progress": inProgress,
+            "data-test-id": inProgress ? "copilot-chat-request-in-progress" : "copilot-chat-ready",
+            className: "copilotKitInputControlButton",
+            children: buttonIcon
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(PoweredByTag, { showPoweredBy })
+  ] });
 };
 
 // src/components/chat/messages/UserMessage.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var UserMessage = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "copilotKitMessage copilotKitUserMessage", children: props.subComponent || props.message });
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "copilotKitMessage copilotKitUserMessage", children: props.subComponent || props.message });
 };
 
 // src/components/chat/Markdown.tsx
@@ -874,7 +907,7 @@ function useCopyToClipboard({ timeout = 2e3 }) {
 }
 
 // src/components/chat/CodeBlock.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var programmingLanguages = {
   javascript: ".js",
   python: ".py",
@@ -937,15 +970,15 @@ var CodeBlock = (0, import_react6.memo)(({ language, value }) => {
       return;
     copyToClipboard(value);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "copilotKitCodeBlock", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "copilotKitCodeBlockToolbar", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "copilotKitCodeBlockToolbarLanguage", children: language }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "copilotKitCodeBlockToolbarButtons", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "copilotKitCodeBlockToolbarButton", onClick: downloadAsFile, children: DownloadIcon }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { className: "copilotKitCodeBlockToolbarButton", onClick: onCopy, children: isCopied ? CheckIcon : CopyIcon })
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "copilotKitCodeBlock", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "copilotKitCodeBlockToolbar", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "copilotKitCodeBlockToolbarLanguage", children: language }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "copilotKitCodeBlockToolbarButtons", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "copilotKitCodeBlockToolbarButton", onClick: downloadAsFile, children: DownloadIcon }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { className: "copilotKitCodeBlockToolbarButton", onClick: onCopy, children: isCopied ? CheckIcon : CopyIcon })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       import_react_syntax_highlighter.Prism,
       {
         language,
@@ -1248,18 +1281,18 @@ var highlightStyle = {
 // src/components/chat/Markdown.tsx
 var import_remark_gfm = __toESM(require("remark-gfm"));
 var import_remark_math = __toESM(require("remark-math"));
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var MemoizedReactMarkdown = (0, import_react7.memo)(
   import_react_markdown.default,
   (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.className === nextProps.className
 );
 var Markdown = ({ content }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "copilotKitMarkdown", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(MemoizedReactMarkdown, { components, remarkPlugins: [import_remark_gfm.default, import_remark_math.default], children: content }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "copilotKitMarkdown", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(MemoizedReactMarkdown, { components, remarkPlugins: [import_remark_gfm.default, import_remark_math.default], children: content }) });
 };
 var components = {
   a(_a) {
     var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "a",
       __spreadProps(__spreadValues({
         style: { color: "blue", textDecoration: "underline" }
@@ -1274,7 +1307,7 @@ var components = {
     var _d = _c, { children, className, inline } = _d, props = __objRest(_d, ["children", "className", "inline"]);
     if (children.length) {
       if (children[0] == "\u258D") {
-        return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "span",
           {
             style: {
@@ -1289,9 +1322,9 @@ var components = {
     }
     const match = /language-(\w+)/.exec(className || "");
     if (inline) {
-      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("code", __spreadProps(__spreadValues({ className }, props), { children }));
+      return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("code", __spreadProps(__spreadValues({ className }, props), { children }));
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       CodeBlock,
       __spreadValues({
         language: match && match[1] || "",
@@ -1304,7 +1337,7 @@ var components = {
 
 // src/components/chat/messages/AssistantMessage.tsx
 var import_react8 = require("react");
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var AssistantMessage = (props) => {
   const { icons, labels } = useChatContext();
   const {
@@ -1345,17 +1378,17 @@ var AssistantMessage = (props) => {
       onThumbsDown(message);
     }
   };
-  const LoadingIcon = () => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: icons.activityIcon });
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
-    (message || isLoading) && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "copilotKitMessage copilotKitAssistantMessage", children: [
-      message && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Markdown, { content: message || "" }),
-      isLoading && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(LoadingIcon, {}),
-      message && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  const LoadingIcon = () => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { children: icons.activityIcon });
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+    (message || isLoading) && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "copilotKitMessage copilotKitAssistantMessage", children: [
+      message && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Markdown, { content: message || "" }),
+      isLoading && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(LoadingIcon, {}),
+      message && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
         "div",
         {
           className: `copilotKitMessageControls ${isCurrentMessage ? "currentMessage" : ""}`,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               "button",
               {
                 className: "copilotKitMessageControlButton",
@@ -1365,17 +1398,17 @@ var AssistantMessage = (props) => {
                 children: icons.regenerateIcon
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               "button",
               {
                 className: "copilotKitMessageControlButton",
                 onClick: handleCopy,
                 "aria-label": labels.copyToClipboard,
                 title: labels.copyToClipboard,
-                children: copied ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { style: { fontSize: "10px", fontWeight: "bold" }, children: "\u2713" }) : icons.copyIcon
+                children: copied ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { style: { fontSize: "10px", fontWeight: "bold" }, children: "\u2713" }) : icons.copyIcon
               }
             ),
-            onThumbsUp && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            onThumbsUp && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               "button",
               {
                 className: "copilotKitMessageControlButton",
@@ -1385,7 +1418,7 @@ var AssistantMessage = (props) => {
                 children: icons.thumbsUpIcon
               }
             ),
-            onThumbsDown && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            onThumbsDown && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
               "button",
               {
                 className: "copilotKitMessageControlButton",
@@ -1399,12 +1432,12 @@ var AssistantMessage = (props) => {
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { style: { marginBottom: "0.5rem" }, children: subComponent })
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { style: { marginBottom: "0.5rem" }, children: subComponent })
   ] });
 };
 
 // src/components/chat/messages/RenderTextMessage.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function RenderTextMessage(_a) {
   var _b = _a, {
     UserMessage: UserMessage2 = UserMessage,
@@ -1425,7 +1458,7 @@ function RenderTextMessage(_a) {
   } = props;
   if (message.isTextMessage()) {
     if (message.role === "user") {
-      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         UserMessage2,
         {
           "data-message-role": "user",
@@ -1435,7 +1468,7 @@ function RenderTextMessage(_a) {
         index
       );
     } else if (message.role == "assistant") {
-      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         AssistantMessage2,
         {
           "data-message-role": "assistant",
@@ -1458,7 +1491,7 @@ function RenderTextMessage(_a) {
 // src/components/chat/messages/RenderActionExecutionMessage.tsx
 var import_runtime_client_gql2 = require("@copilotkit/runtime-client-gql");
 var import_react_core4 = require("@copilotkit/react-core");
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 function RenderActionExecutionMessage(_a) {
   var _b = _a, {
     AssistantMessage: AssistantMessage2 = AssistantMessage
@@ -1472,7 +1505,7 @@ function RenderActionExecutionMessage(_a) {
       const render = chatComponentsCache.current.actions[message.name] || chatComponentsCache.current.actions["*"];
       if (typeof render === "string") {
         if (isCurrentMessage && inProgress) {
-          return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
             AssistantMessage2,
             {
               rawData: message,
@@ -1505,7 +1538,7 @@ function RenderActionExecutionMessage(_a) {
             return null;
           }
           if (typeof toRender === "string") {
-            return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
               AssistantMessage2,
               {
                 rawData: message,
@@ -1517,7 +1550,7 @@ function RenderActionExecutionMessage(_a) {
               index
             );
           } else {
-            return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
               AssistantMessage2,
               {
                 rawData: message,
@@ -1531,20 +1564,20 @@ function RenderActionExecutionMessage(_a) {
           }
         } catch (e) {
           console.error(`Error executing render function for action ${message.name}: ${e}`);
-          return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
             AssistantMessage2,
             {
               rawData: message,
               "data-message-role": "assistant",
               isLoading: false,
               isGenerating: false,
-              subComponent: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "copilotKitMessage copilotKitAssistantMessage", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("b", { children: [
+              subComponent: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "copilotKitMessage copilotKitAssistantMessage", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("b", { children: [
                   "\u274C Error executing render function for action ",
                   message.name,
                   ":"
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("pre", { children: e instanceof Error ? e.message : String(e) })
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("pre", { children: e instanceof Error ? e.message : String(e) })
               ] })
             },
             index
@@ -1554,7 +1587,7 @@ function RenderActionExecutionMessage(_a) {
     } else if (!inProgress || !isCurrentMessage) {
       return null;
     } else {
-      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         AssistantMessage2,
         {
           rawData: message,
@@ -1569,7 +1602,7 @@ function RenderActionExecutionMessage(_a) {
 }
 
 // src/components/chat/messages/RenderResultMessage.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 function RenderResultMessage(_a) {
   var _b = _a, {
     AssistantMessage: AssistantMessage2 = AssistantMessage
@@ -1578,7 +1611,7 @@ function RenderResultMessage(_a) {
   ]);
   const { message, inProgress, index, isCurrentMessage } = props;
   if (message.isResultMessage() && inProgress && isCurrentMessage) {
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       AssistantMessage2,
       {
         "data-message-role": "assistant",
@@ -1595,7 +1628,7 @@ function RenderResultMessage(_a) {
 
 // src/components/chat/messages/RenderAgentStateMessage.tsx
 var import_react_core5 = require("@copilotkit/react-core");
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function RenderAgentStateMessage(_a) {
   var _b = _a, {
     AssistantMessage: AssistantMessage2 = AssistantMessage
@@ -1612,7 +1645,7 @@ function RenderAgentStateMessage(_a) {
     if (render) {
       if (typeof render === "string") {
         if (isCurrentMessage && inProgress) {
-          return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
             AssistantMessage2,
             {
               rawData: message,
@@ -1638,7 +1671,7 @@ function RenderAgentStateMessage(_a) {
           return null;
         }
         if (!toRender && isCurrentMessage && inProgress) {
-          return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
             AssistantMessage2,
             {
               "data-message-role": "assistant",
@@ -1652,7 +1685,7 @@ function RenderAgentStateMessage(_a) {
           return null;
         }
         if (typeof toRender === "string") {
-          return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
             AssistantMessage2,
             {
               rawData: message,
@@ -1664,7 +1697,7 @@ function RenderAgentStateMessage(_a) {
             index
           );
         } else {
-          return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
             AssistantMessage2,
             {
               rawData: message,
@@ -1680,7 +1713,7 @@ function RenderAgentStateMessage(_a) {
     } else if (!inProgress || !isCurrentMessage) {
       return null;
     } else {
-      return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         AssistantMessage2,
         {
           rawData: message,
@@ -1695,7 +1728,7 @@ function RenderAgentStateMessage(_a) {
 }
 
 // src/components/chat/messages/RenderImageMessage.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function RenderImageMessage(_a) {
   var _b = _a, {
     UserMessage: UserMessage2 = UserMessage,
@@ -1716,7 +1749,7 @@ function RenderImageMessage(_a) {
   } = props;
   if (message.isImageMessage()) {
     const imageData = `data:${message.format};base64,${message.bytes}`;
-    const imageComponent = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "copilotKitImage", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    const imageComponent = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "copilotKitImage", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       "img",
       {
         src: imageData,
@@ -1725,7 +1758,7 @@ function RenderImageMessage(_a) {
       }
     ) });
     if (message.role === "user") {
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
         UserMessage2,
         {
           "data-message-role": "user",
@@ -1736,7 +1769,7 @@ function RenderImageMessage(_a) {
         index
       );
     } else if (message.role === "assistant") {
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
         AssistantMessage2,
         {
           "data-message-role": "assistant",
@@ -1762,9 +1795,9 @@ function RenderImageMessage(_a) {
 var import_react_core6 = require("@copilotkit/react-core");
 var import_shared = require("@copilotkit/shared");
 var import_runtime_client_gql3 = require("@copilotkit/runtime-client-gql");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function Suggestion({ title, message, onClick, partial, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     "button",
     {
       disabled: partial,
@@ -1774,7 +1807,7 @@ function Suggestion({ title, message, onClick, partial, className }) {
       },
       className: className || (partial ? "suggestion loading" : "suggestion"),
       "data-test-id": "suggestion",
-      children: partial ? SmallSpinnerIcon : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { children: title })
+      children: partial ? SmallSpinnerIcon : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { children: title })
     }
   );
 }
@@ -1856,7 +1889,7 @@ var import_shared2 = require("@copilotkit/shared");
 var import_react_core8 = require("@copilotkit/react-core");
 
 // src/components/chat/ImageUploadQueue.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var ImageUploadQueue = ({
   images,
   onRemoveImage,
@@ -1864,7 +1897,7 @@ var ImageUploadQueue = ({
 }) => {
   if (images.length === 0)
     return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     "div",
     {
       className: `copilotKitImageUploadQueue ${className}`,
@@ -1875,7 +1908,7 @@ var ImageUploadQueue = ({
         margin: "8px",
         padding: "8px"
       },
-      children: images.map((image, index) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+      children: images.map((image, index) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
         "div",
         {
           className: "copilotKitImageUploadQueueItem",
@@ -1888,7 +1921,7 @@ var ImageUploadQueue = ({
             overflow: "hidden"
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
               "img",
               {
                 src: `data:${image.contentType};base64,${image.bytes}`,
@@ -1900,7 +1933,7 @@ var ImageUploadQueue = ({
                 }
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
               "button",
               {
                 onClick: () => onRemoveImage(index),
@@ -1934,7 +1967,7 @@ var ImageUploadQueue = ({
 };
 
 // src/components/chat/Chat.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 function CopilotChat({
   instructions,
   onSubmitMessage,
@@ -2091,8 +2124,8 @@ function CopilotChat({
   const removeSelectedImage = (index) => {
     setSelectedImages((prev) => prev.filter((_, i) => i !== index));
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(WrappedCopilotChat, { icons, labels, className, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(WrappedCopilotChat, { icons, labels, className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       Messages2,
       {
         AssistantMessage: AssistantMessage2,
@@ -2108,7 +2141,7 @@ function CopilotChat({
         onCopy: handleCopy,
         onThumbsUp,
         onThumbsDown,
-        children: currentSuggestions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "suggestions", children: currentSuggestions.map((suggestion, index) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        children: currentSuggestions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "suggestions", children: currentSuggestions.map((suggestion, index) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
           Suggestion,
           {
             title: suggestion.title,
@@ -2121,9 +2154,9 @@ function CopilotChat({
         )) })
       }
     ),
-    imageUploadsEnabled && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ImageUploadQueue, { images: selectedImages, onRemoveImage: removeSelectedImage }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    imageUploadsEnabled && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ImageUploadQueue, { images: selectedImages, onRemoveImage: removeSelectedImage }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         "input",
         {
           type: "file",
@@ -2135,7 +2168,7 @@ function CopilotChat({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       Input2,
       {
         inProgress: isLoading,
@@ -2158,10 +2191,10 @@ function WrappedCopilotChat({
 }) {
   const chatContext = import_react9.default.useContext(ChatContext);
   if (!chatContext) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ChatContextProvider, { icons, labels, open: true, setOpen: () => {
-    }, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: `copilotKitChat ${className}`, children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChatContextProvider, { icons, labels, open: true, setOpen: () => {
+    }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: `copilotKitChat ${className != null ? className : ""}`, children }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children });
 }
 var SUGGESTIONS_DEBOUNCE_TIMEOUT = 1e3;
 var useCopilotChatLogic = (makeSystemMessage, onInProgress, onSubmitMessage, onStopGeneration, onReloadMessages) => {