npm - @superinterface/react - Versions diffs - 2.13.4 → 2.15.0 - Mend

@superinterface/react 2.13.4 → 2.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.cjs CHANGED Viewed

@@ -338,6 +338,9 @@ __export(src_exports, {
     AudioThreadDialog: function() {
         return AudioThreadDialog;
     },
+    ComponentsProvider: function() {
+        return ComponentsProvider;
+    },
     FunctionBase: function() {
         return FunctionBase;
     },
@@ -350,6 +353,9 @@ __export(src_exports, {
     MarkdownProvider: function() {
         return MarkdownProvider;
     },
+    RunStep: function() {
+        return RunStep;
+    },
     Suggestions: function() {
         return Suggestions;
     },
@@ -365,6 +371,9 @@ __export(src_exports, {
     ThreadDialogContext: function() {
         return ThreadDialogContext;
     },
+    useComponents: function() {
+        return useComponents;
+    },
     useCreateMessage: function() {
         return useCreateMessage;
     },
@@ -488,7 +497,7 @@ var SuperinterfaceProvider = function(param) {
 // src/components/threads/Thread/Messages/index.tsx
 var import_themes30 = require("@radix-ui/themes");
 // src/components/threads/Thread/Messages/Content/index.tsx
-var import_react22 = require("react");
+var import_react24 = require("react");
 // src/hooks/messages/useMessages/index.tsx
 var import_react4 = require("react");
 var import_react_query2 = require("@tanstack/react-query");
@@ -799,7 +808,7 @@ var useToasts = function() {
     return (0, import_react9.useContext)(ToastsContext);
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-var import_react21 = require("react");
+var import_react23 = require("react");
 var import_themes27 = require("@radix-ui/themes");
 var import_react_icons4 = require("@radix-ui/react-icons");
 // src/components/messageGroups/MessageGroupBase/AssistantAvatar.tsx
@@ -835,7 +844,7 @@ var AssistantNameContext = (0, import_react12.createContext)("Assistant");
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
 var import_themes26 = require("@radix-ui/themes");
 // src/components/threads/Thread/Message/index.tsx
-var import_react20 = require("react");
+var import_react22 = require("react");
 var import_themes25 = require("@radix-ui/themes");
 // src/components/skeletons/StartingContentSkeleton/index.tsx
 var import_themes6 = require("@radix-ui/themes");
@@ -854,6 +863,9 @@ var StartingContentSkeleton = function() {
 };
 // src/components/runSteps/RunSteps/index.tsx
 var import_themes15 = require("@radix-ui/themes");
+var import_react17 = require("react");
+// src/contexts/components/ComponentsContext/index.tsx
+var import_react16 = require("react");
 // src/components/runSteps/RunStep/ToolCalls/index.tsx
 var import_themes14 = require("@radix-ui/themes");
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/index.tsx
@@ -1080,10 +1092,16 @@ var Starting = function() {
 };
 // src/components/runSteps/RunStep/ToolCalls/index.tsx
 var import_jsx_runtime18 = require("react/jsx-runtime");
+var Root = function(param) {
+    var children = param.children;
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_themes14.Flex, {
+        direction: "column",
+        children: children
+    });
+};
 var ToolCalls = function(param) {
     var stepDetails = param.stepDetails, runStep = param.runStep;
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_themes14.Flex, {
-        direction: "column",
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(Root, {
         children: [
             !stepDetails.tool_calls.length && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Starting, {}),
             stepDetails.tool_calls.map(function(toolCall) {
@@ -1095,6 +1113,9 @@ var ToolCalls = function(param) {
         ]
     });
 };
+ToolCalls.Root = Root;
+ToolCalls.Starting = Starting;
+ToolCalls.ToolCall = ToolCall;
 // src/components/runSteps/RunStep/index.tsx
 var import_jsx_runtime19 = require("react/jsx-runtime");
 var RunStep = function(param) {
@@ -1107,21 +1128,30 @@ var RunStep = function(param) {
     }
     return null;
 };
+RunStep.ToolCalls = ToolCalls;
+// src/contexts/components/ComponentsContext/index.tsx
+var ComponentsContext = (0, import_react16.createContext)({
+    components: {
+        RunStep: RunStep
+    }
+});
 // src/components/runSteps/RunSteps/index.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
 var RunSteps = function(param) {
     var runSteps = param.runSteps;
+    var componentsContext = (0, import_react17.useContext)(ComponentsContext);
+    var Component = componentsContext.components.RunStep;
     return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes15.Flex, {
         direction: "column-reverse",
         children: runSteps.map(function(runStep) {
-            return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RunStep, {
+            return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Component, {
                 runStep: runStep
             }, runStep.id);
         })
     });
 };
 // src/hooks/messages/useIsMutatingMessage/index.ts
-var import_react16 = require("react");
+var import_react18 = require("react");
 var import_react_query3 = require("@tanstack/react-query");
 var useIsMutatingMessage = function() {
     var threadContext = useSuperinterfaceContext();
@@ -1131,7 +1161,7 @@ var useIsMutatingMessage = function() {
             threadContext.variables
         ]
     });
-    var isMutatingMessage = (0, import_react16.useMemo)(function() {
+    var isMutatingMessage = (0, import_react18.useMemo)(function() {
         return mutatingMessagesCount > 0;
     }, [
         mutatingMessagesCount
@@ -1139,18 +1169,18 @@ var useIsMutatingMessage = function() {
     return isMutatingMessage;
 };
 // src/contexts/messages/MessageContext/index.ts
-var import_react17 = require("react");
-var MessageContext = (0, import_react17.createContext)({
+var import_react19 = require("react");
+var MessageContext = (0, import_react19.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");
+var import_react_markdown = __toESM(require("react-markdown"), 1);
 // src/hooks/markdown/useMarkdownContext/index.ts
-var import_react19 = require("react");
+var import_react21 = require("react");
 // src/contexts/markdown/MarkdownContext/index.ts
-var import_react18 = require("react");
+var import_react20 = 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");
@@ -1280,7 +1310,7 @@ var components = {
     img: Img
 };
 // src/contexts/markdown/MarkdownContext/index.ts
-var MarkdownContext = (0, import_react18.createContext)({
+var MarkdownContext = (0, import_react20.createContext)({
     remarkPlugins: [],
     rehypeReactOptions: {
         components: components
@@ -1288,19 +1318,22 @@ var MarkdownContext = (0, import_react18.createContext)({
 });
 // src/hooks/markdown/useMarkdownContext/index.ts
 var useMarkdownContext = function() {
-    return (0, import_react19.useContext)(MarkdownContext);
+    return (0, import_react21.useContext)(MarkdownContext);
 };
 // src/components/threads/Thread/Message/TextContent.tsx
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var TextContent = function(param) {
     var content = param.content;
     var markdownContext = useMarkdownContext();
-    return (0, import_react_remark.useRemarkSync)(content.text.value, markdownContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react_markdown.default, _object_spread_props(_object_spread({}, markdownContext), {
+        children: content.text.value
+    }));
 };
 // src/components/threads/Thread/Message/index.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var Message = function(param) {
     var message = param.message;
-    var _ref = _sliced_to_array((0, import_react20.useMemo)(function() {
+    var _ref = _sliced_to_array((0, import_react22.useMemo)(function() {
         if (!message.runSteps.length) return [
             [],
             []
@@ -1333,7 +1366,7 @@ var Message = function(param) {
         message
     ]), 2), olderRunSteps = _ref[0], laterRunSteps = _ref[1];
     var isMutatingMessage = useIsMutatingMessage();
-    var isInProgress = (0, import_react20.useMemo)(function() {
+    var isInProgress = (0, import_react22.useMemo)(function() {
         if (!isMutatingMessage) return false;
         if (message.status === "in_progress") return true;
         return message.runSteps.some(function(rs) {
@@ -1342,28 +1375,28 @@ var Message = function(param) {
     }, [
         message
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Provider, {
+    return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Provider, {
         value: {
             message: message
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_themes25.Box, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_themes25.Box, {
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(RunSteps, {
+                /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(RunSteps, {
                     runSteps: olderRunSteps
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_themes25.Box, {
+                /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_themes25.Box, {
                     children: [
                         message.content.map(function(content, index) {
-                            return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react20.Fragment, {
-                                children: content.type === "text" && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(TextContent, {
+                            return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react22.Fragment, {
+                                children: content.type === "text" && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TextContent, {
                                     content: content
                                 })
                             }, index);
                         }),
-                        isInProgress && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(StartingContentSkeleton, {})
+                        isInProgress && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(StartingContentSkeleton, {})
                     ]
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(RunSteps, {
+                /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(RunSteps, {
                     runSteps: laterRunSteps
                 })
             ]
@@ -1371,36 +1404,36 @@ var Message = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var Content2 = function(param) {
     var messageGroup = param.messageGroup;
-    return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_themes26.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes26.Flex, {
         direction: "column-reverse",
         children: messageGroup.messages.map(function(message) {
-            return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Message, {
+            return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Message, {
                 message: message
             }, message.id);
         })
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var MessageGroup = function(param) {
     var messageGroup = param.messageGroup;
-    var assistantNameContext = (0, import_react21.useContext)(AssistantNameContext);
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(MessageGroupBase, {
+    var assistantNameContext = (0, import_react23.useContext)(AssistantNameContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(MessageGroupBase, {
         children: [
-            messageGroup.role === "user" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes27.Avatar, {
-                fallback: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_icons4.PersonIcon, {}),
+            messageGroup.role === "user" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_themes27.Avatar, {
+                fallback: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_icons4.PersonIcon, {}),
                 size: "1"
-            }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AssistantAvatar, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_themes27.Box, {
+            }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(AssistantAvatar, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_themes27.Box, {
                 flexGrow: "1",
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Name, {
+                    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Name, {
                         children: messageGroup.role === "user" ? "You" : assistantNameContext
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Content2, {
+                    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Content2, {
                         messageGroup: messageGroup
                     })
                 ]
@@ -1409,14 +1442,14 @@ var MessageGroup = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/index.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var Content3 = function() {
     var _useMessages = useMessages(), messages2 = _useMessages.messages, isLoading = _useMessages.isLoading, isLoadingError = _useMessages.isLoadingError;
     var addToast = useToasts().addToast;
     var _useMessageGroups = useMessageGroups({
         messages: messages2
     }), messageGroups2 = _useMessageGroups.messageGroups;
-    (0, import_react22.useEffect)(function() {
+    (0, import_react24.useEffect)(function() {
         if (isLoadingError) {
             addToast({
                 type: "error",
@@ -1428,45 +1461,45 @@ var Content3 = function() {
         addToast
     ]);
     if (isLoading || isLoadingError) {
-        return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(MessagesSkeleton, {});
+        return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(MessagesSkeleton, {});
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_jsx_runtime33.Fragment, {
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_jsx_runtime34.Fragment, {
         children: messageGroups2.map(function(messageGroup) {
-            return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(MessageGroup, {
+            return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(MessageGroup, {
                 messageGroup: messageGroup
             }, messageGroup.id);
         })
     });
 };
 // src/components/threads/Thread/Messages/Progress/index.tsx
-var import_react25 = require("react");
+var import_react27 = require("react");
 // src/components/skeletons/StartingSkeleton/index.tsx
-var import_react23 = require("react");
+var import_react25 = require("react");
 var import_themes28 = require("@radix-ui/themes");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var StartingSkeleton = function(param) {
     var children = param.children;
-    var assistantNameContext = (0, import_react23.useContext)(AssistantNameContext);
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(MessageGroupBase, {
+    var assistantNameContext = (0, import_react25.useContext)(AssistantNameContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(MessageGroupBase, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(AssistantAvatar, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_themes28.Box, {
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(AssistantAvatar, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_themes28.Box, {
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Name, {
+                    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Name, {
                         children: assistantNameContext
                     }),
                     children,
-                    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StartingContentSkeleton, {})
+                    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(StartingContentSkeleton, {})
                 ]
             })
         ]
     });
 };
 // src/hooks/messages/useLatestMessage/index.ts
-var import_react24 = require("react");
+var import_react26 = require("react");
 var useLatestMessage = function() {
     var props = useMessages();
-    return (0, import_react24.useMemo)(function() {
+    return (0, import_react26.useMemo)(function() {
         return _object_spread_props(_object_spread({}, props), {
             latestMessage: props.messages[0] || null
         });
@@ -1481,11 +1514,11 @@ var isOptimistic = function(param) {
     return import_lodash4.default.startsWith(id, "-");
 };
 // src/components/threads/Thread/Messages/Progress/index.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var Progress = function() {
     var latestMessage = useLatestMessage().latestMessage;
     var isMutatingMessage = useIsMutatingMessage();
-    var isVisible = (0, import_react25.useMemo)(function() {
+    var isVisible = (0, import_react27.useMemo)(function() {
         if (!latestMessage) return false;
         if (latestMessage.role !== "user") return false;
         if (latestMessage.status === "in_progress") return false;
@@ -1499,20 +1532,20 @@ var Progress = function() {
         isMutatingMessage
     ]);
     if (!isVisible) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(StartingSkeleton, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(StartingSkeleton, {});
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
 var import_themes29 = require("@radix-ui/themes");
 // src/hooks/misc/useInfiniteScroll/index.tsx
-var import_react27 = require("react");
+var import_react29 = 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_react26 = require("react");
+var import_react28 = require("react");
 var useThrottledEffect = function(cb, delay, additionalDeps) {
     var _cbRef;
-    var cbRef = (0, import_react26.useRef)(cb);
-    var throttledCb = (0, import_react26.useCallback)(import_lodash5.default.throttle(function() {
+    var cbRef = (0, import_react28.useRef)(cb);
+    var throttledCb = (0, import_react28.useCallback)(import_lodash5.default.throttle(function() {
         for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
             args[_key] = arguments[_key];
         }
@@ -1523,17 +1556,17 @@ var useThrottledEffect = function(cb, delay, additionalDeps) {
     }), [
         delay
     ]);
-    (0, import_react26.useEffect)(function() {
+    (0, import_react28.useEffect)(function() {
         cbRef.current = cb;
     });
-    (0, import_react26.useEffect)(throttledCb, [
+    (0, import_react28.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_react27.useRef)(null);
+    var containerRef = (0, import_react29.useRef)(null);
     var _ref = (0, import_react_intersection_observer.useInView)({
         root: containerRef.current,
         rootMargin: "0px",
@@ -1558,8 +1591,8 @@ var useInfiniteScroll = function(param) {
     };
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
-var Root = function(param) {
+var import_jsx_runtime37 = require("react/jsx-runtime");
+var Root2 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var _useMessages = useMessages(), isFetchingNextPage = _useMessages.isFetchingNextPage, hasNextPage = _useMessages.hasNextPage, fetchNextPage = _useMessages.fetchNextPage;
     var _useInfiniteScroll = useInfiniteScroll({
@@ -1567,7 +1600,7 @@ var Root = function(param) {
         hasNextPage: hasNextPage,
         fetchNextPage: fetchNextPage
     }), containerRef = _useInfiniteScroll.containerRef, loaderRef = _useInfiniteScroll.loaderRef;
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_themes29.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_themes29.Flex, {
         ref: containerRef,
         direction: "column-reverse",
         flexGrow: "1",
@@ -1576,10 +1609,10 @@ var Root = function(param) {
         }),
         children: [
             children,
-            hasNextPage && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_themes29.Flex, {
+            hasNextPage && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_themes29.Flex, {
                 ref: loaderRef
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_themes29.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_themes29.Flex, {
                 flexShrink: "0",
                 flexGrow: "1"
             })
@@ -1587,37 +1620,37 @@ var Root = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/NextPageSkeleton.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var NextPageSkeleton = function() {
     var hasNextPage = useMessages().hasNextPage;
     if (!hasNextPage) {
         return null;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(MessagesSkeleton, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(MessagesSkeleton, {});
 };
 // src/components/threads/Thread/Messages/index.tsx
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime39 = 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_runtime38.jsxs)(Root, {
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(Root2, {
         style: style,
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes30.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_themes30.Flex, {
                 flexShrink: "0",
                 height: "var(--space-3)"
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Progress, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Progress, {}),
             children,
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Content3, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(NextPageSkeleton, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes30.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Content3, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(NextPageSkeleton, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_themes30.Flex, {
                 flexShrink: "0",
                 flexGrow: "1"
             })
         ]
     });
 };
-Messages.Root = Root;
+Messages.Root = Root2;
 Messages.Message = Message;
 Messages.NextPageSkeleton = NextPageSkeleton;
 // src/components/threads/Thread/MessageForm/index.tsx
@@ -1626,41 +1659,41 @@ var import_themes34 = require("@radix-ui/themes");
 var import_react_icons5 = require("@radix-ui/react-icons");
 var import_themes31 = require("@radix-ui/themes");
 // src/hooks/messages/useMessageFormContext/index.ts
-var import_react29 = require("react");
+var import_react31 = require("react");
 // src/contexts/messages/MessageFormContext/index.ts
-var import_react28 = require("react");
-var MessageFormContext = (0, import_react28.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_react29.useContext)(MessageFormContext);
+    return (0, import_react31.useContext)(MessageFormContext);
 };
 // src/components/threads/Thread/MessageForm/Submit/index.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var Submit = function() {
     var superinterfaceContext = useSuperinterfaceContext();
     var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading;
     if (isLoading) {
-        return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_themes31.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes31.IconButton, {
             type: "button",
             onClick: function() {
                 var _superinterfaceContext_createMessageAbortControllerRef_current;
                 return (_superinterfaceContext_createMessageAbortControllerRef_current = superinterfaceContext.createMessageAbortControllerRef.current) === null || _superinterfaceContext_createMessageAbortControllerRef_current === void 0 ? void 0 : _superinterfaceContext_createMessageAbortControllerRef_current.abort();
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_icons5.StopIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_icons5.StopIcon, {})
         });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_themes31.IconButton, {
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes31.IconButton, {
         type: "submit",
         disabled: isDisabled,
-        children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_icons5.ArrowUpIcon, {})
+        children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_icons5.ArrowUpIcon, {})
     });
 };
 // src/components/threads/Thread/MessageForm/Root/index.tsx
 var import_react_query5 = require("@tanstack/react-query");
-var import_react30 = require("react");
+var import_react32 = require("react");
 var import_react_hook_form = require("react-hook-form");
 var import_themes32 = require("@radix-ui/themes");
 // src/hooks/messages/useCreateMessage/index.ts
@@ -2282,8 +2315,8 @@ var formOptions = {
     resolver: (0, import_zod2.zodResolver)(schema)
 };
 // src/components/threads/Thread/MessageForm/Root/index.tsx
-var import_jsx_runtime40 = require("react/jsx-runtime");
-var Root2 = function(param) {
+var import_jsx_runtime41 = require("react/jsx-runtime");
+var Root3 = function(param) {
     var children = param.children;
     var formProps = (0, import_react_hook_form.useForm)(formOptions);
     var handleSubmit = formProps.handleSubmit, isSubmitting = formProps.formState.isSubmitting, reset = formProps.reset;
@@ -2314,7 +2347,7 @@ var Root2 = function(param) {
         }
     }).createMessage;
     var isMutatingMessage = useIsMutatingMessage();
-    var isLoading = (0, import_react30.useMemo)(function() {
+    var isLoading = (0, import_react32.useMemo)(function() {
         return isMutatingMessage || isSubmitting;
     }, [
         isMutatingMessage,
@@ -2346,7 +2379,7 @@ var Root2 = function(param) {
         };
     }();
     var latestMessage = useLatestMessage().latestMessage;
-    var isDisabled = (0, import_react30.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;
@@ -2354,16 +2387,16 @@ var Root2 = function(param) {
         latestMessage,
         isLoading
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(MessageFormContext.Provider, {
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(MessageFormContext.Provider, {
         value: {
             isDisabled: isDisabled,
             isLoading: isLoading
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_hook_form.FormProvider, _object_spread_props(_object_spread({}, formProps), {
-            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes32.Box, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_hook_form.FormProvider, _object_spread_props(_object_spread({}, formProps), {
+            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes32.Box, {
                 asChild: true,
                 flexShrink: "0",
-                children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("form", {
+                children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("form", {
                     onSubmit: handleSubmit(onSubmit),
                     children: children
                 })
@@ -2373,19 +2406,19 @@ var Root2 = function(param) {
 };
 // src/components/threads/Thread/MessageForm/Field/index.tsx
 var import_react_use = require("react-use");
-var import_react32 = require("react");
+var import_react34 = require("react");
 // src/components/textareas/TextareaBase/index.tsx
-var import_react31 = require("react");
+var import_react33 = require("react");
 var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"), 1);
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var UPSCALE_RATIO = 16 / 14;
-var TextareaBase = (0, import_react31.forwardRef)(function TextareaBase2(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, {
+var TextareaBase = (0, import_react33.forwardRef)(function TextareaBase2(props, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("style", {
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("style", {
                 children: ".superinterface-textarea { min-height: inherit; height: 30px; }\n.superinterface-textarea::placeholder { color: var(--gray-a10); }"
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_textarea_autosize.default, _object_spread({
+            /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react_textarea_autosize.default, _object_spread({
                 ref: ref,
                 className: "rt-reset superinterface-textarea",
                 style: {
@@ -2410,20 +2443,20 @@ var TextareaBase = (0, import_react31.forwardRef)(function TextareaBase2(props,
 // src/components/threads/Thread/MessageForm/Field/index.tsx
 var import_react_hook_form2 = require("react-hook-form");
 var import_themes33 = require("@radix-ui/themes");
-var import_jsx_runtime42 = require("react/jsx-runtime");
-var Root3 = function(param) {
+var import_jsx_runtime43 = require("react/jsx-runtime");
+var Root4 = function(param) {
     var children = param.children;
     var _ref = (0, import_react_hook_form2.useFormContext)(), errors = _ref.formState.errors;
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Container, {
+    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Container, {
         size: "2",
         flexGrow: "0",
-        children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Flex, {
             direction: "column",
             flexShrink: "0",
-            children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Flex, {
                 direction: "column",
                 flexShrink: "0",
-                children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Flex, {
                     style: _object_spread({
                         borderRadius: "var(--radius-2)",
                         borderWidth: "1px",
@@ -2441,19 +2474,19 @@ var Root3 = function(param) {
     });
 };
 var Control = function() {
-    var assistantNameContext = (0, import_react32.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_react32.useMemo)(function() {
+    var isSubmitDisabled = (0, import_react34.useMemo)(function() {
         return isDisabled || isLoading;
     }, [
         isDisabled,
         isLoading
     ]);
     var isDisabledPrevious = (0, import_react_use.usePrevious)(isDisabled);
-    var textareaRef = (0, import_react32.useRef)(null);
+    var textareaRef = (0, import_react34.useRef)(null);
     var textareaProps = register("content");
-    (0, import_react32.useEffect)(function() {
+    (0, import_react34.useEffect)(function() {
         if (isDisabled) return;
         if (!isDisabledPrevious) return;
         if (!textareaRef.current) return;
@@ -2463,7 +2496,7 @@ var Control = function() {
         isDisabledPrevious,
         textareaProps
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(TextareaBase, _object_spread_props(_object_spread({
+    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(TextareaBase, _object_spread_props(_object_spread({
         minRows: 1,
         placeholder: "Message ".concat(assistantNameContext, "..."),
         disabled: isDisabled,
@@ -2483,36 +2516,36 @@ var Control = function() {
     }));
 };
 var Field = {
-    Root: Root3,
+    Root: Root4,
     Control: Control
 };
 // src/components/threads/Thread/MessageForm/index.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 var MessageForm = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Root2, {
-        children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Field.Root, {
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Root3, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Field.Root, {
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes34.Text, {
+                /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_themes34.Text, {
                     size: "2",
                     style: {
                         flexGrow: 1
                     },
-                    children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes34.Flex, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_themes34.Flex, {
                         flexGrow: "1",
                         direction: "column",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Field.Control, {})
+                        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Field.Control, {})
                     })
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes34.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_themes34.Flex, {
                     flexShrink: "0",
                     align: "end",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Submit, {})
+                    children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Submit, {})
                 })
             ]
         })
     });
 };
-MessageForm.Root = Root2;
+MessageForm.Root = Root3;
 MessageForm.Field = Field;
 MessageForm.Submit = Submit;
 // src/components/threads/Thread/Root/index.tsx
@@ -2520,13 +2553,13 @@ var import_themes35 = require("@radix-ui/themes");
 // src/components/threads/Thread/Provider/index.tsx
 var Provider2 = SuperinterfaceProvider;
 // src/components/threads/Thread/Root/index.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
-var Root4 = function(_param) {
+var import_jsx_runtime45 = require("react/jsx-runtime");
+var Root5 = function(_param) {
     var children = _param.children, rest = _object_without_properties(_param, [
         "children"
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Provider2, _object_spread_props(_object_spread({}, rest), {
-        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_themes35.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Provider2, _object_spread_props(_object_spread({}, rest), {
+        children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_themes35.Flex, {
             direction: "column",
             flexGrow: "1",
             children: children
@@ -2534,43 +2567,43 @@ var Root4 = function(_param) {
     }));
 };
 // src/components/threads/Thread/index.tsx
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 var Thread = function(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(Root4, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Root5, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Messages, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(MessageForm, {})
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Messages, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(MessageForm, {})
         ]
     }));
 };
-Thread.Root = Root4;
+Thread.Root = Root5;
 Thread.Messages = Messages;
 Thread.MessageForm = MessageForm;
 // src/hooks/messages/useMessageContext/index.ts
-var import_react33 = require("react");
+var import_react35 = require("react");
 var useMessageContext = function() {
-    return (0, import_react33.useContext)(MessageContext);
+    return (0, import_react35.useContext)(MessageContext);
 };
 // src/components/threads/ThreadDialog/Provider/index.tsx
-var import_react36 = require("react");
+var import_react38 = require("react");
 // src/contexts/threads/ThreadDialogContext/index.ts
-var import_react34 = require("react");
-var ThreadDialogContext = (0, import_react34.createContext)({
+var import_react36 = require("react");
+var ThreadDialogContext = (0, import_react36.createContext)({
     isOpen: false,
     setIsOpen: function() {}
 });
 // src/hooks/threads/useThreadDialogContext/index.ts
-var import_react35 = require("react");
+var import_react37 = require("react");
 var useThreadDialogContext = function() {
-    return (0, import_react35.useContext)(ThreadDialogContext);
+    return (0, import_react37.useContext)(ThreadDialogContext);
 };
 // src/components/threads/ThreadDialog/Provider/index.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+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_react36.useState)(threadDialogContext.isOpen), 2), isOpen = _ref[0], setIsOpen = _ref[1];
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ThreadDialogContext.Provider, {
+    var _ref = _sliced_to_array((0, import_react38.useState)(threadDialogContext.isOpen), 2), isOpen = _ref[0], setIsOpen = _ref[1];
+    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ThreadDialogContext.Provider, {
         value: {
             isOpen: isOpen,
             setIsOpen: setIsOpen
@@ -2579,31 +2612,31 @@ var Provider3 = function(param) {
     });
 };
 // src/components/toasts/ToastsProvider/index.tsx
-var import_react37 = require("react");
+var import_react39 = require("react");
 var Toast2 = __toESM(require("@radix-ui/react-toast"), 1);
 // src/components/toasts/ToastsProvider/CustomToast.tsx
 var Toast = __toESM(require("@radix-ui/react-toast"), 1);
 var import_themes36 = require("@radix-ui/themes");
 var import_react_icons6 = require("@radix-ui/react-icons");
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var CustomToast = function(param) {
     var toast = param.toast;
-    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Toast.Root, {
-        children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes36.Card, {
-            children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Toast.Title, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_themes36.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Toast.Root, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes36.Card, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Toast.Title, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_themes36.Flex, {
                     children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes36.Flex, {
+                        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes36.Flex, {
                             pr: "2",
                             height: "14px",
                             align: "center",
-                            children: toast.type === "success" ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react_icons6.CheckCircledIcon, {
+                            children: toast.type === "success" ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_react_icons6.CheckCircledIcon, {
                                 color: "var(--accent-9)"
-                            }) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react_icons6.CrossCircledIcon, {
+                            }) : /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_react_icons6.CrossCircledIcon, {
                                 color: "var(--red-9)"
                             })
                         }),
-                        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes36.Text, {
+                        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes36.Text, {
                             weight: "medium",
                             size: "1",
                             children: toast.message
@@ -2615,31 +2648,31 @@ var CustomToast = function(param) {
     });
 };
 // src/components/toasts/ToastsProvider/index.tsx
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var ToastsProvider = function(param) {
     var children = param.children;
-    var _ref = _sliced_to_array((0, import_react37.useState)([]), 2), toasts = _ref[0], setToasts = _ref[1];
-    var addToast = (0, import_react37.useCallback)(function(toast) {
+    var _ref = _sliced_to_array((0, import_react39.useState)([]), 2), toasts = _ref[0], setToasts = _ref[1];
+    var addToast = (0, import_react39.useCallback)(function(toast) {
         return setToasts(function(prevToasts) {
             return _to_consumable_array(prevToasts).concat([
                 toast
             ]);
         });
     }, []);
-    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(ToastsContext.Provider, {
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ToastsContext.Provider, {
         value: {
             toasts: toasts,
             addToast: addToast
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(Toast2.Provider, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(Toast2.Provider, {
             children: [
                 children,
                 Array.from(toasts).map(function(toast, index) {
-                    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(CustomToast, {
+                    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(CustomToast, {
                         toast: toast
                     }, index);
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Toast2.Viewport, {
+                /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Toast2.Viewport, {
                     style: {
                         position: "absolute",
                         bottom: 0,
@@ -2661,22 +2694,22 @@ var ToastsProvider = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Root/index.tsx
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var Root6 = function(param) {
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var Root7 = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ToastsProvider, {
-        children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Provider3, {
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(ToastsProvider, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Provider3, {
             children: children
         })
     });
 };
 // src/components/threads/ThreadDialog/Trigger/index.tsx
 var import_themes37 = require("@radix-ui/themes");
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var Trigger = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes37.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes37.Flex, {
         display: {
             initial: isOpen ? "none" : "flex",
             sm: "flex"
@@ -2702,12 +2735,12 @@ var Trigger = function(param) {
 // src/components/threads/ThreadDialog/Button/index.tsx
 var import_themes38 = require("@radix-ui/themes");
 var import_react_icons7 = require("@radix-ui/react-icons");
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var Button2 = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes38.IconButton, {
+    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes38.IconButton, {
         size: "4",
         radius: "full",
-        children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_react_icons7.ChatBubbleIcon, {})
+        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react_icons7.ChatBubbleIcon, {})
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
@@ -2715,10 +2748,10 @@ var import_themes40 = require("@radix-ui/themes");
 // src/components/threads/ThreadDialog/Close/index.tsx
 var import_react_icons8 = require("@radix-ui/react-icons");
 var import_themes39 = require("@radix-ui/themes");
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var Close = function() {
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes39.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes39.Flex, {
         display: {
             initial: isOpen ? "flex" : "none",
             sm: "none"
@@ -2738,20 +2771,20 @@ var Close = function() {
         style: {
             zIndex: 9999999999
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes39.IconButton, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes39.IconButton, {
             size: "2",
             variant: "soft",
-            children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react_icons8.Cross1Icon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_icons8.Cross1Icon, {})
         })
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
-var import_jsx_runtime53 = require("react/jsx-runtime");
-var Root7 = function(param) {
+var import_jsx_runtime54 = require("react/jsx-runtime");
+var Root8 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var isOpen = useThreadDialogContext().isOpen;
     if (!isOpen) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes40.Flex, {
         direction: "column",
         justify: "end",
         position: "fixed",
@@ -2779,7 +2812,7 @@ var Root7 = function(param) {
         style: _object_spread({
             zIndex: 9999999999
         }, style),
-        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_themes40.Card, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_themes40.Card, {
             mb: {
                 initial: void 0,
                 sm: "3"
@@ -2790,7 +2823,7 @@ var Root7 = function(param) {
                 flexGrow: 1
             },
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Inset, {
+                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes40.Inset, {
                     clip: "padding-box",
                     side: "all",
                     pb: "current",
@@ -2800,50 +2833,50 @@ var Root7 = function(param) {
                     },
                     children: children
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Close, {})
+                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Close, {})
             ]
         })
     });
 };
 var Content4 = function(param) {
     var _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Root7, {
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Root8, {
         style: style,
-        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Thread.Root, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Thread.Root, {
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Thread.Messages, {
+                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Thread.Messages, {
                     style: {
                         paddingTop: "var(--space-5)",
                         paddingRight: "var(--space-5)",
                         paddingLeft: "var(--space-5)"
                     }
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes40.Flex, {
                     direction: "column",
                     pl: "5",
                     pr: "5",
                     pb: "3",
                     flexShrink: "0",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Thread.MessageForm, {})
+                    children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Thread.MessageForm, {})
                 })
             ]
         })
     });
 };
-Content4.Root = Root7;
+Content4.Root = Root8;
 // src/components/threads/ThreadDialog/index.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var ThreadDialog = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Root6, {
+    return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(Root7, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Content4, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Trigger, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Button2, {})
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Content4, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Trigger, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Button2, {})
             })
         ]
     });
 };
-ThreadDialog.Root = Root6;
+ThreadDialog.Root = Root7;
 ThreadDialog.Trigger = Trigger;
 ThreadDialog.Button = Button2;
 ThreadDialog.Content = Content4;
@@ -2851,8 +2884,8 @@ ThreadDialog.Content = Content4;
 var import_runtime = require("regenerator-runtime/runtime");
 var import_themes41 = require("@radix-ui/themes");
 // src/contexts/threads/AudioThreadContext/index.ts
-var import_react38 = require("react");
-var AudioThreadContext = (0, import_react38.createContext)({
+var import_react40 = require("react");
+var AudioThreadContext = (0, import_react40.createContext)({
     status: "idle",
     recorderProps: {
         status: "idle",
@@ -2920,11 +2953,11 @@ var blobToData = function(blob) {
     });
 };
 // src/hooks/audioThreads/useStatus/index.ts
-var import_react39 = require("react");
+var import_react41 = require("react");
 var useStatus = function(param) {
     var messageAudioProps = param.messageAudioProps, recorderProps = param.recorderProps, createMessageProps = param.createMessageProps;
     var latestMessageProps = useLatestMessage();
-    var status = (0, import_react39.useMemo)(function() {
+    var status = (0, import_react41.useMemo)(function() {
         var _latestMessageProps_latestMessage;
         if (recorderProps.status === "recording") return "recording";
         if (createMessageProps.isPending) return "creatingMessage";
@@ -2948,19 +2981,19 @@ var useStatus = function(param) {
 // src/hooks/audioThreads/useRecorder/index.ts
 var import_dayjs2 = __toESM(require("dayjs"), 1);
 var import_use_audio_capture = require("use-audio-capture");
-var import_react40 = require("react");
+var import_react42 = require("react");
 var import_react_use_audio_player = require("react-use-audio-player");
 var import_react_use2 = require("react-use");
 var useRecorder = function(param) {
     var isStopOnSilence = param.isStopOnSilence, onStart = param.onStart, onStop = param.onStop;
-    var _ref = _sliced_to_array((0, import_react40.useState)(null), 2), silenceStart = _ref[0], setSilenceStart = _ref[1];
-    var _ref1 = _sliced_to_array((0, import_react40.useState)(null), 2), noiseStart = _ref1[0], setNoiseStart = _ref1[1];
-    var _ref2 = _sliced_to_array((0, import_react40.useState)(null), 2), mediaStream = _ref2[0], setMediaStream = _ref2[1];
-    var _ref3 = _sliced_to_array((0, import_react40.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_react40.useState)(false), 2), isLoaded = _ref4[0], setIsLoaded = _ref4[1];
-    (0, import_react40.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);
     }, [
@@ -3018,9 +3051,9 @@ var useRecorder = function(param) {
             setNoiseStart(null);
         }
     });
-    var _ref5 = _sliced_to_array((0, import_react40.useState)(null), 2), audioEngine = _ref5[0], setAudioEngine = _ref5[1];
-    var isInited = (0, import_react40.useRef)(false);
-    (0, import_react40.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;
@@ -3033,7 +3066,7 @@ var useRecorder = function(param) {
         isInited,
         mediaStream
     ]);
-    var visualizationAnalyser = (0, import_react40.useMemo)(function() {
+    var visualizationAnalyser = (0, import_react42.useMemo)(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         audioEngine.source.connect(result);
@@ -3041,7 +3074,7 @@ var useRecorder = function(param) {
     }, [
         audioEngine
     ]);
-    var silenceAnalyser = (0, import_react40.useMemo)(function() {
+    var silenceAnalyser = (0, import_react42.useMemo)(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         result.minDecibels = -60;
@@ -3050,7 +3083,7 @@ var useRecorder = function(param) {
     }, [
         audioEngine
     ]);
-    var handleSilence = (0, import_react40.useCallback)(function() {
+    var handleSilence = (0, import_react42.useCallback)(function() {
         if (!silenceAnalyser) return;
         var frequencyData = new Uint8Array(silenceAnalyser.frequencyBinCount);
         silenceAnalyser.getByteFrequencyData(frequencyData);
@@ -3073,7 +3106,7 @@ var useRecorder = function(param) {
         setNoiseStart,
         setSilenceStart
     ]);
-    (0, import_react40.useEffect)(function() {
+    (0, import_react42.useEffect)(function() {
         if (!isStopOnSilence) return;
         requestAnimationFrame(function() {
             return handleSilence();
@@ -3096,7 +3129,7 @@ var useRecorder = function(param) {
     });
 };
 // src/hooks/audioThreads/useMessageAudio/index.ts
-var import_react41 = require("react");
+var import_react43 = require("react");
 var import_compromise = __toESM(require("compromise"), 1);
 var import_howler = require("howler");
 var import_react_use_audio_player2 = require("react-use-audio-player");
@@ -3134,15 +3167,15 @@ var getMessageSentences = function(param) {
 };
 var useMessageAudio = function(param) {
     var onEnd = param.onEnd;
-    var _ref = _sliced_to_array((0, import_react41.useState)(false), 2), isAudioPlayed = _ref[0], setIsAudioPlayed = _ref[1];
-    var _ref1 = _sliced_to_array((0, import_react41.useState)([]), 2), stoppedMessageIds = _ref1[0], setStoppedMessageIds = _ref1[1];
-    var _ref2 = _sliced_to_array((0, import_react41.useState)([]), 2), playedMessageSentences = _ref2[0], setPlayedMessageSentences = _ref2[1];
+    var _ref = _sliced_to_array((0, import_react43.useState)(false), 2), isAudioPlayed = _ref[0], setIsAudioPlayed = _ref[1];
+    var _ref1 = _sliced_to_array((0, import_react43.useState)([]), 2), stoppedMessageIds = _ref1[0], setStoppedMessageIds = _ref1[1];
+    var _ref2 = _sliced_to_array((0, import_react43.useState)([]), 2), playedMessageSentences = _ref2[0], setPlayedMessageSentences = _ref2[1];
     var audioPlayer = (0, import_react_use_audio_player2.useAudioPlayer)();
     var nextAudioPlayer = (0, import_react_use_audio_player2.useAudioPlayer)();
     var superinterfaceContext = useSuperinterfaceContext();
-    var _ref3 = _sliced_to_array((0, import_react41.useState)(false), 2), isPlaying = _ref3[0], setIsPlaying = _ref3[1];
+    var _ref3 = _sliced_to_array((0, import_react43.useState)(false), 2), isPlaying = _ref3[0], setIsPlaying = _ref3[1];
     var latestMessageProps = useLatestMessage();
-    var unplayedMessageSentences = (0, import_react41.useMemo)(function() {
+    var unplayedMessageSentences = (0, import_react43.useMemo)(function() {
         if (!latestMessageProps.latestMessage) return [];
         if (latestMessageProps.latestMessage.role !== "assistant") return [];
         if (stoppedMessageIds.includes(latestMessageProps.latestMessage.id)) return [];
@@ -3163,7 +3196,7 @@ var useMessageAudio = function(param) {
         latestMessageProps,
         playedMessageSentences
     ]);
-    (0, import_react41.useEffect)(function() {
+    (0, import_react43.useEffect)(function() {
         if (isPlaying) return;
         if (audioPlayer.playing) return;
         if (!latestMessageProps.latestMessage) return;
@@ -3231,7 +3264,7 @@ var useMessageAudio = function(param) {
         playedMessageSentences,
         onEnd
     ]);
-    (0, import_react41.useEffect)(function() {
+    (0, import_react43.useEffect)(function() {
         if (isHtmlAudioSupported) {
             var _import_howler_Howler__howls___sounds_, _import_howler_Howler__howls_, _import_howler_Howler;
             if (!((_import_howler_Howler = import_howler.Howler) === null || _import_howler_Howler === void 0 ? void 0 : (_import_howler_Howler__howls_ = _import_howler_Howler._howls[0]) === null || _import_howler_Howler__howls_ === void 0 ? void 0 : (_import_howler_Howler__howls___sounds_ = _import_howler_Howler__howls_._sounds[0]) === null || _import_howler_Howler__howls___sounds_ === void 0 ? void 0 : _import_howler_Howler__howls___sounds_._node)) return;
@@ -3240,9 +3273,9 @@ var useMessageAudio = function(param) {
     }, [
         audioPlayer
     ]);
-    var _ref4 = _sliced_to_array((0, import_react41.useState)(null), 2), audioEngine = _ref4[0], setAudioEngine = _ref4[1];
-    var isAudioEngineInited = (0, import_react41.useRef)(false);
-    (0, import_react41.useEffect)(function() {
+    var _ref4 = _sliced_to_array((0, import_react43.useState)(null), 2), audioEngine = _ref4[0], setAudioEngine = _ref4[1];
+    var isAudioEngineInited = (0, import_react43.useRef)(false);
+    (0, import_react43.useEffect)(function() {
         if (!audioPlayer.playing) return;
         if (isAudioEngineInited.current) return;
         isAudioEngineInited.current = true;
@@ -3263,7 +3296,7 @@ var useMessageAudio = function(param) {
         audioPlayer,
         isAudioEngineInited
     ]);
-    var visualizationAnalyser = (0, import_react41.useMemo)(function() {
+    var visualizationAnalyser = (0, import_react43.useMemo)(function() {
         if (!audioEngine) return null;
         var result = audioEngine.audioContext.createAnalyser();
         audioEngine.source.connect(audioEngine.audioContext.destination);
@@ -3272,7 +3305,7 @@ var useMessageAudio = function(param) {
     }, [
         audioEngine
     ]);
-    var isPending = (0, import_react41.useMemo)(function() {
+    var isPending = (0, import_react43.useMemo)(function() {
         return isPlaying || unplayedMessageSentences.length > 0;
     }, [
         isPlaying,
@@ -3286,8 +3319,8 @@ var useMessageAudio = function(param) {
     });
 };
 // src/components/threads/AudioThread/Root/index.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
-var Root8 = function(param) {
+var import_jsx_runtime56 = require("react/jsx-runtime");
+var Root9 = function(param) {
     var children = param.children;
     var createMessageProps = useCreateMessage();
     var recorderProps = useRecorder({
@@ -3344,13 +3377,13 @@ var Root8 = function(param) {
         createMessageProps: createMessageProps,
         messageAudioProps: messageAudioProps
     }).status;
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(AudioThreadContext.Provider, {
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(AudioThreadContext.Provider, {
         value: {
             status: status,
             recorderProps: recorderProps,
             messageAudioProps: messageAudioProps
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes41.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Flex, {
             direction: "column",
             flexGrow: "1",
             p: "9",
@@ -3359,25 +3392,25 @@ var Root8 = function(param) {
     });
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-var import_react44 = require("react");
+var import_react46 = require("react");
 var import_lodash9 = __toESM(require("lodash"), 1);
 var import_themes43 = require("@radix-ui/themes");
 // src/hooks/threads/useAudioThreadContext/index.ts
-var import_react42 = require("react");
+var import_react44 = require("react");
 var useAudioThreadContext = function() {
-    return (0, import_react42.useContext)(AudioThreadContext);
+    return (0, import_react44.useContext)(AudioThreadContext);
 };
 // src/components/threads/AudioThread/BarsVisualizer/index.tsx
 var import_lodash8 = __toESM(require("lodash"), 1);
 var import_themes42 = require("@radix-ui/themes");
-var import_react43 = require("react");
+var import_react45 = require("react");
 var import_radash12 = require("radash");
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 var barCount = 4;
 var BarsVisualizer = function(param) {
     var visualizationAnalyser = param.visualizationAnalyser, backgroundColor = param.backgroundColor, height = param.height, barWidth = param.barWidth;
-    var _ref = _sliced_to_array((0, import_react43.useState)([]), 2), barHeights = _ref[0], setBarHeights = _ref[1];
-    var draw = (0, import_react43.useCallback)(function(param) {
+    var _ref = _sliced_to_array((0, import_react45.useState)([]), 2), barHeights = _ref[0], setBarHeights = _ref[1];
+    var draw = (0, import_react45.useCallback)(function(param) {
         var visualizationAnalyser2 = param.visualizationAnalyser;
         if (!visualizationAnalyser2) {
             setBarHeights(Array(barCount).fill(0));
@@ -3395,7 +3428,7 @@ var BarsVisualizer = function(param) {
             });
         });
     }, []);
-    (0, import_react43.useEffect)(function() {
+    (0, import_react45.useEffect)(function() {
         draw({
             visualizationAnalyser: visualizationAnalyser
         });
@@ -3403,7 +3436,7 @@ var BarsVisualizer = function(param) {
         draw,
         visualizationAnalyser
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Grid, {
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes42.Grid, {
         columns: "".concat(barCount),
         gap: "1",
         width: "auto",
@@ -3412,12 +3445,12 @@ var BarsVisualizer = function(param) {
             gridTemplateColumns: "repeat(4, minmax(0, 1fr))"
         },
         children: barHeights.map(function(barHeight, index) {
-            return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Flex, {
+            return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes42.Flex, {
                 direction: "column",
                 align: "center",
                 justify: "center",
                 height: height,
-                children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Flex, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes42.Flex, {
                     minHeight: "50%",
                     maxHeight: "100%",
                     height: "".concat(barHeight + 20, "%"),
@@ -3432,12 +3465,12 @@ var BarsVisualizer = function(param) {
     });
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var Visualization = function() {
     var audioThreadContext = useAudioThreadContext();
-    var assistantNameContext = (0, import_react44.useContext)(AssistantNameContext);
-    var _ref = _sliced_to_array((0, import_react44.useState)(0), 2), scale = _ref[0], setScale = _ref[1];
-    var draw = (0, import_react44.useCallback)(function(param) {
+    var assistantNameContext = (0, import_react46.useContext)(AssistantNameContext);
+    var _ref = _sliced_to_array((0, import_react46.useState)(0), 2), scale = _ref[0], setScale = _ref[1];
+    var draw = (0, import_react46.useCallback)(function(param) {
         var visualizationAnalyser = param.visualizationAnalyser;
         if (!visualizationAnalyser) {
             setScale(1);
@@ -3452,7 +3485,7 @@ var Visualization = function() {
             });
         });
     }, []);
-    (0, import_react44.useEffect)(function() {
+    (0, import_react46.useEffect)(function() {
         draw({
             visualizationAnalyser: audioThreadContext.recorderProps.visualizationAnalyser
         });
@@ -3460,14 +3493,14 @@ var Visualization = function() {
         draw,
         audioThreadContext
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes43.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_themes43.Flex, {
         direction: "column",
         align: "center",
         justify: "center",
         mb: "3",
         flexGrow: "1",
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes43.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.Flex, {
                 align: "center",
                 justify: "center",
                 height: "200px",
@@ -3477,20 +3510,20 @@ var Visualization = function() {
                     borderRadius: "9999px",
                     scale: scale
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(BarsVisualizer, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(BarsVisualizer, {
                     visualizationAnalyser: audioThreadContext.messageAudioProps.visualizationAnalyser,
                     backgroundColor: audioThreadContext.status === "playing" ? "var(--accent-11)" : "var(--gray-11)",
                     height: "40px",
                     barWidth: "24px"
                 })
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_themes43.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_themes43.Flex, {
                 ml: "-22.5px",
                 gap: "3",
                 pt: "5",
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(AssistantAvatar, {}),
-                    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Name, {
+                    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(AssistantAvatar, {}),
+                    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Name, {
                         children: assistantNameContext
                     })
                 ]
@@ -3500,7 +3533,7 @@ var Visualization = function() {
 };
 // src/components/threads/AudioThread/Status/StatusMessages.tsx
 var import_themes44 = require("@radix-ui/themes");
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 var html = function(param) {
     var texts = param.texts;
     return "\n  .status-messages-texts:after {\n    content: '".concat(texts[0], "';\n    animation: texts ").concat(texts.length * 5, "s linear infinite;\n  }\n\n  @keyframes texts {\n    ").concat(texts.map(function(_10, i) {
@@ -3509,17 +3542,17 @@ var html = function(param) {
 };
 var StatusMessages = function(param) {
     var texts = param.texts;
-    return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_themes44.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes44.Flex, {
         justify: "center",
         pb: "5",
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.Text, {
+            /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes44.Text, {
                 size: "2",
                 weight: "regular",
                 color: "gray",
                 className: "status-messages-texts"
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("style", {
+            /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("style", {
                 dangerouslySetInnerHTML: {
                     __html: html({
                         texts: texts
@@ -3530,11 +3563,11 @@ var StatusMessages = function(param) {
     });
 };
 // src/components/threads/AudioThread/Status/index.tsx
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 var Status = function() {
     var audioThreadContext = useAudioThreadContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(StatusMessages, {
+        return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(StatusMessages, {
             texts: [
                 "Start speaking",
                 "Listening",
@@ -3548,20 +3581,20 @@ var Status = function() {
         "idle",
         "playerPaused"
     ].includes(audioThreadContext.status)) {
-        return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(StatusMessages, {
+        return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(StatusMessages, {
             texts: [
                 "Click the button below to activate"
             ]
         });
     }
     if (audioThreadContext.status === "playing") {
-        return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(StatusMessages, {
+        return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(StatusMessages, {
             texts: [
                 "Click the button below to interrupt"
             ]
         });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(StatusMessages, {
+    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(StatusMessages, {
         texts: [
             "Thinking"
         ]
@@ -3570,9 +3603,9 @@ var Status = function() {
 // src/components/threads/AudioThread/Form/index.tsx
 var import_themes46 = require("@radix-ui/themes");
 // src/components/threads/AudioThread/Form/MicIcon.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 var MicIcon = function(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("svg", _object_spread_props(_object_spread({
+    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("svg", _object_spread_props(_object_spread({
         xmlns: "http://www.w3.org/2000/svg",
         fill: "currentColor",
         stroke: "currentColor",
@@ -3581,7 +3614,7 @@ var MicIcon = function(props) {
         height: "15",
         width: "15"
     }, props), {
-        children: /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("path", {
+        children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("path", {
             stroke: "none",
             d: "M192 0c-53 0-96 43-96 96v160c0 53 43 96 96 96s96-43 96-96V96c0-53-43-96-96-96zM64 216c0-13.3-10.7-24-24-24s-24 10.7-24 24v40c0 89.1 66.2 162.7 152 174.4V464h-48c-13.3 0-24 10.7-24 24s10.7 24 24 24h144c13.3 0 24-10.7 24-24s-10.7-24-24-24h-48v-33.6c85.8-11.7 152-85.3 152-174.4v-40c0-13.3-10.7-24-24-24s-24 10.7-24 24v40c0 70.7-57.3 128-128 128S64 326.7 64 256v-40z"
         })
@@ -3590,45 +3623,45 @@ var MicIcon = function(props) {
 // src/components/threads/AudioThread/Form/ActionButton/index.tsx
 var import_themes45 = require("@radix-ui/themes");
 var import_react_icons9 = require("@radix-ui/react-icons");
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 var ActionButton = function() {
     var audioThreadContext = useAudioThreadContext();
     var superinterfaceContext = useSuperinterfaceContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_themes45.Flex, {
+        return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes45.Flex, {
             align: "center",
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.Flex, {
                     mr: "3",
                     ml: "-7",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.IconButton, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.IconButton, {
                         onClick: audioThreadContext.recorderProps.pause,
                         color: "gray",
                         variant: "soft",
                         size: "1",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_react_icons9.PauseIcon, {})
+                        children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_icons9.PauseIcon, {})
                     })
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.IconButton, {
+                /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.IconButton, {
                     onClick: audioThreadContext.recorderProps.stop,
                     highContrast: true,
                     variant: "soft",
                     size: "4",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_react_icons9.ArrowUpIcon, {})
+                    children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_icons9.ArrowUpIcon, {})
                 })
             ]
         });
     }
     if (audioThreadContext.status === "recorderPaused") {
-        return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.IconButton, {
             onClick: audioThreadContext.recorderProps.resume,
             color: "red",
             size: "4",
-            children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_react_icons9.ResumeIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_icons9.ResumeIcon, {})
         });
     }
     if (audioThreadContext.status === "idle") {
-        return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.IconButton, {
             onClick: function() {
                 return audioThreadContext.recorderProps.start();
             },
@@ -3637,7 +3670,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "playing") {
-        return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.IconButton, {
             onClick: function() {
                 var _superinterfaceContext_createMessageAbortControllerRef_current;
                 audioThreadContext.messageAudioProps.stop();
@@ -3647,54 +3680,54 @@ var ActionButton = function() {
             size: "4",
             color: "gray",
             variant: "soft",
-            children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_react_icons9.StopIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_icons9.StopIcon, {})
         });
     }
     if (audioThreadContext.status === "playerPaused") {
-        return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.IconButton, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.play();
             },
             size: "4",
-            children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_react_icons9.ResumeIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_icons9.ResumeIcon, {})
         });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_themes45.IconButton, {
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.IconButton, {
         size: "4",
         variant: "soft",
         disabled: true
     });
 };
 // src/components/threads/AudioThread/Form/index.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 var Form = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes46.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_themes46.Flex, {
         direction: "column",
         align: "center",
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes46.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_themes46.Flex, {
                 pb: "3",
                 align: "center",
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes46.Flex, {
+                    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes46.Flex, {
                         ml: "-22.5px",
                         mr: "2",
                         align: "center",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(MicIcon, {
+                        children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(MicIcon, {
                             style: {
                                 color: audioThreadContext.status === "recording" ? "var(--accent-11)" : "var(--gray-11)"
                             }
                         })
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes46.Flex, {
+                    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes46.Flex, {
                         px: "2",
                         py: "1",
                         style: {
                             backgroundColor: audioThreadContext.status === "recording" ? "var(--accent-4)" : "var(--gray-4)",
                             borderRadius: "var(--radius-6)"
                         },
-                        children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(BarsVisualizer, {
+                        children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(BarsVisualizer, {
                             visualizationAnalyser: audioThreadContext.recorderProps.visualizationAnalyser,
                             backgroundColor: audioThreadContext.status === "recording" ? "var(--accent-11)" : "var(--gray-11)",
                             height: "20px",
@@ -3703,57 +3736,57 @@ var Form = function() {
                     })
                 ]
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ActionButton, {})
+            /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(ActionButton, {})
         ]
     });
 };
 // src/components/threads/AudioThread/index.tsx
-var import_jsx_runtime63 = require("react/jsx-runtime");
+var import_jsx_runtime64 = require("react/jsx-runtime");
 var AudioThread = function(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(Root8, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(Root9, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Visualization, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Status, {}),
-            /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(Form, {})
+            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Visualization, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Status, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Form, {})
         ]
     }));
 };
-AudioThread.Root = Root8;
+AudioThread.Root = Root9;
 AudioThread.Visualization = Visualization;
 AudioThread.Form = Form;
 // src/components/threads/AudioThreadDialog/index.tsx
-var import_jsx_runtime64 = require("react/jsx-runtime");
+var import_jsx_runtime65 = require("react/jsx-runtime");
 var AudioThreadDialog = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(Root6, {
+    return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(Root7, {
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Content4.Root, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(AudioThread, {})
+            /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Content4.Root, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(AudioThread, {})
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Trigger, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Button2, {})
+            /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Trigger, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(Button2, {})
             })
         ]
     });
 };
-AudioThreadDialog.Root = Root6;
+AudioThreadDialog.Root = Root7;
 AudioThreadDialog.Trigger = Trigger;
 AudioThreadDialog.Button = Button2;
 AudioThreadDialog.Content = Content4;
 // src/components/suggestions/Suggestions/index.tsx
-var import_react46 = require("react");
+var import_react48 = require("react");
 // src/components/suggestions/Suggestions/Content.tsx
-var import_react45 = require("react");
+var import_react47 = require("react");
 var import_radash13 = require("radash");
 var import_react_children_utilities = require("react-children-utilities");
 var import_themes48 = require("@radix-ui/themes");
 // src/components/suggestions/Suggestions/Item.tsx
 var import_react_icons10 = require("@radix-ui/react-icons");
 var import_themes47 = require("@radix-ui/themes");
-var import_jsx_runtime65 = require("react/jsx-runtime");
+var import_jsx_runtime66 = 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_runtime65.jsx)(Content5, {
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Content5, {
         onClick: function() {
             createMessage({
                 // @ts-ignore-next-line
@@ -3767,7 +3800,7 @@ var Item = function(param) {
 };
 var Content5 = function(param) {
     var onClick = param.onClick, isDisabled = param.isDisabled, isPending = param.isPending, children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(import_themes47.Button, {
+    return /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(import_themes47.Button, {
         variant: "soft",
         onClick: onClick,
         disabled: isDisabled,
@@ -3777,14 +3810,14 @@ var Content5 = function(param) {
             flexShrink: 1
         },
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_themes47.Text, {
+            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_themes47.Text, {
                 size: "1",
                 weight: "regular",
                 children: children
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_themes47.Spinner, {
+            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_themes47.Spinner, {
                 loading: isPending,
-                children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_react_icons10.ArrowUpIcon, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_react_icons10.ArrowUpIcon, {
                     style: {
                         flexShrink: 0
                     }
@@ -3795,11 +3828,11 @@ var Content5 = function(param) {
 };
 Item.Content = Content5;
 // src/components/suggestions/Suggestions/Content.tsx
-var import_jsx_runtime66 = require("react/jsx-runtime");
+var import_jsx_runtime67 = require("react/jsx-runtime");
 var Content6 = function(param) {
     var children = param.children;
     var isMutatingMessage = useIsMutatingMessage();
-    var suggestions = (0, import_react45.useMemo)(function() {
+    var suggestions = (0, import_react47.useMemo)(function() {
         return (0, import_react_children_utilities.onlyText)(children).split(/\r?\n/).filter(function(c) {
             return !(0, import_radash13.isEmpty)(c);
         }).map(function(c) {
@@ -3809,12 +3842,12 @@ var Content6 = function(param) {
         children
     ]);
     if ((0, import_radash13.isEmpty)(suggestions)) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_themes48.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(import_themes48.Flex, {
         gap: "2",
         py: "2",
         wrap: "wrap",
         children: suggestions.map(function(suggestion) {
-            return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Item, {
+            return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Item, {
                 suggestion: suggestion,
                 isDisabled: isMutatingMessage
             }, suggestion);
@@ -3822,11 +3855,11 @@ var Content6 = function(param) {
     });
 };
 // src/components/suggestions/Suggestions/index.tsx
-var import_jsx_runtime67 = require("react/jsx-runtime");
+var import_jsx_runtime68 = require("react/jsx-runtime");
 var Suggestions = function(param) {
     var children = param.children;
     var latestMessageProps = useLatestMessage();
-    var isDisabled = (0, import_react46.useMemo)(function() {
+    var isDisabled = (0, import_react48.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;
@@ -3835,26 +3868,51 @@ var Suggestions = function(param) {
     ]);
     if (latestMessageProps.isLoading) return null;
     if (isDisabled) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Content6, {
+    return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(Content6, {
         children: children
     });
 };
 Suggestions.Item = Item;
 // src/components/markdown/MarkdownProvider/index.tsx
-var import_react47 = require("react");
-var import_jsx_runtime68 = require("react/jsx-runtime");
+var import_react49 = require("react");
+var import_jsx_runtime69 = 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_react47.useMemo)(function() {
+    var value = (0, import_react49.useMemo)(function() {
         return merge(prevMarkdownContext, rest);
     }, [
         rest,
         prevMarkdownContext
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(MarkdownContext.Provider, {
+    return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(MarkdownContext.Provider, {
+        value: value,
+        children: children
+    });
+};
+// src/components/components/ComponentsProvider.tsx
+var import_react51 = require("react");
+// src/hooks/components/useComponents.ts
+var import_react50 = require("react");
+var useComponents = function() {
+    return (0, import_react50.useContext)(ComponentsContext);
+};
+// src/components/components/ComponentsProvider.tsx
+var import_jsx_runtime70 = require("react/jsx-runtime");
+var ComponentsProvider = function(_param) {
+    var children = _param.children, rest = _object_without_properties(_param, [
+        "children"
+    ]);
+    var prevComponents = useComponents();
+    var value = (0, import_react51.useMemo)(function() {
+        return merge(prevComponents, rest);
+    }, [
+        rest,
+        prevComponents
+    ]);
+    return /* @__PURE__ */ (0, import_jsx_runtime70.jsx)(ComponentsContext.Provider, {
         value: value,
         children: children
     });
@@ -3865,15 +3923,18 @@ var MarkdownProvider = function(_param) {
     AssistantNameContext: AssistantNameContext,
     AudioThread: AudioThread,
     AudioThreadDialog: AudioThreadDialog,
+    ComponentsProvider: ComponentsProvider,
     FunctionBase: FunctionBase,
     FunctionComponentsContext: FunctionComponentsContext,
     MarkdownContext: MarkdownContext,
     MarkdownProvider: MarkdownProvider,
+    RunStep: RunStep,
     Suggestions: Suggestions,
     SuperinterfaceProvider: SuperinterfaceProvider,
     Thread: Thread,
     ThreadDialog: ThreadDialog,
     ThreadDialogContext: ThreadDialogContext,
+    useComponents: useComponents,
     useCreateMessage: useCreateMessage,
     useLatestMessage: useLatestMessage,
     useMarkdownContext: useMarkdownContext,