langgraph-ui-components 0.0.10 → 0.0.11-testing

package/dist/index.es3.js

@@ -21,14 +21,29 @@ function Chat({ chatProps }) {
   const isLoading = stream.isLoading;
   const { setMode, threadId } = useThread();
   useEffect(() => {
-    fetchCatalog();
-    setAgents(["V3ya_external_agent", "chat_agent"]);
-  }, [fetchCatalog]);
+    const loadCatalog = async () => {
+      try {
+        const catalog = await fetchCatalog();
+        if (catalog && Array.isArray(catalog)) {
+          const agentList = catalog.map((agent) => ({
+            agent_id: agent.agent_id,
+            display_name: agent.display_name
+          }));
+          setAgents(agentList);
+        }
+      } catch (error) {
+        console.error("Failed to load agent catalog:", error);
+      }
+    };
+    loadCatalog();
+  }, []);
   const handleAgentChange = (event) => {
-    const selectedAgent = event.target.innerText;
-    console.log("Selected agent:", selectedAgent);
-    setAssistantId(selectedAgent);
-    setIsDropdownOpen(false);
+    const selectedAgent = event.target.getAttribute("data-agent-id");
+    if (selectedAgent) {
+      console.log("Selected agent:", selectedAgent);
+      setAssistantId(selectedAgent);
+      setIsDropdownOpen(false);
+    }
   };
   useEffect(() => {
     setMode("multi");
@@ -106,11 +121,11 @@ function Chat({ chatProps }) {
             type: "button",
             children: [
               assistantId,
-              /* @__PURE__ */ jsx("svg", { className: "w-4 h-4 ms-1.5 -me-0.5", "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { stroke: "currentColor", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "m19 9-7 7-7-7" }) })
+              /* @__PURE__ */ jsx("svg", { className: "w-4 h-4 ms-1.5 -me-0.5", "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "m19 9-7 7-7-7" }) })
             ]
           }
         ),
-        /* @__PURE__ */ jsx("div", { id: "dropdownDivider", className: `z-10 absolute top-14 bg-neutral-primary-medium bg-zinc-800 rounded-2xl  divide-y divide-default-medium w-44 ${isDropdownOpen ? "" : "hidden"}`, children: /* @__PURE__ */ jsx("ul", { className: "p-2 text-sm text-body font-medium", "aria-labelledby": "dropdownDividerButton", children: agents.map((agentName) => /* @__PURE__ */ jsx("li", { className: "hover:bg-zinc-700 hover:rounded-2xl", onClick: handleAgentChange, children: /* @__PURE__ */ jsx("span", { className: "inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded", children: agentName }) }, agentName)) }) })
+        /* @__PURE__ */ jsx("div", { id: "dropdownDivider", className: `z-10 absolute top-14 bg-neutral-primary-medium bg-zinc-800 rounded-2xl  divide-y divide-default-medium w-44 ${isDropdownOpen ? "" : "hidden"}`, children: /* @__PURE__ */ jsx("ul", { className: "p-2 text-sm text-body font-medium", "aria-labelledby": "dropdownDividerButton", children: agents.map((agent) => /* @__PURE__ */ jsx("li", { className: "hover:bg-zinc-700 hover:rounded-2xl", onClick: handleAgentChange, "data-agent-id": agent.agent_id, children: /* @__PURE__ */ jsx("span", { className: "inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded", "data-agent-id": agent.agent_id, children: agent.display_name }) }, agent.agent_id)) }) })
       ] }),
       /* @__PURE__ */ jsx("div", { className: "relative flex flex-1 overflow-hidden", children: isFirstMessage ? /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col items-center justify-center", children: [
         /* @__PURE__ */ jsx("h1", { className: "mb-8 text-2xl font-medium text-white/80", children: "What are you working on?" }),

package/dist/index.es3.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es3.js","sources":["../src/pages/Chat/Chat.tsx"],"sourcesContent":["import ChatBody from \"@/components/ChatBody\";\nimport ChatInput from \"@/components/sidebar/ChatInput\";\nimport ThreadHistory from \"@/components/threads/ThreadHistory\";\nimport { useChatRuntime } from \"@/providers/ChatRuntime\";\nimport { useFileProvider } from \"@/providers/FileProvider\";\nimport { useStreamContext } from \"@/providers/Stream\";\nimport { useThread } from \"@/providers/Thread\";\nimport type { ChatUIProps } from \"@/types/ChatProps\";\nimport type { FileInfo } from \"@/types/fileInput\";\nimport type { Message } from \"@langchain/langgraph-sdk\";\nimport { useEffect, useState, type FormEvent } from \"react\";\nimport { v4 as uuidv4 } from \"uuid\";\n\nexport function Chat({chatProps}: {chatProps?: ChatUIProps}) {\n    const { callThisOnSubmit, handleFileSelect, enableToolCallIndicator } = chatProps || {};\n    const [isFirstMessage, setIsFirstMessage] = useState(true);\n    const [input, setInput] = useState(\"\");\n    const [isDropdownOpen, setIsDropdownOpen] = useState(false);\n    const { fileInput, setFileInput } = useFileProvider();\n    const [agents, setAgents] = useState<Array<string>>([]);\n    const { fetchCatalog } = useStreamContext();\n    const stream = useStreamContext();\n    const { assistantId, setAssistantId } = useChatRuntime();\n    const isLoading = stream.isLoading;\n    const { setMode, threadId } = useThread();\n\n    useEffect(() => {\n        // Fetch the agent catalog on component mount\n        fetchCatalog();\n        setAgents([\"V3ya_external_agent\", \"chat_agent\"]);\n    }, [fetchCatalog]);\n\n    const handleAgentChange = (event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\n        const selectedAgent = (event.target as HTMLElement).innerText;\n        console.log(\"Selected agent:\", selectedAgent);\n        setAssistantId(selectedAgent);\n        setIsDropdownOpen(false);\n    }\n\n\n    // Set thread mode to multi when using Chat\n    useEffect(() => {\n        setMode(\"multi\");\n    }, [setMode]);\n\n    // Update isFirstMessage based on thread messages\n    useEffect(() => {\n        if (stream.messages && stream.messages.length > 0) {\n            setIsFirstMessage(false);\n        } else {\n            setIsFirstMessage(true);\n        }\n    }, [threadId, stream.messages]);\n\n    const defaultHandleSubmit = async (e: FormEvent) => {\n        e.preventDefault();\n\n        if ((input.trim().length === 0 && fileInput.length === 0) || isLoading)\n            return;\n\n        // console.log(\"Submitting with input:\", input);\n\n        // Call the custom upload and get the latest files\n        let latestFiles: FileInfo[] = fileInput;\n        if (callThisOnSubmit) {\n            const result = await callThisOnSubmit();\n            if (result && result.length > 0) latestFiles = result;\n        }\n\n        // console.log(\"Using files for submission:\", latestFiles);\n\n        const contentBlocks = [\n            ...(input.trim().length > 0 ? [{ type: \"text\", text: input }] : []),\n            ...latestFiles.map((file) => ({\n                type: \"document\" as const,\n                ...file,\n                cache_control: { type: \"ephemeral\" as const },\n            })),\n        ] as unknown as Message[\"content\"];\n\n        const newHumanMessage: Message = {\n            id: uuidv4(),\n            type: \"human\",\n            content: contentBlocks,\n        };\n\n        // Use the unified submitMessage function\n        await stream.submitMessage(newHumanMessage);\n\n        setIsFirstMessage(false);\n        setInput(\"\");\n        setFileInput([]);\n    };\n\n    const defaultHandleFileSelect = async (\n        event: React.ChangeEvent<HTMLInputElement>\n    ) => {\n        const files = event.target.files;\n        if (!files) return;\n\n        // Convert files to base64 for sending\n        const fileDetails: FileInfo[] = await Promise.all(\n            Array.from(files).map(async (file) => {\n                const base64Data = await new Promise<string>((resolve, reject) => {\n                    const reader = new FileReader();\n                    reader.onload = () => {\n                        const result = reader.result as string;\n                        resolve(result.split(\",\")[1]); // Remove data:...;base64, prefix\n                    };\n                    reader.onerror = reject;\n                    reader.readAsDataURL(file);\n                });\n\n                return {\n                    fileName: file.name,\n                    fileType: file.type,\n                    file: file,\n                    fileData: base64Data, // Add this to your FileInfo type\n                };\n            })\n        );\n\n        setFileInput((prevFile) => [...prevFile, ...fileDetails]);\n    };\n\n    const onFileSelect = handleFileSelect || defaultHandleFileSelect;\n\n    return (\n        <div className=\"flex h-screen w-screen bg-[#0f0f0f] text-white\">\n            <ThreadHistory />\n            <main className=\"flex flex-1 flex-col\">\n                {/* Header */}\n                <header className=\"flex h-14 items-center justify-between border-b border-white/10 px-6\">\n                    {/* <span className=\"text-sm text-white/80\">ChatGPT 5.2s</span> */}\n                    {/* <div className=\"flex gap-2\">\n                        <div className=\"h-8 w-8 rounded-full bg-white/10\" />\n                        <div className=\"h-8 w-8 rounded-full bg-white/10\" />\n                    </div> */}\n\n                    <button\n                        id=\"dropdownDividerButton\"\n                        onClick={() => setIsDropdownOpen(!isDropdownOpen)}\n                        className=\"inline-flex items-center justify-center text-white bg-brand box-border border rounded-2xl border-transparent hover:bg-brand-strong font-medium leading-5 rounded-base text-sm px-4 py-2.5 bg-zinc-800\"\n                        type=\"button\"\n                    >\n                        {assistantId}\n                        <svg className=\"w-4 h-4 ms-1.5 -me-0.5\" aria-hidden=\"true\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\"><path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m19 9-7 7-7-7\" /></svg>\n                    </button>\n\n                    <div id=\"dropdownDivider\" className={`z-10 absolute top-14 bg-neutral-primary-medium bg-zinc-800 rounded-2xl  divide-y divide-default-medium w-44 ${isDropdownOpen ? '' : 'hidden'}`}>\n                        <ul className=\"p-2 text-sm text-body font-medium\" aria-labelledby=\"dropdownDividerButton\">\n                            {agents.map((agentName) => (\n                                <li key={agentName} className=\"hover:bg-zinc-700 hover:rounded-2xl\" onClick={handleAgentChange}>\n                                    <span className=\"inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded\">{agentName}</span>\n                                </li>\n                            ))}\n                        </ul>\n                        {/* <div className=\"p-2 text-sm text-body font-medium\">\n                            <a href=\"#\" className=\"inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded\">Separated link</a>\n                        </div> */}\n                    </div>\n\n                </header>\n\n                {/* CONTENT AREA */}\n                <div className=\"relative flex flex-1 overflow-hidden\">\n                    {isFirstMessage ?\n                        <div className=\"flex flex-1 flex-col items-center justify-center\">\n                            <h1 className=\"mb-8 text-2xl font-medium text-white/80\">\n                                What are you working on?\n                            </h1>\n\n                            <div className=\"w-full max-w-2xl px-4\">\n                                <ChatInput input={input} setInput={setInput} handleSubmit={defaultHandleSubmit} fileInput={fileInput} setFileInput={setFileInput} handleFileSelect={onFileSelect} />\n                            </div>\n                        </div> :\n                        // =========================\n                        // CHAT STATE (after message)\n                        // =========================\n                        <div className=\"flex h-full w-full flex-col\">\n                            <div className=\"flex-1 overflow-y-auto thread-scrollbar\">\n                                <div className=\"mx-auto max-w-3xl px-4 py-6\">\n                                    <ChatBody setIsFirstMessage={setIsFirstMessage} enableToolCallIndicator={enableToolCallIndicator} />\n                                </div>\n                            </div>\n\n                            <div className=\"border-t border-white/10 p-1\">\n                                <div className=\"mx-auto max-w-3xl\">\n                                    <ChatInput input={input} setInput={setInput} handleSubmit={defaultHandleSubmit} fileInput={fileInput} setFileInput={setFileInput} handleFileSelect={onFileSelect} />\n                                </div>\n                            </div>\n                        </div>\n                    }\n                </div>\n            </main>\n        </div>\n    )\n}\n"],"names":["uuidv4"],"mappings":";;;;;;;;;;AAaO,SAAS,KAAK,EAAC,aAAuC;AACzD,QAAM,EAAE,kBAAkB,kBAAkB,wBAAA,IAA4B,aAAa,CAAA;AACrF,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,IAAI;AACzD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D,QAAM,EAAE,WAAW,aAAA,IAAiB,gBAAA;AACpC,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAwB,CAAA,CAAE;AACtD,QAAM,EAAE,aAAA,IAAiB,iBAAA;AACzB,QAAM,SAAS,iBAAA;AACf,QAAM,EAAE,aAAa,eAAA,IAAmB,eAAA;AACxC,QAAM,YAAY,OAAO;AACzB,QAAM,EAAE,SAAS,SAAA,IAAa,UAAA;AAE9B,YAAU,MAAM;AAEZ,iBAAA;AACA,cAAU,CAAC,uBAAuB,YAAY,CAAC;AAAA,EACnD,GAAG,CAAC,YAAY,CAAC;AAEjB,QAAM,oBAAoB,CAAC,UAAuD;AAC9E,UAAM,gBAAiB,MAAM,OAAuB;AACpD,YAAQ,IAAI,mBAAmB,aAAa;AAC5C,mBAAe,aAAa;AAC5B,sBAAkB,KAAK;AAAA,EAC3B;AAIA,YAAU,MAAM;AACZ,YAAQ,OAAO;AAAA,EACnB,GAAG,CAAC,OAAO,CAAC;AAGZ,YAAU,MAAM;AACZ,QAAI,OAAO,YAAY,OAAO,SAAS,SAAS,GAAG;AAC/C,wBAAkB,KAAK;AAAA,IAC3B,OAAO;AACH,wBAAkB,IAAI;AAAA,IAC1B;AAAA,EACJ,GAAG,CAAC,UAAU,OAAO,QAAQ,CAAC;AAE9B,QAAM,sBAAsB,OAAO,MAAiB;AAChD,MAAE,eAAA;AAEF,QAAK,MAAM,KAAA,EAAO,WAAW,KAAK,UAAU,WAAW,KAAM;AACzD;AAKJ,QAAI,cAA0B;AAC9B,QAAI,kBAAkB;AAClB,YAAM,SAAS,MAAM,iBAAA;AACrB,UAAI,UAAU,OAAO,SAAS,EAAG,eAAc;AAAA,IACnD;AAIA,UAAM,gBAAgB;AAAA,MAClB,GAAI,MAAM,OAAO,SAAS,IAAI,CAAC,EAAE,MAAM,QAAQ,MAAM,MAAA,CAAO,IAAI,CAAA;AAAA,MAChE,GAAG,YAAY,IAAI,CAAC,UAAU;AAAA,QAC1B,MAAM;AAAA,QACN,GAAG;AAAA,QACH,eAAe,EAAE,MAAM,YAAA;AAAA,MAAqB,EAC9C;AAAA,IAAA;AAGN,UAAM,kBAA2B;AAAA,MAC7B,IAAIA,GAAA;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAIb,UAAM,OAAO,cAAc,eAAe;AAE1C,sBAAkB,KAAK;AACvB,aAAS,EAAE;AACX,iBAAa,CAAA,CAAE;AAAA,EACnB;AAEA,QAAM,0BAA0B,OAC5B,UACC;AACD,UAAM,QAAQ,MAAM,OAAO;AAC3B,QAAI,CAAC,MAAO;AAGZ,UAAM,cAA0B,MAAM,QAAQ;AAAA,MAC1C,MAAM,KAAK,KAAK,EAAE,IAAI,OAAO,SAAS;AAClC,cAAM,aAAa,MAAM,IAAI,QAAgB,CAAC,SAAS,WAAW;AAC9D,gBAAM,SAAS,IAAI,WAAA;AACnB,iBAAO,SAAS,MAAM;AAClB,kBAAM,SAAS,OAAO;AACtB,oBAAQ,OAAO,MAAM,GAAG,EAAE,CAAC,CAAC;AAAA,UAChC;AACA,iBAAO,UAAU;AACjB,iBAAO,cAAc,IAAI;AAAA,QAC7B,CAAC;AAED,eAAO;AAAA,UACH,UAAU,KAAK;AAAA,UACf,UAAU,KAAK;AAAA,UACf;AAAA,UACA,UAAU;AAAA;AAAA,QAAA;AAAA,MAElB,CAAC;AAAA,IAAA;AAGL,iBAAa,CAAC,aAAa,CAAC,GAAG,UAAU,GAAG,WAAW,CAAC;AAAA,EAC5D;AAEA,QAAM,eAAe,oBAAoB;AAEzC,SACI,qBAAC,OAAA,EAAI,WAAU,kDACX,UAAA;AAAA,IAAA,oBAAC,eAAA,EAAc;AAAA,IACf,qBAAC,QAAA,EAAK,WAAU,wBAEZ,UAAA;AAAA,MAAA,qBAAC,UAAA,EAAO,WAAU,wEAOd,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,IAAG;AAAA,YACH,SAAS,MAAM,kBAAkB,CAAC,cAAc;AAAA,YAChD,WAAU;AAAA,YACV,MAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cACD,oBAAC,OAAA,EAAI,WAAU,0BAAyB,eAAY,QAAO,OAAM,8BAA6B,OAAM,MAAK,QAAO,MAAK,MAAK,QAAO,SAAQ,aAAY,UAAA,oBAAC,QAAA,EAAK,QAAO,gBAAe,kBAAe,SAAQ,mBAAgB,SAAQ,gBAAa,KAAI,GAAE,gBAAA,CAAgB,EAAA,CAAE;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAGzQ,oBAAC,OAAA,EAAI,IAAG,mBAAkB,WAAW,+GAA+G,iBAAiB,KAAK,QAAQ,IAC9K,UAAA,oBAAC,MAAA,EAAG,WAAU,qCAAoC,mBAAgB,yBAC7D,UAAA,OAAO,IAAI,CAAC,cACT,oBAAC,MAAA,EAAmB,WAAU,uCAAsC,SAAS,mBACzE,UAAA,oBAAC,QAAA,EAAK,WAAU,mGAAmG,UAAA,UAAA,CAAU,KADxH,SAET,CACH,GACL,EAAA,CAIJ;AAAA,MAAA,GAEJ;AAAA,MAGA,oBAAC,SAAI,WAAU,wCACV,2BACG,qBAAC,OAAA,EAAI,WAAU,oDACX,UAAA;AAAA,QAAA,oBAAC,MAAA,EAAG,WAAU,2CAA0C,UAAA,4BAExD;AAAA,QAEA,oBAAC,OAAA,EAAI,WAAU,yBACX,8BAAC,WAAA,EAAU,OAAc,UAAoB,cAAc,qBAAqB,WAAsB,cAA4B,kBAAkB,cAAc,EAAA,CACtK;AAAA,MAAA,GACJ;AAAA;AAAA;AAAA;AAAA,QAIA,qBAAC,OAAA,EAAI,WAAU,+BACX,UAAA;AAAA,UAAA,oBAAC,OAAA,EAAI,WAAU,2CACX,UAAA,oBAAC,OAAA,EAAI,WAAU,+BACX,UAAA,oBAAC,UAAA,EAAS,mBAAsC,wBAAA,CAAkD,EAAA,CACtG,GACJ;AAAA,8BAEC,OAAA,EAAI,WAAU,gCACX,UAAA,oBAAC,OAAA,EAAI,WAAU,qBACX,UAAA,oBAAC,aAAU,OAAc,UAAoB,cAAc,qBAAqB,WAAsB,cAA4B,kBAAkB,aAAA,CAAc,GACtK,EAAA,CACJ;AAAA,QAAA,EAAA,CACJ;AAAA,QAAA,CAER;AAAA,IAAA,EAAA,CACJ;AAAA,EAAA,GACJ;AAER;"}
+{"version":3,"file":"index.es3.js","sources":["../src/pages/Chat/Chat.tsx"],"sourcesContent":["import ChatBody from \"@/components/ChatBody\";\nimport ChatInput from \"@/components/sidebar/ChatInput\";\nimport ThreadHistory from \"@/components/threads/ThreadHistory\";\nimport { useChatRuntime } from \"@/providers/ChatRuntime\";\nimport { useFileProvider } from \"@/providers/FileProvider\";\nimport { useStreamContext } from \"@/providers/Stream\";\nimport { useThread } from \"@/providers/Thread\";\nimport type { ChatUIProps } from \"@/types/ChatProps\";\nimport type { FileInfo } from \"@/types/fileInput\";\nimport type { Message } from \"@langchain/langgraph-sdk\";\nimport { useEffect, useState, type FormEvent } from \"react\";\nimport { v4 as uuidv4 } from \"uuid\";\n\nexport function Chat({chatProps}: {chatProps?: ChatUIProps}) {\n    const { callThisOnSubmit, handleFileSelect, enableToolCallIndicator } = chatProps || {};\n    const [isFirstMessage, setIsFirstMessage] = useState(true);\n    const [input, setInput] = useState(\"\");\n    const [isDropdownOpen, setIsDropdownOpen] = useState(false);\n    const { fileInput, setFileInput } = useFileProvider();\n    const [agents, setAgents] = useState<Array<{agent_id: string; display_name: string}>>([]);\n    const { fetchCatalog } = useStreamContext();\n    const stream = useStreamContext();\n    const { assistantId, setAssistantId } = useChatRuntime();\n    const isLoading = stream.isLoading;\n    const { setMode, threadId } = useThread();\n\n    useEffect(() => {\n        // Fetch the agent catalog on component mount\n        const loadCatalog = async () => {\n            try {\n                const catalog = await fetchCatalog();\n                if (catalog && Array.isArray(catalog)) {\n                    // Extract agent_id and display_name from catalog\n                    const agentList = catalog.map((agent) => ({\n                        agent_id: agent.agent_id,\n                        display_name: agent.display_name,\n                    }));\n                    setAgents(agentList);\n                    // console.log(\"Loaded agents from catalog:\", agentList);\n                }\n            } catch (error) {\n                console.error(\"Failed to load agent catalog:\", error);\n            }\n        };\n        \n        loadCatalog();\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []); // Only run once on mount\n\n    const handleAgentChange = (event: React.MouseEvent<HTMLLIElement, MouseEvent>) => {\n        const selectedAgent = (event.target as HTMLElement).getAttribute(\"data-agent-id\");\n        if (selectedAgent) {\n            console.log(\"Selected agent:\", selectedAgent);\n            setAssistantId(selectedAgent);\n            setIsDropdownOpen(false);\n        }\n    }\n\n\n    // Set thread mode to multi when using Chat\n    useEffect(() => {\n        setMode(\"multi\");\n    }, [setMode]);\n\n    // Update isFirstMessage based on thread messages\n    useEffect(() => {\n        if (stream.messages && stream.messages.length > 0) {\n            setIsFirstMessage(false);\n        } else {\n            setIsFirstMessage(true);\n        }\n    }, [threadId, stream.messages]);\n\n    const defaultHandleSubmit = async (e: FormEvent) => {\n        e.preventDefault();\n\n        if ((input.trim().length === 0 && fileInput.length === 0) || isLoading)\n            return;\n\n        // console.log(\"Submitting with input:\", input);\n\n        // Call the custom upload and get the latest files\n        let latestFiles: FileInfo[] = fileInput;\n        if (callThisOnSubmit) {\n            const result = await callThisOnSubmit();\n            if (result && result.length > 0) latestFiles = result;\n        }\n\n        // console.log(\"Using files for submission:\", latestFiles);\n\n        const contentBlocks = [\n            ...(input.trim().length > 0 ? [{ type: \"text\", text: input }] : []),\n            ...latestFiles.map((file) => ({\n                type: \"document\" as const,\n                ...file,\n                cache_control: { type: \"ephemeral\" as const },\n            })),\n        ] as unknown as Message[\"content\"];\n\n        const newHumanMessage: Message = {\n            id: uuidv4(),\n            type: \"human\",\n            content: contentBlocks,\n        };\n\n        // Use the unified submitMessage function\n        await stream.submitMessage(newHumanMessage);\n\n        setIsFirstMessage(false);\n        setInput(\"\");\n        setFileInput([]);\n    };\n\n    const defaultHandleFileSelect = async (\n        event: React.ChangeEvent<HTMLInputElement>\n    ) => {\n        const files = event.target.files;\n        if (!files) return;\n\n        // Convert files to base64 for sending\n        const fileDetails: FileInfo[] = await Promise.all(\n            Array.from(files).map(async (file) => {\n                const base64Data = await new Promise<string>((resolve, reject) => {\n                    const reader = new FileReader();\n                    reader.onload = () => {\n                        const result = reader.result as string;\n                        resolve(result.split(\",\")[1]); // Remove data:...;base64, prefix\n                    };\n                    reader.onerror = reject;\n                    reader.readAsDataURL(file);\n                });\n\n                return {\n                    fileName: file.name,\n                    fileType: file.type,\n                    file: file,\n                    fileData: base64Data, // Add this to your FileInfo type\n                };\n            })\n        );\n\n        setFileInput((prevFile) => [...prevFile, ...fileDetails]);\n    };\n\n    const onFileSelect = handleFileSelect || defaultHandleFileSelect;\n\n    return (\n        <div className=\"flex h-screen w-screen bg-[#0f0f0f] text-white\">\n            <ThreadHistory />\n            <main className=\"flex flex-1 flex-col\">\n                {/* Header */}\n                <header className=\"flex h-14 items-center justify-between border-b border-white/10 px-6\">\n                    {/* <span className=\"text-sm text-white/80\">ChatGPT 5.2s</span> */}\n                    {/* <div className=\"flex gap-2\">\n                        <div className=\"h-8 w-8 rounded-full bg-white/10\" />\n                        <div className=\"h-8 w-8 rounded-full bg-white/10\" />\n                    </div> */}\n\n                    <button\n                        id=\"dropdownDividerButton\"\n                        onClick={() => setIsDropdownOpen(!isDropdownOpen)}\n                        className=\"inline-flex items-center justify-center text-white bg-brand box-border border rounded-2xl border-transparent hover:bg-brand-strong font-medium leading-5 rounded-base text-sm px-4 py-2.5 bg-zinc-800\"\n                        type=\"button\"\n                    >\n                        {assistantId}\n                        <svg className=\"w-4 h-4 ms-1.5 -me-0.5\" aria-hidden=\"true\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\" viewBox=\"0 0 24 24\"><path stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"m19 9-7 7-7-7\" /></svg>\n                    </button>\n\n                    <div id=\"dropdownDivider\" className={`z-10 absolute top-14 bg-neutral-primary-medium bg-zinc-800 rounded-2xl  divide-y divide-default-medium w-44 ${isDropdownOpen ? '' : 'hidden'}`}>\n                        <ul className=\"p-2 text-sm text-body font-medium\" aria-labelledby=\"dropdownDividerButton\">\n                            {agents.map((agent) => (\n                                <li key={agent.agent_id} className=\"hover:bg-zinc-700 hover:rounded-2xl\" onClick={handleAgentChange} data-agent-id={agent.agent_id}>\n                                    <span className=\"inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded\" data-agent-id={agent.agent_id}>{agent.display_name}</span>\n                                </li>\n                            ))}\n                        </ul>\n                        {/* <div className=\"p-2 text-sm text-body font-medium\">\n                            <a href=\"#\" className=\"inline-flex items-center w-full p-2 hover:bg-neutral-tertiary-medium hover:text-heading rounded\">Separated link</a>\n                        </div> */}\n                    </div>\n\n                </header>\n\n                {/* CONTENT AREA */}\n                <div className=\"relative flex flex-1 overflow-hidden\">\n                    {isFirstMessage ?\n                        <div className=\"flex flex-1 flex-col items-center justify-center\">\n                            <h1 className=\"mb-8 text-2xl font-medium text-white/80\">\n                                What are you working on?\n                            </h1>\n\n                            <div className=\"w-full max-w-2xl px-4\">\n                                <ChatInput input={input} setInput={setInput} handleSubmit={defaultHandleSubmit} fileInput={fileInput} setFileInput={setFileInput} handleFileSelect={onFileSelect} />\n                            </div>\n                        </div> :\n                        // =========================\n                        // CHAT STATE (after message)\n                        // =========================\n                        <div className=\"flex h-full w-full flex-col\">\n                            <div className=\"flex-1 overflow-y-auto thread-scrollbar\">\n                                <div className=\"mx-auto max-w-3xl px-4 py-6\">\n                                    <ChatBody setIsFirstMessage={setIsFirstMessage} enableToolCallIndicator={enableToolCallIndicator} />\n                                </div>\n                            </div>\n\n                            <div className=\"border-t border-white/10 p-1\">\n                                <div className=\"mx-auto max-w-3xl\">\n                                    <ChatInput input={input} setInput={setInput} handleSubmit={defaultHandleSubmit} fileInput={fileInput} setFileInput={setFileInput} handleFileSelect={onFileSelect} />\n                                </div>\n                            </div>\n                        </div>\n                    }\n                </div>\n            </main>\n        </div>\n    )\n}\n"],"names":["uuidv4"],"mappings":"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"}

package/dist/index.es300.js

@@ -28,7 +28,7 @@ import { parseTupleDef } from "./index.es327.js";
 import { parseUndefinedDef } from "./index.es328.js";
 import { parseUnknownDef } from "./index.es329.js";
 import { parseReadonlyDef } from "./index.es330.js";
-import { ZodFirstPartyTypeKind } from "./index.es108.js";
+import { ZodFirstPartyTypeKind } from "./index.es109.js";
 const selectParser = (def, typeName, refs) => {
   switch (typeName) {
     case ZodFirstPartyTypeKind.ZodString:

package/dist/index.es302.js

@@ -1,6 +1,6 @@
 import { setResponseValueAndErrors } from "./index.es301.js";
 import { parseDef } from "./index.es270.js";
-import { ZodFirstPartyTypeKind } from "./index.es108.js";
+import { ZodFirstPartyTypeKind } from "./index.es109.js";
 function parseArrayDef(def, refs) {
   const res = { type: "array" };
   if (def.type?._def && def.type?._def?.typeName !== ZodFirstPartyTypeKind.ZodAny) res.items = parseDef(def.type._def, {

package/dist/index.es31.js

@@ -1,11 +1,11 @@
 import "./index.es18.js";
-import { isBaseMessageChunk } from "./index.es39.js";
-import { HumanMessageChunk } from "./index.es40.js";
-import { AIMessageChunk } from "./index.es41.js";
-import { SystemMessageChunk } from "./index.es42.js";
-import { ToolMessageChunk } from "./index.es43.js";
-import { RemoveMessage } from "./index.es44.js";
-import { coerceMessageLikeToMessage, convertToChunk } from "./index.es45.js";
+import { isBaseMessageChunk } from "./index.es43.js";
+import { HumanMessageChunk } from "./index.es44.js";
+import { AIMessageChunk } from "./index.es45.js";
+import { SystemMessageChunk } from "./index.es46.js";
+import { ToolMessageChunk } from "./index.es47.js";
+import { RemoveMessage } from "./index.es48.js";
+import { coerceMessageLikeToMessage, convertToChunk } from "./index.es49.js";
 function tryConvertToChunk(message) {
   try {
     if (isBaseMessageChunk(message)) return message;

package/dist/index.es314.js

@@ -2,7 +2,7 @@ import { parseAnyDef } from "./index.es269.js";
 import { parseBrandedDef } from "./index.es305.js";
 import { parseStringDef } from "./index.es313.js";
 import { parseDef } from "./index.es270.js";
-import { ZodFirstPartyTypeKind } from "./index.es108.js";
+import { ZodFirstPartyTypeKind } from "./index.es109.js";
 function parseRecordDef(def, refs) {
   if (refs.target === "openAi") console.warn("Warning: OpenAI may not support records in schemas! Try an array of key-value pairs instead.");
   if (refs.target === "openApi3" && def.keyType?._def.typeName === ZodFirstPartyTypeKind.ZodEnum) return {

package/dist/index.es32.js

@@ -1,4 +1,4 @@
-import { StreamError } from "./index.es46.js";
+import { StreamError } from "./index.es38.js";
 import { toMessageDict } from "./index.es31.js";
 const REMOVE_ALL_MESSAGES = "__remove_all__";
 var StreamManager = class {

package/dist/index.es334.js

@@ -1,5 +1,5 @@
-import { deepCompareStrict } from "./index.es246.js";
-import { dereference } from "./index.es249.js";
+import { deepCompareStrict } from "./index.es203.js";
+import { dereference } from "./index.es206.js";
 import { format } from "./index.es332.js";
 import { encodePointer } from "./index.es331.js";
 import { ucs2length } from "./index.es333.js";

package/dist/index.es35.js

@@ -1,7 +1,7 @@
-import { Client, getClientConfigHash } from "./index.es47.js";
-import { findLast, unique } from "./index.es48.js";
-import { StreamError } from "./index.es46.js";
-import { getBranchContext } from "./index.es49.js";
+import { Client, getClientConfigHash } from "./index.es36.js";
+import { findLast, unique } from "./index.es37.js";
+import { StreamError } from "./index.es38.js";
+import { getBranchContext } from "./index.es39.js";
 import { MessageTupleManager } from "./index.es31.js";
 import { StreamManager } from "./index.es32.js";
 import { getToolCallsWithResults } from "./index.es33.js";