@superinterface/react 2.7.2 → 2.8.1

package/dist/index.cjs

@@ -435,7 +435,7 @@ var set = function(param) {
     return import_js_cookie2.default.set(key({
         assistantId: assistantId
     }), threadId, {
-        expires: 270
+        expires: 7
     });
 };
 // src/lib/threadIdCookies/options/index.ts
@@ -1611,7 +1611,7 @@ Messages.Root = Root;
 Messages.Message = Message;
 Messages.NextPageSkeleton = NextPageSkeleton;
 // src/components/threads/Thread/MessageForm/index.tsx
-var import_themes33 = require("@radix-ui/themes");
+var import_themes34 = require("@radix-ui/themes");
 // src/components/threads/Thread/MessageForm/Submit/index.tsx
 var import_react_icons5 = require("@radix-ui/react-icons");
 var import_themes31 = require("@radix-ui/themes");
@@ -1643,6 +1643,7 @@ var Submit = function() {
 // src/components/threads/Thread/MessageForm/Root/index.tsx
 var import_react29 = require("react");
 var import_react_hook_form = require("react-hook-form");
+var import_themes32 = require("@radix-ui/themes");
 // src/hooks/messages/useCreateMessage/index.ts
 var import_radash10 = require("radash");
 var import_react_query4 = require("@tanstack/react-query");
@@ -1750,17 +1751,18 @@ var onMutate = function(param) {
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/index.ts
 var import_json_whatwg = require("@streamparser/json-whatwg");
-// src/lib/threadIdCookies/ensure.ts
-var ensure = function(param) {
-    var superinterfaceContext = param.superinterfaceContext, variables = param.variables, value = param.value;
-    var _superinterfaceContext_threadIdCookieOptions;
+// src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadCreated.ts
+var threadCreated = function(param) {
+    var value = param.value, superinterfaceContext = param.superinterfaceContext;
+    var _superinterfaceContext_threadIdCookieOptions, _value_data_metadata, _value_data_metadata1;
     if (!((_superinterfaceContext_threadIdCookieOptions = superinterfaceContext.threadIdCookieOptions) === null || _superinterfaceContext_threadIdCookieOptions === void 0 ? void 0 : _superinterfaceContext_threadIdCookieOptions.set)) return;
-    if (value.value.event !== "thread.run.created") return;
-    if (variables.threadId) return;
-    if (!variables.assistantId) return;
+    if (!((_value_data_metadata = value.data.metadata) === null || _value_data_metadata === void 0 ? void 0 : _value_data_metadata.superinterfaceAssistantId)) return;
+    if (!((_value_data_metadata1 = value.data.metadata) === null || _value_data_metadata1 === void 0 ? void 0 : _value_data_metadata1.superinterfaceThreadId)) return;
     superinterfaceContext.threadIdCookieOptions.set({
-        assistantId: variables.assistantId,
-        threadId: value.value.data.thread_id
+        // @ts-ignore-next-line
+        assistantId: value.data.metadata.superinterfaceAssistantId,
+        // @ts-ignore-next-line
+        threadId: value.data.metadata.superinterfaceThreadId
     });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/extendMessage.ts
@@ -1798,8 +1800,8 @@ var appendMessage = function(param) {
     ].concat(_to_consumable_array(prevMessages));
 };
 var threadMessageCreated = function(param) {
-    var value = param.value;
-    return function(prevData) {
+    var value = param.value, messagesQueryKey = param.messagesQueryKey, queryClient = param.queryClient;
+    return queryClient.setQueryData(messagesQueryKey, function(prevData) {
         if (!prevData) {
             return {
                 pageParams: [],
@@ -1826,7 +1828,7 @@ var threadMessageCreated = function(param) {
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
-    };
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadMessageDelta.ts
 var import_lodash6 = __toESM(require("lodash"), 1);
@@ -1863,8 +1865,8 @@ var updatedContent = function(param) {
     return result;
 };
 var threadMessageDelta = function(param) {
-    var value = param.value;
-    return function(prevData) {
+    var value = param.value, queryClient = param.queryClient, messagesQueryKey = param.messagesQueryKey;
+    return queryClient.setQueryData(messagesQueryKey, function(prevData) {
         if (!prevData) {
             return {
                 pageParams: [],
@@ -1893,13 +1895,13 @@ var threadMessageDelta = function(param) {
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
-    };
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadMessageCompleted.ts
 var import_radash7 = require("radash");
 var threadMessageCompleted = function(param) {
-    var value = param.value;
-    return function(prevData) {
+    var value = param.value, queryClient = param.queryClient, messagesQueryKey = param.messagesQueryKey;
+    return queryClient.setQueryData(messagesQueryKey, function(prevData) {
         if (!prevData) {
             return {
                 pageParams: [],
@@ -1925,12 +1927,12 @@ var threadMessageCompleted = function(param) {
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
-    };
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunCreated.ts
 var threadRunCreated = function(param) {
-    var value = param.value;
-    return function(prevData) {
+    var value = param.value, queryClient = param.queryClient, messagesQueryKey = param.messagesQueryKey;
+    return queryClient.setQueryData(messagesQueryKey, function(prevData) {
         if (!prevData) return prevData;
         var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
         return _object_spread_props(_object_spread({}, prevData), {
@@ -1954,12 +1956,12 @@ var threadRunCreated = function(param) {
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
-    };
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunStepCreated.ts
 var threadRunStepCreated = function(param) {
-    var value = param.value;
-    return function(prevData) {
+    var value = param.value, queryClient = param.queryClient, messagesQueryKey = param.messagesQueryKey;
+    return queryClient.setQueryData(messagesQueryKey, function(prevData) {
         if (!prevData) return prevData;
         var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
         return _object_spread_props(_object_spread({}, prevData), {
@@ -1978,7 +1980,7 @@ var threadRunStepCreated = function(param) {
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
-    };
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunStepDelta.ts
 var import_lodash7 = __toESM(require("lodash"), 1);
@@ -2040,8 +2042,8 @@ var updatedRunStep = function(param) {
     }
 };
 var threadRunStepDelta = function(param) {
-    var value = param.value;
-    return function(prevData) {
+    var value = param.value, queryClient = param.queryClient, messagesQueryKey = param.messagesQueryKey;
+    return queryClient.setQueryData(messagesQueryKey, function(prevData) {
         if (!prevData) return prevData;
         var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
         return _object_spread_props(_object_spread({}, prevData), {
@@ -2066,13 +2068,13 @@ var threadRunStepDelta = function(param) {
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
-    };
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/threadRunStepCompleted.ts
 var import_radash9 = require("radash");
 var threadRunStepCompleted = function(param) {
-    var value = param.value;
-    return function(prevData) {
+    var value = param.value, queryClient = param.queryClient, messagesQueryKey = param.messagesQueryKey;
+    return queryClient.setQueryData(messagesQueryKey, function(prevData) {
         if (!prevData) return prevData;
         var _prevData_pages = _to_array(prevData.pages), latestPage = _prevData_pages[0], pagesRest = _prevData_pages.slice(1);
         return _object_spread_props(_object_spread({}, prevData), {
@@ -2091,10 +2093,11 @@ var threadRunStepCompleted = function(param) {
                 })
             ].concat(_to_consumable_array(pagesRest))
         });
-    };
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/handlers/index.ts
 var handlers = {
+    "thread.created": threadCreated,
     "thread.message.created": threadMessageCreated,
     "thread.message.delta": threadMessageDelta,
     "thread.message.completed": threadMessageCompleted,
@@ -2105,16 +2108,19 @@ var handlers = {
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/handleResponse/index.ts
 var handleResponse = function(param) {
-    var value = param.value, messagesQueryKey = param.messagesQueryKey, queryClient = param.queryClient;
+    var value = param.value, messagesQueryKey = param.messagesQueryKey, queryClient = param.queryClient, superinterfaceContext = param.superinterfaceContext;
     var handler = handlers[value.value.event];
     if (!handler) {
         return console.log("Missing handler", {
             value: value
         });
     }
-    return queryClient.setQueryData(messagesQueryKey, handler({
-        value: value.value
-    }));
+    return handler({
+        value: value.value,
+        queryClient: queryClient,
+        messagesQueryKey: messagesQueryKey,
+        superinterfaceContext: superinterfaceContext
+    });
 };
 // src/hooks/messages/useCreateMessage/lib/mutationOptions/mutationFn/body.ts
 var body = function(param) {
@@ -2186,12 +2192,9 @@ var mutationFn = function(param) {
                         handleResponse({
                             value: value,
                             messagesQueryKey: messagesQueryKey,
-                            queryClient: queryClient
-                        });
-                        ensure({
-                            superinterfaceContext: superinterfaceContext,
+                            queryClient: queryClient,
                             variables: variables,
-                            value: value
+                            superinterfaceContext: superinterfaceContext
                         });
                         return [
                             3,
@@ -2318,9 +2321,13 @@ var Root2 = function(param) {
             isLoading: isLoading
         },
         children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react_hook_form.FormProvider, _object_spread_props(_object_spread({}, formProps), {
-            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("form", {
-                onSubmit: handleSubmit(onSubmit),
-                children: children
+            children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_themes32.Box, {
+                asChild: true,
+                flexShrink: "0",
+                children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("form", {
+                    onSubmit: handleSubmit(onSubmit),
+                    children: children
+                })
             })
         }))
     });
@@ -2363,21 +2370,21 @@ var TextareaBase = (0, import_react30.forwardRef)(function TextareaBase2(props,
 });
 // src/components/threads/Thread/MessageForm/Field/index.tsx
 var import_react_hook_form2 = require("react-hook-form");
-var import_themes32 = require("@radix-ui/themes");
+var import_themes33 = require("@radix-ui/themes");
 var import_jsx_runtime42 = require("react/jsx-runtime");
 var Root3 = function(param) {
     var children = param.children;
     var _ref = (0, import_react_hook_form2.useFormContext)(), errors = _ref.formState.errors;
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes32.Container, {
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Container, {
         size: "2",
         flexGrow: "0",
-        children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes32.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
             direction: "column",
             flexShrink: "0",
-            children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes32.Flex, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
                 direction: "column",
                 flexShrink: "0",
-                children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes32.Flex, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_themes33.Flex, {
                     style: _object_spread({
                         borderRadius: "var(--radius-2)",
                         borderWidth: "1px",
@@ -2446,18 +2453,18 @@ var MessageForm = function() {
     return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Root2, {
         children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Field.Root, {
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Text, {
+                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes34.Text, {
                     size: "2",
                     style: {
                         flexGrow: 1
                     },
-                    children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Flex, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes34.Flex, {
                         flexGrow: "1",
                         direction: "column",
                         children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Field.Control, {})
                     })
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes33.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_themes34.Flex, {
                     flexShrink: "0",
                     align: "end",
                     children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Submit, {})
@@ -2470,7 +2477,7 @@ MessageForm.Root = Root2;
 MessageForm.Field = Field;
 MessageForm.Submit = Submit;
 // src/components/threads/Thread/Root/index.tsx
-var import_themes34 = require("@radix-ui/themes");
+var import_themes35 = require("@radix-ui/themes");
 // src/components/threads/Thread/Provider/index.tsx
 var Provider2 = SuperinterfaceProvider;
 // src/components/threads/Thread/Root/index.tsx
@@ -2480,7 +2487,7 @@ var Root4 = function(_param) {
         "children"
     ]);
     return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Provider2, _object_spread_props(_object_spread({}, rest), {
-        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_themes34.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_themes35.Flex, {
             direction: "column",
             flexGrow: "1",
             children: children
@@ -2537,17 +2544,17 @@ var import_react36 = require("react");
 var Toast2 = __toESM(require("@radix-ui/react-toast"), 1);
 // src/components/toasts/ToastsProvider/CustomToast.tsx
 var Toast = __toESM(require("@radix-ui/react-toast"), 1);
-var import_themes35 = require("@radix-ui/themes");
+var import_themes36 = require("@radix-ui/themes");
 var import_react_icons6 = require("@radix-ui/react-icons");
 var import_jsx_runtime47 = require("react/jsx-runtime");
 var CustomToast = function(param) {
     var toast = param.toast;
     return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Toast.Root, {
-        children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes35.Card, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes36.Card, {
             children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Toast.Title, {
-                children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_themes35.Flex, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_themes36.Flex, {
                     children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes35.Flex, {
+                        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes36.Flex, {
                             pr: "2",
                             height: "14px",
                             align: "center",
@@ -2557,7 +2564,7 @@ var CustomToast = function(param) {
                                 color: "var(--red-9)"
                             })
                         }),
-                        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes35.Text, {
+                        /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_themes36.Text, {
                             weight: "medium",
                             size: "1",
                             children: toast.message
@@ -2625,12 +2632,12 @@ var Root6 = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Trigger/index.tsx
-var import_themes36 = require("@radix-ui/themes");
+var import_themes37 = require("@radix-ui/themes");
 var import_jsx_runtime50 = require("react/jsx-runtime");
 var Trigger = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes36.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_themes37.Flex, {
         display: {
             initial: isOpen ? "none" : "flex",
             sm: "flex"
@@ -2654,25 +2661,25 @@ var Trigger = function(param) {
     });
 };
 // src/components/threads/ThreadDialog/Button/index.tsx
-var import_themes37 = require("@radix-ui/themes");
+var import_themes38 = require("@radix-ui/themes");
 var import_react_icons7 = require("@radix-ui/react-icons");
 var import_jsx_runtime51 = require("react/jsx-runtime");
 var Button2 = function() {
-    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes37.IconButton, {
+    return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_themes38.IconButton, {
         size: "4",
         radius: "full",
         children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_react_icons7.ChatBubbleIcon, {})
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
-var import_themes39 = require("@radix-ui/themes");
+var import_themes40 = require("@radix-ui/themes");
 // src/components/threads/ThreadDialog/Close/index.tsx
 var import_react_icons8 = require("@radix-ui/react-icons");
-var import_themes38 = require("@radix-ui/themes");
+var import_themes39 = require("@radix-ui/themes");
 var import_jsx_runtime52 = require("react/jsx-runtime");
 var Close = function() {
     var _useThreadDialogContext = useThreadDialogContext(), setIsOpen = _useThreadDialogContext.setIsOpen, isOpen = _useThreadDialogContext.isOpen;
-    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes38.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes39.Flex, {
         display: {
             initial: isOpen ? "flex" : "none",
             sm: "none"
@@ -2692,7 +2699,7 @@ var Close = function() {
         style: {
             zIndex: 9999999999
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes38.IconButton, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_themes39.IconButton, {
             size: "2",
             variant: "soft",
             children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react_icons8.Cross1Icon, {})
@@ -2705,7 +2712,7 @@ var Root7 = function(param) {
     var children = param.children, _param_style = param.style, style = _param_style === void 0 ? {} : _param_style;
     var isOpen = useThreadDialogContext().isOpen;
     if (!isOpen) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes39.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Flex, {
         direction: "column",
         justify: "end",
         position: "fixed",
@@ -2733,7 +2740,7 @@ var Root7 = function(param) {
         style: _object_spread({
             zIndex: 9999999999
         }, style),
-        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_themes39.Card, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_themes40.Card, {
             mb: {
                 initial: void 0,
                 sm: "3"
@@ -2744,7 +2751,7 @@ var Root7 = function(param) {
                 flexGrow: 1
             },
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes39.Inset, {
+                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Inset, {
                     clip: "padding-box",
                     side: "all",
                     pb: "current",
@@ -2772,7 +2779,7 @@ var Content4 = function(param) {
                         paddingLeft: "var(--space-5)"
                     }
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes39.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_themes40.Flex, {
                     direction: "column",
                     pl: "5",
                     pr: "5",
@@ -2803,7 +2810,7 @@ ThreadDialog.Button = Button2;
 ThreadDialog.Content = Content4;
 // src/components/threads/AudioThread/Root/index.tsx
 var import_runtime = require("regenerator-runtime/runtime");
-var import_themes40 = require("@radix-ui/themes");
+var import_themes41 = require("@radix-ui/themes");
 // src/contexts/threads/AudioThreadContext/index.ts
 var import_react37 = require("react");
 var AudioThreadContext = (0, import_react37.createContext)({
@@ -3272,7 +3279,7 @@ var Root8 = function(param) {
             recorderProps: recorderProps,
             messageAudioProps: messageAudioProps
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes40.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_themes41.Flex, {
             direction: "column",
             flexGrow: "1",
             p: "9",
@@ -3281,7 +3288,7 @@ var Root8 = function(param) {
     });
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-var import_themes42 = require("@radix-ui/themes");
+var import_themes43 = require("@radix-ui/themes");
 // src/hooks/threads/useAudioThreadContext/index.ts
 var import_react41 = require("react");
 var useAudioThreadContext = function() {
@@ -3289,7 +3296,7 @@ var useAudioThreadContext = function() {
 };
 // src/components/threads/AudioThread/BarsVisualizer/index.tsx
 var import_lodash8 = __toESM(require("lodash"), 1);
-var import_themes41 = require("@radix-ui/themes");
+var import_themes42 = require("@radix-ui/themes");
 var import_react42 = require("react");
 var import_radash12 = require("radash");
 var import_jsx_runtime56 = require("react/jsx-runtime");
@@ -3329,7 +3336,7 @@ var BarsVisualizer = function(param) {
         cachedEmptyVisualizer,
         getEmptyVisualizer
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Grid, {
+    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Grid, {
         columns: "".concat(barCount),
         gap: "1",
         width: "auto",
@@ -3338,12 +3345,12 @@ var BarsVisualizer = function(param) {
             gridTemplateColumns: "repeat(4, minmax(0, 1fr))"
         },
         children: barHeights.map(function(barHeight, index) {
-            return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Flex, {
+            return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Flex, {
                 direction: "column",
                 align: "center",
                 justify: "center",
                 height: height,
-                children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes41.Flex, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_themes42.Flex, {
                     minHeight: "50%",
                     maxHeight: "100%",
                     height: "".concat(barHeight + 20, "%"),
@@ -3361,13 +3368,13 @@ var BarsVisualizer = function(param) {
 var import_jsx_runtime57 = require("react/jsx-runtime");
 var Visualization = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes42.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes43.Flex, {
         direction: "column",
         align: "center",
         justify: "center",
         mb: "3",
         flexGrow: "1",
-        children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes42.Flex, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_themes43.Flex, {
             align: "center",
             justify: "center",
             height: "200px",
@@ -3387,21 +3394,21 @@ var Visualization = function() {
 };
 // src/components/threads/AudioThread/Form/index.tsx
 var import_react_icons10 = require("@radix-ui/react-icons");
-var import_themes44 = require("@radix-ui/themes");
+var import_themes45 = require("@radix-ui/themes");
 // src/components/threads/AudioThread/Form/ActionButton/index.tsx
-var import_themes43 = require("@radix-ui/themes");
+var import_themes44 = require("@radix-ui/themes");
 var import_react_icons9 = require("@radix-ui/react-icons");
 var import_jsx_runtime58 = require("react/jsx-runtime");
 var ActionButton = function() {
     var audioThreadContext = useAudioThreadContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_themes43.Flex, {
+        return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_themes44.Flex, {
             align: "center",
             children: [
-                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.Flex, {
+                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.Flex, {
                     mr: "3",
                     ml: "-7",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.IconButton, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.IconButton, {
                         onClick: audioThreadContext.recorderProps.pause,
                         color: "gray",
                         radius: "full",
@@ -3409,7 +3416,7 @@ var ActionButton = function() {
                         children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react_icons9.PauseIcon, {})
                     })
                 }),
-                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.IconButton, {
+                /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.IconButton, {
                     onClick: audioThreadContext.recorderProps.stop,
                     color: "gray",
                     highContrast: true,
@@ -3424,7 +3431,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "recorderPaused") {
-        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.IconButton, {
             onClick: audioThreadContext.recorderProps.resume,
             color: "red",
             radius: "full",
@@ -3436,7 +3443,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "idle") {
-        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.IconButton, {
             onClick: function() {
                 return audioThreadContext.recorderProps.start();
             },
@@ -3449,7 +3456,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "playing") {
-        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.IconButton, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.pause();
             },
@@ -3463,7 +3470,7 @@ var ActionButton = function() {
         });
     }
     if (audioThreadContext.status === "playerPaused") {
-        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.IconButton, {
+        return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.IconButton, {
             onClick: function() {
                 return audioThreadContext.messageAudioProps.play();
             },
@@ -3476,7 +3483,7 @@ var ActionButton = function() {
             children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_react_icons9.ResumeIcon, {})
         });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes43.IconButton, {
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_themes44.IconButton, {
         size: "4",
         color: "red",
         radius: "full",
@@ -3490,15 +3497,15 @@ var ActionButton = function() {
 var import_jsx_runtime59 = require("react/jsx-runtime");
 var Form = function() {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes44.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes45.Flex, {
         direction: "column",
         align: "center",
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes44.Flex, {
+            /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_themes45.Flex, {
                 pb: "3",
                 align: "center",
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes44.Flex, {
+                    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes45.Flex, {
                         ml: "-5",
                         mr: "2",
                         align: "center",
@@ -3508,7 +3515,7 @@ var Form = function() {
                             }
                         })
                     }),
-                    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes44.Flex, {
+                    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_themes45.Flex, {
                         px: "2",
                         py: "1",
                         style: {
@@ -3565,10 +3572,10 @@ var import_react44 = require("react");
 var import_react43 = require("react");
 var import_radash13 = require("radash");
 var import_react_children_utilities = require("react-children-utilities");
-var import_themes46 = require("@radix-ui/themes");
+var import_themes47 = require("@radix-ui/themes");
 // src/components/suggestions/Suggestions/Item.tsx
 var import_react_icons11 = require("@radix-ui/react-icons");
-var import_themes45 = require("@radix-ui/themes");
+var import_themes46 = require("@radix-ui/themes");
 var import_jsx_runtime62 = require("react/jsx-runtime");
 var Item = function(param) {
     var suggestion = param.suggestion, isDisabled = param.isDisabled;
@@ -3587,7 +3594,7 @@ var Item = function(param) {
 };
 var Content5 = function(param) {
     var onClick = param.onClick, isDisabled = param.isDisabled, isPending = param.isPending, children = param.children;
-    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes45.Button, {
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_themes46.Button, {
         variant: "soft",
         onClick: onClick,
         disabled: isDisabled,
@@ -3597,12 +3604,12 @@ var Content5 = function(param) {
             flexShrink: 1
         },
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.Text, {
+            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes46.Text, {
                 size: "1",
                 weight: "regular",
                 children: children
             }),
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes45.Spinner, {
+            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_themes46.Spinner, {
                 loading: isPending,
                 children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_react_icons11.ArrowUpIcon, {
                     style: {
@@ -3629,7 +3636,7 @@ var Content6 = function(param) {
         children
     ]);
     if ((0, import_radash13.isEmpty)(suggestions)) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes46.Flex, {
+    return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_themes47.Flex, {
         gap: "2",
         py: "2",
         wrap: "wrap",