@copilotkit/react-ui 1.1.2 → 1.1.3-feat-runtime-remote-actions.0

package/dist/chunk-I4QG2ZZU.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/dev-console/console.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCopilotContext } from \"@copilotkit/react-core\";\nimport {\n  getPublishedCopilotKitVersion,\n  logActions,\n  logMessages,\n  logReadables,\n  shouldShowDevConsole,\n} from \"./utils\";\nimport { useEffect, useRef, useState } from \"react\";\nimport {\n  CheckIcon,\n  ChevronDownIcon,\n  CopilotKitIcon,\n  ExclamationMarkIcon,\n  ExclamationMarkTriangleIcon,\n} from \"./icons\";\nimport { Menu, MenuButton, MenuItem, MenuItems } from \"@headlessui/react\";\nimport { COPILOTKIT_VERSION } from \"@copilotkit/shared\";\nimport { SmallSpinnerIcon } from \"../chat/Icons\";\n\ntype VersionStatus = \"unknown\" | \"checking\" | \"latest\" | \"update-available\" | \"outdated\";\n\nexport function CopilotDevConsole() {\n  const currentVersion = COPILOTKIT_VERSION;\n  const context = useCopilotContext();\n\n  // to prevent hydration errors, ensure that the component renders the same content\n  // server-side as it does during the initial client-side render to prevent a hydration\n  // mismatch\n  // see: https://nextjs.org/docs/messages/react-hydration-error#solution-1-using-useeffect-to-run-on-the-client-only\n\n  const [showDevConsole, setShowDevConsole] = useState(false);\n\n  useEffect(() => {\n    setShowDevConsole(shouldShowDevConsole(context.showDevConsole));\n  }, [context.showDevConsole]);\n\n  const dontRunTwiceInDevMode = useRef(false);\n  const [versionStatus, setVersionStatus] = useState<VersionStatus>(\"unknown\");\n  const [latestVersion, setLatestVersion] = useState<string>(\"\");\n  const consoleRef = useRef<HTMLDivElement>(null);\n  const [debugButtonMode, setDebugButtonMode] = useState<\"full\" | \"compact\">(\"full\");\n\n  const checkForUpdates = (force: boolean = false) => {\n    setVersionStatus(\"checking\");\n\n    getPublishedCopilotKitVersion(currentVersion, force)\n      .then((v) => {\n        setLatestVersion(v.latest);\n        let versionOk = false;\n\n        // match exact version or a version with a letter (e.g. 1.0.0-alpha.1)\n        if (v.current === v.latest) {\n          versionOk = true;\n        } else if (/[a-zA-Z]/.test(v.current)) {\n          versionOk = true;\n        }\n\n        if (versionOk) {\n          setVersionStatus(\"latest\");\n        } else if (v.severity !== \"low\") {\n          setVersionStatus(\"outdated\");\n        } else {\n          setVersionStatus(\"update-available\");\n        }\n      })\n      .catch((e) => {\n        console.error(e);\n        setVersionStatus(\"unknown\");\n      });\n  };\n\n  useEffect(() => {\n    if (dontRunTwiceInDevMode.current === true) {\n      return;\n    }\n    dontRunTwiceInDevMode.current = true;\n\n    checkForUpdates();\n  }, []);\n\n  useEffect(() => {\n    const handleResize = (entries: ResizeObserverEntry[]) => {\n      for (let entry of entries) {\n        if (entry.target === consoleRef.current) {\n          const width = entry.contentRect.width;\n          if (width < 400) {\n            setDebugButtonMode(\"compact\");\n          } else {\n            setDebugButtonMode(\"full\");\n          }\n        }\n      }\n    };\n\n    const observer = new ResizeObserver(handleResize);\n    if (consoleRef.current) {\n      observer.observe(consoleRef.current);\n\n      const initialWidth = consoleRef.current.getBoundingClientRect().width;\n      if (initialWidth < 400) {\n        setDebugButtonMode(\"compact\");\n      } else {\n        setDebugButtonMode(\"full\");\n      }\n    }\n\n    return () => {\n      if (consoleRef.current) {\n        observer.unobserve(consoleRef.current);\n      }\n    };\n  }, [consoleRef.current]);\n\n  if (!showDevConsole) {\n    return null;\n  }\n  return (\n    <div\n      ref={consoleRef}\n      className={\n        \"copilotKitDevConsole \" +\n        (versionStatus === \"update-available\" ? \"copilotKitDevConsoleUpgrade\" : \"\") +\n        (versionStatus === \"outdated\" ? \"copilotKitDevConsoleWarnOutdated\" : \"\")\n      }\n    >\n      <div className=\"copilotKitDevConsoleLogo\">\n        <a href=\"https://copilotkit.ai\" target=\"_blank\">\n          {CopilotKitIcon}\n        </a>\n      </div>\n      <VersionInfo\n        showDevConsole={context.showDevConsole}\n        versionStatus={versionStatus}\n        currentVersion={currentVersion}\n        latestVersion={latestVersion}\n      />\n\n      <DebugMenuButton\n        setShowDevConsole={setShowDevConsole}\n        checkForUpdates={checkForUpdates}\n        mode={debugButtonMode}\n      />\n    </div>\n  );\n}\n\nfunction VersionInfo({\n  showDevConsole,\n  versionStatus,\n  currentVersion,\n  latestVersion,\n}: {\n  showDevConsole: boolean | \"auto\";\n  versionStatus: VersionStatus;\n  currentVersion: string;\n  latestVersion: string;\n}) {\n  const [copyStatus, setCopyStatus] = useState<string>(\"\");\n\n  let versionLabel = \"\";\n  let versionIcon: any = \"\";\n  let currentVersionLabel = currentVersion;\n\n  if (versionStatus === \"latest\") {\n    versionLabel = \"latest\";\n    versionIcon = CheckIcon;\n  } else if (versionStatus === \"checking\") {\n    versionLabel = \"checking\";\n    versionIcon = SmallSpinnerIcon;\n  } else if (versionStatus === \"update-available\") {\n    versionLabel = \"update available\";\n    versionIcon = ExclamationMarkIcon;\n    currentVersionLabel = `${currentVersion} → ${latestVersion}`;\n  } else if (versionStatus === \"outdated\") {\n    versionLabel = \"outdated\";\n    versionIcon = ExclamationMarkTriangleIcon;\n    currentVersionLabel = `${currentVersion} → ${latestVersion}`;\n  }\n\n  let asideLabel = \"\";\n  if (showDevConsole === \"auto\") {\n    asideLabel = \"(localhost only)\";\n  } else if (showDevConsole === true) {\n    asideLabel = \"(always on)\";\n  }\n\n  const installCommand = [\n    `npm install`,\n    `@copilotkit/react-core@${latestVersion}`,\n    `@copilotkit/react-ui@${latestVersion}`,\n    `@copilotkit/react-textarea@${latestVersion}`,\n  ].join(\" \");\n\n  const handleCopyClick = () => {\n    navigator.clipboard.writeText(installCommand.trim()).then(() => {\n      setCopyStatus(\"Command copied to clipboard!\");\n      setTimeout(() => setCopyStatus(\"\"), 1000);\n    });\n  };\n\n  return (\n    <div className=\"copilotKitVersionInfo\">\n      <header>\n        COPILOTKIT DEV CONSOLE{showDevConsole === \"auto\" && <aside>{asideLabel}</aside>}\n      </header>\n      <section>\n        Version: {versionLabel} ({currentVersionLabel}) {versionIcon}\n      </section>\n      {(versionStatus === \"update-available\" || versionStatus === \"outdated\") && (\n        <footer>\n          <button onClick={handleCopyClick}>{copyStatus || installCommand}</button>\n        </footer>\n      )}\n    </div>\n  );\n}\nexport default function DebugMenuButton({\n  setShowDevConsole,\n  checkForUpdates,\n  mode,\n}: {\n  setShowDevConsole: (show: boolean) => void;\n  checkForUpdates: (force: boolean) => void;\n  mode: \"full\" | \"compact\";\n}) {\n  const context = useCopilotContext();\n\n  return (\n    <div className=\"bg-black fixed top-24 w-52 text-right\">\n      <Menu>\n        <MenuButton className={`copilotKitDebugMenuButton ${mode === \"compact\" ? \"compact\" : \"\"}`}>\n          {mode == \"compact\" ? \"Debug\" : <>Debug {ChevronDownIcon}</>}\n        </MenuButton>\n\n        <MenuItems\n          transition\n          anchor=\"bottom end\"\n          className=\"copilotKitDebugMenu\"\n          style={{ zIndex: 40 }}\n        >\n          <MenuItem>\n            <button className=\"copilotKitDebugMenuItem\" onClick={() => logReadables(context)}>\n              Log Readables\n            </button>\n          </MenuItem>\n          <MenuItem>\n            <button className=\"copilotKitDebugMenuItem\" onClick={() => logActions(context)}>\n              Log Actions\n            </button>\n          </MenuItem>\n          <MenuItem>\n            <button className=\"copilotKitDebugMenuItem\" onClick={() => logMessages(context)}>\n              Log Messages\n            </button>\n          </MenuItem>\n          <MenuItem>\n            <button className=\"copilotKitDebugMenuItem\" onClick={() => checkForUpdates(true)}>\n              Check for Updates\n            </button>\n          </MenuItem>\n          <hr />\n          <MenuItem>\n            <button className=\"copilotKitDebugMenuItem\" onClick={() => setShowDevConsole(false)}>\n              Hide Dev Console\n            </button>\n          </MenuItem>\n        </MenuItems>\n      </Menu>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-KSCXPA74.mjs → chunk-WCPLXRZX.mjs}

@@ -103,4 +103,4 @@ export {
   Suggestion,
   reloadSuggestions
 };
-//# sourceMappingURL=chunk-KSCXPA74.mjs.map
+//# sourceMappingURL=chunk-WCPLXRZX.mjs.map

package/dist/chunk-WCPLXRZX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Suggestion.tsx"],"sourcesContent":["import {\n  CopilotContextParams,\n  extract,\n  CopilotChatSuggestionConfiguration,\n  useCopilotContext,\n} from \"@copilotkit/react-core\";\nimport { SuggestionsProps } from \"./props\";\nimport { SmallSpinnerIcon } from \"./Icons\";\nimport { CopilotChatSuggestion } from \"../../types/suggestions\";\nimport { actionParametersToJsonSchema } from \"@copilotkit/shared\";\nimport { CopilotRequestType } from \"@copilotkit/runtime-client-gql\";\n\nexport function Suggestion({ title, message, onClick, partial, className }: SuggestionsProps) {\n  return (\n    <button\n      disabled={partial}\n      onClick={(e) => {\n        e.preventDefault();\n        onClick(message);\n      }}\n      className={className || \"suggestion\"}\n    >\n      {partial && SmallSpinnerIcon}\n      <span>{title}</span>\n    </button>\n  );\n}\n\nexport const reloadSuggestions = async (\n  context: CopilotContextParams,\n  chatSuggestionConfiguration: { [key: string]: CopilotChatSuggestionConfiguration },\n  setCurrentSuggestions: (suggestions: { title: string; message: string }[]) => void,\n  abortControllerRef: React.MutableRefObject<AbortController | null>,\n) => {\n  const abortController = abortControllerRef.current;\n\n  const tools = JSON.stringify(\n    Object.values(context.actions).map((action) => ({\n      name: action.name,\n      description: action.description,\n      jsonSchema: JSON.stringify(actionParametersToJsonSchema(action.parameters)),\n    })),\n  );\n\n  const allSuggestions: CopilotChatSuggestion[] = [];\n\n  for (const config of Object.values(chatSuggestionConfiguration)) {\n    try {\n      const numOfSuggestionsInstructions =\n        config.minSuggestions === 0\n          ? `Produce up to ${config.maxSuggestions} suggestions. ` +\n            `If there are no highly relevant suggestions you can think of, provide an empty array.`\n          : `Produce between ${config.minSuggestions} and ${config.maxSuggestions} suggestions.`;\n\n      const result = await extract({\n        context,\n        instructions:\n          \"Suggest what the user could say next. Provide clear, highly relevant suggestions. Do not literally suggest function calls. \" +\n          config.instructions +\n          \"\\n\\n\" +\n          numOfSuggestionsInstructions,\n        data: \"Available tools: \" + tools + \"\\n\\n\",\n        requestType: CopilotRequestType.Task,\n        parameters: [\n          {\n            name: \"suggestions\",\n            type: \"object[]\",\n            attributes: [\n              {\n                name: \"title\",\n                description:\n                  \"The title of the suggestion. This is shown as a button and should be short.\",\n                type: \"string\",\n              },\n              {\n                name: \"message\",\n                description:\n                  \"The message to send when the suggestion is clicked. This should be a clear, complete sentence and will be sent as an instruction to the AI.\",\n                type: \"string\",\n              },\n            ],\n          },\n        ],\n        include: {\n          messages: true,\n          readable: true,\n        },\n        abortSignal: abortController?.signal,\n        stream: ({ status, args }) => {\n          const suggestions = args.suggestions || [];\n          const newSuggestions: CopilotChatSuggestion[] = [];\n          for (let i = 0; i < suggestions.length; i++) {\n            // if GPT provides too many suggestions, limit the number of suggestions\n            if (config.maxSuggestions !== undefined && i >= config.maxSuggestions) {\n              break;\n            }\n            const { title, message } = suggestions[i];\n\n            // If this is the last suggestion and the status is not complete, mark it as partial\n            const partial = i == suggestions.length - 1 && status !== \"complete\";\n\n            newSuggestions.push({\n              title,\n              message,\n              partial,\n              className: config.className,\n            });\n          }\n          setCurrentSuggestions([...allSuggestions, ...newSuggestions]);\n        },\n      });\n      allSuggestions.push(...result.suggestions);\n    } catch (error) {\n      console.error(\"Error loading suggestions\", error);\n    }\n  }\n\n  if (abortControllerRef.current === abortController) {\n    abortControllerRef.current = null;\n  }\n};\n"],"mappings":";;;;;;;;AAAA;AAAA,EAEE;AAAA,OAGK;AAIP,SAAS,oCAAoC;AAC7C,SAAS,0BAA0B;AAI/B,SASE,KATF;AAFG,SAAS,WAAW,EAAE,OAAO,SAAS,SAAS,SAAS,UAAU,GAAqB;AAC5F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,SAAS,CAAC,MAAM;AACd,UAAE,eAAe;AACjB,gBAAQ,OAAO;AAAA,MACjB;AAAA,MACA,WAAW,aAAa;AAAA,MAEvB;AAAA,mBAAW;AAAA,QACZ,oBAAC,UAAM,iBAAM;AAAA;AAAA;AAAA,EACf;AAEJ;AAEO,IAAM,oBAAoB,CAC/B,SACA,6BACA,uBACA,uBACG;AACH,QAAM,kBAAkB,mBAAmB;AAE3C,QAAM,QAAQ,KAAK;AAAA,IACjB,OAAO,OAAO,QAAQ,OAAO,EAAE,IAAI,CAAC,YAAY;AAAA,MAC9C,MAAM,OAAO;AAAA,MACb,aAAa,OAAO;AAAA,MACpB,YAAY,KAAK,UAAU,6BAA6B,OAAO,UAAU,CAAC;AAAA,IAC5E,EAAE;AAAA,EACJ;AAEA,QAAM,iBAA0C,CAAC;AAEjD,aAAW,UAAU,OAAO,OAAO,2BAA2B,GAAG;AAC/D,QAAI;AACF,YAAM,+BACJ,OAAO,mBAAmB,IACtB,iBAAiB,OAAO,sHAExB,mBAAmB,OAAO,sBAAsB,OAAO;AAE7D,YAAM,SAAS,MAAM,QAAQ;AAAA,QAC3B;AAAA,QACA,cACE,gIACA,OAAO,eACP,SACA;AAAA,QACF,MAAM,sBAAsB,QAAQ;AAAA,QACpC,aAAa,mBAAmB;AAAA,QAChC,YAAY;AAAA,UACV;AAAA,YACE,MAAM;AAAA,YACN,MAAM;AAAA,YACN,YAAY;AAAA,cACV;AAAA,gBACE,MAAM;AAAA,gBACN,aACE;AAAA,gBACF,MAAM;AAAA,cACR;AAAA,cACA;AAAA,gBACE,MAAM;AAAA,gBACN,aACE;AAAA,gBACF,MAAM;AAAA,cACR;AAAA,YACF;AAAA,UACF;AAAA,QACF;AAAA,QACA,SAAS;AAAA,UACP,UAAU;AAAA,UACV,UAAU;AAAA,QACZ;AAAA,QACA,aAAa,mDAAiB;AAAA,QAC9B,QAAQ,CAAC,EAAE,QAAQ,KAAK,MAAM;AAC5B,gBAAM,cAAc,KAAK,eAAe,CAAC;AACzC,gBAAM,iBAA0C,CAAC;AACjD,mBAAS,IAAI,GAAG,IAAI,YAAY,QAAQ,KAAK;AAE3C,gBAAI,OAAO,mBAAmB,UAAa,KAAK,OAAO,gBAAgB;AACrE;AAAA,YACF;AACA,kBAAM,EAAE,OAAO,QAAQ,IAAI,YAAY,CAAC;AAGxC,kBAAM,UAAU,KAAK,YAAY,SAAS,KAAK,WAAW;AAE1D,2BAAe,KAAK;AAAA,cAClB;AAAA,cACA;AAAA,cACA;AAAA,cACA,WAAW,OAAO;AAAA,YACpB,CAAC;AAAA,UACH;AACA,gCAAsB,CAAC,GAAG,gBAAgB,GAAG,cAAc,CAAC;AAAA,QAC9D;AAAA,MACF,CAAC;AACD,qBAAe,KAAK,GAAG,OAAO,WAAW;AAAA,IAC3C,SAAS,OAAP;AACA,cAAQ,MAAM,6BAA6B,KAAK;AAAA,IAClD;AAAA,EACF;AAEA,MAAI,mBAAmB,YAAY,iBAAiB;AAClD,uBAAmB,UAAU;AAAA,EAC/B;AACF;","names":[]}

package/dist/{chunk-UC3Y7MWX.mjs → chunk-YOH25I6N.mjs}

@@ -4,16 +4,16 @@ import {
 
 // src/components/chat/Button.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
-var Button = ({ open, setOpen }) => {
-  const context = useChatContext();
+var Button = ({}) => {
+  const { open, setOpen, icons } = useChatContext();
   return /* @__PURE__ */ jsx("div", { onClick: () => setOpen(!open), children: /* @__PURE__ */ jsxs(
     "button",
     {
       className: `copilotKitButton ${open ? "open" : ""}`,
       "aria-label": open ? "Close Chat" : "Open Chat",
       children: [
-        /* @__PURE__ */ jsx("div", { className: "copilotKitButtonIcon copilotKitButtonIconOpen", children: context.icons.openIcon }),
-        /* @__PURE__ */ jsx("div", { className: "copilotKitButtonIcon copilotKitButtonIconClose", children: context.icons.closeIcon })
+        /* @__PURE__ */ jsx("div", { className: "copilotKitButtonIcon copilotKitButtonIconOpen", children: icons.openIcon }),
+        /* @__PURE__ */ jsx("div", { className: "copilotKitButtonIcon copilotKitButtonIconClose", children: icons.closeIcon })
       ]
     }
   ) });
@@ -22,4 +22,4 @@ var Button = ({ open, setOpen }) => {
 export {
   Button
 };
-//# sourceMappingURL=chunk-UC3Y7MWX.mjs.map
+//# sourceMappingURL=chunk-YOH25I6N.mjs.map

package/dist/chunk-YOH25I6N.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/Button.tsx"],"sourcesContent":["import { ButtonProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\n\nexport const Button = ({}: ButtonProps) => {\n  const { open, setOpen, icons } = useChatContext();\n\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\">{icons.openIcon}</div>\n        <div className=\"copilotKitButtonIcon copilotKitButtonIconClose\">{icons.closeIcon}</div>\n      </button>\n    </div>\n  );\n};\n"],"mappings":";;;;;AAQM,SAIE,KAJF;AALC,IAAM,SAAS,CAAC,CAAC,MAAmB;AACzC,QAAM,EAAE,MAAM,SAAS,MAAM,IAAI,eAAe;AAEhD,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,iDAAiD,gBAAM,UAAS;AAAA,QAC/E,oBAAC,SAAI,WAAU,kDAAkD,gBAAM,WAAU;AAAA;AAAA;AAAA,EACnF,GACF;AAEJ;","names":[]}

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

@@ -1,6 +1,7 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ButtonProps } from './props.js';
 import '@copilotkit/runtime-client-gql';
 
-declare const Button: ({ open, setOpen }: ButtonProps) => JSX.Element;
+declare const Button: ({}: ButtonProps) => react_jsx_runtime.JSX.Element;
 
 export { Button };

package/dist/components/chat/Button.js

@@ -50,16 +50,16 @@ function useChatContext() {
 
 // src/components/chat/Button.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
-var Button = ({ open, setOpen }) => {
-  const context = useChatContext();
+var Button = ({}) => {
+  const { open, setOpen, icons } = useChatContext();
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { onClick: () => setOpen(!open), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
     "button",
     {
       className: `copilotKitButton ${open ? "open" : ""}`,
       "aria-label": open ? "Close Chat" : "Open Chat",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconOpen", children: context.icons.openIcon }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconClose", children: context.icons.closeIcon })
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconOpen", children: icons.openIcon }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconClose", children: icons.closeIcon })
       ]
     }
   ) });

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/chat/Button.tsx","../../../src/components/chat/ChatContext.tsx"],"sourcesContent":["import { ButtonProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\n\nexport const Button = ({ open, setOpen }: ButtonProps) => {\n  const context = useChatContext();\n\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","import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n  /**\n   * The icon to use for the open chat button.\n   * @default <OpenIcon />\n   */\n  openIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button.\n   * @default <CloseIcon />\n   */\n  closeIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button in the header.\n   * @default <HeaderCloseIcon />\n   */\n  headerCloseIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the send button.\n   * @default <SendIcon />\n   */\n  sendIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the activity indicator.\n   * @default <ActivityIcon />\n   */\n  activityIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the spinner.\n   * @default <SpinnerIcon />\n   */\n  spinnerIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the stop button.\n   * @default <StopIcon />\n   */\n  stopIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the regenerate button.\n   * @default <RegenerateIcon />\n   */\n  regenerateIcon?: React.ReactNode;\n\n  /**\n   * The icons to use for push to talk.\n   * @default <PushToTalkIcon />\n   */\n\n  pushToTalkIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n  /**\n   * The initial message(s) to display in the chat window.\n   */\n  initial?: string | string[];\n\n  /**\n   * The title to display in the header.\n   * @default \"CopilotKit\"\n   */\n  title?: string;\n\n  /**\n   * The placeholder to display in the input.\n   * @default \"Type a message...\"\n   */\n  placeholder?: string;\n\n  /**\n   * The message to display when an error occurs.\n   * @default \"❌ An error occurred. Please try again.\"\n   */\n  error?: string;\n\n  /**\n   * The label to display on the stop button.\n   * @default \"Stop generating\"\n   */\n  stopGenerating?: string;\n\n  /**\n   * The label to display on the regenerate button.\n   * @default \"Regenerate response\"\n   */\n  regenerateResponse?: string;\n}\n\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 context = {\n    labels: {\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      },\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        pushToTalkIcon: DefaultIcons.PushToTalkIcon,\n      },\n      ...icons,\n    },\n    open,\n    setOpen,\n  };\n  return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAyC;AA6KhC;AA/DF,IAAM,cAAc,aAAAA,QAAM,cAAuC,MAAS;AAE1E,SAAS,iBAA8B;AAC5C,QAAM,UAAU,aAAAA,QAAM,WAAW,WAAW;AAC5C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;;;ADhHM,IAAAC,sBAAA;AALC,IAAM,SAAS,CAAC,EAAE,MAAM,QAAQ,MAAmB;AACxD,QAAM,UAAU,eAAe;AAE/B,SACE,6CAAC,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,qDAAC,SAAI,WAAU,iDACZ,kBAAQ,MAAM,UACjB;AAAA,QACA,6CAAC,SAAI,WAAU,kDACZ,kBAAQ,MAAM,WACjB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;","names":["React","import_jsx_runtime"]}
+{"version":3,"sources":["../../../src/components/chat/Button.tsx","../../../src/components/chat/ChatContext.tsx"],"sourcesContent":["import { ButtonProps } from \"./props\";\nimport { useChatContext } from \"./ChatContext\";\n\nexport const Button = ({}: ButtonProps) => {\n  const { open, setOpen, icons } = useChatContext();\n\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\">{icons.openIcon}</div>\n        <div className=\"copilotKitButtonIcon copilotKitButtonIconClose\">{icons.closeIcon}</div>\n      </button>\n    </div>\n  );\n};\n","import React, { useMemo, useState } from \"react\";\nimport * as DefaultIcons from \"./Icons\";\n\n/**\n * Icons for CopilotChat component.\n */\nexport interface CopilotChatIcons {\n  /**\n   * The icon to use for the open chat button.\n   * @default <OpenIcon />\n   */\n  openIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button.\n   * @default <CloseIcon />\n   */\n  closeIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the close chat button in the header.\n   * @default <HeaderCloseIcon />\n   */\n  headerCloseIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the send button.\n   * @default <SendIcon />\n   */\n  sendIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the activity indicator.\n   * @default <ActivityIcon />\n   */\n  activityIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the spinner.\n   * @default <SpinnerIcon />\n   */\n  spinnerIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the stop button.\n   * @default <StopIcon />\n   */\n  stopIcon?: React.ReactNode;\n\n  /**\n   * The icon to use for the regenerate button.\n   * @default <RegenerateIcon />\n   */\n  regenerateIcon?: React.ReactNode;\n\n  /**\n   * The icons to use for push to talk.\n   * @default <PushToTalkIcon />\n   */\n\n  pushToTalkIcon?: React.ReactNode;\n}\n\n/**\n * Labels for CopilotChat component.\n */\nexport interface CopilotChatLabels {\n  /**\n   * The initial message(s) to display in the chat window.\n   */\n  initial?: string | string[];\n\n  /**\n   * The title to display in the header.\n   * @default \"CopilotKit\"\n   */\n  title?: string;\n\n  /**\n   * The placeholder to display in the input.\n   * @default \"Type a message...\"\n   */\n  placeholder?: string;\n\n  /**\n   * The message to display when an error occurs.\n   * @default \"❌ An error occurred. Please try again.\"\n   */\n  error?: string;\n\n  /**\n   * The label to display on the stop button.\n   * @default \"Stop generating\"\n   */\n  stopGenerating?: string;\n\n  /**\n   * The label to display on the regenerate button.\n   * @default \"Regenerate response\"\n   */\n  regenerateResponse?: string;\n}\n\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 context = {\n    labels: {\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      },\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        pushToTalkIcon: DefaultIcons.PushToTalkIcon,\n      },\n      ...icons,\n    },\n    open,\n    setOpen,\n  };\n  return <ChatContext.Provider value={context}>{children}</ChatContext.Provider>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAyC;AA6KhC;AA/DF,IAAM,cAAc,aAAAA,QAAM,cAAuC,MAAS;AAE1E,SAAS,iBAA8B;AAC5C,QAAM,UAAU,aAAAA,QAAM,WAAW,WAAW;AAC5C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;;;ADhHM,IAAAC,sBAAA;AALC,IAAM,SAAS,CAAC,CAAC,MAAmB;AACzC,QAAM,EAAE,MAAM,SAAS,MAAM,IAAI,eAAe;AAEhD,SACE,6CAAC,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,qDAAC,SAAI,WAAU,iDAAiD,gBAAM,UAAS;AAAA,QAC/E,6CAAC,SAAI,WAAU,kDAAkD,gBAAM,WAAU;AAAA;AAAA;AAAA,EACnF,GACF;AAEJ;","names":["React","import_jsx_runtime"]}

package/dist/components/chat/Button.mjs

@@ -1,6 +1,6 @@
 import {
   Button
-} from "../../chunk-UC3Y7MWX.mjs";
+} from "../../chunk-YOH25I6N.mjs";
 import "../../chunk-BJPGMY3I.mjs";
 import "../../chunk-FZC7X5PK.mjs";
 import "../../chunk-MRXNTQOX.mjs";

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

@@ -1,3 +1,4 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { CopilotChatIcons, CopilotChatLabels } from './ChatContext.js';
 import React__default from 'react';
 import { SystemMessageFunction } from '@copilotkit/react-core';
@@ -5,52 +6,6 @@ import { CopilotChatSuggestion } from '../../types/suggestions.js';
 import { Message } from '@copilotkit/runtime-client-gql';
 import { MessagesProps, InputProps, ResponseButtonProps } from './props.js';
 
-/**
- * <br/>
- * <img src="/images/CopilotChat.gif" width="500" />
- *
- * A chatbot panel component for the CopilotKit framework. The component allows for a high degree
- * of customization through various props and custom CSS.
- *
- * ## Install Dependencies
- *
- * This component is part of the [@copilotkit/react-ui](https://npmjs.com/package/@copilotkit/react-ui) package.
- *
- * ```shell npm2yarn \"@copilotkit/react-ui"\
- * npm install @copilotkit/react-core @copilotkit/react-ui
- * ```
- *
- * ## Usage
- *
- * ```tsx
- * import { CopilotChat } from "@copilotkit/react-ui";
- *
- * <CopilotChat
- *   labels={{
- *     title: "Your Assistant",
- *     initial: "Hi! 👋 How can I assist you today?",
- *   }}
- * />
- * ```
- *
- * ### Look & Feel
- *
- * By default, CopilotKit components do not have any styles. You can import CopilotKit's stylesheet at the root of your project:
- * ```tsx fileName="YourRootComponent.tsx" {2}
- * ...
- * import "@copilotkit/react-ui/styles.css";
- *
- * export function YourRootComponent() {
- *   return (
- *     <CopilotKit>
- *       ...
- *     </CopilotKit>
- *   );
- * }
- * ```
- * For more information about how to customize the styles, check out the [Customize Look & Feel](/concepts/customize-look-and-feel) guide.
- */
-
 /**
  * Props for CopilotChat component.
  */
@@ -113,14 +68,14 @@ interface CopilotChatProps {
      */
     children?: React__default.ReactNode;
 }
-declare function CopilotChat({ instructions, onSubmitMessage, makeSystemMessage, showResponseButton, onInProgress, Messages, Input, ResponseButton, className, icons, labels, }: CopilotChatProps): JSX.Element;
+declare function CopilotChat({ instructions, onSubmitMessage, makeSystemMessage, showResponseButton, onInProgress, Messages, Input, ResponseButton, className, icons, labels, }: CopilotChatProps): react_jsx_runtime.JSX.Element;
 declare function WrappedCopilotChat({ children, icons, labels, className, }: {
     children: React__default.ReactNode;
     icons?: CopilotChatIcons;
     labels?: CopilotChatLabels;
     className?: string;
-}): JSX.Element;
-declare const useCopilotChatLogic: (makeSystemMessage?: SystemMessageFunction, onInProgress?: ((isLoading: boolean) => void) | undefined, onSubmitMessage?: ((messageContent: string) => void) | undefined) => {
+}): react_jsx_runtime.JSX.Element;
+declare const useCopilotChatLogic: (makeSystemMessage?: SystemMessageFunction, onInProgress?: (isLoading: boolean) => void, onSubmitMessage?: (messageContent: string) => Promise<void> | void) => {
     visibleMessages: Message[];
     isLoading: boolean;
     currentSuggestions: CopilotChatSuggestion[];

package/dist/components/chat/Chat.js

@@ -890,8 +890,8 @@ var Messages = ({ messages, inProgress, children }) => {
       } else if (message instanceof import_runtime_client_gql.TextMessage && message.role == "assistant") {
         return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: isCurrentMessage && inProgress && !message.content ? context.icons.spinnerIcon : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Markdown, { content: message.content }) }, index);
       } else if (message instanceof import_runtime_client_gql.ActionExecutionMessage) {
-        if (chatComponentsCache.current !== null && chatComponentsCache.current[message.name]) {
-          const render = chatComponentsCache.current[message.name];
+        if (chatComponentsCache.current !== null && chatComponentsCache.current.actions[message.name]) {
+          const render = chatComponentsCache.current.actions[message.name];
           if (typeof render === "string") {
             if (isCurrentMessage && inProgress) {
               return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
@@ -933,6 +933,50 @@ var Messages = ({ messages, inProgress, children }) => {
         } else {
           return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: context.icons.spinnerIcon }, index);
         }
+      } else if (message instanceof import_runtime_client_gql.AgentStateMessage) {
+        let render;
+        if (chatComponentsCache.current !== null) {
+          render = chatComponentsCache.current.coagentActions[`${message.agentName}-${message.nodeName}`] || chatComponentsCache.current.coagentActions[`${message.agentName}-global`];
+        }
+        if (render) {
+          if (typeof render === "string") {
+            if (isCurrentMessage && inProgress) {
+              return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
+                context.icons.spinnerIcon,
+                " ",
+                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "inProgressLabel", children: render })
+              ] }, index);
+            } else {
+              return null;
+            }
+          } else {
+            const state = message.state;
+            let status = message.active ? "inProgress" : "complete";
+            const toRender = render({
+              status,
+              state,
+              nodeName: message.nodeName
+            });
+            if (!toRender && status === "complete") {
+              return null;
+            }
+            if (typeof toRender === "string") {
+              return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
+                isCurrentMessage && inProgress && context.icons.spinnerIcon,
+                " ",
+                toRender
+              ] }, index);
+            } else {
+              return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "copilotKitCustomAssistantMessage", children: toRender }, index);
+            }
+          }
+        } else if (!inProgress || !isCurrentMessage) {
+          return null;
+        } else {
+          return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: context.icons.spinnerIcon }, index);
+        }
+      } else if (message instanceof import_runtime_client_gql.ResultMessage && inProgress && isCurrentMessage) {
+        return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: context.icons.spinnerIcon }, index);
       }
     }),
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("footer", { ref: messagesEndRef, children })
@@ -1283,11 +1327,13 @@ var reloadSuggestions = (context, chatSuggestionConfiguration, setCurrentSuggest
 // src/components/chat/Chat.tsx
 var import_react10 = __toESM(require("react"));
 var import_react_core7 = require("@copilotkit/react-core");
-var import_runtime_client_gql4 = require("@copilotkit/runtime-client-gql");
+var import_runtime_client_gql6 = require("@copilotkit/runtime-client-gql");
 var import_shared3 = require("@copilotkit/shared");
 
 // src/components/dev-console/utils.ts
 var import_react_core5 = require("@copilotkit/react-core");
+var import_runtime_client_gql4 = require("@copilotkit/runtime-client-gql");
+var import_runtime_client_gql5 = require("@copilotkit/runtime-client-gql");
 function shouldShowDevConsole(showDevConsole) {
   if (typeof showDevConsole === "boolean") {
     return showDevConsole;
@@ -1348,6 +1394,7 @@ function getPublishedCopilotKitVersion(current, forceCheck = false) {
   });
 }
 function logReadables(context) {
+  console.log("%cCurrent Readables:", "font-size: 16px; font-weight: bold;");
   const readables = context.getContextString([], import_react_core5.defaultCopilotContextCategories).trim();
   if (readables.length === 0) {
     console.log("No readables found");
@@ -1356,6 +1403,7 @@ function logReadables(context) {
   console.log(readables);
 }
 function logActions(context) {
+  console.log("%cCurrent Actions:", "font-size: 16px; font-weight: bold;");
   if (Object.values(context.actions).length === 0) {
     console.log("No actions found");
     return;
@@ -1368,6 +1416,53 @@ function logActions(context) {
     console.groupEnd();
   }
 }
+function logMessages(context) {
+  console.log("%cCurrent Messages:", "font-size: 16px; font-weight: bold;");
+  if (context.messages.length === 0) {
+    console.log("No messages found");
+    return;
+  }
+  const tableData = context.messages.map((message) => {
+    if (message instanceof import_runtime_client_gql4.TextMessage) {
+      return {
+        id: message.id,
+        type: "TextMessage",
+        role: message.role,
+        name: void 0,
+        scope: void 0,
+        content: message.content
+      };
+    } else if (message instanceof import_runtime_client_gql4.ActionExecutionMessage) {
+      return {
+        id: message.id,
+        type: "ActionExecutionMessage",
+        role: void 0,
+        name: message.name,
+        scope: message.scope,
+        content: message.arguments
+      };
+    } else if (message instanceof import_runtime_client_gql4.ResultMessage) {
+      return {
+        id: message.id,
+        type: "ResultMessage",
+        role: void 0,
+        name: message.actionName,
+        scope: message.actionExecutionId,
+        content: message.result
+      };
+    } else if (message instanceof import_runtime_client_gql5.AgentStateMessage) {
+      return {
+        id: message.id,
+        type: `AgentStateMessage (running: ${message.running})`,
+        role: message.role,
+        name: void 0,
+        scope: message.threadId,
+        content: message.state
+      };
+    }
+  });
+  console.table(tableData);
+}
 
 // src/components/dev-console/console.tsx
 var import_react_core6 = require("@copilotkit/react-core");
@@ -1642,6 +1737,7 @@ function DebugMenuButton({
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react9.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => logReadables(context), children: "Log Readables" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react9.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => logActions(context), children: "Log Actions" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react9.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => logMessages(context), children: "Log Messages" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react9.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => checkForUpdates(true), children: "Check for Updates" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("hr", {}),
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react9.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => setShowDevConsole(false), children: "Hide Dev Console" }) })
@@ -1760,9 +1856,9 @@ var useCopilotChatLogic = (makeSystemMessage, onInProgress, onSubmitMessage) =>
   const sendMessage = (messageContent) => __async(void 0, null, function* () {
     abortSuggestions();
     setCurrentSuggestions([]);
-    const message = new import_runtime_client_gql4.TextMessage({
+    const message = new import_runtime_client_gql6.TextMessage({
       content: messageContent,
-      role: import_runtime_client_gql4.Role.User
+      role: import_runtime_client_gql6.Role.User
     });
     appendMessage(message);
     if (onSubmitMessage) {