@superinterface/react 3.21.1 → 3.23.0

package/dist/index.cjs

@@ -37683,6 +37683,9 @@ __export(index_exports, {
     MessageContent: function() {
         return MessageContent;
     },
+    MessageGroup: function() {
+        return MessageGroup;
+    },
     RunStep: function() {
         return RunStep;
     },
@@ -37947,20 +37950,19 @@ var import_react_compiler_runtime72 = require("react-compiler-runtime");
 var import_react_compiler_runtime62 = require("react-compiler-runtime");
 var import_themes46 = require("@radix-ui/themes");
 // src/components/threads/Thread/Message/index.tsx
-var import_react_compiler_runtime47 = require("react-compiler-runtime");
-var import_react31 = require("react");
-var import_themes32 = require("@radix-ui/themes");
+var import_react_compiler_runtime53 = require("react-compiler-runtime");
+var import_react38 = require("react");
+var import_themes40 = require("@radix-ui/themes");
 // src/components/runSteps/RunSteps/index.tsx
-var import_react_compiler_runtime16 = require("react-compiler-runtime");
-var import_themes9 = require("@radix-ui/themes");
-var import_react9 = require("react");
+var import_react_compiler_runtime49 = require("react-compiler-runtime");
+var import_themes38 = require("@radix-ui/themes");
+var import_react36 = require("react");
 // src/contexts/components/ComponentsContext/index.tsx
-var import_react8 = require("react");
+var import_react35 = require("react");
 // src/components/runSteps/RunStep/index.tsx
 var import_react_compiler_runtime11 = require("react-compiler-runtime");
 // src/components/runSteps/RunStep/ToolCalls/index.tsx
 var import_react_compiler_runtime10 = require("react-compiler-runtime");
-var import_react6 = require("react");
 var import_themes5 = require("@radix-ui/themes");
 // src/components/runSteps/RunStep/ToolCalls/ToolCall/index.tsx
 var import_react_compiler_runtime9 = require("react-compiler-runtime");
@@ -38376,6 +38378,11 @@ var ToolCall = function(t0) {
     }
     return t1;
 };
+// src/hooks/components/useComponents.ts
+var import_react6 = require("react");
+var useComponents = function() {
+    return (0, import_react6.useContext)(ComponentsContext);
+};
 // src/components/runSteps/RunStep/ToolCalls/index.tsx
 var import_jsx_runtime11 = require("react/jsx-runtime");
 var Root = function(t0) {
@@ -38400,17 +38407,17 @@ var Root = function(t0) {
 };
 var StartingToolCalls = function() {
     var $ = (0, import_react_compiler_runtime10.c)(2);
-    var componentsContext = (0, import_react6.useContext)(ComponentsContext);
-    var StartingToolCalls3 = componentsContext.components.StartingToolCalls;
-    var t0;
+    var _useComponents = useComponents(), t0 = _useComponents.components;
+    var StartingToolCalls3 = t0.StartingToolCalls;
+    var t1;
     if ($[0] !== StartingToolCalls3) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(StartingToolCalls3, {});
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(StartingToolCalls3, {});
         $[0] = StartingToolCalls3;
-        $[1] = t0;
+        $[1] = t1;
     } else {
-        t0 = $[1];
+        t1 = $[1];
     }
-    return t0;
+    return t1;
 };
 var ToolCalls = function(t0) {
     var $ = (0, import_react_compiler_runtime10.c)(12);
@@ -38766,116 +38773,12 @@ var StartingToolCalls2 = function() {
     }
     return t1;
 };
-// src/contexts/components/ComponentsContext/index.tsx
-var ComponentsContext = /* @__PURE__ */ (0, import_react8.createContext)({
-    components: {
-        RunStep: RunStep,
-        Function: Function2,
-        StartingToolCalls: StartingToolCalls2
-    }
-});
-// src/components/runSteps/RunSteps/index.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var RunSteps = function(t0) {
-    var $ = (0, import_react_compiler_runtime16.c)(7);
-    var runSteps = t0.runSteps;
-    var componentsContext = (0, import_react9.useContext)(ComponentsContext);
-    var Component2 = componentsContext.components.RunStep;
-    var t1;
-    if ($[0] !== Component2 || $[1] !== runSteps) {
-        var _t;
-        if ($[3] !== Component2) {
-            _t = function(runStep) {
-                return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Component2, {
-                    runStep: runStep
-                }, runStep.id);
-            };
-            $[3] = Component2;
-            $[4] = _t;
-        } else {
-            _t = $[4];
-        }
-        t1 = runSteps.map(_t);
-        $[0] = Component2;
-        $[1] = runSteps;
-        $[2] = t1;
-    } else {
-        t1 = $[2];
-    }
-    var t2;
-    if ($[5] !== t1) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_themes9.Flex, {
-            direction: "column-reverse",
-            children: t1
-        });
-        $[5] = t1;
-        $[6] = t2;
-    } else {
-        t2 = $[6];
-    }
-    return t2;
-};
-// src/contexts/messages/MessageContext/index.ts
-var import_react10 = require("react");
-var MessageContext = /* @__PURE__ */ (0, import_react10.createContext)({
-    message: null
-});
-// src/components/threads/Thread/Message/Provider.tsx
-var Provider = MessageContext.Provider;
-// src/components/threads/Thread/Message/Attachments/index.tsx
-var import_react_compiler_runtime17 = require("react-compiler-runtime");
-var import_themes10 = require("@radix-ui/themes");
-var import_react_icons3 = require("@radix-ui/react-icons");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var Attachments = function(t0) {
-    var _message$attachments;
-    var $ = (0, import_react_compiler_runtime17.c)(4);
-    var message = t0.message;
-    if (!((_message$attachments = message.attachments) !== null && _message$attachments !== void 0 && _message$attachments.length)) {
-        return null;
-    }
-    var t1;
-    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_icons3.FileIcon, {});
-        $[0] = t1;
-    } else {
-        t1 = $[0];
-    }
-    var t2 = message.attachments.length > 1 ? "s" : "";
-    var t3;
-    if ($[1] !== message.attachments.length || $[2] !== t2) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_themes10.Flex, {
-            align: "start",
-            pb: "1",
-            children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_themes10.Badge, {
-                color: "gray",
-                variant: "surface",
-                children: [
-                    t1,
-                    message.attachments.length,
-                    " file",
-                    t2
-                ]
-            })
-        });
-        $[1] = message.attachments.length;
-        $[2] = t2;
-        $[3] = t3;
-    } else {
-        t3 = $[3];
-    }
-    return t3;
-};
-// src/components/messages/MessageContent/index.tsx
-var import_react_compiler_runtime46 = require("react-compiler-runtime");
-// src/components/messages/MessageContent/ContentPart/index.tsx
-var import_react_compiler_runtime45 = require("react-compiler-runtime");
-// src/components/messages/MessageContent/ContentPart/TextContent.tsx
-var import_react_compiler_runtime43 = require("react-compiler-runtime");
-var import_react29 = __toESM(require("react"), 1);
-var import_themes31 = require("@radix-ui/themes");
+// src/components/contents/TextContent.tsx
+var import_react_compiler_runtime41 = require("react-compiler-runtime");
+var import_react26 = __toESM(require("react"), 1);
+var import_themes29 = require("@radix-ui/themes");
 var import_mdx = require("@mdx-js/mdx");
-var import_react30 = require("@mdx-js/react");
+var import_react27 = require("@mdx-js/react");
 var runtime = __toESM(require("react/jsx-runtime"), 1);
 // src/lib/recma/recmaFallbackComponentPlugin.ts
 var import_estree_util_visit = require("estree-util-visit");
@@ -39019,17 +38922,17 @@ var recmaFallbackComponentPlugin = function() {
     };
 };
 // src/hooks/markdown/useMarkdownContext/index.ts
-var import_react27 = require("react");
+var import_react24 = require("react");
 // src/contexts/markdown/MarkdownContext/index.ts
-var import_react26 = require("react");
+var import_react23 = require("react");
 // src/contexts/markdown/MarkdownContext/lib/components/index.tsx
-var import_themes30 = require("@radix-ui/themes");
+var import_themes28 = require("@radix-ui/themes");
 // src/contexts/markdown/MarkdownContext/lib/components/Paragraph.tsx
-var import_react_compiler_runtime18 = require("react-compiler-runtime");
-var import_themes11 = require("@radix-ui/themes");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_react_compiler_runtime16 = require("react-compiler-runtime");
+var import_themes9 = require("@radix-ui/themes");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var Paragraph = function(t0) {
-    var $ = (0, import_react_compiler_runtime18.c)(3);
+    var $ = (0, import_react_compiler_runtime16.c)(3);
     var children = t0.children;
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -39043,9 +38946,9 @@ var Paragraph = function(t0) {
     }
     var t2;
     if ($[1] !== children) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes11.Box, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_themes9.Box, {
             pb: "3",
-            children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes11.Text, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_themes9.Text, {
                 size: "3",
                 style: t1,
                 children: children
@@ -39059,16 +38962,16 @@ var Paragraph = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Link.tsx
-var import_react_compiler_runtime19 = require("react-compiler-runtime");
-var import_themes12 = require("@radix-ui/themes");
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_react_compiler_runtime17 = require("react-compiler-runtime");
+var import_themes10 = require("@radix-ui/themes");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var Link = function(t0) {
-    var $ = (0, import_react_compiler_runtime19.c)(5);
+    var $ = (0, import_react_compiler_runtime17.c)(5);
     var children = t0.children, href = t0.href, download = t0.download, t1 = t0.target;
     var target = t1 === void 0 ? "_blank" : t1;
     var t2;
     if ($[0] !== children || $[1] !== download || $[2] !== href || $[3] !== target) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes12.Link, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_themes10.Link, {
             href: href,
             target: target,
             download: download,
@@ -39085,11 +38988,11 @@ var Link = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/UnorderedList.tsx
-var import_react_compiler_runtime20 = require("react-compiler-runtime");
-var import_themes13 = require("@radix-ui/themes");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_react_compiler_runtime18 = require("react-compiler-runtime");
+var import_themes11 = require("@radix-ui/themes");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var UnorderedList = function(t0) {
-    var $ = (0, import_react_compiler_runtime20.c)(3);
+    var $ = (0, import_react_compiler_runtime18.c)(3);
     var children = t0.children;
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -39102,10 +39005,10 @@ var UnorderedList = function(t0) {
     }
     var t2;
     if ($[1] !== children) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_themes13.Box, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_themes11.Box, {
             pb: "3",
             asChild: true,
-            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("ul", {
+            children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("ul", {
                 style: t1,
                 children: children
             })
@@ -39118,11 +39021,11 @@ var UnorderedList = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/OrderedList.tsx
-var import_react_compiler_runtime21 = require("react-compiler-runtime");
-var import_themes14 = require("@radix-ui/themes");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_react_compiler_runtime19 = require("react-compiler-runtime");
+var import_themes12 = require("@radix-ui/themes");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var OrderedList = function(t0) {
-    var $ = (0, import_react_compiler_runtime21.c)(3);
+    var $ = (0, import_react_compiler_runtime19.c)(3);
     var children = t0.children;
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -39135,10 +39038,10 @@ var OrderedList = function(t0) {
     }
     var t2;
     if ($[1] !== children) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes14.Box, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_themes12.Box, {
             pb: "3",
             asChild: true,
-            children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("ol", {
+            children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("ol", {
                 style: t1,
                 children: children
             })
@@ -39151,11 +39054,11 @@ var OrderedList = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/ListItem.tsx
-var import_react_compiler_runtime22 = require("react-compiler-runtime");
-var import_themes15 = require("@radix-ui/themes");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_react_compiler_runtime20 = require("react-compiler-runtime");
+var import_themes13 = require("@radix-ui/themes");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var ListItem = function(t0) {
-    var $ = (0, import_react_compiler_runtime22.c)(3);
+    var $ = (0, import_react_compiler_runtime20.c)(3);
     var children = t0.children;
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -39168,9 +39071,9 @@ var ListItem = function(t0) {
     }
     var t2;
     if ($[1] !== children) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_themes15.Box, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_themes13.Box, {
             pb: "1",
-            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("li", {
+            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("li", {
                 style: t1,
                 children: children
             })
@@ -39183,15 +39086,15 @@ var ListItem = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Strong.tsx
-var import_react_compiler_runtime23 = require("react-compiler-runtime");
-var import_themes16 = require("@radix-ui/themes");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_react_compiler_runtime21 = require("react-compiler-runtime");
+var import_themes14 = require("@radix-ui/themes");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var Strong = function(t0) {
-    var $ = (0, import_react_compiler_runtime23.c)(2);
+    var $ = (0, import_react_compiler_runtime21.c)(2);
     var children = t0.children;
     var t1;
     if ($[0] !== children) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_themes16.Strong, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_themes14.Strong, {
             children: children
         });
         $[0] = children;
@@ -39202,11 +39105,11 @@ var Strong = function(t0) {
     return t1;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Pre.tsx
-var import_react_compiler_runtime24 = require("react-compiler-runtime");
-var import_themes17 = require("@radix-ui/themes");
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_react_compiler_runtime22 = require("react-compiler-runtime");
+var import_themes15 = require("@radix-ui/themes");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var Pre = function(t0) {
-    var $ = (0, import_react_compiler_runtime24.c)(3);
+    var $ = (0, import_react_compiler_runtime22.c)(3);
     var children = t0.children;
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -39220,7 +39123,7 @@ var Pre = function(t0) {
     }
     var t2;
     if ($[1] !== children) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_themes17.Box, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_themes15.Box, {
             style: t1,
             children: children
         });
@@ -39232,17 +39135,17 @@ var Pre = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Code.tsx
-var import_react_compiler_runtime30 = require("react-compiler-runtime");
-var import_themes20 = require("@radix-ui/themes");
+var import_react_compiler_runtime28 = require("react-compiler-runtime");
+var import_themes18 = require("@radix-ui/themes");
 // src/components/suggestions/Suggestions/index.tsx
-var import_react_compiler_runtime29 = require("react-compiler-runtime");
-var import_react18 = require("react");
+var import_react_compiler_runtime27 = require("react-compiler-runtime");
+var import_react15 = require("react");
 // src/hooks/messages/useLatestMessage/index.ts
-var import_react_compiler_runtime26 = require("react-compiler-runtime");
-var import_react12 = require("react");
+var import_react_compiler_runtime24 = require("react-compiler-runtime");
+var import_react9 = require("react");
 // src/hooks/messages/useMessages/index.tsx
-var import_react_compiler_runtime25 = require("react-compiler-runtime");
-var import_react11 = require("react");
+var import_react_compiler_runtime23 = require("react-compiler-runtime");
+var import_react8 = require("react");
 var import_react_query2 = require("@tanstack/react-query");
 // src/lib/threads/queryOptions/index.ts
 var import_react_query = require("@tanstack/react-query");
@@ -39515,7 +39418,7 @@ var messages = function(_ref) {
     }, []);
 };
 var useMessages = function() {
-    var $ = (0, import_react_compiler_runtime25.c)(9);
+    var $ = (0, import_react_compiler_runtime23.c)(9);
     var queryClient = (0, import_react_query2.useQueryClient)();
     var threadContext = useSuperinterfaceContext();
     var superinterfaceContext = useSuperinterfaceContext();
@@ -39604,7 +39507,7 @@ function _toPrimitive5(t, r) {
     return ("string" === r ? String : Number)(t);
 }
 var useLatestMessage = function() {
-    var $ = (0, import_react_compiler_runtime26.c)(3);
+    var $ = (0, import_react_compiler_runtime24.c)(3);
     var props = useMessages();
     var t0;
     var t1 = props.messages[0] || null;
@@ -39623,15 +39526,15 @@ var useLatestMessage = function() {
     return t0;
 };
 // src/components/suggestions/Suggestions/Content.tsx
-var import_react17 = require("react");
+var import_react14 = require("react");
 var import_radash10 = require("radash");
 var import_react_children_utilities = require("react-children-utilities");
 // src/hooks/messages/useIsMutatingMessage/index.ts
-var import_react_compiler_runtime27 = require("react-compiler-runtime");
-var import_react13 = require("react");
+var import_react_compiler_runtime25 = require("react-compiler-runtime");
+var import_react10 = require("react");
 var import_react_query3 = require("@tanstack/react-query");
 var useIsMutatingMessage = function() {
-    var $ = (0, import_react_compiler_runtime27.c)(2);
+    var $ = (0, import_react_compiler_runtime25.c)(2);
     var threadContext = useSuperinterfaceContext();
     var t0;
     if ($[0] !== threadContext.variables) {
@@ -39653,13 +39556,13 @@ var useIsMutatingMessage = function() {
     return isMutatingMessage;
 };
 // src/components/suggestions/Suggestions/Content.tsx
-var import_themes19 = require("@radix-ui/themes");
+var import_themes17 = require("@radix-ui/themes");
 // src/components/suggestions/Suggestions/Item.tsx
-var import_react_compiler_runtime28 = require("react-compiler-runtime");
-var import_react_icons4 = require("@radix-ui/react-icons");
-var import_themes18 = require("@radix-ui/themes");
+var import_react_compiler_runtime26 = require("react-compiler-runtime");
+var import_react_icons3 = require("@radix-ui/react-icons");
+var import_themes16 = require("@radix-ui/themes");
 // src/hooks/messages/useCreateMessage/index.ts
-var import_react14 = require("react");
+var import_react11 = require("react");
 var import_react_query4 = require("@tanstack/react-query");
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/onMutate/index.ts
 var import_radash3 = require("radash");
@@ -41056,7 +40959,7 @@ var useCreateMessage = function useCreateMessage2() {
         superinterfaceContext: superinterfaceContext,
         onError: onError
     }));
-    var createMessage = (0, import_react14.useCallback)(function(variables) {
+    var createMessage = (0, import_react11.useCallback)(function(variables) {
         return props.mutateAsync(_objectSpread18(_objectSpread18({}, threadContext.variables), variables));
     }, [
         props.mutateAsync,
@@ -41069,16 +40972,16 @@ var useCreateMessage = function useCreateMessage2() {
 // src/components/suggestions/Suggestions/Item.tsx
 var import_react_query5 = require("@tanstack/react-query");
 // src/hooks/toasts/useToasts/index.ts
-var import_react16 = require("react");
+var import_react13 = require("react");
 // src/contexts/toasts/ToastsContext/index.ts
-var import_react15 = require("react");
-var ToastsContext = /* @__PURE__ */ (0, import_react15.createContext)({
+var import_react12 = require("react");
+var ToastsContext = /* @__PURE__ */ (0, import_react12.createContext)({
     toasts: [],
     addToast: function() {}
 });
 // src/hooks/toasts/useToasts/index.ts
 var useToasts = function() {
-    return (0, import_react16.useContext)(ToastsContext);
+    return (0, import_react13.useContext)(ToastsContext);
 };
 // src/lib/errors/createMessageDefaultOnError.ts
 var createMessageDefaultOnError = function(_ref) {
@@ -41106,7 +41009,7 @@ var createMessageDefaultOnError = function(_ref) {
     };
 };
 // src/components/suggestions/Suggestions/Item.tsx
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function ownKeys19(e, r) {
     var t = Object.keys(e);
     if (Object.getOwnPropertySymbols) {
@@ -41151,7 +41054,7 @@ function _toPrimitive19(t, r) {
     return ("string" === r ? String : Number)(t);
 }
 var Item = function(t0) {
-    var $ = (0, import_react_compiler_runtime28.c)(16);
+    var $ = (0, import_react_compiler_runtime26.c)(16);
     var suggestion = t0.suggestion, isDisabled = t0.isDisabled, className = t0.className, style = t0.style;
     var addToast = useToasts().addToast;
     var queryClient = (0, import_react_query5.useQueryClient)();
@@ -41196,7 +41099,7 @@ var Item = function(t0) {
     }
     var t4;
     if ($[9] !== className || $[10] !== isDisabled || $[11] !== isPending || $[12] !== style || $[13] !== suggestion || $[14] !== t3) {
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Content3, {
+        t4 = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Content3, {
             onClick: t3,
             isDisabled: isDisabled,
             isPending: isPending,
@@ -41217,7 +41120,7 @@ var Item = function(t0) {
     return t4;
 };
 var Content3 = function(t0) {
-    var $ = (0, import_react_compiler_runtime28.c)(16);
+    var $ = (0, import_react_compiler_runtime26.c)(16);
     var onClick = t0.onClick, isDisabled = t0.isDisabled, isPending = t0.isPending, children = t0.children, className = t0.className, style = t0.style;
     var t1;
     if ($[0] !== style) {
@@ -41241,7 +41144,7 @@ var Content3 = function(t0) {
     }
     var t3;
     if ($[4] !== children) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_themes18.Text, {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_themes16.Text, {
             size: "1",
             weight: "regular",
             children: children
@@ -41253,7 +41156,7 @@ var Content3 = function(t0) {
     }
     var t4;
     if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_icons4.ArrowUpIcon, {
+        t4 = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_icons3.ArrowUpIcon, {
             style: {
                 flexShrink: 0
             }
@@ -41264,7 +41167,7 @@ var Content3 = function(t0) {
     }
     var t5;
     if ($[7] !== isPending) {
-        t5 = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_themes18.Spinner, {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_themes16.Spinner, {
             loading: isPending,
             children: t4
         });
@@ -41275,7 +41178,7 @@ var Content3 = function(t0) {
     }
     var t6;
     if ($[9] !== className || $[10] !== isDisabled || $[11] !== onClick || $[12] !== t2 || $[13] !== t3 || $[14] !== t5) {
-        t6 = /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_themes18.Button, {
+        t6 = /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_themes16.Button, {
             className: className,
             variant: "soft",
             onClick: onClick,
@@ -41300,11 +41203,11 @@ var Content3 = function(t0) {
 };
 Item.Content = Content3;
 // src/components/suggestions/Suggestions/Content.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var Content4 = function(_ref) {
     var children = _ref.children, className = _ref.className, style = _ref.style;
     var isMutatingMessage = useIsMutatingMessage();
-    var suggestions = (0, import_react17.useMemo)(function() {
+    var suggestions = (0, import_react14.useMemo)(function() {
         return (0, import_react_children_utilities.onlyText)(children).split(/\r?\n/).filter(function(c) {
             return !(0, import_radash10.isEmpty)(c);
         }).map(function(c_0) {
@@ -41314,14 +41217,14 @@ var Content4 = function(_ref) {
         children
     ]);
     if ((0, import_radash10.isEmpty)(suggestions)) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_themes19.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_themes17.Flex, {
         gap: "2",
         py: "2",
         wrap: "wrap",
         className: className,
         style: style,
         children: suggestions.map(function(suggestion) {
-            return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Item, {
+            return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Item, {
                 suggestion: suggestion,
                 isDisabled: isMutatingMessage
             }, suggestion);
@@ -41329,10 +41232,10 @@ var Content4 = function(_ref) {
     });
 };
 // src/components/suggestions/Suggestions/index.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var Suggestions = function(t0) {
     var _latestMessageProps$l;
-    var $ = (0, import_react_compiler_runtime29.c)(4);
+    var $ = (0, import_react_compiler_runtime27.c)(4);
     var children = t0.children, className = t0.className, style = t0.style;
     var latestMessageProps = useLatestMessage();
     var t1;
@@ -41346,7 +41249,7 @@ var Suggestions = function(t0) {
     }
     var t2;
     if ($[0] !== children || $[1] !== className || $[2] !== style) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Content4, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Content4, {
             className: className,
             style: style,
             children: children
@@ -41362,14 +41265,14 @@ var Suggestions = function(t0) {
 };
 Suggestions.Item = Item;
 // src/contexts/markdown/MarkdownContext/lib/components/Code.tsx
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var Code3 = function(t0) {
-    var $ = (0, import_react_compiler_runtime30.c)(5);
+    var $ = (0, import_react_compiler_runtime28.c)(5);
     var children = t0.children, className = t0.className;
     if (className === "language-suggestions") {
         var _t;
         if ($[0] !== children) {
-            _t = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Suggestions, {
+            _t = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Suggestions, {
                 children: children
             });
             $[0] = children;
@@ -41390,7 +41293,7 @@ var Code3 = function(t0) {
     }
     var t2;
     if ($[3] !== children) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_themes20.Code, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_themes18.Code, {
             style: t1,
             children: children
         });
@@ -41402,11 +41305,11 @@ var Code3 = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Img/index.tsx
-var import_react_compiler_runtime39 = require("react-compiler-runtime");
+var import_react_compiler_runtime37 = require("react-compiler-runtime");
 // src/components/images/Image.tsx
-var import_react_compiler_runtime31 = require("react-compiler-runtime");
-var import_themes21 = require("@radix-ui/themes");
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_react_compiler_runtime29 = require("react-compiler-runtime");
+var import_themes19 = require("@radix-ui/themes");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function ownKeys20(e, r) {
     var t = Object.keys(e);
     if (Object.getOwnPropertySymbols) {
@@ -41451,7 +41354,7 @@ function _toPrimitive20(t, r) {
     return ("string" === r ? String : Number)(t);
 }
 var Image = function(props) {
-    var $ = (0, import_react_compiler_runtime31.c)(3);
+    var $ = (0, import_react_compiler_runtime29.c)(3);
     var t0;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
         t0 = {
@@ -41464,9 +41367,9 @@ var Image = function(props) {
     }
     var t1;
     if ($[1] !== props) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_themes21.Box, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_themes19.Box, {
             pb: "3",
-            children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("img", _objectSpread20(_objectSpread20({}, props), {}, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("img", _objectSpread20(_objectSpread20({}, props), {}, {
                 style: t0
             }))
         });
@@ -41524,26 +41427,26 @@ var isAudioSrc = function(_ref) {
     return src.endsWith(".mp3") || src.endsWith(".wav");
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Img/Video/index.tsx
-var import_react_compiler_runtime37 = require("react-compiler-runtime");
-var import_themes27 = require("@radix-ui/themes");
+var import_react_compiler_runtime35 = require("react-compiler-runtime");
+var import_themes25 = require("@radix-ui/themes");
 var import_base = require("@vidstack/react/player/styles/base.css");
-var import_react24 = require("@vidstack/react");
+var import_react21 = require("@vidstack/react");
 // src/components/media/PlayButton.tsx
-var import_react_compiler_runtime32 = require("react-compiler-runtime");
-var import_react19 = require("@vidstack/react");
-var import_themes22 = require("@radix-ui/themes");
-var import_react_icons5 = require("@radix-ui/react-icons");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_react_compiler_runtime30 = require("react-compiler-runtime");
+var import_react16 = require("@vidstack/react");
+var import_themes20 = require("@radix-ui/themes");
+var import_react_icons4 = require("@radix-ui/react-icons");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var PlayButton = function() {
-    var $ = (0, import_react_compiler_runtime32.c)(2);
-    var isPaused = (0, import_react19.useMediaState)("paused");
+    var $ = (0, import_react_compiler_runtime30.c)(2);
+    var isPaused = (0, import_react16.useMediaState)("paused");
     var t0;
     if ($[0] !== isPaused) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_themes22.IconButton, {
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_themes20.IconButton, {
             variant: "ghost",
             asChild: true,
-            children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react19.PlayButton, {
-                children: isPaused ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_icons5.PlayIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_icons5.PauseIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react16.PlayButton, {
+                children: isPaused ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_icons4.PlayIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react_icons4.PauseIcon, {})
             })
         });
         $[0] = isPaused;
@@ -41554,24 +41457,24 @@ var PlayButton = function() {
     return t0;
 };
 // src/components/media/VolumeButton.tsx
-var import_react_compiler_runtime33 = require("react-compiler-runtime");
-var import_react20 = require("@vidstack/react");
-var import_themes23 = require("@radix-ui/themes");
-var import_react_icons6 = require("@radix-ui/react-icons");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_react_compiler_runtime31 = require("react-compiler-runtime");
+var import_react17 = require("@vidstack/react");
+var import_themes21 = require("@radix-ui/themes");
+var import_react_icons5 = require("@radix-ui/react-icons");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var VolumeButton = function() {
-    var $ = (0, import_react_compiler_runtime33.c)(13);
-    var volume = (0, import_react20.useMediaState)("volume");
-    var isMuted = (0, import_react20.useMediaState)("muted");
-    var remote = (0, import_react20.useMediaRemote)();
+    var $ = (0, import_react_compiler_runtime31.c)(13);
+    var volume = (0, import_react17.useMediaState)("volume");
+    var isMuted = (0, import_react17.useMediaState)("muted");
+    var remote = (0, import_react17.useMediaRemote)();
     var t0;
     if ($[0] !== isMuted || $[1] !== volume) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes23.HoverCard.Trigger, {
-            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes23.IconButton, {
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_themes21.HoverCard.Trigger, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_themes21.IconButton, {
                 variant: "ghost",
                 asChild: true,
-                children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react20.MuteButton, {
-                    children: isMuted || volume === 0 ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_icons6.SpeakerOffIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react_icons6.SpeakerModerateIcon, {})
+                children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react17.MuteButton, {
+                    children: isMuted || volume === 0 ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react_icons5.SpeakerOffIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react_icons5.SpeakerModerateIcon, {})
                 })
             })
         });
@@ -41605,11 +41508,11 @@ var VolumeButton = function() {
     }
     var t4;
     if ($[7] !== t2 || $[8] !== t3) {
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes23.HoverCard.Content, {
+        t4 = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_themes21.HoverCard.Content, {
             size: "1",
             side: "top",
             height: "100px",
-            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes23.Slider, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_themes21.Slider, {
                 size: "1",
                 variant: "soft",
                 orientation: "vertical",
@@ -41625,7 +41528,7 @@ var VolumeButton = function() {
     }
     var t5;
     if ($[10] !== t0 || $[11] !== t4) {
-        t5 = /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_themes23.HoverCard.Root, {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_themes21.HoverCard.Root, {
             children: [
                 t0,
                 t4
@@ -41640,19 +41543,19 @@ var VolumeButton = function() {
     return t5;
 };
 // src/components/media/Time.tsx
-var import_react_compiler_runtime34 = require("react-compiler-runtime");
-var import_react21 = require("react");
-var import_react22 = require("@vidstack/react");
-var import_themes24 = require("@radix-ui/themes");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_react_compiler_runtime32 = require("react-compiler-runtime");
+var import_react18 = require("react");
+var import_react19 = require("@vidstack/react");
+var import_themes22 = require("@radix-ui/themes");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var Time = function() {
-    var $ = (0, import_react_compiler_runtime34.c)(17);
-    var time = (0, import_react22.useMediaState)("currentTime");
-    var duration = (0, import_react22.useMediaState)("duration");
-    var seeking = (0, import_react22.useMediaState)("seeking");
-    var canSeek = (0, import_react22.useMediaState)("canSeek");
-    var remote = (0, import_react22.useMediaRemote)();
-    var _ref = _sliced_to_array((0, import_react21.useState)(0), 2), value = _ref[0], setValue = _ref[1];
+    var $ = (0, import_react_compiler_runtime32.c)(17);
+    var time = (0, import_react19.useMediaState)("currentTime");
+    var duration = (0, import_react19.useMediaState)("duration");
+    var seeking = (0, import_react19.useMediaState)("seeking");
+    var canSeek = (0, import_react19.useMediaState)("canSeek");
+    var remote = (0, import_react19.useMediaRemote)();
+    var _ref = _sliced_to_array((0, import_react18.useState)(0), 2), value = _ref[0], setValue = _ref[1];
     var t0;
     var t1;
     if ($[0] !== duration || $[1] !== seeking || $[2] !== time) {
@@ -41676,7 +41579,7 @@ var Time = function() {
         t0 = $[3];
         t1 = $[4];
     }
-    (0, import_react21.useEffect)(t0, t1);
+    (0, import_react18.useEffect)(t0, t1);
     var t2;
     t2 = 1 / duration * 100;
     var step = t2;
@@ -41714,7 +41617,7 @@ var Time = function() {
     }
     var t8;
     if ($[11] !== t3 || $[12] !== t4 || $[13] !== t5 || $[14] !== t6 || $[15] !== t7) {
-        t8 = /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_themes24.Slider, {
+        t8 = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_themes22.Slider, {
             size: "1",
             variant: "soft",
             value: t3,
@@ -41735,11 +41638,11 @@ var Time = function() {
     return t8;
 };
 // src/components/media/MediaContainer.tsx
-var import_react_compiler_runtime35 = require("react-compiler-runtime");
-var import_themes25 = require("@radix-ui/themes");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_react_compiler_runtime33 = require("react-compiler-runtime");
+var import_themes23 = require("@radix-ui/themes");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var MediaContainer = function(t0) {
-    var $ = (0, import_react_compiler_runtime35.c)(3);
+    var $ = (0, import_react_compiler_runtime33.c)(3);
     var children = t0.children;
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -41753,9 +41656,9 @@ var MediaContainer = function(t0) {
     }
     var t2;
     if ($[1] !== children) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_themes25.Card, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes23.Card, {
             mb: "3",
-            children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_themes25.Inset, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_themes23.Inset, {
                 clip: "padding-box",
                 style: t1,
                 children: children
@@ -41769,21 +41672,21 @@ var MediaContainer = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Img/Video/FullscreenButton.tsx
-var import_react_compiler_runtime36 = require("react-compiler-runtime");
-var import_react23 = require("@vidstack/react");
-var import_themes26 = require("@radix-ui/themes");
-var import_react_icons7 = require("@radix-ui/react-icons");
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_react_compiler_runtime34 = require("react-compiler-runtime");
+var import_react20 = require("@vidstack/react");
+var import_themes24 = require("@radix-ui/themes");
+var import_react_icons6 = require("@radix-ui/react-icons");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var FullscreenButton = function() {
-    var $ = (0, import_react_compiler_runtime36.c)(2);
-    var isFullscreen = (0, import_react23.useMediaState)("fullscreen");
+    var $ = (0, import_react_compiler_runtime34.c)(2);
+    var isFullscreen = (0, import_react20.useMediaState)("fullscreen");
     var t0;
     if ($[0] !== isFullscreen) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_themes26.IconButton, {
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_themes24.IconButton, {
             variant: "ghost",
             asChild: true,
-            children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react23.FullscreenButton, {
-                children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_icons7.ExitFullScreenIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react_icons7.EnterFullScreenIcon, {})
+            children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react20.FullscreenButton, {
+                children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_icons6.ExitFullScreenIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react_icons6.EnterFullScreenIcon, {})
             })
         });
         $[0] = isFullscreen;
@@ -41794,9 +41697,9 @@ var FullscreenButton = function() {
     return t0;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Img/Video/index.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var Video = function(t0) {
-    var $ = (0, import_react_compiler_runtime37.c)(9);
+    var $ = (0, import_react_compiler_runtime35.c)(9);
     var src = t0.src;
     var t1 = "video/".concat(src.split(".").pop());
     var t2;
@@ -41814,8 +41717,8 @@ var Video = function(t0) {
     var t3;
     var t4;
     if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react24.MediaProvider, {});
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("style", {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react21.MediaProvider, {});
+        t4 = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("style", {
             children: "\n          .superinterface-video-controls {\n            opacity: 0;\n            transition: opacity 0.2s ease-out;\n          }\n\n          .superinterface-video-controls[data-visible] {\n            opacity: 1;\n          }\n        "
         });
         $[3] = t3;
@@ -41836,7 +41739,7 @@ var Video = function(t0) {
     }
     var t6;
     if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
-        t6 = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_themes27.Flex, {
+        t6 = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_themes25.Flex, {
             asChild: true,
             position: "absolute",
             bottom: "0",
@@ -41845,18 +41748,18 @@ var Video = function(t0) {
             className: "superinterface-video-controls",
             p: "3",
             style: t5,
-            children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_react24.Controls.Root, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_themes27.Flex, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_react21.Controls.Root, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_themes25.Flex, {
                     asChild: true,
                     align: "center",
                     gap: "3",
                     flexGrow: "1",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_react24.Controls.Group, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_react21.Controls.Group, {
                         children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(PlayButton, {}),
-                            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Time, {}),
-                            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(VolumeButton, {}),
-                            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(FullscreenButton, {})
+                            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(PlayButton, {}),
+                            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Time, {}),
+                            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(VolumeButton, {}),
+                            /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(FullscreenButton, {})
                         ]
                     })
                 })
@@ -41868,8 +41771,8 @@ var Video = function(t0) {
     }
     var t7;
     if ($[7] !== t2) {
-        t7 = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MediaContainer, {
-            children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_react24.MediaPlayer, {
+        t7 = /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(MediaContainer, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_react21.MediaPlayer, {
                 src: t2,
                 playsInline: true,
                 hideControlsOnMouseLeave: true,
@@ -41889,13 +41792,13 @@ var Video = function(t0) {
     return t7;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Img/Audio/index.tsx
-var import_react_compiler_runtime38 = require("react-compiler-runtime");
-var import_themes28 = require("@radix-ui/themes");
+var import_react_compiler_runtime36 = require("react-compiler-runtime");
+var import_themes26 = require("@radix-ui/themes");
 var import_base2 = require("@vidstack/react/player/styles/base.css");
-var import_react25 = require("@vidstack/react");
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_react22 = require("@vidstack/react");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var Audio = function(t0) {
-    var $ = (0, import_react_compiler_runtime38.c)(8);
+    var $ = (0, import_react_compiler_runtime36.c)(8);
     var src = t0.src;
     var t1 = "audio/".concat(src.split(".").pop());
     var t2;
@@ -41912,7 +41815,7 @@ var Audio = function(t0) {
     }
     var t3;
     if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react25.MediaProvider, {});
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react22.MediaProvider, {});
         $[3] = t3;
     } else {
         t3 = $[3];
@@ -41929,22 +41832,22 @@ var Audio = function(t0) {
     }
     var t5;
     if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
-        t5 = /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_themes28.Flex, {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_themes26.Flex, {
             asChild: true,
             p: "3",
             flexGrow: "1",
             style: t4,
-            children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_react25.Controls.Root, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_themes28.Flex, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_react22.Controls.Root, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_themes26.Flex, {
                     asChild: true,
                     align: "center",
                     gap: "3",
                     flexGrow: "1",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_react25.Controls.Group, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_react22.Controls.Group, {
                         children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(PlayButton, {}),
-                            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Time, {}),
-                            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(VolumeButton, {})
+                            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(PlayButton, {}),
+                            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Time, {}),
+                            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(VolumeButton, {})
                         ]
                     })
                 })
@@ -41956,8 +41859,8 @@ var Audio = function(t0) {
     }
     var t6;
     if ($[6] !== t2) {
-        t6 = /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(MediaContainer, {
-            children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_react25.MediaPlayer, {
+        t6 = /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MediaContainer, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_react22.MediaPlayer, {
                 src: t2,
                 viewType: "audio",
                 crossOrigin: true,
@@ -41976,7 +41879,7 @@ var Audio = function(t0) {
     return t6;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Img/index.tsx
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 function ownKeys21(e, r) {
     var t = Object.keys(e);
     if (Object.getOwnPropertySymbols) {
@@ -42021,11 +41924,11 @@ function _toPrimitive21(t, r) {
     return ("string" === r ? String : Number)(t);
 }
 var Img = function(props) {
-    var $ = (0, import_react_compiler_runtime39.c)(8);
+    var $ = (0, import_react_compiler_runtime37.c)(8);
     if (!props.src) {
         var t0;
         if ($[0] !== props) {
-            t0 = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Image, _objectSpread21({}, props));
+            t0 = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Image, _objectSpread21({}, props));
             $[0] = props;
             $[1] = t0;
         } else {
@@ -42038,7 +41941,7 @@ var Img = function(props) {
         })) {
             var _t;
             if ($[2] !== props.src) {
-                _t = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Video, {
+                _t = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Video, {
                     src: props.src
                 });
                 $[2] = props.src;
@@ -42053,7 +41956,7 @@ var Img = function(props) {
             })) {
                 var _t2;
                 if ($[4] !== props.src) {
-                    _t2 = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Audio, {
+                    _t2 = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Audio, {
                         src: props.src
                     });
                     $[4] = props.src;
@@ -42065,7 +41968,7 @@ var Img = function(props) {
             } else {
                 var _t3;
                 if ($[6] !== props) {
-                    _t3 = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Image, _objectSpread21({}, props));
+                    _t3 = /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Image, _objectSpread21({}, props));
                     $[6] = props;
                     $[7] = _t3;
                 } else {
@@ -42077,20 +41980,20 @@ var Img = function(props) {
     }
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Annotation/index.tsx
-var import_react_compiler_runtime42 = require("react-compiler-runtime");
-var import_react_icons8 = require("@radix-ui/react-icons");
-// src/components/annotations/FilePathAnnotation.tsx
 var import_react_compiler_runtime40 = require("react-compiler-runtime");
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_react_icons7 = require("@radix-ui/react-icons");
+// src/components/annotations/FilePathAnnotation.tsx
+var import_react_compiler_runtime38 = require("react-compiler-runtime");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var FilePathAnnotation = function(t0) {
-    var $ = (0, import_react_compiler_runtime40.c)(3);
+    var $ = (0, import_react_compiler_runtime38.c)(3);
     var annotation = t0.annotation, children = t0.children;
     var superinterfaceContext = useSuperinterfaceContext();
     var nextSearchParams = new URLSearchParams(superinterfaceContext.variables);
     var t1 = "".concat(superinterfaceContext.baseUrl, "/files/").concat(annotation.file_path.file_id, "/contents?").concat(nextSearchParams);
     var t2;
     if ($[0] !== children || $[1] !== t1) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Link, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Link, {
             href: t1,
             target: "_self",
             download: true,
@@ -42105,16 +42008,16 @@ var FilePathAnnotation = function(t0) {
     return t2;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Annotation/AnnotationBase.tsx
-var import_react_compiler_runtime41 = require("react-compiler-runtime");
-var import_themes29 = require("@radix-ui/themes");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_react_compiler_runtime39 = require("react-compiler-runtime");
+var import_themes27 = require("@radix-ui/themes");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 var AnnotationBase = function(t0) {
-    var $ = (0, import_react_compiler_runtime41.c)(7);
+    var $ = (0, import_react_compiler_runtime39.c)(7);
     var icon = t0.icon, content2 = t0.content;
     var t1;
     if ($[0] !== icon) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes29.Popover.Trigger, {
-            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes29.IconButton, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes27.Popover.Trigger, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes27.IconButton, {
                 variant: "soft",
                 color: "gray",
                 size: "1",
@@ -42128,11 +42031,11 @@ var AnnotationBase = function(t0) {
     }
     var t2;
     if ($[2] !== content2) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes29.Popover.Content, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes27.Popover.Content, {
             size: "1",
-            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes29.Flex, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes27.Flex, {
                 direction: "column",
-                children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes29.Text, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_themes27.Text, {
                     size: "1",
                     color: "gray",
                     children: content2
@@ -42146,7 +42049,7 @@ var AnnotationBase = function(t0) {
     }
     var t3;
     if ($[4] !== t1 || $[5] !== t2) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_themes29.Popover.Root, {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_themes27.Popover.Root, {
             children: [
                 t1,
                 t2
@@ -42161,7 +42064,7 @@ var AnnotationBase = function(t0) {
     return t3;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/Annotation/index.tsx
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var _excluded = [
     "children"
 ];
@@ -42184,7 +42087,7 @@ function _objectWithoutPropertiesLoose(r, e) {
     return t;
 }
 var Annotation = function(t0) {
-    var $ = (0, import_react_compiler_runtime42.c)(9);
+    var $ = (0, import_react_compiler_runtime40.c)(9);
     var children;
     var rest;
     if ($[0] !== t0) {
@@ -42212,8 +42115,8 @@ var Annotation = function(t0) {
     if (annotation.type === "file_citation") {
         var t2;
         if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
-            t2 = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(AnnotationBase, {
-                icon: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react_icons8.QuoteIcon, {}),
+            t2 = /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(AnnotationBase, {
+                icon: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_react_icons7.QuoteIcon, {}),
                 content: "File cited."
             });
             $[5] = t2;
@@ -42225,7 +42128,7 @@ var Annotation = function(t0) {
         if (annotation.type === "file_path") {
             var _t2;
             if ($[6] !== annotation || $[7] !== children) {
-                _t2 = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FilePathAnnotation, {
+                _t2 = /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FilePathAnnotation, {
                     annotation: annotation,
                     children: children
                 });
@@ -42241,7 +42144,7 @@ var Annotation = function(t0) {
     return null;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/index.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var _excluded2 = [
     "width"
 ];
@@ -42318,53 +42221,53 @@ var components = {
     img: Img,
     annotation: Annotation,
     h1: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Heading, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Heading, {
             as: "h1",
             children: props.children
         });
     },
     h2: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Heading, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Heading, {
             as: "h2",
             size: "5",
             children: props.children
         });
     },
     h3: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Heading, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Heading, {
             as: "h3",
             size: "4",
             children: props.children
         });
     },
     h4: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Heading, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Heading, {
             as: "h4",
             size: "3",
             children: props.children
         });
     },
     h5: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Heading, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Heading, {
             as: "h5",
             size: "3",
             children: props.children
         });
     },
     h6: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Heading, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Heading, {
             as: "h6",
             size: "3",
             children: props.children
         });
     },
     table: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, {
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("style", {
+                /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("style", {
                     children: ".rt-TableRootTable { overflow: inherit; }"
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Table.Root, _objectSpread22(_objectSpread22({}, props), {}, {
+                /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Table.Root, _objectSpread22(_objectSpread22({}, props), {}, {
                     variant: "surface",
                     mb: "3"
                 }))
@@ -42372,22 +42275,22 @@ var components = {
         });
     },
     thead: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Table.Header, _objectSpread22({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Table.Header, _objectSpread22({}, props));
     },
     tbody: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Table.Body, _objectSpread22({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Table.Body, _objectSpread22({}, props));
     },
     tr: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Table.Row, _objectSpread22({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Table.Row, _objectSpread22({}, props));
     },
     td: function(_ref) {
         var width2 = _ref.width, rest = _objectWithoutProperties2(_ref, _excluded2);
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Table.Cell, _objectSpread22(_objectSpread22({}, rest), {}, {
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Table.Cell, _objectSpread22(_objectSpread22({}, rest), {}, {
             width: width2
         }));
     },
     th: function(props) {
-        return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes30.Table.ColumnHeaderCell, _objectSpread22({}, props));
+        return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes28.Table.ColumnHeaderCell, _objectSpread22({}, props));
     }
 };
 // src/contexts/markdown/MarkdownContext/lib/getRemarkPlugins.ts
@@ -42728,13 +42631,13 @@ var getRemarkPlugins = function(_ref) {
     ];
 };
 // src/contexts/markdown/MarkdownContext/index.ts
-var MarkdownContext = /* @__PURE__ */ (0, import_react26.createContext)({
+var MarkdownContext = /* @__PURE__ */ (0, import_react23.createContext)({
     components: components,
     getRemarkPlugins: getRemarkPlugins
 });
 // src/hooks/markdown/useMarkdownContext/index.ts
 var useMarkdownContext = function() {
-    return (0, import_react27.useContext)(MarkdownContext);
+    return (0, import_react24.useContext)(MarkdownContext);
 };
 // src/lib/markdown/escapeInvalidTagNames.ts
 var isValidTagName = function(tagName) {
@@ -42746,14 +42649,14 @@ var escapeInvalidTagNames = function(markdown) {
     });
 };
 // ../../node_modules/react-error-boundary/dist/react-error-boundary.esm.js
-var import_react28 = require("react");
-var ErrorBoundaryContext = /* @__PURE__ */ (0, import_react28.createContext)(null);
+var import_react25 = require("react");
+var ErrorBoundaryContext = /* @__PURE__ */ (0, import_react25.createContext)(null);
 var initialState = {
     didCatch: false,
     error: null
 };
-var ErrorBoundary = /*#__PURE__*/ function(_import_react28_Component) {
-    _inherits(ErrorBoundary, _import_react28_Component);
+var ErrorBoundary = /*#__PURE__*/ function(_import_react25_Component) {
+    _inherits(ErrorBoundary, _import_react25_Component);
     function ErrorBoundary(props) {
         _class_call_check(this, ErrorBoundary);
         var _this;
@@ -42819,14 +42722,14 @@ var ErrorBoundary = /*#__PURE__*/ function(_import_react28_Component) {
                     if (typeof fallbackRender === "function") {
                         childToRender = fallbackRender(props);
                     } else if (FallbackComponent) {
-                        childToRender = /* @__PURE__ */ (0, import_react28.createElement)(FallbackComponent, props);
+                        childToRender = /* @__PURE__ */ (0, import_react25.createElement)(FallbackComponent, props);
                     } else if (fallback !== void 0) {
                         childToRender = fallback;
                     } else {
                         throw error;
                     }
                 }
-                return /* @__PURE__ */ (0, import_react28.createElement)(ErrorBoundaryContext.Provider, {
+                return /* @__PURE__ */ (0, import_react25.createElement)(ErrorBoundaryContext.Provider, {
                     value: {
                         didCatch: didCatch,
                         error: error,
@@ -42847,7 +42750,7 @@ var ErrorBoundary = /*#__PURE__*/ function(_import_react28_Component) {
         }
     ]);
     return ErrorBoundary;
-}(import_react28.Component);
+}(import_react25.Component);
 function hasArrayChanged() {
     var a = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
     var b = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : [];
@@ -42855,8 +42758,8 @@ function hasArrayChanged() {
         return !Object.is(item, b[index]);
     });
 }
-// src/components/messages/MessageContent/ContentPart/TextContent.tsx
-var import_jsx_runtime43 = require("react/jsx-runtime");
+// src/components/contents/TextContent.tsx
+var import_jsx_runtime41 = require("react/jsx-runtime");
 function ownKeys24(e, r) {
     var t = Object.keys(e);
     if (Object.getOwnPropertySymbols) {
@@ -42932,7 +42835,7 @@ var evaluate = /* @__PURE__ */ function() {
             return [
                 2,
                 fn(_objectSpread24(_objectSpread24({}, runtime), {}, {
-                    useMDXComponents: import_react30.useMDXComponents
+                    useMDXComponents: import_react27.useMDXComponents
                 }))
             ];
         });
@@ -42942,7 +42845,7 @@ var evaluate = /* @__PURE__ */ function() {
     };
 }();
 var TextContent = function(t0) {
-    var $ = (0, import_react_compiler_runtime43.c)(13);
+    var $ = (0, import_react_compiler_runtime41.c)(13);
     var content2 = t0.content;
     var _useMarkdownContext = useMarkdownContext(), getRemarkPlugins2 = _useMarkdownContext.getRemarkPlugins, components2 = _useMarkdownContext.components;
     var t1;
@@ -42959,7 +42862,7 @@ var TextContent = function(t0) {
     }
     t1 = t2;
     var remarkPlugins = t1;
-    var _ref = _sliced_to_array((0, import_react29.useState)(null), 2), MDXComponent = _ref[0], setMDXComponent = _ref[1];
+    var _ref = _sliced_to_array((0, import_react26.useState)(null), 2), MDXComponent = _ref[0], setMDXComponent = _ref[1];
     var t3;
     var t4;
     if ($[3] !== content2 || $[4] !== remarkPlugins) {
@@ -43038,13 +42941,13 @@ var TextContent = function(t0) {
         t3 = $[5];
         t4 = $[6];
     }
-    (0, import_react29.useEffect)(t3, t4);
+    (0, import_react26.useEffect)(t3, t4);
     if (!MDXComponent) {
         return content2.text.value;
     }
     var t5;
     if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
-        t5 = /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes31.Badge, {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_themes29.Badge, {
             color: "red",
             mb: "2",
             children: "Could not render message."
@@ -43055,7 +42958,7 @@ var TextContent = function(t0) {
     }
     var t6;
     if ($[8] !== MDXComponent) {
-        t6 = /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(MDXComponent, {});
+        t6 = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(MDXComponent, {});
         $[8] = MDXComponent;
         $[9] = t6;
     } else {
@@ -43063,9 +42966,9 @@ var TextContent = function(t0) {
     }
     var t7;
     if ($[10] !== components2 || $[11] !== t6) {
-        t7 = /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ErrorBoundary, {
+        t7 = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ErrorBoundary, {
             fallback: t5,
-            children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react30.MDXProvider, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react27.MDXProvider, {
                 components: components2,
                 children: t6
             })
@@ -43078,18 +42981,18 @@ var TextContent = function(t0) {
     }
     return t7;
 };
-// src/components/messages/MessageContent/ContentPart/ImageFileContent.tsx
-var import_react_compiler_runtime44 = require("react-compiler-runtime");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+// src/components/contents/ImageFileContent.tsx
+var import_react_compiler_runtime42 = require("react-compiler-runtime");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 var ImageFileContent = function(t0) {
-    var $ = (0, import_react_compiler_runtime44.c)(2);
+    var $ = (0, import_react_compiler_runtime42.c)(2);
     var content2 = t0.content;
     var superinterfaceContext = useSuperinterfaceContext();
     var nextSearchParams = new URLSearchParams(superinterfaceContext.variables);
     var t1 = "".concat(superinterfaceContext.baseUrl, "/files/").concat(content2.image_file.file_id, "/contents?").concat(nextSearchParams);
     var t2;
     if ($[0] !== t1) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Image, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Image, {
             alt: "",
             src: t1
         });
@@ -43100,15 +43003,451 @@ var ImageFileContent = function(t0) {
     }
     return t2;
 };
-// src/components/messages/MessageContent/ContentPart/index.tsx
+// src/components/messageGroups/MessageGroup/index.tsx
+var import_react_compiler_runtime48 = require("react-compiler-runtime");
+var import_react34 = require("react");
+var import_themes37 = require("@radix-ui/themes");
+// src/components/messageGroups/MessageGroup/Name.tsx
+var import_react_compiler_runtime43 = require("react-compiler-runtime");
+var import_themes30 = require("@radix-ui/themes");
+var import_jsx_runtime43 = require("react/jsx-runtime");
+var Name = function(t0) {
+    var $ = (0, import_react_compiler_runtime43.c)(2);
+    var children = t0.children;
+    var t1;
+    if ($[0] !== children) {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes30.Flex, {
+            align: "center",
+            height: "var(--space-5)",
+            children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes30.Text, {
+                size: "2",
+                weight: "bold",
+                children: children
+            })
+        });
+        $[0] = children;
+        $[1] = t1;
+    } else {
+        t1 = $[1];
+    }
+    return t1;
+};
+// src/components/messageGroups/MessageGroup/AssistantAvatar.tsx
+var import_react_compiler_runtime44 = require("react-compiler-runtime");
+var import_react29 = require("react");
+var import_themes32 = require("@radix-ui/themes");
+// src/contexts/assistants/AssistantAvatarContext/index.tsx
+var import_react28 = require("react");
+var import_themes31 = require("@radix-ui/themes");
+var import_react_icons8 = require("@radix-ui/react-icons");
+var import_jsx_runtime44 = require("react/jsx-runtime");
+var AssistantAvatarContext = /* @__PURE__ */ (0, import_react28.createContext)(/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_themes31.Avatar, {
+    fallback: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react_icons8.LightningBoltIcon, {}),
+    size: "1"
+}));
+// src/components/messageGroups/MessageGroup/AssistantAvatar.tsx
 var import_jsx_runtime45 = require("react/jsx-runtime");
+var AssistantAvatar = function() {
+    var $ = (0, import_react_compiler_runtime44.c)(3);
+    var AssistantAvatarContextValue = (0, import_react29.useContext)(AssistantAvatarContext);
+    var t0;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+        t0 = {
+            borderRadius: "var(--radius-3)",
+            overflow: "hidden"
+        };
+        $[0] = t0;
+    } else {
+        t0 = $[0];
+    }
+    var t1;
+    if ($[1] !== AssistantAvatarContextValue) {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_themes32.Flex, {
+            flexShrink: "0",
+            height: "24px",
+            width: "24px",
+            style: t0,
+            children: AssistantAvatarContextValue
+        });
+        $[1] = AssistantAvatarContextValue;
+        $[2] = t1;
+    } else {
+        t1 = $[2];
+    }
+    return t1;
+};
+// src/contexts/assistants/AssistantNameContext/index.tsx
+var import_react30 = require("react");
+var AssistantNameContext = /* @__PURE__ */ (0, import_react30.createContext)("Assistant");
+// src/components/messageGroups/MessageGroup/UserAvatar.tsx
+var import_react_compiler_runtime45 = require("react-compiler-runtime");
+var import_react32 = require("react");
+var import_themes34 = require("@radix-ui/themes");
+// src/contexts/users/UserAvatarContext/index.tsx
+var import_react31 = require("react");
+var import_themes33 = require("@radix-ui/themes");
+var import_react_icons9 = require("@radix-ui/react-icons");
+var import_jsx_runtime46 = require("react/jsx-runtime");
+var UserAvatarContext = /* @__PURE__ */ (0, import_react31.createContext)(/* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_themes33.Avatar, {
+    fallback: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_react_icons9.PersonIcon, {}),
+    size: "1"
+}));
+// src/components/messageGroups/MessageGroup/UserAvatar.tsx
+var import_jsx_runtime47 = require("react/jsx-runtime");
+var UserAvatar = function() {
+    var $ = (0, import_react_compiler_runtime45.c)(3);
+    var UserAvatarContextValue = (0, import_react32.useContext)(UserAvatarContext);
+    var t0;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+        t0 = {
+            borderRadius: "var(--radius-3)",
+            overflow: "hidden"
+        };
+        $[0] = t0;
+    } else {
+        t0 = $[0];
+    }
+    var t1;
+    if ($[1] !== UserAvatarContextValue) {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes34.Flex, {
+            flexShrink: "0",
+            height: "24px",
+            width: "24px",
+            style: t0,
+            children: UserAvatarContextValue
+        });
+        $[1] = UserAvatarContextValue;
+        $[2] = t1;
+    } else {
+        t1 = $[2];
+    }
+    return t1;
+};
+// src/components/messageGroups/MessageGroup/Messages.tsx
+var import_react_compiler_runtime46 = require("react-compiler-runtime");
+var import_themes35 = require("@radix-ui/themes");
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var Messages = function(t0) {
+    var $ = (0, import_react_compiler_runtime46.c)(4);
+    var messageGroup = t0.messageGroup;
+    var t1;
+    if ($[0] !== messageGroup.messages) {
+        t1 = messageGroup.messages.map(_temp);
+        $[0] = messageGroup.messages;
+        $[1] = t1;
+    } else {
+        t1 = $[1];
+    }
+    var t2;
+    if ($[2] !== t1) {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes35.Flex, {
+            direction: "column-reverse",
+            children: t1
+        });
+        $[2] = t1;
+        $[3] = t2;
+    } else {
+        t2 = $[3];
+    }
+    return t2;
+};
+function _temp(message) {
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(Message, {
+        message: message
+    }, message.id);
+}
+// src/components/messageGroups/MessageGroup/Root.tsx
+var import_react_compiler_runtime47 = require("react-compiler-runtime");
+var import_react33 = require("react");
+var import_themes36 = require("@radix-ui/themes");
+var import_jsx_runtime49 = require("react/jsx-runtime");
+var Root2 = /* @__PURE__ */ (0, import_react33.forwardRef)(function Root3(t0, ref) {
+    var $ = (0, import_react_compiler_runtime47.c)(7);
+    var children = t0.children, style = t0.style, className = t0.className;
+    var t1;
+    if ($[0] !== children) {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes36.Flex, {
+            flexShrink: "0",
+            gap: "3",
+            children: children
+        });
+        $[0] = children;
+        $[1] = t1;
+    } else {
+        t1 = $[1];
+    }
+    var t2;
+    if ($[2] !== className || $[3] !== ref || $[4] !== style || $[5] !== t1) {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes36.Container, {
+            ref: ref,
+            size: "2",
+            flexGrow: "0",
+            className: className,
+            style: style,
+            children: t1
+        });
+        $[2] = className;
+        $[3] = ref;
+        $[4] = style;
+        $[5] = t1;
+        $[6] = t2;
+    } else {
+        t2 = $[6];
+    }
+    return t2;
+});
+// src/components/messageGroups/MessageGroup/index.tsx
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var Content5 = function(t0) {
+    var $ = (0, import_react_compiler_runtime48.c)(12);
+    var messageGroup = t0.messageGroup;
+    var assistantNameContext = (0, import_react34.useContext)(AssistantNameContext);
+    var t1;
+    if ($[0] !== messageGroup.role) {
+        t1 = messageGroup.role === "user" ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(UserAvatar, {}) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(AssistantAvatar, {});
+        $[0] = messageGroup.role;
+        $[1] = t1;
+    } else {
+        t1 = $[1];
+    }
+    var t2 = messageGroup.role === "user" ? "You" : assistantNameContext;
+    var t3;
+    if ($[2] !== t2) {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Name, {
+            children: t2
+        });
+        $[2] = t2;
+        $[3] = t3;
+    } else {
+        t3 = $[3];
+    }
+    var t4;
+    if ($[4] !== messageGroup) {
+        t4 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Messages, {
+            messageGroup: messageGroup
+        });
+        $[4] = messageGroup;
+        $[5] = t4;
+    } else {
+        t4 = $[5];
+    }
+    var t5;
+    if ($[6] !== t3 || $[7] !== t4) {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_themes37.Box, {
+            flexGrow: "1",
+            children: [
+                t3,
+                t4
+            ]
+        });
+        $[6] = t3;
+        $[7] = t4;
+        $[8] = t5;
+    } else {
+        t5 = $[8];
+    }
+    var t6;
+    if ($[9] !== t1 || $[10] !== t5) {
+        t6 = /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, {
+            children: [
+                t1,
+                t5
+            ]
+        });
+        $[9] = t1;
+        $[10] = t5;
+        $[11] = t6;
+    } else {
+        t6 = $[11];
+    }
+    return t6;
+};
+var MessageGroup = function(t0) {
+    var $ = (0, import_react_compiler_runtime48.c)(6);
+    var messageGroup = t0.messageGroup, style = t0.style, className = t0.className;
+    var t1;
+    if ($[0] !== messageGroup) {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Content5, {
+            messageGroup: messageGroup
+        });
+        $[0] = messageGroup;
+        $[1] = t1;
+    } else {
+        t1 = $[1];
+    }
+    var t2;
+    if ($[2] !== className || $[3] !== style || $[4] !== t1) {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Root2, {
+            className: className,
+            style: style,
+            children: t1
+        });
+        $[2] = className;
+        $[3] = style;
+        $[4] = t1;
+        $[5] = t2;
+    } else {
+        t2 = $[5];
+    }
+    return t2;
+};
+MessageGroup.Root = Root2;
+MessageGroup.Name = Name;
+MessageGroup.AssistantAvatar = AssistantAvatar;
+MessageGroup.UserAvatar = UserAvatar;
+MessageGroup.Messages = Messages;
+MessageGroup.Content = Content5;
+// src/contexts/components/ComponentsContext/index.tsx
+var ComponentsContext = /* @__PURE__ */ (0, import_react35.createContext)({
+    components: {
+        RunStep: RunStep,
+        Function: Function2,
+        StartingToolCalls: StartingToolCalls2,
+        TextContent: TextContent,
+        ImageFileContent: ImageFileContent,
+        MessageGroup: MessageGroup
+    }
+});
+// src/components/runSteps/RunSteps/index.tsx
+var import_jsx_runtime51 = require("react/jsx-runtime");
+var RunSteps = function(t0) {
+    var $ = (0, import_react_compiler_runtime49.c)(7);
+    var runSteps = t0.runSteps;
+    var componentsContext = (0, import_react36.useContext)(ComponentsContext);
+    var Component2 = componentsContext.components.RunStep;
+    var t1;
+    if ($[0] !== Component2 || $[1] !== runSteps) {
+        var _t;
+        if ($[3] !== Component2) {
+            _t = function(runStep) {
+                return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Component2, {
+                    runStep: runStep
+                }, runStep.id);
+            };
+            $[3] = Component2;
+            $[4] = _t;
+        } else {
+            _t = $[4];
+        }
+        t1 = runSteps.map(_t);
+        $[0] = Component2;
+        $[1] = runSteps;
+        $[2] = t1;
+    } else {
+        t1 = $[2];
+    }
+    var t2;
+    if ($[5] !== t1) {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes38.Flex, {
+            direction: "column-reverse",
+            children: t1
+        });
+        $[5] = t1;
+        $[6] = t2;
+    } else {
+        t2 = $[6];
+    }
+    return t2;
+};
+// src/contexts/messages/MessageContext/index.ts
+var import_react37 = require("react");
+var MessageContext = /* @__PURE__ */ (0, import_react37.createContext)({
+    message: null
+});
+// src/components/threads/Thread/Message/Provider.tsx
+var Provider = MessageContext.Provider;
+// src/components/threads/Thread/Message/Attachments/index.tsx
+var import_react_compiler_runtime50 = require("react-compiler-runtime");
+var import_themes39 = require("@radix-ui/themes");
+var import_react_icons10 = require("@radix-ui/react-icons");
+var import_jsx_runtime52 = require("react/jsx-runtime");
+var Attachments = function(t0) {
+    var _message$attachments;
+    var $ = (0, import_react_compiler_runtime50.c)(4);
+    var message = t0.message;
+    if (!((_message$attachments = message.attachments) !== null && _message$attachments !== void 0 && _message$attachments.length)) {
+        return null;
+    }
+    var t1;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react_icons10.FileIcon, {});
+        $[0] = t1;
+    } else {
+        t1 = $[0];
+    }
+    var t2 = message.attachments.length > 1 ? "s" : "";
+    var t3;
+    if ($[1] !== message.attachments.length || $[2] !== t2) {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes39.Flex, {
+            align: "start",
+            pb: "1",
+            children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_themes39.Badge, {
+                color: "gray",
+                variant: "surface",
+                children: [
+                    t1,
+                    message.attachments.length,
+                    " file",
+                    t2
+                ]
+            })
+        });
+        $[1] = message.attachments.length;
+        $[2] = t2;
+        $[3] = t3;
+    } else {
+        t3 = $[3];
+    }
+    return t3;
+};
+// src/components/messages/MessageContent/index.tsx
+var import_react_compiler_runtime52 = require("react-compiler-runtime");
+// src/components/messages/MessageContent/ContentPart/index.tsx
+var import_react_compiler_runtime51 = require("react-compiler-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var TextContent2 = function(t0) {
+    var $ = (0, import_react_compiler_runtime51.c)(3);
+    var content2 = t0.content;
+    var _useComponents = useComponents(), t1 = _useComponents.components;
+    var TextContent3 = t1.TextContent;
+    var t2;
+    if ($[0] !== TextContent3 || $[1] !== content2) {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(TextContent3, {
+            content: content2
+        });
+        $[0] = TextContent3;
+        $[1] = content2;
+        $[2] = t2;
+    } else {
+        t2 = $[2];
+    }
+    return t2;
+};
+var ImageFileContent2 = function(t0) {
+    var $ = (0, import_react_compiler_runtime51.c)(3);
+    var content2 = t0.content;
+    var _useComponents = useComponents(), t1 = _useComponents.components;
+    var ImageFileContent3 = t1.ImageFileContent;
+    var t2;
+    if ($[0] !== ImageFileContent3 || $[1] !== content2) {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ImageFileContent3, {
+            content: content2
+        });
+        $[0] = ImageFileContent3;
+        $[1] = content2;
+        $[2] = t2;
+    } else {
+        t2 = $[2];
+    }
+    return t2;
+};
 var ContentPart = function(t0) {
-    var $ = (0, import_react_compiler_runtime45.c)(4);
+    var $ = (0, import_react_compiler_runtime51.c)(4);
     var content2 = t0.content;
     if (content2.type === "text") {
         var t1;
         if ($[0] !== content2) {
-            t1 = /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(TextContent, {
+            t1 = /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(TextContent2, {
                 content: content2
             });
             $[0] = content2;
@@ -43121,7 +43460,7 @@ var ContentPart = function(t0) {
     if (content2.type === "image_file") {
         var _t;
         if ($[2] !== content2) {
-            _t = /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(ImageFileContent, {
+            _t = /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ImageFileContent2, {
                 content: content2
             });
             $[2] = content2;
@@ -43134,13 +43473,13 @@ var ContentPart = function(t0) {
     return null;
 };
 // src/components/messages/MessageContent/index.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var MessageContent = function(t0) {
-    var $ = (0, import_react_compiler_runtime46.c)(4);
+    var $ = (0, import_react_compiler_runtime52.c)(4);
     var message = t0.message;
     var t1;
     if ($[0] !== message.content) {
-        t1 = message.content.map(_temp);
+        t1 = message.content.map(_temp2);
         $[0] = message.content;
         $[1] = t1;
     } else {
@@ -43148,7 +43487,7 @@ var MessageContent = function(t0) {
     }
     var t2;
     if ($[2] !== t1) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_jsx_runtime54.Fragment, {
             children: t1
         });
         $[2] = t1;
@@ -43158,15 +43497,15 @@ var MessageContent = function(t0) {
     }
     return t2;
 };
-function _temp(content2, index) {
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ContentPart, {
+function _temp2(content2, index) {
+    return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ContentPart, {
         content: content2
     }, index);
 }
 // src/components/threads/Thread/Message/index.tsx
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var Message = function(t0) {
-    var $ = (0, import_react_compiler_runtime47.c)(37);
+    var $ = (0, import_react_compiler_runtime53.c)(37);
     var message = t0.message, className = t0.className, style = t0.style;
     var t1;
     bb0: {
@@ -43200,7 +43539,7 @@ var Message = function(t0) {
         var messageCreationRunStepIndex = message.runSteps.findIndex(_t2);
         var _t3;
         if ($[3] !== message.runSteps || $[4] !== messageCreationRunStepIndex) {
-            var nextRunStepIndex = message.runSteps.slice(0, messageCreationRunStepIndex).findLastIndex(_temp2);
+            var nextRunStepIndex = message.runSteps.slice(0, messageCreationRunStepIndex).findLastIndex(_temp3);
             if (nextRunStepIndex === -1) {
                 nextRunStepIndex = 0;
             }
@@ -43274,7 +43613,7 @@ var Message = function(t0) {
     }
     var t3;
     if ($[21] !== olderRunSteps_0) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(RunSteps, {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RunSteps, {
             runSteps: olderRunSteps_0
         });
         $[21] = olderRunSteps_0;
@@ -43293,13 +43632,13 @@ var Message = function(t0) {
     }
     var t5;
     if ($[24] !== message) {
-        t5 = /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_themes32.Box, {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_themes40.Box, {
             style: t4,
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Attachments, {
+                /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Attachments, {
                     message: message
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(MessageContent, {
+                /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(MessageContent, {
                     message: message
                 })
             ]
@@ -43311,7 +43650,7 @@ var Message = function(t0) {
     }
     var t6;
     if ($[26] !== laterRunSteps_0) {
-        t6 = /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(RunSteps, {
+        t6 = /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(RunSteps, {
             runSteps: laterRunSteps_0
         });
         $[26] = laterRunSteps_0;
@@ -43321,7 +43660,7 @@ var Message = function(t0) {
     }
     var t7;
     if ($[28] !== className || $[29] !== style || $[30] !== t3 || $[31] !== t5 || $[32] !== t6) {
-        t7 = /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_themes32.Box, {
+        t7 = /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_themes40.Box, {
             className: className,
             style: style,
             children: [
@@ -43341,7 +43680,7 @@ var Message = function(t0) {
     }
     var t8;
     if ($[34] !== t2 || $[35] !== t7) {
-        t8 = /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Provider, {
+        t8 = /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Provider, {
             value: t2,
             children: t7
         });
@@ -43353,7 +43692,7 @@ var Message = function(t0) {
     }
     return t8;
 };
-function _temp2(runStep_0) {
+function _temp3(runStep_0) {
     return runStep_0.step_details.type === "message_creation";
 }
 function _temp22(runStep_1) {
@@ -43363,8 +43702,8 @@ function _temp22(runStep_1) {
 var import_react_compiler_runtime56 = require("react-compiler-runtime");
 var import_react41 = require("react");
 // src/hooks/messageGroups/useMessageGroups/index.ts
-var import_react_compiler_runtime48 = require("react-compiler-runtime");
-var import_react32 = require("react");
+var import_react_compiler_runtime54 = require("react-compiler-runtime");
+var import_react39 = require("react");
 // src/hooks/messageGroups/useMessageGroups/lib/messageGroups/index.ts
 var import_lodash6 = __toESM(require("lodash"), 1);
 var import_radash13 = require("radash");
@@ -43466,109 +43805,47 @@ var messageGroups = function(_ref) {
         ]);
     }, []);
 };
-// src/hooks/messageGroups/useMessageGroups/index.ts
-var useMessageGroups = function(t0) {
-    var $ = (0, import_react_compiler_runtime48.c)(4);
-    var messages2 = t0.messages;
-    var t1;
-    var t2;
-    if ($[0] !== messages2) {
-        t2 = messageGroups({
-            messages: messages2
-        });
-        $[0] = messages2;
-        $[1] = t2;
-    } else {
-        t2 = $[1];
-    }
-    var t3;
-    if ($[2] !== t2) {
-        t3 = {
-            messageGroups: t2
-        };
-        $[2] = t2;
-        $[3] = t3;
-    } else {
-        t3 = $[3];
-    }
-    t1 = t3;
-    return t1;
-};
-// src/components/skeletons/MessagesSkeleton/index.tsx
-var import_react_compiler_runtime51 = require("react-compiler-runtime");
-var import_react34 = require("react");
-var import_themes35 = require("@radix-ui/themes");
-// src/components/messageGroups/MessageGroupBase/index.tsx
-var import_react_compiler_runtime49 = require("react-compiler-runtime");
-var import_react33 = require("react");
-var import_themes33 = require("@radix-ui/themes");
-var import_jsx_runtime48 = require("react/jsx-runtime");
-var MessageGroupBase = /* @__PURE__ */ (0, import_react33.forwardRef)(function MessageGroupBase2(t0, ref) {
-    var $ = (0, import_react_compiler_runtime49.c)(5);
-    var children = t0.children;
-    var t1;
-    if ($[0] !== children) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes33.Flex, {
-            flexShrink: "0",
-            gap: "3",
-            children: children
-        });
-        $[0] = children;
-        $[1] = t1;
-    } else {
-        t1 = $[1];
-    }
-    var t2;
-    if ($[2] !== ref || $[3] !== t1) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_themes33.Container, {
-            ref: ref,
-            size: "2",
-            flexGrow: "0",
-            children: t1
-        });
-        $[2] = ref;
-        $[3] = t1;
-        $[4] = t2;
-    } else {
-        t2 = $[4];
-    }
-    return t2;
-});
-// src/components/messageGroups/MessageGroupBase/Name.tsx
-var import_react_compiler_runtime50 = require("react-compiler-runtime");
-var import_themes34 = require("@radix-ui/themes");
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var Name = function(t0) {
-    var $ = (0, import_react_compiler_runtime50.c)(2);
-    var children = t0.children;
-    var t1;
-    if ($[0] !== children) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes34.Flex, {
-            align: "center",
-            height: "var(--space-5)",
-            children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_themes34.Text, {
-                size: "2",
-                weight: "bold",
-                children: children
-            })
+// src/hooks/messageGroups/useMessageGroups/index.ts
+var useMessageGroups = function(t0) {
+    var $ = (0, import_react_compiler_runtime54.c)(4);
+    var messages2 = t0.messages;
+    var t1;
+    var t2;
+    if ($[0] !== messages2) {
+        t2 = messageGroups({
+            messages: messages2
         });
-        $[0] = children;
-        $[1] = t1;
+        $[0] = messages2;
+        $[1] = t2;
     } else {
-        t1 = $[1];
+        t2 = $[1];
+    }
+    var t3;
+    if ($[2] !== t2) {
+        t3 = {
+            messageGroups: t2
+        };
+        $[2] = t2;
+        $[3] = t3;
+    } else {
+        t3 = $[3];
     }
+    t1 = t3;
     return t1;
 };
 // src/components/skeletons/MessagesSkeleton/index.tsx
-var import_jsx_runtime50 = require("react/jsx-runtime");
-var MessagesSkeleton = /* @__PURE__ */ (0, import_react34.forwardRef)(function MessagesSkeleton2(_props, ref) {
-    var $ = (0, import_react_compiler_runtime51.c)(7);
+var import_react_compiler_runtime55 = require("react-compiler-runtime");
+var import_react40 = require("react");
+var import_themes41 = require("@radix-ui/themes");
+var import_jsx_runtime56 = require("react/jsx-runtime");
+var MessagesSkeleton = /* @__PURE__ */ (0, import_react40.forwardRef)(function MessagesSkeleton2(_props, ref) {
+    var $ = (0, import_react_compiler_runtime55.c)(7);
     var t0;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes35.Skeleton, {
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Skeleton, {
             loading: true,
-            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes35.Avatar, {
-                fallback: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes35.Flex, {}),
+            children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Avatar, {
+                fallback: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Flex, {}),
                 size: "1"
             })
         });
@@ -43578,8 +43855,8 @@ var MessagesSkeleton = /* @__PURE__ */ (0, import_react34.forwardRef)(function M
     }
     var t1;
     if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Name, {
-            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes35.Skeleton, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(MessageGroup.Name, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Skeleton, {
                 loading: true,
                 style: {
                     width: "128px"
@@ -43592,7 +43869,7 @@ var MessagesSkeleton = /* @__PURE__ */ (0, import_react34.forwardRef)(function M
     }
     var t2;
     if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes35.Skeleton, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Skeleton, {
             loading: true,
             style: {
                 width: "256px"
@@ -43604,7 +43881,7 @@ var MessagesSkeleton = /* @__PURE__ */ (0, import_react34.forwardRef)(function M
     }
     var t3;
     if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes35.Skeleton, {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Skeleton, {
             loading: true,
             style: {
                 width: "256px",
@@ -43617,13 +43894,13 @@ var MessagesSkeleton = /* @__PURE__ */ (0, import_react34.forwardRef)(function M
     }
     var t4;
     if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_themes35.Box, {
+        t4 = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_themes41.Box, {
             pb: "3",
             children: [
                 t1,
                 t2,
                 t3,
-                /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes35.Skeleton, {
+                /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Skeleton, {
                     loading: true,
                     style: {
                         width: "256px",
@@ -43638,7 +43915,7 @@ var MessagesSkeleton = /* @__PURE__ */ (0, import_react34.forwardRef)(function M
     }
     var t5;
     if ($[5] !== ref) {
-        t5 = /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(MessageGroupBase, {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(MessageGroup.Root, {
             ref: ref,
             children: [
                 t0,
@@ -43652,204 +43929,10 @@ var MessagesSkeleton = /* @__PURE__ */ (0, import_react34.forwardRef)(function M
     }
     return t5;
 });
-// src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-var import_react_compiler_runtime55 = require("react-compiler-runtime");
-var import_react40 = require("react");
-var import_themes41 = require("@radix-ui/themes");
-// src/components/messageGroups/MessageGroupBase/AssistantAvatar.tsx
-var import_react_compiler_runtime52 = require("react-compiler-runtime");
-var import_react36 = require("react");
-var import_themes37 = require("@radix-ui/themes");
-// src/contexts/assistants/AssistantAvatarContext/index.tsx
-var import_react35 = require("react");
-var import_themes36 = require("@radix-ui/themes");
-var import_react_icons9 = require("@radix-ui/react-icons");
-var import_jsx_runtime51 = require("react/jsx-runtime");
-var AssistantAvatarContext = /* @__PURE__ */ (0, import_react35.createContext)(/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes36.Avatar, {
-    fallback: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_react_icons9.LightningBoltIcon, {}),
-    size: "1"
-}));
-// src/components/messageGroups/MessageGroupBase/AssistantAvatar.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
-var AssistantAvatar = function() {
-    var $ = (0, import_react_compiler_runtime52.c)(3);
-    var AssistantAvatarContextValue = (0, import_react36.useContext)(AssistantAvatarContext);
-    var t0;
-    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t0 = {
-            borderRadius: "var(--radius-3)",
-            overflow: "hidden"
-        };
-        $[0] = t0;
-    } else {
-        t0 = $[0];
-    }
-    var t1;
-    if ($[1] !== AssistantAvatarContextValue) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes37.Flex, {
-            flexShrink: "0",
-            height: "24px",
-            width: "24px",
-            style: t0,
-            children: AssistantAvatarContextValue
-        });
-        $[1] = AssistantAvatarContextValue;
-        $[2] = t1;
-    } else {
-        t1 = $[2];
-    }
-    return t1;
-};
-// src/contexts/assistants/AssistantNameContext/index.tsx
-var import_react37 = require("react");
-var AssistantNameContext = /* @__PURE__ */ (0, import_react37.createContext)("Assistant");
-// src/components/messageGroups/MessageGroupBase/UserAvatar.tsx
-var import_react_compiler_runtime53 = require("react-compiler-runtime");
-var import_react39 = require("react");
-var import_themes39 = require("@radix-ui/themes");
-// src/contexts/users/UserAvatarContext/index.tsx
-var import_react38 = require("react");
-var import_themes38 = require("@radix-ui/themes");
-var import_react_icons10 = require("@radix-ui/react-icons");
-var import_jsx_runtime53 = require("react/jsx-runtime");
-var UserAvatarContext = /* @__PURE__ */ (0, import_react38.createContext)(/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes38.Avatar, {
-    fallback: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react_icons10.PersonIcon, {}),
-    size: "1"
-}));
-// src/components/messageGroups/MessageGroupBase/UserAvatar.tsx
-var import_jsx_runtime54 = require("react/jsx-runtime");
-var UserAvatar = function() {
-    var $ = (0, import_react_compiler_runtime53.c)(3);
-    var UserAvatarContextValue = (0, import_react39.useContext)(UserAvatarContext);
-    var t0;
-    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t0 = {
-            borderRadius: "var(--radius-3)",
-            overflow: "hidden"
-        };
-        $[0] = t0;
-    } else {
-        t0 = $[0];
-    }
-    var t1;
-    if ($[1] !== UserAvatarContextValue) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_themes39.Flex, {
-            flexShrink: "0",
-            height: "24px",
-            width: "24px",
-            style: t0,
-            children: UserAvatarContextValue
-        });
-        $[1] = UserAvatarContextValue;
-        $[2] = t1;
-    } else {
-        t1 = $[2];
-    }
-    return t1;
-};
-// src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
-var import_react_compiler_runtime54 = require("react-compiler-runtime");
-var import_themes40 = require("@radix-ui/themes");
-var import_jsx_runtime55 = require("react/jsx-runtime");
-var Content5 = function(t0) {
-    var $ = (0, import_react_compiler_runtime54.c)(4);
-    var messageGroup = t0.messageGroup;
-    var t1;
-    if ($[0] !== messageGroup.messages) {
-        t1 = messageGroup.messages.map(_temp3);
-        $[0] = messageGroup.messages;
-        $[1] = t1;
-    } else {
-        t1 = $[1];
-    }
-    var t2;
-    if ($[2] !== t1) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes40.Flex, {
-            direction: "column-reverse",
-            children: t1
-        });
-        $[2] = t1;
-        $[3] = t2;
-    } else {
-        t2 = $[3];
-    }
-    return t2;
-};
-function _temp3(message) {
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Message, {
-        message: message
-    }, message.id);
-}
-// src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
-var MessageGroup = function(t0) {
-    var $ = (0, import_react_compiler_runtime55.c)(12);
-    var messageGroup = t0.messageGroup;
-    var assistantNameContext = (0, import_react40.useContext)(AssistantNameContext);
-    var t1;
-    if ($[0] !== messageGroup.role) {
-        t1 = messageGroup.role === "user" ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(UserAvatar, {}) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(AssistantAvatar, {});
-        $[0] = messageGroup.role;
-        $[1] = t1;
-    } else {
-        t1 = $[1];
-    }
-    var t2 = messageGroup.role === "user" ? "You" : assistantNameContext;
-    var t3;
-    if ($[2] !== t2) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Name, {
-            children: t2
-        });
-        $[2] = t2;
-        $[3] = t3;
-    } else {
-        t3 = $[3];
-    }
-    var t4;
-    if ($[4] !== messageGroup) {
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Content5, {
-            messageGroup: messageGroup
-        });
-        $[4] = messageGroup;
-        $[5] = t4;
-    } else {
-        t4 = $[5];
-    }
-    var t5;
-    if ($[6] !== t3 || $[7] !== t4) {
-        t5 = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_themes41.Box, {
-            flexGrow: "1",
-            children: [
-                t3,
-                t4
-            ]
-        });
-        $[6] = t3;
-        $[7] = t4;
-        $[8] = t5;
-    } else {
-        t5 = $[8];
-    }
-    var t6;
-    if ($[9] !== t1 || $[10] !== t5) {
-        t6 = /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(MessageGroupBase, {
-            children: [
-                t1,
-                t5
-            ]
-        });
-        $[9] = t1;
-        $[10] = t5;
-        $[11] = t6;
-    } else {
-        t6 = $[11];
-    }
-    return t6;
-};
 // src/components/threads/Thread/Messages/Content/index.tsx
 var import_jsx_runtime57 = require("react/jsx-runtime");
 var Content6 = function() {
-    var $ = (0, import_react_compiler_runtime56.c)(11);
+    var $ = (0, import_react_compiler_runtime56.c)(14);
     var _useMessages = useMessages(), messages2 = _useMessages.messages, isLoading = _useMessages.isLoading, isLoadingError = _useMessages.isLoadingError;
     var addToast = useToasts().addToast;
     var t0;
@@ -43863,10 +43946,12 @@ var Content6 = function() {
         t0 = $[1];
     }
     var _useMessageGroups = useMessageGroups(t0), messageGroups2 = _useMessageGroups.messageGroups;
-    var t1;
+    var _useComponents = useComponents(), t1 = _useComponents.components;
+    var MessageGroup2 = t1.MessageGroup;
     var t2;
+    var t3;
     if ($[2] !== addToast || $[3] !== isLoadingError) {
-        t1 = function() {
+        t2 = function() {
             if (isLoadingError) {
                 addToast({
                     type: "error",
@@ -43874,19 +43959,19 @@ var Content6 = function() {
                 });
             }
         };
-        t2 = [
+        t3 = [
             isLoadingError,
             addToast
         ];
         $[2] = addToast;
         $[3] = isLoadingError;
-        $[4] = t1;
-        $[5] = t2;
+        $[4] = t2;
+        $[5] = t3;
     } else {
-        t1 = $[4];
-        t2 = $[5];
+        t2 = $[4];
+        t3 = $[5];
     }
-    (0, import_react41.useEffect)(t1, t2);
+    (0, import_react41.useEffect)(t2, t3);
     if (isLoading || isLoadingError) {
         var _t;
         if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
@@ -43897,31 +43982,39 @@ var Content6 = function() {
         }
         return _t;
     }
-    var t3;
-    if ($[7] !== messageGroups2) {
-        t3 = messageGroups2.map(_temp4);
-        $[7] = messageGroups2;
-        $[8] = t3;
+    var t4;
+    if ($[7] !== MessageGroup2 || $[8] !== messageGroups2) {
+        var _t2;
+        if ($[10] !== MessageGroup2) {
+            _t2 = function(messageGroup) {
+                return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(MessageGroup2, {
+                    messageGroup: messageGroup
+                }, messageGroup.id);
+            };
+            $[10] = MessageGroup2;
+            $[11] = _t2;
+        } else {
+            _t2 = $[11];
+        }
+        t4 = messageGroups2.map(_t2);
+        $[7] = MessageGroup2;
+        $[8] = messageGroups2;
+        $[9] = t4;
     } else {
-        t3 = $[8];
+        t4 = $[9];
     }
-    var t4;
-    if ($[9] !== t3) {
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_jsx_runtime57.Fragment, {
-            children: t3
+    var t5;
+    if ($[12] !== t4) {
+        t5 = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_jsx_runtime57.Fragment, {
+            children: t4
         });
-        $[9] = t3;
-        $[10] = t4;
+        $[12] = t4;
+        $[13] = t5;
     } else {
-        t4 = $[10];
+        t5 = $[13];
     }
-    return t4;
+    return t5;
 };
-function _temp4(messageGroup) {
-    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(MessageGroup, {
-        messageGroup: messageGroup
-    }, messageGroup.id);
-}
 // src/components/threads/Thread/Messages/Progress/index.tsx
 var import_react_compiler_runtime59 = require("react-compiler-runtime");
 var import_react43 = require("react");
@@ -43962,14 +44055,14 @@ var StartingSkeleton = function(t0) {
     var assistantNameContext = (0, import_react42.useContext)(AssistantNameContext);
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(AssistantAvatar, {});
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(MessageGroup.AssistantAvatar, {});
         $[0] = t1;
     } else {
         t1 = $[0];
     }
     var t2;
     if ($[1] !== assistantNameContext) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(Name, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(MessageGroup.Name, {
             children: assistantNameContext
         });
         $[1] = assistantNameContext;
@@ -43986,7 +44079,7 @@ var StartingSkeleton = function(t0) {
     }
     var t4;
     if ($[4] !== children || $[5] !== t2) {
-        t4 = /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(MessageGroupBase, {
+        t4 = /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(MessageGroup.Root, {
             children: [
                 t1,
                 /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes43.Box, {
@@ -44063,7 +44156,7 @@ var Progress = function() {
         }
         var t2;
         if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
-            t2 = /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(MessageGroupBase, {
+            t2 = /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(MessageGroup.Root, {
                 children: [
                     _t,
                     /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_themes44.Box, {
@@ -44177,7 +44270,7 @@ function _toPrimitive26(t, r) {
     }
     return ("string" === r ? String : Number)(t);
 }
-var Root2 = function(t0) {
+var Root4 = function(t0) {
     var $ = (0, import_react_compiler_runtime60.c)(18);
     var children = t0.children, style = t0.style, className = t0.className;
     var _useMessages = useMessages(), isFetchingNextPage = _useMessages.isFetchingNextPage, hasNextPage = _useMessages.hasNextPage, fetchNextPage = _useMessages.fetchNextPage;
@@ -44280,7 +44373,7 @@ var NextPageSkeleton = function() {
 };
 // src/components/threads/Thread/Messages/index.tsx
 var import_jsx_runtime63 = require("react/jsx-runtime");
-var Messages = function(t0) {
+var Messages2 = function(t0) {
     var $ = (0, import_react_compiler_runtime62.c)(9);
     var children = t0.children, className = t0.className, style = t0.style;
     var t1;
@@ -44318,7 +44411,7 @@ var Messages = function(t0) {
     }
     var t6;
     if ($[5] !== children || $[6] !== className || $[7] !== style) {
-        t6 = /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(Root2, {
+        t6 = /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(Root4, {
             style: style,
             className: className,
             children: [
@@ -44339,9 +44432,9 @@ var Messages = function(t0) {
     }
     return t6;
 };
-Messages.Root = Root2;
-Messages.Message = Message;
-Messages.NextPageSkeleton = NextPageSkeleton;
+Messages2.Root = Root4;
+Messages2.Message = Message;
+Messages2.NextPageSkeleton = NextPageSkeleton;
 // src/components/threads/Thread/MessageForm/index.tsx
 var import_react_compiler_runtime68 = require("react-compiler-runtime");
 // src/components/threads/Thread/MessageForm/Submit/index.tsx
@@ -44409,7 +44502,7 @@ function _toPrimitive27(t, r) {
     }
     return ("string" === r ? String : Number)(t);
 }
-var Root3 = function(t0) {
+var Root5 = function(t0) {
     var $ = (0, import_react_compiler_runtime63.c)(4);
     var children = t0.children, style = t0.style, className = t0.className;
     var t1;
@@ -44504,7 +44597,7 @@ var Submit = function(props) {
     }
     var t1;
     if ($[1] !== props) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Root3, _objectSpread27(_objectSpread27({}, props), {}, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(Root5, _objectSpread27(_objectSpread27({}, props), {}, {
             children: t0
         }));
         $[1] = props;
@@ -44514,7 +44607,7 @@ var Submit = function(props) {
     }
     return t1;
 };
-Submit.Root = Root3;
+Submit.Root = Root5;
 Submit.Button = Button3;
 // src/components/threads/Thread/MessageForm/Root/index.tsx
 var import_react_query6 = require("@tanstack/react-query");
@@ -44599,7 +44692,7 @@ function _asyncToGenerator6(n) {
         });
     };
 }
-var Root4 = function(_ref) {
+var Root6 = function(_ref) {
     "use no memo";
     var children = _ref.children, onSubmitArg = _ref.onSubmit, isDisabledArg = _ref.isDisabled, style = _ref.style, className = _ref.className;
     var _$_ref = _sliced_to_array((0, import_react48.useState)([]), 2), files = _$_ref[0], setFiles = _$_ref[1];
@@ -44924,7 +45017,7 @@ function _toPrimitive30(t, r) {
     }
     return ("string" === r ? String : Number)(t);
 }
-var Root5 = function(t0) {
+var Root7 = function(t0) {
     var $ = (0, import_react_compiler_runtime65.c)(4);
     var children = t0.children, style = t0.style, className = t0.className;
     var t1;
@@ -45000,7 +45093,7 @@ var Control = function(props) {
     }
     var t1;
     if ($[1] !== props) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Root5, _objectSpread30(_objectSpread30({}, props), {}, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(Root7, _objectSpread30(_objectSpread30({}, props), {}, {
             children: t0
         }));
         $[1] = props;
@@ -45010,7 +45103,7 @@ var Control = function(props) {
     }
     return t1;
 };
-Control.Root = Root5;
+Control.Root = Root7;
 Control.Input = Input;
 // src/components/threads/Thread/MessageForm/Field/Files/Preview.tsx
 var import_react_compiler_runtime66 = require("react-compiler-runtime");
@@ -45399,7 +45492,7 @@ var useCreateFile = function(t0) {
     var t1;
     if ($[0] !== t0) {
         t1 = t0 === void 0 ? {
-            onError: _temp5
+            onError: _temp4
         } : t0;
         $[0] = t0;
         $[1] = t1;
@@ -45468,7 +45561,7 @@ var useCreateFile = function(t0) {
     }
     return t6;
 };
-function _temp5() {}
+function _temp4() {}
 function _temp23() {}
 // src/components/threads/Thread/MessageForm/Field/Files/Control.tsx
 var import_jsx_runtime69 = require("react/jsx-runtime");
@@ -45837,7 +45930,7 @@ function _toPrimitive36(t, r) {
     }
     return ("string" === r ? String : Number)(t);
 }
-var Root6 = function(_ref) {
+var Root8 = function(_ref) {
     "use no memo";
     var children = _ref.children, className = _ref.className, style = _ref.style;
     var _$_ref = (0, import_react_hook_form3.useFormContext)(), errors = _$_ref.formState.errors;
@@ -45871,7 +45964,7 @@ var Root6 = function(_ref) {
     });
 };
 var Field = {
-    Root: Root6,
+    Root: Root8,
     Control: Control,
     Files: Files
 };
@@ -45936,7 +46029,7 @@ var MessageForm = function(props) {
     }
     var t1;
     if ($[1] !== props) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Root4, _objectSpread37(_objectSpread37({}, props), {}, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Root6, _objectSpread37(_objectSpread37({}, props), {}, {
             children: t0
         }));
         $[1] = props;
@@ -45946,7 +46039,7 @@ var MessageForm = function(props) {
     }
     return t1;
 };
-MessageForm.Root = Root4;
+MessageForm.Root = Root6;
 MessageForm.Field = Field;
 MessageForm.Submit = Submit;
 // src/components/threads/Thread/Root/index.tsx
@@ -46059,7 +46152,7 @@ var ToastsProvider = function(t0) {
     }
     var t5;
     if ($[4] !== toasts) {
-        t5 = Array.from(toasts).map(_temp6);
+        t5 = Array.from(toasts).map(_temp5);
         $[4] = toasts;
         $[5] = t5;
     } else {
@@ -46119,7 +46212,7 @@ var ToastsProvider = function(t0) {
     }
     return t8;
 };
-function _temp6(toast_0, index) {
+function _temp5(toast_0, index) {
     return /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(CustomToast, {
         toast: toast_0
     }, index);
@@ -46192,7 +46285,7 @@ function _objectWithoutPropertiesLoose4(r, e) {
     }
     return t;
 }
-var Root8 = function(t0) {
+var Root10 = function(t0) {
     var $ = (0, import_react_compiler_runtime71.c)(12);
     var children;
     var className;
@@ -46297,7 +46390,7 @@ var Thread = function(props) {
     var t0;
     var t1;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Messages, {});
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Messages2, {});
         t1 = /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(MessageForm, {});
         $[0] = t0;
         $[1] = t1;
@@ -46307,7 +46400,7 @@ var Thread = function(props) {
     }
     var t2;
     if ($[2] !== props) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(Root8, _objectSpread39(_objectSpread39({}, props), {}, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(Root10, _objectSpread39(_objectSpread39({}, props), {}, {
             children: [
                 t0,
                 t1
@@ -46320,8 +46413,8 @@ var Thread = function(props) {
     }
     return t2;
 };
-Thread.Root = Root8;
-Thread.Messages = Messages;
+Thread.Root = Root10;
+Thread.Messages = Messages2;
 Thread.MessageForm = MessageForm;
 // src/hooks/messages/useMessageContext/index.ts
 var import_react54 = require("react");
@@ -46563,7 +46656,7 @@ var Provider4 = function(t0) {
 };
 // src/components/threads/ThreadDialog/Root/index.tsx
 var import_jsx_runtime77 = require("react/jsx-runtime");
-var Root9 = function(t0) {
+var Root11 = function(t0) {
     var $ = (0, import_react_compiler_runtime75.c)(2);
     var children = t0.children;
     var t1;
@@ -46698,7 +46791,7 @@ function _toPrimitive42(t, r) {
     }
     return ("string" === r ? String : Number)(t);
 }
-var Root10 = function(t0) {
+var Root12 = function(t0) {
     var $ = (0, import_react_compiler_runtime77.c)(14);
     var children = t0.children, style = t0.style, className = t0.className;
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
@@ -46717,7 +46810,7 @@ var Root10 = function(t0) {
     var t3;
     if ($[2] !== setIsOpen) {
         t3 = function() {
-            return setIsOpen(_temp7);
+            return setIsOpen(_temp6);
         };
         $[2] = setIsOpen;
         $[3] = t3;
@@ -46780,7 +46873,7 @@ var Trigger = function(args) {
     }
     var t1;
     if ($[1] !== args) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Root10, _objectSpread42(_objectSpread42({}, args), {}, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Root12, _objectSpread42(_objectSpread42({}, args), {}, {
             children: t0
         }));
         $[1] = args;
@@ -46790,9 +46883,9 @@ var Trigger = function(args) {
     }
     return t1;
 };
-Trigger.Root = Root10;
+Trigger.Root = Root12;
 Trigger.Button = Button4;
-function _temp7(prev) {
+function _temp6(prev) {
     return !prev;
 }
 // src/components/threads/ThreadDialog/Content/index.tsx
@@ -46821,7 +46914,7 @@ var Close = function() {
     var t2;
     if ($[2] !== setIsOpen) {
         t2 = function() {
-            return setIsOpen(_temp8);
+            return setIsOpen(_temp7);
         };
         $[2] = setIsOpen;
         $[3] = t2;
@@ -46871,7 +46964,7 @@ var Close = function() {
     }
     return t5;
 };
-function _temp8(prev) {
+function _temp7(prev) {
     return !prev;
 }
 // src/components/threads/ThreadDialog/Content/index.tsx
@@ -46919,7 +47012,7 @@ function _toPrimitive43(t, r) {
     }
     return ("string" === r ? String : Number)(t);
 }
-var Root11 = function(t0) {
+var Root13 = function(t0) {
     var $ = (0, import_react_compiler_runtime79.c)(19);
     var children = t0.children, className = t0.className, style = t0.style;
     var isOpen = useThreadDialogContext().isOpen;
@@ -47066,7 +47159,7 @@ var Root11 = function(t0) {
     }
     return t13;
 };
-var Messages2 = function(t0) {
+var Messages3 = function(t0) {
     var $ = (0, import_react_compiler_runtime79.c)(5);
     var className = t0.className, style = t0.style;
     var t1;
@@ -47123,7 +47216,7 @@ var Content7 = function(props) {
     var $ = (0, import_react_compiler_runtime79.c)(4);
     var t0;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Messages2, {});
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Messages3, {});
         $[0] = t0;
     } else {
         t0 = $[0];
@@ -47144,7 +47237,7 @@ var Content7 = function(props) {
     }
     var t2;
     if ($[2] !== props) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Root11, _objectSpread43(_objectSpread43({}, props), {}, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Root13, _objectSpread43(_objectSpread43({}, props), {}, {
             children: t1
         }));
         $[2] = props;
@@ -47154,8 +47247,8 @@ var Content7 = function(props) {
     }
     return t2;
 };
-Content7.Root = Root11;
-Content7.Messages = Messages2;
+Content7.Root = Root13;
+Content7.Messages = Messages3;
 Content7.FormContainer = FormContainer;
 // src/components/threads/ThreadDialog/index.tsx
 var import_jsx_runtime82 = require("react/jsx-runtime");
@@ -47163,7 +47256,7 @@ var ThreadDialog = function() {
     var $ = (0, import_react_compiler_runtime80.c)(1);
     var t0;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(Root9, {
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime82.jsxs)(Root11, {
             children: [
                 /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Content7, {}),
                 /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(Trigger, {})
@@ -47175,7 +47268,7 @@ var ThreadDialog = function() {
     }
     return t0;
 };
-ThreadDialog.Root = Root9;
+ThreadDialog.Root = Root11;
 ThreadDialog.Trigger = Trigger;
 ThreadDialog.Content = Content7;
 // src/components/threads/AudioThreadDialog/index.tsx
@@ -47278,7 +47371,7 @@ var import_react_compiler_runtime82 = require("react-compiler-runtime");
 var import_react62 = require("react");
 var useInterval = function(callback, delay) {
     var $ = (0, import_react_compiler_runtime82.c)(5);
-    var savedCallback = (0, import_react62.useRef)(_temp9);
+    var savedCallback = (0, import_react62.useRef)(_temp8);
     var t0;
     if ($[0] !== callback) {
         t0 = function() {
@@ -47315,7 +47408,7 @@ var useInterval = function(callback, delay) {
     }
     (0, import_react62.useEffect)(t1, t2);
 };
-function _temp9() {}
+function _temp8() {}
 // src/hooks/audioThreads/useRecorder/index.ts
 function ownKeys44(e, r) {
     var t = Object.keys(e);
@@ -47863,7 +47956,7 @@ var useMessageAudio = function(t0) {
     } else {
         t8 = $[36];
     }
-    (0, import_react64.useEffect)(_temp10, t8);
+    (0, import_react64.useEffect)(_temp9, t8);
     var _ref4 = _sliced_to_array((0, import_react64.useState)(null), 2), audioEngine = _ref4[0], setAudioEngine = _ref4[1];
     var isAudioEngineInited = (0, import_react64.useRef)(false);
     var t9;
@@ -47947,7 +48040,7 @@ var useMessageAudio = function(t0) {
     }
     return t13;
 };
-function _temp10() {
+function _temp9() {
     if (isHtmlAudioSupported) {
         var _Howler$_howls$;
         if (!(import_howler.Howler !== null && import_howler.Howler !== void 0 && (_Howler$_howls$ = import_howler.Howler._howls[0]) !== null && _Howler$_howls$ !== void 0 && (_Howler$_howls$ = _Howler$_howls$._sounds[0]) !== null && _Howler$_howls$ !== void 0 && _Howler$_howls$._node)) {
@@ -48022,7 +48115,7 @@ var useTtsAudioRuntime = function(t0) {
     if ($[1] !== createMessageProps) {
         t2 = {
             isStopOnSilence: true,
-            onStart: _temp11,
+            onStart: _temp10,
             onStop: function() {
                 var _onStop = _asyncToGenerator11(function(_event, chunks) {
                     var blob, audioContent;
@@ -48153,7 +48246,7 @@ var useTtsAudioRuntime = function(t0) {
     t5 = t8;
     return t5;
 };
-function _temp11() {
+function _temp10() {
     return _temp24.apply(this, arguments);
 }
 function _temp24() {
@@ -48361,7 +48454,7 @@ var Provider5 = function(t0) {
     }
     return t2;
 };
-var Root12 = function(t0) {
+var Root14 = function(t0) {
     var $ = (0, import_react_compiler_runtime86.c)(16);
     var children;
     var className;
@@ -48660,7 +48753,7 @@ var Provider6 = function(_ref) {
         children: children
     });
 };
-var Root13 = function(t0) {
+var Root15 = function(t0) {
     var $ = (0, import_react_compiler_runtime88.c)(6);
     var children;
     var rest;
@@ -48842,14 +48935,14 @@ var AssistantInfo = function(props) {
     var assistantNameContext = (0, import_react68.useContext)(AssistantNameContext);
     var t0;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-        t0 = /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(AssistantAvatar, {});
+        t0 = /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(MessageGroup.AssistantAvatar, {});
         $[0] = t0;
     } else {
         t0 = $[0];
     }
     var t1;
     if ($[1] !== assistantNameContext) {
-        t1 = /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(Name, {
+        t1 = /* @__PURE__ */ (0, import_jsx_runtime86.jsx)(MessageGroup.Name, {
             children: assistantNameContext
         });
         $[1] = assistantNameContext;
@@ -48892,7 +48985,7 @@ var Visualization = function(props) {
     }
     var t2;
     if ($[2] !== props) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(Root13, _objectSpread47(_objectSpread47({}, props), {}, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime86.jsxs)(Root15, _objectSpread47(_objectSpread47({}, props), {}, {
             children: [
                 t0,
                 t1
@@ -48905,7 +48998,7 @@ var Visualization = function(props) {
     }
     return t2;
 };
-Visualization.Root = Root13;
+Visualization.Root = Root15;
 Visualization.Provider = Provider6;
 Visualization.AssistantVisualization = AssistantVisualization;
 Visualization.AssistantInfo = AssistantInfo;
@@ -49615,7 +49708,7 @@ var AudioThread = function(props) {
     }
     var t3;
     if ($[3] !== props) {
-        t3 = /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(Root12, _objectSpread51(_objectSpread51({}, props), {}, {
+        t3 = /* @__PURE__ */ (0, import_jsx_runtime92.jsxs)(Root14, _objectSpread51(_objectSpread51({}, props), {}, {
             children: [
                 t0,
                 t1,
@@ -49629,7 +49722,7 @@ var AudioThread = function(props) {
     }
     return t3;
 };
-AudioThread.Root = Root12;
+AudioThread.Root = Root14;
 AudioThread.Visualization = Visualization;
 AudioThread.Status = Status;
 AudioThread.Form = Form;
@@ -49695,7 +49788,7 @@ var AudioThreadDialog = function(props) {
     }
     var t2;
     if ($[2] !== props) {
-        t2 = /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(Root9, _objectSpread52(_objectSpread52({}, props), {}, {
+        t2 = /* @__PURE__ */ (0, import_jsx_runtime93.jsxs)(Root11, _objectSpread52(_objectSpread52({}, props), {}, {
             children: [
                 t0,
                 t1
@@ -49708,7 +49801,7 @@ var AudioThreadDialog = function(props) {
     }
     return t2;
 };
-AudioThreadDialog.Root = Root9;
+AudioThreadDialog.Root = Root11;
 AudioThreadDialog.Trigger = Trigger;
 AudioThreadDialog.Content = Content7;
 // src/hooks/audioRuntimes/useWebrtcAudioRuntime/index.ts
@@ -50805,13 +50898,7 @@ var Avatar6 = function(t0) {
 };
 // src/components/components/ComponentsProvider.tsx
 var import_react_compiler_runtime104 = require("react-compiler-runtime");
-var import_react74 = require("react");
-// src/hooks/components/useComponents.ts
 var import_react73 = require("react");
-var useComponents = function() {
-    return (0, import_react73.useContext)(ComponentsContext);
-};
-// src/components/components/ComponentsProvider.tsx
 var import_jsx_runtime102 = require("react/jsx-runtime");
 var _excluded9 = [
     "children"
@@ -50948,6 +51035,7 @@ var AssistantProvider = function(t0) {
     MarkdownContext: MarkdownContext,
     MarkdownProvider: MarkdownProvider,
     MessageContent: MessageContent,
+    MessageGroup: MessageGroup,
     RunStep: RunStep,
     SourceAnnotation: SourceAnnotation,
     Suggestions: Suggestions,