@copilotkit/react-ui 0.15.0-alpha.1 → 0.15.0-alpha.3

package/dist/chunk-3M4HWSE7.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Messages.tsx"],"names":[],"mappings":";;;;;;;;AAAA,OAAO,SAAS,WAAW,eAAe;AAG1C,SAAS,cAAc;AA2BnB,SAMQ,KANR;AAvBG,IAAM,WAAW,CAAC,EAAE,UAAU,WAAW,MAAqB;AACnE,QAAM,UAAU,eAAe;AAC/B,QAAM,kBAAkB;AAAA,IACtB,MAAM,oBAAoB,QAAQ,OAAO,OAAO;AAAA,IAChD,CAAC,QAAQ,OAAO,OAAO;AAAA,EACzB;AACA,aAAW,CAAC,GAAG,iBAAiB,GAAG,QAAQ;AAE3C,QAAM,iBAAiB,MAAM,OAAuB,IAAI;AAExD,QAAM,iBAAiB,MAAM;AAC3B,QAAI,eAAe,SAAS;AAC1B,qBAAe,QAAQ,eAAe;AAAA,QACpC,UAAU;AAAA,MACZ,CAAC;AAAA,IACH;AAAA,EACF;AAEA,YAAU,MAAM;AACd,mBAAe;AAAA,EACjB,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE,qBAAC,SAAI,WAAU,sBACZ;AAAA,aAAS,IAAI,CAAC,SAAS,UAAU;AAChC,YAAM,mBAAmB,UAAU,SAAS,SAAS;AAErD,UAAI,QAAQ,SAAS,QAAQ;AAC3B,eACE,oBAAC,SAAgB,WAAU,2CACxB,kBAAQ,WADD,KAEV;AAAA,MAEJ,WAAW,QAAQ,QAAQ,aAAa;AACtC,YAAI,oBAAoB,cAAc,CAAC,QAAQ,SAAS;AACtD,iBACE,oBAAC,SAAgB,WAAW,gDACzB,kBAAQ,MAAM,eADP,KAEV;AAAA,QAEJ,YACG,CAAC,cAAc,SAAS,SAAS,SAAS,MAC3C,CAAC,QAAQ,WACT,QAAQ,eACR;AACA,iBACE,oBAAC,SAAgB,WAAW,gDACzB,kBAAQ,OAAO,QADR,KAEV;AAAA,QAEJ,OAWK;AACH,iBACE,oBAAC,SAAgB,WAAW,gDAC1B,8BAAC,YAAS,SAAS,QAAQ,SAAS,KAD5B,KAEV;AAAA,QAEJ;AAAA,MACF;AAAA,IAgBF,CAAC;AAAA,IACD,oBAAC,SAAI,KAAK,gBAAgB;AAAA,KAC5B;AAEJ;AAEA,SAAS,oBAAoB,SAAwC;AACnE,MAAI,eAAyB,CAAC;AAC9B,MAAI,SAAS;AACX,QAAI,MAAM,QAAQ,OAAO,GAAG;AAC1B,mBAAa,KAAK,GAAG,OAAO;AAAA,IAC9B,OAAO;AACL,mBAAa,KAAK,OAAO;AAAA,IAC3B;AAAA,EACF;AAEA,SAAO,aAAa,IAAI,CAAC,aAAa;AAAA,IACpC,IAAI,OAAO;AAAA,IACX,MAAM;AAAA,IACN,SAAS;AAAA,EACX,EAAE;AACJ","sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport { MessagesProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport { nanoid } from \"nanoid\";\nimport { Message } from \"@copilotkit/shared\";\nimport { Markdown } from \"./Markdown\";\n\nexport const Messages = ({ messages, inProgress }: MessagesProps) => {\n  const context = useChatContext();\n  const initialMessages = useMemo(\n    () => makeInitialMessages(context.labels.initial),\n    [context.labels.initial],\n  );\n  messages = [...initialMessages, ...messages];\n\n  const messagesEndRef = React.useRef<HTMLDivElement>(null);\n\n  const scrollToBottom = () => {\n    if (messagesEndRef.current) {\n      messagesEndRef.current.scrollIntoView({\n        behavior: \"auto\",\n      });\n    }\n  };\n\n  useEffect(() => {\n    scrollToBottom();\n  }, [messages]);\n\n  return (\n    <div className=\"copilotKitMessages\">\n      {messages.map((message, index) => {\n        const isCurrentMessage = index === messages.length - 1;\n\n        if (message.role === \"user\") {\n          return (\n            <div key={index} className=\"copilotKitMessage copilotKitUserMessage\">\n              {message.content}\n            </div>\n          );\n        } else if (message.role == \"assistant\") {\n          if (isCurrentMessage && inProgress && !message.content) {\n            return (\n              <div key={index} className={`copilotKitMessage copilotKitAssistantMessage`}>\n                {context.icons.spinnerIcon}\n              </div>\n            );\n          } else if (\n            (!inProgress || index != messages.length - 1) &&\n            !message.content &&\n            message.function_call\n          ) {\n            return (\n              <div key={index} className={`copilotKitMessage copilotKitAssistantMessage`}>\n                {context.labels.done}\n              </div>\n            );\n          }\n          // TODO: Add back partial message\n          // This shows up when the assistant is executing a function\n          //\n          // else if (message.status === \"partial\") {\n          //   return (\n          //     <div key={index} className={`copilotKitMessage copilotKitAssistantMessage`}>\n          //       {context.labels.thinking} {context.icons.spinnerIcon}\n          //     </div>\n          //   );\n          // }\n          else {\n            return (\n              <div key={index} className={`copilotKitMessage copilotKitAssistantMessage`}>\n                <Markdown content={message.content} />\n              </div>\n            );\n          }\n        }\n        // TODO: Add back function and error messages\n        //\n        // else if (message.role === \"function\" && message.status === \"success\") {\n        //   return (\n        //     <div key={index} className={`copilotKitMessage copilotKitAssistantMessage`}>\n        //       {context.labels.done}\n        //     </div>\n        //   );\n        // } else if (message.status === \"error\") {\n        //   return (\n        //     <div key={index} className={`copilotKitMessage copilotKitAssistantMessage`}>\n        //       {context.labels.error}\n        //     </div>\n        //   );\n        // }\n      })}\n      <div ref={messagesEndRef} />\n    </div>\n  );\n};\n\nfunction makeInitialMessages(initial?: string | string[]): Message[] {\n  let initialArray: string[] = [];\n  if (initial) {\n    if (Array.isArray(initial)) {\n      initialArray.push(...initial);\n    } else {\n      initialArray.push(initial);\n    }\n  }\n\n  return initialArray.map((message) => ({\n    id: nanoid(),\n    role: \"assistant\",\n    content: message,\n  }));\n}\n"]}

package/dist/{chunk-Y2RUG4B3.mjs → chunk-5O2MCJZ2.mjs}

@@ -1,4 +1,4 @@
-import { useChatContext } from './chunk-6H3Y2XEI.mjs';
+import { useChatContext } from './chunk-OF66AL5Z.mjs';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 var Button = ({ open, setOpen }) => {
@@ -18,4 +18,4 @@ var Button = ({ open, setOpen }) => {
 
 export { Button };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-Y2RUG4B3.mjs.map
+//# sourceMappingURL=chunk-5O2MCJZ2.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Button.tsx"],"names":[],"mappings":";;;;;AASM,SAIE,KAJF;AANC,IAAM,SAAS,CAAC,EAAE,MAAM,QAAQ,MAAmB;AACxD,QAAM,UAAU,eAAe;AAG/B,SACE,oBAAC,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,4BAAC,SAAI,WAAU,iDACZ,kBAAQ,MAAM,UACjB;AAAA,QACA,oBAAC,SAAI,WAAU,kDACZ,kBAAQ,MAAM,WACjB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ","sourcesContent":["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/{chunk-X3Z2EVFV.mjs → chunk-CKJXXQ2W.mjs}

@@ -1,9 +1,9 @@
-import { CopilotKitChat } from './chunk-DN3OI5WF.mjs';
+import { CopilotChat } from './chunk-NNVWLSYK.mjs';
 import { __spreadProps, __spreadValues } from './chunk-MRXNTQOX.mjs';
 import { useState } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var CopilotKitSidebar = (props) => {
+var CopilotSidebar = (props) => {
   props = __spreadProps(__spreadValues({}, props), {
     className: props.className ? props.className + " copilotKitSidebar" : "copilotKitSidebar"
   });
@@ -17,10 +17,10 @@ var CopilotKitSidebar = (props) => {
   };
   return /* @__PURE__ */ jsxs("div", { className: `copilotKitSidebarContentWrapper ${expandedClassName}`, children: [
     props.children,
-    /* @__PURE__ */ jsx(CopilotKitChat, __spreadValues(__spreadValues({}, props), { onSetOpen }))
+    /* @__PURE__ */ jsx(CopilotChat, __spreadValues(__spreadValues({}, props), { onSetOpen }))
   ] });
 };
 
-export { CopilotKitSidebar };
+export { CopilotSidebar };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-X3Z2EVFV.mjs.map
+//# sourceMappingURL=chunk-CKJXXQ2W.mjs.map

package/dist/chunk-CKJXXQ2W.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Sidebar.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,SAAgB,gBAAgB;AAsB5B,SAEE,KAFF;AAfG,IAAM,iBAAiB,CAAC,UAA+B;AAC5D,UAAQ,iCACH,QADG;AAAA,IAEN,WAAW,MAAM,YAAY,MAAM,YAAY,uBAAuB;AAAA,EACxE;AACA,QAAM,CAAC,mBAAmB,oBAAoB,IAAI;AAAA,IAChD,MAAM,cAAc,oBAAoB;AAAA,EAC1C;AAEA,QAAM,YAAY,CAAC,SAAkB;AAhBvC;AAiBI,gBAAM,cAAN,+BAAkB;AAClB,yBAAqB,OAAO,oBAAoB,EAAE;AAAA,EACpD;AAEA,SACE,qBAAC,SAAI,WAAW,mCAAmC,qBAChD;AAAA,UAAM;AAAA,IACP,oBAAC,+CAAgB,QAAW,EAAE,UAAU,EAAG;AAAA,KAC7C;AAEJ","sourcesContent":["import React, { useState } from \"react\";\nimport { CopilotChat, CopilotChatProps } from \"./Chat\";\n\ninterface CopilotSidebarProps extends CopilotChatProps {\n  children?: React.ReactNode;\n}\n\nexport const CopilotSidebar = (props: CopilotSidebarProps) => {\n  props = {\n    ...props,\n    className: props.className ? props.className + \" copilotKitSidebar\" : \"copilotKitSidebar\",\n  };\n  const [expandedClassName, setExpandedClassName] = useState(\n    props.defaultOpen ? \"sidebarExpanded\" : \"\",\n  );\n\n  const onSetOpen = (open: boolean) => {\n    props.onSetOpen?.(open);\n    setExpandedClassName(open ? \"sidebarExpanded\" : \"\");\n  };\n\n  return (\n    <div className={`copilotKitSidebarContentWrapper ${expandedClassName}`}>\n      {props.children}\n      <CopilotChat {...props} {...{ onSetOpen }} />\n    </div>\n  );\n};\n"]}

package/dist/{chunk-NXWVWC33.mjs → chunk-DPRH4HX3.mjs}

@@ -2,15 +2,9 @@ import { DownloadIcon, CheckIcon, CopyIcon } from './chunk-7YXG7D47.mjs';
 import { useCopyToClipboard } from './chunk-POVINPXX.mjs';
 import { memo } from 'react';
 import { Prism } from 'react-syntax-highlighter';
+import { vscDarkPlus } from 'react-syntax-highlighter/dist/esm/styles/prism';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var CodeActionButton = ({ onClick, children }) => {
-  let className = "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 ";
-  className += "hover:bg-zinc-800 focus-visible:ring-1 focus-visible:ring-slate-700 focus-visible:ring-offset-0 ";
-  className += "hover:bg-accent hover:text-accent-foreground ";
-  className += "h-10 w-10";
-  return /* @__PURE__ */ jsx("button", { className, onClick, children });
-};
 var programmingLanguages = {
   javascript: ".js",
   python: ".py",
@@ -73,15 +67,15 @@ var CodeBlock = memo(({ language, value }) => {
       return;
     copyToClipboard(value);
   };
-  return /* @__PURE__ */ jsxs("div", { className: "codeblock relative w-full bg-zinc-950 font-sans", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between bg-zinc-800 px-6 py-2 pr-4 text-zinc-100", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-xs lowercase", children: language }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-1", children: [
-        /* @__PURE__ */ jsxs(CodeActionButton, { onClick: downloadAsFile, children: [
+  return /* @__PURE__ */ jsxs("div", { className: "copilotKitCodeBlock", children: [
+    /* @__PURE__ */ jsxs("div", { className: "copilotKitCodeBlockToolbar", children: [
+      /* @__PURE__ */ jsx("span", { className: "copilotKitCodeBlockToolbarLanguage", children: language }),
+      /* @__PURE__ */ jsxs("div", { className: "copilotKitCodeBlockToolbarButtons", children: [
+        /* @__PURE__ */ jsxs("button", { className: "copilotKitCodeBlockToolbarButton", onClick: downloadAsFile, children: [
           /* @__PURE__ */ jsx(DownloadIcon, {}),
           /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Download" })
         ] }),
-        /* @__PURE__ */ jsxs(CodeActionButton, { onClick: onCopy, children: [
+        /* @__PURE__ */ jsxs("button", { className: "copilotKitCodeBlockToolbarButton", onClick: onCopy, children: [
           isCopied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {}),
           /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Copy code" })
         ] })
@@ -91,19 +85,12 @@ var CodeBlock = memo(({ language, value }) => {
       Prism,
       {
         language,
+        style: vscDarkPlus,
         PreTag: "div",
-        showLineNumbers: true,
         customStyle: {
           margin: 0,
-          width: "100%",
-          background: "transparent",
-          padding: "1.5rem 1rem"
-        },
-        codeTagProps: {
-          style: {
-            fontSize: "0.9rem",
-            fontFamily: "var(--font-mono)"
-          }
+          borderBottomLeftRadius: "0.375rem",
+          borderBottomRightRadius: "0.375rem"
         },
         children: value
       }
@@ -114,4 +101,4 @@ CodeBlock.displayName = "CodeBlock";
 
 export { CodeBlock, generateRandomString, programmingLanguages };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-NXWVWC33.mjs.map
+//# sourceMappingURL=chunk-DPRH4HX3.mjs.map

package/dist/chunk-DPRH4HX3.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/CodeBlock.tsx"],"names":[],"mappings":";;;;;;;;;;AAEA,SAAa,YAAY;AACzB,SAAS,SAAS,yBAAyB;AAC3C,SAAS,eAAe,sBAAsB;AA2FtC,cAEE,YAFF;AAxED,IAAM,uBAAoC;AAAA,EAC/C,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,GAAG;AAAA,EACH,KAAK;AAAA,EACL,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AAAA,EACP,eAAe;AAAA,EACf,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,SAAS;AAAA,EACT,KAAK;AAAA,EACL,OAAO;AAAA,EACP,KAAK;AAAA,EACL,MAAM;AAAA,EACN,KAAK;AAAA;AAEP;AAEO,IAAM,uBAAuB,CAAC,QAAgB,YAAY,UAAU;AACzE,QAAM,QAAQ;AACd,MAAI,SAAS;AACb,WAAS,IAAI,GAAG,IAAI,QAAQ,KAAK;AAC/B,cAAU,MAAM,OAAO,KAAK,MAAM,KAAK,OAAO,IAAI,MAAM,MAAM,CAAC;AAAA,EACjE;AACA,SAAO,YAAY,OAAO,YAAY,IAAI;AAC5C;AAEA,IAAM,YAAuB,KAAK,CAAC,EAAE,UAAU,MAAM,MAAM;AACzD,QAAM,EAAE,UAAU,gBAAgB,IAAI,mBAAmB,EAAE,SAAS,IAAK,CAAC;AAE1E,QAAM,iBAAiB,MAAM;AAC3B,QAAI,OAAO,WAAW,aAAa;AACjC;AAAA,IACF;AACA,UAAM,gBAAgB,qBAAqB,QAAQ,KAAK;AACxD,UAAM,oBAAoB,QAAQ,qBAAqB,GAAG,IAAI,IAAI;AAClE,UAAM,WAAW,OAAO,OAAO,mBAAyB,iBAAiB;AAEzE,QAAI,CAAC,UAAU;AAEb;AAAA,IACF;AAEA,UAAM,OAAO,IAAI,KAAK,CAAC,KAAK,GAAG,EAAE,MAAM,aAAa,CAAC;AACrD,UAAM,MAAM,IAAI,gBAAgB,IAAI;AACpC,UAAM,OAAO,SAAS,cAAc,GAAG;AACvC,SAAK,WAAW;AAChB,SAAK,OAAO;AACZ,SAAK,MAAM,UAAU;AACrB,aAAS,KAAK,YAAY,IAAI;AAC9B,SAAK,MAAM;AACX,aAAS,KAAK,YAAY,IAAI;AAC9B,QAAI,gBAAgB,GAAG;AAAA,EACzB;AAEA,QAAM,SAAS,MAAM;AACnB,QAAI;AAAU;AACd,oBAAgB,KAAK;AAAA,EACvB;AAEA,SACE,qBAAC,SAAI,WAAU,uBACb;AAAA,yBAAC,SAAI,WAAU,8BACb;AAAA,0BAAC,UAAK,WAAU,sCAAsC,oBAAS;AAAA,MAC/D,qBAAC,SAAI,WAAU,qCACb;AAAA,6BAAC,YAAO,WAAU,oCAAmC,SAAS,gBAC5D;AAAA,8BAAC,gBAAa;AAAA,UACd,oBAAC,UAAK,WAAU,WAAU,sBAAQ;AAAA,WACpC;AAAA,QACA,qBAAC,YAAO,WAAU,oCAAmC,SAAS,QAC3D;AAAA,qBAAW,oBAAC,aAAU,IAAK,oBAAC,YAAS;AAAA,UACtC,oBAAC,UAAK,WAAU,WAAU,uBAAS;AAAA,WACrC;AAAA,SACF;AAAA,OACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,QACP,QAAO;AAAA,QACP,aAAa;AAAA,UACX,QAAQ;AAAA,UACR,wBAAwB;AAAA,UACxB,yBAAyB;AAAA,QAC3B;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,KACF;AAEJ,CAAC;AACD,UAAU,cAAc","sourcesContent":["\"use client\";\n\nimport { FC, memo } from \"react\";\nimport { Prism as SyntaxHighlighter } from \"react-syntax-highlighter\";\nimport { vscDarkPlus as highlightStyle } from \"react-syntax-highlighter/dist/esm/styles/prism\";\n\nimport { useCopyToClipboard } from \"../../hooks/use-copy-to-clipboard\";\nimport { CheckIcon, CopyIcon, DownloadIcon } from \"./Icons\";\n\ninterface CodeActionButtonProps {\n  onClick: () => void;\n  children: React.ReactNode;\n}\n\ninterface Props {\n  language: string;\n  value: string;\n}\n\ninterface languageMap {\n  [key: string]: string | undefined;\n}\n\nexport const programmingLanguages: languageMap = {\n  javascript: \".js\",\n  python: \".py\",\n  java: \".java\",\n  c: \".c\",\n  cpp: \".cpp\",\n  \"c++\": \".cpp\",\n  \"c#\": \".cs\",\n  ruby: \".rb\",\n  php: \".php\",\n  swift: \".swift\",\n  \"objective-c\": \".m\",\n  kotlin: \".kt\",\n  typescript: \".ts\",\n  go: \".go\",\n  perl: \".pl\",\n  rust: \".rs\",\n  scala: \".scala\",\n  haskell: \".hs\",\n  lua: \".lua\",\n  shell: \".sh\",\n  sql: \".sql\",\n  html: \".html\",\n  css: \".css\",\n  // add more file extensions here, make sure the key is same as language prop in CodeBlock.tsx component\n};\n\nexport const generateRandomString = (length: number, lowercase = false) => {\n  const chars = \"ABCDEFGHJKLMNPQRSTUVWXY3456789\"; // excluding similar looking characters like Z, 2, I, 1, O, 0\n  let result = \"\";\n  for (let i = 0; i < length; i++) {\n    result += chars.charAt(Math.floor(Math.random() * chars.length));\n  }\n  return lowercase ? result.toLowerCase() : result;\n};\n\nconst CodeBlock: FC<Props> = memo(({ language, value }) => {\n  const { isCopied, copyToClipboard } = useCopyToClipboard({ timeout: 2000 });\n\n  const downloadAsFile = () => {\n    if (typeof window === \"undefined\") {\n      return;\n    }\n    const fileExtension = programmingLanguages[language] || \".file\";\n    const suggestedFileName = `file-${generateRandomString(3, true)}${fileExtension}`;\n    const fileName = window.prompt(\"Enter file name\" || \"\", suggestedFileName);\n\n    if (!fileName) {\n      // User pressed cancel on prompt.\n      return;\n    }\n\n    const blob = new Blob([value], { type: \"text/plain\" });\n    const url = URL.createObjectURL(blob);\n    const link = document.createElement(\"a\");\n    link.download = fileName;\n    link.href = url;\n    link.style.display = \"none\";\n    document.body.appendChild(link);\n    link.click();\n    document.body.removeChild(link);\n    URL.revokeObjectURL(url);\n  };\n\n  const onCopy = () => {\n    if (isCopied) return;\n    copyToClipboard(value);\n  };\n\n  return (\n    <div className=\"copilotKitCodeBlock\">\n      <div className=\"copilotKitCodeBlockToolbar\">\n        <span className=\"copilotKitCodeBlockToolbarLanguage\">{language}</span>\n        <div className=\"copilotKitCodeBlockToolbarButtons\">\n          <button className=\"copilotKitCodeBlockToolbarButton\" onClick={downloadAsFile}>\n            <DownloadIcon />\n            <span className=\"sr-only\">Download</span>\n          </button>\n          <button className=\"copilotKitCodeBlockToolbarButton\" onClick={onCopy}>\n            {isCopied ? <CheckIcon /> : <CopyIcon />}\n            <span className=\"sr-only\">Copy code</span>\n          </button>\n        </div>\n      </div>\n      <SyntaxHighlighter\n        language={language}\n        style={highlightStyle}\n        PreTag=\"div\"\n        customStyle={{\n          margin: 0,\n          borderBottomLeftRadius: \"0.375rem\",\n          borderBottomRightRadius: \"0.375rem\",\n        }}\n      >\n        {value}\n      </SyntaxHighlighter>\n    </div>\n  );\n});\nCodeBlock.displayName = \"CodeBlock\";\n\nexport { CodeBlock };\n"]}

package/dist/{chunk-UIRFLYXI.mjs → chunk-GWGHQNRI.mjs}

@@ -1,4 +1,4 @@
-import { CodeBlock } from './chunk-NXWVWC33.mjs';
+import { CodeBlock } from './chunk-DPRH4HX3.mjs';
 import { __objRest, __spreadProps, __spreadValues } from './chunk-MRXNTQOX.mjs';
 import { memo } from 'react';
 import ReactMarkdown from 'react-markdown';
@@ -11,25 +11,26 @@ var MemoizedReactMarkdown = memo(
   (prevProps, nextProps) => prevProps.children === nextProps.children && prevProps.className === nextProps.className
 );
 var Markdown = ({ content }) => {
-  return /* @__PURE__ */ jsx(
-    MemoizedReactMarkdown,
-    {
-      className: "prose break-words dark:prose-invert prose-p:leading-relaxed prose-pre:p-0 text-sm",
-      components,
-      remarkPlugins: [remarkGfm, remarkMath],
-      children: content
-    }
-  );
+  return /* @__PURE__ */ jsx("div", { className: "copilotKitMarkdown", children: /* @__PURE__ */ jsx(MemoizedReactMarkdown, { components, remarkPlugins: [remarkGfm, remarkMath], children: content }) });
 };
 var components = {
   p({ children }) {
-    return /* @__PURE__ */ jsx("p", { className: "mb-2 last:mb-0", children });
+    return /* @__PURE__ */ jsx("p", { children });
   },
   code(_a) {
     var _b = _a, { children, className, inline } = _b, props = __objRest(_b, ["children", "className", "inline"]);
     if (children.length) {
       if (children[0] == "\u258D") {
-        return /* @__PURE__ */ jsx("span", { className: "mt-1 animate-pulse cursor-default", children: "\u258D" });
+        return /* @__PURE__ */ jsx(
+          "span",
+          {
+            style: {
+              animation: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite",
+              marginTop: "0.25rem"
+            },
+            children: "\u258D"
+          }
+        );
       }
       children[0] = children[0].replace("`\u258D`", "\u258D");
     }
@@ -50,4 +51,4 @@ var components = {
 
 export { Markdown };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-UIRFLYXI.mjs.map
+//# sourceMappingURL=chunk-GWGHQNRI.mjs.map

package/dist/chunk-GWGHQNRI.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Markdown.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,SAAa,YAAY;AACzB,OAAO,mBAA4C;AAEnD,OAAO,eAAe;AACtB,OAAO,gBAAgB;AAejB;AAbN,IAAM,wBAAqC;AAAA,EACzC;AAAA,EACA,CAAC,WAAW,cACV,UAAU,aAAa,UAAU,YAAY,UAAU,cAAc,UAAU;AACnF;AAMO,IAAM,WAAW,CAAC,EAAE,QAAQ,MAAqB;AACtD,SACE,oBAAC,SAAI,WAAU,sBACb,8BAAC,yBAAsB,YAAwB,eAAe,CAAC,WAAW,UAAU,GACjF,mBACH,GACF;AAEJ;AAEA,IAAM,aAAyB;AAAA,EAC7B,EAAE,EAAE,SAAS,GAAG;AACd,WAAO,oBAAC,OAAG,UAAS;AAAA,EACtB;AAAA,EACA,KAAK,IAA2C;AAA3C,iBAAE,YAAU,WAAW,OA9B9B,IA8BO,IAAkC,kBAAlC,IAAkC,CAAhC,YAAU,aAAW;AAC1B,QAAI,SAAS,QAAQ;AACnB,UAAI,SAAS,CAAC,KAAK,UAAK;AACtB,eACE;AAAA,UAAC;AAAA;AAAA,YACC,OAAO;AAAA,cACL,WAAW;AAAA,cACX,WAAW;AAAA,YACb;AAAA,YACD;AAAA;AAAA,QAED;AAAA,MAEJ;AAEA,eAAS,CAAC,IAAK,SAAS,CAAC,EAAa,QAAQ,YAAO,QAAG;AAAA,IAC1D;AAEA,UAAM,QAAQ,iBAAiB,KAAK,aAAa,EAAE;AAEnD,QAAI,QAAQ;AACV,aACE,oBAAC,uCAAK,aAA0B,QAA/B,EACE,WACH;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,UAAW,SAAS,MAAM,CAAC,KAAM;AAAA,QACjC,OAAO,OAAO,QAAQ,EAAE,QAAQ,OAAO,EAAE;AAAA,SACrC;AAAA,MAHC,KAAK,OAAO;AAAA,IAInB;AAAA,EAEJ;AACF","sourcesContent":["import { FC, memo } from \"react\";\nimport ReactMarkdown, { Options, Components } from \"react-markdown\";\nimport { CodeBlock } from \"./CodeBlock\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\n\nconst MemoizedReactMarkdown: FC<Options> = memo(\n  ReactMarkdown,\n  (prevProps, nextProps) =>\n    prevProps.children === nextProps.children && prevProps.className === nextProps.className,\n);\n\ntype MarkdownProps = {\n  content: string;\n};\n\nexport const Markdown = ({ content }: MarkdownProps) => {\n  return (\n    <div className=\"copilotKitMarkdown\">\n      <MemoizedReactMarkdown components={components} remarkPlugins={[remarkGfm, remarkMath]}>\n        {content}\n      </MemoizedReactMarkdown>\n    </div>\n  );\n};\n\nconst components: Components = {\n  p({ children }) {\n    return <p>{children}</p>;\n  },\n  code({ children, className, inline, ...props }) {\n    if (children.length) {\n      if (children[0] == \"▍\") {\n        return (\n          <span\n            style={{\n              animation: \"pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite\",\n              marginTop: \"0.25rem\",\n            }}\n          >\n            ▍\n          </span>\n        );\n      }\n\n      children[0] = (children[0] as string).replace(\"`▍`\", \"▍\");\n    }\n\n    const match = /language-(\\w+)/.exec(className || \"\");\n\n    if (inline) {\n      return (\n        <code className={className} {...props}>\n          {children}\n        </code>\n      );\n    }\n\n    return (\n      <CodeBlock\n        key={Math.random()}\n        language={(match && match[1]) || \"\"}\n        value={String(children).replace(/\\n$/, \"\")}\n        {...props}\n      />\n    );\n  },\n};\n"]}

package/dist/chunk-JD7BAH7U.mjs

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

package/dist/{chunk-X4T6ZUVM.mjs → chunk-KBGIPFXA.mjs}

@@ -1,14 +1,14 @@
-import { CopilotKitChat } from './chunk-DN3OI5WF.mjs';
+import { CopilotChat } from './chunk-NNVWLSYK.mjs';
 import { __spreadProps, __spreadValues } from './chunk-MRXNTQOX.mjs';
 import { jsx } from 'react/jsx-runtime';
 
-var CopilotKitPopup = (props) => {
+var CopilotPopup = (props) => {
   props = __spreadProps(__spreadValues({}, props), {
     className: props.className ? props.className + " copilotKitPopup" : "copilotKitPopup"
   });
-  return /* @__PURE__ */ jsx(CopilotKitChat, __spreadValues({}, props));
+  return /* @__PURE__ */ jsx(CopilotChat, __spreadValues({}, props));
 };
 
-export { CopilotKitPopup };
+export { CopilotPopup };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-X4T6ZUVM.mjs.map
+//# sourceMappingURL=chunk-KBGIPFXA.mjs.map

package/dist/chunk-KBGIPFXA.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Popup.tsx"],"names":[],"mappings":";;;;;;;;;AAOS;AALF,IAAM,eAAe,CAAC,UAA4B;AACvD,UAAQ,iCACH,QADG;AAAA,IAEN,WAAW,MAAM,YAAY,MAAM,YAAY,qBAAqB;AAAA,EACtE;AACA,SAAO,oBAAC,gCAAgB,MAAO;AACjC","sourcesContent":["import { CopilotChat, CopilotChatProps } from \"./Chat\";\n\nexport const CopilotPopup = (props: CopilotChatProps) => {\n  props = {\n    ...props,\n    className: props.className ? props.className + \" copilotKitPopup\" : \"copilotKitPopup\",\n  };\n  return <CopilotChat {...props} />;\n};\n"]}

package/dist/{chunk-DN3OI5WF.mjs → chunk-NNVWLSYK.mjs}

@@ -1,17 +1,17 @@
+import { Messages } from './chunk-3M4HWSE7.mjs';
+import { ResponseButton } from './chunk-Z34F3WLK.mjs';
 import { Window } from './chunk-47SYBLI2.mjs';
-import { Input } from './chunk-QFASQEFJ.mjs';
-import { Messages } from './chunk-ZVAH2Z2W.mjs';
-import { ResponseButton } from './chunk-GPEJCUWA.mjs';
-import { Button } from './chunk-Y2RUG4B3.mjs';
-import { Header } from './chunk-DPUPEOGG.mjs';
-import { ChatContextProvider } from './chunk-6H3Y2XEI.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 CopilotKitChat = ({
+var CopilotChat = ({
   instructions,
   defaultOpen = false,
   clickOutsideToClose = true,
@@ -67,6 +67,6 @@ var CopilotKitChat = ({
   ] }) });
 };
 
-export { CopilotKitChat };
+export { CopilotChat };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-DN3OI5WF.mjs.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-QFASQEFJ.mjs → chunk-NYLOXKYT.mjs}

@@ -1,5 +1,5 @@
 import { Textarea_default } from './chunk-WM6BS77F.mjs';
-import { useChatContext } from './chunk-6H3Y2XEI.mjs';
+import { useChatContext } from './chunk-OF66AL5Z.mjs';
 import { useRef, useState } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
@@ -48,4 +48,4 @@ var Input = ({ inProgress, onSend, children }) => {
 
 export { Input };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-QFASQEFJ.mjs.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-6H3Y2XEI.mjs → chunk-OF66AL5Z.mjs}

@@ -53,4 +53,4 @@ var ChatContextProvider = ({
 
 export { ChatContext, ChatContextProvider, useChatContext };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-6H3Y2XEI.mjs.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-DPUPEOGG.mjs → chunk-UWPFPWAW.mjs}

@@ -1,4 +1,4 @@
-import { useChatContext } from './chunk-6H3Y2XEI.mjs';
+import { useChatContext } from './chunk-OF66AL5Z.mjs';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var Header = ({ setOpen }) => {
@@ -11,4 +11,4 @@ var Header = ({ setOpen }) => {
 
 export { Header };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-DPUPEOGG.mjs.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-GPEJCUWA.mjs → chunk-Z34F3WLK.mjs}

@@ -1,4 +1,4 @@
-import { useChatContext } from './chunk-6H3Y2XEI.mjs';
+import { useChatContext } from './chunk-OF66AL5Z.mjs';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var ResponseButton = ({ onClick, inProgress }) => {
@@ -11,4 +11,4 @@ var ResponseButton = ({ onClick, inProgress }) => {
 
 export { ResponseButton };
 //# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-GPEJCUWA.mjs.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

@@ -1,7 +1,6 @@
-import React__default from 'react';
 import { ButtonProps } from './props.js';
-import '@copilotkit/react-core';
+import '@copilotkit/shared';
 
-declare const Button: React__default.FC<ButtonProps>;
+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

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

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

@@ -1,12 +1,13 @@
-import React__default from 'react';
-import { CopilotKitChatIcons, CopilotKitChatLabels } from './ChatContext.js';
+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 CopilotKitChat component.
+ * Props for CopilotChat component.
  */
-interface CopilotKitChatProps {
+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
@@ -44,11 +45,11 @@ interface CopilotKitChatProps {
     /**
      * Icons can be used to set custom icons for the chat window.
      */
-    icons?: CopilotKitChatIcons;
+    icons?: CopilotChatIcons;
     /**
      * Labels can be used to set custom labels for the chat window.
      */
-    labels?: CopilotKitChatLabels;
+    labels?: CopilotChatLabels;
     /**
      * A function that takes in context string and instructions and returns
      * the system message to include in the chat request.
@@ -64,32 +65,32 @@ interface CopilotKitChatProps {
     /**
      * A custom Window component to use instead of the default.
      */
-    Window?: React__default.ComponentType<WindowProps>;
+    Window?: React.ComponentType<WindowProps>;
     /**
      * A custom Button component to use instead of the default.
      */
-    Button?: React__default.ComponentType<ButtonProps>;
+    Button?: React.ComponentType<ButtonProps>;
     /**
      * A custom Header component to use instead of the default.
      */
-    Header?: React__default.ComponentType<HeaderProps>;
+    Header?: React.ComponentType<HeaderProps>;
     /**
      * A custom Messages component to use instead of the default.
      */
-    Messages?: React__default.ComponentType<MessagesProps>;
+    Messages?: React.ComponentType<MessagesProps>;
     /**
      * A custom Input component to use instead of the default.
      */
-    Input?: React__default.ComponentType<InputProps>;
+    Input?: React.ComponentType<InputProps>;
     /**
      * A custom ResponseButton component to use instead of the default.
      */
-    ResponseButton?: React__default.ComponentType<ResponseButtonProps>;
+    ResponseButton?: React.ComponentType<ResponseButtonProps>;
     /**
      * A class name to apply to the root element.
      */
     className?: string;
 }
-declare const CopilotKitChat: React__default.FC<CopilotKitChatProps>;
+declare const CopilotChat: ({ instructions, defaultOpen, clickOutsideToClose, hitEscapeToClose, onSetOpen, hotkey, icons, labels, makeSystemMessage, showResponseButton, Window, Button, Header, Messages, Input, ResponseButton, className, }: CopilotChatProps) => JSX.Element;
 
-export { CopilotKitChat, CopilotKitChatProps };
+export { CopilotChat, CopilotChatProps };