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

package/dist/components/index.js

@@ -384,14 +384,13 @@ var ChatContextProvider = ({
 var import_react2 = __toESM(require("react"));
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var Window = ({
-  open,
-  setOpen,
   children,
   clickOutsideToClose,
   shortcut,
   hitEscapeToClose
 }) => {
   const windowRef = import_react2.default.useRef(null);
+  const { open, setOpen } = useChatContext();
   const handleClickOutside = (0, import_react2.useCallback)(
     (event) => {
       var _a;
@@ -493,16 +492,16 @@ function isMacOS() {
 
 // src/components/chat/Button.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
-var Button = ({ open, setOpen }) => {
-  const context = useChatContext();
+var Button = ({}) => {
+  const { open, setOpen, icons } = useChatContext();
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { onClick: () => setOpen(!open), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
     "button",
     {
       className: `copilotKitButton ${open ? "open" : ""}`,
       "aria-label": open ? "Close Chat" : "Open Chat",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconOpen", children: context.icons.openIcon }),
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconClose", children: context.icons.closeIcon })
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconOpen", children: icons.openIcon }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "copilotKitButtonIcon copilotKitButtonIconClose", children: icons.closeIcon })
       ]
     }
   ) });
@@ -510,11 +509,11 @@ var Button = ({ open, setOpen }) => {
 
 // src/components/chat/Header.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var Header = ({ setOpen }) => {
-  const context = useChatContext();
+var Header = ({}) => {
+  const { setOpen, icons, labels } = useChatContext();
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "copilotKitHeader", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { children: context.labels.title }),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { onClick: () => setOpen(false), "aria-label": "Close", children: context.icons.headerCloseIcon })
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { children: labels.title }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { onClick: () => setOpen(false), "aria-label": "Close", children: icons.headerCloseIcon })
   ] });
 };
 
@@ -1032,8 +1031,8 @@ var Messages = ({ messages, inProgress, children }) => {
       } else if (message instanceof import_runtime_client_gql.TextMessage && message.role == "assistant") {
         return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: isCurrentMessage && inProgress && !message.content ? context.icons.spinnerIcon : /* @__PURE__ */ (0, import_jsx_runtime8.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_runtime8.jsxs)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
@@ -1075,6 +1074,50 @@ var Messages = ({ messages, inProgress, children }) => {
         } else {
           return /* @__PURE__ */ (0, import_jsx_runtime8.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_runtime8.jsxs)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
+                context.icons.spinnerIcon,
+                " ",
+                /* @__PURE__ */ (0, import_jsx_runtime8.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_runtime8.jsxs)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: [
+                isCurrentMessage && inProgress && context.icons.spinnerIcon,
+                " ",
+                toRender
+              ] }, index);
+            } else {
+              return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "copilotKitCustomAssistantMessage", children: toRender }, index);
+            }
+          }
+        } else if (!inProgress || !isCurrentMessage) {
+          return null;
+        } else {
+          return /* @__PURE__ */ (0, import_jsx_runtime8.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_runtime8.jsx)("div", { className: `copilotKitMessage copilotKitAssistantMessage`, children: context.icons.spinnerIcon }, index);
       }
     }),
     /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("footer", { ref: messagesEndRef, children })
@@ -1425,11 +1468,13 @@ var reloadSuggestions = (context, chatSuggestionConfiguration, setCurrentSuggest
 // src/components/chat/Chat.tsx
 var import_react11 = __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;
@@ -1490,6 +1535,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");
@@ -1498,6 +1544,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;
@@ -1510,6 +1557,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");
@@ -1784,6 +1878,7 @@ function DebugMenuButton({
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react10.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => logReadables(context), children: "Log Readables" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react10.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => logActions(context), children: "Log Actions" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react10.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => logMessages(context), children: "Log Messages" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react10.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => checkForUpdates(true), children: "Check for Updates" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("hr", {}),
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react10.MenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { className: "copilotKitDebugMenuItem", onClick: () => setShowDevConsole(false), children: "Hide Dev Console" }) })
@@ -1902,9 +1997,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) {
@@ -1952,23 +2047,22 @@ var CopilotModal = ({
 }) => {
   const [openState, setOpenState] = import_react12.default.useState(defaultOpen);
   const setOpen = (open) => {
+    console.log("setOpen!!", open);
     onSetOpen == null ? void 0 : onSetOpen(open);
     setOpenState(open);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(ChatContextProvider, { icons, labels, open: openState, setOpen: setOpenState, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(ChatContextProvider, { icons, labels, open: openState, setOpen, children: [
     children,
     /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Button2, { open: openState, setOpen }),
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Button2, {}),
       /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
         Window2,
         {
-          open: openState,
-          setOpen,
           clickOutsideToClose,
           shortcut,
           hitEscapeToClose,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Header2, { open: openState, setOpen }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Header2, {}),
             /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               CopilotChat,
               {
@@ -2010,6 +2104,7 @@ function CopilotSidebar(props) {
   );
   const onSetOpen = (open) => {
     var _a;
+    console.log("onSetOpen", open);
     (_a = props.onSetOpen) == null ? void 0 : _a.call(props, open);
     setExpandedClassName(open ? "sidebarExpanded" : "");
   };