@copilotkit/react-ui 0.15.0-alpha.0 → 0.15.0-alpha.2

package/dist/chunk-NNVWLSYK.mjs

@@ -0,0 +1,72 @@
+import { Messages } from './chunk-3M4HWSE7.mjs';
+import { ResponseButton } from './chunk-Z34F3WLK.mjs';
+import { Window } from './chunk-47SYBLI2.mjs';
+import { Button } from './chunk-5O2MCJZ2.mjs';
+import { Header } from './chunk-UWPFPWAW.mjs';
+import { Input } from './chunk-NYLOXKYT.mjs';
+import { ChatContextProvider } from './chunk-OF66AL5Z.mjs';
+import { __async } from './chunk-MRXNTQOX.mjs';
+import React from 'react';
+import { useCopilotChat } from '@copilotkit/react-core';
+import { nanoid } from 'nanoid';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var CopilotChat = ({
+  instructions,
+  defaultOpen = false,
+  clickOutsideToClose = true,
+  hitEscapeToClose = true,
+  onSetOpen,
+  hotkey = "e",
+  icons,
+  labels,
+  makeSystemMessage,
+  showResponseButton = true,
+  Window: Window2 = Window,
+  Button: Button2 = Button,
+  Header: Header2 = Header,
+  Messages: Messages2 = Messages,
+  Input: Input2 = Input,
+  ResponseButton: ResponseButton2 = ResponseButton,
+  className
+}) => {
+  const { visibleMessages, append, reload, stop, isLoading, input, setInput } = useCopilotChat({
+    id: nanoid(),
+    makeSystemMessage,
+    additionalInstructions: instructions
+  });
+  const [openState, setOpenState] = React.useState(defaultOpen);
+  const setOpen = (open) => {
+    onSetOpen == null ? void 0 : onSetOpen(open);
+    setOpenState(open);
+  };
+  const sendMessage = (message) => __async(void 0, null, function* () {
+    append({
+      id: nanoid(),
+      content: message,
+      role: "user"
+    });
+  });
+  return /* @__PURE__ */ jsx(ChatContextProvider, { icons, labels, children: /* @__PURE__ */ jsxs("div", { className, children: [
+    /* @__PURE__ */ jsx(Button2, { open: openState, setOpen }),
+    /* @__PURE__ */ jsxs(
+      Window2,
+      {
+        open: openState,
+        setOpen,
+        clickOutsideToClose,
+        hotkey,
+        hitEscapeToClose,
+        children: [
+          /* @__PURE__ */ jsx(Header2, { open: openState, setOpen }),
+          /* @__PURE__ */ jsx(Messages2, { messages: visibleMessages, inProgress: isLoading }),
+          /* @__PURE__ */ jsx(Input2, { inProgress: isLoading, onSend: sendMessage, children: showResponseButton && visibleMessages.length > 0 && /* @__PURE__ */ jsx(ResponseButton2, { onClick: isLoading ? stop : reload, inProgress: isLoading }) })
+        ]
+      }
+    )
+  ] }) });
+};
+
+export { CopilotChat };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-NNVWLSYK.mjs.map

package/dist/chunk-NNVWLSYK.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Chat.tsx"],"names":["Window","Button","Header","Messages","Input","ResponseButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,WAAW;AAElB,SAAgC,sBAAsB;AActD,SAAS,cAAc;AAsJf,cACA,YADA;AA3CD,IAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA,cAAc;AAAA,EACd,sBAAsB;AAAA,EACtB,mBAAmB;AAAA,EACnB;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA,qBAAqB;AAAA,EACrB,QAAAA,UAAS;AAAA,EACT,QAAAC,UAAS;AAAA,EACT,QAAAC,UAAS;AAAA,EACT,UAAAC,YAAW;AAAA,EACX,OAAAC,SAAQ;AAAA,EACR,gBAAAC,kBAAiB;AAAA,EACjB;AACF,MAAwB;AACtB,QAAM,EAAE,iBAAiB,QAAQ,QAAQ,MAAM,WAAW,OAAO,SAAS,IAAI,eAAe;AAAA,IAC3F,IAAI,OAAO;AAAA,IACX;AAAA,IACA,wBAAwB;AAAA,EAC1B,CAAC;AAED,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,WAAW;AAE5D,QAAM,UAAU,CAAC,SAAkB;AACjC,2CAAY;AACZ,iBAAa,IAAI;AAAA,EACnB;AAEA,QAAM,cAAc,CAAO,YAAoB;AAC7C,WAAO;AAAA,MACL,IAAI,OAAO;AAAA,MACX,SAAS;AAAA,MACT,MAAM;AAAA,IACR,CAAC;AAAA,EACH;AAEA,SACE,oBAAC,uBAAoB,OAAc,QACjC,+BAAC,SAAI,WACH;AAAA,wBAACJ,SAAA,EAAO,MAAM,WAAW,SAAkB;AAAA,IAC3C;AAAA,MAACD;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,8BAACE,SAAA,EAAO,MAAM,WAAW,SAAkB;AAAA,UAC3C,oBAACC,WAAA,EAAS,UAAU,iBAAiB,YAAY,WAAW;AAAA,UAC5D,oBAACC,QAAA,EAAM,YAAY,WAAW,QAAQ,aACnC,gCAAsB,gBAAgB,SAAS,KAC9C,oBAACC,iBAAA,EAAe,SAAS,YAAY,OAAO,QAAQ,YAAY,WAAW,GAE/E;AAAA;AAAA;AAAA,IACF;AAAA,KACF,GACF;AAEJ","sourcesContent":["import React from \"react\";\nimport { CopilotChatIcons, ChatContextProvider, CopilotChatLabels } from \"./ChatContext\";\nimport { SystemMessageFunction, useCopilotChat } from \"@copilotkit/react-core\";\nimport {\n  ButtonProps,\n  HeaderProps,\n  WindowProps,\n  MessagesProps,\n  InputProps,\n  ResponseButtonProps,\n} from \"./props\";\nimport { Window as DefaultWindow } from \"./Window\";\nimport { Button as DefaultButton } from \"./Button\";\nimport { Header as DefaultHeader } from \"./Header\";\nimport { Messages as DefaultMessages } from \"./Messages\";\nimport { Input as DefaultInput } from \"./Input\";\nimport { nanoid } from \"nanoid\";\nimport { ResponseButton as DefaultResponseButton } from \"./Response\";\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   * Whether the chat window should be open by default.\n   * @default false\n   */\n  defaultOpen?: boolean;\n\n  /**\n   * If the chat window should close when the user clicks outside of it.\n   * @default true\n   */\n  clickOutsideToClose?: boolean;\n\n  /**\n   * If the chat window should close when the user hits the Escape key.\n   * @default true\n   */\n  hitEscapeToClose?: boolean;\n\n  /**\n   * A callback that gets called when the chat window opens or closes.\n   */\n  onSetOpen?: (open: boolean) => void;\n\n  /**\n   * The hotkey to open the chat window.\n   * Uses Command-<hotkey> on a Mac and Ctrl-<hotkey> on Windows.\n   * @default \"e\"\n   */\n  hotkey?: string;\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 Window component to use instead of the default.\n   */\n  Window?: React.ComponentType<WindowProps>;\n\n  /**\n   * A custom Button component to use instead of the default.\n   */\n  Button?: React.ComponentType<ButtonProps>;\n\n  /**\n   * A custom Header component to use instead of the default.\n   */\n  Header?: React.ComponentType<HeaderProps>;\n\n  /**\n   * A custom Messages component to use instead of the default.\n   */\n  Messages?: React.ComponentType<MessagesProps>;\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\nexport const CopilotChat = ({\n  instructions,\n  defaultOpen = false,\n  clickOutsideToClose = true,\n  hitEscapeToClose = true,\n  onSetOpen,\n  hotkey = \"e\",\n  icons,\n  labels,\n  makeSystemMessage,\n  showResponseButton = true,\n  Window = DefaultWindow,\n  Button = DefaultButton,\n  Header = DefaultHeader,\n  Messages = DefaultMessages,\n  Input = DefaultInput,\n  ResponseButton = DefaultResponseButton,\n  className,\n}: CopilotChatProps) => {\n  const { visibleMessages, append, reload, stop, isLoading, input, setInput } = useCopilotChat({\n    id: nanoid(),\n    makeSystemMessage,\n    additionalInstructions: instructions,\n  });\n\n  const [openState, setOpenState] = React.useState(defaultOpen);\n\n  const setOpen = (open: boolean) => {\n    onSetOpen?.(open);\n    setOpenState(open);\n  };\n\n  const sendMessage = async (message: string) => {\n    append({\n      id: nanoid(),\n      content: message,\n      role: \"user\",\n    });\n  };\n\n  return (\n    <ChatContextProvider icons={icons} labels={labels}>\n      <div className={className}>\n        <Button open={openState} setOpen={setOpen}></Button>\n        <Window\n          open={openState}\n          setOpen={setOpen}\n          clickOutsideToClose={clickOutsideToClose}\n          hotkey={hotkey}\n          hitEscapeToClose={hitEscapeToClose}\n        >\n          <Header open={openState} setOpen={setOpen} />\n          <Messages messages={visibleMessages} inProgress={isLoading} />\n          <Input inProgress={isLoading} onSend={sendMessage}>\n            {showResponseButton && visibleMessages.length > 0 && (\n              <ResponseButton onClick={isLoading ? stop : reload} inProgress={isLoading} />\n            )}\n          </Input>\n        </Window>\n      </div>\n    </ChatContextProvider>\n  );\n};\n"]}

package/dist/chunk-NYLOXKYT.mjs

@@ -0,0 +1,51 @@
+import { Textarea_default } from './chunk-WM6BS77F.mjs';
+import { useChatContext } from './chunk-OF66AL5Z.mjs';
+import { useRef, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Input = ({ inProgress, onSend, children }) => {
+  const context = useChatContext();
+  const textareaRef = useRef(null);
+  const handleDivClick = (event) => {
+    var _a;
+    if (event.target !== event.currentTarget)
+      return;
+    (_a = textareaRef.current) == null ? void 0 : _a.focus();
+  };
+  const [text, setText] = useState("");
+  const send = () => {
+    var _a;
+    if (inProgress)
+      return;
+    onSend(text);
+    setText("");
+    (_a = textareaRef.current) == null ? void 0 : _a.focus();
+  };
+  const icon = inProgress ? context.icons.activityIcon : context.icons.sendIcon;
+  const disabled = inProgress || text.length === 0;
+  return /* @__PURE__ */ jsxs("div", { className: "copilotKitInput", onClick: handleDivClick, children: [
+    /* @__PURE__ */ jsx("span", { children }),
+    /* @__PURE__ */ jsx("button", { className: "copilotKitSendButton", disabled, onClick: send, children: icon }),
+    /* @__PURE__ */ jsx(
+      Textarea_default,
+      {
+        ref: textareaRef,
+        placeholder: context.labels.placeholder,
+        autoFocus: true,
+        maxRows: 5,
+        value: text,
+        onChange: (event) => setText(event.target.value),
+        onKeyDown: (event) => {
+          if (event.key === "Enter" && !event.shiftKey) {
+            event.preventDefault();
+            send();
+          }
+        }
+      }
+    )
+  ] });
+};
+
+export { Input };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-NYLOXKYT.mjs.map

package/dist/chunk-NYLOXKYT.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Input.tsx"],"names":[],"mappings":";;;;;;;;AAAA,SAAgB,QAAQ,gBAAgB;AA6BpC,SACE,KADF;AAxBG,IAAM,QAAQ,CAAC,EAAE,YAAY,QAAQ,SAAS,MAAkB;AACrE,QAAM,UAAU,eAAe;AAC/B,QAAM,cAAc,OAA4B,IAAI;AAEpD,QAAM,iBAAiB,CAAC,UAA4C;AATtE;AAWI,QAAI,MAAM,WAAW,MAAM;AAAe;AAE1C,sBAAY,YAAZ,mBAAqB;AAAA,EACvB;AAEA,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,EAAE;AACnC,QAAM,OAAO,MAAM;AAjBrB;AAkBI,QAAI;AAAY;AAChB,WAAO,IAAI;AACX,YAAQ,EAAE;AAEV,sBAAY,YAAZ,mBAAqB;AAAA,EACvB;AAEA,QAAM,OAAO,aAAa,QAAQ,MAAM,eAAe,QAAQ,MAAM;AACrE,QAAM,WAAW,cAAc,KAAK,WAAW;AAE/C,SACE,qBAAC,SAAI,WAAU,mBAAkB,SAAS,gBACxC;AAAA,wBAAC,UAAM,UAAS;AAAA,IAChB,oBAAC,YAAO,WAAU,wBAAuB,UAAoB,SAAS,MACnE,gBACH;AAAA,IACA;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,iBAAK;AAAA,UACP;AAAA,QACF;AAAA;AAAA,IACF;AAAA,KACF;AAEJ","sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { InputProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport AutoResizingTextarea from \"./Textarea\";\n\nexport const Input = ({ inProgress, onSend, children }: InputProps) => {\n  const context = useChatContext();\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  const icon = inProgress ? context.icons.activityIcon : context.icons.sendIcon;\n  const disabled = inProgress || text.length === 0;\n\n  return (\n    <div className=\"copilotKitInput\" onClick={handleDivClick}>\n      <span>{children}</span>\n      <button className=\"copilotKitSendButton\" disabled={disabled} onClick={send}>\n        {icon}\n      </button>\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            send();\n          }\n        }}\n      />\n    </div>\n  );\n};\n"]}

package/dist/chunk-OF66AL5Z.mjs

@@ -0,0 +1,56 @@
+import { OpenIcon, CloseIcon, HeaderCloseIcon, SendIcon, ActivityIcon, SpinnerIcon, StopIcon, RegenerateIcon } from './chunk-7YXG7D47.mjs';
+import { __spreadValues, __spreadProps } from './chunk-MRXNTQOX.mjs';
+import React, { useMemo } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var ChatContext = React.createContext(void 0);
+function useChatContext() {
+  const context = React.useContext(ChatContext);
+  if (context === void 0) {
+    throw new Error(
+      "Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?"
+    );
+  }
+  return context;
+}
+var ChatContextProvider = ({
+  // temperature,
+  // instructions,
+  // maxFeedback,
+  labels,
+  icons,
+  children
+}) => {
+  const context = useMemo(
+    () => ({
+      labels: __spreadValues(__spreadValues({}, {
+        initial: "",
+        title: "CopilotKit",
+        placeholder: "Type a message...",
+        thinking: "Thinking...",
+        done: "\u2705 Done",
+        error: "\u274C An error occurred. Please try again.",
+        stopGenerating: "Stop generating",
+        regenerateResponse: "Regenerate response"
+      }), labels),
+      icons: __spreadProps(__spreadValues({}, {
+        openIcon: OpenIcon,
+        closeIcon: CloseIcon,
+        headerCloseIcon: HeaderCloseIcon,
+        sendIcon: SendIcon,
+        activityIcon: ActivityIcon,
+        spinnerIcon: SpinnerIcon,
+        stopIcon: StopIcon,
+        regenerateIcon: RegenerateIcon
+      }), {
+        icons
+      })
+    }),
+    [labels, icons]
+  );
+  return /* @__PURE__ */ jsx(ChatContext.Provider, { value: context, children });
+};
+
+export { ChatContext, ChatContextProvider, useChatContext };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-OF66AL5Z.mjs.map

package/dist/chunk-OF66AL5Z.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/ChatContext.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAO,SAAS,eAAe;AA8KtB;AA7DF,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;AAWO,IAAM,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAAA,EAIlC;AAAA,EACA;AAAA,EACA;AACF,MAAwB;AACtB,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,MACL,QAAQ,kCACH;AAAA,QACD,SAAS;AAAA,QACT,OAAO;AAAA,QACP,aAAa;AAAA,QACb,UAAU;AAAA,QACV,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,oBAAoB;AAAA,MACtB,IACG;AAAA,MAGL,OAAO,iCACF;AAAA,QACD,UAAuB;AAAA,QACvB,WAAwB;AAAA,QACxB,iBAA8B;AAAA,QAC9B,UAAuB;AAAA,QACvB,cAA2B;AAAA,QAC3B,aAA0B;AAAA,QAC1B,UAAuB;AAAA,QACvB,gBAA6B;AAAA,MAC/B,IAVK;AAAA,QAWL;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,KAAK;AAAA,EAChB;AACA,SAAO,oBAAC,YAAY,UAAZ,EAAqB,OAAO,SAAU,UAAS;AACzD","sourcesContent":["import React, { useMemo } 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/**\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 while the chat GPT is \"thinking\".\n   * @default \"Thinking...\"\n   */\n  thinking?: string;\n\n  /**\n   * The message to display when the chat is done executing a function.\n   * @default \"✅ Done\"\n   */\n  done?: 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\ninterface ChatContext {\n  labels: Required<CopilotChatLabels>;\n  icons: Required<CopilotChatIcons>;\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}\n\nexport const ChatContextProvider = ({\n  // temperature,\n  // instructions,\n  // maxFeedback,\n  labels,\n  icons,\n  children,\n}: ChatContextProps) => {\n  const context = useMemo(\n    () => ({\n      labels: {\n        ...{\n          initial: \"\",\n          title: \"CopilotKit\",\n          placeholder: \"Type a message...\",\n          thinking: \"Thinking...\",\n          done: \"✅ Done\",\n          error: \"❌ An error occurred. Please try again.\",\n          stopGenerating: \"Stop generating\",\n          regenerateResponse: \"Regenerate response\",\n        },\n        ...labels,\n      },\n\n      icons: {\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        },\n        icons,\n      },\n    }),\n    [labels, icons],\n  );\n  return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n"]}

package/dist/chunk-P4GBO6MW.mjs

@@ -0,0 +1,3 @@
+
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-P4GBO6MW.mjs.map

package/dist/chunk-UWPFPWAW.mjs

@@ -0,0 +1,14 @@
+import { useChatContext } from './chunk-OF66AL5Z.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Header = ({ setOpen }) => {
+  const context = useChatContext();
+  return /* @__PURE__ */ jsxs("div", { className: "copilotKitHeader", children: [
+    /* @__PURE__ */ jsx("div", { children: context.labels.title }),
+    /* @__PURE__ */ jsx("button", { onClick: () => setOpen(false), "aria-label": "Close", children: context.icons.headerCloseIcon })
+  ] });
+};
+
+export { Header };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-UWPFPWAW.mjs.map

package/dist/chunk-UWPFPWAW.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Header.tsx"],"names":[],"mappings":";;;;;AAOI,SACE,KADF;AAJG,IAAM,SAAS,CAAC,EAAE,QAAQ,MAAmB;AAClD,QAAM,UAAU,eAAe;AAE/B,SACE,qBAAC,SAAI,WAAU,oBACb;AAAA,wBAAC,SAAK,kBAAQ,OAAO,OAAM;AAAA,IAC3B,oBAAC,YAAO,SAAS,MAAM,QAAQ,KAAK,GAAG,cAAW,SAC/C,kBAAQ,MAAM,iBACjB;AAAA,KACF;AAEJ","sourcesContent":["import { HeaderProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\n\nexport const Header = ({ setOpen }: HeaderProps) => {\n  const context = useChatContext();\n\n  return (\n    <div className=\"copilotKitHeader\">\n      <div>{context.labels.title}</div>\n      <button onClick={() => setOpen(false)} aria-label=\"Close\">\n        {context.icons.headerCloseIcon}\n      </button>\n    </div>\n  );\n};\n"]}

package/dist/chunk-WB3YULQ4.mjs

@@ -0,0 +1,3 @@
+
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-WB3YULQ4.mjs.map

package/dist/chunk-WM6BS77F.mjs

@@ -0,0 +1,53 @@
+import { forwardRef, useRef, useState, useImperativeHandle, useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/components/chat/Textarea.tsx
+var AutoResizingTextarea = forwardRef(
+  ({ maxRows = 1, placeholder, value, onChange, onKeyDown, autoFocus }, ref) => {
+    const internalTextareaRef = useRef(null);
+    const [maxHeight, setMaxHeight] = useState(0);
+    useImperativeHandle(ref, () => internalTextareaRef.current);
+    useEffect(() => {
+      const calculateMaxHeight = () => {
+        const textarea = internalTextareaRef.current;
+        if (textarea) {
+          textarea.style.height = "auto";
+          const singleRowHeight = textarea.scrollHeight;
+          setMaxHeight(singleRowHeight * maxRows);
+          if (autoFocus) {
+            textarea.focus();
+          }
+        }
+      };
+      calculateMaxHeight();
+    }, [maxRows]);
+    useEffect(() => {
+      const textarea = internalTextareaRef.current;
+      if (textarea) {
+        textarea.style.height = "auto";
+        textarea.style.height = `${Math.min(textarea.scrollHeight, maxHeight)}px`;
+      }
+    }, [value, maxHeight]);
+    return /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref: internalTextareaRef,
+        value,
+        onChange,
+        onKeyDown,
+        placeholder,
+        style: {
+          overflow: "hidden",
+          resize: "none",
+          maxHeight: `${maxHeight}px`
+        },
+        rows: 1
+      }
+    );
+  }
+);
+var Textarea_default = AutoResizingTextarea;
+
+export { Textarea_default };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-WM6BS77F.mjs.map

package/dist/chunk-WM6BS77F.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Textarea.tsx"],"names":[],"mappings":";AAAA,SAAgB,UAAU,QAAQ,WAAW,YAAY,2BAA2B;AA2C9E;AAhCN,IAAM,uBAAuB;AAAA,EAC3B,CAAC,EAAE,UAAU,GAAG,aAAa,OAAO,UAAU,WAAW,UAAU,GAAG,QAAQ;AAC5E,UAAM,sBAAsB,OAA4B,IAAI;AAC5D,UAAM,CAAC,WAAW,YAAY,IAAI,SAAiB,CAAC;AAEpD,wBAAoB,KAAK,MAAM,oBAAoB,OAA8B;AAEjF,cAAU,MAAM;AACd,YAAM,qBAAqB,MAAM;AAC/B,cAAM,WAAW,oBAAoB;AACrC,YAAI,UAAU;AACZ,mBAAS,MAAM,SAAS;AACxB,gBAAM,kBAAkB,SAAS;AACjC,uBAAa,kBAAkB,OAAO;AACtC,cAAI,WAAW;AACb,qBAAS,MAAM;AAAA,UACjB;AAAA,QACF;AAAA,MACF;AAEA,yBAAmB;AAAA,IACrB,GAAG,CAAC,OAAO,CAAC;AAEZ,cAAU,MAAM;AACd,YAAM,WAAW,oBAAoB;AACrC,UAAI,UAAU;AACZ,iBAAS,MAAM,SAAS;AACxB,iBAAS,MAAM,SAAS,GAAG,KAAK,IAAI,SAAS,cAAc,SAAS;AAAA,MACtE;AAAA,IACF,GAAG,CAAC,OAAO,SAAS,CAAC;AAErB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,QAAQ;AAAA,UACR,WAAW,GAAG;AAAA,QAChB;AAAA,QACA,MAAM;AAAA;AAAA,IACR;AAAA,EAEJ;AACF;AAEA,IAAO,mBAAQ","sourcesContent":["import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle } from \"react\";\n\ninterface AutoResizingTextareaProps {\n  maxRows?: number;\n  placeholder?: string;\n  value: string;\n  onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n  onKeyDown?: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n  autoFocus?: boolean;\n}\n\nconst AutoResizingTextarea = forwardRef<HTMLTextAreaElement, AutoResizingTextareaProps>(\n  ({ maxRows = 1, placeholder, value, onChange, onKeyDown, autoFocus }, ref) => {\n    const internalTextareaRef = useRef<HTMLTextAreaElement>(null);\n    const [maxHeight, setMaxHeight] = useState<number>(0);\n\n    useImperativeHandle(ref, () => internalTextareaRef.current as HTMLTextAreaElement);\n\n    useEffect(() => {\n      const calculateMaxHeight = () => {\n        const textarea = internalTextareaRef.current;\n        if (textarea) {\n          textarea.style.height = \"auto\";\n          const singleRowHeight = textarea.scrollHeight;\n          setMaxHeight(singleRowHeight * maxRows);\n          if (autoFocus) {\n            textarea.focus();\n          }\n        }\n      };\n\n      calculateMaxHeight();\n    }, [maxRows]);\n\n    useEffect(() => {\n      const textarea = internalTextareaRef.current;\n      if (textarea) {\n        textarea.style.height = \"auto\";\n        textarea.style.height = `${Math.min(textarea.scrollHeight, maxHeight)}px`;\n      }\n    }, [value, maxHeight]);\n\n    return (\n      <textarea\n        ref={internalTextareaRef}\n        value={value}\n        onChange={onChange}\n        onKeyDown={onKeyDown}\n        placeholder={placeholder}\n        style={{\n          overflow: \"hidden\",\n          resize: \"none\",\n          maxHeight: `${maxHeight}px`,\n        }}\n        rows={1}\n      />\n    );\n  },\n);\n\nexport default AutoResizingTextarea;\n"]}

package/dist/chunk-Z34F3WLK.mjs

@@ -0,0 +1,14 @@
+import { useChatContext } from './chunk-OF66AL5Z.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ResponseButton = ({ onClick, inProgress }) => {
+  const context = useChatContext();
+  return /* @__PURE__ */ jsxs("button", { onClick, className: "copilotKitResponseButton", children: [
+    /* @__PURE__ */ jsx("span", { children: inProgress ? context.icons.stopIcon : context.icons.regenerateIcon }),
+    inProgress ? context.labels.stopGenerating : context.labels.regenerateResponse
+  ] });
+};
+
+export { ResponseButton };
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=chunk-Z34F3WLK.mjs.map

package/dist/chunk-Z34F3WLK.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Response.tsx"],"names":[],"mappings":";;;;;AAMI,SACE,KADF;AAHG,IAAM,iBAAiB,CAAC,EAAE,SAAS,WAAW,MAA2B;AAC9E,QAAM,UAAU,eAAe;AAC/B,SACE,qBAAC,YAAO,SAAkB,WAAU,4BAClC;AAAA,wBAAC,UAAM,uBAAa,QAAQ,MAAM,WAAW,QAAQ,MAAM,gBAAe;AAAA,IACzE,aAAa,QAAQ,OAAO,iBAAiB,QAAQ,OAAO;AAAA,KAC/D;AAEJ","sourcesContent":["import { useChatContext } from \"./ChatContext\";\nimport { ResponseButtonProps } from \"./props\";\n\nexport const ResponseButton = ({ onClick, inProgress }: ResponseButtonProps) => {\n  const context = useChatContext();\n  return (\n    <button onClick={onClick} className=\"copilotKitResponseButton\">\n      <span>{inProgress ? context.icons.stopIcon : context.icons.regenerateIcon}</span>\n      {inProgress ? context.labels.stopGenerating : context.labels.regenerateResponse}\n    </button>\n  );\n};\n"]}

package/dist/components/chat/Button.d.ts

@@ -0,0 +1,6 @@
+import { ButtonProps } from './props.js';
+import '@copilotkit/shared';
+
+declare const Button: ({ open, setOpen }: ButtonProps) => JSX.Element;
+
+export { Button };

package/dist/components/chat/Button.js

@@ -0,0 +1,38 @@
+'use strict';
+
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+// src/components/chat/ChatContext.tsx
+var ChatContext = React__default.default.createContext(void 0);
+function useChatContext() {
+  const context = React__default.default.useContext(ChatContext);
+  if (context === void 0) {
+    throw new Error(
+      "Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?"
+    );
+  }
+  return context;
+}
+var Button = ({ open, setOpen }) => {
+  const context = useChatContext();
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { onClick: () => setOpen(!open), children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      className: `copilotKitButton ${open ? "open" : ""}`,
+      "aria-label": open ? "Close Chat" : "Open Chat",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "copilotKitButtonIcon copilotKitButtonIconOpen", children: context.icons.openIcon }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "copilotKitButtonIcon copilotKitButtonIconClose", children: context.icons.closeIcon })
+      ]
+    }
+  ) });
+};
+
+exports.Button = Button;
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=Button.js.map

package/dist/components/chat/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/chat/ChatContext.tsx","../../../src/components/chat/Button.tsx"],"names":["jsx"],"mappings":";AAAA,OAAO,SAAS,eAAe;AA8KtB;AA7DF,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;;;AClHM,SAIE,OAAAA,MAJF;AANC,IAAM,SAAS,CAAC,EAAE,MAAM,QAAQ,MAAmB;AACxD,QAAM,UAAU,eAAe;AAG/B,SACE,gBAAAA,KAAC,SAAI,SAAS,MAAM,QAAQ,CAAC,IAAI,GAC/B;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,oBAAoB,OAAO,SAAS;AAAA,MAC/C,cAAY,OAAO,eAAe;AAAA,MAElC;AAAA,wBAAAA,KAAC,SAAI,WAAU,iDACZ,kBAAQ,MAAM,UACjB;AAAA,QACA,gBAAAA,KAAC,SAAI,WAAU,kDACZ,kBAAQ,MAAM,WACjB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ","sourcesContent":["import React, { useMemo } 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/**\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 while the chat GPT is \"thinking\".\n   * @default \"Thinking...\"\n   */\n  thinking?: string;\n\n  /**\n   * The message to display when the chat is done executing a function.\n   * @default \"✅ Done\"\n   */\n  done?: 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\ninterface ChatContext {\n  labels: Required<CopilotChatLabels>;\n  icons: Required<CopilotChatIcons>;\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}\n\nexport const ChatContextProvider = ({\n  // temperature,\n  // instructions,\n  // maxFeedback,\n  labels,\n  icons,\n  children,\n}: ChatContextProps) => {\n  const context = useMemo(\n    () => ({\n      labels: {\n        ...{\n          initial: \"\",\n          title: \"CopilotKit\",\n          placeholder: \"Type a message...\",\n          thinking: \"Thinking...\",\n          done: \"✅ Done\",\n          error: \"❌ An error occurred. Please try again.\",\n          stopGenerating: \"Stop generating\",\n          regenerateResponse: \"Regenerate response\",\n        },\n        ...labels,\n      },\n\n      icons: {\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        },\n        icons,\n      },\n    }),\n    [labels, icons],\n  );\n  return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n","import { ButtonProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\n\nexport const Button = ({ open, setOpen }: ButtonProps) => {\n  const context = useChatContext();\n  // To ensure that the mouse handler fires even when the button is scaled down\n  // we wrap the button in a div and attach the handler to the div\n  return (\n    <div onClick={() => setOpen(!open)}>\n      <button\n        className={`copilotKitButton ${open ? \"open\" : \"\"}`}\n        aria-label={open ? \"Close Chat\" : \"Open Chat\"}\n      >\n        <div className=\"copilotKitButtonIcon copilotKitButtonIconOpen\">\n          {context.icons.openIcon}\n        </div>\n        <div className=\"copilotKitButtonIcon copilotKitButtonIconClose\">\n          {context.icons.closeIcon}\n        </div>\n      </button>\n    </div>\n  );\n};\n"]}

package/dist/components/chat/Button.mjs

@@ -0,0 +1,6 @@
+export { Button } from '../../chunk-5O2MCJZ2.mjs';
+import '../../chunk-OF66AL5Z.mjs';
+import '../../chunk-7YXG7D47.mjs';
+import '../../chunk-MRXNTQOX.mjs';
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=Button.mjs.map

package/dist/components/chat/Chat.d.ts

@@ -0,0 +1,96 @@
+import React from 'react';
+import { CopilotChatIcons, CopilotChatLabels } from './ChatContext.js';
+import { SystemMessageFunction } from '@copilotkit/react-core';
+import { WindowProps, ButtonProps, HeaderProps, MessagesProps, InputProps, ResponseButtonProps } from './props.js';
+import '@copilotkit/shared';
+
+/**
+ * Props for CopilotChat component.
+ */
+interface CopilotChatProps {
+    /**
+     * Custom instructions to be added to the system message. Use this property to
+     * provide additional context or guidance to the language model, influencing
+     * its responses. These instructions can include specific directions,
+     * preferences, or criteria that the model should consider when generating
+     * its output, thereby tailoring the conversation more precisely to the
+     * user's needs or the application's requirements.
+     */
+    instructions?: string;
+    /**
+     * Whether the chat window should be open by default.
+     * @default false
+     */
+    defaultOpen?: boolean;
+    /**
+     * If the chat window should close when the user clicks outside of it.
+     * @default true
+     */
+    clickOutsideToClose?: boolean;
+    /**
+     * If the chat window should close when the user hits the Escape key.
+     * @default true
+     */
+    hitEscapeToClose?: boolean;
+    /**
+     * A callback that gets called when the chat window opens or closes.
+     */
+    onSetOpen?: (open: boolean) => void;
+    /**
+     * The hotkey to open the chat window.
+     * Uses Command-<hotkey> on a Mac and Ctrl-<hotkey> on Windows.
+     * @default "e"
+     */
+    hotkey?: string;
+    /**
+     * Icons can be used to set custom icons for the chat window.
+     */
+    icons?: CopilotChatIcons;
+    /**
+     * Labels can be used to set custom labels for the chat window.
+     */
+    labels?: CopilotChatLabels;
+    /**
+     * A function that takes in context string and instructions and returns
+     * the system message to include in the chat request.
+     * Use this to completely override the system message, when providing
+     * instructions is not enough.
+     */
+    makeSystemMessage?: SystemMessageFunction;
+    /**
+     * Whether to show the response button.
+     * @default true
+     */
+    showResponseButton?: boolean;
+    /**
+     * A custom Window component to use instead of the default.
+     */
+    Window?: React.ComponentType<WindowProps>;
+    /**
+     * A custom Button component to use instead of the default.
+     */
+    Button?: React.ComponentType<ButtonProps>;
+    /**
+     * A custom Header component to use instead of the default.
+     */
+    Header?: React.ComponentType<HeaderProps>;
+    /**
+     * A custom Messages component to use instead of the default.
+     */
+    Messages?: React.ComponentType<MessagesProps>;
+    /**
+     * A custom Input component to use instead of the default.
+     */
+    Input?: React.ComponentType<InputProps>;
+    /**
+     * A custom ResponseButton component to use instead of the default.
+     */
+    ResponseButton?: React.ComponentType<ResponseButtonProps>;
+    /**
+     * A class name to apply to the root element.
+     */
+    className?: string;
+}
+declare const CopilotChat: ({ instructions, defaultOpen, clickOutsideToClose, hitEscapeToClose, onSetOpen, hotkey, icons, labels, makeSystemMessage, showResponseButton, Window, Button, Header, Messages, Input, ResponseButton, className, }: CopilotChatProps) => JSX.Element;
+
+export { CopilotChat, CopilotChatProps };