@superinterface/react 2.0.3 → 2.0.5

package/dist/index.cjs

@@ -347,8 +347,8 @@ __export(src_exports, {
     MarkdownContext: function() {
         return MarkdownContext;
     },
-    Suggestion: function() {
-        return Suggestion;
+    MarkdownProvider: function() {
+        return MarkdownProvider;
     },
     Suggestions: function() {
         return Suggestions;
@@ -386,6 +386,9 @@ __export(src_exports, {
     useMarkdownContext: function() {
         return useMarkdownContext;
     },
+    useMessageContext: function() {
+        return useMessageContext;
+    },
     useMessages: function() {
         return useMessages;
     },
@@ -400,6 +403,8 @@ __export(src_exports, {
     }
 });
 module.exports = __toCommonJS(src_exports);
+// src/components/core/SuperinterfaceProvider/index.tsx
+var import_sonner = require("sonner");
 // src/lib/misc/merge/index.ts
 var import_lodash2 = __toESM(require("lodash"), 1);
 // src/lib/misc/merge/customizer.ts
@@ -427,7 +432,8 @@ var SuperinterfaceContext = (0, import_react.createContext)({
     defaultOptions: {
         queries: {},
         mutations: {}
-    }
+    },
+    isToasterRendered: false
 });
 // src/hooks/core/useSuperinterfaceContext/index.ts
 var import_react2 = require("react");
@@ -439,22 +445,38 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var SuperinterfaceProvider = function(param) {
     var children = param.children, baseUrl = param.baseUrl, publicApiKey = param.publicApiKey, variables = param.variables, defaultOptions = param.defaultOptions;
     var superinterfaceContext = useSuperinterfaceContext();
-    var value = merge(superinterfaceContext, _object_spread({}, baseUrl ? {
+    var value = merge(superinterfaceContext, _object_spread_props(_object_spread({}, baseUrl ? {
         baseUrl: baseUrl
     } : {}, publicApiKey ? {
         publicApiKey: publicApiKey
     } : {}, variables ? {
         variables: variables
-    } : {}, defaultOptions ? {
+    } : {}, merge({
+        defaultOptions: {
+            mutations: {
+                onError: function(error) {
+                    return import_sonner.toast.error(error.message);
+                }
+            }
+        }
+    }, defaultOptions !== null && defaultOptions !== void 0 ? defaultOptions : {
         defaultOptions: defaultOptions
-    } : {}));
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SuperinterfaceContext.Provider, {
+    })), {
+        isToasterRendered: true
+    }));
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SuperinterfaceContext.Provider, {
         value: value,
-        children: children
+        children: [
+            children,
+            !superinterfaceContext.isToasterRendered && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_sonner.Toaster, {})
+        ]
     });
 };
 // src/components/threads/Thread/Messages/index.tsx
-var import_themes29 = require("@radix-ui/themes");
+var import_themes30 = require("@radix-ui/themes");
+// src/components/threads/Thread/Messages/Content/index.tsx
+var import_react18 = require("react");
+var import_sonner2 = require("sonner");
 // src/hooks/messages/useMessages/index.tsx
 var import_react3 = require("react");
 var import_react_query2 = require("@tanstack/react-query");
@@ -465,7 +487,7 @@ var queryOptions = function(param) {
     var queryKey = _to_consumable_array(queryKeyBase).concat([
         threadContext.variables
     ]);
-    return (0, import_react_query.infiniteQueryOptions)(_object_spread(_object_spread_props(_object_spread({
+    return (0, import_react_query.infiniteQueryOptions)(_object_spread_props(_object_spread({
         // @ts-ignore-next-line
         queryFn: function() {
             var _ref = _async_to_generator(function(param) {
@@ -537,9 +559,22 @@ var queryOptions = function(param) {
             return lastPage.lastId;
         },
         limit: 10
-    }, queryClient.getQueryDefaults(queryKey)), {
+    }, threadContext.defaultOptions.queries, queryClient.getQueryDefaults(queryKey)), {
         queryKey: queryKey
-    }), threadContext.defaultOptions.queries));
+    }));
+};
+// src/lib/messages/messagesQueryOptions.ts
+var messagesQueryOptions = function(param) {
+    var queryClient = param.queryClient, threadContext = param.threadContext, superinterfaceContext = param.superinterfaceContext;
+    return queryOptions({
+        queryKeyBase: [
+            "messages"
+        ],
+        path: "/messages",
+        queryClient: queryClient,
+        threadContext: threadContext,
+        superinterfaceContext: superinterfaceContext
+    });
 };
 // src/hooks/messages/useMessages/index.tsx
 var messages = function(param) {
@@ -553,11 +588,7 @@ var useMessages = function() {
     var queryClient = (0, import_react_query2.useQueryClient)();
     var threadContext = useSuperinterfaceContext();
     var superinterfaceContext = useSuperinterfaceContext();
-    var props = (0, import_react_query2.useInfiniteQuery)(queryOptions({
-        queryKeyBase: [
-            "messages"
-        ],
-        path: "/messages",
+    var props = (0, import_react_query2.useInfiniteQuery)(messagesQueryOptions({
         queryClient: queryClient,
         threadContext: threadContext,
         superinterfaceContext: superinterfaceContext
@@ -648,35 +679,18 @@ var useMessageGroups = function(param) {
 };
 // src/components/skeletons/MessagesSkeleton/index.tsx
 var import_react6 = require("react");
-var import_themes4 = require("@radix-ui/themes");
-// src/components/skeletons/Skeleton/index.tsx
-var import_themes = require("@radix-ui/themes");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var Skeleton = function(_param) {
-    var height = _param.height, style = _param.style, rest = _object_without_properties(_param, [
-        "height",
-        "style"
-    ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_themes.Flex, _object_spread({
-        height: "var(--space-".concat(height, ")"),
-        style: _object_spread({
-            animation: "pulse 2s cubic-bezier(.4,0,.6,1) infinite",
-            borderRadius: "var(--radius-3)",
-            backgroundColor: "var(--gray-5)"
-        }, style)
-    }, rest));
-};
+var import_themes3 = require("@radix-ui/themes");
 // src/components/messageGroups/MessageGroupBase/index.tsx
 var import_react5 = require("react");
-var import_themes2 = require("@radix-ui/themes");
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_themes = require("@radix-ui/themes");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 var MessageGroupBase = (0, import_react5.forwardRef)(function MessageGroupBase2(param, ref) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_themes2.Container, {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_themes.Container, {
         ref: ref,
         size: "2",
         flexGrow: "0",
-        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_themes2.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_themes.Flex, {
             flexShrink: "0",
             gap: "3",
             children: children
@@ -684,14 +698,14 @@ var MessageGroupBase = (0, import_react5.forwardRef)(function MessageGroupBase2(
     });
 });
 // src/components/messageGroups/MessageGroupBase/Name.tsx
-var import_themes3 = require("@radix-ui/themes");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_themes2 = require("@radix-ui/themes");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var Name = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_themes2.Flex, {
         align: "center",
         height: "var(--space-5)",
-        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Text, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_themes2.Text, {
             size: "2",
             weight: "bold",
             children: children
@@ -699,44 +713,44 @@ var Name = function(param) {
     });
 };
 // src/components/skeletons/MessagesSkeleton/index.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var MessagesSkeleton = (0, import_react6.forwardRef)(function MessagesSkeleton2(_props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(MessageGroupBase, {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(MessageGroupBase, {
         ref: ref,
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_themes4.Avatar, {
-                fallback: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_themes4.Flex, {}),
-                size: "1",
-                style: {
-                    animation: "pulse 2s cubic-bezier(.4,0,.6,1) infinite"
-                }
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Skeleton, {
+                loading: true,
+                children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Avatar, {
+                    fallback: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Flex, {}),
+                    size: "1"
+                })
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_themes4.Box, {
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_themes3.Box, {
                 pb: "3",
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Name, {
-                        children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, {
-                            height: "1",
+                    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Name, {
+                        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Skeleton, {
+                            loading: true,
                             style: {
                                 width: "128px"
                             }
                         })
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, {
-                        height: "2",
+                    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Skeleton, {
+                        loading: true,
                         style: {
                             width: "256px"
                         }
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, {
-                        height: "2",
+                    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Skeleton, {
+                        loading: true,
                         style: {
                             width: "256px",
                             marginTop: "var(--space-2)"
                         }
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Skeleton, {
-                        height: "2",
+                    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes3.Skeleton, {
+                        loading: true,
                         style: {
                             width: "256px",
                             marginTop: "var(--space-2)"
@@ -748,26 +762,26 @@ var MessagesSkeleton = (0, import_react6.forwardRef)(function MessagesSkeleton2(
     });
 });
 // src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-var import_react16 = require("react");
-var import_themes24 = require("@radix-ui/themes");
+var import_react17 = require("react");
+var import_themes25 = require("@radix-ui/themes");
 var import_react_icons4 = require("@radix-ui/react-icons");
 // src/components/messageGroups/MessageGroupBase/AssistantAvatar.tsx
 var import_react8 = require("react");
-var import_themes6 = require("@radix-ui/themes");
+var import_themes5 = require("@radix-ui/themes");
 // src/contexts/assistants/AssistantAvatarContext/index.tsx
 var import_react7 = require("react");
-var import_themes5 = require("@radix-ui/themes");
+var import_themes4 = require("@radix-ui/themes");
 var import_react_icons = require("@radix-ui/react-icons");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var AssistantAvatarContext = (0, import_react7.createContext)(/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_themes5.Avatar, {
-    fallback: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_icons.LightningBoltIcon, {}),
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var AssistantAvatarContext = (0, import_react7.createContext)(/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_themes4.Avatar, {
+    fallback: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react_icons.LightningBoltIcon, {}),
     size: "1"
 }));
 // src/components/messageGroups/MessageGroupBase/AssistantAvatar.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var AssistantAvatar = function() {
     var AssistantAvatarContextValue = (0, import_react8.useContext)(AssistantAvatarContext);
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_themes6.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_themes5.Flex, {
         flexShrink: "0",
         height: "24px",
         width: "24px",
@@ -782,33 +796,33 @@ var AssistantAvatar = function() {
 var import_react9 = require("react");
 var AssistantNameContext = (0, import_react9.createContext)("Assistant");
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
-var import_themes23 = require("@radix-ui/themes");
+var import_themes24 = require("@radix-ui/themes");
 // src/components/threads/Thread/Message/index.tsx
-var import_react15 = require("react");
-var import_themes22 = require("@radix-ui/themes");
+var import_react16 = require("react");
+var import_themes23 = require("@radix-ui/themes");
 // src/components/runSteps/RunSteps/index.tsx
-var import_themes15 = require("@radix-ui/themes");
-// src/components/runSteps/RunStep/ToolCalls/index.tsx
 var import_themes14 = require("@radix-ui/themes");
+// src/components/runSteps/RunStep/ToolCalls/index.tsx
+var import_themes13 = require("@radix-ui/themes");
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/index.tsx
-var import_themes12 = require("@radix-ui/themes");
+var import_themes11 = require("@radix-ui/themes");
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/Fn/index.tsx
 var import_react12 = require("react");
 // src/contexts/functions/FunctionComponentsContext/index.tsx
 var import_react10 = require("react");
 var FunctionComponentsContext = (0, import_react10.createContext)({});
 // src/components/functions/FunctionBase/index.tsx
-var import_themes10 = require("@radix-ui/themes");
+var import_themes9 = require("@radix-ui/themes");
 // src/components/toolCalls/ToolCallBase/index.tsx
-var import_themes7 = require("@radix-ui/themes");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_themes6 = require("@radix-ui/themes");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var ToolCallBase = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_themes7.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_themes6.Flex, {
         py: "1",
         ml: "-2",
-        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_themes7.PopoverTrigger, {
-            children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_themes7.Button, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_themes6.PopoverTrigger, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_themes6.Button, {
                 size: "1",
                 color: "gold",
                 variant: "outline",
@@ -821,32 +835,32 @@ var ToolCallBase = function(param) {
     });
 };
 // src/components/toolCalls/ToolCallBase/ToolCallTitle.tsx
-var import_themes8 = require("@radix-ui/themes");
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_themes7 = require("@radix-ui/themes");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var ToolCallTitle = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_themes8.Text, {
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_themes7.Text, {
         weight: "regular",
         children: children
     });
 };
 // src/components/functions/FunctionBase/Icon.tsx
 var import_react_icons2 = require("@radix-ui/react-icons");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var Icon = function(param) {
     var runStep = param.runStep;
     if (runStep.completed_at) {
-        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_icons2.CheckCircledIcon, {});
+        return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_icons2.CheckCircledIcon, {});
     } else if (runStep.cancelled_at || runStep.failed_at || runStep.status === "expired") {
-        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_icons2.CircleBackslashIcon, {});
+        return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_icons2.CircleBackslashIcon, {});
     } else {
-        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_icons2.CircleIcon, {});
+        return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react_icons2.CircleIcon, {});
     }
 };
 // src/components/functions/FunctionBase/Content.tsx
 var import_react11 = require("react");
-var import_themes9 = require("@radix-ui/themes");
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_themes8 = require("@radix-ui/themes");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var Content = function(param) {
     var fn = param.fn;
     var args = (0, import_react11.useMemo)(function() {
@@ -877,7 +891,7 @@ var Content = function(param) {
     if (!args) {
         return null;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_themes9.Code, {
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_themes8.Code, {
         variant: "ghost",
         color: "gold",
         style: {
@@ -885,36 +899,36 @@ var Content = function(param) {
             wordBreak: "break-word"
         },
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_themes9.Box, {
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_themes8.Box, {
                 children: args && JSON.stringify(args, null, 2)
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_themes9.Box, {
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_themes8.Box, {
                 children: output && JSON.stringify(output, null, 2)
             })
         ]
     });
 };
 // src/components/functions/FunctionBase/index.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var FunctionBase = function(param) {
     var fn = param.fn, runStep = param.runStep, title2 = param.title;
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_themes10.PopoverRoot, {
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_themes9.PopoverRoot, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(ToolCallBase, {
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(ToolCallBase, {
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, {
+                    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Icon, {
                         runStep: runStep
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ToolCallTitle, {
+                    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ToolCallTitle, {
                         children: title2
                     })
                 ]
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_themes10.PopoverContent, {
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_themes9.PopoverContent, {
                 style: {
                     maxHeight: "500px"
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Content, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Content, {
                     fn: fn
                 })
             })
@@ -933,10 +947,10 @@ var title = function(param) {
     }
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/Fn/DefaultFunction/index.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var DefaultFunction = function(param) {
     var fn = param.fn, runStep = param.runStep;
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(FunctionBase, {
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(FunctionBase, {
         fn: fn,
         runStep: runStep,
         title: title({
@@ -946,66 +960,66 @@ var DefaultFunction = function(param) {
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/Fn/index.tsx
-var import_jsx_runtime14 = // @ts-ignore-next-line
+var import_jsx_runtime13 = // @ts-ignore-next-line
 require("react/jsx-runtime");
 var Fn = function(param) {
     var fn = param.fn, runStep = param.runStep;
     var functionComponentsContext = (0, import_react12.useContext)(FunctionComponentsContext);
     var Component = functionComponentsContext[fn.name] || DefaultFunction;
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Component, {
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Component, {
         fn: fn,
         runStep: runStep
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/CodeInterpreter/index.tsx
-var import_themes11 = require("@radix-ui/themes");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_themes10 = require("@radix-ui/themes");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var CodeInterpreter = function(param) {
     var codeInterpreter = param.codeInterpreter;
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_themes11.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_themes10.Flex, {
         children: codeInterpreter.input
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/index.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var ToolCall = function(param) {
     var toolCall = param.toolCall, runStep = param.runStep;
     if (toolCall.type === "function") {
-        return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Fn, {
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Fn, {
             fn: toolCall.function,
             runStep: runStep
         });
     }
     if (toolCall.type === "code_interpreter") {
-        return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CodeInterpreter, {
+        return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(CodeInterpreter, {
             codeInterpreter: toolCall.code_interpreter,
             runStep: runStep
         });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_themes12.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_themes11.Flex, {
         children: toolCall.type
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/Starting/index.tsx
-var import_themes13 = require("@radix-ui/themes");
+var import_themes12 = require("@radix-ui/themes");
 var import_react_icons3 = require("@radix-ui/react-icons");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 var Starting = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_themes13.PopoverRoot, {
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_themes12.PopoverRoot, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(ToolCallBase, {
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(ToolCallBase, {
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_icons3.CircleIcon, {}),
-                    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolCallTitle, {
+                    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_icons3.CircleIcon, {}),
+                    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ToolCallTitle, {
                         children: "Starting actions"
                     })
                 ]
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_themes13.PopoverContent, {
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_themes12.PopoverContent, {
                 style: {
                     maxHeight: "500px"
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_themes13.Text, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_themes12.Text, {
                     children: "Getting ready to connect to domain API"
                 })
             })
@@ -1013,15 +1027,15 @@ var Starting = function() {
     });
 };
 // src/components/runSteps/RunStep/ToolCalls/index.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var ToolCalls = function(param) {
     var stepDetails = param.stepDetails, runStep = param.runStep;
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_themes14.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_themes13.Flex, {
         direction: "column",
         children: [
-            !stepDetails.tool_calls.length && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Starting, {}),
+            !stepDetails.tool_calls.length && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Starting, {}),
             stepDetails.tool_calls.map(function(toolCall) {
-                return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolCall, {
+                return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToolCall, {
                     toolCall: toolCall,
                     runStep: runStep
                 }, toolCall.id);
@@ -1030,11 +1044,11 @@ var ToolCalls = function(param) {
     });
 };
 // src/components/runSteps/RunStep/index.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var RunStep = function(param) {
     var runStep = param.runStep;
     if (runStep.step_details.type === "tool_calls") {
-        return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ToolCalls, {
+        return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToolCalls, {
             stepDetails: runStep.step_details,
             runStep: runStep
         });
@@ -1042,31 +1056,39 @@ var RunStep = function(param) {
     return null;
 };
 // src/components/runSteps/RunSteps/index.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var RunSteps = function(param) {
     var runSteps = param.runSteps;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes15.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes14.Flex, {
         direction: "column-reverse",
         children: runSteps.map(function(runStep) {
-            return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RunStep, {
+            return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(RunStep, {
                 runStep: runStep
             }, runStep.id);
         })
     });
 };
-// src/components/threads/Thread/Message/TextContent/index.tsx
-var import_react14 = require("react");
+// src/contexts/messages/MessageContext/index.ts
+var import_react13 = require("react");
+var MessageContext = (0, import_react13.createContext)({
+    message: null
+});
+// src/components/threads/Thread/Message/Provider.tsx
+var Provider = MessageContext.Provider;
+// src/components/threads/Thread/Message/TextContent.tsx
 var import_react_remark = require("react-remark");
+// src/hooks/markdown/useMarkdownContext/index.ts
+var import_react15 = require("react");
 // src/contexts/markdown/MarkdownContext/index.ts
-var import_react13 = require("react");
+var import_react14 = require("react");
 // src/contexts/markdown/MarkdownContext/lib/components/Paragraph.tsx
-var import_themes16 = require("@radix-ui/themes");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_themes15 = require("@radix-ui/themes");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var Paragraph = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_themes16.Box, {
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes15.Box, {
         pb: "3",
-        children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_themes16.Text, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes15.Text, {
             size: "3",
             style: {
                 whiteSpace: "pre-line",
@@ -1077,24 +1099,24 @@ var Paragraph = function(param) {
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Link.tsx
-var import_themes17 = require("@radix-ui/themes");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_themes16 = require("@radix-ui/themes");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var Link = function(param) {
     var children = param.children, href = param.href;
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes17.Link, {
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_themes16.Link, {
         href: href,
         children: children
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/UnorderedList.tsx
-var import_themes18 = require("@radix-ui/themes");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_themes17 = require("@radix-ui/themes");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var UnorderedList = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_themes18.Box, {
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes17.Box, {
         pb: "3",
         asChild: true,
-        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("ul", {
+        children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("ul", {
             style: {
                 listStylePosition: "inside"
             },
@@ -1103,14 +1125,14 @@ var UnorderedList = function(param) {
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/OrderedList.tsx
-var import_themes19 = require("@radix-ui/themes");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_themes18 = require("@radix-ui/themes");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var OrderedList = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_themes19.Box, {
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_themes18.Box, {
         pb: "3",
         asChild: true,
-        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("ol", {
+        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("ol", {
             style: {
                 listStylePosition: "inside"
             },
@@ -1119,23 +1141,45 @@ var OrderedList = function(param) {
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/ListItem.tsx
-var import_themes20 = require("@radix-ui/themes");
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_themes19 = require("@radix-ui/themes");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 var ListItem = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_themes20.Box, {
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_themes19.Box, {
         pb: "1",
-        children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("li", {
+        children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("li", {
             children: children
         })
     });
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Strong.tsx
+var import_themes20 = require("@radix-ui/themes");
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var Strong = function(param) {
+    var children = param.children;
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_themes20.Strong, {
+        children: children
+    });
+};
+// src/contexts/markdown/MarkdownContext/lib/components/Pre.tsx
 var import_themes21 = require("@radix-ui/themes");
 var import_jsx_runtime26 = require("react/jsx-runtime");
-var Strong = function(param) {
+var Pre = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_themes21.Strong, {
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_themes21.Box, {
+        style: {
+            whiteSpace: "pre-wrap",
+            wordBreak: "break-word"
+        },
+        children: children
+    });
+};
+// src/contexts/markdown/MarkdownContext/lib/components/Code.tsx
+var import_themes22 = require("@radix-ui/themes");
+var import_jsx_runtime27 = require("react/jsx-runtime");
+var Code2 = function(param) {
+    var children = param.children;
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_themes22.Code, {
         children: children
     });
 };
@@ -1146,26 +1190,32 @@ var components = {
     strong: Strong,
     ul: UnorderedList,
     ol: OrderedList,
-    li: ListItem
+    li: ListItem,
+    pre: Pre,
+    code: Code2
 };
 // src/contexts/markdown/MarkdownContext/index.ts
-var MarkdownContext = (0, import_react13.createContext)({
+var MarkdownContext = (0, import_react14.createContext)({
     remarkPlugins: [],
     rehypeReactOptions: {
         components: components
     }
 });
-// src/components/threads/Thread/Message/TextContent/index.tsx
+// src/hooks/markdown/useMarkdownContext/index.ts
+var useMarkdownContext = function() {
+    return (0, import_react15.useContext)(MarkdownContext);
+};
+// src/components/threads/Thread/Message/TextContent.tsx
 var TextContent = function(param) {
     var content = param.content;
-    var markdownContext = (0, import_react14.useContext)(MarkdownContext);
+    var markdownContext = useMarkdownContext();
     return (0, import_react_remark.useRemarkSync)(content.text.value, markdownContext);
 };
 // src/components/threads/Thread/Message/index.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var Message = function(param) {
     var message = param.message;
-    var _ref = _sliced_to_array((0, import_react15.useMemo)(function() {
+    var _ref = _sliced_to_array((0, import_react16.useMemo)(function() {
         if (!message.runSteps.length) return [
             [],
             []
@@ -1197,55 +1247,60 @@ var Message = function(param) {
     }, [
         message
     ]), 2), olderRunSteps = _ref[0], laterRunSteps = _ref[1];
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_themes22.Box, {
-        children: [
-            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(RunSteps, {
-                runSteps: olderRunSteps
-            }),
-            message.content.map(function(content, index) {
-                return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_themes22.Box, {
-                    children: content.type === "text" && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(TextContent, {
-                        content: content
-                    })
-                }, index);
-            }),
-            /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(RunSteps, {
-                runSteps: laterRunSteps
-            })
-        ]
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Provider, {
+        value: {
+            message: message
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_themes23.Box, {
+            children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(RunSteps, {
+                    runSteps: olderRunSteps
+                }),
+                message.content.map(function(content, index) {
+                    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_themes23.Box, {
+                        children: content.type === "text" && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TextContent, {
+                            content: content
+                        })
+                    }, index);
+                }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(RunSteps, {
+                    runSteps: laterRunSteps
+                })
+            ]
+        })
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var Content2 = function(param) {
     var messageGroup = param.messageGroup;
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_themes23.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_themes24.Flex, {
         direction: "column-reverse",
         children: messageGroup.messages.map(function(message) {
-            return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Message, {
+            return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Message, {
                 message: message
             }, message.id);
         })
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var MessageGroup = function(param) {
     var messageGroup = param.messageGroup;
-    var assistantNameContext = (0, import_react16.useContext)(AssistantNameContext);
-    return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(MessageGroupBase, {
+    var assistantNameContext = (0, import_react17.useContext)(AssistantNameContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(MessageGroupBase, {
         children: [
-            messageGroup.role === "user" ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_themes24.Avatar, {
-                fallback: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_icons4.PersonIcon, {}),
+            messageGroup.role === "user" ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_themes25.Avatar, {
+                fallback: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react_icons4.PersonIcon, {}),
                 size: "1"
-            }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(AssistantAvatar, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_themes24.Box, {
+            }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(AssistantAvatar, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_themes25.Box, {
                 flexGrow: "1",
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Name, {
+                    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Name, {
                         children: messageGroup.role === "user" ? "You" : assistantNameContext
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Content2, {
+                    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Content2, {
                         messageGroup: messageGroup
                     })
                 ]
@@ -1254,68 +1309,74 @@ var MessageGroup = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/index.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var Content3 = function() {
     var _useMessages = useMessages(), messages2 = _useMessages.messages, isLoading = _useMessages.isLoading, isLoadingError = _useMessages.isLoadingError;
     var _useMessageGroups = useMessageGroups({
         messages: messages2
     }), messageGroups2 = _useMessageGroups.messageGroups;
+    (0, import_react18.useEffect)(function() {
+        if (isLoadingError) {
+            import_sonner2.toast.error("Could not load messages. Please try again.");
+        }
+    }, [
+        isLoadingError
+    ]);
     if (isLoading || isLoadingError) {
-        return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(MessagesSkeleton, {});
+        return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(MessagesSkeleton, {});
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_jsx_runtime30.Fragment, {
+    return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_jsx_runtime31.Fragment, {
         children: messageGroups2.map(function(messageGroup) {
-            return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(MessageGroup, {
+            return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(MessageGroup, {
                 messageGroup: messageGroup
             }, messageGroup.id);
         })
     });
 };
 // src/components/threads/Thread/Messages/Progress/index.tsx
-var import_themes27 = require("@radix-ui/themes");
+var import_themes28 = require("@radix-ui/themes");
 // src/components/skeletons/StartingContentSkeleton/index.tsx
-var import_themes25 = require("@radix-ui/themes");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_themes26 = require("@radix-ui/themes");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var StartingContentSkeleton = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_themes25.Box, {
-        flexShrink: "0",
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes26.Skeleton, {
+        loading: true,
         mt: "1",
         height: "var(--space-4)",
         width: "var(--space-4)",
         style: {
-            animation: "pulse 2s cubic-bezier(.4,0,.6,1) infinite",
-            borderRadius: "var(--radius-3)",
-            backgroundColor: "var(--gray-12)"
+            borderRadius: "var(--radius-6)",
+            flexShrink: 0
         }
     });
 };
 // src/components/skeletons/StartingSkeleton/index.tsx
-var import_react17 = require("react");
-var import_themes26 = require("@radix-ui/themes");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_react19 = require("react");
+var import_themes27 = require("@radix-ui/themes");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var StartingSkeleton = function(param) {
     var children = param.children;
-    var assistantNameContext = (0, import_react17.useContext)(AssistantNameContext);
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(MessageGroupBase, {
+    var assistantNameContext = (0, import_react19.useContext)(AssistantNameContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(MessageGroupBase, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AssistantAvatar, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_themes26.Box, {
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(AssistantAvatar, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_themes27.Box, {
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Name, {
+                    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Name, {
                         children: assistantNameContext
                     }),
                     children,
-                    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(StartingContentSkeleton, {})
+                    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(StartingContentSkeleton, {})
                 ]
             })
         ]
     });
 };
 // src/hooks/messages/useLatestMessage/index.ts
-var import_react18 = require("react");
+var import_react20 = require("react");
 var useLatestMessage = function() {
     var props = useMessages();
-    return (0, import_react18.useMemo)(function() {
+    return (0, import_react20.useMemo)(function() {
         return _object_spread_props(_object_spread({}, props), {
             latestMessage: props.messages[0] || null
         });
@@ -1324,13 +1385,26 @@ var useLatestMessage = function() {
     ]);
 };
 // src/hooks/runs/useIsRunActive/index.tsx
-var import_react21 = require("react");
+var import_react25 = require("react");
 var import_react_query4 = require("@tanstack/react-query");
 // src/hooks/runs/useLatestRun/index.ts
-var import_react20 = require("react");
+var import_react22 = require("react");
 // src/hooks/runs/useRuns/index.tsx
-var import_react19 = require("react");
+var import_react21 = require("react");
 var import_react_query3 = require("@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;
@@ -1344,16 +1418,12 @@ var useRuns = function() {
     var queryClient = (0, import_react_query3.useQueryClient)();
     var superinterfaceContext = useSuperinterfaceContext();
     var threadContext = useSuperinterfaceContext();
-    var props = (0, import_react_query3.useInfiniteQuery)(queryOptions({
-        queryKeyBase: [
-            "runs"
-        ],
-        path: "/runs",
+    var props = (0, import_react_query3.useInfiniteQuery)(runsQueryOptions({
         queryClient: queryClient,
         threadContext: threadContext,
         superinterfaceContext: superinterfaceContext
     }));
-    return (0, import_react19.useMemo)(function() {
+    return (0, import_react21.useMemo)(function() {
         return _object_spread_props(_object_spread({}, props), {
             // @ts-ignore-next-line
             runs: getRuns({
@@ -1367,7 +1437,7 @@ var useRuns = function() {
 // src/hooks/runs/useLatestRun/index.ts
 var useLatestRun = function() {
     var props = useRuns();
-    return (0, import_react20.useMemo)(function() {
+    return (0, import_react22.useMemo)(function() {
         return _object_spread_props(_object_spread({}, props), {
             latestRun: props.runs[0]
         });
@@ -1388,6 +1458,18 @@ var isRunEditingMessage = function(param) {
     });
     return !hasContent;
 };
+// src/hooks/runs/usePollingContext/index.ts
+var import_react24 = require("react");
+// src/contexts/runs/PollingContext/index.tsx
+var import_react23 = require("react");
+var PollingContext = (0, import_react23.createContext)({
+    isPollRefetching: false,
+    setIsPollRefetching: function() {}
+});
+// src/hooks/runs/usePollingContext/index.ts
+var usePollingContext = function() {
+    return (0, import_react24.useContext)(PollingContext);
+};
 // src/hooks/runs/useIsRunActive/index.tsx
 var progressStatuses = [
     "queued",
@@ -1401,8 +1483,9 @@ var stoppedStatuses = [
     "failed"
 ];
 var isRunActive = function(param) {
-    var latestRunProps = param.latestRunProps, latestMessageProps = param.latestMessageProps, isMutating = param.isMutating;
+    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;
@@ -1416,6 +1499,7 @@ var useIsRunActive = function() {
     var latestRunProps = useLatestRun();
     var latestMessageProps = useLatestMessage();
     var threadContext = useSuperinterfaceContext();
+    var pollingContext = usePollingContext();
     var isMutatingCreateRun = (0, import_react_query4.useIsMutating)({
         mutationKey: [
             "createRun",
@@ -1434,9 +1518,10 @@ var useIsRunActive = function() {
             threadContext.variables
         ]
     });
-    return (0, import_react21.useMemo)(function() {
+    return (0, import_react25.useMemo)(function() {
         return _object_spread_props(_object_spread({}, latestRunProps), {
             isRunActive: isRunActive({
+                pollingContext: pollingContext,
                 latestRunProps: latestRunProps,
                 latestMessageProps: latestMessageProps,
                 isMutating: isMutatingCreateRun > 0 || isMutatingCreateMessage > 0 || isMutatingCreateHandleAction > 0
@@ -1445,42 +1530,43 @@ var useIsRunActive = function() {
     }, [
         latestRunProps,
         latestMessageProps,
+        pollingContext,
         isMutatingCreateRun,
         isMutatingCreateMessage,
         isMutatingCreateHandleAction
     ]);
 };
 // src/components/threads/Thread/Messages/Progress/index.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("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__ */ (0, import_jsx_runtime33.jsx)(StartingSkeleton, {});
+        return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StartingSkeleton, {});
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(MessageGroupBase, {
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(MessageGroupBase, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_themes27.Box, {
+            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_themes28.Box, {
                 pl: "5"
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(StartingContentSkeleton, {})
+            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StartingContentSkeleton, {})
         ]
     });
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
-var import_themes28 = require("@radix-ui/themes");
+var import_themes29 = require("@radix-ui/themes");
 // src/hooks/misc/useInfiniteScroll/index.tsx
-var import_react23 = require("react");
+var import_react27 = require("react");
 var import_react_intersection_observer = require("react-intersection-observer");
 // src/hooks/misc/useThrottledEffect/index.tsx
 var import_lodash5 = __toESM(require("lodash"), 1);
-var import_react22 = require("react");
+var import_react26 = require("react");
 var useThrottledEffect = function(cb, delay, additionalDeps) {
     var _cbRef;
-    var cbRef = (0, import_react22.useRef)(cb);
-    var throttledCb = (0, import_react22.useCallback)(import_lodash5.default.throttle(function() {
+    var cbRef = (0, import_react26.useRef)(cb);
+    var throttledCb = (0, import_react26.useCallback)(import_lodash5.default.throttle(function() {
         for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
             args[_key] = arguments[_key];
         }
@@ -1491,17 +1577,17 @@ var useThrottledEffect = function(cb, delay, additionalDeps) {
     }), [
         delay
     ]);
-    (0, import_react22.useEffect)(function() {
+    (0, import_react26.useEffect)(function() {
         cbRef.current = cb;
     });
-    (0, import_react22.useEffect)(throttledCb, [
+    (0, import_react26.useEffect)(throttledCb, [
         throttledCb
     ].concat(_to_consumable_array(additionalDeps)));
 };
 // src/hooks/misc/useInfiniteScroll/index.tsx
 var useInfiniteScroll = function(param) {
     var isFetchingNextPage = param.isFetchingNextPage, hasNextPage = param.hasNextPage, fetchNextPage = param.fetchNextPage;
-    var containerRef = (0, import_react23.useRef)(null);
+    var containerRef = (0, import_react27.useRef)(null);
     var _ref = (0, import_react_intersection_observer.useInView)({
         root: containerRef.current,
         rootMargin: "0px",
@@ -1526,8 +1612,9 @@ var useInfiniteScroll = function(param) {
     };
 };
 // src/hooks/runs/useManageRuns/index.tsx
+var import_sonner3 = require("sonner");
 var import_react_query6 = require("@tanstack/react-query");
-var import_react24 = require("react");
+var import_react28 = require("react");
 // src/hooks/runs/useCreateRun/index.ts
 var import_radash4 = require("radash");
 var import_react_query5 = require("@tanstack/react-query");
@@ -1537,7 +1624,7 @@ var mutationOptions = function(param) {
     var mutationKey = _to_consumable_array(mutationKeyBase).concat([
         threadContext.variables
     ]);
-    return _object_spread(_object_spread_props(_object_spread({
+    return _object_spread_props(_object_spread({
         mutationFn: function(variables) {
             return fetch("".concat(superinterfaceContext.baseUrl).concat(path), _object_spread({
                 method: "POST",
@@ -1555,7 +1642,7 @@ var mutationOptions = function(param) {
                             case 0:
                                 if (!(response.status !== 200)) return [
                                     3,
-                                    4
+                                    5
                                 ];
                                 _state.label = 1;
                             case 1:
@@ -1565,17 +1652,23 @@ var mutationOptions = function(param) {
                                     ,
                                     4
                                 ]);
+                                console.log("response", response);
                                 return [
                                     4,
                                     response.json()
                                 ];
                             case 2:
                                 errorResponse = _state.sent();
-                                throw new Error(errorResponse.error);
+                                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()
@@ -1588,9 +1681,9 @@ var mutationOptions = function(param) {
                 };
             }());
         }
-    }, queryClient.getMutationDefaults(mutationKey)), {
+    }, threadContext.defaultOptions.mutations, queryClient.getMutationDefaults(mutationKey)), {
         mutationKey: mutationKey
-    }), threadContext.defaultOptions.mutations);
+    });
 };
 // src/hooks/runs/useCreateRun/lib/onSuccess.ts
 var onSuccess = function(param) {
@@ -1809,7 +1902,22 @@ var useManageRuns = function() {
     var latestMessageProps = useLatestMessage();
     var createRunProps = useCreateRun();
     var threadContext = useSuperinterfaceContext();
-    (0, import_react24.useEffect)(function() {
+    var _ref = _sliced_to_array((0, import_react28.useState)([]), 2), toastedErrorRunIds = _ref[0], setToastedErrorRunIds = _ref[1];
+    (0, import_react28.useEffect)(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
+            ]);
+        });
+        import_sonner3.toast.error("AI run failed. Please try again.");
+    }, [
+        latestRunProps,
+        toastedErrorRunIds
+    ]);
+    (0, import_react28.useEffect)(function() {
         if (createRunProps.isPending) return;
         if (latestRunProps.isFetching) return;
         if (latestMessageProps.isFetching) return;
@@ -1885,19 +1993,35 @@ var refetch = function() {
 var usePolling = function() {
     var threadContext = useSuperinterfaceContext();
     var queryClient = (0, import_react_query7.useQueryClient)();
+    var setIsPollRefetching = usePollingContext().setIsPollRefetching;
     var isRunActiveProps = useIsRunActive();
-    (0, import_react_use.useInterval)(function() {
-        refetch({
-            queryClient: queryClient,
-            threadContext: threadContext
+    (0, import_react_use.useInterval)(/*#__PURE__*/ _async_to_generator(function() {
+        return _ts_generator(this, function(_state) {
+            switch(_state.label){
+                case 0:
+                    setIsPollRefetching(true);
+                    return [
+                        4,
+                        refetch({
+                            queryClient: queryClient,
+                            threadContext: threadContext
+                        })
+                    ];
+                case 1:
+                    _state.sent();
+                    setIsPollRefetching(false);
+                    console.log("Polling...");
+                    return [
+                        2
+                    ];
+            }
         });
-        console.log("poll refetched");
-    }, isRunActiveProps.isRunActive ? 3e3 : null);
+    }), isRunActiveProps.isRunActive ? 3e3 : null);
     return null;
 };
 // src/hooks/actions/useManageActions/index.tsx
 var import_react_query9 = require("@tanstack/react-query");
-var import_react25 = require("react");
+var import_react29 = require("react");
 // src/hooks/actions/useHandleAction/index.tsx
 var import_radash5 = require("radash");
 var import_react_query8 = require("@tanstack/react-query");
@@ -1970,7 +2094,7 @@ var useManageActions = function() {
     var threadContext = useSuperinterfaceContext();
     var latestRunProps = useLatestRun();
     var handleActionProps = useHandleAction();
-    (0, import_react25.useEffect)(function() {
+    (0, import_react29.useEffect)(function() {
         if (handleActionProps.isPending) return;
         if (latestRunProps.isFetching) return;
         if (!latestRunProps.latestRun) return;
@@ -2002,7 +2126,7 @@ var useLifecycle = function() {
     return null;
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("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;
@@ -2012,7 +2136,7 @@ var Root = function(param) {
         hasNextPage: hasNextPage,
         fetchNextPage: fetchNextPage
     }), containerRef = _useInfiniteScroll.containerRef, loaderRef = _useInfiniteScroll.loaderRef;
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_themes28.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_themes29.Flex, {
         ref: containerRef,
         direction: "column-reverse",
         flexGrow: "1",
@@ -2021,10 +2145,10 @@ var Root = function(param) {
         }),
         children: [
             children,
-            hasNextPage && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_themes28.Flex, {
+            hasNextPage && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_themes29.Flex, {
                 ref: loaderRef
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_themes28.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_themes29.Flex, {
                 flexShrink: "0",
                 flexGrow: "1"
             })
@@ -2032,30 +2156,30 @@ var Root = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/NextPageSkeleton.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var NextPageSkeleton = function() {
     var hasNextPage = useMessages().hasNextPage;
     if (!hasNextPage) {
         return null;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MessagesSkeleton, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MessagesSkeleton, {});
 };
 // src/components/threads/Thread/Messages/index.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var Messages = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(Root, {
+    return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(Root, {
         style: style,
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_themes29.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_themes30.Flex, {
                 flexShrink: "0",
                 height: "var(--space-3)"
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Progress, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Progress, {}),
             children,
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Content3, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(NextPageSkeleton, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_themes29.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Content3, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(NextPageSkeleton, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_themes30.Flex, {
                 flexShrink: "0",
                 flexGrow: "1"
             })
@@ -2066,59 +2190,38 @@ Messages.Root = Root;
 Messages.Message = Message;
 Messages.NextPageSkeleton = NextPageSkeleton;
 // src/components/threads/Thread/MessageForm/index.tsx
-var import_themes32 = require("@radix-ui/themes");
+var import_themes33 = require("@radix-ui/themes");
 // src/components/threads/Thread/MessageForm/Submit/index.tsx
 var import_react_icons5 = require("@radix-ui/react-icons");
-var import_themes30 = require("@radix-ui/themes");
-// src/components/spinners/Spinner/index.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var Spinner = function(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("svg", _object_spread_props(_object_spread({
-        xmlns: "http://www.w3.org/2000/svg",
-        width: "24",
-        height: "24",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        style: {
-            height: "var(--space-4)",
-            width: "var(--space-4)",
-            animation: "spin 1s linear infinite"
-        }
-    }, props), {
-        children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("path", {
-            d: "M21 12a9 9 0 1 1-6.219-8.56"
-        })
-    }));
-};
+var import_themes31 = require("@radix-ui/themes");
 // src/hooks/messages/useMessageFormContext/index.ts
-var import_react27 = require("react");
+var import_react31 = require("react");
 // src/contexts/messages/MessageFormContext/index.ts
-var import_react26 = require("react");
-var MessageFormContext = (0, import_react26.createContext)({
+var import_react30 = require("react");
+var MessageFormContext = (0, import_react30.createContext)({
     isDisabled: false,
     isLoading: false
 });
 // src/hooks/messages/useMessageFormContext/index.ts
 var useMessageFormContext = function() {
-    return (0, import_react27.useContext)(MessageFormContext);
+    return (0, import_react31.useContext)(MessageFormContext);
 };
 // src/components/threads/Thread/MessageForm/Submit/index.tsx
 var import_jsx_runtime38 = require("react/jsx-runtime");
 var Submit = function() {
     var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading;
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes30.Button, {
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes31.Button, {
         type: "submit",
         radius: "large",
-        disabled: isDisabled,
-        children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Spinner, {}) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_react_icons5.ArrowUpIcon, {})
+        disabled: isDisabled || isLoading,
+        children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes31.Spinner, {
+            loading: isLoading,
+            children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_react_icons5.ArrowUpIcon, {})
+        })
     });
 };
 // src/components/threads/Thread/MessageForm/Root/index.tsx
-var import_react28 = require("react");
+var import_react32 = require("react");
 var import_react_hook_form = require("react-hook-form");
 // src/hooks/messages/useCreateMessage/index.ts
 var import_radash8 = require("radash");
@@ -2305,7 +2408,7 @@ var Root2 = function(param) {
     var formProps = (0, import_react_hook_form.useForm)(formOptions);
     var handleSubmit = formProps.handleSubmit, isSubmitting = formProps.formState.isSubmitting, reset = formProps.reset;
     var _useIsRunActive = useIsRunActive(), isRunActive2 = _useIsRunActive.isRunActive;
-    var isLoading = (0, import_react28.useMemo)(function() {
+    var isLoading = (0, import_react32.useMemo)(function() {
         return isRunActive2 || isSubmitting;
     }, [
         isRunActive2,
@@ -2337,7 +2440,7 @@ var Root2 = function(param) {
         };
     }();
     var latestMessage = useLatestMessage().latestMessage;
-    var isDisabled = (0, import_react28.useMemo)(function() {
+    var isDisabled = (0, import_react32.useMemo)(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;
@@ -2360,46 +2463,56 @@ var Root2 = function(param) {
 };
 // src/components/threads/Thread/MessageForm/Field/index.tsx
 var import_react_use2 = require("react-use");
-var import_react30 = require("react");
+var import_react34 = require("react");
 // src/components/textareas/TextareaBase/index.tsx
-var import_react29 = require("react");
+var import_react33 = require("react");
 var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"), 1);
 var import_jsx_runtime40 = require("react/jsx-runtime");
 var UPSCALE_RATIO = 16 / 14;
-var TextareaBase = (0, import_react29.forwardRef)(function TextareaBase2(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_textarea_autosize.default, _object_spread({
-        ref: ref,
-        className: "textarea-base",
-        style: {
-            resize: "none",
-            fontSize: "".concat(14 * UPSCALE_RATIO, "px"),
-            lineHeight: "".concat(24 * UPSCALE_RATIO, "px"),
-            transform: "scale(".concat(1 / UPSCALE_RATIO, ")"),
-            margin: "0 ".concat((-100 * UPSCALE_RATIO + 100) / 2, "%"),
-            width: "".concat(100 * UPSCALE_RATIO, "%"),
-            maxWidth: "".concat(100 * UPSCALE_RATIO, "%"),
-            flexGrow: 1,
-            display: "flex"
-        }
-    }, props));
+var TextareaBase = (0, import_react33.forwardRef)(function TextareaBase2(props, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, {
+        children: [
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("style", {
+                children: ".superinterface-textarea { min-height: inherit; height: 30px; }"
+            }),
+            /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_textarea_autosize.default, _object_spread({
+                ref: ref,
+                className: "superinterface-textarea",
+                style: {
+                    border: 0,
+                    outline: 0,
+                    boxSizing: "border-box",
+                    resize: "none",
+                    fontSize: "".concat(14 * UPSCALE_RATIO, "px"),
+                    lineHeight: "".concat(24 * UPSCALE_RATIO, "px"),
+                    transform: "scale(".concat(1 / UPSCALE_RATIO, ")"),
+                    margin: "0 ".concat((-100 * UPSCALE_RATIO + 100) / 2, "%"),
+                    width: "".concat(100 * UPSCALE_RATIO, "%"),
+                    maxWidth: "".concat(100 * UPSCALE_RATIO, "%"),
+                    flexGrow: 1,
+                    display: "flex"
+                }
+            }, props))
+        ]
+    });
 });
 // src/components/threads/Thread/MessageForm/Field/index.tsx
 var import_react_hook_form2 = require("react-hook-form");
-var import_themes31 = require("@radix-ui/themes");
+var import_themes32 = require("@radix-ui/themes");
 var import_jsx_runtime41 = require("react/jsx-runtime");
 var Root3 = function(param) {
     var children = param.children;
     var _ref = (0, import_react_hook_form2.useFormContext)(), errors = _ref.formState.errors;
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes31.Container, {
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes32.Container, {
         size: "2",
         flexGrow: "0",
-        children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes31.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes32.Flex, {
             direction: "column",
             flexShrink: "0",
-            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes31.Flex, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes32.Flex, {
                 direction: "column",
                 flexShrink: "0",
-                children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes31.Flex, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes32.Flex, {
                     style: _object_spread({
                         borderRadius: "var(--radius-2)",
                         borderWidth: "1px",
@@ -2417,19 +2530,19 @@ var Root3 = function(param) {
     });
 };
 var Control = function() {
-    var assistantNameContext = (0, import_react30.useContext)(AssistantNameContext);
+    var assistantNameContext = (0, import_react34.useContext)(AssistantNameContext);
     var register = (0, import_react_hook_form2.useFormContext)().register;
     var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading;
-    var isSubmitDisabled = (0, import_react30.useMemo)(function() {
+    var isSubmitDisabled = (0, import_react34.useMemo)(function() {
         return isDisabled || isLoading;
     }, [
         isDisabled,
         isLoading
     ]);
     var isDisabledPrevious = (0, import_react_use2.usePrevious)(isDisabled);
-    var textareaRef = (0, import_react30.useRef)(null);
+    var textareaRef = (0, import_react34.useRef)(null);
     var textareaProps = register("content");
-    (0, import_react30.useEffect)(function() {
+    (0, import_react34.useEffect)(function() {
         if (isDisabled) return;
         if (!isDisabledPrevious) return;
         if (!textareaRef.current) return;
@@ -2468,18 +2581,18 @@ var MessageForm = function() {
     return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Root2, {
         children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(Field.Root, {
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes32.Text, {
+                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Text, {
                     size: "2",
                     style: {
                         flexGrow: 1
                     },
-                    children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes32.Flex, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
                         flexGrow: "1",
                         direction: "column",
                         children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Field.Control, {})
                     })
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes32.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
                     flexShrink: "0",
                     align: "end",
                     children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Submit, {})
@@ -2492,14 +2605,36 @@ MessageForm.Root = Root2;
 MessageForm.Field = Field;
 MessageForm.Submit = Submit;
 // src/components/threads/Thread/Root/index.tsx
-var import_themes33 = require("@radix-ui/themes");
+var import_themes34 = require("@radix-ui/themes");
+// src/components/runs/PollingProvider/index.tsx
+var import_react35 = require("react");
 var import_jsx_runtime43 = require("react/jsx-runtime");
+var PollingProvider = function(param) {
+    var children = param.children;
+    var _ref = _sliced_to_array((0, import_react35.useState)(false), 2), isPollRefetching = _ref[0], setIsPollRefetching = _ref[1];
+    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(PollingContext.Provider, {
+        value: {
+            isPollRefetching: isPollRefetching,
+            setIsPollRefetching: setIsPollRefetching
+        },
+        children: children
+    });
+};
+// src/components/threads/Thread/Provider/index.tsx
+var import_jsx_runtime44 = require("react/jsx-runtime");
+var Provider2 = function(args) {
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(PollingProvider, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(SuperinterfaceProvider, _object_spread({}, args))
+    });
+};
+// src/components/threads/Thread/Root/index.tsx
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var Root4 = function(_param) {
     var children = _param.children, rest = _object_without_properties(_param, [
         "children"
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(SuperinterfaceProvider, _object_spread_props(_object_spread({}, rest), {
-        children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Provider2, _object_spread_props(_object_spread({}, rest), {
+        children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_themes34.Flex, {
             direction: "column",
             flexGrow: "1",
             children: children
@@ -2507,40 +2642,45 @@ var Root4 = function(_param) {
     }));
 };
 // src/components/threads/Thread/index.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var Thread = function(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Root4, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Root4, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Messages, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(MessageForm, {})
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Messages, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(MessageForm, {})
         ]
     }));
 };
 Thread.Root = Root4;
 Thread.Messages = Messages;
 Thread.MessageForm = MessageForm;
+// src/hooks/messages/useMessageContext/index.ts
+var import_react36 = require("react");
+var useMessageContext = function() {
+    return (0, import_react36.useContext)(MessageContext);
+};
 // src/components/threads/ThreadDialog/Root/index.tsx
-var import_themes34 = require("@radix-ui/themes");
+var import_themes35 = require("@radix-ui/themes");
 // src/components/threads/ThreadDialog/Provider/index.tsx
-var import_react33 = require("react");
+var import_react39 = require("react");
 // src/contexts/threads/ThreadDialogContext/index.ts
-var import_react31 = require("react");
-var ThreadDialogContext = (0, import_react31.createContext)({
+var import_react37 = require("react");
+var ThreadDialogContext = (0, import_react37.createContext)({
     isOpen: false,
     setIsOpen: function() {}
 });
 // src/hooks/threads/useThreadDialogContext/index.ts
-var import_react32 = require("react");
+var import_react38 = require("react");
 var useThreadDialogContext = function() {
-    return (0, import_react32.useContext)(ThreadDialogContext);
+    return (0, import_react38.useContext)(ThreadDialogContext);
 };
 // src/components/threads/ThreadDialog/Provider/index.tsx
-var import_jsx_runtime45 = require("react/jsx-runtime");
-var Provider = function(param) {
+var import_jsx_runtime47 = require("react/jsx-runtime");
+var Provider3 = function(param) {
     var children = param.children;
     var threadDialogContext = useThreadDialogContext();
-    var _ref = _sliced_to_array((0, import_react33.useState)(threadDialogContext.isOpen), 2), isOpen = _ref[0], setIsOpen = _ref[1];
-    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(ThreadDialogContext.Provider, {
+    var _ref = _sliced_to_array((0, import_react39.useState)(threadDialogContext.isOpen), 2), isOpen = _ref[0], setIsOpen = _ref[1];
+    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ThreadDialogContext.Provider, {
         value: {
             isOpen: isOpen,
             setIsOpen: setIsOpen
@@ -2549,11 +2689,11 @@ var Provider = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Root/index.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var Root5 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Provider, {
-        children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_themes34.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Provider3, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes35.Flex, {
             direction: "column",
             justify: "end",
             align: "end",
@@ -2569,12 +2709,12 @@ var Root5 = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Trigger/index.tsx
-var import_themes35 = require("@radix-ui/themes");
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_themes36 = require("@radix-ui/themes");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var Trigger = function(param) {
     var children = param.children;
     var setIsOpen = useThreadDialogContext().setIsOpen;
-    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes35.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes36.Flex, {
         onClick: function() {
             return setIsOpen(function(prev) {
                 return !prev;
@@ -2586,24 +2726,24 @@ var Trigger = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Button/index.tsx
-var import_themes36 = require("@radix-ui/themes");
+var import_themes37 = require("@radix-ui/themes");
 var import_react_icons6 = require("@radix-ui/react-icons");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var Button3 = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes36.IconButton, {
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes37.IconButton, {
         size: "4",
         radius: "full",
-        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_react_icons6.ChatBubbleIcon, {})
+        children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react_icons6.ChatBubbleIcon, {})
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
-var import_themes37 = require("@radix-ui/themes");
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_themes38 = require("@radix-ui/themes");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var Root6 = function(param) {
     var children = param.children;
     var isOpen = useThreadDialogContext().isOpen;
     if (!isOpen) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes37.Card, {
+    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes38.Card, {
         mb: "3",
         style: {
             display: "flex",
@@ -2612,7 +2752,7 @@ var Root6 = function(param) {
             maxWidth: "400px",
             maxHeight: "720px"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes37.Inset, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes38.Inset, {
             clip: "padding-box",
             side: "all",
             pb: "current",
@@ -2625,21 +2765,23 @@ var Root6 = function(param) {
     });
 };
 var Content4 = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Root6, {
-        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(Thread.Root, {
+    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Root6, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(Thread.Root, {
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Thread.Messages, {
+                /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Thread.Messages, {
                     style: {
-                        padding: "var(--space-5)"
+                        paddingTop: "var(--space-5)",
+                        paddingRight: "var(--space-5)",
+                        paddingLeft: "var(--space-5)"
                     }
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes37.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes38.Flex, {
                     direction: "column",
                     pl: "5",
                     pr: "5",
                     pb: "3",
                     flexShrink: "0",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Thread.MessageForm, {})
+                    children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Thread.MessageForm, {})
                 })
             ]
         })
@@ -2647,13 +2789,13 @@ var Content4 = function() {
 };
 Content4.Root = Root6;
 // src/components/threads/ThreadDialog/index.tsx
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var ThreadDialog = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Root5, {
+    return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Root5, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Content4, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Trigger, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Button3, {})
+            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Content4, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Trigger, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Button3, {})
             })
         ]
     });
@@ -2664,12 +2806,10 @@ ThreadDialog.Button = Button3;
 ThreadDialog.Content = Content4;
 // src/components/threads/AudioThread/Root/index.tsx
 var import_runtime = require("regenerator-runtime/runtime");
-var import_react38 = require("react");
-var import_themes38 = require("@radix-ui/themes");
-var import_react_speech_recognition = __toESM(require("react-speech-recognition"), 1);
+var import_themes39 = require("@radix-ui/themes");
 // src/contexts/threads/AudioThreadContext/index.ts
-var import_react34 = require("react");
-var AudioThreadContext = (0, import_react34.createContext)({
+var import_react40 = require("react");
+var AudioThreadContext = (0, import_react40.createContext)({
     status: "idle",
     recorderProps: {
         status: "idle",
@@ -2726,12 +2866,22 @@ var AudioThreadContext = (0, import_react34.createContext)({
 });
 // src/components/threads/AudioThread/Root/index.tsx
 var import_react_use4 = require("react-use");
+// src/components/threads/AudioThread/Root/lib/blobToData.ts
+var blobToData = function(blob) {
+    return new Promise(function(resolve) {
+        var reader = new FileReader();
+        reader.onloadend = function() {
+            return resolve(reader.result);
+        };
+        reader.readAsDataURL(blob);
+    });
+};
 // src/hooks/audioThreads/useStatus/index.ts
-var import_react35 = require("react");
+var import_react41 = require("react");
 var useStatus = function(param) {
     var messageAudioProps = param.messageAudioProps, recorderProps = param.recorderProps, createMessageProps = param.createMessageProps;
     var isRunActiveProps = useIsRunActive();
-    var status = (0, import_react35.useMemo)(function() {
+    var status = (0, import_react41.useMemo)(function() {
         if (recorderProps.status === "recording") return "recording";
         if (createMessageProps.isPending) return "creatingMessage";
         if (isRunActiveProps.isRunActive) return "runActive";
@@ -2754,27 +2904,21 @@ var useStatus = function(param) {
 // src/hooks/audioThreads/useRecorder/index.ts
 var import_dayjs = __toESM(require("dayjs"), 1);
 var import_use_audio_capture = require("use-audio-capture");
-var import_react36 = require("react");
+var import_react42 = require("react");
 var import_react_use_audio_player = require("react-use-audio-player");
 var import_react_use3 = require("react-use");
 var useRecorder = function(param) {
     var isStopOnSilence = param.isStopOnSilence, onStart = param.onStart, onStop = param.onStop;
-    var _ref = _sliced_to_array((0, import_react36.useState)(null), 2), silenceStart = _ref[0], setSilenceStart = _ref[1];
-    var _ref1 = _sliced_to_array((0, import_react36.useState)(null), 2), noiseStart = _ref1[0], setNoiseStart = _ref1[1];
-    var _ref2 = _sliced_to_array((0, import_react36.useState)(null), 2), mediaStream = _ref2[0], setMediaStream = _ref2[1];
-    var _ref3 = _sliced_to_array((0, import_react36.useState)("idle"), 2), status = _ref3[0], setStatus = _ref3[1];
+    var _ref = _sliced_to_array((0, import_react42.useState)(null), 2), silenceStart = _ref[0], setSilenceStart = _ref[1];
+    var _ref1 = _sliced_to_array((0, import_react42.useState)(null), 2), noiseStart = _ref1[0], setNoiseStart = _ref1[1];
+    var _ref2 = _sliced_to_array((0, import_react42.useState)(null), 2), mediaStream = _ref2[0], setMediaStream = _ref2[1];
+    var _ref3 = _sliced_to_array((0, import_react42.useState)("idle"), 2), status = _ref3[0], setStatus = _ref3[1];
     var startAudioPlayer = (0, import_react_use_audio_player.useAudioPlayer)();
     var endAudioPlayer = (0, import_react_use_audio_player.useAudioPlayer)();
-    var _ref4 = _sliced_to_array((0, import_react36.useState)(false), 2), isLoaded = _ref4[0], setIsLoaded = _ref4[1];
-    (0, import_react36.useEffect)(function() {
+    var _ref4 = _sliced_to_array((0, import_react42.useState)(false), 2), isLoaded = _ref4[0], setIsLoaded = _ref4[1];
+    (0, import_react42.useEffect)(function() {
         if (isLoaded) return;
         setIsLoaded(true);
-        startAudioPlayer.load("/sounds/warning.wav", {
-            html5: true
-        });
-        endAudioPlayer.load("/sounds/success.wav", {
-            html5: true
-        });
     }, [
         isLoaded,
         startAudioPlayer,
@@ -2782,7 +2926,6 @@ var useRecorder = function(param) {
     ]);
     var audioCaptureProps = (0, import_use_audio_capture.useAudioCapture)({
         onStart: function(event, opts) {
-            startAudioPlayer.play();
             setStatus("recording");
             setMediaStream(opts.mediaStream);
             isInited.current = false;
@@ -2799,7 +2942,6 @@ var useRecorder = function(param) {
                         for(_len = _arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
                             args[_key] = _arguments[_key];
                         }
-                        endAudioPlayer.play();
                         setStatus("stopped");
                         if (!onStop) return [
                             3,
@@ -2832,9 +2974,9 @@ var useRecorder = function(param) {
             setNoiseStart(null);
         }
     });
-    var _ref5 = _sliced_to_array((0, import_react36.useState)(null), 2), audioEngine = _ref5[0], setAudioEngine = _ref5[1];
-    var isInited = (0, import_react36.useRef)(false);
-    (0, import_react36.useEffect)(function() {
+    var _ref5 = _sliced_to_array((0, import_react42.useState)(null), 2), audioEngine = _ref5[0], setAudioEngine = _ref5[1];
+    var isInited = (0, import_react42.useRef)(false);
+    (0, import_react42.useEffect)(function() {
         if (!mediaStream) return;
         if (isInited.current) return;
         isInited.current = true;
@@ -2847,7 +2989,7 @@ var useRecorder = function(param) {
         isInited,
         mediaStream
     ]);
-    var visualizationAnalyser = (0, import_react36.useMemo)(function() {
+    var visualizationAnalyser = (0, import_react42.useMemo)(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         audioEngine.source.connect(result);
@@ -2855,7 +2997,7 @@ var useRecorder = function(param) {
     }, [
         audioEngine
     ]);
-    var silenceAnalyser = (0, import_react36.useMemo)(function() {
+    var silenceAnalyser = (0, import_react42.useMemo)(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         result.minDecibels = -45;
@@ -2864,7 +3006,7 @@ var useRecorder = function(param) {
     }, [
         audioEngine
     ]);
-    var handleSilence = (0, import_react36.useCallback)(function() {
+    var handleSilence = (0, import_react42.useCallback)(function() {
         if (!silenceAnalyser) return;
         var frequencyData = new Uint8Array(silenceAnalyser.frequencyBinCount);
         silenceAnalyser.getByteFrequencyData(frequencyData);
@@ -2887,7 +3029,7 @@ var useRecorder = function(param) {
         setNoiseStart,
         setSilenceStart
     ]);
-    (0, import_react36.useEffect)(function() {
+    (0, import_react42.useEffect)(function() {
         if (!isStopOnSilence) return;
         requestAnimationFrame(function() {
             return handleSilence();
@@ -2910,7 +3052,7 @@ var useRecorder = function(param) {
     });
 };
 // src/hooks/audioThreads/useMessageAudio/index.ts
-var import_react37 = require("react");
+var import_react43 = require("react");
 var import_howler = require("howler");
 var import_react_use_audio_player2 = require("react-use-audio-player");
 // src/hooks/audioThreads/useMessageAudio/lib/input.ts
@@ -2936,11 +3078,11 @@ var isHtmlAudioSupported = !unsupportedNames.includes(((_this = (0, import_detec
 // src/hooks/audioThreads/useMessageAudio/index.ts
 var useMessageAudio = function(param) {
     var onEnd = param.onEnd;
-    var _ref = _sliced_to_array((0, import_react37.useState)([]), 2), playedMessageIds = _ref[0], setPlayedMessageIds = _ref[1];
+    var _ref = _sliced_to_array((0, import_react43.useState)([]), 2), playedMessageIds = _ref[0], setPlayedMessageIds = _ref[1];
     var audioPlayer = (0, import_react_use_audio_player2.useAudioPlayer)();
     var superinterfaceContext = useSuperinterfaceContext();
     var latestMessageProps = useLatestMessage();
-    (0, import_react37.useEffect)(function() {
+    (0, import_react43.useEffect)(function() {
         if (audioPlayer.playing) return;
         if (!latestMessageProps.latestMessage) return;
         if (latestMessageProps.latestMessage.role !== "assistant") return;
@@ -2958,7 +3100,14 @@ var useMessageAudio = function(param) {
             format: "mp3",
             autoplay: true,
             html5: isHtmlAudioSupported,
-            onend: onEnd
+            onend: onEnd,
+            xhr: _object_spread_props(_object_spread({}, superinterfaceContext.publicApiKey ? {
+                headers: {
+                    Authorization: "Bearer ".concat(superinterfaceContext.publicApiKey)
+                }
+            } : {}), {
+                withCredentials: true
+            })
         });
     }, [
         superinterfaceContext,
@@ -2967,9 +3116,9 @@ var useMessageAudio = function(param) {
         playedMessageIds,
         onEnd
     ]);
-    var isInited = (0, import_react37.useRef)(false);
-    var _ref1 = _sliced_to_array((0, import_react37.useState)(null), 2), audioEngine = _ref1[0], setAudioEngine = _ref1[1];
-    (0, import_react37.useEffect)(function() {
+    var isInited = (0, import_react43.useRef)(false);
+    var _ref1 = _sliced_to_array((0, import_react43.useState)(null), 2), audioEngine = _ref1[0], setAudioEngine = _ref1[1];
+    (0, import_react43.useEffect)(function() {
         if (!audioPlayer.playing) return;
         if (isInited.current) return;
         isInited.current = true;
@@ -2990,7 +3139,7 @@ var useMessageAudio = function(param) {
         audioPlayer,
         isInited
     ]);
-    var visualizationAnalyser = (0, import_react37.useMemo)(function() {
+    var visualizationAnalyser = (0, import_react43.useMemo)(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         audioEngine.source.connect(audioEngine.audioContext.destination);
@@ -3004,48 +3153,47 @@ var useMessageAudio = function(param) {
     });
 };
 // src/components/threads/AudioThread/Root/index.tsx
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var Root7 = function(param) {
     var children = param.children;
     useLifecycle();
     var createMessageProps = useCreateMessage();
-    var _ref = (0, import_react_speech_recognition.useSpeechRecognition)(), transcript = _ref.transcript, resetTranscript = _ref.resetTranscript;
-    var transcriptRef = (0, import_react38.useRef)(transcript);
-    (0, import_react38.useEffect)(function() {
-        transcriptRef.current = transcript;
-    }, [
-        transcript
-    ]);
     var recorderProps = useRecorder({
         isStopOnSilence: true,
         onStart: /*#__PURE__*/ _async_to_generator(function() {
             return _ts_generator(this, function(_state) {
                 console.log("start");
-                resetTranscript();
-                import_react_speech_recognition.default.default.startListening({
-                    continuous: true
-                });
                 return [
                     2
                 ];
             });
         }),
         onStop: function() {
-            var _ref = _async_to_generator(function(_event, _chunks) {
+            var _ref = _async_to_generator(function(_event, chunks) {
+                var blob, audioContent;
                 return _ts_generator(this, function(_state) {
-                    console.log({
-                        transcript: transcriptRef.current
-                    });
-                    return [
-                        2,
-                        createMessageProps.createMessage({
-                            // @ts-ignore-next-line
-                            content: transcriptRef.current
-                        })
-                    ];
+                    switch(_state.label){
+                        case 0:
+                            blob = new Blob(chunks, {
+                                type: chunks[0].type
+                            });
+                            return [
+                                4,
+                                blobToData(blob)
+                            ];
+                        case 1:
+                            audioContent = _state.sent();
+                            return [
+                                2,
+                                createMessageProps.createMessage({
+                                    // @ts-ignore-next-line
+                                    audioContent: audioContent
+                                })
+                            ];
+                    }
                 });
             });
-            return function(_event, _chunks) {
+            return function(_event, chunks) {
                 return _ref.apply(this, arguments);
             };
         }()
@@ -3065,13 +3213,13 @@ var Root7 = function(param) {
         createMessageProps: createMessageProps,
         messageAudioProps: messageAudioProps
     }).status;
-    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(AudioThreadContext.Provider, {
+    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(AudioThreadContext.Provider, {
         value: {
             status: status,
             recorderProps: recorderProps,
             messageAudioProps: messageAudioProps
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes38.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes39.Flex, {
             direction: "column",
             flexGrow: "1",
             p: "5",
@@ -3080,23 +3228,23 @@ var Root7 = function(param) {
     });
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-var import_themes39 = require("@radix-ui/themes");
+var import_themes40 = require("@radix-ui/themes");
 // src/hooks/threads/useAudioThreadContext/index.ts
-var import_react39 = require("react");
+var import_react44 = require("react");
 var useAudioThreadContext = function() {
-    return (0, import_react39.useContext)(AudioThreadContext);
+    return (0, import_react44.useContext)(AudioThreadContext);
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var Visualization = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes39.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes40.Flex, {
         direction: "column",
         align: "center",
         justify: "center",
         mb: "3",
         flexGrow: "1",
-        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes39.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes40.Flex, {
             align: "center",
             justify: "center",
             height: "200px",
@@ -3110,22 +3258,22 @@ var Visualization = function() {
 };
 // src/components/threads/AudioThread/Form/index.tsx
 var import_react_icons8 = require("@radix-ui/react-icons");
-var import_themes42 = require("@radix-ui/themes");
+var import_themes43 = require("@radix-ui/themes");
 // src/components/threads/AudioThread/Form/Visualizer/index.tsx
 var import_lodash7 = __toESM(require("lodash"), 1);
-var import_themes40 = require("@radix-ui/themes");
-var import_react40 = require("react");
+var import_themes41 = require("@radix-ui/themes");
+var import_react45 = require("react");
 var import_radash10 = require("radash");
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var barCount = 4;
 var Visualizer = function() {
     var audioThreadContext = useAudioThreadContext();
     var visualizationAnalyser = audioThreadContext.recorderProps.visualizationAnalyser;
-    var _ref = _sliced_to_array((0, import_react40.useState)(function() {
+    var _ref = _sliced_to_array((0, import_react45.useState)(function() {
         return new AudioContext().createAnalyser();
     }), 1), emptyVisualizer = _ref[0];
-    var _ref1 = _sliced_to_array((0, import_react40.useState)([]), 2), barHeights = _ref1[0], setBarHeights = _ref1[1];
-    var draw = (0, import_react40.useCallback)(function(param) {
+    var _ref1 = _sliced_to_array((0, import_react45.useState)([]), 2), barHeights = _ref1[0], setBarHeights = _ref1[1];
+    var draw = (0, import_react45.useCallback)(function(param) {
         var visualizationAnalyser2 = param.visualizationAnalyser;
         var frequencyData = new Uint8Array(visualizationAnalyser2.frequencyBinCount / 15);
         visualizationAnalyser2.getByteFrequencyData(frequencyData);
@@ -3139,7 +3287,7 @@ var Visualizer = function() {
             });
         });
     }, []);
-    (0, import_react40.useEffect)(function() {
+    (0, import_react45.useEffect)(function() {
         draw({
             visualizationAnalyser: visualizationAnalyser || emptyVisualizer
         });
@@ -3148,7 +3296,7 @@ var Visualizer = function() {
         visualizationAnalyser,
         emptyVisualizer
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Grid, {
+    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes41.Grid, {
         columns: "".concat(barCount),
         gap: "1",
         width: "auto",
@@ -3157,12 +3305,12 @@ var Visualizer = function() {
             gridTemplateColumns: "repeat(4, minmax(0, 1fr))"
         },
         children: barHeights.map(function(barHeight, index) {
-            return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Flex, {
+            return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes41.Flex, {
                 direction: "column",
                 align: "center",
                 justify: "center",
                 height: "20px",
-                children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Flex, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes41.Flex, {
                     minHeight: "50%",
                     maxHeight: "100%",
                     height: "".concat(barHeight + 20, "%"),
@@ -3177,31 +3325,31 @@ var Visualizer = function() {
     });
 };
 // src/components/threads/AudioThread/Form/ActionButton/index.tsx
-var import_themes41 = require("@radix-ui/themes");
+var import_themes42 = require("@radix-ui/themes");
 var import_react_icons7 = require("@radix-ui/react-icons");
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 var ActionButton = function() {
     var audioThreadContext = useAudioThreadContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_themes41.Flex, {
+        return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_themes42.Flex, {
             align: "center",
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Flex, {
                     mr: "3",
                     ml: "-7",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.IconButton, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.IconButton, {
                         onClick: audioThreadContext.recorderProps.pause,
                         color: "gray",
                         radius: "full",
                         size: "1",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_icons7.PauseIcon, {})
+                        children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_icons7.PauseIcon, {})
                     })
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.Tooltip, {
+                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Tooltip, {
                     open: true,
                     content: "Send your message",
                     side: "bottom",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.IconButton, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.IconButton, {
                         onClick: audioThreadContext.recorderProps.stop,
                         color: "gray",
                         highContrast: true,
@@ -3210,14 +3358,14 @@ var ActionButton = function() {
                         style: {
                             border: "2px solid var(--gray-8)"
                         },
-                        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_icons7.ArrowUpIcon, {})
+                        children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_icons7.ArrowUpIcon, {})
                     })
                 })
             ]
         });
     }
     if (audioThreadContext.status === "recorderPaused") {
-        return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.IconButton, {
             onClick: audioThreadContext.recorderProps.resume,
             color: "red",
             radius: "full",
@@ -3225,11 +3373,11 @@ var ActionButton = function() {
             style: {
                 border: "2px solid var(--gray-8)"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_icons7.ResumeIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_icons7.ResumeIcon, {})
         });
     }
     if (audioThreadContext.status === "idle") {
-        return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.IconButton, {
             onClick: function() {
                 return audioThreadContext.recorderProps.start();
             },
@@ -3242,7 +3390,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "playing") {
-        return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.IconButton, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.pause();
             },
@@ -3252,11 +3400,11 @@ var ActionButton = function() {
             style: {
                 border: "2px solid var(--gray-8)"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_icons7.PauseIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_icons7.PauseIcon, {})
         });
     }
     if (audioThreadContext.status === "playerPaused") {
-        return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.IconButton, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.play();
             },
@@ -3266,10 +3414,10 @@ var ActionButton = function() {
             style: {
                 border: "2px solid var(--gray-8)"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_react_icons7.ResumeIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_react_icons7.ResumeIcon, {})
         });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes41.IconButton, {
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.IconButton, {
         size: "4",
         color: "red",
         radius: "full",
@@ -3280,49 +3428,49 @@ var ActionButton = function() {
     });
 };
 // src/components/threads/AudioThread/Form/index.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var Form = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_themes42.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes43.Flex, {
         direction: "column",
         align: "center",
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_themes42.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes43.Flex, {
                 pb: "3",
                 align: "center",
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes42.Flex, {
+                    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes43.Flex, {
                         ml: "-5",
                         mr: "2",
                         align: "center",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react_icons8.SpeakerModerateIcon, {
+                        children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_react_icons8.SpeakerModerateIcon, {
                             style: {
                                 color: "var(--".concat(audioThreadContext.status === "recording" ? "mint" : "gray", "-12)")
                             }
                         })
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes42.Flex, {
+                    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes43.Flex, {
                         px: "2",
                         py: "1",
                         style: {
                             backgroundColor: "var(--".concat(audioThreadContext.status === "recording" ? "mint" : "gray", "-4)"),
                             borderRadius: "var(--radius-6)"
                         },
-                        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Visualizer, {})
+                        children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Visualizer, {})
                     })
                 ]
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ActionButton, {})
+            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ActionButton, {})
         ]
     });
 };
 // src/components/threads/AudioThread/index.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var AudioThread = function(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(Root7, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(Root7, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Visualization, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Form, {})
+            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Visualization, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Form, {})
         ]
     }));
 };
@@ -3330,15 +3478,15 @@ AudioThread.Root = Root7;
 AudioThread.Visualization = Visualization;
 AudioThread.Form = Form;
 // src/components/threads/AudioThreadDialog/index.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var AudioThreadDialog = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(Root5, {
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(Root5, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Content4.Root, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(AudioThread, {})
+            /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Content4.Root, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(AudioThread, {})
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Trigger, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Button3, {})
+            /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Trigger, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Button3, {})
             })
         ]
     });
@@ -3348,84 +3496,125 @@ AudioThreadDialog.Trigger = Trigger;
 AudioThreadDialog.Button = Button3;
 AudioThreadDialog.Content = Content4;
 // src/components/suggestions/Suggestions/index.tsx
-var import_react41 = require("react");
-var import_themes44 = require("@radix-ui/themes");
-// src/components/suggestions/Suggestion/index.tsx
+var import_react47 = require("react");
+// src/components/suggestions/Suggestions/Content.tsx
+var import_react46 = require("react");
+var import_radash11 = require("radash");
+var import_react_children_utilities = require("react-children-utilities");
+var import_themes45 = require("@radix-ui/themes");
+// src/components/suggestions/Suggestions/Item.tsx
 var import_react_icons9 = require("@radix-ui/react-icons");
-var import_themes43 = require("@radix-ui/themes");
-var import_jsx_runtime58 = require("react/jsx-runtime");
-var Suggestion = function(param) {
-    var suggestion = param.suggestion;
-    var createMessage = useCreateMessage().createMessage;
-    var _useIsRunActive = useIsRunActive(), isRunActive2 = _useIsRunActive.isRunActive;
-    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_themes43.Button, {
-        variant: "soft",
-        style: {
-            justifyContent: "space-between"
-        },
+var import_themes44 = require("@radix-ui/themes");
+var import_jsx_runtime60 = require("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__ */ (0, import_jsx_runtime60.jsx)(Content5, {
         onClick: function() {
             createMessage({
                 // @ts-ignore-next-line
                 content: suggestion
             });
         },
-        disabled: isRunActive2,
+        isDisabled: isDisabled,
+        isPending: isPending,
+        children: suggestion
+    });
+};
+var Content5 = function(param) {
+    var onClick = param.onClick, isDisabled = param.isDisabled, isPending = param.isPending, children = param.children;
+    return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_themes44.Button, {
+        variant: "soft",
+        onClick: onClick,
+        disabled: isDisabled,
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.Text, {
+            /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_themes44.Text, {
                 size: "1",
                 weight: "regular",
-                children: suggestion
+                children: children
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react_icons9.ArrowUpIcon, {})
+            /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_themes44.Spinner, {
+                loading: isPending,
+                children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_react_icons9.ArrowUpIcon, {})
+            })
         ]
     });
 };
+Item.Content = Content5;
+// src/components/suggestions/Suggestions/Content.tsx
+var import_jsx_runtime61 = require("react/jsx-runtime");
+var Content6 = function(param) {
+    var children = param.children;
+    var messageContext = useMessageContext();
+    var latestMessageProps = useLatestMessage();
+    var isRunActiveProps = useIsRunActive();
+    var suggestions = (0, import_react46.useMemo)(function() {
+        return (0, import_react_children_utilities.onlyText)(children).split(/\r?\n/).filter(function(c) {
+            return !(0, import_radash11.isEmpty)(c);
+        }).map(function(c) {
+            return c.trim();
+        });
+    }, [
+        children
+    ]);
+    var isDisabled = (0, import_react46.useMemo)(function() {
+        var _messageContext_message;
+        return ((_messageContext_message = messageContext.message) === null || _messageContext_message === void 0 ? void 0 : _messageContext_message.id) !== latestMessageProps.latestMessage.id || isRunActiveProps.isRunActive;
+    }, [
+        messageContext,
+        latestMessageProps,
+        isRunActiveProps
+    ]);
+    if ((0, import_radash11.isEmpty)(suggestions)) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.Flex, {
+        gap: "2",
+        py: "2",
+        wrap: "wrap",
+        children: suggestions.map(function(suggestion) {
+            return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(Item, {
+                suggestion: suggestion,
+                isDisabled: isDisabled
+            }, suggestion);
+        })
+    });
+};
 // src/components/suggestions/Suggestions/index.tsx
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var Suggestions = function(param) {
-    var _param_emptyStateSuggestions = param.emptyStateSuggestions, emptyStateSuggestions = _param_emptyStateSuggestions === void 0 ? [] : _param_emptyStateSuggestions, _param_suggestions = param.suggestions, suggestions = _param_suggestions === void 0 ? [] : _param_suggestions;
+    var children = param.children;
     var latestMessageProps = useLatestMessage();
-    var isRunActiveProps = useIsRunActive();
-    var isDisabled = (0, import_react41.useMemo)(function() {
+    var isDisabled = (0, import_react47.useMemo)(function() {
         var // @ts-ignore-next-line
         _latestMessageProps_latestMessage_metadata, _latestMessageProps_latestMessage;
-        return ((_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) || isRunActiveProps.isRunActive;
+        return (_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;
     }, [
-        latestMessageProps,
-        isRunActiveProps
+        latestMessageProps
     ]);
     if (latestMessageProps.isLoading) return null;
     if (isDisabled) return null;
-    if (!latestMessageProps.latestMessage && emptyStateSuggestions.length > 0) {
-        return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes44.Flex, {
-            gap: "2",
-            py: "2",
-            wrap: "wrap",
-            children: emptyStateSuggestions.map(function(suggestion) {
-                return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Suggestion, {
-                    suggestion: suggestion
-                }, suggestion);
-            })
-        });
-    }
-    if (latestMessageProps.latestMessage.role === "assistant") {
-        return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes44.Flex, {
-            gap: "2",
-            py: "2",
-            wrap: "wrap",
-            children: suggestions.map(function(suggestion) {
-                return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Suggestion, {
-                    suggestion: suggestion
-                }, suggestion);
-            })
-        });
-    }
-    return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Content6, {
+        children: children
+    });
 };
-// src/hooks/markdown/useMarkdownContext/index.ts
-var import_react42 = require("react");
-var useMarkdownContext = function() {
-    return (0, import_react42.useContext)(MarkdownContext);
+Suggestions.Item = Item;
+// src/components/markdown/MarkdownProvider/index.tsx
+var import_react48 = require("react");
+var import_jsx_runtime63 = require("react/jsx-runtime");
+var MarkdownProvider = function(_param) {
+    var children = _param.children, rest = _object_without_properties(_param, [
+        "children"
+    ]);
+    var prevMarkdownContext = useMarkdownContext();
+    var value = (0, import_react48.useMemo)(function() {
+        return merge(prevMarkdownContext, rest);
+    }, [
+        rest,
+        prevMarkdownContext
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(MarkdownContext.Provider, {
+        value: value,
+        children: children
+    });
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -3436,7 +3625,7 @@ var useMarkdownContext = function() {
     FunctionBase: FunctionBase,
     FunctionComponentsContext: FunctionComponentsContext,
     MarkdownContext: MarkdownContext,
-    Suggestion: Suggestion,
+    MarkdownProvider: MarkdownProvider,
     Suggestions: Suggestions,
     SuperinterfaceProvider: SuperinterfaceProvider,
     Thread: Thread,
@@ -3449,6 +3638,7 @@ var useMarkdownContext = function() {
     useLatestRun: useLatestRun,
     useLifecycle: useLifecycle,
     useMarkdownContext: useMarkdownContext,
+    useMessageContext: useMessageContext,
     useMessages: useMessages,
     useRuns: useRuns,
     useSuperinterfaceContext: useSuperinterfaceContext,