@superinterface/react 2.16.4 → 2.17.0

package/dist/index.js

@@ -414,7 +414,7 @@ var SuperinterfaceProvider = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/index.tsx
-import { Flex as Flex13 } from "@radix-ui/themes";
+import { Flex as Flex14 } from "@radix-ui/themes";
 // src/components/threads/Thread/Messages/Content/index.tsx
 import { useEffect } from "react";
 // src/hooks/messages/useMessages/index.tsx
@@ -787,7 +787,7 @@ var UserAvatar = function() {
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
-import { Flex as Flex11 } from "@radix-ui/themes";
+import { Flex as Flex12 } from "@radix-ui/themes";
 // src/components/threads/Thread/Message/index.tsx
 import { useMemo as useMemo5, Fragment } from "react";
 import { isEmpty } from "radash";
@@ -863,34 +863,36 @@ var ToolCallIcon = function(param) {
         return /* @__PURE__ */ jsx12(CircleIcon, {});
     }
 };
-// src/components/functions/FunctionBase/Content.tsx
+// src/components/functions/FunctionBase/Content/index.tsx
 import { useMemo as useMemo3 } from "react";
 import { Code, Box as Box2 } from "@radix-ui/themes";
+// src/components/functions/FunctionBase/Content/lib/formattedJsonOrRaw.ts
+var formattedJsonOrRaw = function(param) {
+    var value = param.value;
+    if (!value) {
+        return null;
+    }
+    try {
+        return JSON.stringify(JSON.parse(value), null, 2);
+    } catch (error) {
+        return value;
+    }
+};
+// src/components/functions/FunctionBase/Content/index.tsx
 import { jsx as jsx13, jsxs as jsxs2 } from "react/jsx-runtime";
 var Content = function(param) {
     var fn = param.fn;
     var args = useMemo3(function() {
-        var result = null;
-        try {
-            result = JSON.parse(fn.arguments);
-        } catch (error) {
-            console.error(error);
-        }
-        return result;
+        return formattedJsonOrRaw({
+            value: fn.arguments
+        });
     }, [
         fn
     ]);
     var output = useMemo3(function() {
-        if (!fn.output) {
-            return null;
-        }
-        var result = null;
-        try {
-            result = JSON.parse(fn.output);
-        } catch (error) {
-            console.error(error);
-        }
-        return result;
+        return formattedJsonOrRaw({
+            value: fn.output
+        });
     }, [
         fn
     ]);
@@ -906,10 +908,10 @@ var Content = function(param) {
         },
         children: [
             /* @__PURE__ */ jsx13(Box2, {
-                children: args && JSON.stringify(args, null, 2)
+                children: args
             }),
             /* @__PURE__ */ jsx13(Box2, {
-                children: output && JSON.stringify(output, null, 2)
+                children: output
             })
         ]
     });
@@ -1289,6 +1291,54 @@ var Img = function(props) {
         }))
     });
 };
+// src/contexts/markdown/MarkdownContext/lib/components/Annotation/index.tsx
+import { QuoteIcon, FileIcon } from "@radix-ui/react-icons";
+// src/contexts/markdown/MarkdownContext/lib/components/Annotation/AnnotationBase.tsx
+import { IconButton, Popover as Popover3, Flex as Flex10, Text as Text5 } from "@radix-ui/themes";
+import { jsx as jsx34, jsxs as jsxs9 } from "react/jsx-runtime";
+var AnnotationBase = function(param) {
+    var icon = param.icon, content = param.content;
+    return /* @__PURE__ */ jsxs9(Popover3.Root, {
+        children: [
+            /* @__PURE__ */ jsx34(Popover3.Trigger, {
+                children: /* @__PURE__ */ jsx34(IconButton, {
+                    variant: "soft",
+                    color: "gray",
+                    size: "1",
+                    children: icon
+                })
+            }),
+            /* @__PURE__ */ jsx34(Popover3.Content, {
+                size: "1",
+                children: /* @__PURE__ */ jsx34(Flex10, {
+                    direction: "column",
+                    children: /* @__PURE__ */ jsx34(Text5, {
+                        size: "1",
+                        color: "gray",
+                        children: content
+                    })
+                })
+            })
+        ]
+    });
+};
+// src/contexts/markdown/MarkdownContext/lib/components/Annotation/index.tsx
+import { jsx as jsx35 } from "react/jsx-runtime";
+var Annotation = function(param) {
+    var annotation = param.annotation;
+    if (annotation.type === "file_citation") {
+        return /* @__PURE__ */ jsx35(AnnotationBase, {
+            icon: /* @__PURE__ */ jsx35(QuoteIcon, {}),
+            content: "File cited."
+        });
+    } else if (annotation.type === "file_path") {
+        return /* @__PURE__ */ jsx35(AnnotationBase, {
+            icon: /* @__PURE__ */ jsx35(FileIcon, {}),
+            content: "File generated."
+        });
+    }
+    return null;
+};
 // src/contexts/markdown/MarkdownContext/lib/components/index.tsx
 var components = {
     p: Paragraph,
@@ -1299,41 +1349,143 @@ var components = {
     li: ListItem,
     pre: Pre,
     code: Code2,
-    img: Img
+    img: Img,
+    annotation: Annotation
+};
+// src/lib/remark/remarkAnnotation.ts
+import { visit, SKIP } from "unist-util-visit";
+var remarkAnnotation = function(param) {
+    var content = param.content;
+    return function() {
+        return function(tree) {
+            visit(tree, "text", function(node, index, parent) {
+                if (content.text.annotations.length > 0) {
+                    content.text.annotations.forEach(function(annotation) {
+                        var _parent_children;
+                        var _node_position_start, _node_position, _node_position_end, _node_position1;
+                        if (!((_node_position = node.position) === null || _node_position === void 0 ? void 0 : (_node_position_start = _node_position.start) === null || _node_position_start === void 0 ? void 0 : _node_position_start.offset)) return;
+                        if (!((_node_position1 = node.position) === null || _node_position1 === void 0 ? void 0 : (_node_position_end = _node_position1.end) === null || _node_position_end === void 0 ? void 0 : _node_position_end.offset)) return;
+                        if (node.position.start.offset > annotation.start_index) {
+                            return;
+                        }
+                        if (node.position.end.offset < annotation.end_index) {
+                            return;
+                        }
+                        var beforeStart = node.position.start.offset;
+                        var beforeEnd = annotation.start_index;
+                        var annotationStart = annotation.start_index;
+                        var annotationEnd = annotation.end_index;
+                        var afterStart = annotation.end_index;
+                        var afterEnd = node.position.end.offset;
+                        var before = node.value.slice(0, annotation.start_index - node.position.start.offset);
+                        var annotatedText = node.value.slice(annotation.start_index - node.position.start.offset, annotation.end_index - node.position.start.offset);
+                        var after = node.value.slice(annotation.end_index - node.position.start.offset);
+                        var newNodes = [];
+                        if (before) {
+                            newNodes.push({
+                                type: "text",
+                                value: before,
+                                position: {
+                                    start: {
+                                        offset: beforeStart
+                                    },
+                                    end: {
+                                        offset: beforeEnd
+                                    }
+                                }
+                            });
+                        }
+                        newNodes.push({
+                            value: annotatedText,
+                            data: {
+                                hName: "annotation",
+                                hProperties: {
+                                    annotation: annotation
+                                }
+                            },
+                            position: {
+                                start: {
+                                    offset: annotationStart
+                                },
+                                end: {
+                                    offset: annotationEnd
+                                }
+                            }
+                        });
+                        if (after) {
+                            newNodes.push({
+                                type: "text",
+                                value: after,
+                                position: {
+                                    start: {
+                                        offset: afterStart
+                                    },
+                                    end: {
+                                        offset: afterEnd
+                                    }
+                                }
+                            });
+                        }
+                        (_parent_children = parent.children).splice.apply(_parent_children, [
+                            index,
+                            1
+                        ].concat(_to_consumable_array(newNodes)));
+                    });
+                    return SKIP;
+                }
+                return;
+            });
+        };
+    };
+};
+// src/contexts/markdown/MarkdownContext/lib/getRemarkPlugins.ts
+var getRemarkPlugins = function(param) {
+    var content = param.content;
+    return [
+        remarkAnnotation({
+            content: content
+        })
+    ];
 };
 // src/contexts/markdown/MarkdownContext/index.ts
 var MarkdownContext = createContext9({
-    components: components
+    components: components,
+    getRemarkPlugins: getRemarkPlugins
 });
 // src/hooks/markdown/useMarkdownContext/index.ts
 var useMarkdownContext = function() {
     return useContext7(MarkdownContext);
 };
 // src/components/threads/Thread/Message/TextContent.tsx
-import { jsx as jsx34 } from "react/jsx-runtime";
+import { jsx as jsx36 } from "react/jsx-runtime";
 var TextContent = function(param) {
     var content = param.content;
-    var markdownContext = useMarkdownContext();
-    return /* @__PURE__ */ jsx34(Markdown, _object_spread_props(_object_spread({}, markdownContext), {
+    var _useMarkdownContext = useMarkdownContext(), getRemarkPlugins2 = _useMarkdownContext.getRemarkPlugins, rest = _object_without_properties(_useMarkdownContext, [
+        "getRemarkPlugins"
+    ]);
+    return /* @__PURE__ */ jsx36(Markdown, _object_spread_props(_object_spread({}, rest), {
+        remarkPlugins: getRemarkPlugins2({
+            content: content
+        }),
         children: content.text.value
     }));
 };
 // src/components/threads/Thread/Message/Attachments/index.tsx
-import { Flex as Flex10, Badge } from "@radix-ui/themes";
-import { FileIcon } from "@radix-ui/react-icons";
-import { jsx as jsx35, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Flex as Flex11, Badge } from "@radix-ui/themes";
+import { FileIcon as FileIcon2 } from "@radix-ui/react-icons";
+import { jsx as jsx37, jsxs as jsxs10 } from "react/jsx-runtime";
 var Attachments = function(param) {
     var message = param.message;
     var _message_attachments;
     if (!((_message_attachments = message.attachments) === null || _message_attachments === void 0 ? void 0 : _message_attachments.length)) return null;
-    return /* @__PURE__ */ jsx35(Flex10, {
+    return /* @__PURE__ */ jsx37(Flex11, {
         align: "start",
         pb: "1",
-        children: /* @__PURE__ */ jsxs9(Badge, {
+        children: /* @__PURE__ */ jsxs10(Badge, {
             color: "gray",
             variant: "surface",
             children: [
-                /* @__PURE__ */ jsx35(FileIcon, {}),
+                /* @__PURE__ */ jsx37(FileIcon2, {}),
                 message.attachments.length,
                 " file",
                 message.attachments.length > 1 ? "s" : ""
@@ -1342,7 +1494,7 @@ var Attachments = function(param) {
     });
 };
 // src/components/threads/Thread/Message/index.tsx
-import { jsx as jsx36, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs11 } from "react/jsx-runtime";
 var Message = function(param) {
     var message = param.message;
     var _useMemo5 = _sliced_to_array(useMemo5(function() {
@@ -1387,68 +1539,68 @@ var Message = function(param) {
     }, [
         message
     ]);
-    return /* @__PURE__ */ jsx36(Provider, {
+    return /* @__PURE__ */ jsx38(Provider, {
         value: {
             message: message
         },
-        children: /* @__PURE__ */ jsxs10(Box9, {
+        children: /* @__PURE__ */ jsxs11(Box9, {
             children: [
-                /* @__PURE__ */ jsx36(RunSteps, {
+                /* @__PURE__ */ jsx38(RunSteps, {
                     runSteps: olderRunSteps
                 }),
-                /* @__PURE__ */ jsxs10(Box9, {
+                /* @__PURE__ */ jsxs11(Box9, {
                     children: [
-                        /* @__PURE__ */ jsx36(Attachments, {
+                        /* @__PURE__ */ jsx38(Attachments, {
                             message: message
                         }),
                         message.content.map(function(content, index) {
-                            return /* @__PURE__ */ jsx36(Fragment, {
-                                children: content.type === "text" && /* @__PURE__ */ jsx36(TextContent, {
+                            return /* @__PURE__ */ jsx38(Fragment, {
+                                children: content.type === "text" && /* @__PURE__ */ jsx38(TextContent, {
                                     content: content
                                 })
                             }, index);
                         }),
-                        isInProgress && isEmpty(laterRunSteps) && /* @__PURE__ */ jsx36(StartingContentSkeleton, {})
+                        isInProgress && isEmpty(laterRunSteps) && /* @__PURE__ */ jsx38(StartingContentSkeleton, {})
                     ]
                 }),
-                /* @__PURE__ */ jsx36(RunSteps, {
+                /* @__PURE__ */ jsx38(RunSteps, {
                     runSteps: laterRunSteps
                 }),
-                isInProgress && !isEmpty(laterRunSteps) && /* @__PURE__ */ jsx36(Box9, {
-                    children: /* @__PURE__ */ jsx36(StartingContentSkeleton, {})
+                isInProgress && !isEmpty(laterRunSteps) && /* @__PURE__ */ jsx38(Box9, {
+                    children: /* @__PURE__ */ jsx38(StartingContentSkeleton, {})
                 })
             ]
         })
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/Content/index.tsx
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 var Content2 = function(param) {
     var messageGroup = param.messageGroup;
-    return /* @__PURE__ */ jsx37(Flex11, {
+    return /* @__PURE__ */ jsx39(Flex12, {
         direction: "column-reverse",
         children: messageGroup.messages.map(function(message) {
-            return /* @__PURE__ */ jsx37(Message, {
+            return /* @__PURE__ */ jsx39(Message, {
                 message: message
             }, message.id);
         })
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-import { jsx as jsx38, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs12 } from "react/jsx-runtime";
 var MessageGroup = function(param) {
     var messageGroup = param.messageGroup;
     var assistantNameContext = useContext8(AssistantNameContext);
-    return /* @__PURE__ */ jsxs11(MessageGroupBase, {
+    return /* @__PURE__ */ jsxs12(MessageGroupBase, {
         children: [
-            messageGroup.role === "user" ? /* @__PURE__ */ jsx38(UserAvatar, {}) : /* @__PURE__ */ jsx38(AssistantAvatar, {}),
-            /* @__PURE__ */ jsxs11(Box10, {
+            messageGroup.role === "user" ? /* @__PURE__ */ jsx40(UserAvatar, {}) : /* @__PURE__ */ jsx40(AssistantAvatar, {}),
+            /* @__PURE__ */ jsxs12(Box10, {
                 flexGrow: "1",
                 children: [
-                    /* @__PURE__ */ jsx38(Name, {
+                    /* @__PURE__ */ jsx40(Name, {
                         children: messageGroup.role === "user" ? "You" : assistantNameContext
                     }),
-                    /* @__PURE__ */ jsx38(Content2, {
+                    /* @__PURE__ */ jsx40(Content2, {
                         messageGroup: messageGroup
                     })
                 ]
@@ -1457,7 +1609,7 @@ var MessageGroup = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/index.tsx
-import { Fragment as Fragment2, jsx as jsx39 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx41 } from "react/jsx-runtime";
 var Content3 = function() {
     var _useMessages = useMessages(), messages2 = _useMessages.messages, isLoading = _useMessages.isLoading, isLoadingError = _useMessages.isLoadingError;
     var addToast = useToasts().addToast;
@@ -1476,11 +1628,11 @@ var Content3 = function() {
         addToast
     ]);
     if (isLoading || isLoadingError) {
-        return /* @__PURE__ */ jsx39(MessagesSkeleton, {});
+        return /* @__PURE__ */ jsx41(MessagesSkeleton, {});
     }
-    return /* @__PURE__ */ jsx39(Fragment2, {
+    return /* @__PURE__ */ jsx41(Fragment2, {
         children: messageGroups2.map(function(messageGroup) {
-            return /* @__PURE__ */ jsx39(MessageGroup, {
+            return /* @__PURE__ */ jsx41(MessageGroup, {
                 messageGroup: messageGroup
             }, messageGroup.id);
         })
@@ -1491,20 +1643,20 @@ import { useMemo as useMemo7 } from "react";
 // src/components/skeletons/StartingSkeleton/index.tsx
 import { useContext as useContext9 } from "react";
 import { Box as Box11 } from "@radix-ui/themes";
-import { jsx as jsx40, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs13 } from "react/jsx-runtime";
 var StartingSkeleton = function(param) {
     var children = param.children;
     var assistantNameContext = useContext9(AssistantNameContext);
-    return /* @__PURE__ */ jsxs12(MessageGroupBase, {
+    return /* @__PURE__ */ jsxs13(MessageGroupBase, {
         children: [
-            /* @__PURE__ */ jsx40(AssistantAvatar, {}),
-            /* @__PURE__ */ jsxs12(Box11, {
+            /* @__PURE__ */ jsx42(AssistantAvatar, {}),
+            /* @__PURE__ */ jsxs13(Box11, {
                 children: [
-                    /* @__PURE__ */ jsx40(Name, {
+                    /* @__PURE__ */ jsx42(Name, {
                         children: assistantNameContext
                     }),
                     children,
-                    /* @__PURE__ */ jsx40(StartingContentSkeleton, {})
+                    /* @__PURE__ */ jsx42(StartingContentSkeleton, {})
                 ]
             })
         ]
@@ -1529,7 +1681,7 @@ var isOptimistic = function(param) {
     return _4.startsWith(id, "-");
 };
 // src/components/threads/Thread/Messages/Progress/index.tsx
-import { jsx as jsx41 } from "react/jsx-runtime";
+import { jsx as jsx43 } from "react/jsx-runtime";
 var Progress = function() {
     var latestMessage = useLatestMessage().latestMessage;
     var isMutatingMessage = useIsMutatingMessage();
@@ -1547,10 +1699,10 @@ var Progress = function() {
         isMutatingMessage
     ]);
     if (!isVisible) return null;
-    return /* @__PURE__ */ jsx41(StartingSkeleton, {});
+    return /* @__PURE__ */ jsx43(StartingSkeleton, {});
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
-import { Flex as Flex12 } from "@radix-ui/themes";
+import { Flex as Flex13 } from "@radix-ui/themes";
 // src/hooks/misc/useInfiniteScroll/index.tsx
 import { useRef as useRef3 } from "react";
 import { useInView } from "react-intersection-observer";
@@ -1606,7 +1758,7 @@ var useInfiniteScroll = function(param) {
     };
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
-import { jsx as jsx42, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs14 } from "react/jsx-runtime";
 var Root2 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var _useMessages = useMessages(), isFetchingNextPage = _useMessages.isFetchingNextPage, hasNextPage = _useMessages.hasNextPage, fetchNextPage = _useMessages.fetchNextPage;
@@ -1615,7 +1767,7 @@ var Root2 = function(param) {
         hasNextPage: hasNextPage,
         fetchNextPage: fetchNextPage
     }), containerRef = _useInfiniteScroll.containerRef, loaderRef = _useInfiniteScroll.loaderRef;
-    return /* @__PURE__ */ jsxs13(Flex12, {
+    return /* @__PURE__ */ jsxs14(Flex13, {
         ref: containerRef,
         direction: "column-reverse",
         flexGrow: "1",
@@ -1624,10 +1776,10 @@ var Root2 = function(param) {
         }),
         children: [
             children,
-            hasNextPage && /* @__PURE__ */ jsx42(Flex12, {
+            hasNextPage && /* @__PURE__ */ jsx44(Flex13, {
                 ref: loaderRef
             }),
-            /* @__PURE__ */ jsx42(Flex12, {
+            /* @__PURE__ */ jsx44(Flex13, {
                 flexShrink: "0",
                 flexGrow: "1"
             })
@@ -1635,30 +1787,30 @@ var Root2 = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/NextPageSkeleton.tsx
-import { jsx as jsx43 } from "react/jsx-runtime";
+import { jsx as jsx45 } from "react/jsx-runtime";
 var NextPageSkeleton = function() {
     var hasNextPage = useMessages().hasNextPage;
     if (!hasNextPage) {
         return null;
     }
-    return /* @__PURE__ */ jsx43(MessagesSkeleton, {});
+    return /* @__PURE__ */ jsx45(MessagesSkeleton, {});
 };
 // src/components/threads/Thread/Messages/index.tsx
-import { jsx as jsx44, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs15 } from "react/jsx-runtime";
 var Messages = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ jsxs14(Root2, {
+    return /* @__PURE__ */ jsxs15(Root2, {
         style: style,
         children: [
-            /* @__PURE__ */ jsx44(Flex13, {
+            /* @__PURE__ */ jsx46(Flex14, {
                 flexShrink: "0",
                 height: "var(--space-3)"
             }),
-            /* @__PURE__ */ jsx44(Progress, {}),
+            /* @__PURE__ */ jsx46(Progress, {}),
             children,
-            /* @__PURE__ */ jsx44(Content3, {}),
-            /* @__PURE__ */ jsx44(NextPageSkeleton, {}),
-            /* @__PURE__ */ jsx44(Flex13, {
+            /* @__PURE__ */ jsx46(Content3, {}),
+            /* @__PURE__ */ jsx46(NextPageSkeleton, {}),
+            /* @__PURE__ */ jsx46(Flex14, {
                 flexShrink: "0",
                 flexGrow: "1"
             })
@@ -1670,7 +1822,7 @@ Messages.Message = Message;
 Messages.NextPageSkeleton = NextPageSkeleton;
 // src/components/threads/Thread/MessageForm/Submit/index.tsx
 import { ArrowUpIcon, StopIcon } from "@radix-ui/react-icons";
-import { IconButton, Flex as Flex14 } from "@radix-ui/themes";
+import { IconButton as IconButton2, Flex as Flex15 } from "@radix-ui/themes";
 // src/hooks/messages/useMessageFormContext/index.ts
 import { useContext as useContext10 } from "react";
 // src/contexts/messages/MessageFormContext/index.ts
@@ -1687,10 +1839,10 @@ var useMessageFormContext = function() {
     return useContext10(MessageFormContext);
 };
 // src/components/threads/Thread/MessageForm/Submit/index.tsx
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx47 } from "react/jsx-runtime";
 var Root3 = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx45(Flex14, {
+    return /* @__PURE__ */ jsx47(Flex15, {
         flexShrink: "0",
         align: "end",
         children: children
@@ -1700,24 +1852,24 @@ var Button2 = function() {
     var superinterfaceContext = useSuperinterfaceContext();
     var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading, isFileLoading = _useMessageFormContext.isFileLoading;
     if (isLoading) {
-        return /* @__PURE__ */ jsx45(IconButton, {
+        return /* @__PURE__ */ jsx47(IconButton2, {
             type: "button",
             onClick: function() {
                 var _superinterfaceContext_createMessageAbortControllerRef_current;
                 return (_superinterfaceContext_createMessageAbortControllerRef_current = superinterfaceContext.createMessageAbortControllerRef.current) === null || _superinterfaceContext_createMessageAbortControllerRef_current === void 0 ? void 0 : _superinterfaceContext_createMessageAbortControllerRef_current.abort();
             },
-            children: /* @__PURE__ */ jsx45(StopIcon, {})
+            children: /* @__PURE__ */ jsx47(StopIcon, {})
         });
     }
-    return /* @__PURE__ */ jsx45(IconButton, {
+    return /* @__PURE__ */ jsx47(IconButton2, {
         type: "submit",
         disabled: isDisabled || isFileLoading,
-        children: /* @__PURE__ */ jsx45(ArrowUpIcon, {})
+        children: /* @__PURE__ */ jsx47(ArrowUpIcon, {})
     });
 };
 var Submit = function() {
-    return /* @__PURE__ */ jsx45(Root3, {
-        children: /* @__PURE__ */ jsx45(Button2, {})
+    return /* @__PURE__ */ jsx47(Root3, {
+        children: /* @__PURE__ */ jsx47(Button2, {})
     });
 };
 Submit.Root = Root3;
@@ -2349,7 +2501,7 @@ var formOptions = {
 };
 // src/components/threads/Thread/MessageForm/Root/index.tsx
 import { partob as partob2 } from "radash";
-import { jsx as jsx46 } from "react/jsx-runtime";
+import { jsx as jsx48 } from "react/jsx-runtime";
 var Root4 = function(param) {
     var children = param.children, onSubmitArg = param.onSubmit;
     var _useState = _sliced_to_array(useState([]), 2), files = _useState[0], setFiles = _useState[1];
@@ -2458,7 +2610,7 @@ var Root4 = function(param) {
             return _ref.apply(this, arguments);
         };
     }();
-    return /* @__PURE__ */ jsx46(MessageFormContext.Provider, {
+    return /* @__PURE__ */ jsx48(MessageFormContext.Provider, {
         value: {
             isDisabled: isDisabled,
             isLoading: isLoading,
@@ -2466,11 +2618,11 @@ var Root4 = function(param) {
             setFiles: setFiles,
             isFileLoading: isFileLoading
         },
-        children: /* @__PURE__ */ jsx46(FormProvider, _object_spread_props(_object_spread({}, formProps), {
-            children: /* @__PURE__ */ jsx46(Box12, {
+        children: /* @__PURE__ */ jsx48(FormProvider, _object_spread_props(_object_spread({}, formProps), {
+            children: /* @__PURE__ */ jsx48(Box12, {
                 asChild: true,
                 flexShrink: "0",
-                children: /* @__PURE__ */ jsx46("form", {
+                children: /* @__PURE__ */ jsx48("form", {
                     onSubmit: handleSubmit(onSubmit),
                     children: children
                 })
@@ -2480,23 +2632,23 @@ var Root4 = function(param) {
 };
 // src/components/threads/Thread/MessageForm/Field/index.tsx
 import { useFormContext as useFormContext2 } from "react-hook-form";
-import { Container as RadixContainer, Flex as Flex18 } from "@radix-ui/themes";
+import { Container as RadixContainer, Flex as Flex19 } from "@radix-ui/themes";
 // src/components/threads/Thread/MessageForm/Field/Control.tsx
-import { Flex as Flex15 } from "@radix-ui/themes";
+import { Flex as Flex16 } from "@radix-ui/themes";
 import { useFormContext } from "react-hook-form";
 import { usePrevious } from "react-use";
 import { useContext as useContext11, useMemo as useMemo9, useRef as useRef4, useEffect as useEffect3 } from "react";
 // src/components/textareas/TextareaBase/index.tsx
 import { forwardRef as forwardRef3 } from "react";
 import TextareaAutosize from "react-textarea-autosize";
-import { Fragment as Fragment3, jsx as jsx47, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx49, jsxs as jsxs16 } from "react/jsx-runtime";
 var TextareaBase = forwardRef3(function TextareaBase2(props, ref) {
-    return /* @__PURE__ */ jsxs15(Fragment3, {
+    return /* @__PURE__ */ jsxs16(Fragment3, {
         children: [
-            /* @__PURE__ */ jsx47("style", {
+            /* @__PURE__ */ jsx49("style", {
                 children: ".superinterface-textarea { min-height: inherit; height: 30px; }\n.superinterface-textarea::placeholder { color: var(--gray-a10); }"
             }),
-            /* @__PURE__ */ jsx47(TextareaAutosize, _object_spread({
+            /* @__PURE__ */ jsx49(TextareaAutosize, _object_spread({
                 ref: ref,
                 className: "rt-reset superinterface-textarea",
                 style: {
@@ -2513,10 +2665,10 @@ var TextareaBase = forwardRef3(function TextareaBase2(props, ref) {
     });
 });
 // src/components/threads/Thread/MessageForm/Field/Control.tsx
-import { jsx as jsx48 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 var Root5 = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx48(Flex15, {
+    return /* @__PURE__ */ jsx50(Flex16, {
         flexGrow: "1",
         pt: "4px",
         children: children
@@ -2545,7 +2697,7 @@ var Input = function() {
         isDisabledPrevious,
         textareaProps
     ]);
-    return /* @__PURE__ */ jsx48(TextareaBase, _object_spread_props(_object_spread({
+    return /* @__PURE__ */ jsx50(TextareaBase, _object_spread_props(_object_spread({
         minRows: 1,
         placeholder: "Message ".concat(assistantNameContext, "..."),
         disabled: isDisabled,
@@ -2565,51 +2717,51 @@ var Input = function() {
     }));
 };
 var Control = function() {
-    return /* @__PURE__ */ jsx48(Root5, {
-        children: /* @__PURE__ */ jsx48(Input, {})
+    return /* @__PURE__ */ jsx50(Root5, {
+        children: /* @__PURE__ */ jsx50(Input, {})
     });
 };
 Control.Root = Root5;
 Control.Input = Input;
 // src/components/threads/Thread/MessageForm/Field/Files/Preview.tsx
-import { Flex as Flex16, Card as Card2, Spinner, Text as Text6, IconButton as IconButton2 } from "@radix-ui/themes";
-import { FileIcon as FileIcon2, Cross2Icon } from "@radix-ui/react-icons";
-import { jsx as jsx49, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Flex as Flex17, Card as Card2, Spinner, Text as Text7, IconButton as IconButton3 } from "@radix-ui/themes";
+import { FileIcon as FileIcon3, Cross2Icon } from "@radix-ui/react-icons";
+import { jsx as jsx51, jsxs as jsxs17 } from "react/jsx-runtime";
 var Preview = function() {
     var _useMessageFormContext = useMessageFormContext(), files = _useMessageFormContext.files, setFiles = _useMessageFormContext.setFiles;
     if (!files.length) {
         return null;
     }
-    return /* @__PURE__ */ jsx49(Flex16, {
+    return /* @__PURE__ */ jsx51(Flex17, {
         flexBasis: "100%",
         direction: "column",
         pb: "2",
         gap: "1",
         children: files.map(function(file) {
-            return /* @__PURE__ */ jsx49(Card2, {
+            return /* @__PURE__ */ jsx51(Card2, {
                 variant: "ghost",
-                children: /* @__PURE__ */ jsxs16(Flex16, {
+                children: /* @__PURE__ */ jsxs17(Flex17, {
                     align: "center",
                     justify: "between",
                     gap: "1",
                     children: [
-                        /* @__PURE__ */ jsxs16(Flex16, {
+                        /* @__PURE__ */ jsxs17(Flex17, {
                             align: "center",
                             gap: "1",
                             flexShrink: "1",
                             minWidth: "0",
                             maxWidth: "250px",
                             children: [
-                                /* @__PURE__ */ jsx49(Flex16, {
+                                /* @__PURE__ */ jsx51(Flex17, {
                                     flexShrink: "0",
-                                    children: /* @__PURE__ */ jsx49(Spinner, {
+                                    children: /* @__PURE__ */ jsx51(Spinner, {
                                         loading: isOptimistic({
                                             id: file.id
                                         }),
-                                        children: /* @__PURE__ */ jsx49(FileIcon2, {})
+                                        children: /* @__PURE__ */ jsx51(FileIcon3, {})
                                     })
                                 }),
-                                /* @__PURE__ */ jsx49(Text6, {
+                                /* @__PURE__ */ jsx51(Text7, {
                                     size: "2",
                                     truncate: true,
                                     wrap: "nowrap",
@@ -2617,9 +2769,9 @@ var Preview = function() {
                                 })
                             ]
                         }),
-                        /* @__PURE__ */ jsx49(Flex16, {
+                        /* @__PURE__ */ jsx51(Flex17, {
                             flexShrink: "0",
-                            children: /* @__PURE__ */ jsx49(IconButton2, {
+                            children: /* @__PURE__ */ jsx51(IconButton3, {
                                 onClick: function() {
                                     return setFiles(function(prev) {
                                         return prev.filter(function(prevFile) {
@@ -2630,7 +2782,7 @@ var Preview = function() {
                                 color: "gray",
                                 variant: "ghost",
                                 size: "1",
-                                children: /* @__PURE__ */ jsx49(Cross2Icon, {})
+                                children: /* @__PURE__ */ jsx51(Cross2Icon, {})
                             })
                         })
                     ]
@@ -2644,7 +2796,7 @@ import { useCallback as useCallback2 } from "react";
 import { omit as omit4 } from "radash";
 import dayjs2 from "dayjs";
 import { FilePlusIcon } from "@radix-ui/react-icons";
-import { IconButton as IconButton3, Flex as Flex17 } from "@radix-ui/themes";
+import { IconButton as IconButton4, Flex as Flex18 } from "@radix-ui/themes";
 // src/hooks/files/useCreateFile/index.ts
 import { useMutation as useMutation2, useQueryClient as useQueryClient5 } from "@tanstack/react-query";
 // src/hooks/files/useCreateFile/lib/mutationOptions/mutationFn/body/formData.ts
@@ -2755,7 +2907,7 @@ var useCreateFile = function() {
     });
 };
 // src/components/threads/Thread/MessageForm/Field/Files/Control.tsx
-import { jsx as jsx50, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs18 } from "react/jsx-runtime";
 var accept = ".c,text/x-c,\n.cs,text/x-csharp,\n.cpp,text/x-c++,\n.doc,application/msword,\n.docx,application/vnd.openxmlformats-officedocument.wordprocessingml.document,\n.html,text/html,\n.java,text/x-java,\n.json,application/json,\n.md,text/markdown,\n.pdf,application/pdf,\n.php,text/x-php,\n.pptx,application/vnd.openxmlformats-officedocument.presentationml.presentation,\n.py,text/x-python,\n.py,text/x-script.python,\n.rb,text/x-ruby,\n.tex,text/x-tex,\n.txt,text/plain,\n.css,text/css,\n.js,text/javascript,\n.sh,application/x-sh,\n.ts,application/typescript";
 var Control2 = function() {
     var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading, setFiles = _useMessageFormContext.setFiles;
@@ -2929,11 +3081,11 @@ var Control2 = function() {
         createFile,
         setFiles
     ]);
-    return /* @__PURE__ */ jsx50(Flex17, {
+    return /* @__PURE__ */ jsx52(Flex18, {
         pt: "2",
         pr: "2",
         flexGrow: "0",
-        children: /* @__PURE__ */ jsxs17(IconButton3, {
+        children: /* @__PURE__ */ jsxs18(IconButton4, {
             type: "button",
             variant: "ghost",
             color: "gray",
@@ -2943,8 +3095,8 @@ var Control2 = function() {
                 overflow: "hidden"
             },
             children: [
-                /* @__PURE__ */ jsx50(FilePlusIcon, {}),
-                /* @__PURE__ */ jsx50("input", {
+                /* @__PURE__ */ jsx52(FilePlusIcon, {}),
+                /* @__PURE__ */ jsx52("input", {
                     type: "file",
                     multiple: true,
                     accept: accept,
@@ -2969,20 +3121,20 @@ var Files = {
     Control: Control2
 };
 // src/components/threads/Thread/MessageForm/Field/index.tsx
-import { jsx as jsx51 } from "react/jsx-runtime";
+import { jsx as jsx53 } from "react/jsx-runtime";
 var Root6 = function(param) {
     var children = param.children;
     var _useFormContext2 = useFormContext2(), errors = _useFormContext2.formState.errors;
-    return /* @__PURE__ */ jsx51(RadixContainer, {
+    return /* @__PURE__ */ jsx53(RadixContainer, {
         size: "2",
         flexGrow: "0",
-        children: /* @__PURE__ */ jsx51(Flex18, {
+        children: /* @__PURE__ */ jsx53(Flex19, {
             direction: "column",
             flexShrink: "0",
-            children: /* @__PURE__ */ jsx51(Flex18, {
+            children: /* @__PURE__ */ jsx53(Flex19, {
                 direction: "column",
                 flexShrink: "0",
-                children: /* @__PURE__ */ jsx51(Flex18, {
+                children: /* @__PURE__ */ jsx53(Flex19, {
                     style: _object_spread({
                         borderRadius: "var(--radius-2)",
                         borderWidth: "1px",
@@ -3006,13 +3158,13 @@ var Field = {
     Files: Files
 };
 // src/components/threads/Thread/MessageForm/index.tsx
-import { jsx as jsx52, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs19 } from "react/jsx-runtime";
 var MessageForm = function() {
-    return /* @__PURE__ */ jsx52(Root4, {
-        children: /* @__PURE__ */ jsxs18(Field.Root, {
+    return /* @__PURE__ */ jsx54(Root4, {
+        children: /* @__PURE__ */ jsxs19(Field.Root, {
             children: [
-                /* @__PURE__ */ jsx52(Field.Control, {}),
-                /* @__PURE__ */ jsx52(Submit, {})
+                /* @__PURE__ */ jsx54(Field.Control, {}),
+                /* @__PURE__ */ jsx54(Submit, {})
             ]
         })
     });
@@ -3021,17 +3173,17 @@ MessageForm.Root = Root4;
 MessageForm.Field = Field;
 MessageForm.Submit = Submit;
 // src/components/threads/Thread/Root/index.tsx
-import { Flex as Flex19 } from "@radix-ui/themes";
+import { Flex as Flex20 } from "@radix-ui/themes";
 // src/components/threads/Thread/Provider/index.tsx
 var Provider2 = SuperinterfaceProvider;
 // src/components/threads/Thread/Root/index.tsx
-import { jsx as jsx53 } from "react/jsx-runtime";
+import { jsx as jsx55 } from "react/jsx-runtime";
 var Root7 = function(_param) {
     var children = _param.children, rest = _object_without_properties(_param, [
         "children"
     ]);
-    return /* @__PURE__ */ jsx53(Provider2, _object_spread_props(_object_spread({}, rest), {
-        children: /* @__PURE__ */ jsx53(Flex19, {
+    return /* @__PURE__ */ jsx55(Provider2, _object_spread_props(_object_spread({}, rest), {
+        children: /* @__PURE__ */ jsx55(Flex20, {
             direction: "column",
             flexGrow: "1",
             children: children
@@ -3039,12 +3191,12 @@ var Root7 = function(_param) {
     }));
 };
 // src/components/threads/Thread/index.tsx
-import { jsx as jsx54, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs20 } from "react/jsx-runtime";
 var Thread = function(props) {
-    return /* @__PURE__ */ jsxs19(Root7, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ jsxs20(Root7, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ jsx54(Messages, {}),
-            /* @__PURE__ */ jsx54(MessageForm, {})
+            /* @__PURE__ */ jsx56(Messages, {}),
+            /* @__PURE__ */ jsx56(MessageForm, {})
         ]
     }));
 };
@@ -3070,12 +3222,12 @@ var useThreadDialogContext = function() {
     return useContext13(ThreadDialogContext);
 };
 // src/components/threads/ThreadDialog/Provider/index.tsx
-import { jsx as jsx55 } from "react/jsx-runtime";
+import { jsx as jsx57 } from "react/jsx-runtime";
 var Provider3 = function(param) {
     var children = param.children;
     var threadDialogContext = useThreadDialogContext();
     var _useState2 = _sliced_to_array(useState2(threadDialogContext.isOpen), 2), isOpen = _useState2[0], setIsOpen = _useState2[1];
-    return /* @__PURE__ */ jsx55(ThreadDialogContext.Provider, {
+    return /* @__PURE__ */ jsx57(ThreadDialogContext.Provider, {
         value: {
             isOpen: isOpen,
             setIsOpen: setIsOpen
@@ -3088,27 +3240,27 @@ import { useState as useState3, useCallback as useCallback3 } from "react";
 import * as Toast2 from "@radix-ui/react-toast";
 // src/components/toasts/ToastsProvider/CustomToast.tsx
 import * as Toast from "@radix-ui/react-toast";
-import { Card as Card3, Text as Text7, Flex as Flex20 } from "@radix-ui/themes";
+import { Card as Card3, Text as Text8, Flex as Flex21 } from "@radix-ui/themes";
 import { CheckCircledIcon as CheckCircledIcon2, CrossCircledIcon } from "@radix-ui/react-icons";
-import { jsx as jsx56, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs21 } from "react/jsx-runtime";
 var CustomToast = function(param) {
     var toast = param.toast;
-    return /* @__PURE__ */ jsx56(Toast.Root, {
-        children: /* @__PURE__ */ jsx56(Card3, {
-            children: /* @__PURE__ */ jsx56(Toast.Title, {
-                children: /* @__PURE__ */ jsxs20(Flex20, {
+    return /* @__PURE__ */ jsx58(Toast.Root, {
+        children: /* @__PURE__ */ jsx58(Card3, {
+            children: /* @__PURE__ */ jsx58(Toast.Title, {
+                children: /* @__PURE__ */ jsxs21(Flex21, {
                     children: [
-                        /* @__PURE__ */ jsx56(Flex20, {
+                        /* @__PURE__ */ jsx58(Flex21, {
                             pr: "2",
                             height: "14px",
                             align: "center",
-                            children: toast.type === "success" ? /* @__PURE__ */ jsx56(CheckCircledIcon2, {
+                            children: toast.type === "success" ? /* @__PURE__ */ jsx58(CheckCircledIcon2, {
                                 color: "var(--accent-9)"
-                            }) : /* @__PURE__ */ jsx56(CrossCircledIcon, {
+                            }) : /* @__PURE__ */ jsx58(CrossCircledIcon, {
                                 color: "var(--red-9)"
                             })
                         }),
-                        /* @__PURE__ */ jsx56(Text7, {
+                        /* @__PURE__ */ jsx58(Text8, {
                             weight: "medium",
                             size: "1",
                             children: toast.message
@@ -3120,7 +3272,7 @@ var CustomToast = function(param) {
     });
 };
 // src/components/toasts/ToastsProvider/index.tsx
-import { jsx as jsx57, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs22 } from "react/jsx-runtime";
 var ToastsProvider = function(param) {
     var children = param.children;
     var _useState3 = _sliced_to_array(useState3([]), 2), toasts = _useState3[0], setToasts = _useState3[1];
@@ -3131,20 +3283,20 @@ var ToastsProvider = function(param) {
             ]);
         });
     }, []);
-    return /* @__PURE__ */ jsx57(ToastsContext.Provider, {
+    return /* @__PURE__ */ jsx59(ToastsContext.Provider, {
         value: {
             toasts: toasts,
             addToast: addToast
         },
-        children: /* @__PURE__ */ jsxs21(Toast2.Provider, {
+        children: /* @__PURE__ */ jsxs22(Toast2.Provider, {
             children: [
                 children,
                 Array.from(toasts).map(function(toast, index) {
-                    return /* @__PURE__ */ jsx57(CustomToast, {
+                    return /* @__PURE__ */ jsx59(CustomToast, {
                         toast: toast
                     }, index);
                 }),
-                /* @__PURE__ */ jsx57(Toast2.Viewport, {
+                /* @__PURE__ */ jsx59(Toast2.Viewport, {
                     style: {
                         position: "absolute",
                         bottom: 0,
@@ -3166,34 +3318,34 @@ var ToastsProvider = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Root/index.tsx
-import { jsx as jsx58 } from "react/jsx-runtime";
+import { jsx as jsx60 } from "react/jsx-runtime";
 var Root9 = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx58(ToastsProvider, {
-        children: /* @__PURE__ */ jsx58(Provider3, {
+    return /* @__PURE__ */ jsx60(ToastsProvider, {
+        children: /* @__PURE__ */ jsx60(Provider3, {
             children: children
         })
     });
 };
 // src/components/threads/ThreadDialog/Trigger/index.tsx
-import { Flex as Flex21 } from "@radix-ui/themes";
+import { Flex as Flex22 } from "@radix-ui/themes";
 // src/components/threads/ThreadDialog/Trigger/Button.tsx
-import { IconButton as IconButton4 } from "@radix-ui/themes";
+import { IconButton as IconButton5 } from "@radix-ui/themes";
 import { ChatBubbleIcon } from "@radix-ui/react-icons";
-import { jsx as jsx59 } from "react/jsx-runtime";
+import { jsx as jsx61 } from "react/jsx-runtime";
 var Button3 = function() {
-    return /* @__PURE__ */ jsx59(IconButton4, {
+    return /* @__PURE__ */ jsx61(IconButton5, {
         size: "4",
         radius: "full",
-        children: /* @__PURE__ */ jsx59(ChatBubbleIcon, {})
+        children: /* @__PURE__ */ jsx61(ChatBubbleIcon, {})
     });
 };
 // src/components/threads/ThreadDialog/Trigger/index.tsx
-import { jsx as jsx60 } from "react/jsx-runtime";
+import { jsx as jsx62 } from "react/jsx-runtime";
 var Root10 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ jsx60(Flex21, {
+    return /* @__PURE__ */ jsx62(Flex22, {
         display: {
             initial: isOpen ? "none" : "flex",
             sm: "flex"
@@ -3217,21 +3369,21 @@ var Root10 = function(param) {
     });
 };
 var Trigger = function(args) {
-    return /* @__PURE__ */ jsx60(Root10, _object_spread_props(_object_spread({}, args), {
-        children: /* @__PURE__ */ jsx60(Button3, {})
+    return /* @__PURE__ */ jsx62(Root10, _object_spread_props(_object_spread({}, args), {
+        children: /* @__PURE__ */ jsx62(Button3, {})
     }));
 };
 Trigger.Root = Root10;
 Trigger.Button = Button3;
 // src/components/threads/ThreadDialog/Content/index.tsx
-import { Card as Card4, Inset, Flex as Flex23 } from "@radix-ui/themes";
+import { Card as Card4, Inset, Flex as Flex24 } from "@radix-ui/themes";
 // src/components/threads/ThreadDialog/Close/index.tsx
 import { Cross1Icon } from "@radix-ui/react-icons";
-import { IconButton as IconButton5, Flex as Flex22 } from "@radix-ui/themes";
-import { jsx as jsx61 } from "react/jsx-runtime";
+import { IconButton as IconButton6, Flex as Flex23 } from "@radix-ui/themes";
+import { jsx as jsx63 } from "react/jsx-runtime";
 var Close = function() {
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ jsx61(Flex22, {
+    return /* @__PURE__ */ jsx63(Flex23, {
         display: {
             initial: isOpen ? "flex" : "none",
             sm: "none"
@@ -3251,20 +3403,20 @@ var Close = function() {
         style: {
             zIndex: 9999999999
         },
-        children: /* @__PURE__ */ jsx61(IconButton5, {
+        children: /* @__PURE__ */ jsx63(IconButton6, {
             size: "2",
             variant: "soft",
-            children: /* @__PURE__ */ jsx61(Cross1Icon, {})
+            children: /* @__PURE__ */ jsx63(Cross1Icon, {})
         })
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
-import { jsx as jsx62, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs23 } from "react/jsx-runtime";
 var Root11 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var isOpen = useThreadDialogContext().isOpen;
     if (!isOpen) return null;
-    return /* @__PURE__ */ jsx62(Flex23, {
+    return /* @__PURE__ */ jsx64(Flex24, {
         direction: "column",
         justify: "end",
         position: "fixed",
@@ -3292,7 +3444,7 @@ var Root11 = function(param) {
         style: _object_spread({
             zIndex: 9999999999
         }, style),
-        children: /* @__PURE__ */ jsxs22(Card4, {
+        children: /* @__PURE__ */ jsxs23(Card4, {
             mb: {
                 initial: void 0,
                 sm: "3"
@@ -3303,7 +3455,7 @@ var Root11 = function(param) {
                 flexGrow: 1
             },
             children: [
-                /* @__PURE__ */ jsx62(Inset, {
+                /* @__PURE__ */ jsx64(Inset, {
                     clip: "padding-box",
                     side: "all",
                     pb: "current",
@@ -3313,13 +3465,13 @@ var Root11 = function(param) {
                     },
                     children: children
                 }),
-                /* @__PURE__ */ jsx62(Close, {})
+                /* @__PURE__ */ jsx64(Close, {})
             ]
         })
     });
 };
 var Messages2 = function() {
-    return /* @__PURE__ */ jsx62(Thread.Messages, {
+    return /* @__PURE__ */ jsx64(Thread.Messages, {
         style: {
             paddingTop: "var(--space-5)",
             paddingRight: "var(--space-5)",
@@ -3329,7 +3481,7 @@ var Messages2 = function() {
 };
 var FormContainer = function(param) {
     var children = param.children;
-    return /* @__PURE__ */ jsx62(Flex23, {
+    return /* @__PURE__ */ jsx64(Flex24, {
         direction: "column",
         pl: "5",
         pr: "5",
@@ -3340,13 +3492,13 @@ var FormContainer = function(param) {
 };
 var Content4 = function(param) {
     var _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
-    return /* @__PURE__ */ jsx62(Root11, {
+    return /* @__PURE__ */ jsx64(Root11, {
         style: style,
-        children: /* @__PURE__ */ jsxs22(Thread.Root, {
+        children: /* @__PURE__ */ jsxs23(Thread.Root, {
             children: [
-                /* @__PURE__ */ jsx62(Messages2, {}),
-                /* @__PURE__ */ jsx62(FormContainer, {
-                    children: /* @__PURE__ */ jsx62(Thread.MessageForm, {})
+                /* @__PURE__ */ jsx64(Messages2, {}),
+                /* @__PURE__ */ jsx64(FormContainer, {
+                    children: /* @__PURE__ */ jsx64(Thread.MessageForm, {})
                 })
             ]
         })
@@ -3356,12 +3508,12 @@ Content4.Root = Root11;
 Content4.Messages = Messages2;
 Content4.FormContainer = FormContainer;
 // src/components/threads/ThreadDialog/index.tsx
-import { jsx as jsx63, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs24 } from "react/jsx-runtime";
 var ThreadDialog = function() {
-    return /* @__PURE__ */ jsxs23(Root9, {
+    return /* @__PURE__ */ jsxs24(Root9, {
         children: [
-            /* @__PURE__ */ jsx63(Content4, {}),
-            /* @__PURE__ */ jsx63(Trigger, {})
+            /* @__PURE__ */ jsx65(Content4, {}),
+            /* @__PURE__ */ jsx65(Trigger, {})
         ]
     });
 };
@@ -3370,7 +3522,7 @@ ThreadDialog.Trigger = Trigger;
 ThreadDialog.Content = Content4;
 // src/components/threads/AudioThread/Root/index.tsx
 import "regenerator-runtime/runtime";
-import { Flex as Flex24 } from "@radix-ui/themes";
+import { Flex as Flex25 } from "@radix-ui/themes";
 // src/contexts/threads/AudioThreadContext/index.ts
 import { createContext as createContext12 } from "react";
 var AudioThreadContext = createContext12({
@@ -3807,7 +3959,7 @@ var useMessageAudio = function(param) {
     });
 };
 // src/components/threads/AudioThread/Root/index.tsx
-import { jsx as jsx64 } from "react/jsx-runtime";
+import { jsx as jsx66 } from "react/jsx-runtime";
 var Root12 = function(param) {
     var children = param.children;
     var createMessageProps = useCreateMessage();
@@ -3865,13 +4017,13 @@ var Root12 = function(param) {
         createMessageProps: createMessageProps,
         messageAudioProps: messageAudioProps
     }).status;
-    return /* @__PURE__ */ jsx64(AudioThreadContext.Provider, {
+    return /* @__PURE__ */ jsx66(AudioThreadContext.Provider, {
         value: {
             status: status,
             recorderProps: recorderProps,
             messageAudioProps: messageAudioProps
         },
-        children: /* @__PURE__ */ jsx64(Flex24, {
+        children: /* @__PURE__ */ jsx66(Flex25, {
             direction: "column",
             flexGrow: "1",
             p: "9",
@@ -3882,7 +4034,7 @@ var Root12 = function(param) {
 // src/components/threads/AudioThread/Visualization/index.tsx
 import { useContext as useContext15, useState as useState7, useCallback as useCallback6, useEffect as useEffect7 } from "react";
 import _9 from "lodash";
-import { Flex as Flex26 } from "@radix-ui/themes";
+import { Flex as Flex27 } from "@radix-ui/themes";
 // src/hooks/threads/useAudioThreadContext/index.ts
 import { useContext as useContext14 } from "react";
 var useAudioThreadContext = function() {
@@ -3890,10 +4042,10 @@ var useAudioThreadContext = function() {
 };
 // src/components/threads/AudioThread/BarsVisualizer/index.tsx
 import _8 from "lodash";
-import { Flex as Flex25, Grid } from "@radix-ui/themes";
+import { Flex as Flex26, Grid } from "@radix-ui/themes";
 import { useState as useState6, useEffect as useEffect6, useCallback as useCallback5 } from "react";
 import { cluster } from "radash";
-import { jsx as jsx65 } from "react/jsx-runtime";
+import { jsx as jsx67 } from "react/jsx-runtime";
 var barCount = 4;
 var BarsVisualizer = function(param) {
     var visualizationAnalyser = param.visualizationAnalyser, backgroundColor = param.backgroundColor, height = param.height, barWidth = param.barWidth;
@@ -3924,7 +4076,7 @@ var BarsVisualizer = function(param) {
         draw,
         visualizationAnalyser
     ]);
-    return /* @__PURE__ */ jsx65(Grid, {
+    return /* @__PURE__ */ jsx67(Grid, {
         columns: "".concat(barCount),
         gap: "1",
         width: "auto",
@@ -3933,12 +4085,12 @@ var BarsVisualizer = function(param) {
             gridTemplateColumns: "repeat(4, minmax(0, 1fr))"
         },
         children: barHeights.map(function(barHeight, index) {
-            return /* @__PURE__ */ jsx65(Flex25, {
+            return /* @__PURE__ */ jsx67(Flex26, {
                 direction: "column",
                 align: "center",
                 justify: "center",
                 height: height,
-                children: /* @__PURE__ */ jsx65(Flex25, {
+                children: /* @__PURE__ */ jsx67(Flex26, {
                     minHeight: "50%",
                     maxHeight: "100%",
                     height: "".concat(barHeight + 20, "%"),
@@ -3953,7 +4105,7 @@ var BarsVisualizer = function(param) {
     });
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-import { jsx as jsx66, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs25 } from "react/jsx-runtime";
 var Visualization = function() {
     var audioThreadContext = useAudioThreadContext();
     var assistantNameContext = useContext15(AssistantNameContext);
@@ -3981,14 +4133,14 @@ var Visualization = function() {
         draw,
         audioThreadContext
     ]);
-    return /* @__PURE__ */ jsxs24(Flex26, {
+    return /* @__PURE__ */ jsxs25(Flex27, {
         direction: "column",
         align: "center",
         justify: "center",
         mb: "3",
         flexGrow: "1",
         children: [
-            /* @__PURE__ */ jsx66(Flex26, {
+            /* @__PURE__ */ jsx68(Flex27, {
                 align: "center",
                 justify: "center",
                 height: "200px",
@@ -3998,20 +4150,20 @@ var Visualization = function() {
                     borderRadius: "9999px",
                     scale: scale
                 },
-                children: /* @__PURE__ */ jsx66(BarsVisualizer, {
+                children: /* @__PURE__ */ jsx68(BarsVisualizer, {
                     visualizationAnalyser: audioThreadContext.messageAudioProps.visualizationAnalyser,
                     backgroundColor: audioThreadContext.status === "playing" ? "var(--accent-11)" : "var(--gray-11)",
                     height: "40px",
                     barWidth: "24px"
                 })
             }),
-            /* @__PURE__ */ jsxs24(Flex26, {
+            /* @__PURE__ */ jsxs25(Flex27, {
                 ml: "-22.5px",
                 gap: "3",
                 pt: "5",
                 children: [
-                    /* @__PURE__ */ jsx66(AssistantAvatar, {}),
-                    /* @__PURE__ */ jsx66(Name, {
+                    /* @__PURE__ */ jsx68(AssistantAvatar, {}),
+                    /* @__PURE__ */ jsx68(Name, {
                         children: assistantNameContext
                     })
                 ]
@@ -4020,8 +4172,8 @@ var Visualization = function() {
     });
 };
 // src/components/threads/AudioThread/Status/StatusMessages.tsx
-import { Flex as Flex27, Text as Text8 } from "@radix-ui/themes";
-import { jsx as jsx67, jsxs as jsxs25 } from "react/jsx-runtime";
+import { Flex as Flex28, Text as Text9 } from "@radix-ui/themes";
+import { jsx as jsx69, jsxs as jsxs26 } from "react/jsx-runtime";
 var html = function(param) {
     var texts = param.texts;
     return "\n  .status-messages-texts:after {\n    content: '".concat(texts[0], "';\n    animation: texts ").concat(texts.length * 5, "s linear infinite;\n  }\n\n  @keyframes texts {\n    ").concat(texts.map(function(_10, i) {
@@ -4030,17 +4182,17 @@ var html = function(param) {
 };
 var StatusMessages = function(param) {
     var texts = param.texts;
-    return /* @__PURE__ */ jsxs25(Flex27, {
+    return /* @__PURE__ */ jsxs26(Flex28, {
         justify: "center",
         pb: "5",
         children: [
-            /* @__PURE__ */ jsx67(Text8, {
+            /* @__PURE__ */ jsx69(Text9, {
                 size: "2",
                 weight: "regular",
                 color: "gray",
                 className: "status-messages-texts"
             }),
-            /* @__PURE__ */ jsx67("style", {
+            /* @__PURE__ */ jsx69("style", {
                 dangerouslySetInnerHTML: {
                     __html: html({
                         texts: texts
@@ -4051,11 +4203,11 @@ var StatusMessages = function(param) {
     });
 };
 // src/components/threads/AudioThread/Status/index.tsx
-import { jsx as jsx68 } from "react/jsx-runtime";
+import { jsx as jsx70 } from "react/jsx-runtime";
 var Status = function() {
     var audioThreadContext = useAudioThreadContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ jsx68(StatusMessages, {
+        return /* @__PURE__ */ jsx70(StatusMessages, {
             texts: [
                 "Start speaking",
                 "Listening",
@@ -4069,31 +4221,31 @@ var Status = function() {
         "idle",
         "playerPaused"
     ].includes(audioThreadContext.status)) {
-        return /* @__PURE__ */ jsx68(StatusMessages, {
+        return /* @__PURE__ */ jsx70(StatusMessages, {
             texts: [
                 "Click the button below to activate"
             ]
         });
     }
     if (audioThreadContext.status === "playing") {
-        return /* @__PURE__ */ jsx68(StatusMessages, {
+        return /* @__PURE__ */ jsx70(StatusMessages, {
             texts: [
                 "Click the button below to interrupt"
             ]
         });
     }
-    return /* @__PURE__ */ jsx68(StatusMessages, {
+    return /* @__PURE__ */ jsx70(StatusMessages, {
         texts: [
             "Thinking"
         ]
     });
 };
 // src/components/threads/AudioThread/Form/index.tsx
-import { Flex as Flex29 } from "@radix-ui/themes";
+import { Flex as Flex30 } from "@radix-ui/themes";
 // src/components/threads/AudioThread/Form/MicIcon.tsx
-import { jsx as jsx69 } from "react/jsx-runtime";
+import { jsx as jsx71 } from "react/jsx-runtime";
 var MicIcon = function(props) {
-    return /* @__PURE__ */ jsx69("svg", _object_spread_props(_object_spread({
+    return /* @__PURE__ */ jsx71("svg", _object_spread_props(_object_spread({
         xmlns: "http://www.w3.org/2000/svg",
         fill: "currentColor",
         stroke: "currentColor",
@@ -4102,54 +4254,54 @@ var MicIcon = function(props) {
         height: "15",
         width: "15"
     }, props), {
-        children: /* @__PURE__ */ jsx69("path", {
+        children: /* @__PURE__ */ jsx71("path", {
             stroke: "none",
             d: "M192 0c-53 0-96 43-96 96v160c0 53 43 96 96 96s96-43 96-96V96c0-53-43-96-96-96zM64 216c0-13.3-10.7-24-24-24s-24 10.7-24 24v40c0 89.1 66.2 162.7 152 174.4V464h-48c-13.3 0-24 10.7-24 24s10.7 24 24 24h144c13.3 0 24-10.7 24-24s-10.7-24-24-24h-48v-33.6c85.8-11.7 152-85.3 152-174.4v-40c0-13.3-10.7-24-24-24s-24 10.7-24 24v40c0 70.7-57.3 128-128 128S64 326.7 64 256v-40z"
         })
     }));
 };
 // src/components/threads/AudioThread/Form/ActionButton/index.tsx
-import { Flex as Flex28, IconButton as IconButton6 } from "@radix-ui/themes";
+import { Flex as Flex29, IconButton as IconButton7 } from "@radix-ui/themes";
 import { StopIcon as StopIcon2, PauseIcon, ArrowUpIcon as ArrowUpIcon2, ResumeIcon } from "@radix-ui/react-icons";
-import { jsx as jsx70, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx72, jsxs as jsxs27 } from "react/jsx-runtime";
 var ActionButton = function() {
     var audioThreadContext = useAudioThreadContext();
     var superinterfaceContext = useSuperinterfaceContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ jsxs26(Flex28, {
+        return /* @__PURE__ */ jsxs27(Flex29, {
             align: "center",
             children: [
-                /* @__PURE__ */ jsx70(Flex28, {
+                /* @__PURE__ */ jsx72(Flex29, {
                     mr: "3",
                     ml: "-7",
-                    children: /* @__PURE__ */ jsx70(IconButton6, {
+                    children: /* @__PURE__ */ jsx72(IconButton7, {
                         onClick: audioThreadContext.recorderProps.pause,
                         color: "gray",
                         variant: "soft",
                         size: "1",
-                        children: /* @__PURE__ */ jsx70(PauseIcon, {})
+                        children: /* @__PURE__ */ jsx72(PauseIcon, {})
                     })
                 }),
-                /* @__PURE__ */ jsx70(IconButton6, {
+                /* @__PURE__ */ jsx72(IconButton7, {
                     onClick: audioThreadContext.recorderProps.stop,
                     highContrast: true,
                     variant: "soft",
                     size: "4",
-                    children: /* @__PURE__ */ jsx70(ArrowUpIcon2, {})
+                    children: /* @__PURE__ */ jsx72(ArrowUpIcon2, {})
                 })
             ]
         });
     }
     if (audioThreadContext.status === "recorderPaused") {
-        return /* @__PURE__ */ jsx70(IconButton6, {
+        return /* @__PURE__ */ jsx72(IconButton7, {
             onClick: audioThreadContext.recorderProps.resume,
             color: "red",
             size: "4",
-            children: /* @__PURE__ */ jsx70(ResumeIcon, {})
+            children: /* @__PURE__ */ jsx72(ResumeIcon, {})
         });
     }
     if (audioThreadContext.status === "idle") {
-        return /* @__PURE__ */ jsx70(IconButton6, {
+        return /* @__PURE__ */ jsx72(IconButton7, {
             onClick: function() {
                 return audioThreadContext.recorderProps.start();
             },
@@ -4158,7 +4310,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "playing") {
-        return /* @__PURE__ */ jsx70(IconButton6, {
+        return /* @__PURE__ */ jsx72(IconButton7, {
             onClick: function() {
                 var _superinterfaceContext_createMessageAbortControllerRef_current;
                 audioThreadContext.messageAudioProps.stop();
@@ -4168,54 +4320,54 @@ var ActionButton = function() {
             size: "4",
             color: "gray",
             variant: "soft",
-            children: /* @__PURE__ */ jsx70(StopIcon2, {})
+            children: /* @__PURE__ */ jsx72(StopIcon2, {})
         });
     }
     if (audioThreadContext.status === "playerPaused") {
-        return /* @__PURE__ */ jsx70(IconButton6, {
+        return /* @__PURE__ */ jsx72(IconButton7, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.play();
             },
             size: "4",
-            children: /* @__PURE__ */ jsx70(ResumeIcon, {})
+            children: /* @__PURE__ */ jsx72(ResumeIcon, {})
         });
     }
-    return /* @__PURE__ */ jsx70(IconButton6, {
+    return /* @__PURE__ */ jsx72(IconButton7, {
         size: "4",
         variant: "soft",
         disabled: true
     });
 };
 // src/components/threads/AudioThread/Form/index.tsx
-import { jsx as jsx71, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx73, jsxs as jsxs28 } from "react/jsx-runtime";
 var Form = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ jsxs27(Flex29, {
+    return /* @__PURE__ */ jsxs28(Flex30, {
         direction: "column",
         align: "center",
         children: [
-            /* @__PURE__ */ jsxs27(Flex29, {
+            /* @__PURE__ */ jsxs28(Flex30, {
                 pb: "3",
                 align: "center",
                 children: [
-                    /* @__PURE__ */ jsx71(Flex29, {
+                    /* @__PURE__ */ jsx73(Flex30, {
                         ml: "-22.5px",
                         mr: "2",
                         align: "center",
-                        children: /* @__PURE__ */ jsx71(MicIcon, {
+                        children: /* @__PURE__ */ jsx73(MicIcon, {
                             style: {
                                 color: audioThreadContext.status === "recording" ? "var(--accent-11)" : "var(--gray-11)"
                             }
                         })
                     }),
-                    /* @__PURE__ */ jsx71(Flex29, {
+                    /* @__PURE__ */ jsx73(Flex30, {
                         px: "2",
                         py: "1",
                         style: {
                             backgroundColor: audioThreadContext.status === "recording" ? "var(--accent-4)" : "var(--gray-4)",
                             borderRadius: "var(--radius-6)"
                         },
-                        children: /* @__PURE__ */ jsx71(BarsVisualizer, {
+                        children: /* @__PURE__ */ jsx73(BarsVisualizer, {
                             visualizationAnalyser: audioThreadContext.recorderProps.visualizationAnalyser,
                             backgroundColor: audioThreadContext.status === "recording" ? "var(--accent-11)" : "var(--gray-11)",
                             height: "20px",
@@ -4224,18 +4376,18 @@ var Form = function() {
                     })
                 ]
             }),
-            /* @__PURE__ */ jsx71(ActionButton, {})
+            /* @__PURE__ */ jsx73(ActionButton, {})
         ]
     });
 };
 // src/components/threads/AudioThread/index.tsx
-import { jsx as jsx72, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx74, jsxs as jsxs29 } from "react/jsx-runtime";
 var AudioThread = function(props) {
-    return /* @__PURE__ */ jsxs28(Root12, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ jsxs29(Root12, _object_spread_props(_object_spread({}, props), {
         children: [
-            /* @__PURE__ */ jsx72(Visualization, {}),
-            /* @__PURE__ */ jsx72(Status, {}),
-            /* @__PURE__ */ jsx72(Form, {})
+            /* @__PURE__ */ jsx74(Visualization, {}),
+            /* @__PURE__ */ jsx74(Status, {}),
+            /* @__PURE__ */ jsx74(Form, {})
         ]
     }));
 };
@@ -4243,14 +4395,14 @@ AudioThread.Root = Root12;
 AudioThread.Visualization = Visualization;
 AudioThread.Form = Form;
 // src/components/threads/AudioThreadDialog/index.tsx
-import { jsx as jsx73, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx75, jsxs as jsxs30 } from "react/jsx-runtime";
 var AudioThreadDialog = function() {
-    return /* @__PURE__ */ jsxs29(Root9, {
+    return /* @__PURE__ */ jsxs30(Root9, {
         children: [
-            /* @__PURE__ */ jsx73(Content4.Root, {
-                children: /* @__PURE__ */ jsx73(AudioThread, {})
+            /* @__PURE__ */ jsx75(Content4.Root, {
+                children: /* @__PURE__ */ jsx75(AudioThread, {})
             }),
-            /* @__PURE__ */ jsx73(Trigger, {})
+            /* @__PURE__ */ jsx75(Trigger, {})
         ]
     });
 };
@@ -4263,15 +4415,15 @@ import { useMemo as useMemo14 } from "react";
 import { useMemo as useMemo13 } from "react";
 import { isEmpty as isEmpty3 } from "radash";
 import { onlyText } from "react-children-utilities";
-import { Flex as Flex30 } from "@radix-ui/themes";
+import { Flex as Flex31 } from "@radix-ui/themes";
 // src/components/suggestions/Suggestions/Item.tsx
 import { ArrowUpIcon as ArrowUpIcon3 } from "@radix-ui/react-icons";
-import { Text as Text9, Button as Button4, Spinner as Spinner2 } from "@radix-ui/themes";
-import { jsx as jsx74, jsxs as jsxs30 } from "react/jsx-runtime";
+import { Text as Text10, Button as Button4, Spinner as Spinner2 } from "@radix-ui/themes";
+import { jsx as jsx76, jsxs as jsxs31 } from "react/jsx-runtime";
 var Item = function(param) {
     var suggestion = param.suggestion, isDisabled = param.isDisabled;
     var _useCreateMessage = useCreateMessage(), createMessage = _useCreateMessage.createMessage, isPending = _useCreateMessage.isPending;
-    return /* @__PURE__ */ jsx74(Content5, {
+    return /* @__PURE__ */ jsx76(Content5, {
         onClick: function() {
             createMessage({
                 // @ts-ignore-next-line
@@ -4285,7 +4437,7 @@ var Item = function(param) {
 };
 var Content5 = function(param) {
     var onClick = param.onClick, isDisabled = param.isDisabled, isPending = param.isPending, children = param.children;
-    return /* @__PURE__ */ jsxs30(Button4, {
+    return /* @__PURE__ */ jsxs31(Button4, {
         variant: "soft",
         onClick: onClick,
         disabled: isDisabled,
@@ -4295,14 +4447,14 @@ var Content5 = function(param) {
             flexShrink: 1
         },
         children: [
-            /* @__PURE__ */ jsx74(Text9, {
+            /* @__PURE__ */ jsx76(Text10, {
                 size: "1",
                 weight: "regular",
                 children: children
             }),
-            /* @__PURE__ */ jsx74(Spinner2, {
+            /* @__PURE__ */ jsx76(Spinner2, {
                 loading: isPending,
-                children: /* @__PURE__ */ jsx74(ArrowUpIcon3, {
+                children: /* @__PURE__ */ jsx76(ArrowUpIcon3, {
                     style: {
                         flexShrink: 0
                     }
@@ -4313,7 +4465,7 @@ var Content5 = function(param) {
 };
 Item.Content = Content5;
 // src/components/suggestions/Suggestions/Content.tsx
-import { jsx as jsx75 } from "react/jsx-runtime";
+import { jsx as jsx77 } from "react/jsx-runtime";
 var Content6 = function(param) {
     var children = param.children;
     var isMutatingMessage = useIsMutatingMessage();
@@ -4327,12 +4479,12 @@ var Content6 = function(param) {
         children
     ]);
     if (isEmpty3(suggestions)) return null;
-    return /* @__PURE__ */ jsx75(Flex30, {
+    return /* @__PURE__ */ jsx77(Flex31, {
         gap: "2",
         py: "2",
         wrap: "wrap",
         children: suggestions.map(function(suggestion) {
-            return /* @__PURE__ */ jsx75(Item, {
+            return /* @__PURE__ */ jsx77(Item, {
                 suggestion: suggestion,
                 isDisabled: isMutatingMessage
             }, suggestion);
@@ -4340,7 +4492,7 @@ var Content6 = function(param) {
     });
 };
 // src/components/suggestions/Suggestions/index.tsx
-import { jsx as jsx76 } from "react/jsx-runtime";
+import { jsx as jsx78 } from "react/jsx-runtime";
 var Suggestions = function(param) {
     var children = param.children;
     var latestMessageProps = useLatestMessage();
@@ -4353,14 +4505,14 @@ var Suggestions = function(param) {
     ]);
     if (latestMessageProps.isLoading) return null;
     if (isDisabled) return null;
-    return /* @__PURE__ */ jsx76(Content6, {
+    return /* @__PURE__ */ jsx78(Content6, {
         children: children
     });
 };
 Suggestions.Item = Item;
 // src/components/markdown/MarkdownProvider/index.tsx
 import { useMemo as useMemo15 } from "react";
-import { jsx as jsx77 } from "react/jsx-runtime";
+import { jsx as jsx79 } from "react/jsx-runtime";
 var MarkdownProvider = function(_param) {
     var children = _param.children, rest = _object_without_properties(_param, [
         "children"
@@ -4372,7 +4524,7 @@ var MarkdownProvider = function(_param) {
         rest,
         prevMarkdownContext
     ]);
-    return /* @__PURE__ */ jsx77(MarkdownContext.Provider, {
+    return /* @__PURE__ */ jsx79(MarkdownContext.Provider, {
         value: value,
         children: children
     });
@@ -4385,7 +4537,7 @@ var useComponents = function() {
     return useContext16(ComponentsContext);
 };
 // src/components/components/ComponentsProvider.tsx
-import { jsx as jsx78 } from "react/jsx-runtime";
+import { jsx as jsx80 } from "react/jsx-runtime";
 var ComponentsProvider = function(_param) {
     var children = _param.children, rest = _object_without_properties(_param, [
         "children"
@@ -4397,7 +4549,7 @@ var ComponentsProvider = function(_param) {
         rest,
         prevComponents
     ]);
-    return /* @__PURE__ */ jsx78(ComponentsContext.Provider, {
+    return /* @__PURE__ */ jsx80(ComponentsContext.Provider, {
         value: value,
         children: children
     });