@superinterface/react 2.1.1 → 2.2.0

package/dist/index.js

@@ -654,8 +654,23 @@ var AssistantNameContext = createContext4("Assistant");
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
 import { Flex as Flex10 } from "@radix-ui/themes";
 // src/components/threads/Thread/Message/index.tsx
-import { useMemo as useMemo4 } from "react";
+import { useMemo as useMemo4, Fragment } from "react";
 import { Box as Box9 } from "@radix-ui/themes";
+// src/components/skeletons/StartingContentSkeleton/index.tsx
+import { Skeleton as Skeleton2 } from "@radix-ui/themes";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var StartingContentSkeleton = function() {
+    return /* @__PURE__ */ jsx7(Skeleton2, {
+        loading: true,
+        mt: "1",
+        height: "var(--space-4)",
+        width: "var(--space-4)",
+        style: {
+            borderRadius: "var(--radius-6)",
+            flexShrink: 0
+        }
+    });
+};
 // src/components/runSteps/RunSteps/index.tsx
 import { Flex as Flex9 } from "@radix-ui/themes";
 // src/components/runSteps/RunStep/ToolCalls/index.tsx
@@ -671,14 +686,14 @@ var FunctionComponentsContext = createContext5({});
 import { PopoverRoot, PopoverContent } from "@radix-ui/themes";
 // src/components/toolCalls/ToolCallBase/index.tsx
 import { Flex as Flex5, Button, PopoverTrigger } from "@radix-ui/themes";
-import { jsx as jsx7 } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var ToolCallBase = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx7(Flex5, {
+    return /* @__PURE__ */ jsx8(Flex5, {
         py: "1",
         ml: "-2",
-        children: /* @__PURE__ */ jsx7(PopoverTrigger, {
-            children: /* @__PURE__ */ jsx7(Button, {
+        children: /* @__PURE__ */ jsx8(PopoverTrigger, {
+            children: /* @__PURE__ */ jsx8(Button, {
                 size: "1",
                 color: "gold",
                 variant: "outline",
@@ -692,31 +707,31 @@ var ToolCallBase = function(param) {
 };
 // src/components/toolCalls/ToolCallBase/ToolCallTitle.tsx
 import { Text as Text2 } from "@radix-ui/themes";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var ToolCallTitle = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx8(Text2, {
+    return /* @__PURE__ */ jsx9(Text2, {
         weight: "regular",
         children: children
     });
 };
 // src/components/functions/FunctionBase/Icon.tsx
 import { CircleIcon, CircleBackslashIcon, CheckCircledIcon } from "@radix-ui/react-icons";
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
 var Icon = function(param) {
     var runStep = param.runStep;
     if (runStep.completed_at) {
-        return /* @__PURE__ */ jsx9(CheckCircledIcon, {});
+        return /* @__PURE__ */ jsx10(CheckCircledIcon, {});
     } else if (runStep.cancelled_at || runStep.failed_at || runStep.status === "expired") {
-        return /* @__PURE__ */ jsx9(CircleBackslashIcon, {});
+        return /* @__PURE__ */ jsx10(CircleBackslashIcon, {});
     } else {
-        return /* @__PURE__ */ jsx9(CircleIcon, {});
+        return /* @__PURE__ */ jsx10(CircleIcon, {});
     }
 };
 // src/components/functions/FunctionBase/Content.tsx
 import { useMemo as useMemo3 } from "react";
 import { Code, Box as Box2 } from "@radix-ui/themes";
-import { jsx as jsx10, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs2 } from "react/jsx-runtime";
 var Content = function(param) {
     var fn = param.fn;
     var args = useMemo3(function() {
@@ -755,36 +770,36 @@ var Content = function(param) {
             wordBreak: "break-word"
         },
         children: [
-            /* @__PURE__ */ jsx10(Box2, {
+            /* @__PURE__ */ jsx11(Box2, {
                 children: args && JSON.stringify(args, null, 2)
             }),
-            /* @__PURE__ */ jsx10(Box2, {
+            /* @__PURE__ */ jsx11(Box2, {
                 children: output && JSON.stringify(output, null, 2)
             })
         ]
     });
 };
 // src/components/functions/FunctionBase/index.tsx
-import { jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs3 } from "react/jsx-runtime";
 var FunctionBase = function(param) {
     var fn = param.fn, runStep = param.runStep, title2 = param.title;
     return /* @__PURE__ */ jsxs3(PopoverRoot, {
         children: [
             /* @__PURE__ */ jsxs3(ToolCallBase, {
                 children: [
-                    /* @__PURE__ */ jsx11(Icon, {
+                    /* @__PURE__ */ jsx12(Icon, {
                         runStep: runStep
                     }),
-                    /* @__PURE__ */ jsx11(ToolCallTitle, {
+                    /* @__PURE__ */ jsx12(ToolCallTitle, {
                         children: title2
                     })
                 ]
             }),
-            /* @__PURE__ */ jsx11(PopoverContent, {
+            /* @__PURE__ */ jsx12(PopoverContent, {
                 style: {
-                    maxHeight: "500px"
+                    maxHeight: "200px"
                 },
-                children: /* @__PURE__ */ jsx11(Content, {
+                children: /* @__PURE__ */ jsx12(Content, {
                     fn: fn
                 })
             })
@@ -803,10 +818,10 @@ var title = function(param) {
     }
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/Fn/DefaultFunction/index.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var DefaultFunction = function(param) {
     var fn = param.fn, runStep = param.runStep;
-    return /* @__PURE__ */ jsx12(FunctionBase, {
+    return /* @__PURE__ */ jsx13(FunctionBase, {
         fn: fn,
         runStep: runStep,
         title: title({
@@ -816,66 +831,66 @@ var DefaultFunction = function(param) {
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/Fn/index.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var Fn = function(param) {
     var fn = param.fn, runStep = param.runStep;
     var functionComponentsContext = useContext4(FunctionComponentsContext);
     var Component = functionComponentsContext[fn.name] || DefaultFunction;
     return(// @ts-ignore-next-line
-    /* @__PURE__ */ jsx13(Component, {
+    /* @__PURE__ */ jsx14(Component, {
         fn: fn,
         runStep: runStep
     }));
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/CodeInterpreter/index.tsx
 import { Flex as Flex6 } from "@radix-ui/themes";
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var CodeInterpreter = function(param) {
     var codeInterpreter = param.codeInterpreter;
-    return /* @__PURE__ */ jsx14(Flex6, {
+    return /* @__PURE__ */ jsx15(Flex6, {
         children: codeInterpreter.input
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/index.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 var ToolCall = function(param) {
     var toolCall = param.toolCall, runStep = param.runStep;
     if (toolCall.type === "function") {
-        return /* @__PURE__ */ jsx15(Fn, {
+        return /* @__PURE__ */ jsx16(Fn, {
             fn: toolCall.function,
             runStep: runStep
         });
     }
     if (toolCall.type === "code_interpreter") {
-        return /* @__PURE__ */ jsx15(CodeInterpreter, {
+        return /* @__PURE__ */ jsx16(CodeInterpreter, {
             codeInterpreter: toolCall.code_interpreter,
             runStep: runStep
         });
     }
-    return /* @__PURE__ */ jsx15(Flex7, {
+    return /* @__PURE__ */ jsx16(Flex7, {
         children: toolCall.type
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/Starting/index.tsx
 import { PopoverRoot as PopoverRoot2, PopoverContent as PopoverContent2, Text as Text3 } from "@radix-ui/themes";
 import { CircleIcon as CircleIcon2 } from "@radix-ui/react-icons";
-import { jsx as jsx16, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs4 } from "react/jsx-runtime";
 var Starting = function() {
     return /* @__PURE__ */ jsxs4(PopoverRoot2, {
         children: [
             /* @__PURE__ */ jsxs4(ToolCallBase, {
                 children: [
-                    /* @__PURE__ */ jsx16(CircleIcon2, {}),
-                    /* @__PURE__ */ jsx16(ToolCallTitle, {
+                    /* @__PURE__ */ jsx17(CircleIcon2, {}),
+                    /* @__PURE__ */ jsx17(ToolCallTitle, {
                         children: "Starting actions"
                     })
                 ]
             }),
-            /* @__PURE__ */ jsx16(PopoverContent2, {
+            /* @__PURE__ */ jsx17(PopoverContent2, {
                 style: {
                     maxHeight: "500px"
                 },
-                children: /* @__PURE__ */ jsx16(Text3, {
+                children: /* @__PURE__ */ jsx17(Text3, {
                     children: "Getting ready to connect to domain API"
                 })
             })
@@ -883,15 +898,15 @@ var Starting = function() {
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/index.tsx
-import { jsx as jsx17, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs5 } from "react/jsx-runtime";
 var ToolCalls = function(param) {
     var stepDetails = param.stepDetails, runStep = param.runStep;
     return /* @__PURE__ */ jsxs5(Flex8, {
         direction: "column",
         children: [
-            !stepDetails.tool_calls.length && /* @__PURE__ */ jsx17(Starting, {}),
+            !stepDetails.tool_calls.length && /* @__PURE__ */ jsx18(Starting, {}),
             stepDetails.tool_calls.map(function(toolCall) {
-                return /* @__PURE__ */ jsx17(ToolCall, {
+                return /* @__PURE__ */ jsx18(ToolCall, {
                     toolCall: toolCall,
                     runStep: runStep
                 }, toolCall.id);
@@ -900,11 +915,11 @@ var ToolCalls = function(param) {
     });
 };
 // src/components/runSteps/RunStep/index.tsx
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var RunStep = function(param) {
     var runStep = param.runStep;
     if (runStep.step_details.type === "tool_calls") {
-        return /* @__PURE__ */ jsx18(ToolCalls, {
+        return /* @__PURE__ */ jsx19(ToolCalls, {
             stepDetails: runStep.step_details,
             runStep: runStep
         });
@@ -912,13 +927,13 @@ var RunStep = function(param) {
     return null;
 };
 // src/components/runSteps/RunSteps/index.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 var RunSteps = function(param) {
     var runSteps = param.runSteps;
-    return /* @__PURE__ */ jsx19(Flex9, {
+    return /* @__PURE__ */ jsx20(Flex9, {
         direction: "column-reverse",
         children: runSteps.map(function(runStep) {
-            return /* @__PURE__ */ jsx19(RunStep, {
+            return /* @__PURE__ */ jsx20(RunStep, {
                 runStep: runStep
             }, runStep.id);
         })
@@ -939,12 +954,12 @@ import { useContext as useContext5 } from "react";
 import { createContext as createContext7 } from "react";
 // src/contexts/markdown/MarkdownContext/lib/components/Paragraph.tsx
 import { Box as Box3, Text as Text4 } from "@radix-ui/themes";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 var Paragraph = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx20(Box3, {
+    return /* @__PURE__ */ jsx21(Box3, {
         pb: "3",
-        children: /* @__PURE__ */ jsx20(Text4, {
+        children: /* @__PURE__ */ jsx21(Text4, {
             size: "3",
             style: {
                 whiteSpace: "pre-line",
@@ -956,23 +971,23 @@ var Paragraph = function(param) {
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Link.tsx
 import { Link as RadixLink } from "@radix-ui/themes";
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 var Link = function(param) {
     var children = param.children, href = param.href;
-    return /* @__PURE__ */ jsx21(RadixLink, {
+    return /* @__PURE__ */ jsx22(RadixLink, {
         href: href,
         children: children
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/UnorderedList.tsx
 import { Box as Box4 } from "@radix-ui/themes";
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 var UnorderedList = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx22(Box4, {
+    return /* @__PURE__ */ jsx23(Box4, {
         pb: "3",
         asChild: true,
-        children: /* @__PURE__ */ jsx22("ul", {
+        children: /* @__PURE__ */ jsx23("ul", {
             style: {
                 listStylePosition: "inside"
             },
@@ -982,13 +997,13 @@ var UnorderedList = function(param) {
 };
 // src/contexts/markdown/MarkdownContext/lib/components/OrderedList.tsx
 import { Box as Box5 } from "@radix-ui/themes";
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var OrderedList = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx23(Box5, {
+    return /* @__PURE__ */ jsx24(Box5, {
         pb: "3",
         asChild: true,
-        children: /* @__PURE__ */ jsx23("ol", {
+        children: /* @__PURE__ */ jsx24("ol", {
             style: {
                 listStylePosition: "inside"
             },
@@ -998,31 +1013,31 @@ var OrderedList = function(param) {
 };
 // src/contexts/markdown/MarkdownContext/lib/components/ListItem.tsx
 import { Box as Box6 } from "@radix-ui/themes";
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 var ListItem = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx24(Box6, {
+    return /* @__PURE__ */ jsx25(Box6, {
         pb: "1",
-        children: /* @__PURE__ */ jsx24("li", {
+        children: /* @__PURE__ */ jsx25("li", {
             children: children
         })
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Strong.tsx
 import { Strong as RadixStrong } from "@radix-ui/themes";
-import { jsx as jsx25 } from "react/jsx-runtime";
+import { jsx as jsx26 } from "react/jsx-runtime";
 var Strong = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx25(RadixStrong, {
+    return /* @__PURE__ */ jsx26(RadixStrong, {
         children: children
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Pre.tsx
 import { Box as Box7 } from "@radix-ui/themes";
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx27 } from "react/jsx-runtime";
 var Pre = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx26(Box7, {
+    return /* @__PURE__ */ jsx27(Box7, {
         style: {
             whiteSpace: "pre-wrap",
             wordBreak: "break-word"
@@ -1032,20 +1047,20 @@ var Pre = function(param) {
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Code.tsx
 import { Code as RadixCode } from "@radix-ui/themes";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 var Code2 = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx27(RadixCode, {
+    return /* @__PURE__ */ jsx28(RadixCode, {
         children: children
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Img.tsx
 import { Box as Box8 } from "@radix-ui/themes";
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 var Img = function(props) {
-    return /* @__PURE__ */ jsx28(Box8, {
+    return /* @__PURE__ */ jsx29(Box8, {
         pb: "3",
-        children: /* @__PURE__ */ jsx28("img", _object_spread_props(_object_spread({}, props), {
+        children: /* @__PURE__ */ jsx29("img", _object_spread_props(_object_spread({}, props), {
             style: {
                 maxWidth: "100%",
                 height: "auto"
@@ -1083,7 +1098,7 @@ var TextContent = function(param) {
     return useRemarkSync(content.text.value, markdownContext);
 };
 // src/components/threads/Thread/Message/index.tsx
-import { jsx as jsx29, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs6 } from "react/jsx-runtime";
 var Message = function(param) {
     var message = param.message;
     var _useMemo4 = _sliced_to_array(useMemo4(function() {
@@ -1118,23 +1133,28 @@ var Message = function(param) {
     }, [
         message
     ]), 2), olderRunSteps = _useMemo4[0], laterRunSteps = _useMemo4[1];
-    return /* @__PURE__ */ jsx29(Provider, {
+    return /* @__PURE__ */ jsx30(Provider, {
         value: {
             message: message
         },
         children: /* @__PURE__ */ jsxs6(Box9, {
             children: [
-                /* @__PURE__ */ jsx29(RunSteps, {
+                /* @__PURE__ */ jsx30(RunSteps, {
                     runSteps: olderRunSteps
                 }),
-                message.content.map(function(content, index) {
-                    return /* @__PURE__ */ jsx29(Box9, {
-                        children: content.type === "text" && /* @__PURE__ */ jsx29(TextContent, {
-                            content: content
-                        })
-                    }, index);
+                /* @__PURE__ */ jsxs6(Box9, {
+                    children: [
+                        message.content.map(function(content, index) {
+                            return /* @__PURE__ */ jsx30(Fragment, {
+                                children: content.type === "text" && /* @__PURE__ */ jsx30(TextContent, {
+                                    content: content
+                                })
+                            }, index);
+                        }),
+                        message.status === "in_progress" && /* @__PURE__ */ jsx30(StartingContentSkeleton, {})
+                    ]
                 }),
-                /* @__PURE__ */ jsx29(RunSteps, {
+                /* @__PURE__ */ jsx30(RunSteps, {
                     runSteps: laterRunSteps
                 })
             ]
@@ -1142,36 +1162,36 @@ var Message = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
-import { jsx as jsx30 } from "react/jsx-runtime";
+import { jsx as jsx31 } from "react/jsx-runtime";
 var Content2 = function(param) {
     var messageGroup = param.messageGroup;
-    return /* @__PURE__ */ jsx30(Flex10, {
+    return /* @__PURE__ */ jsx31(Flex10, {
         direction: "column-reverse",
         children: messageGroup.messages.map(function(message) {
-            return /* @__PURE__ */ jsx30(Message, {
+            return /* @__PURE__ */ jsx31(Message, {
                 message: message
             }, message.id);
         })
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-import { jsx as jsx31, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs7 } from "react/jsx-runtime";
 var MessageGroup = function(param) {
     var messageGroup = param.messageGroup;
     var assistantNameContext = useContext6(AssistantNameContext);
     return /* @__PURE__ */ jsxs7(MessageGroupBase, {
         children: [
-            messageGroup.role === "user" ? /* @__PURE__ */ jsx31(Avatar3, {
-                fallback: /* @__PURE__ */ jsx31(PersonIcon, {}),
+            messageGroup.role === "user" ? /* @__PURE__ */ jsx32(Avatar3, {
+                fallback: /* @__PURE__ */ jsx32(PersonIcon, {}),
                 size: "1"
-            }) : /* @__PURE__ */ jsx31(AssistantAvatar, {}),
+            }) : /* @__PURE__ */ jsx32(AssistantAvatar, {}),
             /* @__PURE__ */ jsxs7(Box10, {
                 flexGrow: "1",
                 children: [
-                    /* @__PURE__ */ jsx31(Name, {
+                    /* @__PURE__ */ jsx32(Name, {
                         children: messageGroup.role === "user" ? "You" : assistantNameContext
                     }),
-                    /* @__PURE__ */ jsx31(Content2, {
+                    /* @__PURE__ */ jsx32(Content2, {
                         messageGroup: messageGroup
                     })
                 ]
@@ -1180,7 +1200,7 @@ var MessageGroup = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/index.tsx
-import { Fragment, jsx as jsx32 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx33 } from "react/jsx-runtime";
 var Content3 = function() {
     var _useMessages = useMessages(), messages2 = _useMessages.messages, isLoading = _useMessages.isLoading, isLoadingError = _useMessages.isLoadingError;
     var addToast = useToasts().addToast;
@@ -1199,33 +1219,18 @@ var Content3 = function() {
         addToast
     ]);
     if (isLoading || isLoadingError) {
-        return /* @__PURE__ */ jsx32(MessagesSkeleton, {});
+        return /* @__PURE__ */ jsx33(MessagesSkeleton, {});
     }
-    return /* @__PURE__ */ jsx32(Fragment, {
+    return /* @__PURE__ */ jsx33(Fragment2, {
         children: messageGroups2.map(function(messageGroup) {
-            return /* @__PURE__ */ jsx32(MessageGroup, {
+            return /* @__PURE__ */ jsx33(MessageGroup, {
                 messageGroup: messageGroup
             }, messageGroup.id);
         })
     });
 };
 // src/components/threads/Thread/Messages/Progress/index.tsx
-import { Box as Box12 } from "@radix-ui/themes";
-// src/components/skeletons/StartingContentSkeleton/index.tsx
-import { Skeleton as Skeleton2 } from "@radix-ui/themes";
-import { jsx as jsx33 } from "react/jsx-runtime";
-var StartingContentSkeleton = function() {
-    return /* @__PURE__ */ jsx33(Skeleton2, {
-        loading: true,
-        mt: "1",
-        height: "var(--space-4)",
-        width: "var(--space-4)",
-        style: {
-            borderRadius: "var(--radius-6)",
-            flexShrink: 0
-        }
-    });
-};
+import { useMemo as useMemo7 } from "react";
 // src/components/skeletons/StartingSkeleton/index.tsx
 import { useContext as useContext7 } from "react";
 import { Box as Box11 } from "@radix-ui/themes";
@@ -1260,161 +1265,50 @@ var useLatestMessage = function() {
         props
     ]);
 };
-// src/hooks/runs/useIsRunActive/index.tsx
-import { useMemo as useMemo8 } from "react";
-import { useIsMutating } from "@tanstack/react-query";
-// src/hooks/runs/useLatestRun/index.ts
-import { useMemo as useMemo7 } from "react";
-// src/hooks/runs/useRuns/index.tsx
-import { useMemo as useMemo6 } from "react";
-import { useInfiniteQuery as useInfiniteQuery2, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
-// src/lib/runs/runsQueryOptions.ts
-var runsQueryOptions = function(param) {
-    var queryClient = param.queryClient, threadContext = param.threadContext, superinterfaceContext = param.superinterfaceContext;
-    return queryOptions({
-        queryKeyBase: [
-            "runs"
-        ],
-        path: "/runs",
-        queryClient: queryClient,
-        threadContext: threadContext,
-        superinterfaceContext: superinterfaceContext
-    });
-};
-// src/hooks/runs/useRuns/lib/getRuns.ts
-var getRuns = function(param) {
-    var data3 = param.data;
-    if (!data3) return [];
-    return data3.pages.reduce(function(acc, page) {
-        return acc.concat(page.data);
-    }, []);
-};
-// src/hooks/runs/useRuns/index.tsx
-var useRuns = function() {
-    var queryClient = useQueryClient3();
-    var superinterfaceContext = useSuperinterfaceContext();
-    var threadContext = useSuperinterfaceContext();
-    var props = useInfiniteQuery2(runsQueryOptions({
-        queryClient: queryClient,
-        threadContext: threadContext,
-        superinterfaceContext: superinterfaceContext
-    }));
-    return useMemo6(function() {
-        return _object_spread_props(_object_spread({}, props), {
-            // @ts-ignore-next-line
-            runs: getRuns({
-                data: props.data
-            })
-        });
-    }, [
-        props
-    ]);
-};
-// src/hooks/runs/useLatestRun/index.ts
-var useLatestRun = function() {
-    var props = useRuns();
-    return useMemo7(function() {
-        return _object_spread_props(_object_spread({}, props), {
-            latestRun: props.runs[0]
-        });
-    }, [
-        props
-    ]);
+// src/lib/optimistic/isOptimistic.ts
+import _4 from "lodash";
+var isOptimistic = function(param) {
+    var id = param.id;
+    return _4.startsWith(id, "-");
 };
-// src/hooks/runs/usePollingContext/index.ts
-import { useContext as useContext8 } from "react";
-// src/contexts/runs/PollingContext/index.tsx
-import { createContext as createContext8 } from "react";
-var PollingContext = createContext8({
-    isPollRefetching: false,
-    setIsPollRefetching: function() {}
-});
-// src/hooks/runs/usePollingContext/index.ts
-var usePollingContext = function() {
-    return useContext8(PollingContext);
-};
-// src/hooks/runs/useIsRunActive/index.tsx
-var progressStatuses = [
-    "queued",
-    "in_progress",
-    "cancelling",
-    "requires_action"
-];
-var stoppedStatuses = [
-    "expired",
-    "cancelled",
-    "failed"
-];
-var isRunActive = function(param) {
-    var pollingContext = param.pollingContext, latestRunProps = param.latestRunProps, latestMessageProps = param.latestMessageProps, isMutating = param.isMutating;
-    var _latestMessageProps_latestMessage_metadata, _latestMessageProps_latestMessage;
-    if (pollingContext.isPollRefetching) return true;
-    if ((_latestMessageProps_latestMessage = latestMessageProps.latestMessage) === null || _latestMessageProps_latestMessage === void 0 ? void 0 : (_latestMessageProps_latestMessage_metadata = _latestMessageProps_latestMessage.metadata) === null || _latestMessageProps_latestMessage_metadata === void 0 ? void 0 : _latestMessageProps_latestMessage_metadata.isBlocking) return false;
-    if (isMutating) return true;
-    if (!latestRunProps.latestRun) return false;
-    if (progressStatuses.includes(latestRunProps.latestRun.status)) return true;
-    if (stoppedStatuses.includes(latestRunProps.latestRun.status)) return false;
-    return false;
-};
-var useIsRunActive = function() {
-    var latestRunProps = useLatestRun();
-    var latestMessageProps = useLatestMessage();
+// src/hooks/messages/useIsMutatingMessage/index.ts
+import { useMemo as useMemo6 } from "react";
+import { useIsMutating } from "@tanstack/react-query";
+var useIsMutatingMessage = function() {
     var threadContext = useSuperinterfaceContext();
-    var pollingContext = usePollingContext();
-    var isMutatingCreateRun = useIsMutating({
-        mutationKey: [
-            "createRun",
-            threadContext.variables
-        ]
-    });
-    var isMutatingCreateMessage = useIsMutating({
+    var mutatingMessagesCount = useIsMutating({
         mutationKey: [
             "createMessage",
             threadContext.variables
         ]
     });
-    var isMutatingCreateHandleAction = useIsMutating({
-        mutationKey: [
-            "handleAction",
-            threadContext.variables
-        ]
-    });
-    return useMemo8(function() {
-        return _object_spread_props(_object_spread({}, latestRunProps), {
-            isRunActive: isRunActive({
-                pollingContext: pollingContext,
-                latestRunProps: latestRunProps,
-                latestMessageProps: latestMessageProps,
-                isMutating: isMutatingCreateRun > 0 || isMutatingCreateMessage > 0 || isMutatingCreateHandleAction > 0
-            })
-        });
+    var isMutatingMessage = useMemo6(function() {
+        return mutatingMessagesCount > 0;
     }, [
-        latestRunProps,
-        latestMessageProps,
-        pollingContext,
-        isMutatingCreateRun,
-        isMutatingCreateMessage,
-        isMutatingCreateHandleAction
+        mutatingMessagesCount
     ]);
+    return isMutatingMessage;
 };
 // src/components/threads/Thread/Messages/Progress/index.tsx
-import { jsx as jsx35, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx35 } from "react/jsx-runtime";
 var Progress = function() {
-    var _useIsRunActive = useIsRunActive(), isRunActive2 = _useIsRunActive.isRunActive;
     var latestMessage = useLatestMessage().latestMessage;
-    if (!latestMessage) return null;
-    if (!isRunActive2) return null;
-    if (latestMessage.role === "user") {
-        return /* @__PURE__ */ jsx35(StartingSkeleton, {});
-    }
-    return /* @__PURE__ */ jsxs9(MessageGroupBase, {
-        children: [
-            /* @__PURE__ */ jsx35(Box12, {
-                pl: "5"
-            }),
-            /* @__PURE__ */ jsx35(StartingContentSkeleton, {})
-        ]
-    });
+    var isMutatingMessage = useIsMutatingMessage();
+    var isVisible = useMemo7(function() {
+        if (!latestMessage) return false;
+        if (latestMessage.role !== "user") return false;
+        if (latestMessage.status === "in_progress") return false;
+        if (!isOptimistic({
+            id: latestMessage.id
+        })) return false;
+        if (!isMutatingMessage) return false;
+        return true;
+    }, [
+        latestMessage,
+        isMutatingMessage
+    ]);
+    if (!isVisible) return null;
+    return /* @__PURE__ */ jsx35(StartingSkeleton, {});
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
 import { Flex as Flex11 } from "@radix-ui/themes";
@@ -1422,12 +1316,12 @@ import { Flex as Flex11 } from "@radix-ui/themes";
 import { useRef as useRef2 } from "react";
 import { useInView } from "react-intersection-observer";
 // src/hooks/misc/useThrottledEffect/index.tsx
-import _4 from "lodash";
+import _5 from "lodash";
 import { useRef, useEffect as useEffect2, useCallback } from "react";
 var useThrottledEffect = function(cb, delay, additionalDeps) {
     var _cbRef;
     var cbRef = useRef(cb);
-    var throttledCb = useCallback(_4.throttle(function() {
+    var throttledCb = useCallback(_5.throttle(function() {
         for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
             args[_key] = arguments[_key];
         }
@@ -1472,229 +1366,179 @@ var useInfiniteScroll = function(param) {
         inView: inView
     };
 };
-// src/hooks/runs/useManageRuns/index.tsx
-import { useQueryClient as useQueryClient5 } from "@tanstack/react-query";
-import { useEffect as useEffect3, useState } from "react";
-// src/hooks/runs/useCreateRun/index.ts
-import { partob } from "radash";
-import { useMutation, useQueryClient as useQueryClient4 } from "@tanstack/react-query";
-// src/lib/threads/mutationOptions/index.ts
-var mutationOptions = function(param) {
-    var mutationKeyBase = param.mutationKeyBase, path = param.path, queryClient = param.queryClient, threadContext = param.threadContext, superinterfaceContext = param.superinterfaceContext;
-    var mutationKey = _to_consumable_array(mutationKeyBase).concat([
-        threadContext.variables
-    ]);
-    return _object_spread_props(_object_spread({
-        mutationFn: function(variables) {
-            return fetch("".concat(superinterfaceContext.baseUrl).concat(path), _object_spread({
-                method: "POST",
-                body: JSON.stringify(variables),
-                credentials: "include"
-            }, superinterfaceContext.publicApiKey ? {
-                headers: {
-                    Authorization: "Bearer ".concat(superinterfaceContext.publicApiKey)
-                }
-            } : {})).then(function() {
-                var _ref = _async_to_generator(function(response) {
-                    var errorResponse, error;
-                    return _ts_generator(this, function(_state) {
-                        switch(_state.label){
-                            case 0:
-                                if (!(response.status !== 200)) return [
-                                    3,
-                                    5
-                                ];
-                                _state.label = 1;
-                            case 1:
-                                _state.trys.push([
-                                    1,
-                                    3,
-                                    ,
-                                    4
-                                ]);
-                                console.log("response", response);
-                                return [
-                                    4,
-                                    response.json()
-                                ];
-                            case 2:
-                                errorResponse = _state.sent();
-                                return [
-                                    3,
-                                    4
-                                ];
-                            case 3:
-                                error = _state.sent();
-                                throw new Error("Failed to fetch");
-                            case 4:
-                                throw new Error(errorResponse.error);
-                            case 5:
-                                return [
-                                    2,
-                                    response.json()
-                                ];
-                        }
-                    });
-                });
-                return function(response) {
-                    return _ref.apply(this, arguments);
-                };
-            }());
-        }
-    }, threadContext.defaultOptions.mutations, queryClient.getMutationDefaults(mutationKey)), {
-        mutationKey: mutationKey
+// src/components/threads/Thread/Messages/Root/index.tsx
+import { jsx as jsx36, jsxs as jsxs9 } from "react/jsx-runtime";
+var Root = function(param) {
+    var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
+    var _useMessages = useMessages(), isFetchingNextPage = _useMessages.isFetchingNextPage, hasNextPage = _useMessages.hasNextPage, fetchNextPage = _useMessages.fetchNextPage;
+    var _useInfiniteScroll = useInfiniteScroll({
+        isFetchingNextPage: isFetchingNextPage,
+        hasNextPage: hasNextPage,
+        fetchNextPage: fetchNextPage
+    }), containerRef = _useInfiniteScroll.containerRef, loaderRef = _useInfiniteScroll.loaderRef;
+    return /* @__PURE__ */ jsxs9(Flex11, {
+        ref: containerRef,
+        direction: "column-reverse",
+        flexGrow: "1",
+        style: _object_spread_props(_object_spread({}, style), {
+            overflow: "auto"
+        }),
+        children: [
+            children,
+            hasNextPage && /* @__PURE__ */ jsx36(Flex11, {
+                ref: loaderRef
+            }),
+            /* @__PURE__ */ jsx36(Flex11, {
+                flexShrink: "0",
+                flexGrow: "1"
+            })
+        ]
     });
 };
-// src/hooks/runs/useCreateRun/lib/onSuccess.ts
-var onSuccess = function(param) {
-    var queryClient = param.queryClient;
-    return function() {
-        var _ref = _async_to_generator(function(data3, variables) {
-            return _ts_generator(this, function(_state) {
-                return [
-                    2,
-                    queryClient.setQueryData([
-                        "runs",
-                        variables
-                    ], function(prevData) {
-                        if (!prevData) {
-                            return {
-                                pageParams: [],
-                                pages: [
-                                    {
-                                        data: [
-                                            data3.run
-                                        ],
-                                        hasNextPage: false,
-                                        lastId: data3.run.id
-                                    }
-                                ]
-                            };
-                        }
-                        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
-                        return _object_spread_props(_object_spread({}, prevData), {
-                            pages: [
-                                _object_spread_props(_object_spread({}, latestPage), {
-                                    data: [
-                                        data3.run
-                                    ].concat(_to_consumable_array(latestPage.data))
-                                })
-                            ].concat(_to_consumable_array(pagesRest))
-                        });
-                    })
-                ];
-            });
-        });
-        return function(data3, variables) {
-            return _ref.apply(this, arguments);
-        };
-    }();
-};
-// src/hooks/runs/useCreateRun/lib/onSettled.ts
-var onSettled = function(param) {
-    var queryClient = param.queryClient;
-    return function() {
-        var _ref = _async_to_generator(function(_data, _error, variables) {
-            return _ts_generator(this, function(_state) {
-                switch(_state.label){
-                    case 0:
-                        return [
-                            4,
-                            queryClient.invalidateQueries({
-                                queryKey: [
-                                    "messages",
-                                    variables
-                                ]
-                            })
-                        ];
-                    case 1:
-                        _state.sent();
-                        return [
-                            4,
-                            queryClient.invalidateQueries({
-                                queryKey: [
-                                    "runs",
-                                    variables
-                                ]
-                            })
-                        ];
-                    case 2:
-                        _state.sent();
-                        return [
-                            2
-                        ];
-                }
-            });
-        });
-        return function(_data, _error, variables) {
-            return _ref.apply(this, arguments);
-        };
-    }();
-};
-// src/lib/optimistic/optimisticId.ts
-import { uid } from "radash";
-var optimisticId = function() {
-    return "-".concat(uid(24));
-};
-// src/hooks/runs/useCreateRun/lib/onMutate/data.ts
-var data = function(prevData) {
-    var run = {
-        id: optimisticId(),
-        object: "thread.run",
-        created_at: +/* @__PURE__ */ new Date(),
-        assistant_id: null,
-        thread_id: null,
-        status: "in_progress",
-        expires_at: +/* @__PURE__ */ new Date() + 1e3 * 60 * 60 * 24,
-        cancelled_at: null,
-        failed_at: null,
-        completed_at: null,
-        required_action: null,
-        last_error: null,
-        model: null,
-        instructions: null,
-        tools: [],
-        file_ids: [],
-        metadata: {},
-        usage: null
-    };
-    if (!prevData) {
-        return {
-            pageParams: [],
-            pages: [
-                {
-                    data: [
-                        run
-                    ],
-                    hasNextPage: false,
-                    lastId: run.id
-                }
-            ]
-        };
+// src/components/threads/Thread/Messages/NextPageSkeleton.tsx
+import { jsx as jsx37 } from "react/jsx-runtime";
+var NextPageSkeleton = function() {
+    var hasNextPage = useMessages().hasNextPage;
+    if (!hasNextPage) {
+        return null;
     }
-    var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
-    return _object_spread_props(_object_spread({}, prevData), {
-        pages: [
-            _object_spread_props(_object_spread({}, latestPage), {
-                data: [
-                    run
-                ].concat(_to_consumable_array(latestPage.data))
+    return /* @__PURE__ */ jsx37(MessagesSkeleton, {});
+};
+// src/components/threads/Thread/Messages/index.tsx
+import { jsx as jsx38, jsxs as jsxs10 } from "react/jsx-runtime";
+var Messages = function(param) {
+    var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
+    return /* @__PURE__ */ jsxs10(Root, {
+        style: style,
+        children: [
+            /* @__PURE__ */ jsx38(Flex12, {
+                flexShrink: "0",
+                height: "var(--space-3)"
+            }),
+            /* @__PURE__ */ jsx38(Progress, {}),
+            children,
+            /* @__PURE__ */ jsx38(Content3, {}),
+            /* @__PURE__ */ jsx38(NextPageSkeleton, {}),
+            /* @__PURE__ */ jsx38(Flex12, {
+                flexShrink: "0",
+                flexGrow: "1"
             })
-        ].concat(_to_consumable_array(pagesRest))
+        ]
     });
 };
-// src/hooks/runs/useCreateRun/lib/onMutate/index.ts
-var onMutate = function(param) {
+Messages.Root = Root;
+Messages.Message = Message;
+Messages.NextPageSkeleton = NextPageSkeleton;
+// src/components/threads/Thread/MessageForm/index.tsx
+import { Flex as Flex14, Text as Text5 } from "@radix-ui/themes";
+// src/components/threads/Thread/MessageForm/Submit/index.tsx
+import { ArrowUpIcon } from "@radix-ui/react-icons";
+import { IconButton, Spinner } from "@radix-ui/themes";
+// src/hooks/messages/useMessageFormContext/index.ts
+import { useContext as useContext8 } from "react";
+// src/contexts/messages/MessageFormContext/index.ts
+import { createContext as createContext8 } from "react";
+var MessageFormContext = createContext8({
+    isDisabled: false,
+    isLoading: false
+});
+// src/hooks/messages/useMessageFormContext/index.ts
+var useMessageFormContext = function() {
+    return useContext8(MessageFormContext);
+};
+// src/components/threads/Thread/MessageForm/Submit/index.tsx
+import { jsx as jsx39 } from "react/jsx-runtime";
+var Submit = function() {
+    var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading;
+    return /* @__PURE__ */ jsx39(IconButton, {
+        type: "submit",
+        disabled: isDisabled || isLoading,
+        children: /* @__PURE__ */ jsx39(Spinner, {
+            loading: isLoading,
+            children: /* @__PURE__ */ jsx39(ArrowUpIcon, {})
+        })
+    });
+};
+// src/components/threads/Thread/MessageForm/Root/index.tsx
+import { useMemo as useMemo8 } from "react";
+import { useForm, FormProvider } from "react-hook-form";
+// src/hooks/messages/useCreateMessage/index.ts
+import { partob } from "radash";
+import { useMutation, useQueryClient as useQueryClient3 } from "@tanstack/react-query";
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/index.ts
+import { omit } from "radash";
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/data.ts
+import dayjs from "dayjs";
+// src/lib/optimistic/optimisticId.ts
+import { uid } from "radash";
+var optimisticId = function() {
+    return "-".concat(uid(24));
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/data.ts
+var data = function(param) {
+    var newMessage = param.newMessage;
+    return function(prevData) {
+        var message = {
+            id: optimisticId(),
+            role: "user",
+            created_at: dayjs().unix(),
+            object: "thread.message",
+            content: [
+                {
+                    type: "text",
+                    text: {
+                        annotations: [],
+                        value: newMessage.content
+                    }
+                }
+            ],
+            run_id: null,
+            assistant_id: null,
+            thread_id: null,
+            file_ids: [],
+            metadata: {},
+            runSteps: []
+        };
+        if (!prevData) {
+            return {
+                pageParams: [],
+                pages: [
+                    {
+                        data: [
+                            message
+                        ],
+                        hasNextPage: false,
+                        lastId: message.id
+                    }
+                ]
+            };
+        }
+        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
+        return _object_spread_props(_object_spread({}, prevData), {
+            pages: [
+                _object_spread_props(_object_spread({}, latestPage), {
+                    data: [
+                        message
+                    ].concat(_to_consumable_array(latestPage.data))
+                })
+            ].concat(_to_consumable_array(pagesRest))
+        });
+    };
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/index.ts
+var onMutate = function(param) {
     var queryClient = param.queryClient;
     return function() {
-        var _ref = _async_to_generator(function(variables) {
-            var queryKey, prevRuns;
+        var _ref = _async_to_generator(function(newMessage) {
+            var queryKey, prevMessages;
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
                         queryKey = [
-                            "runs",
-                            variables
+                            "messages",
+                            omit(newMessage, [
+                                "content"
+                            ])
                         ];
                         return [
                             4,
@@ -1704,588 +1548,492 @@ var onMutate = function(param) {
                         ];
                     case 1:
                         _state.sent();
-                        prevRuns = queryClient.getQueryData(queryKey);
-                        queryClient.setQueryData(queryKey, data);
+                        prevMessages = queryClient.getQueryData(queryKey);
+                        queryClient.setQueryData(queryKey, data({
+                            newMessage: newMessage
+                        }));
                         return [
                             2,
                             {
-                                prevRuns: prevRuns,
-                                variables: variables
+                                prevMessages: prevMessages,
+                                newMessage: newMessage
                             }
                         ];
                 }
             });
         });
-        return function(variables) {
+        return function(newMessage) {
             return _ref.apply(this, arguments);
         };
     }();
 };
-// src/hooks/runs/useCreateRun/index.ts
-var useCreateRun = function() {
-    var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {
-        onError: function() {}
-    }, _ref_onError = _ref.onError, onError = _ref_onError === void 0 ? function() {} : _ref_onError;
-    var queryClient = useQueryClient4();
-    var superinterfaceContext = useSuperinterfaceContext();
-    var threadContext = useSuperinterfaceContext();
-    var props = useMutation(_object_spread({
-        onSuccess: onSuccess({
-            queryClient: queryClient
-        }),
-        onSettled: onSettled({
-            queryClient: queryClient
-        }),
-        onMutate: onMutate({
-            queryClient: queryClient
-        }),
-        onError: onError
-    }, mutationOptions({
-        mutationKeyBase: [
-            "createRun"
-        ],
-        path: "/runs",
-        queryClient: queryClient,
-        threadContext: threadContext,
-        superinterfaceContext: superinterfaceContext
-    })));
-    return _object_spread_props(_object_spread({}, props), {
-        createRun: partob(props.mutate, threadContext.variables)
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/index.ts
+import { JSONParser } from "@streamparser/json-whatwg";
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/extendMessage.ts
+import { last as last2 } from "radash";
+var extendMessage = function(param) {
+    var message = param.message, messages2 = param.messages;
+    var _last2, _last21;
+    var prevRunMessages = messages2.filter(function(m) {
+        return m.run_id === message.run_id;
+    });
+    var prevOptimitisticRunMessages = prevRunMessages.filter(function(m) {
+        return isOptimistic({
+            id: m.id
+        });
     });
-};
-// src/lib/optimistic/isOptimistic.ts
-import _5 from "lodash";
-var isOptimistic = function(param) {
-    var id = param.id;
-    return _5.startsWith(id, "-");
-};
-// src/hooks/runs/useManageRuns/index.tsx
-var useManageRuns = function() {
-    var addToast = useToasts().addToast;
-    var queryClient = useQueryClient5();
-    var latestRunProps = useLatestRun();
-    var latestMessageProps = useLatestMessage();
-    var createRunProps = useCreateRun({
-        onError: function(error) {
-            return addToast({
-                type: "error",
-                message: error.message
-            });
-        }
+    var _last2_runSteps, _ref;
+    var runSteps = (_ref = (_last2_runSteps = (_last2 = last2(prevOptimitisticRunMessages)) === null || _last2 === void 0 ? void 0 : _last2.runSteps) !== null && _last2_runSteps !== void 0 ? _last2_runSteps : (_last21 = last2(prevRunMessages)) === null || _last21 === void 0 ? void 0 : _last21.runSteps) !== null && _ref !== void 0 ? _ref : [];
+    return _object_spread_props(_object_spread({}, message), {
+        runSteps: runSteps
     });
-    var threadContext = useSuperinterfaceContext();
-    var _useState = _sliced_to_array(useState([]), 2), toastedErrorRunIds = _useState[0], setToastedErrorRunIds = _useState[1];
-    useEffect3(function() {
-        var _latestRunProps_latestRun;
-        if (((_latestRunProps_latestRun = latestRunProps.latestRun) === null || _latestRunProps_latestRun === void 0 ? void 0 : _latestRunProps_latestRun.status) !== "failed") return;
-        if (toastedErrorRunIds.includes(latestRunProps.latestRun.id)) return;
-        setToastedErrorRunIds(function(prev) {
-            return _to_consumable_array(prev).concat([
-                latestRunProps.latestRun.id
-            ]);
-        });
-        addToast({
-            type: "error",
-            message: "AI run failed. Please try again."
-        });
-    }, [
-        latestRunProps,
-        toastedErrorRunIds,
-        addToast
-    ]);
-    useEffect3(function() {
-        if (createRunProps.isPending) return;
-        if (latestRunProps.isFetching) return;
-        if (latestMessageProps.isFetching) return;
-        if (!latestMessageProps.latestMessage) return;
-        if (latestMessageProps.latestMessage.role !== "user") return;
-        if (isOptimistic({
-            id: latestMessageProps.latestMessage.id
-        })) return;
-        if (latestRunProps.latestRun && latestRunProps.latestRun.created_at > latestMessageProps.latestMessage.created_at) {
-            return;
-        }
-        var isMutating = queryClient.isMutating({
-            mutationKey: [
-                "createRun",
-                threadContext.variables
-            ]
-        });
-        if (isMutating) return;
-        createRunProps.createRun();
-    }, [
-        threadContext,
-        queryClient,
-        createRunProps,
-        latestRunProps,
-        latestMessageProps
-    ]);
-    return null;
 };
-// src/hooks/runs/usePolling/index.tsx
-import { useEffect as useEffect4 } from "react";
-import { useQueryClient as useQueryClient6 } from "@tanstack/react-query";
-import { useInterval, usePrevious } from "react-use";
-// src/hooks/runs/usePolling/lib/refetch.ts
-var refetch = function() {
-    var _ref = _async_to_generator(function(param) {
-        var queryClient, threadContext, _threadContext_defaultOptions_queries_queryKey, _threadContext_defaultOptions_queries_queryKey1;
-        return _ts_generator(this, function(_state) {
-            switch(_state.label){
-                case 0:
-                    queryClient = param.queryClient, threadContext = param.threadContext;
-                    return [
-                        4,
-                        queryClient.refetchQueries({
-                            queryKey: (_threadContext_defaultOptions_queries_queryKey = threadContext.defaultOptions.queries.queryKey) !== null && _threadContext_defaultOptions_queries_queryKey !== void 0 ? _threadContext_defaultOptions_queries_queryKey : [
-                                "messages",
-                                threadContext.variables
-                            ]
-                        })
-                    ];
-                case 1:
-                    _state.sent();
-                    return [
-                        4,
-                        queryClient.refetchQueries({
-                            queryKey: (_threadContext_defaultOptions_queries_queryKey1 = threadContext.defaultOptions.queries.queryKey) !== null && _threadContext_defaultOptions_queries_queryKey1 !== void 0 ? _threadContext_defaultOptions_queries_queryKey1 : [
-                                "runs",
-                                threadContext.variables
-                            ]
-                        })
-                    ];
-                case 2:
-                    _state.sent();
-                    return [
-                        2
-                    ];
-            }
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadMessageCreated.ts
+var appendMessage = function(param) {
+    var message = param.message, messages2 = param.messages;
+    var prevMessages = messages2.filter(function(m) {
+        return m.run_id != message.run_id || !isOptimistic({
+            id: m.id
         });
     });
-    return function refetch(_) {
-        return _ref.apply(this, arguments);
-    };
-}();
-// src/hooks/runs/usePolling/index.tsx
-var usePolling = function() {
-    var threadContext = useSuperinterfaceContext();
-    var queryClient = useQueryClient6();
-    var _usePollingContext = usePollingContext(), isPollRefetching = _usePollingContext.isPollRefetching, setIsPollRefetching = _usePollingContext.setIsPollRefetching;
-    var isRunActiveProps = useIsRunActive();
-    useInterval(/*#__PURE__*/ _async_to_generator(function() {
-        return _ts_generator(this, function(_state) {
-            switch(_state.label){
-                case 0:
-                    if (isPollRefetching) return [
-                        2
-                    ];
-                    setIsPollRefetching(true);
-                    return [
-                        4,
-                        refetch({
-                            queryClient: queryClient,
-                            threadContext: threadContext
-                        })
-                    ];
-                case 1:
-                    _state.sent();
-                    setIsPollRefetching(false);
-                    console.log("Polling...");
-                    return [
-                        2
-                    ];
-            }
-        });
-    }), isRunActiveProps.isRunActive ? 3e3 : null);
-    var prevIsRunActive = usePrevious(isRunActiveProps.isRunActive);
-    useEffect4(function() {
-        if (prevIsRunActive && !isRunActiveProps.isRunActive) {
-            refetch({
-                queryClient: queryClient,
-                threadContext: threadContext
-            });
-        }
-    }, [
-        queryClient,
-        threadContext,
-        isRunActiveProps,
-        prevIsRunActive
-    ]);
-    return null;
-};
-// src/hooks/actions/useManageActions/index.tsx
-import { useEffect as useEffect5, useState as useState2 } from "react";
-// src/hooks/actions/useHandleAction/index.tsx
-import { partob as partob2 } from "radash";
-import { useMutation as useMutation2, useQueryClient as useQueryClient7 } from "@tanstack/react-query";
-// src/hooks/actions/useHandleAction/lib/onSettled.ts
-var onSettled2 = function(param) {
-    var queryClient = param.queryClient;
-    return function() {
-        var _ref = _async_to_generator(function(_data, _error, variables) {
-            return _ts_generator(this, function(_state) {
-                switch(_state.label){
-                    case 0:
-                        return [
-                            4,
-                            queryClient.invalidateQueries({
-                                queryKey: [
-                                    "messages",
-                                    variables
-                                ]
-                            })
-                        ];
-                    case 1:
-                        _state.sent();
-                        return [
-                            4,
-                            queryClient.invalidateQueries({
-                                queryKey: [
-                                    "runs",
-                                    variables
-                                ]
-                            })
-                        ];
-                    case 2:
-                        _state.sent();
-                        return [
-                            2
-                        ];
-                }
-            });
-        });
-        return function(_data, _error, variables) {
-            return _ref.apply(this, arguments);
-        };
-    }();
-};
-// src/hooks/actions/useHandleAction/index.tsx
-var useHandleAction = function() {
-    var queryClient = useQueryClient7();
-    var superinterfaceContext = useSuperinterfaceContext();
-    var threadContext = useSuperinterfaceContext();
-    var props = useMutation2(_object_spread({
-        onSettled: onSettled2({
-            queryClient: queryClient
+    return [
+        extendMessage({
+            message: message,
+            messages: messages2
         })
-    }, mutationOptions({
-        mutationKeyBase: [
-            "handleAction"
-        ],
-        path: "/actions",
-        queryClient: queryClient,
-        threadContext: threadContext,
-        superinterfaceContext: superinterfaceContext
-    })));
-    return _object_spread_props(_object_spread({}, props), {
-        handleAction: partob2(props.mutateAsync, threadContext.variables)
-    });
+    ].concat(_to_consumable_array(prevMessages));
 };
-// src/hooks/actions/useManageActions/index.tsx
-var useManageActions = function() {
-    var latestRunProps = useLatestRun();
-    var handleActionProps = useHandleAction();
-    var _useState2 = _sliced_to_array(useState2([]), 2), handledRunIds = _useState2[0], setHandledRunIds = _useState2[1];
-    useEffect5(function() {
-        if (handleActionProps.isPending) return;
-        if (latestRunProps.isFetching) return;
-        if (!latestRunProps.latestRun) return;
-        if (latestRunProps.latestRun.status !== "requires_action") return;
-        if (handledRunIds.includes(latestRunProps.latestRun.id)) return;
-        setHandledRunIds(function(prev) {
-            return _to_consumable_array(prev).concat([
-                latestRunProps.latestRun.id
-            ]);
-        });
-        console.log("Requires action", {
-            latestRunProps: latestRunProps,
-            handleActionProps: handleActionProps
-        });
-        handleActionProps.handleAction({
-            latestRun: latestRunProps.latestRun
+var threadMessageCreated = function(param) {
+    var value = param.value;
+    return function(prevData) {
+        if (!prevData) {
+            return {
+                pageParams: [],
+                pages: [
+                    {
+                        data: appendMessage({
+                            message: value.data,
+                            messages: []
+                        }),
+                        hasNextPage: false,
+                        lastId: value.data.id
+                    }
+                ]
+            };
+        }
+        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
+        return _object_spread_props(_object_spread({}, prevData), {
+            pages: [
+                _object_spread_props(_object_spread({}, latestPage), {
+                    data: appendMessage({
+                        message: value.data,
+                        messages: latestPage.data
+                    })
+                })
+            ].concat(_to_consumable_array(pagesRest))
         });
-    }, [
-        handledRunIds,
-        handleActionProps,
-        latestRunProps
-    ]);
-    return null;
-};
-// src/hooks/threads/useLifecycle/index.tsx
-var useLifecycle = function() {
-    useManageRuns();
-    useManageActions();
-    usePolling();
-    return null;
-};
-// src/components/threads/Thread/Messages/Root/index.tsx
-import { jsx as jsx36, jsxs as jsxs10 } from "react/jsx-runtime";
-var Root = function(param) {
-    var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    var _useMessages = useMessages(), isFetchingNextPage = _useMessages.isFetchingNextPage, hasNextPage = _useMessages.hasNextPage, fetchNextPage = _useMessages.fetchNextPage;
-    useLifecycle();
-    var _useInfiniteScroll = useInfiniteScroll({
-        isFetchingNextPage: isFetchingNextPage,
-        hasNextPage: hasNextPage,
-        fetchNextPage: fetchNextPage
-    }), containerRef = _useInfiniteScroll.containerRef, loaderRef = _useInfiniteScroll.loaderRef;
-    return /* @__PURE__ */ jsxs10(Flex11, {
-        ref: containerRef,
-        direction: "column-reverse",
-        flexGrow: "1",
-        style: _object_spread_props(_object_spread({}, style), {
-            overflow: "auto"
-        }),
-        children: [
-            children,
-            hasNextPage && /* @__PURE__ */ jsx36(Flex11, {
-                ref: loaderRef
-            }),
-            /* @__PURE__ */ jsx36(Flex11, {
-                flexShrink: "0",
-                flexGrow: "1"
-            })
-        ]
-    });
+    };
 };
-// src/components/threads/Thread/Messages/NextPageSkeleton.tsx
-import { jsx as jsx37 } from "react/jsx-runtime";
-var NextPageSkeleton = function() {
-    var hasNextPage = useMessages().hasNextPage;
-    if (!hasNextPage) {
-        return null;
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadMessageDelta.ts
+import _6 from "lodash";
+import { omit as omit2 } from "radash";
+var updatedContentPart = function(param) {
+    var prevContentPart = param.prevContentPart, delta = param.delta;
+    if (!prevContentPart) {
+        return omit2(delta, [
+            "index"
+        ]);
     }
-    return /* @__PURE__ */ jsx37(MessagesSkeleton, {});
-};
-// src/components/threads/Thread/Messages/index.tsx
-import { jsx as jsx38, jsxs as jsxs11 } from "react/jsx-runtime";
-var Messages = function(param) {
-    var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ jsxs11(Root, {
-        style: style,
-        children: [
-            /* @__PURE__ */ jsx38(Flex12, {
-                flexShrink: "0",
-                height: "var(--space-3)"
-            }),
-            /* @__PURE__ */ jsx38(Progress, {}),
-            children,
-            /* @__PURE__ */ jsx38(Content3, {}),
-            /* @__PURE__ */ jsx38(NextPageSkeleton, {}),
-            /* @__PURE__ */ jsx38(Flex12, {
-                flexShrink: "0",
-                flexGrow: "1"
+    if (delta.type === "text" && delta.text && prevContentPart.type == "text" && prevContentPart.text) {
+        var _prevContentPart_text_annotations, _delta_text_annotations;
+        return _object_spread_props(_object_spread({}, prevContentPart), {
+            text: _object_spread_props(_object_spread({}, prevContentPart.text), {
+                value: "".concat(prevContentPart.text.value).concat(delta.text.value),
+                annotations: _to_consumable_array((_prevContentPart_text_annotations = prevContentPart.text.annotations) !== null && _prevContentPart_text_annotations !== void 0 ? _prevContentPart_text_annotations : []).concat(_to_consumable_array((_delta_text_annotations = delta.text.annotations) !== null && _delta_text_annotations !== void 0 ? _delta_text_annotations : []))
             })
-        ]
+        });
+    }
+    return prevContentPart;
+};
+var updatedContent = function(param) {
+    var content = param.content, value = param.value;
+    if (!value.data.delta.content) return content;
+    var result = _6.cloneDeep(content);
+    value.data.delta.content.forEach(function(delta) {
+        result[delta.index] = updatedContentPart({
+            // @ts-ignore-next-line
+            prevContentPart: result[delta.index],
+            delta: delta
+        });
     });
+    return result;
 };
-Messages.Root = Root;
-Messages.Message = Message;
-Messages.NextPageSkeleton = NextPageSkeleton;
-// src/components/threads/Thread/MessageForm/index.tsx
-import { Flex as Flex14, Text as Text5 } from "@radix-ui/themes";
-// src/components/threads/Thread/MessageForm/Submit/index.tsx
-import { ArrowUpIcon } from "@radix-ui/react-icons";
-import { IconButton, Spinner } from "@radix-ui/themes";
-// src/hooks/messages/useMessageFormContext/index.ts
-import { useContext as useContext9 } from "react";
-// src/contexts/messages/MessageFormContext/index.ts
-import { createContext as createContext9 } from "react";
-var MessageFormContext = createContext9({
-    isDisabled: false,
-    isLoading: false
-});
-// src/hooks/messages/useMessageFormContext/index.ts
-var useMessageFormContext = function() {
-    return useContext9(MessageFormContext);
-};
-// src/components/threads/Thread/MessageForm/Submit/index.tsx
-import { jsx as jsx39 } from "react/jsx-runtime";
-var Submit = function() {
-    var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading;
-    return /* @__PURE__ */ jsx39(IconButton, {
-        type: "submit",
-        disabled: isDisabled || isLoading,
-        children: /* @__PURE__ */ jsx39(Spinner, {
-            loading: isLoading,
-            children: /* @__PURE__ */ jsx39(ArrowUpIcon, {})
-        })
-    });
+var threadMessageDelta = function(param) {
+    var value = param.value;
+    return function(prevData) {
+        if (!prevData) {
+            return {
+                pageParams: [],
+                pages: [
+                    {
+                        data: [],
+                        hasNextPage: false,
+                        lastId: null
+                    }
+                ]
+            };
+        }
+        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
+        var _latestPage_data = _to_array(latestPage.data), latestMessage = _latestPage_data[0], messagesRest = _latestPage_data.slice(1);
+        return _object_spread_props(_object_spread({}, prevData), {
+            pages: [
+                _object_spread_props(_object_spread({}, latestPage), {
+                    data: [
+                        _object_spread_props(_object_spread({}, latestMessage), {
+                            content: updatedContent({
+                                content: latestMessage.content,
+                                value: value
+                            })
+                        })
+                    ].concat(_to_consumable_array(messagesRest))
+                })
+            ].concat(_to_consumable_array(pagesRest))
+        });
+    };
 };
-// src/components/threads/Thread/MessageForm/Root/index.tsx
-import { useMemo as useMemo9 } from "react";
-import { useForm, FormProvider } from "react-hook-form";
-// src/hooks/messages/useCreateMessage/index.ts
-import { partob as partob3 } from "radash";
-import { useMutation as useMutation3, useQueryClient as useQueryClient8 } from "@tanstack/react-query";
-// src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/index.ts
-import { omit } from "radash";
-// src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/data.ts
-var data2 = function(param) {
-    var newMessage = param.newMessage;
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadMessageCompleted.ts
+import { replace } from "radash";
+var threadMessageCompleted = function(param) {
+    var value = param.value;
     return function(prevData) {
-        var message = {
-            id: optimisticId(),
-            role: "user",
-            created_at: +/* @__PURE__ */ new Date(),
-            object: "thread.message",
-            content: [
-                {
-                    type: "text",
-                    text: {
-                        annotations: [],
-                        value: newMessage.content
-                    }
-                }
-            ],
-            run_id: null,
-            assistant_id: null,
-            thread_id: null,
-            file_ids: [],
-            metadata: {},
-            runSteps: []
-        };
         if (!prevData) {
             return {
                 pageParams: [],
                 pages: [
                     {
-                        data: [
-                            message
-                        ],
+                        data: [],
                         hasNextPage: false,
-                        lastId: message.id
+                        lastId: null
                     }
                 ]
             };
         }
         var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
+        return _object_spread_props(_object_spread({}, prevData), {
+            pages: [
+                _object_spread_props(_object_spread({}, latestPage), {
+                    data: replace(latestPage.data, extendMessage({
+                        message: value.data,
+                        messages: latestPage.data
+                    }), function(m) {
+                        return m.id === value.data.id;
+                    })
+                })
+            ].concat(_to_consumable_array(pagesRest))
+        });
+    };
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunCreated.ts
+var threadRunCreated = function(param) {
+    var value = param.value;
+    return function(prevData) {
+        if (!prevData) return prevData;
+        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
         return _object_spread_props(_object_spread({}, prevData), {
             pages: [
                 _object_spread_props(_object_spread({}, latestPage), {
                     data: [
-                        message
+                        {
+                            id: optimisticId(),
+                            assistant_id: value.data.assistant_id,
+                            content: [],
+                            created_at: value.data.created_at,
+                            file_ids: [],
+                            metadata: {},
+                            status: "in_progress",
+                            role: "assistant",
+                            runSteps: [],
+                            run_id: value.data.id,
+                            thread_id: value.data.thread_id
+                        }
                     ].concat(_to_consumable_array(latestPage.data))
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
     };
 };
-// src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/index.ts
-var onMutate2 = function(param) {
-    var queryClient = param.queryClient;
-    return function() {
-        var _ref = _async_to_generator(function(newMessage) {
-            var queryKey, prevMessages;
-            return _ts_generator(this, function(_state) {
-                switch(_state.label){
-                    case 0:
-                        queryKey = [
-                            "messages",
-                            omit(newMessage, [
-                                "content"
-                            ])
-                        ];
-                        return [
-                            4,
-                            queryClient.cancelQueries({
-                                queryKey: queryKey
-                            })
-                        ];
-                    case 1:
-                        _state.sent();
-                        prevMessages = queryClient.getQueryData(queryKey);
-                        queryClient.setQueryData(queryKey, data2({
-                            newMessage: newMessage
-                        }));
-                        return [
-                            2,
-                            {
-                                prevMessages: prevMessages,
-                                newMessage: newMessage
-                            }
-                        ];
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunStepCreated.ts
+var threadRunStepCreated = function(param) {
+    var value = param.value;
+    return function(prevData) {
+        if (!prevData) return prevData;
+        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
+        return _object_spread_props(_object_spread({}, prevData), {
+            pages: [
+                _object_spread_props(_object_spread({}, latestPage), {
+                    data: latestPage.data.map(function(m) {
+                        if (m.run_id === value.data.run_id) {
+                            return _object_spread_props(_object_spread({}, m), {
+                                runSteps: [
+                                    value.data
+                                ].concat(_to_consumable_array(m.runSteps))
+                            });
+                        }
+                        return m;
+                    })
+                })
+            ].concat(_to_consumable_array(pagesRest))
+        });
+    };
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunStepDelta.ts
+import _7 from "lodash";
+import { omit as omit3 } from "radash";
+var updatedToolCall = function(param) {
+    var toolCall = param.toolCall, delta = param.delta;
+    if (!toolCall) {
+        return omit3(delta, [
+            "index"
+        ]);
+    }
+    if (delta.type === "function" && delta.function && toolCall.type === "function" && toolCall.function) {
+        var result = _7.cloneDeep(toolCall);
+        var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
+        try {
+            for(var _iterator = Object.entries(delta.function)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
+                var _step_value = _sliced_to_array(_step.value, 2), key = _step_value[0], value = _step_value[1];
+                var _result_function_key;
+                result.function[key] = "".concat((_result_function_key = result.function[key]) !== null && _result_function_key !== void 0 ? _result_function_key : "").concat(value);
+            }
+        } catch (err) {
+            _didIteratorError = true;
+            _iteratorError = err;
+        } finally{
+            try {
+                if (!_iteratorNormalCompletion && _iterator.return != null) {
+                    _iterator.return();
                 }
+            } finally{
+                if (_didIteratorError) {
+                    throw _iteratorError;
+                }
+            }
+        }
+        return result;
+    }
+    return toolCall;
+};
+var updatedRunStep = function(param) {
+    var runStep = param.runStep, value = param.value;
+    var _runStep_step_details, _value_data_delta_step_details, _value_data_delta;
+    if (!(runStep === null || runStep === void 0 ? void 0 : (_runStep_step_details = runStep.step_details) === null || _runStep_step_details === void 0 ? void 0 : _runStep_step_details.tool_calls)) return runStep;
+    if (((_value_data_delta = value.data.delta) === null || _value_data_delta === void 0 ? void 0 : (_value_data_delta_step_details = _value_data_delta.step_details) === null || _value_data_delta_step_details === void 0 ? void 0 : _value_data_delta_step_details.type) === "tool_calls") {
+        if (!value.data.delta.step_details.tool_calls) return runStep;
+        var newToolCalls = _7.cloneDeep(runStep.step_details.tool_calls);
+        value.data.delta.step_details.tool_calls.forEach(function(delta) {
+            return newToolCalls[delta.index] = updatedToolCall({
+                toolCall: newToolCalls[delta.index],
+                delta: delta
             });
         });
-        return function(newMessage) {
-            return _ref.apply(this, arguments);
-        };
-    }();
+        return _object_spread_props(_object_spread({}, runStep), {
+            step_details: _object_spread_props(_object_spread({}, runStep.step_details, value.data.delta.step_details), {
+                tool_calls: newToolCalls
+            })
+        });
+    } else {
+        return runStep;
+    }
 };
-// src/hooks/messages/useCreateMessage/lib/mutationOptions/onSettled.ts
-import { omit as omit2 } from "radash";
-var onSettled3 = function(param) {
-    var queryClient = param.queryClient;
+var threadRunStepDelta = function(param) {
+    var value = param.value;
+    return function(prevData) {
+        if (!prevData) return prevData;
+        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
+        return _object_spread_props(_object_spread({}, prevData), {
+            pages: [
+                _object_spread_props(_object_spread({}, latestPage), {
+                    data: latestPage.data.map(function(m) {
+                        if (m.run_id === value.data.run_id) {
+                            return _object_spread_props(_object_spread({}, m), {
+                                runSteps: m.runSteps.map(function(rs) {
+                                    if (rs.id === value.data.id) {
+                                        return updatedRunStep({
+                                            runStep: rs,
+                                            value: value
+                                        });
+                                    }
+                                    return rs;
+                                })
+                            });
+                        }
+                        return m;
+                    })
+                })
+            ].concat(_to_consumable_array(pagesRest))
+        });
+    };
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunStepCompleted.ts
+import { replace as replace2 } from "radash";
+var threadRunStepCompleted = function(param) {
+    var value = param.value;
+    return function(prevData) {
+        if (!prevData) return prevData;
+        var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
+        return _object_spread_props(_object_spread({}, prevData), {
+            pages: [
+                _object_spread_props(_object_spread({}, latestPage), {
+                    data: latestPage.data.map(function(m) {
+                        if (m.run_id === value.data.run_id) {
+                            return _object_spread_props(_object_spread({}, m), {
+                                runSteps: replace2(m.runSteps, value.data, function(rs) {
+                                    return rs.id === value.data.id;
+                                })
+                            });
+                        }
+                        return m;
+                    })
+                })
+            ].concat(_to_consumable_array(pagesRest))
+        });
+    };
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/index.ts
+var handlers = {
+    "thread.message.created": threadMessageCreated,
+    "thread.message.delta": threadMessageDelta,
+    "thread.message.completed": threadMessageCompleted,
+    "thread.run.created": threadRunCreated,
+    "thread.run.step.created": threadRunStepCreated,
+    "thread.run.step.delta": threadRunStepDelta,
+    "thread.run.step.completed": threadRunStepCompleted
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/index.ts
+var handleResponse = function(param) {
+    var value = param.value, messagesQueryKey = param.messagesQueryKey, queryClient = param.queryClient;
+    var handler = handlers[value.value.event];
+    if (!handler) {
+        return console.log("Missing handler", {
+            value: value
+        });
+    }
+    return queryClient.setQueryData(messagesQueryKey, handler({
+        value: value.value
+    }));
+};
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/index.ts
+var mutationFn = function(param) {
+    var superinterfaceContext = param.superinterfaceContext, queryClient = param.queryClient, threadContext = param.threadContext;
     return function() {
-        var _ref = _async_to_generator(function(_data, _error, variables) {
+        var _ref = _async_to_generator(function(variables) {
+            var response, parser, reader, messagesQueryKey, _ref, done, value;
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
                         return [
                             4,
-                            queryClient.invalidateQueries({
-                                queryKey: [
-                                    "messages",
-                                    omit2(variables, [
-                                        "content"
-                                    ])
-                                ]
-                            })
+                            fetch("".concat(superinterfaceContext.baseUrl, "/messages"), _object_spread({
+                                method: "POST",
+                                body: JSON.stringify(variables),
+                                credentials: "include"
+                            }, superinterfaceContext.publicApiKey ? {
+                                headers: {
+                                    Authorization: "Bearer ".concat(superinterfaceContext.publicApiKey)
+                                }
+                            } : {}))
                         ];
                     case 1:
-                        _state.sent();
+                        response = _state.sent();
+                        if (response.body == null) {
+                            throw new Error("The response body is empty.");
+                        }
+                        parser = new JSONParser({
+                            stringBufferSize: void 0,
+                            paths: [
+                                "$"
+                            ],
+                            separator: ""
+                        });
+                        reader = response.body.pipeThrough(parser).getReader();
+                        messagesQueryKey = [
+                            "messages",
+                            threadContext.variables
+                        ];
+                        _state.label = 2;
+                    case 2:
+                        if (!true) return [
+                            3,
+                            4
+                        ];
                         return [
                             4,
-                            queryClient.invalidateQueries({
-                                queryKey: [
-                                    "runs",
-                                    omit2(variables, [
-                                        "content"
-                                    ])
-                                ]
-                            })
+                            reader.read()
                         ];
-                    case 2:
-                        _state.sent();
+                    case 3:
+                        _ref = _state.sent(), done = _ref.done, value = _ref.value;
+                        if (done) return [
+                            3,
+                            4
+                        ];
+                        handleResponse({
+                            value: value,
+                            messagesQueryKey: messagesQueryKey,
+                            queryClient: queryClient
+                        });
+                        return [
+                            3,
+                            2
+                        ];
+                    case 4:
                         return [
                             2
                         ];
                 }
             });
         });
-        return function(_data, _error, variables) {
+        return function(variables) {
             return _ref.apply(this, arguments);
         };
     }();
 };
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/index.ts
+var mutationOptions = function(param) {
+    var queryClient = param.queryClient, threadContext = param.threadContext, superinterfaceContext = param.superinterfaceContext, onError = param.onError;
+    var mutationKey = [
+        "createMessage",
+        threadContext.variables
+    ];
+    return _object_spread_props(_object_spread({
+        mutationFn: mutationFn({
+            queryClient: queryClient,
+            superinterfaceContext: superinterfaceContext,
+            threadContext: threadContext
+        }),
+        onMutate: onMutate({
+            queryClient: queryClient
+        }),
+        onError: onError
+    }, threadContext.defaultOptions.mutations, queryClient.getMutationDefaults(mutationKey)), {
+        mutationKey: mutationKey
+    });
+};
 // src/hooks/messages/useCreateMessage/index.ts
 var useCreateMessage = function() {
     var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {
         onError: function() {}
     }, _ref_onError = _ref.onError, onError = _ref_onError === void 0 ? function() {} : _ref_onError;
-    var queryClient = useQueryClient8();
+    var queryClient = useQueryClient3();
     var superinterfaceContext = useSuperinterfaceContext();
     var threadContext = useSuperinterfaceContext();
-    var props = useMutation3(_object_spread({
-        onMutate: onMutate2({
-            queryClient: queryClient
-        }),
-        onSettled: onSettled3({
-            queryClient: queryClient
-        }),
-        onError: onError
-    }, mutationOptions({
-        mutationKeyBase: [
-            "createMessage"
-        ],
-        path: "/messages",
+    var props = useMutation(mutationOptions({
         queryClient: queryClient,
         threadContext: threadContext,
-        superinterfaceContext: superinterfaceContext
-    })));
+        superinterfaceContext: superinterfaceContext,
+        onError: onError
+    }));
     return _object_spread_props(_object_spread({}, props), {
-        createMessage: partob3(props.mutateAsync, threadContext.variables)
+        createMessage: partob(props.mutateAsync, threadContext.variables)
     });
 };
 // src/components/threads/Thread/MessageForm/Root/lib/formOptions.ts
@@ -2303,13 +2051,6 @@ var Root2 = function(param) {
     var children = param.children;
     var formProps = useForm(formOptions);
     var handleSubmit = formProps.handleSubmit, isSubmitting = formProps.formState.isSubmitting, reset = formProps.reset;
-    var _useIsRunActive = useIsRunActive(), isRunActive2 = _useIsRunActive.isRunActive;
-    var isLoading = useMemo9(function() {
-        return isRunActive2 || isSubmitting;
-    }, [
-        isRunActive2,
-        isSubmitting
-    ]);
     var addToast = useToasts().addToast;
     var createMessage = useCreateMessage({
         onError: function(error) {
@@ -2319,8 +2060,15 @@ var Root2 = function(param) {
             });
         }
     }).createMessage;
+    var isMutatingMessage = useIsMutatingMessage();
+    var isLoading = useMemo8(function() {
+        return isMutatingMessage || isSubmitting;
+    }, [
+        isMutatingMessage,
+        isSubmitting
+    ]);
     var onSubmit = function() {
-        var _ref = _async_to_generator(function(data3) {
+        var _ref = _async_to_generator(function(data2) {
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
@@ -2328,7 +2076,7 @@ var Root2 = function(param) {
                         return [
                             4,
                             createMessage({
-                                content: data3.content
+                                content: data2.content
                             })
                         ];
                     case 1:
@@ -2339,12 +2087,12 @@ var Root2 = function(param) {
                 }
             });
         });
-        return function onSubmit(data3) {
+        return function onSubmit(data2) {
             return _ref.apply(this, arguments);
         };
     }();
     var latestMessage = useLatestMessage().latestMessage;
-    var isDisabled = useMemo9(function() {
+    var isDisabled = useMemo8(function() {
         var // @ts-ignore-next-line
         _latestMessage_metadata;
         return latestMessage === null || latestMessage === void 0 ? void 0 : (_latestMessage_metadata = latestMessage.metadata) === null || _latestMessage_metadata === void 0 ? void 0 : _latestMessage_metadata.isBlocking;
@@ -2366,15 +2114,15 @@ var Root2 = function(param) {
     });
 };
 // src/components/threads/Thread/MessageForm/Field/index.tsx
-import { usePrevious as usePrevious2 } from "react-use";
-import { useContext as useContext10, useMemo as useMemo10, useRef as useRef3, useEffect as useEffect6 } from "react";
+import { usePrevious } from "react-use";
+import { useContext as useContext9, useMemo as useMemo9, useRef as useRef3, useEffect as useEffect3 } from "react";
 // src/components/textareas/TextareaBase/index.tsx
 import { forwardRef as forwardRef3 } from "react";
 import TextareaAutosize from "react-textarea-autosize";
-import { Fragment as Fragment2, jsx as jsx41, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx41, jsxs as jsxs11 } from "react/jsx-runtime";
 var UPSCALE_RATIO = 16 / 14;
 var TextareaBase = forwardRef3(function TextareaBase2(props, ref) {
-    return /* @__PURE__ */ jsxs12(Fragment2, {
+    return /* @__PURE__ */ jsxs11(Fragment3, {
         children: [
             /* @__PURE__ */ jsx41("style", {
                 children: ".superinterface-textarea { min-height: inherit; height: 30px; }\n.superinterface-textarea::placeholder { color: var(--gray-a10); }"
@@ -2435,19 +2183,19 @@ var Root3 = function(param) {
     });
 };
 var Control = function() {
-    var assistantNameContext = useContext10(AssistantNameContext);
+    var assistantNameContext = useContext9(AssistantNameContext);
     var register = useFormContext().register;
     var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading;
-    var isSubmitDisabled = useMemo10(function() {
+    var isSubmitDisabled = useMemo9(function() {
         return isDisabled || isLoading;
     }, [
         isDisabled,
         isLoading
     ]);
-    var isDisabledPrevious = usePrevious2(isDisabled);
+    var isDisabledPrevious = usePrevious(isDisabled);
     var textareaRef = useRef3(null);
     var textareaProps = register("content");
-    useEffect6(function() {
+    useEffect3(function() {
         if (isDisabled) return;
         if (!isDisabledPrevious) return;
         if (!textareaRef.current) return;
@@ -2481,10 +2229,10 @@ var Field = {
     Control: Control
 };
 // src/components/threads/Thread/MessageForm/index.tsx
-import { jsx as jsx43, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs12 } from "react/jsx-runtime";
 var MessageForm = function() {
     return /* @__PURE__ */ jsx43(Root2, {
-        children: /* @__PURE__ */ jsxs13(Field.Root, {
+        children: /* @__PURE__ */ jsxs12(Field.Root, {
             children: [
                 /* @__PURE__ */ jsx43(Text5, {
                     size: "2",
@@ -2511,35 +2259,16 @@ MessageForm.Field = Field;
 MessageForm.Submit = Submit;
 // src/components/threads/Thread/Root/index.tsx
 import { Flex as Flex15 } from "@radix-ui/themes";
-// src/components/runs/PollingProvider/index.tsx
-import { useState as useState3 } from "react";
-import { jsx as jsx44 } from "react/jsx-runtime";
-var PollingProvider = function(param) {
-    var children = param.children;
-    var _useState3 = _sliced_to_array(useState3(false), 2), isPollRefetching = _useState3[0], setIsPollRefetching = _useState3[1];
-    return /* @__PURE__ */ jsx44(PollingContext.Provider, {
-        value: {
-            isPollRefetching: isPollRefetching,
-            setIsPollRefetching: setIsPollRefetching
-        },
-        children: children
-    });
-};
 // src/components/threads/Thread/Provider/index.tsx
-import { jsx as jsx45 } from "react/jsx-runtime";
-var Provider2 = function(args) {
-    return /* @__PURE__ */ jsx45(PollingProvider, {
-        children: /* @__PURE__ */ jsx45(SuperinterfaceProvider, _object_spread({}, args))
-    });
-};
+var Provider2 = SuperinterfaceProvider;
 // src/components/threads/Thread/Root/index.tsx
-import { jsx as jsx46 } from "react/jsx-runtime";
+import { jsx as jsx44 } from "react/jsx-runtime";
 var Root4 = function(_param) {
     var children = _param.children, rest = _object_without_properties(_param, [
         "children"
     ]);
-    return /* @__PURE__ */ jsx46(Provider2, _object_spread_props(_object_spread({}, rest), {
-        children: /* @__PURE__ */ jsx46(Flex15, {
+    return /* @__PURE__ */ jsx44(Provider2, _object_spread_props(_object_spread({}, rest), {
+        children: /* @__PURE__ */ jsx44(Flex15, {
             direction: "column",
             flexGrow: "1",
             children: children
@@ -2547,12 +2276,12 @@ var Root4 = function(_param) {
     }));
 };
 // src/components/threads/Thread/index.tsx
-import { jsx as jsx47, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs13 } from "react/jsx-runtime";
 var Thread = function(props) {
-    return /* @__PURE__ */ jsxs14(Root4, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ jsxs13(Root4, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ jsx47(Messages, {}),
-            /* @__PURE__ */ jsx47(MessageForm, {})
+            /* @__PURE__ */ jsx45(Messages, {}),
+            /* @__PURE__ */ jsx45(MessageForm, {})
         ]
     }));
 };
@@ -2560,30 +2289,30 @@ Thread.Root = Root4;
 Thread.Messages = Messages;
 Thread.MessageForm = MessageForm;
 // src/hooks/messages/useMessageContext/index.ts
-import { useContext as useContext11 } from "react";
+import { useContext as useContext10 } from "react";
 var useMessageContext = function() {
-    return useContext11(MessageContext);
+    return useContext10(MessageContext);
 };
 // src/components/threads/ThreadDialog/Provider/index.tsx
-import { useState as useState4 } from "react";
+import { useState } from "react";
 // src/contexts/threads/ThreadDialogContext/index.ts
-import { createContext as createContext10 } from "react";
-var ThreadDialogContext = createContext10({
+import { createContext as createContext9 } from "react";
+var ThreadDialogContext = createContext9({
     isOpen: false,
     setIsOpen: function() {}
 });
 // src/hooks/threads/useThreadDialogContext/index.ts
-import { useContext as useContext12 } from "react";
+import { useContext as useContext11 } from "react";
 var useThreadDialogContext = function() {
-    return useContext12(ThreadDialogContext);
+    return useContext11(ThreadDialogContext);
 };
 // src/components/threads/ThreadDialog/Provider/index.tsx
-import { jsx as jsx48 } from "react/jsx-runtime";
+import { jsx as jsx46 } from "react/jsx-runtime";
 var Provider3 = function(param) {
     var children = param.children;
     var threadDialogContext = useThreadDialogContext();
-    var _useState4 = _sliced_to_array(useState4(threadDialogContext.isOpen), 2), isOpen = _useState4[0], setIsOpen = _useState4[1];
-    return /* @__PURE__ */ jsx48(ThreadDialogContext.Provider, {
+    var _useState = _sliced_to_array(useState(threadDialogContext.isOpen), 2), isOpen = _useState[0], setIsOpen = _useState[1];
+    return /* @__PURE__ */ jsx46(ThreadDialogContext.Provider, {
         value: {
             isOpen: isOpen,
             setIsOpen: setIsOpen
@@ -2592,31 +2321,31 @@ var Provider3 = function(param) {
     });
 };
 // src/components/toasts/ToastsProvider/index.tsx
-import { useState as useState5, useCallback as useCallback2 } from "react";
+import { useState as useState2, useCallback as useCallback2 } from "react";
 import * as Toast2 from "@radix-ui/react-toast";
 // src/components/toasts/ToastsProvider/CustomToast.tsx
 import * as Toast from "@radix-ui/react-toast";
 import { Card, Text as Text6, Flex as Flex16 } from "@radix-ui/themes";
 import { CheckCircledIcon as CheckCircledIcon2, CrossCircledIcon } from "@radix-ui/react-icons";
-import { jsx as jsx49, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs14 } from "react/jsx-runtime";
 var CustomToast = function(param) {
     var toast = param.toast;
-    return /* @__PURE__ */ jsx49(Toast.Root, {
-        children: /* @__PURE__ */ jsx49(Card, {
-            children: /* @__PURE__ */ jsx49(Toast.Title, {
-                children: /* @__PURE__ */ jsxs15(Flex16, {
+    return /* @__PURE__ */ jsx47(Toast.Root, {
+        children: /* @__PURE__ */ jsx47(Card, {
+            children: /* @__PURE__ */ jsx47(Toast.Title, {
+                children: /* @__PURE__ */ jsxs14(Flex16, {
                     children: [
-                        /* @__PURE__ */ jsx49(Flex16, {
+                        /* @__PURE__ */ jsx47(Flex16, {
                             pr: "2",
                             height: "14px",
                             align: "center",
-                            children: toast.type === "success" ? /* @__PURE__ */ jsx49(CheckCircledIcon2, {
+                            children: toast.type === "success" ? /* @__PURE__ */ jsx47(CheckCircledIcon2, {
                                 color: "var(--mint-9)"
-                            }) : /* @__PURE__ */ jsx49(CrossCircledIcon, {
+                            }) : /* @__PURE__ */ jsx47(CrossCircledIcon, {
                                 color: "var(--red-9)"
                             })
                         }),
-                        /* @__PURE__ */ jsx49(Text6, {
+                        /* @__PURE__ */ jsx47(Text6, {
                             weight: "medium",
                             size: "1",
                             children: toast.message
@@ -2628,10 +2357,10 @@ var CustomToast = function(param) {
     });
 };
 // src/components/toasts/ToastsProvider/index.tsx
-import { jsx as jsx50, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs15 } from "react/jsx-runtime";
 var ToastsProvider = function(param) {
     var children = param.children;
-    var _useState5 = _sliced_to_array(useState5([]), 2), toasts = _useState5[0], setToasts = _useState5[1];
+    var _useState2 = _sliced_to_array(useState2([]), 2), toasts = _useState2[0], setToasts = _useState2[1];
     var addToast = useCallback2(function(toast) {
         return setToasts(function(prevToasts) {
             return _to_consumable_array(prevToasts).concat([
@@ -2639,20 +2368,20 @@ var ToastsProvider = function(param) {
             ]);
         });
     }, []);
-    return /* @__PURE__ */ jsx50(ToastsContext.Provider, {
+    return /* @__PURE__ */ jsx48(ToastsContext.Provider, {
         value: {
             toasts: toasts,
             addToast: addToast
         },
-        children: /* @__PURE__ */ jsxs16(Toast2.Provider, {
+        children: /* @__PURE__ */ jsxs15(Toast2.Provider, {
             children: [
                 children,
                 Array.from(toasts).map(function(toast, index) {
-                    return /* @__PURE__ */ jsx50(CustomToast, {
+                    return /* @__PURE__ */ jsx48(CustomToast, {
                         toast: toast
                     }, index);
                 }),
-                /* @__PURE__ */ jsx50(Toast2.Viewport, {
+                /* @__PURE__ */ jsx48(Toast2.Viewport, {
                     style: {
                         position: "absolute",
                         bottom: 0,
@@ -2674,22 +2403,22 @@ var ToastsProvider = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Root/index.tsx
-import { jsx as jsx51 } from "react/jsx-runtime";
+import { jsx as jsx49 } from "react/jsx-runtime";
 var Root6 = function(param) {
-    var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ jsx51(ToastsProvider, {
-        children: /* @__PURE__ */ jsx51(Provider3, {
+    var children = param.children;
+    return /* @__PURE__ */ jsx49(ToastsProvider, {
+        children: /* @__PURE__ */ jsx49(Provider3, {
             children: children
         })
     });
 };
 // src/components/threads/ThreadDialog/Trigger/index.tsx
 import { Flex as Flex17 } from "@radix-ui/themes";
-import { jsx as jsx52 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 var Trigger = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ jsx52(Flex17, {
+    return /* @__PURE__ */ jsx50(Flex17, {
         display: {
             initial: isOpen ? "none" : "flex",
             sm: "flex"
@@ -2715,12 +2444,12 @@ var Trigger = function(param) {
 // src/components/threads/ThreadDialog/Button/index.tsx
 import { IconButton as IconButton2 } from "@radix-ui/themes";
 import { ChatBubbleIcon } from "@radix-ui/react-icons";
-import { jsx as jsx53 } from "react/jsx-runtime";
+import { jsx as jsx51 } from "react/jsx-runtime";
 var Button2 = function() {
-    return /* @__PURE__ */ jsx53(IconButton2, {
+    return /* @__PURE__ */ jsx51(IconButton2, {
         size: "4",
         radius: "full",
-        children: /* @__PURE__ */ jsx53(ChatBubbleIcon, {})
+        children: /* @__PURE__ */ jsx51(ChatBubbleIcon, {})
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
@@ -2728,10 +2457,10 @@ import { Card as Card2, Inset, Flex as Flex19 } from "@radix-ui/themes";
 // src/components/threads/ThreadDialog/Close/index.tsx
 import { Cross1Icon } from "@radix-ui/react-icons";
 import { IconButton as IconButton3, Flex as Flex18 } from "@radix-ui/themes";
-import { jsx as jsx54 } from "react/jsx-runtime";
+import { jsx as jsx52 } from "react/jsx-runtime";
 var Close = function() {
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ jsx54(Flex18, {
+    return /* @__PURE__ */ jsx52(Flex18, {
         display: {
             initial: isOpen ? "flex" : "none",
             sm: "none"
@@ -2751,20 +2480,20 @@ var Close = function() {
         style: {
             zIndex: 9999999999
         },
-        children: /* @__PURE__ */ jsx54(IconButton3, {
+        children: /* @__PURE__ */ jsx52(IconButton3, {
             size: "2",
             variant: "soft",
-            children: /* @__PURE__ */ jsx54(Cross1Icon, {})
+            children: /* @__PURE__ */ jsx52(Cross1Icon, {})
         })
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
-import { jsx as jsx55, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs16 } from "react/jsx-runtime";
 var Root7 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var isOpen = useThreadDialogContext().isOpen;
     if (!isOpen) return null;
-    return /* @__PURE__ */ jsx55(Flex19, {
+    return /* @__PURE__ */ jsx53(Flex19, {
         direction: "column",
         justify: "end",
         position: "fixed",
@@ -2792,7 +2521,7 @@ var Root7 = function(param) {
         style: _object_spread({
             zIndex: 9999999999
         }, style),
-        children: /* @__PURE__ */ jsxs17(Card2, {
+        children: /* @__PURE__ */ jsxs16(Card2, {
             mb: {
                 initial: void 0,
                 sm: "3"
@@ -2803,7 +2532,7 @@ var Root7 = function(param) {
                 flexGrow: 1
             },
             children: [
-                /* @__PURE__ */ jsx55(Inset, {
+                /* @__PURE__ */ jsx53(Inset, {
                     clip: "padding-box",
                     side: "all",
                     pb: "current",
@@ -2813,31 +2542,31 @@ var Root7 = function(param) {
                     },
                     children: children
                 }),
-                /* @__PURE__ */ jsx55(Close, {})
+                /* @__PURE__ */ jsx53(Close, {})
             ]
         })
     });
 };
 var Content4 = function(param) {
     var _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ jsx55(Root7, {
+    return /* @__PURE__ */ jsx53(Root7, {
         style: style,
-        children: /* @__PURE__ */ jsxs17(Thread.Root, {
+        children: /* @__PURE__ */ jsxs16(Thread.Root, {
             children: [
-                /* @__PURE__ */ jsx55(Thread.Messages, {
+                /* @__PURE__ */ jsx53(Thread.Messages, {
                     style: {
                         paddingTop: "var(--space-5)",
                         paddingRight: "var(--space-5)",
                         paddingLeft: "var(--space-5)"
                     }
                 }),
-                /* @__PURE__ */ jsx55(Flex19, {
+                /* @__PURE__ */ jsx53(Flex19, {
                     direction: "column",
                     pl: "5",
                     pr: "5",
                     pb: "3",
                     flexShrink: "0",
-                    children: /* @__PURE__ */ jsx55(Thread.MessageForm, {})
+                    children: /* @__PURE__ */ jsx53(Thread.MessageForm, {})
                 })
             ]
         })
@@ -2845,13 +2574,13 @@ var Content4 = function(param) {
 };
 Content4.Root = Root7;
 // src/components/threads/ThreadDialog/index.tsx
-import { jsx as jsx56, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs17 } from "react/jsx-runtime";
 var ThreadDialog = function() {
-    return /* @__PURE__ */ jsxs18(Root6, {
+    return /* @__PURE__ */ jsxs17(Root6, {
         children: [
-            /* @__PURE__ */ jsx56(Content4, {}),
-            /* @__PURE__ */ jsx56(Trigger, {
-                children: /* @__PURE__ */ jsx56(Button2, {})
+            /* @__PURE__ */ jsx54(Content4, {}),
+            /* @__PURE__ */ jsx54(Trigger, {
+                children: /* @__PURE__ */ jsx54(Button2, {})
             })
         ]
     });
@@ -2864,8 +2593,8 @@ ThreadDialog.Content = Content4;
 import "regenerator-runtime/runtime";
 import { Flex as Flex20 } from "@radix-ui/themes";
 // src/contexts/threads/AudioThreadContext/index.ts
-import { createContext as createContext11 } from "react";
-var AudioThreadContext = createContext11({
+import { createContext as createContext10 } from "react";
+var AudioThreadContext = createContext10({
     status: "idle",
     recorderProps: {
         status: "idle",
@@ -2933,14 +2662,12 @@ var blobToData = function(blob) {
     });
 };
 // src/hooks/audioThreads/useStatus/index.ts
-import { useMemo as useMemo11 } from "react";
+import { useMemo as useMemo10 } from "react";
 var useStatus = function(param) {
     var messageAudioProps = param.messageAudioProps, recorderProps = param.recorderProps, createMessageProps = param.createMessageProps;
-    var isRunActiveProps = useIsRunActive();
-    var status = useMemo11(function() {
+    var status = useMemo10(function() {
         if (recorderProps.status === "recording") return "recording";
         if (createMessageProps.isPending) return "creatingMessage";
-        if (isRunActiveProps.isRunActive) return "runActive";
         if (messageAudioProps.playing) return "playing";
         if (messageAudioProps.paused) return "playerPaused";
         if (!messageAudioProps.isReady) return "loading";
@@ -2950,29 +2677,28 @@ var useStatus = function(param) {
     }, [
         messageAudioProps,
         recorderProps,
-        createMessageProps,
-        isRunActiveProps
+        createMessageProps
     ]);
     return {
         status: status
     };
 };
 // src/hooks/audioThreads/useRecorder/index.ts
-import dayjs from "dayjs";
+import dayjs2 from "dayjs";
 import { useAudioCapture } from "use-audio-capture";
-import { useMemo as useMemo12, useRef as useRef4, useState as useState6, useCallback as useCallback3, useEffect as useEffect7 } from "react";
+import { useMemo as useMemo11, useRef as useRef4, useState as useState3, useCallback as useCallback3, useEffect as useEffect4 } from "react";
 import { useAudioPlayer } from "react-use-audio-player";
-import { useInterval as useInterval2 } from "react-use";
+import { useInterval } from "react-use";
 var useRecorder = function(param) {
     var isStopOnSilence = param.isStopOnSilence, onStart = param.onStart, onStop = param.onStop;
-    var _useState6 = _sliced_to_array(useState6(null), 2), silenceStart = _useState6[0], setSilenceStart = _useState6[1];
-    var _useState61 = _sliced_to_array(useState6(null), 2), noiseStart = _useState61[0], setNoiseStart = _useState61[1];
-    var _useState62 = _sliced_to_array(useState6(null), 2), mediaStream = _useState62[0], setMediaStream = _useState62[1];
-    var _useState63 = _sliced_to_array(useState6("idle"), 2), status = _useState63[0], setStatus = _useState63[1];
+    var _useState3 = _sliced_to_array(useState3(null), 2), silenceStart = _useState3[0], setSilenceStart = _useState3[1];
+    var _useState31 = _sliced_to_array(useState3(null), 2), noiseStart = _useState31[0], setNoiseStart = _useState31[1];
+    var _useState32 = _sliced_to_array(useState3(null), 2), mediaStream = _useState32[0], setMediaStream = _useState32[1];
+    var _useState33 = _sliced_to_array(useState3("idle"), 2), status = _useState33[0], setStatus = _useState33[1];
     var startAudioPlayer = useAudioPlayer();
     var endAudioPlayer = useAudioPlayer();
-    var _useState64 = _sliced_to_array(useState6(false), 2), isLoaded = _useState64[0], setIsLoaded = _useState64[1];
-    useEffect7(function() {
+    var _useState34 = _sliced_to_array(useState3(false), 2), isLoaded = _useState34[0], setIsLoaded = _useState34[1];
+    useEffect4(function() {
         if (isLoaded) return;
         setIsLoaded(true);
     }, [
@@ -3030,9 +2756,9 @@ var useRecorder = function(param) {
             setNoiseStart(null);
         }
     });
-    var _useState65 = _sliced_to_array(useState6(null), 2), audioEngine = _useState65[0], setAudioEngine = _useState65[1];
+    var _useState35 = _sliced_to_array(useState3(null), 2), audioEngine = _useState35[0], setAudioEngine = _useState35[1];
     var isInited = useRef4(false);
-    useEffect7(function() {
+    useEffect4(function() {
         if (!mediaStream) return;
         if (isInited.current) return;
         isInited.current = true;
@@ -3045,7 +2771,7 @@ var useRecorder = function(param) {
         isInited,
         mediaStream
     ]);
-    var visualizationAnalyser = useMemo12(function() {
+    var visualizationAnalyser = useMemo11(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         audioEngine.source.connect(result);
@@ -3053,7 +2779,7 @@ var useRecorder = function(param) {
     }, [
         audioEngine
     ]);
-    var silenceAnalyser = useMemo12(function() {
+    var silenceAnalyser = useMemo11(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         result.minDecibels = -45;
@@ -3070,12 +2796,12 @@ var useRecorder = function(param) {
             return f === 0;
         });
         setSilenceStart(function(silenceStart2) {
-            if (isSilent) return silenceStart2 || dayjs();
+            if (isSilent) return silenceStart2 || dayjs2();
             return null;
         });
         setNoiseStart(function(noiseStart2) {
             if (isSilent) return noiseStart2;
-            return noiseStart2 || dayjs();
+            return noiseStart2 || dayjs2();
         });
         requestAnimationFrame(function() {
             return handleSilence();
@@ -3085,7 +2811,7 @@ var useRecorder = function(param) {
         setNoiseStart,
         setSilenceStart
     ]);
-    useEffect7(function() {
+    useEffect4(function() {
         if (!isStopOnSilence) return;
         requestAnimationFrame(function() {
             return handleSilence();
@@ -3094,12 +2820,12 @@ var useRecorder = function(param) {
         handleSilence,
         isStopOnSilence
     ]);
-    useInterval2(function() {
+    useInterval(function() {
         if (!isStopOnSilence) return;
         if (status !== "recording") return;
         if (!silenceStart) return;
         if (!noiseStart) return;
-        if (!silenceStart.isBefore(dayjs().subtract(1, "second"))) return;
+        if (!silenceStart.isBefore(dayjs2().subtract(1, "second"))) return;
         audioCaptureProps.stop();
     }, 100);
     return _object_spread_props(_object_spread({}, audioCaptureProps), {
@@ -3108,7 +2834,7 @@ var useRecorder = function(param) {
     });
 };
 // src/hooks/audioThreads/useMessageAudio/index.ts
-import { useMemo as useMemo13, useRef as useRef5, useState as useState7, useEffect as useEffect8 } from "react";
+import { useMemo as useMemo12, useRef as useRef5, useState as useState4, useEffect as useEffect5 } from "react";
 import { Howler } from "howler";
 import { useAudioPlayer as useAudioPlayer2 } from "react-use-audio-player";
 // src/hooks/audioThreads/useMessageAudio/lib/input.ts
@@ -3134,11 +2860,11 @@ var isHtmlAudioSupported = !unsupportedNames.includes(((_detect = detect()) ===
 // src/hooks/audioThreads/useMessageAudio/index.ts
 var useMessageAudio = function(param) {
     var onEnd = param.onEnd;
-    var _useState7 = _sliced_to_array(useState7([]), 2), playedMessages = _useState7[0], setPlayedMessages = _useState7[1];
+    var _useState4 = _sliced_to_array(useState4([]), 2), playedMessages = _useState4[0], setPlayedMessages = _useState4[1];
     var audioPlayer = useAudioPlayer2();
     var superinterfaceContext = useSuperinterfaceContext();
     var latestMessageProps = useLatestMessage();
-    useEffect8(function() {
+    useEffect5(function() {
         if (audioPlayer.playing) return;
         if (!latestMessageProps.latestMessage) return;
         if (latestMessageProps.latestMessage.role !== "assistant") return;
@@ -3178,8 +2904,8 @@ var useMessageAudio = function(param) {
         onEnd
     ]);
     var isInited = useRef5(false);
-    var _useState71 = _sliced_to_array(useState7(null), 2), audioEngine = _useState71[0], setAudioEngine = _useState71[1];
-    useEffect8(function() {
+    var _useState41 = _sliced_to_array(useState4(null), 2), audioEngine = _useState41[0], setAudioEngine = _useState41[1];
+    useEffect5(function() {
         if (!audioPlayer.playing) return;
         if (isInited.current) return;
         isInited.current = true;
@@ -3200,7 +2926,7 @@ var useMessageAudio = function(param) {
         audioPlayer,
         isInited
     ]);
-    var visualizationAnalyser = useMemo13(function() {
+    var visualizationAnalyser = useMemo12(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         audioEngine.source.connect(audioEngine.audioContext.destination);
@@ -3214,10 +2940,9 @@ var useMessageAudio = function(param) {
     });
 };
 // src/components/threads/AudioThread/Root/index.tsx
-import { jsx as jsx57 } from "react/jsx-runtime";
+import { jsx as jsx55 } from "react/jsx-runtime";
 var Root8 = function(param) {
     var children = param.children;
-    useLifecycle();
     var createMessageProps = useCreateMessage();
     var recorderProps = useRecorder({
         isStopOnSilence: true,
@@ -3274,13 +2999,13 @@ var Root8 = function(param) {
         createMessageProps: createMessageProps,
         messageAudioProps: messageAudioProps
     }).status;
-    return /* @__PURE__ */ jsx57(AudioThreadContext.Provider, {
+    return /* @__PURE__ */ jsx55(AudioThreadContext.Provider, {
         value: {
             status: status,
             recorderProps: recorderProps,
             messageAudioProps: messageAudioProps
         },
-        children: /* @__PURE__ */ jsx57(Flex20, {
+        children: /* @__PURE__ */ jsx55(Flex20, {
             direction: "column",
             flexGrow: "1",
             p: "9",
@@ -3291,30 +3016,35 @@ var Root8 = function(param) {
 // src/components/threads/AudioThread/Visualization/index.tsx
 import { Flex as Flex22 } from "@radix-ui/themes";
 // src/hooks/threads/useAudioThreadContext/index.ts
-import { useContext as useContext13 } from "react";
+import { useContext as useContext12 } from "react";
 var useAudioThreadContext = function() {
-    return useContext13(AudioThreadContext);
+    return useContext12(AudioThreadContext);
 };
 // src/components/threads/AudioThread/BarsVisualizer/index.tsx
-import _6 from "lodash";
+import _8 from "lodash";
 import { Flex as Flex21, Grid } from "@radix-ui/themes";
-import { useState as useState8, useEffect as useEffect9, useCallback as useCallback4 } from "react";
+import { useState as useState5, useEffect as useEffect6, useCallback as useCallback4 } from "react";
 import { cluster } from "radash";
-import { jsx as jsx58 } from "react/jsx-runtime";
+import { jsx as jsx56 } from "react/jsx-runtime";
 var barCount = 4;
 var BarsVisualizer = function(param) {
     var visualizationAnalyser = param.visualizationAnalyser, color = param.color, height = param.height, barWidth = param.barWidth;
-    var _useState8 = _sliced_to_array(useState8(function() {
-        return new AudioContext().createAnalyser();
-    }), 1), emptyVisualizer = _useState8[0];
-    var _useState81 = _sliced_to_array(useState8([]), 2), barHeights = _useState81[0], setBarHeights = _useState81[1];
+    var _useState5 = _sliced_to_array(useState5(null), 2), cachedEmptyVisualizer = _useState5[0], setCachedEmptyVisualizer = _useState5[1];
+    var getEmptyVisualizer = useCallback4(function() {
+        var result = new AudioContext().createAnalyser();
+        setCachedEmptyVisualizer(result);
+        return result;
+    }, [
+        cachedEmptyVisualizer
+    ]);
+    var _useState51 = _sliced_to_array(useState5([]), 2), barHeights = _useState51[0], setBarHeights = _useState51[1];
     var draw = useCallback4(function(param) {
         var visualizationAnalyser2 = param.visualizationAnalyser;
         var frequencyData = new Uint8Array(visualizationAnalyser2.frequencyBinCount / 15);
         visualizationAnalyser2.getByteFrequencyData(frequencyData);
         var clusteredFrequencyData = cluster(frequencyData, frequencyData.length / barCount);
         setBarHeights(clusteredFrequencyData.map(function(frequencyDataCluster) {
-            return _6.mean(frequencyDataCluster) / 255 * 100;
+            return _8.mean(frequencyDataCluster) / 255 * 100;
         }));
         requestAnimationFrame(function() {
             return draw({
@@ -3322,16 +3052,17 @@ var BarsVisualizer = function(param) {
             });
         });
     }, []);
-    useEffect9(function() {
+    useEffect6(function() {
         draw({
-            visualizationAnalyser: visualizationAnalyser || emptyVisualizer
+            visualizationAnalyser: visualizationAnalyser || cachedEmptyVisualizer || getEmptyVisualizer()
         });
     }, [
         draw,
         visualizationAnalyser,
-        emptyVisualizer
+        cachedEmptyVisualizer,
+        getEmptyVisualizer
     ]);
-    return /* @__PURE__ */ jsx58(Grid, {
+    return /* @__PURE__ */ jsx56(Grid, {
         columns: "".concat(barCount),
         gap: "1",
         width: "auto",
@@ -3340,12 +3071,12 @@ var BarsVisualizer = function(param) {
             gridTemplateColumns: "repeat(4, minmax(0, 1fr))"
         },
         children: barHeights.map(function(barHeight, index) {
-            return /* @__PURE__ */ jsx58(Flex21, {
+            return /* @__PURE__ */ jsx56(Flex21, {
                 direction: "column",
                 align: "center",
                 justify: "center",
                 height: height,
-                children: /* @__PURE__ */ jsx58(Flex21, {
+                children: /* @__PURE__ */ jsx56(Flex21, {
                     minHeight: "50%",
                     maxHeight: "100%",
                     height: "".concat(barHeight + 20, "%"),
@@ -3360,16 +3091,16 @@ var BarsVisualizer = function(param) {
     });
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-import { jsx as jsx59 } from "react/jsx-runtime";
+import { jsx as jsx57 } from "react/jsx-runtime";
 var Visualization = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ jsx59(Flex22, {
+    return /* @__PURE__ */ jsx57(Flex22, {
         direction: "column",
         align: "center",
         justify: "center",
         mb: "3",
         flexGrow: "1",
-        children: /* @__PURE__ */ jsx59(Flex22, {
+        children: /* @__PURE__ */ jsx57(Flex22, {
             align: "center",
             justify: "center",
             height: "200px",
@@ -3378,7 +3109,7 @@ var Visualization = function() {
                 backgroundColor: "var(--".concat(audioThreadContext.status === "playing" ? "mint" : "gray", "-4)"),
                 borderRadius: "9999px"
             },
-            children: /* @__PURE__ */ jsx59(BarsVisualizer, {
+            children: /* @__PURE__ */ jsx57(BarsVisualizer, {
                 visualizationAnalyser: audioThreadContext.messageAudioProps.visualizationAnalyser,
                 color: audioThreadContext.status === "playing" ? "mint" : "gray",
                 height: "40px",
@@ -3391,47 +3122,42 @@ var Visualization = function() {
 import { SpeakerModerateIcon } from "@radix-ui/react-icons";
 import { Flex as Flex24 } from "@radix-ui/themes";
 // src/components/threads/AudioThread/Form/ActionButton/index.tsx
-import { Flex as Flex23, IconButton as IconButton4, Tooltip } from "@radix-ui/themes";
+import { Flex as Flex23, IconButton as IconButton4 } from "@radix-ui/themes";
 import { PauseIcon, ArrowUpIcon as ArrowUpIcon2, ResumeIcon } from "@radix-ui/react-icons";
-import { jsx as jsx60, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs18 } from "react/jsx-runtime";
 var ActionButton = function() {
     var audioThreadContext = useAudioThreadContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ jsxs19(Flex23, {
+        return /* @__PURE__ */ jsxs18(Flex23, {
             align: "center",
             children: [
-                /* @__PURE__ */ jsx60(Flex23, {
+                /* @__PURE__ */ jsx58(Flex23, {
                     mr: "3",
                     ml: "-7",
-                    children: /* @__PURE__ */ jsx60(IconButton4, {
+                    children: /* @__PURE__ */ jsx58(IconButton4, {
                         onClick: audioThreadContext.recorderProps.pause,
                         color: "gray",
                         radius: "full",
                         size: "1",
-                        children: /* @__PURE__ */ jsx60(PauseIcon, {})
+                        children: /* @__PURE__ */ jsx58(PauseIcon, {})
                     })
                 }),
-                /* @__PURE__ */ jsx60(Tooltip, {
-                    open: true,
-                    content: "Send your message",
-                    side: "bottom",
-                    children: /* @__PURE__ */ jsx60(IconButton4, {
-                        onClick: audioThreadContext.recorderProps.stop,
-                        color: "gray",
-                        highContrast: true,
-                        radius: "full",
-                        size: "4",
-                        style: {
-                            border: "2px solid var(--gray-8)"
-                        },
-                        children: /* @__PURE__ */ jsx60(ArrowUpIcon2, {})
-                    })
+                /* @__PURE__ */ jsx58(IconButton4, {
+                    onClick: audioThreadContext.recorderProps.stop,
+                    color: "gray",
+                    highContrast: true,
+                    radius: "full",
+                    size: "4",
+                    style: {
+                        border: "2px solid var(--gray-8)"
+                    },
+                    children: /* @__PURE__ */ jsx58(ArrowUpIcon2, {})
                 })
             ]
         });
     }
     if (audioThreadContext.status === "recorderPaused") {
-        return /* @__PURE__ */ jsx60(IconButton4, {
+        return /* @__PURE__ */ jsx58(IconButton4, {
             onClick: audioThreadContext.recorderProps.resume,
             color: "red",
             radius: "full",
@@ -3439,11 +3165,11 @@ var ActionButton = function() {
             style: {
                 border: "2px solid var(--gray-8)"
             },
-            children: /* @__PURE__ */ jsx60(ResumeIcon, {})
+            children: /* @__PURE__ */ jsx58(ResumeIcon, {})
         });
     }
     if (audioThreadContext.status === "idle") {
-        return /* @__PURE__ */ jsx60(IconButton4, {
+        return /* @__PURE__ */ jsx58(IconButton4, {
             onClick: function() {
                 return audioThreadContext.recorderProps.start();
             },
@@ -3456,7 +3182,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "playing") {
-        return /* @__PURE__ */ jsx60(IconButton4, {
+        return /* @__PURE__ */ jsx58(IconButton4, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.pause();
             },
@@ -3466,11 +3192,11 @@ var ActionButton = function() {
             style: {
                 border: "2px solid var(--gray-8)"
             },
-            children: /* @__PURE__ */ jsx60(PauseIcon, {})
+            children: /* @__PURE__ */ jsx58(PauseIcon, {})
         });
     }
     if (audioThreadContext.status === "playerPaused") {
-        return /* @__PURE__ */ jsx60(IconButton4, {
+        return /* @__PURE__ */ jsx58(IconButton4, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.play();
             },
@@ -3480,10 +3206,10 @@ var ActionButton = function() {
             style: {
                 border: "2px solid var(--gray-8)"
             },
-            children: /* @__PURE__ */ jsx60(ResumeIcon, {})
+            children: /* @__PURE__ */ jsx58(ResumeIcon, {})
         });
     }
-    return /* @__PURE__ */ jsx60(IconButton4, {
+    return /* @__PURE__ */ jsx58(IconButton4, {
         size: "4",
         color: "red",
         radius: "full",
@@ -3494,35 +3220,35 @@ var ActionButton = function() {
     });
 };
 // src/components/threads/AudioThread/Form/index.tsx
-import { jsx as jsx61, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs19 } from "react/jsx-runtime";
 var Form = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ jsxs20(Flex24, {
+    return /* @__PURE__ */ jsxs19(Flex24, {
         direction: "column",
         align: "center",
         children: [
-            /* @__PURE__ */ jsxs20(Flex24, {
+            /* @__PURE__ */ jsxs19(Flex24, {
                 pb: "3",
                 align: "center",
                 children: [
-                    /* @__PURE__ */ jsx61(Flex24, {
+                    /* @__PURE__ */ jsx59(Flex24, {
                         ml: "-5",
                         mr: "2",
                         align: "center",
-                        children: /* @__PURE__ */ jsx61(SpeakerModerateIcon, {
+                        children: /* @__PURE__ */ jsx59(SpeakerModerateIcon, {
                             style: {
                                 color: "var(--".concat(audioThreadContext.status === "recording" ? "mint" : "gray", "-12)")
                             }
                         })
                     }),
-                    /* @__PURE__ */ jsx61(Flex24, {
+                    /* @__PURE__ */ jsx59(Flex24, {
                         px: "2",
                         py: "1",
                         style: {
                             backgroundColor: "var(--".concat(audioThreadContext.status === "recording" ? "mint" : "gray", "-4)"),
                             borderRadius: "var(--radius-6)"
                         },
-                        children: /* @__PURE__ */ jsx61(BarsVisualizer, {
+                        children: /* @__PURE__ */ jsx59(BarsVisualizer, {
                             visualizationAnalyser: audioThreadContext.recorderProps.visualizationAnalyser,
                             color: audioThreadContext.status === "recording" ? "mint" : "gray",
                             height: "20px",
@@ -3531,17 +3257,17 @@ var Form = function() {
                     })
                 ]
             }),
-            /* @__PURE__ */ jsx61(ActionButton, {})
+            /* @__PURE__ */ jsx59(ActionButton, {})
         ]
     });
 };
 // src/components/threads/AudioThread/index.tsx
-import { jsx as jsx62, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs20 } from "react/jsx-runtime";
 var AudioThread = function(props) {
-    return /* @__PURE__ */ jsxs21(Root8, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ jsxs20(Root8, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ jsx62(Visualization, {}),
-            /* @__PURE__ */ jsx62(Form, {})
+            /* @__PURE__ */ jsx60(Visualization, {}),
+            /* @__PURE__ */ jsx60(Form, {})
         ]
     }));
 };
@@ -3549,15 +3275,15 @@ AudioThread.Root = Root8;
 AudioThread.Visualization = Visualization;
 AudioThread.Form = Form;
 // src/components/threads/AudioThreadDialog/index.tsx
-import { jsx as jsx63, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs21 } from "react/jsx-runtime";
 var AudioThreadDialog = function() {
-    return /* @__PURE__ */ jsxs22(Root6, {
+    return /* @__PURE__ */ jsxs21(Root6, {
         children: [
-            /* @__PURE__ */ jsx63(Content4.Root, {
-                children: /* @__PURE__ */ jsx63(AudioThread, {})
+            /* @__PURE__ */ jsx61(Content4.Root, {
+                children: /* @__PURE__ */ jsx61(AudioThread, {})
             }),
-            /* @__PURE__ */ jsx63(Trigger, {
-                children: /* @__PURE__ */ jsx63(Button2, {})
+            /* @__PURE__ */ jsx61(Trigger, {
+                children: /* @__PURE__ */ jsx61(Button2, {})
             })
         ]
     });
@@ -3576,11 +3302,11 @@ import { Flex as Flex25 } from "@radix-ui/themes";
 // src/components/suggestions/Suggestions/Item.tsx
 import { ArrowUpIcon as ArrowUpIcon3 } from "@radix-ui/react-icons";
 import { Text as Text7, Button as Button3, Spinner as Spinner2 } from "@radix-ui/themes";
-import { jsx as jsx64, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs22 } from "react/jsx-runtime";
 var Item = function(param) {
     var suggestion = param.suggestion, isDisabled = param.isDisabled;
     var _useCreateMessage = useCreateMessage(), createMessage = _useCreateMessage.createMessage, isPending = _useCreateMessage.isPending;
-    return /* @__PURE__ */ jsx64(Content5, {
+    return /* @__PURE__ */ jsx62(Content5, {
         onClick: function() {
             createMessage({
                 // @ts-ignore-next-line
@@ -3594,7 +3320,7 @@ var Item = function(param) {
 };
 var Content5 = function(param) {
     var onClick = param.onClick, isDisabled = param.isDisabled, isPending = param.isPending, children = param.children;
-    return /* @__PURE__ */ jsxs23(Button3, {
+    return /* @__PURE__ */ jsxs22(Button3, {
         variant: "soft",
         onClick: onClick,
         disabled: isDisabled,
@@ -3604,14 +3330,14 @@ var Content5 = function(param) {
             flexShrink: 1
         },
         children: [
-            /* @__PURE__ */ jsx64(Text7, {
+            /* @__PURE__ */ jsx62(Text7, {
                 size: "1",
                 weight: "regular",
                 children: children
             }),
-            /* @__PURE__ */ jsx64(Spinner2, {
+            /* @__PURE__ */ jsx62(Spinner2, {
                 loading: isPending,
-                children: /* @__PURE__ */ jsx64(ArrowUpIcon3, {
+                children: /* @__PURE__ */ jsx62(ArrowUpIcon3, {
                     style: {
                         flexShrink: 0
                     }
@@ -3622,10 +3348,10 @@ var Content5 = function(param) {
 };
 Item.Content = Content5;
 // src/components/suggestions/Suggestions/Content.tsx
-import { jsx as jsx65 } from "react/jsx-runtime";
+import { jsx as jsx63 } from "react/jsx-runtime";
 var Content6 = function(param) {
     var children = param.children;
-    var isRunActiveProps = useIsRunActive();
+    var isMutatingMessage = useIsMutatingMessage();
     var suggestions = useMemo14(function() {
         return onlyText(children).split(/\r?\n/).filter(function(c) {
             return !isEmpty2(c);
@@ -3635,26 +3361,21 @@ var Content6 = function(param) {
     }, [
         children
     ]);
-    var isDisabled = useMemo14(function() {
-        return isRunActiveProps.isRunActive;
-    }, [
-        isRunActiveProps
-    ]);
     if (isEmpty2(suggestions)) return null;
-    return /* @__PURE__ */ jsx65(Flex25, {
+    return /* @__PURE__ */ jsx63(Flex25, {
         gap: "2",
         py: "2",
         wrap: "wrap",
         children: suggestions.map(function(suggestion) {
-            return /* @__PURE__ */ jsx65(Item, {
+            return /* @__PURE__ */ jsx63(Item, {
                 suggestion: suggestion,
-                isDisabled: isDisabled
+                isDisabled: isMutatingMessage
             }, suggestion);
         })
     });
 };
 // src/components/suggestions/Suggestions/index.tsx
-import { jsx as jsx66 } from "react/jsx-runtime";
+import { jsx as jsx64 } from "react/jsx-runtime";
 var Suggestions = function(param) {
     var children = param.children;
     var latestMessageProps = useLatestMessage();
@@ -3667,14 +3388,14 @@ var Suggestions = function(param) {
     ]);
     if (latestMessageProps.isLoading) return null;
     if (isDisabled) return null;
-    return /* @__PURE__ */ jsx66(Content6, {
+    return /* @__PURE__ */ jsx64(Content6, {
         children: children
     });
 };
 Suggestions.Item = Item;
 // src/components/markdown/MarkdownProvider/index.tsx
 import { useMemo as useMemo16 } from "react";
-import { jsx as jsx67 } from "react/jsx-runtime";
+import { jsx as jsx65 } from "react/jsx-runtime";
 var MarkdownProvider = function(_param) {
     var children = _param.children, rest = _object_without_properties(_param, [
         "children"
@@ -3686,10 +3407,10 @@ var MarkdownProvider = function(_param) {
         rest,
         prevMarkdownContext
     ]);
-    return /* @__PURE__ */ jsx67(MarkdownContext.Provider, {
+    return /* @__PURE__ */ jsx65(MarkdownContext.Provider, {
         value: value,
         children: children
     });
 };
-export { AssistantAvatarContext, AssistantNameContext, AudioThread, AudioThreadDialog, FunctionBase, FunctionComponentsContext, MarkdownContext, MarkdownProvider, Suggestions, SuperinterfaceProvider, Thread, ThreadDialog, ThreadDialogContext, useCreateMessage, useCreateRun, useIsRunActive, useLatestMessage, useLatestRun, useLifecycle, useMarkdownContext, useMessageContext, useMessages, useRuns, useSuperinterfaceContext, useSuperinterfaceContext as useThreadContext };
+export { AssistantAvatarContext, AssistantNameContext, AudioThread, AudioThreadDialog, FunctionBase, FunctionComponentsContext, MarkdownContext, MarkdownProvider, Suggestions, SuperinterfaceProvider, Thread, ThreadDialog, ThreadDialogContext, useCreateMessage, useLatestMessage, useMarkdownContext, useMessageContext, useMessages, useSuperinterfaceContext, useSuperinterfaceContext as useThreadContext };
 //# sourceMappingURL=index.js.map