@copilotkit/react-ui 1.7.2-next.1 → 1.8.0-next.3

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # ui
 
+## 1.8.0-next.3
+
+### Minor Changes
+
+- 20f0727: - feat(chat): redesign chat
+
+### Patch Changes
+
+- @copilotkit/react-core@1.8.0-next.3
+- @copilotkit/runtime-client-gql@1.8.0-next.3
+- @copilotkit/shared@1.8.0-next.3
+
+## 1.7.2-next.2
+
+### Patch Changes
+
+- c11fab9: - chore(react-ui): Add DefaultResponseRenderer and DefaultStateRenderer components
+  - @copilotkit/react-core@1.7.2-next.2
+  - @copilotkit/runtime-client-gql@1.7.2-next.2
+  - @copilotkit/shared@1.7.2-next.2
+
 ## 1.7.2-next.1
 
 ### Patch Changes

package/dist/{chunk-QXTRFMPM.mjs → chunk-2LRE4W6A.mjs}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-YQFVRDNC.mjs";
 import {
   useChatContext
-} from "./chunk-CBBFRI3Q.mjs";
+} from "./chunk-5JY5QJ2W.mjs";
 import {
   usePushToTalk
 } from "./chunk-S5MBUNGN.mjs";
@@ -12,7 +12,7 @@ import {
 import { useEffect, useRef, useState } from "react";
 import { useCopilotContext } from "@copilotkit/react-core";
 import { jsx, jsxs } from "react/jsx-runtime";
-var Input = ({ inProgress, onSend, isVisible = false }) => {
+var Input = ({ inProgress, onSend, isVisible = false, onStop }) => {
   const context = useChatContext();
   const copilotContext = useCopilotContext();
   const pushToTalkConfigured = copilotContext.copilotApiConfig.textToSpeechUrl !== void 0 && copilotContext.copilotApiConfig.transcribeAudioUrl !== void 0;
@@ -42,16 +42,17 @@ var Input = ({ inProgress, onSend, isVisible = false }) => {
     sendFunction: onSend,
     inProgress
   });
-  const sendIcon = inProgress || pushToTalkState === "transcribing" ? context.icons.activityIcon : context.icons.sendIcon;
+  const isInProgress = inProgress || pushToTalkState === "transcribing";
+  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;
     const interruptInProgress = (interruptEvent == null ? void 0 : interruptEvent.name) === "LangGraphInterruptEvent" && !(interruptEvent == null ? void 0 : interruptEvent.response);
-    return !inProgress && text.trim().length > 0 && pushToTalkState === "idle" && !interruptInProgress;
+    return (isInProgress || !isInProgress && text.trim().length > 0) && pushToTalkState === "idle" && !interruptInProgress;
   };
   const sendDisabled = !canSend();
-  return /* @__PURE__ */ jsxs("div", { className: "copilotKitInput", onClick: handleDivClick, children: [
+  return /* @__PURE__ */ jsx("div", { className: "copilotKitInputContainer", children: /* @__PURE__ */ jsxs("div", { className: "copilotKitInput", onClick: handleDivClick, children: [
     /* @__PURE__ */ jsx(
       Textarea_default,
       {
@@ -72,6 +73,7 @@ var Input = ({ inProgress, onSend, isVisible = false }) => {
       }
     ),
     /* @__PURE__ */ jsxs("div", { className: "copilotKitInputControls", children: [
+      /* @__PURE__ */ jsx("div", { style: { flexGrow: 1 } }),
       showPushToTalk && /* @__PURE__ */ jsx(
         "button",
         {
@@ -84,17 +86,17 @@ var Input = ({ inProgress, onSend, isVisible = false }) => {
         "button",
         {
           disabled: sendDisabled,
-          onClick: send,
-          "data-copilotkit-in-progress": !!inProgress,
-          "data-testid": inProgress ? "copilot-chat-request-in-progress" : void 0,
-          children: sendIcon
+          onClick: isInProgress ? onStop : send,
+          "data-copilotkit-in-progress": inProgress,
+          "data-test-id": inProgress ? "copilot-chat-request-in-progress" : "copilot-chat-ready",
+          children: buttonIcon
         }
       )
     ] })
-  ] });
+  ] }) });
 };
 
 export {
   Input
 };
-//# sourceMappingURL=chunk-QXTRFMPM.mjs.map
+//# sourceMappingURL=chunk-2LRE4W6A.mjs.map

package/dist/chunk-2LRE4W6A.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Input.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { InputProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport AutoResizingTextarea from \"./Textarea\";\nimport { usePushToTalk } from \"../../hooks/use-push-to-talk\";\nimport { useCopilotContext } from \"@copilotkit/react-core\";\n\nexport const Input = ({ inProgress, onSend, isVisible = false, onStop }: InputProps) => {\n  const context = useChatContext();\n  const copilotContext = useCopilotContext();\n\n  const pushToTalkConfigured =\n    copilotContext.copilotApiConfig.textToSpeechUrl !== undefined &&\n    copilotContext.copilotApiConfig.transcribeAudioUrl !== undefined;\n\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n  const handleDivClick = (event: React.MouseEvent<HTMLDivElement>) => {\n    // Check if the clicked element is not the textarea itself\n    if (event.target !== event.currentTarget) return;\n\n    textareaRef.current?.focus();\n  };\n\n  const [text, setText] = useState(\"\");\n  const send = () => {\n    if (inProgress) return;\n    onSend(text);\n    setText(\"\");\n\n    textareaRef.current?.focus();\n  };\n\n  useEffect(() => {\n    if (isVisible) {\n      textareaRef.current?.focus();\n    }\n  }, [isVisible]);\n\n  const { pushToTalkState, setPushToTalkState } = usePushToTalk({\n    sendFunction: onSend,\n    inProgress,\n  });\n\n  const isInProgress = inProgress || pushToTalkState === \"transcribing\";\n  const buttonIcon = isInProgress ? context.icons.stopIcon : context.icons.sendIcon;\n  const showPushToTalk =\n    pushToTalkConfigured &&\n    (pushToTalkState === \"idle\" || pushToTalkState === \"recording\") &&\n    !inProgress;\n\n  const canSend = () => {\n    const interruptEvent = copilotContext.langGraphInterruptAction?.event;\n    const interruptInProgress =\n      interruptEvent?.name === \"LangGraphInterruptEvent\" && !interruptEvent?.response;\n\n    return (\n      (isInProgress || (!isInProgress && text.trim().length > 0)) &&\n      pushToTalkState === \"idle\" &&\n      !interruptInProgress\n    );\n  };\n\n  const sendDisabled = !canSend();\n\n  return (\n    <div className=\"copilotKitInputContainer\">\n      <div className=\"copilotKitInput\" onClick={handleDivClick}>\n        <AutoResizingTextarea\n          ref={textareaRef}\n          placeholder={context.labels.placeholder}\n          autoFocus={true}\n          maxRows={5}\n          value={text}\n          onChange={(event) => setText(event.target.value)}\n          onKeyDown={(event) => {\n            if (event.key === \"Enter\" && !event.shiftKey) {\n              event.preventDefault();\n              if (canSend()) {\n                send();\n              }\n            }\n          }}\n        />\n        <div className=\"copilotKitInputControls\">\n          <div style={{ flexGrow: 1 }} />\n          {showPushToTalk && (\n            <button\n              onClick={() =>\n                setPushToTalkState(pushToTalkState === \"idle\" ? \"recording\" : \"transcribing\")\n              }\n              className={pushToTalkState === \"recording\" ? \"copilotKitPushToTalkRecording\" : \"\"}\n            >\n              {context.icons.pushToTalkIcon}\n            </button>\n          )}\n          <button\n            disabled={sendDisabled}\n            onClick={isInProgress ? onStop : send}\n            data-copilotkit-in-progress={inProgress}\n            data-test-id={inProgress ? \"copilot-chat-request-in-progress\" : \"copilot-chat-ready\"}\n          >\n            {buttonIcon}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAAA,SAAgB,WAAW,QAAQ,gBAAgB;AAKnD,SAAS,yBAAyB;AA+D1B,cAgBA,YAhBA;AA7DD,IAAM,QAAQ,CAAC,EAAE,YAAY,QAAQ,YAAY,OAAO,OAAO,MAAkB;AACtF,QAAM,UAAU,eAAe;AAC/B,QAAM,iBAAiB,kBAAkB;AAEzC,QAAM,uBACJ,eAAe,iBAAiB,oBAAoB,UACpD,eAAe,iBAAiB,uBAAuB;AAEzD,QAAM,cAAc,OAA4B,IAAI;AAEpD,QAAM,iBAAiB,CAAC,UAA4C;AAjBtE;AAmBI,QAAI,MAAM,WAAW,MAAM;AAAe;AAE1C,sBAAY,YAAZ,mBAAqB;AAAA,EACvB;AAEA,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,EAAE;AACnC,QAAM,OAAO,MAAM;AAzBrB;AA0BI,QAAI;AAAY;AAChB,WAAO,IAAI;AACX,YAAQ,EAAE;AAEV,sBAAY,YAAZ,mBAAqB;AAAA,EACvB;AAEA,YAAU,MAAM;AAjClB;AAkCI,QAAI,WAAW;AACb,wBAAY,YAAZ,mBAAqB;AAAA,IACvB;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,EAAE,iBAAiB,mBAAmB,IAAI,cAAc;AAAA,IAC5D,cAAc;AAAA,IACd;AAAA,EACF,CAAC;AAED,QAAM,eAAe,cAAc,oBAAoB;AACvD,QAAM,aAAa,eAAe,QAAQ,MAAM,WAAW,QAAQ,MAAM;AACzE,QAAM,iBACJ,yBACC,oBAAoB,UAAU,oBAAoB,gBACnD,CAAC;AAEH,QAAM,UAAU,MAAM;AAnDxB;AAoDI,UAAM,kBAAiB,oBAAe,6BAAf,mBAAyC;AAChE,UAAM,uBACJ,iDAAgB,UAAS,6BAA6B,EAAC,iDAAgB;AAEzE,YACG,gBAAiB,CAAC,gBAAgB,KAAK,KAAK,EAAE,SAAS,MACxD,oBAAoB,UACpB,CAAC;AAAA,EAEL;AAEA,QAAM,eAAe,CAAC,QAAQ;AAE9B,SACE,oBAAC,SAAI,WAAU,4BACb,+BAAC,SAAI,WAAU,mBAAkB,SAAS,gBACxC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,aAAa,QAAQ,OAAO;AAAA,QAC5B,WAAW;AAAA,QACX,SAAS;AAAA,QACT,OAAO;AAAA,QACP,UAAU,CAAC,UAAU,QAAQ,MAAM,OAAO,KAAK;AAAA,QAC/C,WAAW,CAAC,UAAU;AACpB,cAAI,MAAM,QAAQ,WAAW,CAAC,MAAM,UAAU;AAC5C,kBAAM,eAAe;AACrB,gBAAI,QAAQ,GAAG;AACb,mBAAK;AAAA,YACP;AAAA,UACF;AAAA,QACF;AAAA;AAAA,IACF;AAAA,IACA,qBAAC,SAAI,WAAU,2BACb;AAAA,0BAAC,SAAI,OAAO,EAAE,UAAU,EAAE,GAAG;AAAA,MAC5B,kBACC;AAAA,QAAC;AAAA;AAAA,UACC,SAAS,MACP,mBAAmB,oBAAoB,SAAS,cAAc,cAAc;AAAA,UAE9E,WAAW,oBAAoB,cAAc,kCAAkC;AAAA,UAE9E,kBAAQ,MAAM;AAAA;AAAA,MACjB;AAAA,MAEF;AAAA,QAAC;AAAA;AAAA,UACC,UAAU;AAAA,UACV,SAAS,eAAe,SAAS;AAAA,UACjC,+BAA6B;AAAA,UAC7B,gBAAc,aAAa,qCAAqC;AAAA,UAE/D;AAAA;AAAA,MACH;AAAA,OACF;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/{chunk-2C3ANQCY.mjs → chunk-5GNYGURH.mjs}

@@ -1,3 +1,9 @@
+import {
+  AssistantMessage
+} from "./chunk-FBYETUFL.mjs";
+import {
+  RenderActionExecutionMessage
+} from "./chunk-XB6QCUPB.mjs";
 import {
   RenderAgentStateMessage
 } from "./chunk-UWWMAJ7R.mjs";
@@ -6,36 +12,27 @@ import {
 } from "./chunk-WEYDZBT7.mjs";
 import {
   RenderTextMessage
-} from "./chunk-OFYI4UU4.mjs";
+} from "./chunk-7RIBDD4K.mjs";
 import {
   UserMessage
 } from "./chunk-HEIDCT7I.mjs";
-import {
-  AssistantMessage
-} from "./chunk-3VNMQWGT.mjs";
-import {
-  RenderActionExecutionMessage
-} from "./chunk-XB6QCUPB.mjs";
 import {
   Suggestion,
   reloadSuggestions
-} from "./chunk-WGAZXTUA.mjs";
-import {
-  CopilotDevConsole
-} from "./chunk-22K5DDPF.mjs";
+} from "./chunk-TOQ7P4DO.mjs";
 import {
   Input
-} from "./chunk-QXTRFMPM.mjs";
+} from "./chunk-2LRE4W6A.mjs";
 import {
   Messages
-} from "./chunk-6FTRYYR5.mjs";
+} from "./chunk-GJME6MK4.mjs";
 import {
   ResponseButton
-} from "./chunk-3XAXY2Z3.mjs";
+} from "./chunk-UZTZXMYS.mjs";
 import {
   ChatContext,
   ChatContextProvider
-} from "./chunk-CBBFRI3Q.mjs";
+} from "./chunk-5JY5QJ2W.mjs";
 import {
   __async,
   __spreadProps,
@@ -61,6 +58,10 @@ function CopilotChat({
   onInProgress,
   onStopGeneration,
   onReloadMessages,
+  onRegenerate,
+  onCopy,
+  onThumbsUp,
+  onThumbsDown,
   Messages: Messages2 = Messages,
   RenderTextMessage: RenderTextMessage2 = RenderTextMessage,
   RenderActionExecutionMessage: RenderActionExecutionMessage2 = RenderActionExecutionMessage,
@@ -104,9 +105,19 @@ function CopilotChat({
   );
   const chatContext = React.useContext(ChatContext);
   const isVisible = chatContext ? chatContext.open : true;
+  const handleRegenerate = () => {
+    if (onRegenerate) {
+      onRegenerate();
+    }
+    reloadMessages();
+  };
+  const handleCopy = (message) => {
+    if (onCopy) {
+      onCopy(message);
+    }
+  };
   return /* @__PURE__ */ jsxs(WrappedCopilotChat, { icons, labels, className, children: [
-    /* @__PURE__ */ jsx(CopilotDevConsole, {}),
-    /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(
       Messages2,
       {
         AssistantMessage: AssistantMessage2,
@@ -117,32 +128,32 @@ function CopilotChat({
         RenderResultMessage: RenderResultMessage2,
         messages: visibleMessages,
         inProgress: isLoading,
-        children: [
-          currentSuggestions.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx("h6", { children: "Suggested:" }),
-            /* @__PURE__ */ jsx("div", { className: "suggestions", children: currentSuggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
-              Suggestion,
-              {
-                title: suggestion.title,
-                message: suggestion.message,
-                partial: suggestion.partial,
-                className: suggestion.className,
-                onClick: (message) => sendMessage(message)
-              },
-              index
-            )) })
-          ] }),
-          showResponseButton && visibleMessages.length > 0 && /* @__PURE__ */ jsx(
-            ResponseButton2,
-            {
-              onClick: isLoading ? stopGeneration : reloadMessages,
-              inProgress: isLoading
-            }
-          )
-        ]
+        onRegenerate: handleRegenerate,
+        onCopy: handleCopy,
+        onThumbsUp,
+        onThumbsDown,
+        children: currentSuggestions.length > 0 && /* @__PURE__ */ jsx("div", { className: "suggestions", children: currentSuggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
+          Suggestion,
+          {
+            title: suggestion.title,
+            message: suggestion.message,
+            partial: suggestion.partial,
+            className: suggestion.className,
+            onClick: (message) => sendMessage(message)
+          },
+          index
+        )) })
       }
     ),
-    /* @__PURE__ */ jsx(Input2, { inProgress: isLoading, onSend: sendMessage, isVisible })
+    /* @__PURE__ */ jsx(
+      Input2,
+      {
+        inProgress: isLoading,
+        onSend: sendMessage,
+        isVisible,
+        onStop: stopGeneration
+      }
+    )
   ] });
 }
 function WrappedCopilotChat({
@@ -321,4 +332,4 @@ export {
   WrappedCopilotChat,
   useCopilotChatLogic
 };
-//# sourceMappingURL=chunk-2C3ANQCY.mjs.map
+//# sourceMappingURL=chunk-5GNYGURH.mjs.map

package/dist/chunk-5GNYGURH.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Chat.tsx"],"sourcesContent":["/**\n * <br/>\n * <img src=\"/images/CopilotChat.gif\" width=\"500\" />\n *\n * A chatbot panel component for the CopilotKit framework. The component allows for a high degree\n * of customization through various props and custom CSS.\n *\n * ## Install Dependencies\n *\n * This component is part of the [@copilotkit/react-ui](https://npmjs.com/package/@copilotkit/react-ui) package.\n *\n * ```shell npm2yarn \\\"@copilotkit/react-ui\"\\\n * npm install @copilotkit/react-core @copilotkit/react-ui\n * ```\n *\n * ## Usage\n *\n * ```tsx\n * import { CopilotChat } from \"@copilotkit/react-ui\";\n * import \"@copilotkit/react-ui/styles.css\";\n *\n * <CopilotChat\n *   labels={{\n *     title: \"Your Assistant\",\n *     initial: \"Hi! 👋 How can I assist you today?\",\n *   }}\n * />\n * ```\n *\n * ### Look & Feel\n *\n * By default, CopilotKit components do not have any styles. You can import CopilotKit's stylesheet at the root of your project:\n * ```tsx title=\"YourRootComponent.tsx\"\n * ...\n * import \"@copilotkit/react-ui/styles.css\"; // [!code highlight]\n *\n * export function YourRootComponent() {\n *   return (\n *     <CopilotKit>\n *       ...\n *     </CopilotKit>\n *   );\n * }\n * ```\n * For more information about how to customize the styles, check out the [Customize Look & Feel](/guides/custom-look-and-feel/customize-built-in-ui-components) guide.\n */\n\nimport {\n  ChatContext,\n  ChatContextProvider,\n  CopilotChatIcons,\n  CopilotChatLabels,\n} from \"./ChatContext\";\nimport { Messages as DefaultMessages } from \"./Messages\";\nimport { Input as DefaultInput } from \"./Input\";\nimport { ResponseButton as DefaultResponseButton } from \"./Response\";\nimport { RenderTextMessage as DefaultRenderTextMessage } from \"./messages/RenderTextMessage\";\nimport { RenderActionExecutionMessage as DefaultRenderActionExecutionMessage } from \"./messages/RenderActionExecutionMessage\";\nimport { RenderResultMessage as DefaultRenderResultMessage } from \"./messages/RenderResultMessage\";\nimport { RenderAgentStateMessage as DefaultRenderAgentStateMessage } from \"./messages/RenderAgentStateMessage\";\nimport { AssistantMessage as DefaultAssistantMessage } from \"./messages/AssistantMessage\";\nimport { UserMessage as DefaultUserMessage } from \"./messages/UserMessage\";\nimport { Suggestion } from \"./Suggestion\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport {\n  SystemMessageFunction,\n  useCopilotChat,\n  useCopilotContext,\n  useCopilotMessagesContext,\n} from \"@copilotkit/react-core\";\nimport { reloadSuggestions } from \"./Suggestion\";\nimport { CopilotChatSuggestion } from \"../../types/suggestions\";\nimport { Message, Role, TextMessage } from \"@copilotkit/runtime-client-gql\";\nimport { randomId } from \"@copilotkit/shared\";\nimport {\n  AssistantMessageProps,\n  InputProps,\n  MessagesProps,\n  RenderMessageProps,\n  ResponseButtonProps,\n  UserMessageProps,\n} from \"./props\";\n\nimport { CopilotDevConsole } from \"../dev-console\";\nimport { HintFunction, runAgent, stopAgent } from \"@copilotkit/react-core\";\n\n/**\n * Props for CopilotChat component.\n */\nexport interface CopilotChatProps {\n  /**\n   * Custom instructions to be added to the system message. Use this property to\n   * provide additional context or guidance to the language model, influencing\n   * its responses. These instructions can include specific directions,\n   * preferences, or criteria that the model should consider when generating\n   * its output, thereby tailoring the conversation more precisely to the\n   * user's needs or the application's requirements.\n   */\n  instructions?: string;\n\n  /**\n   * A callback that gets called when the in progress state changes.\n   */\n  onInProgress?: (inProgress: boolean) => void;\n\n  /**\n   * A callback that gets called when a new message it submitted.\n   */\n  onSubmitMessage?: (message: string) => void | Promise<void>;\n\n  /**\n   * A custom stop generation function.\n   */\n  onStopGeneration?: OnStopGeneration;\n\n  /**\n   * A custom reload messages function.\n   */\n  onReloadMessages?: OnReloadMessages;\n\n  /**\n   * A callback function to regenerate the assistant's response\n   */\n  onRegenerate?: () => void;\n\n  /**\n   * A callback function when the message is copied\n   */\n  onCopy?: (message: string) => void;\n\n  /**\n   * A callback function for thumbs up feedback\n   */\n  onThumbsUp?: (message: string) => void;\n\n  /**\n   * A callback function for thumbs down feedback\n   */\n  onThumbsDown?: (message: string) => void;\n\n  /**\n   * Icons can be used to set custom icons for the chat window.\n   */\n  icons?: CopilotChatIcons;\n\n  /**\n   * Labels can be used to set custom labels for the chat window.\n   */\n  labels?: CopilotChatLabels;\n\n  /**\n   * A function that takes in context string and instructions and returns\n   * the system message to include in the chat request.\n   * Use this to completely override the system message, when providing\n   * instructions is not enough.\n   */\n  makeSystemMessage?: SystemMessageFunction;\n\n  /**\n   * Whether to show the response button.\n   * @default true\n   */\n  showResponseButton?: boolean;\n\n  /**\n   * A custom assistant message component to use instead of the default.\n   */\n  AssistantMessage?: React.ComponentType<AssistantMessageProps>;\n\n  /**\n   * A custom user message component to use instead of the default.\n   */\n  UserMessage?: React.ComponentType<UserMessageProps>;\n\n  /**\n   * A custom Messages component to use instead of the default.\n   */\n  Messages?: React.ComponentType<MessagesProps>;\n\n  /**\n   * A custom RenderTextMessage component to use instead of the default.\n   */\n  RenderTextMessage?: React.ComponentType<RenderMessageProps>;\n\n  /**\n   * A custom RenderActionExecutionMessage component to use instead of the default.\n   */\n  RenderActionExecutionMessage?: React.ComponentType<RenderMessageProps>;\n\n  /**\n   * A custom RenderAgentStateMessage component to use instead of the default.\n   */\n  RenderAgentStateMessage?: React.ComponentType<RenderMessageProps>;\n\n  /**\n   * A custom RenderResultMessage component to use instead of the default.\n   */\n  RenderResultMessage?: React.ComponentType<RenderMessageProps>;\n\n  /**\n   * A custom Input component to use instead of the default.\n   */\n  Input?: React.ComponentType<InputProps>;\n\n  /**\n   * A custom ResponseButton component to use instead of the default.\n   */\n  ResponseButton?: React.ComponentType<ResponseButtonProps>;\n\n  /**\n   * A class name to apply to the root element.\n   */\n  className?: string;\n\n  /**\n   * Children to render.\n   */\n  children?: React.ReactNode;\n}\n\ninterface OnStopGenerationArguments {\n  /**\n   * The name of the currently executing agent.\n   */\n  currentAgentName: string | undefined;\n\n  /**\n   * The messages in the chat.\n   */\n  messages: Message[];\n\n  /**\n   * Set the messages in the chat.\n   */\n  setMessages: (messages: Message[]) => void;\n\n  /**\n   * Stop chat generation.\n   */\n  stopGeneration: () => void;\n\n  /**\n   * Restart the currently executing agent.\n   */\n  restartCurrentAgent: () => void;\n\n  /**\n   * Stop the currently executing agent.\n   */\n  stopCurrentAgent: () => void;\n\n  /**\n   * Run the currently executing agent.\n   */\n  runCurrentAgent: (hint?: HintFunction) => Promise<void>;\n\n  /**\n   * Set the state of the currently executing agent.\n   */\n  setCurrentAgentState: (state: any) => void;\n}\n\nexport type OnReloadMessagesArguments = OnStopGenerationArguments;\n\nexport type OnStopGeneration = (args: OnStopGenerationArguments) => void;\n\nexport type OnReloadMessages = (args: OnReloadMessagesArguments) => void;\n\nexport function CopilotChat({\n  instructions,\n  onSubmitMessage,\n  makeSystemMessage,\n  showResponseButton = true,\n  onInProgress,\n  onStopGeneration,\n  onReloadMessages,\n  onRegenerate,\n  onCopy,\n  onThumbsUp,\n  onThumbsDown,\n  Messages = DefaultMessages,\n  RenderTextMessage = DefaultRenderTextMessage,\n  RenderActionExecutionMessage = DefaultRenderActionExecutionMessage,\n  RenderAgentStateMessage = DefaultRenderAgentStateMessage,\n  RenderResultMessage = DefaultRenderResultMessage,\n  Input = DefaultInput,\n  ResponseButton = DefaultResponseButton,\n  className,\n  icons,\n  labels,\n  AssistantMessage = DefaultAssistantMessage,\n  UserMessage = DefaultUserMessage,\n}: CopilotChatProps) {\n  const { additionalInstructions, setChatInstructions } = useCopilotContext();\n\n  useEffect(() => {\n    if (!additionalInstructions?.length) {\n      setChatInstructions(instructions || \"\");\n      return;\n    }\n\n    /*\n      Will result in a prompt like:\n\n      You are a helpful assistant. \n      Additionally, follow these instructions:\n      - Do not answer questions about the weather.\n      - Do not answer questions about the stock market.\"\n    */\n    const combinedAdditionalInstructions = [\n      instructions,\n      \"Additionally, follow these instructions:\",\n      ...additionalInstructions.map((instruction) => `- ${instruction}`),\n    ];\n\n    console.log(\"combinedAdditionalInstructions\", combinedAdditionalInstructions);\n\n    setChatInstructions(combinedAdditionalInstructions.join(\"\\n\") || \"\");\n  }, [instructions, additionalInstructions]);\n\n  const {\n    visibleMessages,\n    isLoading,\n    currentSuggestions,\n    sendMessage,\n    stopGeneration,\n    reloadMessages,\n  } = useCopilotChatLogic(\n    makeSystemMessage,\n    onInProgress,\n    onSubmitMessage,\n    onStopGeneration,\n    onReloadMessages,\n  );\n\n  const chatContext = React.useContext(ChatContext);\n  const isVisible = chatContext ? chatContext.open : true;\n\n  const handleRegenerate = () => {\n    if (onRegenerate) {\n      onRegenerate();\n    }\n\n    reloadMessages();\n  };\n\n  const handleCopy = (message: string) => {\n    if (onCopy) {\n      onCopy(message);\n    }\n  };\n\n  return (\n    <WrappedCopilotChat icons={icons} labels={labels} className={className}>\n      <Messages\n        AssistantMessage={AssistantMessage}\n        UserMessage={UserMessage}\n        RenderTextMessage={RenderTextMessage}\n        RenderActionExecutionMessage={RenderActionExecutionMessage}\n        RenderAgentStateMessage={RenderAgentStateMessage}\n        RenderResultMessage={RenderResultMessage}\n        messages={visibleMessages}\n        inProgress={isLoading}\n        onRegenerate={handleRegenerate}\n        onCopy={handleCopy}\n        onThumbsUp={onThumbsUp}\n        onThumbsDown={onThumbsDown}\n      >\n        {currentSuggestions.length > 0 && (\n          <div className=\"suggestions\">\n            {currentSuggestions.map((suggestion, index) => (\n              <Suggestion\n                key={index}\n                title={suggestion.title}\n                message={suggestion.message}\n                partial={suggestion.partial}\n                className={suggestion.className}\n                onClick={(message) => sendMessage(message)}\n              />\n            ))}\n          </div>\n        )}\n      </Messages>\n      <Input\n        inProgress={isLoading}\n        onSend={sendMessage}\n        isVisible={isVisible}\n        onStop={stopGeneration}\n      />\n    </WrappedCopilotChat>\n  );\n}\n\nexport function WrappedCopilotChat({\n  children,\n  icons,\n  labels,\n  className,\n}: {\n  children: React.ReactNode;\n  icons?: CopilotChatIcons;\n  labels?: CopilotChatLabels;\n  className?: string;\n}) {\n  const chatContext = React.useContext(ChatContext);\n  if (!chatContext) {\n    return (\n      <ChatContextProvider icons={icons} labels={labels} open={true} setOpen={() => {}}>\n        <div className={`copilotKitChat ${className}`}>{children}</div>\n      </ChatContextProvider>\n    );\n  }\n  return <>{children}</>;\n}\n\nconst SUGGESTIONS_DEBOUNCE_TIMEOUT = 1000;\n\nexport const useCopilotChatLogic = (\n  makeSystemMessage?: SystemMessageFunction,\n  onInProgress?: (isLoading: boolean) => void,\n  onSubmitMessage?: (messageContent: string) => Promise<void> | void,\n  onStopGeneration?: OnStopGeneration,\n  onReloadMessages?: OnReloadMessages,\n) => {\n  const {\n    visibleMessages,\n    appendMessage,\n    reloadMessages: defaultReloadMessages,\n    stopGeneration: defaultStopGeneration,\n    runChatCompletion,\n    isLoading,\n  } = useCopilotChat({\n    id: randomId(),\n    makeSystemMessage,\n  });\n\n  const [currentSuggestions, setCurrentSuggestions] = useState<CopilotChatSuggestion[]>([]);\n  const suggestionsAbortControllerRef = useRef<AbortController | null>(null);\n  const debounceTimerRef = useRef<any>();\n\n  const abortSuggestions = () => {\n    suggestionsAbortControllerRef.current?.abort();\n    suggestionsAbortControllerRef.current = null;\n  };\n\n  const generalContext = useCopilotContext();\n  const messagesContext = useCopilotMessagesContext();\n  const context = { ...generalContext, ...messagesContext };\n\n  useEffect(() => {\n    onInProgress?.(isLoading);\n\n    abortSuggestions();\n\n    debounceTimerRef.current = setTimeout(\n      () => {\n        if (!isLoading && Object.keys(context.chatSuggestionConfiguration).length !== 0) {\n          suggestionsAbortControllerRef.current = new AbortController();\n          reloadSuggestions(\n            context,\n            context.chatSuggestionConfiguration,\n            setCurrentSuggestions,\n            suggestionsAbortControllerRef,\n          );\n        }\n      },\n      currentSuggestions.length == 0 ? 0 : SUGGESTIONS_DEBOUNCE_TIMEOUT,\n    );\n\n    return () => {\n      clearTimeout(debounceTimerRef.current);\n    };\n  }, [\n    isLoading,\n    context.chatSuggestionConfiguration,\n    // hackish way to trigger suggestions reload on reset, but better than moving suggestions to the\n    // global context\n    visibleMessages.length == 0,\n  ]);\n\n  const sendMessage = async (messageContent: string) => {\n    abortSuggestions();\n    setCurrentSuggestions([]);\n\n    const message: Message = new TextMessage({\n      content: messageContent,\n      role: Role.User,\n    });\n\n    if (onSubmitMessage) {\n      try {\n        await onSubmitMessage(messageContent);\n      } catch (error) {\n        console.error(\"Error in onSubmitMessage:\", error);\n      }\n    }\n    // this needs to happen after onSubmitMessage, because it will trigger submission\n    // of the message to the endpoint. Some users depend on performing some actions\n    // before the message is submitted.\n    appendMessage(message);\n\n    return message;\n  };\n\n  const messages = visibleMessages;\n  const { setMessages } = messagesContext;\n  const currentAgentName = generalContext.agentSession?.agentName;\n  const restartCurrentAgent = async (hint?: HintFunction) => {\n    if (generalContext.agentSession) {\n      generalContext.setAgentSession({\n        ...generalContext.agentSession,\n        nodeName: undefined,\n        threadId: undefined,\n      });\n      generalContext.setCoagentStates((prevAgentStates) => {\n        return {\n          ...prevAgentStates,\n          [generalContext.agentSession!.agentName]: {\n            ...prevAgentStates[generalContext.agentSession!.agentName],\n            threadId: undefined,\n            nodeName: undefined,\n            runId: undefined,\n          },\n        };\n      });\n    }\n  };\n  const runCurrentAgent = async (hint?: HintFunction) => {\n    if (generalContext.agentSession) {\n      await runAgent(\n        generalContext.agentSession.agentName,\n        context,\n        appendMessage,\n        runChatCompletion,\n        hint,\n      );\n    }\n  };\n  const stopCurrentAgent = () => {\n    if (generalContext.agentSession) {\n      stopAgent(generalContext.agentSession.agentName, context);\n    }\n  };\n  const setCurrentAgentState = (state: any) => {\n    if (generalContext.agentSession) {\n      generalContext.setCoagentStates((prevAgentStates) => {\n        return {\n          ...prevAgentStates,\n          [generalContext.agentSession!.agentName]: {\n            state,\n          },\n        } as any;\n      });\n    }\n  };\n\n  function stopGeneration() {\n    if (onStopGeneration) {\n      onStopGeneration({\n        messages,\n        setMessages,\n        stopGeneration: defaultStopGeneration,\n        currentAgentName,\n        restartCurrentAgent,\n        stopCurrentAgent,\n        runCurrentAgent,\n        setCurrentAgentState,\n      });\n    } else {\n      defaultStopGeneration();\n    }\n  }\n  function reloadMessages() {\n    if (onReloadMessages) {\n      onReloadMessages({\n        messages,\n        setMessages,\n        stopGeneration: defaultStopGeneration,\n        currentAgentName,\n        restartCurrentAgent,\n        stopCurrentAgent,\n        runCurrentAgent,\n        setCurrentAgentState,\n      });\n    } else {\n      defaultReloadMessages();\n    }\n  }\n\n  return {\n    visibleMessages,\n    isLoading,\n    currentSuggestions,\n    sendMessage,\n    stopGeneration,\n    reloadMessages,\n  };\n};\n"],"mappings":"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","names":["Messages","RenderTextMessage","RenderActionExecutionMessage","RenderAgentStateMessage","RenderResultMessage","Input","ResponseButton","AssistantMessage","UserMessage","_a"]}

package/dist/{chunk-CBBFRI3Q.mjs → chunk-5JY5QJ2W.mjs}

@@ -2,13 +2,13 @@ import {
   ActivityIcon,
   CloseIcon,
   HeaderCloseIcon,
+  MicrophoneIcon,
   OpenIcon,
-  PushToTalkIcon,
   RegenerateIcon,
   SendIcon,
   SpinnerIcon,
   StopIcon
-} from "./chunk-FZC7X5PK.mjs";
+} from "./chunk-ORSMX3SE.mjs";
 import {
   __spreadValues
 } from "./chunk-MRXNTQOX.mjs";
@@ -43,7 +43,11 @@ var ChatContextProvider = ({
       placeholder: "Type a message...",
       error: "\u274C An error occurred. Please try again.",
       stopGenerating: "Stop generating",
-      regenerateResponse: "Regenerate response"
+      regenerateResponse: "Regenerate response",
+      copyToClipboard: "Copy to clipboard",
+      thumbsUp: "Thumbs up",
+      thumbsDown: "Thumbs down",
+      copied: "Copied!"
     }), labels),
     [labels]
   );
@@ -57,7 +61,7 @@ var ChatContextProvider = ({
       spinnerIcon: SpinnerIcon,
       stopIcon: StopIcon,
       regenerateIcon: RegenerateIcon,
-      pushToTalkIcon: PushToTalkIcon
+      pushToTalkIcon: MicrophoneIcon
     }), icons),
     [icons]
   );
@@ -78,4 +82,4 @@ export {
   useChatContext,
   ChatContextProvider
 };
-//# sourceMappingURL=chunk-CBBFRI3Q.mjs.map
+//# sourceMappingURL=chunk-5JY5QJ2W.mjs.map

package/dist/chunk-5JY5QJ2W.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/ChatContext.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n  /**\n   * The icon to use for the open chat button.\n   * @default <OpenIcon />\n   */\n  openIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button.\n   * @default <CloseIcon />\n   */\n  closeIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button in the header.\n   * @default <HeaderCloseIcon />\n   */\n  headerCloseIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the send button.\n   * @default <SendIcon />\n   */\n  sendIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the activity indicator.\n   * @default <ActivityIcon />\n   */\n  activityIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the spinner.\n   * @default <SpinnerIcon />\n   */\n  spinnerIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the stop button.\n   * @default <StopIcon />\n   */\n  stopIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the regenerate button.\n   * @default <RegenerateIcon />\n   */\n  regenerateIcon?: React.ReactNode;\n\n  /**\n   * The icons to use for push to talk.\n   * @default <PushToTalkIcon />\n   */\n\n  pushToTalkIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n  /**\n   * The initial message(s) to display in the chat window.\n   */\n  initial?: string | string[];\n\n  /**\n   * The title to display in the header.\n   * @default \"CopilotKit\"\n   */\n  title?: string;\n\n  /**\n   * The placeholder to display in the input.\n   * @default \"Type a message...\"\n   */\n  placeholder?: string;\n\n  /**\n   * The message to display when an error occurs.\n   * @default \"❌ An error occurred. Please try again.\"\n   */\n  error?: string;\n\n  /**\n   * The label to display on the stop button.\n   * @default \"Stop generating\"\n   */\n  stopGenerating?: string;\n\n  /**\n   * The label to display on the regenerate button.\n   * @default \"Regenerate response\"\n   */\n  regenerateResponse?: string;\n\n  /**\n   * The label for the copy button.\n   * @default \"Copy to clipboard\"\n   */\n  copyToClipboard?: string;\n\n  /**\n   * The label for the thumbs up button.\n   * @default \"Thumbs up\"\n   */\n  thumbsUp?: string;\n\n  /**\n   * The label for the thumbs down button.\n   * @default \"Thumbs down\"\n   */\n  thumbsDown?: string;\n\n  /**\n   * The text to display when content is copied.\n   * @default \"Copied!\"\n   */\n  copied?: string;\n}\n\ninterface ChatContext {\n  labels: Required<CopilotChatLabels>;\n  icons: Required<CopilotChatIcons>;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nexport const ChatContext = React.createContext<ChatContext | undefined>(undefined);\n\nexport function useChatContext(): ChatContext {\n  const context = React.useContext(ChatContext);\n  if (context === undefined) {\n    throw new Error(\n      \"Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?\",\n    );\n  }\n  return context;\n}\n\ninterface ChatContextProps {\n  // temperature?: number;\n  // instructions?: string;\n  // maxFeedback?: number;\n  labels?: CopilotChatLabels;\n  icons?: CopilotChatIcons;\n  children?: React.ReactNode;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nexport const ChatContextProvider = ({\n  // temperature,\n  // instructions,\n  // maxFeedback,\n  labels,\n  icons,\n  children,\n  open,\n  setOpen,\n}: ChatContextProps) => {\n  const memoizedLabels = useMemo(\n    () => ({\n      ...{\n        initial: \"\",\n        title: \"CopilotKit\",\n        placeholder: \"Type a message...\",\n        error: \"❌ An error occurred. Please try again.\",\n        stopGenerating: \"Stop generating\",\n        regenerateResponse: \"Regenerate response\",\n        copyToClipboard: \"Copy to clipboard\",\n        thumbsUp: \"Thumbs up\",\n        thumbsDown: \"Thumbs down\",\n        copied: \"Copied!\",\n      },\n      ...labels,\n    }),\n    [labels],\n  );\n\n  const memoizedIcons = useMemo(\n    () => ({\n      ...{\n        openIcon: DefaultIcons.OpenIcon,\n        closeIcon: DefaultIcons.CloseIcon,\n        headerCloseIcon: DefaultIcons.HeaderCloseIcon,\n        sendIcon: DefaultIcons.SendIcon,\n        activityIcon: DefaultIcons.ActivityIcon,\n        spinnerIcon: DefaultIcons.SpinnerIcon,\n        stopIcon: DefaultIcons.StopIcon,\n        regenerateIcon: DefaultIcons.RegenerateIcon,\n        pushToTalkIcon: DefaultIcons.MicrophoneIcon,\n      },\n      ...icons,\n    }),\n    [icons],\n  );\n\n  const context = useMemo(\n    () => ({\n      labels: memoizedLabels,\n      icons: memoizedIcons,\n      open,\n      setOpen,\n    }),\n    [memoizedLabels, memoizedIcons, open, setOpen],\n  );\n\n  return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAO,SAAS,eAAyB;AAsNhC;AAhFF,IAAM,cAAc,MAAM,cAAuC,MAAS;AAE1E,SAAS,iBAA8B;AAC5C,QAAM,UAAU,MAAM,WAAW,WAAW;AAC5C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAaO,IAAM,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,EAIlC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAwB;AACtB,QAAM,iBAAiB;AAAA,IACrB,MAAO,kCACF;AAAA,MACD,SAAS;AAAA,MACT,OAAO;AAAA,MACP,aAAa;AAAA,MACb,OAAO;AAAA,MACP,gBAAgB;AAAA,MAChB,oBAAoB;AAAA,MACpB,iBAAiB;AAAA,MACjB,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,QAAQ;AAAA,IACV,IACG;AAAA,IAEL,CAAC,MAAM;AAAA,EACT;AAEA,QAAM,gBAAgB;AAAA,IACpB,MAAO,kCACF;AAAA,MACD,UAAuB;AAAA,MACvB,WAAwB;AAAA,MACxB,iBAA8B;AAAA,MAC9B,UAAuB;AAAA,MACvB,cAA2B;AAAA,MAC3B,aAA0B;AAAA,MAC1B,UAAuB;AAAA,MACvB,gBAA6B;AAAA,MAC7B,gBAA6B;AAAA,IAC/B,IACG;AAAA,IAEL,CAAC,KAAK;AAAA,EACR;AAEA,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,MACL,QAAQ;AAAA,MACR,OAAO;AAAA,MACP;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB,eAAe,MAAM,OAAO;AAAA,EAC/C;AAEA,SAAO,oBAAC,YAAY,UAAZ,EAAqB,OAAO,SAAU,UAAS;AACzD;","names":[]}

package/dist/{chunk-OFYI4UU4.mjs → chunk-7RIBDD4K.mjs}

@@ -1,7 +1,18 @@
 // src/components/chat/messages/RenderTextMessage.tsx
 import { jsx } from "react/jsx-runtime";
 function RenderTextMessage(props) {
-  const { message, inProgress, index, isCurrentMessage, UserMessage, AssistantMessage } = props;
+  const {
+    message,
+    inProgress,
+    index,
+    isCurrentMessage,
+    UserMessage,
+    AssistantMessage,
+    onRegenerate,
+    onCopy,
+    onThumbsUp,
+    onThumbsDown
+  } = props;
   if (message.isTextMessage()) {
     if (message.role === "user") {
       return /* @__PURE__ */ jsx(
@@ -21,7 +32,12 @@ function RenderTextMessage(props) {
           message: message.content,
           rawData: message,
           isLoading: inProgress && isCurrentMessage && !message.content,
-          isGenerating: inProgress && isCurrentMessage && !!message.content
+          isGenerating: inProgress && isCurrentMessage && !!message.content,
+          isCurrentMessage,
+          onRegenerate,
+          onCopy,
+          onThumbsUp,
+          onThumbsDown
         },
         index
       );
@@ -32,4 +48,4 @@ function RenderTextMessage(props) {
 export {
   RenderTextMessage
 };
-//# sourceMappingURL=chunk-OFYI4UU4.mjs.map
+//# sourceMappingURL=chunk-7RIBDD4K.mjs.map

package/dist/chunk-7RIBDD4K.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/messages/RenderTextMessage.tsx"],"sourcesContent":["import { RenderMessageProps } from \"../props\";\n\nexport function RenderTextMessage(props: RenderMessageProps) {\n  const {\n    message,\n    inProgress,\n    index,\n    isCurrentMessage,\n    UserMessage,\n    AssistantMessage,\n    onRegenerate,\n    onCopy,\n    onThumbsUp,\n    onThumbsDown,\n  } = props;\n\n  if (message.isTextMessage()) {\n    if (message.role === \"user\") {\n      return (\n        <UserMessage\n          key={index}\n          data-message-role=\"user\"\n          message={message.content}\n          rawData={message}\n        />\n      );\n    } else if (message.role == \"assistant\") {\n      return (\n        <AssistantMessage\n          key={index}\n          data-message-role=\"assistant\"\n          message={message.content}\n          rawData={message}\n          isLoading={inProgress && isCurrentMessage && !message.content}\n          isGenerating={inProgress && isCurrentMessage && !!message.content}\n          isCurrentMessage={isCurrentMessage}\n          onRegenerate={onRegenerate}\n          onCopy={onCopy}\n          onThumbsUp={onThumbsUp}\n          onThumbsDown={onThumbsDown}\n        />\n      );\n    }\n  }\n}\n"],"mappings":";AAmBQ;AAjBD,SAAS,kBAAkB,OAA2B;AAC3D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,MAAI,QAAQ,cAAc,GAAG;AAC3B,QAAI,QAAQ,SAAS,QAAQ;AAC3B,aACE;AAAA,QAAC;AAAA;AAAA,UAEC,qBAAkB;AAAA,UAClB,SAAS,QAAQ;AAAA,UACjB,SAAS;AAAA;AAAA,QAHJ;AAAA,MAIP;AAAA,IAEJ,WAAW,QAAQ,QAAQ,aAAa;AACtC,aACE;AAAA,QAAC;AAAA;AAAA,UAEC,qBAAkB;AAAA,UAClB,SAAS,QAAQ;AAAA,UACjB,SAAS;AAAA,UACT,WAAW,cAAc,oBAAoB,CAAC,QAAQ;AAAA,UACtD,cAAc,cAAc,oBAAoB,CAAC,CAAC,QAAQ;AAAA,UAC1D;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,QAVK;AAAA,MAWP;AAAA,IAEJ;AAAA,EACF;AACF;","names":[]}

package/dist/{chunk-YAGE7RCE.mjs → chunk-CGVOCLHN.mjs}

@@ -1,6 +1,6 @@
 import {
   useChatContext
-} from "./chunk-CBBFRI3Q.mjs";
+} from "./chunk-5JY5QJ2W.mjs";
 
 // src/components/chat/Window.tsx
 import React, { useCallback, useEffect } from "react";
@@ -115,4 +115,4 @@ function isMacOS() {
 export {
   Window
 };
-//# sourceMappingURL=chunk-YAGE7RCE.mjs.map
+//# sourceMappingURL=chunk-CGVOCLHN.mjs.map

package/dist/chunk-EJG6RRSX.mjs

@@ -0,0 +1,138 @@
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-MRXNTQOX.mjs";
+
+// src/components/crew/DefaultResponseRenderer.tsx
+import { useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var createResponseCache = () => {
+  const responseCache = /* @__PURE__ */ new Map();
+  return {
+    getResponse: (id) => responseCache.get(id),
+    setResponse: (id, response) => responseCache.set(id, response)
+  };
+};
+var useResponseCache = createResponseCache();
+var DefaultExpandIcon = ({ className }) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    className,
+    width: "12",
+    height: "12",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
+  }
+);
+var DefaultCollapseIcon = ({ className }) => /* @__PURE__ */ jsx(
+  "svg",
+  {
+    className,
+    width: "12",
+    height: "12",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    children: /* @__PURE__ */ jsx("polyline", { points: "18 15 12 9 6 15" })
+  }
+);
+var DefaultContentRenderer = ({ content, className }) => /* @__PURE__ */ jsx("div", { className, children: content });
+var DefaultFeedbackButton = ({ label, onClick, className }) => /* @__PURE__ */ jsx("button", { onClick, className, children: label });
+var DefaultCompletedFeedback = ({ message, className }) => /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx("span", { children: message }) });
+var DefaultResponseRenderer = ({
+  response,
+  status,
+  onRespond,
+  icons,
+  labels,
+  ContentRenderer = DefaultContentRenderer,
+  FeedbackButton = DefaultFeedbackButton,
+  CompletedFeedback = DefaultCompletedFeedback,
+  className = "copilotkit-response",
+  contentClassName = "copilotkit-response-content",
+  actionsClassName = "copilotkit-response-actions",
+  buttonClassName = "copilotkit-response-button",
+  completedFeedbackClassName = "copilotkit-response-completed-feedback"
+}) => {
+  const [isExpanded, setIsExpanded] = useState(true);
+  const defaultLabels = {
+    responseLabel: "Response",
+    approveLabel: "Approve",
+    rejectLabel: "Reject",
+    approvedMessage: "Approved",
+    rejectedMessage: "Rejected",
+    feedbackSubmittedMessage: "Feedback submitted"
+  };
+  const mergedLabels = __spreadValues(__spreadValues({}, defaultLabels), labels);
+  const renderFeedback = () => {
+    if (status === "complete") {
+      const cachedResponse = useResponseCache.getResponse(response.id);
+      return /* @__PURE__ */ jsx(
+        CompletedFeedback,
+        {
+          message: (cachedResponse == null ? void 0 : cachedResponse.__feedback__) ? cachedResponse.__feedback__ === mergedLabels.approvedMessage ? mergedLabels.approvedMessage : mergedLabels.rejectedMessage : mergedLabels.feedbackSubmittedMessage,
+          className: completedFeedbackClassName
+        }
+      );
+    }
+    if (status === "inProgress" || status === "executing") {
+      return /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          FeedbackButton,
+          {
+            label: mergedLabels.approveLabel,
+            onClick: () => {
+              setIsExpanded(false);
+              onRespond == null ? void 0 : onRespond(mergedLabels.approveLabel);
+              useResponseCache.setResponse(response.id, __spreadProps(__spreadValues({}, response), {
+                __feedback__: mergedLabels.approvedMessage
+              }));
+            },
+            className: buttonClassName
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FeedbackButton,
+          {
+            label: mergedLabels.rejectLabel,
+            onClick: () => {
+              setIsExpanded(false);
+              useResponseCache.setResponse(response.id, __spreadProps(__spreadValues({}, response), {
+                __feedback__: mergedLabels.rejectedMessage
+              }));
+              onRespond == null ? void 0 : onRespond(mergedLabels.rejectLabel);
+            },
+            className: buttonClassName
+          }
+        )
+      ] });
+    }
+    return null;
+  };
+  const ExpandIcon = (icons == null ? void 0 : icons.expand) || DefaultExpandIcon;
+  const CollapseIcon = (icons == null ? void 0 : icons.collapse) || DefaultCollapseIcon;
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    isExpanded && /* @__PURE__ */ jsx(ContentRenderer, { content: response.content, className: contentClassName }),
+    /* @__PURE__ */ jsxs("div", { className: actionsClassName, children: [
+      /* @__PURE__ */ jsxs("div", { className: "copilotkit-response-label", children: [
+        /* @__PURE__ */ jsx("button", { onClick: () => setIsExpanded(!isExpanded), className: "copilotkit-toggle-button", children: isExpanded ? /* @__PURE__ */ jsx(CollapseIcon, { className: "copilotkit-icon" }) : /* @__PURE__ */ jsx(ExpandIcon, { className: "copilotkit-icon" }) }),
+        /* @__PURE__ */ jsx("span", { children: mergedLabels.responseLabel })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "copilotkit-response-buttons", children: renderFeedback() })
+    ] })
+  ] });
+};
+
+export {
+  createResponseCache,
+  DefaultResponseRenderer
+};
+//# sourceMappingURL=chunk-EJG6RRSX.mjs.map

package/dist/chunk-EJG6RRSX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/crew/DefaultResponseRenderer.tsx"],"sourcesContent":["/**\n * <br/>\n * A response renderer component for the CopilotKit framework. This component displays\n * a response that may require user feedback, such as approving or rejecting a suggestion.\n * It provides a flexible, customizable interface for rendering responses with user interaction.\n *\n * ## Install Dependencies\n *\n * This component is part of the [@copilotkit/react-ui](https://npmjs.com/package/@copilotkit/react-ui) package.\n *\n * ```shell npm2yarn \\\"@copilotkit/react-ui\"\\\n * npm install @copilotkit/react-core @copilotkit/react-ui\n * ```\n *\n * ## Usage\n *\n * ```tsx\n * import { DefaultResponseRenderer } from \"@copilotkit/react-ui\";\n * import \"@copilotkit/react-ui/styles.css\";\n *\n * // Basic usage\n * <DefaultResponseRenderer\n *   response={{\n *     id: \"response-1\",\n *     content: \"I've analyzed your data and found these insights...\"\n *   }}\n *   status=\"inProgress\"\n *   onRespond={(input) => console.log(`User responded: ${input}`)}\n * />\n * ```\n *\n * ## Customization\n *\n * You can customize the appearance and behavior of the component:\n *\n * ```tsx\n * // Custom labels and styling\n * <DefaultResponseRenderer\n *   response={{\n *     id: \"task-123\",\n *     content: \"Would you like to proceed with this recommendation?\"\n *   }}\n *   status=\"inProgress\"\n *   onRespond={handleResponse}\n *   labels={{\n *     responseLabel: \"AI Recommendation\",\n *     approveLabel: \"Yes, proceed\",\n *     rejectLabel: \"No, cancel\",\n *     approvedMessage: \"Proceeding with recommendation\",\n *     rejectedMessage: \"Recommendation cancelled\"\n *   }}\n *   className=\"my-custom-response\"\n *   contentClassName=\"my-custom-content\"\n *   buttonClassName=\"my-custom-button\"\n * />\n *\n * // Custom components\n * <DefaultResponseRenderer\n *   response={{\n *     id: \"task-456\",\n *     content: \"# Important Decision\\nThis requires your approval\"\n *   }}\n *   status=\"inProgress\"\n *   onRespond={handleResponse}\n *   ContentRenderer={({ content, className }) => (\n *     <MyMarkdownRenderer content={content} className={className} />\n *   )}\n *   FeedbackButton={({ label, onClick, className }) => (\n *     <MyCustomButton label={label} onClick={onClick} className={className} />\n *   )}\n * />\n * ```\n *\n * ### Look & Feel\n *\n * By default, CopilotKit components do not have any styles. You can import CopilotKit's stylesheet at the root of your project:\n * ```tsx title=\"YourRootComponent.tsx\"\n * ...\n * import \"@copilotkit/react-ui/styles.css\"; // [!code highlight]\n *\n * export function YourRootComponent() {\n *   return (\n *     <CopilotKit>\n *       ...\n *     </CopilotKit>\n *   );\n * }\n * ```\n * For more information about how to customize the styles, check out the [Customize Look & Feel](/guides/custom-look-and-feel/customize-built-in-ui-components) guide.\n */\n\nimport React, { useState } from \"react\";\nimport {\n  Response,\n  ResponseRendererProps,\n  ContentRendererProps,\n  FeedbackButtonProps,\n  CompletedFeedbackProps,\n  ResponseRendererIconProps,\n} from \"./types\";\n\n/**\n * Creates a cache for storing response feedback\n */\nconst createResponseCache = <T extends { id: string }>() => {\n  const responseCache = new Map<string, T>();\n\n  return {\n    getResponse: (id: string) => responseCache.get(id),\n    setResponse: (id: string, response: T) => responseCache.set(id, response),\n  };\n};\n\n/**\n * Default global response cache instance\n */\nconst useResponseCache = createResponseCache<Response & { __feedback__?: string }>();\n\n/**\n * Default expand icon component\n */\nconst DefaultExpandIcon: React.FC<ResponseRendererIconProps> = ({ className }) => (\n  <svg\n    className={className}\n    width=\"12\"\n    height=\"12\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n  >\n    <polyline points=\"6 9 12 15 18 9\"></polyline>\n  </svg>\n);\n\n/**\n * Default collapse icon component\n */\nconst DefaultCollapseIcon: React.FC<ResponseRendererIconProps> = ({ className }) => (\n  <svg\n    className={className}\n    width=\"12\"\n    height=\"12\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n  >\n    <polyline points=\"18 15 12 9 6 15\"></polyline>\n  </svg>\n);\n\n/**\n * Default content renderer that simply displays text\n */\nconst DefaultContentRenderer: React.FC<ContentRendererProps> = ({ content, className }) => (\n  <div className={className}>{content}</div>\n);\n\n/**\n * Default feedback button component\n */\nconst DefaultFeedbackButton: React.FC<FeedbackButtonProps> = ({ label, onClick, className }) => (\n  <button onClick={onClick} className={className}>\n    {label}\n  </button>\n);\n\n/**\n * Default completed feedback component\n */\nconst DefaultCompletedFeedback: React.FC<CompletedFeedbackProps> = ({ message, className }) => (\n  <div className={className}>\n    <span>{message}</span>\n  </div>\n);\n\n/**\n * Default response renderer component that handles rendering responses\n * and collecting user feedback\n */\nexport const DefaultResponseRenderer: React.FC<ResponseRendererProps> = ({\n  response,\n  status,\n  onRespond,\n  icons,\n  labels,\n  ContentRenderer = DefaultContentRenderer,\n  FeedbackButton = DefaultFeedbackButton,\n  CompletedFeedback = DefaultCompletedFeedback,\n  className = \"copilotkit-response\",\n  contentClassName = \"copilotkit-response-content\",\n  actionsClassName = \"copilotkit-response-actions\",\n  buttonClassName = \"copilotkit-response-button\",\n  completedFeedbackClassName = \"copilotkit-response-completed-feedback\",\n}) => {\n  const [isExpanded, setIsExpanded] = useState(true);\n\n  // Default label values\n  const defaultLabels = {\n    responseLabel: \"Response\",\n    approveLabel: \"Approve\",\n    rejectLabel: \"Reject\",\n    approvedMessage: \"Approved\",\n    rejectedMessage: \"Rejected\",\n    feedbackSubmittedMessage: \"Feedback submitted\",\n  };\n\n  // Merge provided labels with defaults\n  const mergedLabels = { ...defaultLabels, ...labels };\n\n  // Function to render feedback UI based on status\n  const renderFeedback = () => {\n    if (status === \"complete\") {\n      const cachedResponse = useResponseCache.getResponse(response.id);\n      return (\n        <CompletedFeedback\n          message={\n            cachedResponse?.__feedback__\n              ? cachedResponse.__feedback__ === mergedLabels.approvedMessage\n                ? mergedLabels.approvedMessage\n                : mergedLabels.rejectedMessage\n              : mergedLabels.feedbackSubmittedMessage\n          }\n          className={completedFeedbackClassName}\n        />\n      );\n    }\n\n    if (status === \"inProgress\" || status === \"executing\") {\n      return (\n        <>\n          <FeedbackButton\n            label={mergedLabels.approveLabel}\n            onClick={() => {\n              setIsExpanded(false);\n              onRespond?.(mergedLabels.approveLabel);\n              useResponseCache.setResponse(response.id, {\n                ...response,\n                __feedback__: mergedLabels.approvedMessage,\n              });\n            }}\n            className={buttonClassName}\n          />\n          <FeedbackButton\n            label={mergedLabels.rejectLabel}\n            onClick={() => {\n              setIsExpanded(false);\n              useResponseCache.setResponse(response.id, {\n                ...response,\n                __feedback__: mergedLabels.rejectedMessage,\n              });\n              onRespond?.(mergedLabels.rejectLabel);\n            }}\n            className={buttonClassName}\n          />\n        </>\n      );\n    }\n\n    return null;\n  };\n\n  // Decide which icon to display\n  const ExpandIcon = icons?.expand || DefaultExpandIcon;\n  const CollapseIcon = icons?.collapse || DefaultCollapseIcon;\n\n  return (\n    <div className={className}>\n      {/* Response content - conditionally expanded */}\n      {isExpanded && <ContentRenderer content={response.content} className={contentClassName} />}\n\n      <div className={actionsClassName}>\n        <div className=\"copilotkit-response-label\">\n          <button onClick={() => setIsExpanded(!isExpanded)} className=\"copilotkit-toggle-button\">\n            {isExpanded ? (\n              <CollapseIcon className=\"copilotkit-icon\" />\n            ) : (\n              <ExpandIcon className=\"copilotkit-icon\" />\n            )}\n          </button>\n          <span>{mergedLabels.responseLabel}</span>\n        </div>\n\n        <div className=\"copilotkit-response-buttons\">{renderFeedback()}</div>\n      </div>\n    </div>\n  );\n};\n\n/**\n * Export the response cache for reuse\n */\nexport { createResponseCache };\n"],"mappings":"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","names":[]}