@copilotkitnext/react 0.0.22-alpha.1 → 0.0.22-alpha.3

package/dist/chunk-BT6C5OPU.mjs

@@ -0,0 +1,278 @@
+import {
+  Button
+} from "./chunk-TAUOEJH2.mjs";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger
+} from "./chunk-VVAXSF3M.mjs";
+import {
+  renderSlot
+} from "./chunk-FIBK3DYE.mjs";
+import {
+  CopilotChatDefaultLabels,
+  useCopilotChatConfiguration
+} from "./chunk-4XJK5IVQ.mjs";
+
+// src/components/chat/CopilotChatUserMessage.tsx
+import { useMemo, useState } from "react";
+import { Copy, Check, Edit, ChevronLeft, ChevronRight } from "lucide-react";
+import { twMerge } from "tailwind-merge";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function flattenUserMessageContent(content) {
+  if (!content) {
+    return "";
+  }
+  if (typeof content === "string") {
+    return content;
+  }
+  return content.map((part) => {
+    if (part && typeof part === "object" && "type" in part && part.type === "text" && typeof part.text === "string") {
+      return part.text;
+    }
+    return "";
+  }).filter((text) => text.length > 0).join("\n");
+}
+function CopilotChatUserMessage({
+  message,
+  onEditMessage,
+  branchIndex,
+  numberOfBranches,
+  onSwitchToBranch,
+  additionalToolbarItems,
+  messageRenderer,
+  toolbar,
+  copyButton,
+  editButton,
+  branchNavigation,
+  children,
+  className,
+  ...props
+}) {
+  const flattenedContent = useMemo(
+    () => flattenUserMessageContent(message.content),
+    [message.content]
+  );
+  const BoundMessageRenderer = renderSlot(
+    messageRenderer,
+    CopilotChatUserMessage.MessageRenderer,
+    {
+      content: flattenedContent
+    }
+  );
+  const BoundCopyButton = renderSlot(
+    copyButton,
+    CopilotChatUserMessage.CopyButton,
+    {
+      onClick: async () => {
+        if (flattenedContent) {
+          try {
+            await navigator.clipboard.writeText(flattenedContent);
+          } catch (err) {
+            console.error("Failed to copy message:", err);
+          }
+        }
+      }
+    }
+  );
+  const BoundEditButton = renderSlot(
+    editButton,
+    CopilotChatUserMessage.EditButton,
+    {
+      onClick: () => onEditMessage?.({ message })
+    }
+  );
+  const BoundBranchNavigation = renderSlot(
+    branchNavigation,
+    CopilotChatUserMessage.BranchNavigation,
+    {
+      currentBranch: branchIndex,
+      numberOfBranches,
+      onSwitchToBranch,
+      message
+    }
+  );
+  const showBranchNavigation = numberOfBranches && numberOfBranches > 1 && onSwitchToBranch;
+  const BoundToolbar = renderSlot(toolbar, CopilotChatUserMessage.Toolbar, {
+    children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 justify-end", children: [
+      additionalToolbarItems,
+      BoundCopyButton,
+      onEditMessage && BoundEditButton,
+      showBranchNavigation && BoundBranchNavigation
+    ] })
+  });
+  if (children) {
+    return /* @__PURE__ */ jsx(Fragment, { children: children({
+      messageRenderer: BoundMessageRenderer,
+      toolbar: BoundToolbar,
+      copyButton: BoundCopyButton,
+      editButton: BoundEditButton,
+      branchNavigation: BoundBranchNavigation,
+      message,
+      branchIndex,
+      numberOfBranches,
+      additionalToolbarItems
+    }) });
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: twMerge("flex flex-col items-end group pt-10", className),
+      "data-message-id": message.id,
+      ...props,
+      children: [
+        BoundMessageRenderer,
+        BoundToolbar
+      ]
+    }
+  );
+}
+((CopilotChatUserMessage2) => {
+  CopilotChatUserMessage2.Container = ({ children, className, ...props }) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: twMerge("flex flex-col items-end group", className),
+      ...props,
+      children
+    }
+  );
+  CopilotChatUserMessage2.MessageRenderer = ({ content, className }) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: twMerge(
+        "prose dark:prose-invert bg-muted relative max-w-[80%] rounded-[18px] px-4 py-1.5 data-[multiline]:py-3 inline-block whitespace-pre-wrap",
+        className
+      ),
+      children: content
+    }
+  );
+  CopilotChatUserMessage2.Toolbar = ({
+    className,
+    ...props
+  }) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: twMerge(
+        "w-full bg-transparent flex items-center justify-end -mr-[5px] mt-[4px] invisible group-hover:visible",
+        className
+      ),
+      ...props
+    }
+  );
+  CopilotChatUserMessage2.ToolbarButton = ({ title, children, className, ...props }) => {
+    return /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "assistantMessageToolbarButton",
+          "aria-label": title,
+          className: twMerge(className),
+          ...props,
+          children
+        }
+      ) }),
+      /* @__PURE__ */ jsx(TooltipContent, { side: "bottom", children: /* @__PURE__ */ jsx("p", { children: title }) })
+    ] });
+  };
+  CopilotChatUserMessage2.CopyButton = ({ className, title, onClick, ...props }) => {
+    const config = useCopilotChatConfiguration();
+    const labels = config?.labels ?? CopilotChatDefaultLabels;
+    const [copied, setCopied] = useState(false);
+    const handleClick = (event) => {
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+      if (onClick) {
+        onClick(event);
+      }
+    };
+    return /* @__PURE__ */ jsx(
+      CopilotChatUserMessage2.ToolbarButton,
+      {
+        title: title || labels.userMessageToolbarCopyMessageLabel,
+        onClick: handleClick,
+        className,
+        ...props,
+        children: copied ? /* @__PURE__ */ jsx(Check, { className: "size-[18px]" }) : /* @__PURE__ */ jsx(Copy, { className: "size-[18px]" })
+      }
+    );
+  };
+  CopilotChatUserMessage2.EditButton = ({ className, title, ...props }) => {
+    const config = useCopilotChatConfiguration();
+    const labels = config?.labels ?? CopilotChatDefaultLabels;
+    return /* @__PURE__ */ jsx(
+      CopilotChatUserMessage2.ToolbarButton,
+      {
+        title: title || labels.userMessageToolbarEditMessageLabel,
+        className,
+        ...props,
+        children: /* @__PURE__ */ jsx(Edit, { className: "size-[18px]" })
+      }
+    );
+  };
+  CopilotChatUserMessage2.BranchNavigation = ({
+    className,
+    currentBranch = 0,
+    numberOfBranches = 1,
+    onSwitchToBranch,
+    message,
+    ...props
+  }) => {
+    if (!numberOfBranches || numberOfBranches <= 1 || !onSwitchToBranch) {
+      return null;
+    }
+    const canGoPrev = currentBranch > 0;
+    const canGoNext = currentBranch < numberOfBranches - 1;
+    return /* @__PURE__ */ jsxs("div", { className: twMerge("flex items-center gap-1", className), ...props, children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "assistantMessageToolbarButton",
+          onClick: () => onSwitchToBranch?.({
+            branchIndex: currentBranch - 1,
+            numberOfBranches,
+            message
+          }),
+          disabled: !canGoPrev,
+          className: "h-6 w-6 p-0",
+          children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-[20px]" })
+        }
+      ),
+      /* @__PURE__ */ jsxs("span", { className: "text-sm text-muted-foreground px-0 font-medium", children: [
+        currentBranch + 1,
+        "/",
+        numberOfBranches
+      ] }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "assistantMessageToolbarButton",
+          onClick: () => onSwitchToBranch?.({
+            branchIndex: currentBranch + 1,
+            numberOfBranches,
+            message
+          }),
+          disabled: !canGoNext,
+          className: "h-6 w-6 p-0",
+          children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-[20px]" })
+        }
+      )
+    ] });
+  };
+})(CopilotChatUserMessage || (CopilotChatUserMessage = {}));
+CopilotChatUserMessage.Container.displayName = "CopilotChatUserMessage.Container";
+CopilotChatUserMessage.MessageRenderer.displayName = "CopilotChatUserMessage.MessageRenderer";
+CopilotChatUserMessage.Toolbar.displayName = "CopilotChatUserMessage.Toolbar";
+CopilotChatUserMessage.ToolbarButton.displayName = "CopilotChatUserMessage.ToolbarButton";
+CopilotChatUserMessage.CopyButton.displayName = "CopilotChatUserMessage.CopyButton";
+CopilotChatUserMessage.EditButton.displayName = "CopilotChatUserMessage.EditButton";
+CopilotChatUserMessage.BranchNavigation.displayName = "CopilotChatUserMessage.BranchNavigation";
+var CopilotChatUserMessage_default = CopilotChatUserMessage;
+
+export {
+  CopilotChatUserMessage,
+  CopilotChatUserMessage_default
+};
+//# sourceMappingURL=chunk-BT6C5OPU.mjs.map

package/dist/chunk-BT6C5OPU.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/chat/CopilotChatUserMessage.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { Copy, Check, Edit, ChevronLeft, ChevronRight } from \"lucide-react\";\nimport {\n  useCopilotChatConfiguration,\n  CopilotChatDefaultLabels,\n} from \"@/providers/CopilotChatConfigurationProvider\";\nimport { twMerge } from \"tailwind-merge\";\nimport { Button } from \"@/components/ui/button\";\nimport { UserMessage } from \"@ag-ui/core\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipTrigger,\n} from \"@/components/ui/tooltip\";\nimport { renderSlot, WithSlots } from \"@/lib/slots\";\n\nfunction flattenUserMessageContent(content?: UserMessage[\"content\"]): string {\n  if (!content) {\n    return \"\";\n  }\n\n  if (typeof content === \"string\") {\n    return content;\n  }\n\n  return content\n    .map((part) => {\n      if (\n        part &&\n        typeof part === \"object\" &&\n        \"type\" in part &&\n        (part as { type?: unknown }).type === \"text\" &&\n        typeof (part as { text?: unknown }).text === \"string\"\n      ) {\n        return (part as { text: string }).text;\n      }\n      return \"\";\n    })\n    .filter((text) => text.length > 0)\n    .join(\"\\n\");\n}\n\nexport interface CopilotChatUserMessageOnEditMessageProps {\n  message: UserMessage;\n}\n\nexport interface CopilotChatUserMessageOnSwitchToBranchProps {\n  message: UserMessage;\n  branchIndex: number;\n  numberOfBranches: number;\n}\n\nexport type CopilotChatUserMessageProps = WithSlots<\n  {\n    messageRenderer: typeof CopilotChatUserMessage.MessageRenderer;\n    toolbar: typeof CopilotChatUserMessage.Toolbar;\n    copyButton: typeof CopilotChatUserMessage.CopyButton;\n    editButton: typeof CopilotChatUserMessage.EditButton;\n    branchNavigation: typeof CopilotChatUserMessage.BranchNavigation;\n  },\n  {\n    onEditMessage?: (props: CopilotChatUserMessageOnEditMessageProps) => void;\n    onSwitchToBranch?: (\n      props: CopilotChatUserMessageOnSwitchToBranchProps\n    ) => void;\n    message: UserMessage;\n    branchIndex?: number;\n    numberOfBranches?: number;\n    additionalToolbarItems?: React.ReactNode;\n  } & React.HTMLAttributes<HTMLDivElement>\n>;\n\nexport function CopilotChatUserMessage({\n  message,\n  onEditMessage,\n  branchIndex,\n  numberOfBranches,\n  onSwitchToBranch,\n  additionalToolbarItems,\n  messageRenderer,\n  toolbar,\n  copyButton,\n  editButton,\n  branchNavigation,\n  children,\n  className,\n  ...props\n}: CopilotChatUserMessageProps) {\n  const flattenedContent = useMemo(\n    () => flattenUserMessageContent(message.content),\n    [message.content]\n  );\n\n  const BoundMessageRenderer = renderSlot(\n    messageRenderer,\n    CopilotChatUserMessage.MessageRenderer,\n    {\n      content: flattenedContent,\n    }\n  );\n\n  const BoundCopyButton = renderSlot(\n    copyButton,\n    CopilotChatUserMessage.CopyButton,\n    {\n      onClick: async () => {\n        if (flattenedContent) {\n          try {\n            await navigator.clipboard.writeText(flattenedContent);\n          } catch (err) {\n            console.error(\"Failed to copy message:\", err);\n          }\n        }\n      },\n    }\n  );\n\n  const BoundEditButton = renderSlot(\n    editButton,\n    CopilotChatUserMessage.EditButton,\n    {\n      onClick: () => onEditMessage?.({ message }),\n    }\n  );\n\n  const BoundBranchNavigation = renderSlot(\n    branchNavigation,\n    CopilotChatUserMessage.BranchNavigation,\n    {\n      currentBranch: branchIndex,\n      numberOfBranches,\n      onSwitchToBranch,\n      message,\n    }\n  );\n\n  const showBranchNavigation =\n    numberOfBranches && numberOfBranches > 1 && onSwitchToBranch;\n\n  const BoundToolbar = renderSlot(toolbar, CopilotChatUserMessage.Toolbar, {\n    children: (\n      <div className=\"flex items-center gap-1 justify-end\">\n        {additionalToolbarItems}\n        {BoundCopyButton}\n        {onEditMessage && BoundEditButton}\n        {showBranchNavigation && BoundBranchNavigation}\n      </div>\n    ),\n  });\n\n  if (children) {\n    return (\n      <>\n        {children({\n          messageRenderer: BoundMessageRenderer,\n          toolbar: BoundToolbar,\n          copyButton: BoundCopyButton,\n          editButton: BoundEditButton,\n          branchNavigation: BoundBranchNavigation,\n          message,\n          branchIndex,\n          numberOfBranches,\n          additionalToolbarItems,\n        })}\n      </>\n    );\n  }\n\n  return (\n    <div\n      className={twMerge(\"flex flex-col items-end group pt-10\", className)}\n      data-message-id={message.id}\n      {...props}\n    >\n      {BoundMessageRenderer}\n      {BoundToolbar}\n    </div>\n  );\n}\n\n// eslint-disable-next-line @typescript-eslint/no-namespace\nexport namespace CopilotChatUserMessage {\n  export const Container: React.FC<\n    React.PropsWithChildren<React.HTMLAttributes<HTMLDivElement>>\n  > = ({ children, className, ...props }) => (\n    <div\n      className={twMerge(\"flex flex-col items-end group\", className)}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n\n  export const MessageRenderer: React.FC<{\n    content: string;\n    className?: string;\n  }> = ({ content, className }) => (\n    <div\n      className={twMerge(\n        \"prose dark:prose-invert bg-muted relative max-w-[80%] rounded-[18px] px-4 py-1.5 data-[multiline]:py-3 inline-block whitespace-pre-wrap\",\n        className\n      )}\n    >\n      {content}\n    </div>\n  );\n\n  export const Toolbar: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({\n    className,\n    ...props\n  }) => (\n    <div\n      className={twMerge(\n        \"w-full bg-transparent flex items-center justify-end -mr-[5px] mt-[4px] invisible group-hover:visible\",\n        className\n      )}\n      {...props}\n    />\n  );\n\n  export const ToolbarButton: React.FC<\n    React.ButtonHTMLAttributes<HTMLButtonElement> & {\n      title: string;\n      children: React.ReactNode;\n    }\n  > = ({ title, children, className, ...props }) => {\n    return (\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <Button\n            type=\"button\"\n            variant=\"assistantMessageToolbarButton\"\n            aria-label={title}\n            className={twMerge(className)}\n            {...props}\n          >\n            {children}\n          </Button>\n        </TooltipTrigger>\n        <TooltipContent side=\"bottom\">\n          <p>{title}</p>\n        </TooltipContent>\n      </Tooltip>\n    );\n  };\n\n  export const CopyButton: React.FC<\n    React.ButtonHTMLAttributes<HTMLButtonElement> & { copied?: boolean }\n  > = ({ className, title, onClick, ...props }) => {\n    const config = useCopilotChatConfiguration();\n    const labels = config?.labels ?? CopilotChatDefaultLabels;\n    const [copied, setCopied] = useState(false);\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n      setCopied(true);\n      setTimeout(() => setCopied(false), 2000);\n\n      if (onClick) {\n        onClick(event);\n      }\n    };\n\n    return (\n      <ToolbarButton\n        title={title || labels.userMessageToolbarCopyMessageLabel}\n        onClick={handleClick}\n        className={className}\n        {...props}\n      >\n        {copied ? (\n          <Check className=\"size-[18px]\" />\n        ) : (\n          <Copy className=\"size-[18px]\" />\n        )}\n      </ToolbarButton>\n    );\n  };\n\n  export const EditButton: React.FC<\n    React.ButtonHTMLAttributes<HTMLButtonElement>\n  > = ({ className, title, ...props }) => {\n    const config = useCopilotChatConfiguration();\n    const labels = config?.labels ?? CopilotChatDefaultLabels;\n    return (\n      <ToolbarButton\n        title={title || labels.userMessageToolbarEditMessageLabel}\n        className={className}\n        {...props}\n      >\n        <Edit className=\"size-[18px]\" />\n      </ToolbarButton>\n    );\n  };\n\n  export const BranchNavigation: React.FC<\n    React.HTMLAttributes<HTMLDivElement> & {\n      currentBranch?: number;\n      numberOfBranches?: number;\n      onSwitchToBranch?: (\n        props: CopilotChatUserMessageOnSwitchToBranchProps\n      ) => void;\n      message: UserMessage;\n    }\n  > = ({\n    className,\n    currentBranch = 0,\n    numberOfBranches = 1,\n    onSwitchToBranch,\n    message,\n    ...props\n  }) => {\n    if (!numberOfBranches || numberOfBranches <= 1 || !onSwitchToBranch) {\n      return null;\n    }\n\n    const canGoPrev = currentBranch > 0;\n    const canGoNext = currentBranch < numberOfBranches - 1;\n\n    return (\n      <div className={twMerge(\"flex items-center gap-1\", className)} {...props}>\n        <Button\n          type=\"button\"\n          variant=\"assistantMessageToolbarButton\"\n          onClick={() =>\n            onSwitchToBranch?.({\n              branchIndex: currentBranch - 1,\n              numberOfBranches,\n              message,\n            })\n          }\n          disabled={!canGoPrev}\n          className=\"h-6 w-6 p-0\"\n        >\n          <ChevronLeft className=\"size-[20px]\" />\n        </Button>\n        <span className=\"text-sm text-muted-foreground px-0 font-medium\">\n          {currentBranch + 1}/{numberOfBranches}\n        </span>\n        <Button\n          type=\"button\"\n          variant=\"assistantMessageToolbarButton\"\n          onClick={() =>\n            onSwitchToBranch?.({\n              branchIndex: currentBranch + 1,\n              numberOfBranches,\n              message,\n            })\n          }\n          disabled={!canGoNext}\n          className=\"h-6 w-6 p-0\"\n        >\n          <ChevronRight className=\"size-[20px]\" />\n        </Button>\n      </div>\n    );\n  };\n}\n\nCopilotChatUserMessage.Container.displayName =\n  \"CopilotChatUserMessage.Container\";\nCopilotChatUserMessage.MessageRenderer.displayName =\n  \"CopilotChatUserMessage.MessageRenderer\";\nCopilotChatUserMessage.Toolbar.displayName = \"CopilotChatUserMessage.Toolbar\";\nCopilotChatUserMessage.ToolbarButton.displayName =\n  \"CopilotChatUserMessage.ToolbarButton\";\nCopilotChatUserMessage.CopyButton.displayName =\n  \"CopilotChatUserMessage.CopyButton\";\nCopilotChatUserMessage.EditButton.displayName =\n  \"CopilotChatUserMessage.EditButton\";\nCopilotChatUserMessage.BranchNavigation.displayName =\n  \"CopilotChatUserMessage.BranchNavigation\";\n\nexport default CopilotChatUserMessage;\n"],"mappings":"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","names":["CopilotChatUserMessage"]}

package/dist/chunk-CGLGXQAU.mjs

@@ -0,0 +1,78 @@
+import {
+  useFrontendTool
+} from "./chunk-IICUCI5S.mjs";
+import {
+  useCopilotKit
+} from "./chunk-RF2CGPHQ.mjs";
+
+// src/hooks/use-human-in-the-loop.tsx
+import { useCallback, useRef, useEffect } from "react";
+import React from "react";
+function useHumanInTheLoop(tool) {
+  const { copilotkit } = useCopilotKit();
+  const resolvePromiseRef = useRef(null);
+  const respond = useCallback(async (result) => {
+    if (resolvePromiseRef.current) {
+      resolvePromiseRef.current(result);
+      resolvePromiseRef.current = null;
+    }
+  }, []);
+  const handler = useCallback(async () => {
+    return new Promise((resolve) => {
+      resolvePromiseRef.current = resolve;
+    });
+  }, []);
+  const RenderComponent = useCallback(
+    (props) => {
+      const ToolComponent = tool.render;
+      if (props.status === "inProgress") {
+        const enhancedProps = {
+          ...props,
+          name: tool.name,
+          description: tool.description || "",
+          respond: void 0
+        };
+        return React.createElement(ToolComponent, enhancedProps);
+      } else if (props.status === "executing") {
+        const enhancedProps = {
+          ...props,
+          name: tool.name,
+          description: tool.description || "",
+          respond
+        };
+        return React.createElement(ToolComponent, enhancedProps);
+      } else if (props.status === "complete") {
+        const enhancedProps = {
+          ...props,
+          name: tool.name,
+          description: tool.description || "",
+          respond: void 0
+        };
+        return React.createElement(ToolComponent, enhancedProps);
+      }
+      return React.createElement(ToolComponent, props);
+    },
+    [tool.render, tool.name, tool.description, respond]
+  );
+  const frontendTool = {
+    ...tool,
+    handler,
+    render: RenderComponent
+  };
+  useFrontendTool(frontendTool);
+  useEffect(() => {
+    return () => {
+      const keyOf = (rc) => `${rc.agentId ?? ""}:${rc.name}`;
+      const currentRenderToolCalls = copilotkit.renderToolCalls;
+      const filtered = currentRenderToolCalls.filter(
+        (rc) => keyOf(rc) !== keyOf({ name: tool.name, agentId: tool.agentId })
+      );
+      copilotkit.setRenderToolCalls(filtered);
+    };
+  }, [copilotkit, tool.name, tool.agentId]);
+}
+
+export {
+  useHumanInTheLoop
+};
+//# sourceMappingURL=chunk-CGLGXQAU.mjs.map

package/dist/chunk-CGLGXQAU.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-human-in-the-loop.tsx"],"sourcesContent":["import { ReactToolCallRenderer } from \"@/types/react-tool-call-renderer\";\nimport { useFrontendTool } from \"./use-frontend-tool\";\nimport { ReactFrontendTool } from \"@/types/frontend-tool\";\nimport { ReactHumanInTheLoop } from \"@/types/human-in-the-loop\";\nimport { useCallback, useRef, useEffect } from \"react\";\nimport React from \"react\";\nimport { useCopilotKit } from \"@/providers/CopilotKitProvider\";\n\nexport function useHumanInTheLoop<T extends Record<string, unknown> = Record<string, unknown>>(\n  tool: ReactHumanInTheLoop<T>,\n) {\n  const { copilotkit } = useCopilotKit();\n  const resolvePromiseRef = useRef<((result: unknown) => void) | null>(null);\n\n  const respond = useCallback(async (result: unknown) => {\n    if (resolvePromiseRef.current) {\n      resolvePromiseRef.current(result);\n      resolvePromiseRef.current = null;\n    }\n  }, []);\n\n  const handler = useCallback(async () => {\n    return new Promise((resolve) => {\n      resolvePromiseRef.current = resolve;\n    });\n  }, []);\n\n  const RenderComponent: ReactToolCallRenderer<T>[\"render\"] = useCallback(\n    (props) => {\n      const ToolComponent = tool.render;\n\n      // Enhance props based on current status\n      if (props.status === \"inProgress\") {\n        const enhancedProps = {\n          ...props,\n          name: tool.name,\n          description: tool.description || \"\",\n          respond: undefined,\n        };\n        return React.createElement(ToolComponent, enhancedProps);\n      } else if (props.status === \"executing\") {\n        const enhancedProps = {\n          ...props,\n          name: tool.name,\n          description: tool.description || \"\",\n          respond,\n        };\n        return React.createElement(ToolComponent, enhancedProps);\n      } else if (props.status === \"complete\") {\n        const enhancedProps = {\n          ...props,\n          name: tool.name,\n          description: tool.description || \"\",\n          respond: undefined,\n        };\n        return React.createElement(ToolComponent, enhancedProps);\n      }\n\n      // Fallback - just render with original props\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      return React.createElement(ToolComponent, props as any);\n    },\n    [tool.render, tool.name, tool.description, respond],\n  );\n\n  const frontendTool: ReactFrontendTool<T> = {\n    ...tool,\n    handler,\n    render: RenderComponent,\n  };\n\n  useFrontendTool(frontendTool);\n\n  // Human-in-the-loop tools should remove their renderer on unmount\n  // since they can't respond to user interactions anymore\n  useEffect(() => {\n    return () => {\n      const keyOf = (rc: ReactToolCallRenderer<any>) => `${rc.agentId ?? \"\"}:${rc.name}`;\n      const currentRenderToolCalls = copilotkit.renderToolCalls as ReactToolCallRenderer<any>[];\n      const filtered = currentRenderToolCalls.filter(\n        (rc) => keyOf(rc) !== keyOf({ name: tool.name, agentId: tool.agentId } as any),\n      );\n      copilotkit.setRenderToolCalls(filtered);\n    };\n  }, [copilotkit, tool.name, tool.agentId]);\n}\n"],"mappings":";;;;;;;;AAIA,SAAS,aAAa,QAAQ,iBAAiB;AAC/C,OAAO,WAAW;AAGX,SAAS,kBACd,MACA;AACA,QAAM,EAAE,WAAW,IAAI,cAAc;AACrC,QAAM,oBAAoB,OAA2C,IAAI;AAEzE,QAAM,UAAU,YAAY,OAAO,WAAoB;AACrD,QAAI,kBAAkB,SAAS;AAC7B,wBAAkB,QAAQ,MAAM;AAChC,wBAAkB,UAAU;AAAA,IAC9B;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,YAAY,YAAY;AACtC,WAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,wBAAkB,UAAU;AAAA,IAC9B,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,QAAM,kBAAsD;AAAA,IAC1D,CAAC,UAAU;AACT,YAAM,gBAAgB,KAAK;AAG3B,UAAI,MAAM,WAAW,cAAc;AACjC,cAAM,gBAAgB;AAAA,UACpB,GAAG;AAAA,UACH,MAAM,KAAK;AAAA,UACX,aAAa,KAAK,eAAe;AAAA,UACjC,SAAS;AAAA,QACX;AACA,eAAO,MAAM,cAAc,eAAe,aAAa;AAAA,MACzD,WAAW,MAAM,WAAW,aAAa;AACvC,cAAM,gBAAgB;AAAA,UACpB,GAAG;AAAA,UACH,MAAM,KAAK;AAAA,UACX,aAAa,KAAK,eAAe;AAAA,UACjC;AAAA,QACF;AACA,eAAO,MAAM,cAAc,eAAe,aAAa;AAAA,MACzD,WAAW,MAAM,WAAW,YAAY;AACtC,cAAM,gBAAgB;AAAA,UACpB,GAAG;AAAA,UACH,MAAM,KAAK;AAAA,UACX,aAAa,KAAK,eAAe;AAAA,UACjC,SAAS;AAAA,QACX;AACA,eAAO,MAAM,cAAc,eAAe,aAAa;AAAA,MACzD;AAIA,aAAO,MAAM,cAAc,eAAe,KAAY;AAAA,IACxD;AAAA,IACA,CAAC,KAAK,QAAQ,KAAK,MAAM,KAAK,aAAa,OAAO;AAAA,EACpD;AAEA,QAAM,eAAqC;AAAA,IACzC,GAAG;AAAA,IACH;AAAA,IACA,QAAQ;AAAA,EACV;AAEA,kBAAgB,YAAY;AAI5B,YAAU,MAAM;AACd,WAAO,MAAM;AACX,YAAM,QAAQ,CAAC,OAAmC,GAAG,GAAG,WAAW,EAAE,IAAI,GAAG,IAAI;AAChF,YAAM,yBAAyB,WAAW;AAC1C,YAAM,WAAW,uBAAuB;AAAA,QACtC,CAAC,OAAO,MAAM,EAAE,MAAM,MAAM,EAAE,MAAM,KAAK,MAAM,SAAS,KAAK,QAAQ,CAAQ;AAAA,MAC/E;AACA,iBAAW,mBAAmB,QAAQ;AAAA,IACxC;AAAA,EACF,GAAG,CAAC,YAAY,KAAK,MAAM,KAAK,OAAO,CAAC;AAC1C;","names":[]}

package/dist/chunk-CSHBUHRW.mjs

@@ -0,0 +1,69 @@
+import {
+  useCopilotChatConfiguration
+} from "./chunk-4XJK5IVQ.mjs";
+import {
+  useCopilotKit
+} from "./chunk-VE3SBLU7.mjs";
+
+// src/hooks/use-render-custom-messages.tsx
+import { jsx } from "react/jsx-runtime";
+function useRenderCustomMessages() {
+  const { copilotkit } = useCopilotKit();
+  const config = useCopilotChatConfiguration();
+  if (!config) {
+    return null;
+  }
+  const { agentId, threadId } = config;
+  const customMessageRenderers = copilotkit.renderCustomMessages.filter((renderer) => renderer.agentId === void 0 || renderer.agentId === agentId).sort((a, b) => {
+    const aHasAgent = a.agentId !== void 0;
+    const bHasAgent = b.agentId !== void 0;
+    if (aHasAgent === bHasAgent) return 0;
+    return aHasAgent ? -1 : 1;
+  });
+  return function(params) {
+    if (!customMessageRenderers.length) {
+      return null;
+    }
+    const { message, position } = params;
+    const runId = copilotkit.getRunIdForMessage(agentId, threadId, message.id);
+    const agent = copilotkit.getAgent(agentId);
+    if (!agent) {
+      throw new Error("Agent not found");
+    }
+    const messagesIdsInRun = agent.messages.filter((msg) => copilotkit.getRunIdForMessage(agentId, threadId, msg.id) === runId).map((msg) => msg.id);
+    const messageIndex = agent.messages.findIndex((msg) => msg.id === message.id) ?? 0;
+    const messageIndexInRun = Math.min(messagesIdsInRun.indexOf(message.id), 0);
+    const numberOfMessagesInRun = messagesIdsInRun.length;
+    const stateSnapshot = copilotkit.getStateByRun(agentId, threadId, runId);
+    let result = null;
+    for (const renderer of customMessageRenderers) {
+      if (!renderer.render) {
+        continue;
+      }
+      const Component = renderer.render;
+      result = /* @__PURE__ */ jsx(
+        Component,
+        {
+          message,
+          position,
+          runId,
+          messageIndex,
+          messageIndexInRun,
+          numberOfMessagesInRun,
+          agentId,
+          stateSnapshot
+        },
+        `${runId}-${message.id}-${position}`
+      );
+      if (result) {
+        break;
+      }
+    }
+    return result;
+  };
+}
+
+export {
+  useRenderCustomMessages
+};
+//# sourceMappingURL=chunk-CSHBUHRW.mjs.map

package/dist/chunk-CSHBUHRW.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-render-custom-messages.tsx"],"sourcesContent":["import { useCopilotChatConfiguration, useCopilotKit } from \"@/providers\";\nimport { ReactCustomMessageRendererPosition } from \"@/types/react-custom-message-renderer\";\nimport { Message } from \"@ag-ui/core\";\n\ninterface UseRenderCustomMessagesParams {\n  message: Message;\n  position: ReactCustomMessageRendererPosition;\n}\n\nexport function useRenderCustomMessages() {\n  const { copilotkit } = useCopilotKit();\n  const config = useCopilotChatConfiguration();\n\n  if (!config) {\n    return null;\n  }\n\n  const { agentId, threadId } = config;\n\n  const customMessageRenderers = copilotkit.renderCustomMessages\n    .filter((renderer) => renderer.agentId === undefined || renderer.agentId === agentId)\n    .sort((a, b) => {\n      const aHasAgent = a.agentId !== undefined;\n      const bHasAgent = b.agentId !== undefined;\n      if (aHasAgent === bHasAgent) return 0;\n      return aHasAgent ? -1 : 1;\n    });\n\n  return function (params: UseRenderCustomMessagesParams) {\n    if (!customMessageRenderers.length) {\n      return null;\n    }\n    const { message, position } = params;\n    const runId = copilotkit.getRunIdForMessage(agentId, threadId, message.id)!;\n    const agent = copilotkit.getAgent(agentId);\n    if (!agent) {\n      throw new Error(\"Agent not found\");\n    }\n\n    const messagesIdsInRun = agent.messages\n      .filter((msg) => copilotkit.getRunIdForMessage(agentId, threadId, msg.id) === runId)\n      .map((msg) => msg.id);\n\n    const messageIndex = agent.messages.findIndex((msg) => msg.id === message.id) ?? 0;\n    const messageIndexInRun = Math.min(messagesIdsInRun.indexOf(message.id), 0);\n    const numberOfMessagesInRun = messagesIdsInRun.length;\n    const stateSnapshot = copilotkit.getStateByRun(agentId, threadId, runId);\n\n    let result = null;\n    for (const renderer of customMessageRenderers) {\n      if (!renderer.render) {\n        continue;\n      }\n      const Component = renderer.render;\n      result = (\n        <Component\n          key={`${runId}-${message.id}-${position}`}\n          message={message}\n          position={position}\n          runId={runId}\n          messageIndex={messageIndex}\n          messageIndexInRun={messageIndexInRun}\n          numberOfMessagesInRun={numberOfMessagesInRun}\n          agentId={agentId}\n          stateSnapshot={stateSnapshot}\n        />\n      );\n      if (result) {\n        break;\n      }\n    }\n    return result;\n  };\n}\n"],"mappings":";;;;;;;;AAuDQ;AA9CD,SAAS,0BAA0B;AACxC,QAAM,EAAE,WAAW,IAAI,cAAc;AACrC,QAAM,SAAS,4BAA4B;AAE3C,MAAI,CAAC,QAAQ;AACX,WAAO;AAAA,EACT;AAEA,QAAM,EAAE,SAAS,SAAS,IAAI;AAE9B,QAAM,yBAAyB,WAAW,qBACvC,OAAO,CAAC,aAAa,SAAS,YAAY,UAAa,SAAS,YAAY,OAAO,EACnF,KAAK,CAAC,GAAG,MAAM;AACd,UAAM,YAAY,EAAE,YAAY;AAChC,UAAM,YAAY,EAAE,YAAY;AAChC,QAAI,cAAc,UAAW,QAAO;AACpC,WAAO,YAAY,KAAK;AAAA,EAC1B,CAAC;AAEH,SAAO,SAAU,QAAuC;AACtD,QAAI,CAAC,uBAAuB,QAAQ;AAClC,aAAO;AAAA,IACT;AACA,UAAM,EAAE,SAAS,SAAS,IAAI;AAC9B,UAAM,QAAQ,WAAW,mBAAmB,SAAS,UAAU,QAAQ,EAAE;AACzE,UAAM,QAAQ,WAAW,SAAS,OAAO;AACzC,QAAI,CAAC,OAAO;AACV,YAAM,IAAI,MAAM,iBAAiB;AAAA,IACnC;AAEA,UAAM,mBAAmB,MAAM,SAC5B,OAAO,CAAC,QAAQ,WAAW,mBAAmB,SAAS,UAAU,IAAI,EAAE,MAAM,KAAK,EAClF,IAAI,CAAC,QAAQ,IAAI,EAAE;AAEtB,UAAM,eAAe,MAAM,SAAS,UAAU,CAAC,QAAQ,IAAI,OAAO,QAAQ,EAAE,KAAK;AACjF,UAAM,oBAAoB,KAAK,IAAI,iBAAiB,QAAQ,QAAQ,EAAE,GAAG,CAAC;AAC1E,UAAM,wBAAwB,iBAAiB;AAC/C,UAAM,gBAAgB,WAAW,cAAc,SAAS,UAAU,KAAK;AAEvE,QAAI,SAAS;AACb,eAAW,YAAY,wBAAwB;AAC7C,UAAI,CAAC,SAAS,QAAQ;AACpB;AAAA,MACF;AACA,YAAM,YAAY,SAAS;AAC3B,eACE;AAAA,QAAC;AAAA;AAAA,UAEC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA;AAAA,QARK,GAAG,KAAK,IAAI,QAAQ,EAAE,IAAI,QAAQ;AAAA,MASzC;AAEF,UAAI,QAAQ;AACV;AAAA,MACF;AAAA,IACF;AACA,WAAO;AAAA,EACT;AACF;","names":[]}