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

package/dist/components/chat/Sidebar.mjs

@@ -1,8 +1,8 @@
 import {
   CopilotSidebar
-} from "../../chunk-T5637OOY.mjs";
-import "../../chunk-W2OWARTP.mjs";
-import "../../chunk-Q2NFQTCQ.mjs";
+} from "../../chunk-KCV67665.mjs";
+import "../../chunk-WN46UIN3.mjs";
+import "../../chunk-TIDV74OE.mjs";
 import "../../chunk-UH2UFL5W.mjs";
 import "../../chunk-V7W6IM2V.mjs";
 import "../../chunk-VGPQYMKJ.mjs";
@@ -12,17 +12,18 @@ import "../../chunk-KXE2JCUH.mjs";
 import "../../chunk-NRA3CFEE.mjs";
 import "../../chunk-BH6PCAAL.mjs";
 import "../../chunk-UFN2VWSR.mjs";
-import "../../chunk-QXWJ7HYU.mjs";
+import "../../chunk-JZAMNIUD.mjs";
 import "../../chunk-DSQGQJI4.mjs";
 import "../../chunk-24TDU7MY.mjs";
-import "../../chunk-SLTG4L62.mjs";
+import "../../chunk-LUPGADWY.mjs";
 import "../../chunk-XFCMZH2H.mjs";
-import "../../chunk-POWCBXRY.mjs";
-import "../../chunk-HWMFMBJC.mjs";
+import "../../chunk-RVLCPPEL.mjs";
 import "../../chunk-OZXUB3V7.mjs";
+import "../../chunk-HWMFMBJC.mjs";
 import "../../chunk-XZNY26GH.mjs";
 import "../../chunk-PLHTVHUW.mjs";
-import "../../chunk-IWBARPUZ.mjs";
+import "../../chunk-EMIYIMQ6.mjs";
+import "../../chunk-CGEAG65D.mjs";
 import "../../chunk-YQFVRDNC.mjs";
 import "../../chunk-ABHUX6T6.mjs";
 import "../../chunk-KENCH7RN.mjs";

package/dist/components/chat/Window.js

@@ -51,15 +51,6 @@ function useChatContext() {
 
 // src/components/chat/Window.tsx
 var import_react_core = require("@copilotkit/react-core");
-
-// src/hooks/use-dark-mode.ts
-var useDarkMode = () => {
-  if (typeof window === "undefined")
-    return false;
-  return document.documentElement.classList.contains("dark") || document.body.classList.contains("dark") || document.documentElement.getAttribute("data-theme") === "dark" || document.body.getAttribute("data-theme") === "dark" || window.matchMedia("(prefers-color-scheme: dark)").matches;
-};
-
-// src/components/chat/Window.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var Window = ({
   children,
@@ -67,17 +58,16 @@ var Window = ({
   shortcut,
   hitEscapeToClose
 }) => {
-  var _a;
   const windowRef = import_react2.default.useRef(null);
   const context = (0, import_react_core.useCopilotContext)();
   const { open, setOpen } = useChatContext();
   const handleClickOutside = (0, import_react2.useCallback)(
     (event) => {
-      var _a2;
+      var _a;
       if (!clickOutsideToClose) {
         return;
       }
-      const parentElement = (_a2 = windowRef.current) == null ? void 0 : _a2.parentElement;
+      const parentElement = (_a = windowRef.current) == null ? void 0 : _a.parentElement;
       let className = "";
       if (event.target instanceof HTMLElement) {
         className = event.target.className;
@@ -91,10 +81,10 @@ var Window = ({
   );
   const handleKeyDown = (0, import_react2.useCallback)(
     (event) => {
-      var _a2;
+      var _a;
       const target = event.target;
       const isInput = target.tagName === "INPUT" || target.tagName === "SELECT" || target.tagName === "TEXTAREA" || target.isContentEditable;
-      const isDescendantOfWrapper = (_a2 = windowRef.current) == null ? void 0 : _a2.contains(target);
+      const isDescendantOfWrapper = (_a = windowRef.current) == null ? void 0 : _a.contains(target);
       if (open && event.key === "Escape" && (!isInput || isDescendantOfWrapper) && hitEscapeToClose) {
         setOpen(false);
       } else if (event.key === shortcut && (isMacOS() && event.metaKey || !isMacOS() && event.ctrlKey) && (!isInput || isDescendantOfWrapper)) {
@@ -149,29 +139,7 @@ var Window = ({
       }
     };
   }, [adjustForMobile, handleClickOutside, handleKeyDown]);
-  const isDark = useDarkMode();
-  const showPoweredBy = !((_a = context.copilotApiConfig) == null ? void 0 : _a.publicApiKey);
-  const poweredByStyle = {
-    visibility: "visible",
-    display: "block",
-    position: "static",
-    textAlign: "center",
-    fontSize: "12px",
-    padding: "3px 0",
-    color: isDark ? "rgb(69, 69, 69)" : "rgb(214, 214, 214)"
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-    "div",
-    {
-      className: `copilotKitWindow ${showPoweredBy ? " poweredByContainer" : ""} ${open ? " open" : ""}`,
-      ref: windowRef,
-      children: [
-        children,
-        showPoweredBy && // @ts-expect-error -- expecting position not to be a string, but it can be.
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "poweredBy", style: poweredByStyle, children: "Powered by CopilotKit" })
-      ]
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: `copilotKitWindow ${open ? " open" : ""}`, ref: windowRef, children });
 };
 var preventScroll = (event) => {
   let targetElement = event.target;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/chat/Window.tsx","../../../src/components/chat/ChatContext.tsx","../../../src/hooks/use-dark-mode.ts"],"sourcesContent":["import React, { useCallback, useEffect } from \"react\";\nimport { WindowProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport { useCopilotContext } from \"@copilotkit/react-core\";\nimport { useDarkMode } from \"../../hooks/use-dark-mode\";\n\nexport const Window = ({\n  children,\n  clickOutsideToClose,\n  shortcut,\n  hitEscapeToClose,\n}: WindowProps) => {\n  const windowRef = React.useRef<HTMLDivElement>(null);\n  const context = useCopilotContext();\n\n  const { open, setOpen } = useChatContext();\n\n  const handleClickOutside = useCallback(\n    (event: MouseEvent) => {\n      if (!clickOutsideToClose) {\n        return;\n      }\n\n      const parentElement = windowRef.current?.parentElement;\n\n      let className = \"\";\n      if (event.target instanceof HTMLElement) {\n        className = event.target.className;\n      }\n\n      if (\n        open &&\n        parentElement &&\n        !parentElement.contains(event.target as any) &&\n        // prevent closing the window when clicking on the debug menu\n        !className.includes(\"copilotKitDebugMenu\")\n      ) {\n        setOpen(false);\n      }\n    },\n    [clickOutsideToClose, open, setOpen],\n  );\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      const target = event.target as HTMLElement;\n      const isInput =\n        target.tagName === \"INPUT\" ||\n        target.tagName === \"SELECT\" ||\n        target.tagName === \"TEXTAREA\" ||\n        target.isContentEditable;\n\n      const isDescendantOfWrapper = windowRef.current?.contains(target);\n\n      if (\n        open &&\n        event.key === \"Escape\" &&\n        (!isInput || isDescendantOfWrapper) &&\n        hitEscapeToClose\n      ) {\n        setOpen(false);\n      } else if (\n        event.key === shortcut &&\n        ((isMacOS() && event.metaKey) || (!isMacOS() && event.ctrlKey)) &&\n        (!isInput || isDescendantOfWrapper)\n      ) {\n        setOpen(!open);\n      }\n    },\n    [hitEscapeToClose, shortcut, open, setOpen],\n  );\n\n  const adjustForMobile = useCallback(() => {\n    const copilotKitWindow = windowRef.current;\n    const vv = window.visualViewport;\n    if (!copilotKitWindow || !vv) {\n      return;\n    }\n\n    if (window.innerWidth < 640 && open) {\n      copilotKitWindow.style.height = `${vv.height}px`;\n      copilotKitWindow.style.left = `${vv.offsetLeft}px`;\n      copilotKitWindow.style.top = `${vv.offsetTop}px`;\n\n      document.body.style.position = \"fixed\";\n      document.body.style.width = \"100%\";\n      document.body.style.height = `${window.innerHeight}px`;\n      document.body.style.overflow = \"hidden\";\n      document.body.style.touchAction = \"none\";\n\n      // Prevent scrolling on iOS\n      document.body.addEventListener(\"touchmove\", preventScroll, {\n        passive: false,\n      });\n    } else {\n      copilotKitWindow.style.height = \"\";\n      copilotKitWindow.style.left = \"\";\n      copilotKitWindow.style.top = \"\";\n      document.body.style.position = \"\";\n      document.body.style.height = \"\";\n      document.body.style.width = \"\";\n      document.body.style.overflow = \"\";\n      document.body.style.top = \"\";\n      document.body.style.touchAction = \"\";\n\n      document.body.removeEventListener(\"touchmove\", preventScroll);\n    }\n  }, [open]);\n\n  useEffect(() => {\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    document.addEventListener(\"keydown\", handleKeyDown);\n    if (window.visualViewport) {\n      window.visualViewport.addEventListener(\"resize\", adjustForMobile);\n      adjustForMobile();\n    }\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n      if (window.visualViewport) {\n        window.visualViewport.removeEventListener(\"resize\", adjustForMobile);\n      }\n    };\n  }, [adjustForMobile, handleClickOutside, handleKeyDown]);\n\n  const isDark = useDarkMode();\n\n  const showPoweredBy = !context.copilotApiConfig?.publicApiKey;\n  const poweredByStyle = {\n    visibility: \"visible\",\n    display: \"block\",\n    position: \"static\",\n    textAlign: \"center\",\n    fontSize: \"12px\",\n    padding: \"3px 0\",\n    color: isDark ? \"rgb(69, 69, 69)\" : \"rgb(214, 214, 214)\",\n  };\n\n  return (\n    <div\n      className={`copilotKitWindow ${showPoweredBy ? \" poweredByContainer\" : \"\"} ${open ? \" open\" : \"\"}`}\n      ref={windowRef}\n    >\n      {children}\n      {showPoweredBy && (\n        // @ts-expect-error -- expecting position not to be a string, but it can be.\n        <p className=\"poweredBy\" style={poweredByStyle}>\n          Powered by CopilotKit\n        </p>\n      )}\n    </div>\n  );\n};\n\nconst preventScroll = (event: TouchEvent): void => {\n  let targetElement = event.target as Element;\n\n  // Function to check if the target has the parent with a given class\n  const hasParentWithClass = (element: Element, className: string): boolean => {\n    while (element && element !== document.body) {\n      if (element.classList.contains(className)) {\n        return true;\n      }\n      element = element.parentElement!;\n    }\n    return false;\n  };\n\n  // Check if the target of the touch event is inside an element with the 'copilotKitMessages' class\n  if (!hasParentWithClass(targetElement, \"copilotKitMessages\")) {\n    event.preventDefault();\n  }\n};\n\nfunction isMacOS() {\n  return /Mac|iMac|Macintosh/i.test(navigator.userAgent);\n}\n","import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\nimport { ThumbsDownIcon, ThumbsUpIcon } from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n  /**\n   * The icon to use for the open chat button.\n   * @default <OpenIcon />\n   */\n  openIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button.\n   * @default <CloseIcon />\n   */\n  closeIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button in the header.\n   * @default <HeaderCloseIcon />\n   */\n  headerCloseIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the send button.\n   * @default <SendIcon />\n   */\n  sendIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the activity indicator.\n   * @default <ActivityIcon />\n   */\n  activityIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the spinner.\n   * @default <SpinnerIcon />\n   */\n  spinnerIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the stop button.\n   * @default <StopIcon />\n   */\n  stopIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the regenerate button.\n   * @default <RegenerateIcon />\n   */\n  regenerateIcon?: React.ReactNode;\n\n  /**\n   * The icons to use for push to talk.\n   * @default <PushToTalkIcon />\n   */\n\n  pushToTalkIcon?: React.ReactNode;\n\n  /**\n   * The icons to use for copy assistant response\n   * @default <CopyIcon />\n   */\n\n  copyIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for thumbs up/response approval.\n   * @default <ThumbsUpIcon />\n   */\n\n  thumbsUpIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for thumbs down/response rejection.\n   * @default <ThumbsDownIcon />\n   */\n\n  thumbsDownIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the upload button.\n   * @default <UploadIcon />\n   */\n  uploadIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n  /**\n   * The initial message(s) to display in the chat window.\n   */\n  initial?: string | string[];\n\n  /**\n   * The title to display in the header.\n   * @default \"CopilotKit\"\n   */\n  title?: string;\n\n  /**\n   * The placeholder to display in the input.\n   * @default \"Type a message...\"\n   */\n  placeholder?: string;\n\n  /**\n   * The message to display when an error occurs.\n   * @default \"❌ An error occurred. Please try again.\"\n   */\n  error?: string;\n\n  /**\n   * The label to display on the stop button.\n   * @default \"Stop generating\"\n   */\n  stopGenerating?: string;\n\n  /**\n   * The label to display on the regenerate button.\n   * @default \"Regenerate response\"\n   */\n  regenerateResponse?: string;\n\n  /**\n   * The label for the copy button.\n   * @default \"Copy to clipboard\"\n   */\n  copyToClipboard?: string;\n\n  /**\n   * The label for the thumbs up button.\n   * @default \"Thumbs up\"\n   */\n  thumbsUp?: string;\n\n  /**\n   * The label for the thumbs down button.\n   * @default \"Thumbs down\"\n   */\n  thumbsDown?: string;\n\n  /**\n   * The text to display when content is copied.\n   * @default \"Copied!\"\n   */\n  copied?: string;\n}\n\ninterface ChatContext {\n  labels: Required<CopilotChatLabels>;\n  icons: Required<CopilotChatIcons>;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nexport const ChatContext = React.createContext<ChatContext | undefined>(undefined);\n\nexport function useChatContext(): ChatContext {\n  const context = React.useContext(ChatContext);\n  if (context === undefined) {\n    throw new Error(\n      \"Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?\",\n    );\n  }\n  return context;\n}\n\ninterface ChatContextProps {\n  // temperature?: number;\n  // instructions?: string;\n  // maxFeedback?: number;\n  labels?: CopilotChatLabels;\n  icons?: CopilotChatIcons;\n  children?: React.ReactNode;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nexport const ChatContextProvider = ({\n  // temperature,\n  // instructions,\n  // maxFeedback,\n  labels,\n  icons,\n  children,\n  open,\n  setOpen,\n}: ChatContextProps) => {\n  const memoizedLabels = useMemo(\n    () => ({\n      ...{\n        initial: \"\",\n        title: \"CopilotKit\",\n        placeholder: \"Type a message...\",\n        error: \"❌ An error occurred. Please try again.\",\n        stopGenerating: \"Stop generating\",\n        regenerateResponse: \"Regenerate response\",\n        copyToClipboard: \"Copy to clipboard\",\n        thumbsUp: \"Thumbs up\",\n        thumbsDown: \"Thumbs down\",\n        copied: \"Copied!\",\n      },\n      ...labels,\n    }),\n    [labels],\n  );\n\n  const memoizedIcons = useMemo(\n    () => ({\n      ...{\n        openIcon: DefaultIcons.OpenIcon,\n        closeIcon: DefaultIcons.CloseIcon,\n        headerCloseIcon: DefaultIcons.HeaderCloseIcon,\n        sendIcon: DefaultIcons.SendIcon,\n        activityIcon: DefaultIcons.ActivityIcon,\n        spinnerIcon: DefaultIcons.SpinnerIcon,\n        stopIcon: DefaultIcons.StopIcon,\n        regenerateIcon: DefaultIcons.RegenerateIcon,\n        pushToTalkIcon: DefaultIcons.MicrophoneIcon,\n        copyIcon: DefaultIcons.CopyIcon,\n        thumbsUpIcon: DefaultIcons.ThumbsUpIcon,\n        thumbsDownIcon: DefaultIcons.ThumbsDownIcon,\n        uploadIcon: DefaultIcons.UploadIcon,\n      },\n      ...icons,\n    }),\n    [icons],\n  );\n\n  const context = useMemo(\n    () => ({\n      labels: memoizedLabels,\n      icons: memoizedIcons,\n      open,\n      setOpen,\n    }),\n    [memoizedLabels, memoizedIcons, open, setOpen],\n  );\n\n  return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n","export const useDarkMode = () => {\n  if (typeof window === \"undefined\") return false;\n  return (\n    document.documentElement.classList.contains(\"dark\") ||\n    document.body.classList.contains(\"dark\") ||\n    document.documentElement.getAttribute(\"data-theme\") === \"dark\" ||\n    document.body.getAttribute(\"data-theme\") === \"dark\" ||\n    window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n  );\n};\n"],"mappings":"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","names":["import_react","React","import_jsx_runtime","React","_a"]}
+{"version":3,"sources":["../../../src/components/chat/Window.tsx","../../../src/components/chat/ChatContext.tsx"],"sourcesContent":["import React, { useCallback, useEffect } from \"react\";\nimport { WindowProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\nimport { useCopilotContext } from \"@copilotkit/react-core\";\n\nexport const Window = ({\n  children,\n  clickOutsideToClose,\n  shortcut,\n  hitEscapeToClose,\n}: WindowProps) => {\n  const windowRef = React.useRef<HTMLDivElement>(null);\n  const context = useCopilotContext();\n\n  const { open, setOpen } = useChatContext();\n\n  const handleClickOutside = useCallback(\n    (event: MouseEvent) => {\n      if (!clickOutsideToClose) {\n        return;\n      }\n\n      const parentElement = windowRef.current?.parentElement;\n\n      let className = \"\";\n      if (event.target instanceof HTMLElement) {\n        className = event.target.className;\n      }\n\n      if (\n        open &&\n        parentElement &&\n        !parentElement.contains(event.target as any) &&\n        // prevent closing the window when clicking on the debug menu\n        !className.includes(\"copilotKitDebugMenu\")\n      ) {\n        setOpen(false);\n      }\n    },\n    [clickOutsideToClose, open, setOpen],\n  );\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      const target = event.target as HTMLElement;\n      const isInput =\n        target.tagName === \"INPUT\" ||\n        target.tagName === \"SELECT\" ||\n        target.tagName === \"TEXTAREA\" ||\n        target.isContentEditable;\n\n      const isDescendantOfWrapper = windowRef.current?.contains(target);\n\n      if (\n        open &&\n        event.key === \"Escape\" &&\n        (!isInput || isDescendantOfWrapper) &&\n        hitEscapeToClose\n      ) {\n        setOpen(false);\n      } else if (\n        event.key === shortcut &&\n        ((isMacOS() && event.metaKey) || (!isMacOS() && event.ctrlKey)) &&\n        (!isInput || isDescendantOfWrapper)\n      ) {\n        setOpen(!open);\n      }\n    },\n    [hitEscapeToClose, shortcut, open, setOpen],\n  );\n\n  const adjustForMobile = useCallback(() => {\n    const copilotKitWindow = windowRef.current;\n    const vv = window.visualViewport;\n    if (!copilotKitWindow || !vv) {\n      return;\n    }\n\n    if (window.innerWidth < 640 && open) {\n      copilotKitWindow.style.height = `${vv.height}px`;\n      copilotKitWindow.style.left = `${vv.offsetLeft}px`;\n      copilotKitWindow.style.top = `${vv.offsetTop}px`;\n\n      document.body.style.position = \"fixed\";\n      document.body.style.width = \"100%\";\n      document.body.style.height = `${window.innerHeight}px`;\n      document.body.style.overflow = \"hidden\";\n      document.body.style.touchAction = \"none\";\n\n      // Prevent scrolling on iOS\n      document.body.addEventListener(\"touchmove\", preventScroll, {\n        passive: false,\n      });\n    } else {\n      copilotKitWindow.style.height = \"\";\n      copilotKitWindow.style.left = \"\";\n      copilotKitWindow.style.top = \"\";\n      document.body.style.position = \"\";\n      document.body.style.height = \"\";\n      document.body.style.width = \"\";\n      document.body.style.overflow = \"\";\n      document.body.style.top = \"\";\n      document.body.style.touchAction = \"\";\n\n      document.body.removeEventListener(\"touchmove\", preventScroll);\n    }\n  }, [open]);\n\n  useEffect(() => {\n    document.addEventListener(\"mousedown\", handleClickOutside);\n    document.addEventListener(\"keydown\", handleKeyDown);\n    if (window.visualViewport) {\n      window.visualViewport.addEventListener(\"resize\", adjustForMobile);\n      adjustForMobile();\n    }\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n      if (window.visualViewport) {\n        window.visualViewport.removeEventListener(\"resize\", adjustForMobile);\n      }\n    };\n  }, [adjustForMobile, handleClickOutside, handleKeyDown]);\n\n  return (\n    <div className={`copilotKitWindow ${open ? \" open\" : \"\"}`} ref={windowRef}>\n      {children}\n    </div>\n  );\n};\n\nconst preventScroll = (event: TouchEvent): void => {\n  let targetElement = event.target as Element;\n\n  // Function to check if the target has the parent with a given class\n  const hasParentWithClass = (element: Element, className: string): boolean => {\n    while (element && element !== document.body) {\n      if (element.classList.contains(className)) {\n        return true;\n      }\n      element = element.parentElement!;\n    }\n    return false;\n  };\n\n  // Check if the target of the touch event is inside an element with the 'copilotKitMessages' class\n  if (!hasParentWithClass(targetElement, \"copilotKitMessages\")) {\n    event.preventDefault();\n  }\n};\n\nfunction isMacOS() {\n  return /Mac|iMac|Macintosh/i.test(navigator.userAgent);\n}\n","import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\nimport { ThumbsDownIcon, ThumbsUpIcon } from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n  /**\n   * The icon to use for the open chat button.\n   * @default <OpenIcon />\n   */\n  openIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button.\n   * @default <CloseIcon />\n   */\n  closeIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button in the header.\n   * @default <HeaderCloseIcon />\n   */\n  headerCloseIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the send button.\n   * @default <SendIcon />\n   */\n  sendIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the activity indicator.\n   * @default <ActivityIcon />\n   */\n  activityIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the spinner.\n   * @default <SpinnerIcon />\n   */\n  spinnerIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the stop button.\n   * @default <StopIcon />\n   */\n  stopIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the regenerate button.\n   * @default <RegenerateIcon />\n   */\n  regenerateIcon?: React.ReactNode;\n\n  /**\n   * The icons to use for push to talk.\n   * @default <PushToTalkIcon />\n   */\n\n  pushToTalkIcon?: React.ReactNode;\n\n  /**\n   * The icons to use for copy assistant response\n   * @default <CopyIcon />\n   */\n\n  copyIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for thumbs up/response approval.\n   * @default <ThumbsUpIcon />\n   */\n\n  thumbsUpIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for thumbs down/response rejection.\n   * @default <ThumbsDownIcon />\n   */\n\n  thumbsDownIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the upload button.\n   * @default <UploadIcon />\n   */\n  uploadIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n  /**\n   * The initial message(s) to display in the chat window.\n   */\n  initial?: string | string[];\n\n  /**\n   * The title to display in the header.\n   * @default \"CopilotKit\"\n   */\n  title?: string;\n\n  /**\n   * The placeholder to display in the input.\n   * @default \"Type a message...\"\n   */\n  placeholder?: string;\n\n  /**\n   * The message to display when an error occurs.\n   * @default \"❌ An error occurred. Please try again.\"\n   */\n  error?: string;\n\n  /**\n   * The label to display on the stop button.\n   * @default \"Stop generating\"\n   */\n  stopGenerating?: string;\n\n  /**\n   * The label to display on the regenerate button.\n   * @default \"Regenerate response\"\n   */\n  regenerateResponse?: string;\n\n  /**\n   * The label for the copy button.\n   * @default \"Copy to clipboard\"\n   */\n  copyToClipboard?: string;\n\n  /**\n   * The label for the thumbs up button.\n   * @default \"Thumbs up\"\n   */\n  thumbsUp?: string;\n\n  /**\n   * The label for the thumbs down button.\n   * @default \"Thumbs down\"\n   */\n  thumbsDown?: string;\n\n  /**\n   * The text to display when content is copied.\n   * @default \"Copied!\"\n   */\n  copied?: string;\n}\n\ninterface ChatContext {\n  labels: Required<CopilotChatLabels>;\n  icons: Required<CopilotChatIcons>;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nexport const ChatContext = React.createContext<ChatContext | undefined>(undefined);\n\nexport function useChatContext(): ChatContext {\n  const context = React.useContext(ChatContext);\n  if (context === undefined) {\n    throw new Error(\n      \"Context not found. Did you forget to wrap your app in a <ChatContextProvider> component?\",\n    );\n  }\n  return context;\n}\n\ninterface ChatContextProps {\n  // temperature?: number;\n  // instructions?: string;\n  // maxFeedback?: number;\n  labels?: CopilotChatLabels;\n  icons?: CopilotChatIcons;\n  children?: React.ReactNode;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nexport const ChatContextProvider = ({\n  // temperature,\n  // instructions,\n  // maxFeedback,\n  labels,\n  icons,\n  children,\n  open,\n  setOpen,\n}: ChatContextProps) => {\n  const memoizedLabels = useMemo(\n    () => ({\n      ...{\n        initial: \"\",\n        title: \"CopilotKit\",\n        placeholder: \"Type a message...\",\n        error: \"❌ An error occurred. Please try again.\",\n        stopGenerating: \"Stop generating\",\n        regenerateResponse: \"Regenerate response\",\n        copyToClipboard: \"Copy to clipboard\",\n        thumbsUp: \"Thumbs up\",\n        thumbsDown: \"Thumbs down\",\n        copied: \"Copied!\",\n      },\n      ...labels,\n    }),\n    [labels],\n  );\n\n  const memoizedIcons = useMemo(\n    () => ({\n      ...{\n        openIcon: DefaultIcons.OpenIcon,\n        closeIcon: DefaultIcons.CloseIcon,\n        headerCloseIcon: DefaultIcons.HeaderCloseIcon,\n        sendIcon: DefaultIcons.SendIcon,\n        activityIcon: DefaultIcons.ActivityIcon,\n        spinnerIcon: DefaultIcons.SpinnerIcon,\n        stopIcon: DefaultIcons.StopIcon,\n        regenerateIcon: DefaultIcons.RegenerateIcon,\n        pushToTalkIcon: DefaultIcons.MicrophoneIcon,\n        copyIcon: DefaultIcons.CopyIcon,\n        thumbsUpIcon: DefaultIcons.ThumbsUpIcon,\n        thumbsDownIcon: DefaultIcons.ThumbsDownIcon,\n        uploadIcon: DefaultIcons.UploadIcon,\n      },\n      ...icons,\n    }),\n    [icons],\n  );\n\n  const context = useMemo(\n    () => ({\n      labels: memoizedLabels,\n      icons: memoizedIcons,\n      open,\n      setOpen,\n    }),\n    [memoizedLabels, memoizedIcons, open, setOpen],\n  );\n\n  return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n"],"mappings":"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","names":["import_react","React","import_jsx_runtime","React"]}

package/dist/components/chat/Window.mjs

@@ -1,9 +1,8 @@
 import {
   Window
-} from "../../chunk-Q2NFQTCQ.mjs";
+} from "../../chunk-TIDV74OE.mjs";
 import "../../chunk-IEMQ2SQW.mjs";
 import "../../chunk-XWG3L6QC.mjs";
-import "../../chunk-JGMFJZMG.mjs";
 import "../../chunk-MRXNTQOX.mjs";
 export {
   Window