@superinterface/react 3.2.0 → 3.3.0

package/dist/index.d.cts

@@ -92,6 +92,7 @@ declare const Thread: {
                 } & StyleProps) => react_jsx_runtime.JSX.Element;
                 Input: (props: Omit<StyleProps, "style"> & {
                     style?: Omit<React.CSSProperties, "minHeight" | "maxHeight" | "height">;
+                    placeholder?: string;
                 }) => react_jsx_runtime.JSX.Element;
             };
             Files: {

package/dist/index.d.ts

@@ -92,6 +92,7 @@ declare const Thread: {
                 } & StyleProps) => react_jsx_runtime.JSX.Element;
                 Input: (props: Omit<StyleProps, "style"> & {
                     style?: Omit<React.CSSProperties, "minHeight" | "maxHeight" | "height">;
+                    placeholder?: string;
                 }) => react_jsx_runtime.JSX.Element;
             };
             Files: {

package/dist/index.js

@@ -2426,7 +2426,7 @@ var Annotation = function(param) {
     return null;
 };
 // src/contexts/markdown/MarkdownContext/lib/components/index.tsx
-import { jsx as jsx43 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx43, jsxs as jsxs15 } from "react/jsx-runtime";
 var components = {
     p: Paragraph,
     a: Link,
@@ -2480,10 +2480,17 @@ var components = {
         });
     },
     table: function(props) {
-        return /* @__PURE__ */ jsx43(Table.Root, _object_spread_props(_object_spread({}, props), {
-            variant: "surface",
-            mb: "3"
-        }));
+        return /* @__PURE__ */ jsxs15(Fragment, {
+            children: [
+                /* @__PURE__ */ jsx43("style", {
+                    children: ".rt-TableRootTable { overflow: inherit; }"
+                }),
+                /* @__PURE__ */ jsx43(Table.Root, _object_spread_props(_object_spread({}, props), {
+                    variant: "surface",
+                    mb: "3"
+                }))
+            ]
+        });
     },
     thead: Table.Header,
     tbody: Table.Body,
@@ -2715,7 +2722,7 @@ var ContentPart = function(param) {
     return null;
 };
 // src/components/threads/Thread/Message/index.tsx
-import { jsx as jsx47, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs16 } from "react/jsx-runtime";
 var Message = function(param) {
     var message = param.message, className = param.className, style = param.style;
     var _useMemo8 = _sliced_to_array(useMemo8(function() {
@@ -2764,14 +2771,14 @@ var Message = function(param) {
         value: {
             message: message
         },
-        children: /* @__PURE__ */ jsxs15(Box9, {
+        children: /* @__PURE__ */ jsxs16(Box9, {
             className: className,
             style: style,
             children: [
                 /* @__PURE__ */ jsx47(RunSteps, {
                     runSteps: olderRunSteps
                 }),
-                /* @__PURE__ */ jsxs15(Box9, {
+                /* @__PURE__ */ jsxs16(Box9, {
                     children: [
                         /* @__PURE__ */ jsx47(Attachments, {
                             message: message
@@ -2905,9 +2912,9 @@ var Name = function(param) {
     });
 };
 // src/components/skeletons/MessagesSkeleton/index.tsx
-import { jsx as jsx50, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs17 } from "react/jsx-runtime";
 var MessagesSkeleton = forwardRef2(function MessagesSkeleton2(_props, ref) {
-    return /* @__PURE__ */ jsxs16(MessageGroupBase, {
+    return /* @__PURE__ */ jsxs17(MessageGroupBase, {
         ref: ref,
         children: [
             /* @__PURE__ */ jsx50(Skeleton2, {
@@ -2917,7 +2924,7 @@ var MessagesSkeleton = forwardRef2(function MessagesSkeleton2(_props, ref) {
                     size: "1"
                 })
             }),
-            /* @__PURE__ */ jsxs16(Box10, {
+            /* @__PURE__ */ jsxs17(Box10, {
                 pb: "3",
                 children: [
                     /* @__PURE__ */ jsx50(Name, {
@@ -3028,14 +3035,14 @@ var Content5 = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/MessageGroup/index.tsx
-import { jsx as jsx56, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs18 } from "react/jsx-runtime";
 var MessageGroup = function(param) {
     var messageGroup = param.messageGroup;
     var assistantNameContext = useContext8(AssistantNameContext);
-    return /* @__PURE__ */ jsxs17(MessageGroupBase, {
+    return /* @__PURE__ */ jsxs18(MessageGroupBase, {
         children: [
             messageGroup.role === "user" ? /* @__PURE__ */ jsx56(UserAvatar, {}) : /* @__PURE__ */ jsx56(AssistantAvatar, {}),
-            /* @__PURE__ */ jsxs17(Box11, {
+            /* @__PURE__ */ jsxs18(Box11, {
                 flexGrow: "1",
                 children: [
                     /* @__PURE__ */ jsx56(Name, {
@@ -3050,7 +3057,7 @@ var MessageGroup = function(param) {
     });
 };
 // src/components/threads/Thread/Messages/Content/index.tsx
-import { Fragment, jsx as jsx57 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx57 } from "react/jsx-runtime";
 var Content6 = function() {
     var _useMessages = useMessages(), messages2 = _useMessages.messages, isLoading = _useMessages.isLoading, isLoadingError = _useMessages.isLoadingError;
     var addToast = useToasts().addToast;
@@ -3071,7 +3078,7 @@ var Content6 = function() {
     if (isLoading || isLoadingError) {
         return /* @__PURE__ */ jsx57(MessagesSkeleton, {});
     }
-    return /* @__PURE__ */ jsx57(Fragment, {
+    return /* @__PURE__ */ jsx57(Fragment2, {
         children: messageGroups2.map(function(messageGroup) {
             return /* @__PURE__ */ jsx57(MessageGroup, {
                 messageGroup: messageGroup
@@ -3084,14 +3091,14 @@ import { useMemo as useMemo10 } from "react";
 // src/components/skeletons/StartingSkeleton/index.tsx
 import { useContext as useContext9 } from "react";
 import { Box as Box12 } from "@radix-ui/themes";
-import { jsx as jsx58, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs19 } from "react/jsx-runtime";
 var StartingSkeleton = function(param) {
     var children = param.children;
     var assistantNameContext = useContext9(AssistantNameContext);
-    return /* @__PURE__ */ jsxs18(MessageGroupBase, {
+    return /* @__PURE__ */ jsxs19(MessageGroupBase, {
         children: [
             /* @__PURE__ */ jsx58(AssistantAvatar, {}),
-            /* @__PURE__ */ jsxs18(Box12, {
+            /* @__PURE__ */ jsxs19(Box12, {
                 children: [
                     /* @__PURE__ */ jsx58(Name, {
                         children: assistantNameContext
@@ -3180,7 +3187,7 @@ var useInfiniteScroll = function(param) {
     };
 };
 // src/components/threads/Thread/Messages/Root/index.tsx
-import { jsx as jsx60, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs20 } from "react/jsx-runtime";
 var Root2 = function(param) {
     var children = param.children, style = param.style, className = param.className;
     var _useMessages = useMessages(), isFetchingNextPage = _useMessages.isFetchingNextPage, hasNextPage = _useMessages.hasNextPage, fetchNextPage = _useMessages.fetchNextPage;
@@ -3189,7 +3196,7 @@ var Root2 = function(param) {
         hasNextPage: hasNextPage,
         fetchNextPage: fetchNextPage
     }), containerRef = _useInfiniteScroll.containerRef, loaderRef = _useInfiniteScroll.loaderRef;
-    return /* @__PURE__ */ jsxs19(Flex17, {
+    return /* @__PURE__ */ jsxs20(Flex17, {
         ref: containerRef,
         direction: "column-reverse",
         flexGrow: "1",
@@ -3219,10 +3226,10 @@ var NextPageSkeleton = function() {
     return /* @__PURE__ */ jsx61(MessagesSkeleton, {});
 };
 // src/components/threads/Thread/Messages/index.tsx
-import { jsx as jsx62, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs21 } from "react/jsx-runtime";
 var Messages = function(param) {
     var children = param.children, className = param.className, style = param.style;
-    return /* @__PURE__ */ jsxs20(Root2, {
+    return /* @__PURE__ */ jsxs21(Root2, {
         style: style,
         className: className,
         children: [
@@ -3456,13 +3463,13 @@ import { useContext as useContext11, useMemo as useMemo12, useRef as useRef5, us
 // src/components/textareas/TextareaBase/index.tsx
 import { forwardRef as forwardRef3 } from "react";
 import TextareaAutosize from "react-textarea-autosize";
-import { Fragment as Fragment2, jsx as jsx65, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx65, jsxs as jsxs22 } from "react/jsx-runtime";
 var TextareaBase = forwardRef3(function TextareaBase2(_param, ref) {
     var style = _param.style, className = _param.className, rest = _object_without_properties(_param, [
         "style",
         "className"
     ]);
-    return /* @__PURE__ */ jsxs21(Fragment2, {
+    return /* @__PURE__ */ jsxs22(Fragment3, {
         children: [
             /* @__PURE__ */ jsx65("style", {
                 children: ".superinterface-textarea { min-height: inherit; height: 30px; }\n.superinterface-textarea::placeholder { color: var(--gray-a10); }"
@@ -3518,9 +3525,10 @@ var Input = function(props) {
         isDisabledPrevious,
         textareaProps
     ]);
+    var _props_placeholder;
     return /* @__PURE__ */ jsx66(TextareaBase, _object_spread_props(_object_spread({
         minRows: 1,
-        placeholder: "Message ".concat(assistantNameContext, "..."),
+        placeholder: (_props_placeholder = props.placeholder) !== null && _props_placeholder !== void 0 ? _props_placeholder : "Message ".concat(assistantNameContext, "..."),
         disabled: isDisabled,
         onKeyDown: function(e) {
             if (e.key === "Enter" && !e.shiftKey) {
@@ -3547,7 +3555,7 @@ Control.Input = Input;
 // src/components/threads/Thread/MessageForm/Field/Files/Preview.tsx
 import { Flex as Flex21, Card as Card2, Spinner as Spinner2, Text as Text7, IconButton as IconButton6 } from "@radix-ui/themes";
 import { FileIcon as FileIcon2, Cross2Icon } from "@radix-ui/react-icons";
-import { jsx as jsx67, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs23 } from "react/jsx-runtime";
 var Preview = function(props) {
     var _useMessageFormContext = useMessageFormContext(), files = _useMessageFormContext.files, setFiles = _useMessageFormContext.setFiles;
     if (!files.length) {
@@ -3562,12 +3570,12 @@ var Preview = function(props) {
         children: files.map(function(file) {
             return /* @__PURE__ */ jsx67(Card2, {
                 variant: "ghost",
-                children: /* @__PURE__ */ jsxs22(Flex21, {
+                children: /* @__PURE__ */ jsxs23(Flex21, {
                     align: "center",
                     justify: "between",
                     gap: "1",
                     children: [
-                        /* @__PURE__ */ jsxs22(Flex21, {
+                        /* @__PURE__ */ jsxs23(Flex21, {
                             align: "center",
                             gap: "1",
                             flexShrink: "1",
@@ -3729,7 +3737,7 @@ var useCreateFile = function() {
     });
 };
 // src/components/threads/Thread/MessageForm/Field/Files/Control.tsx
-import { jsx as jsx68, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs24 } 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(props) {
     var _useMessageFormContext = useMessageFormContext(), isDisabled = _useMessageFormContext.isDisabled, isLoading = _useMessageFormContext.isLoading, setFiles = _useMessageFormContext.setFiles;
@@ -3908,7 +3916,7 @@ var Control2 = function(props) {
         pr: "2",
         flexGrow: "0"
     }, props), {
-        children: /* @__PURE__ */ jsxs23(IconButton7, {
+        children: /* @__PURE__ */ jsxs24(IconButton7, {
             type: "button",
             variant: "ghost",
             color: "gray",
@@ -3983,10 +3991,10 @@ var Field = {
     Files: Files
 };
 // src/components/threads/Thread/MessageForm/index.tsx
-import { jsx as jsx70, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx70, jsxs as jsxs25 } from "react/jsx-runtime";
 var MessageForm = function(props) {
     return /* @__PURE__ */ jsx70(Root4, _object_spread_props(_object_spread({}, props), {
-        children: /* @__PURE__ */ jsxs24(Field.Root, {
+        children: /* @__PURE__ */ jsxs25(Field.Root, {
             children: [
                 /* @__PURE__ */ jsx70(Field.Control, {}),
                 /* @__PURE__ */ jsx70(Submit, {})
@@ -4008,13 +4016,13 @@ import * as Toast2 from "@radix-ui/react-toast";
 import * as Toast from "@radix-ui/react-toast";
 import { Card as Card3, Text as Text8, Flex as Flex24 } from "@radix-ui/themes";
 import { CheckCircledIcon as CheckCircledIcon2, CrossCircledIcon } from "@radix-ui/react-icons";
-import { jsx as jsx71, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx71, jsxs as jsxs26 } from "react/jsx-runtime";
 var CustomToast = function(param) {
     var toast = param.toast;
     return /* @__PURE__ */ jsx71(Toast.Root, {
         children: /* @__PURE__ */ jsx71(Card3, {
             children: /* @__PURE__ */ jsx71(Toast.Title, {
-                children: /* @__PURE__ */ jsxs25(Flex24, {
+                children: /* @__PURE__ */ jsxs26(Flex24, {
                     children: [
                         /* @__PURE__ */ jsx71(Flex24, {
                             pr: "2",
@@ -4038,7 +4046,7 @@ var CustomToast = function(param) {
     });
 };
 // src/components/toasts/ToastsProvider/index.tsx
-import { jsx as jsx72, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx72, jsxs as jsxs27 } from "react/jsx-runtime";
 var ToastsProvider = function(param) {
     var children = param.children, _param_bottom = param.bottom, bottom = _param_bottom === void 0 ? 0 : _param_bottom;
     var _useState3 = _sliced_to_array(useState3([]), 2), toasts = _useState3[0], setToasts = _useState3[1];
@@ -4054,7 +4062,7 @@ var ToastsProvider = function(param) {
             toasts: toasts,
             addToast: addToast
         },
-        children: /* @__PURE__ */ jsxs26(Toast2.Provider, {
+        children: /* @__PURE__ */ jsxs27(Toast2.Provider, {
             children: [
                 children,
                 Array.from(toasts).map(function(toast, index) {
@@ -4105,9 +4113,9 @@ var Root8 = function(_param) {
     });
 };
 // src/components/threads/Thread/index.tsx
-import { jsx as jsx74, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx74, jsxs as jsxs28 } from "react/jsx-runtime";
 var Thread = function(props) {
-    return /* @__PURE__ */ jsxs27(Root8, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ jsxs28(Root8, _object_spread_props(_object_spread({}, props), {
         children: [
             /* @__PURE__ */ jsx74(Messages, {}),
             /* @__PURE__ */ jsx74(MessageForm, {})
@@ -4341,7 +4349,7 @@ var Close = function() {
     });
 };
 // src/components/threads/ThreadDialog/Content/index.tsx
-import { jsx as jsx80, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx80, jsxs as jsxs29 } from "react/jsx-runtime";
 var Root11 = function(param) {
     var children = param.children, className = param.className, style = param.style;
     var isOpen = useThreadDialogContext().isOpen;
@@ -4375,7 +4383,7 @@ var Root11 = function(param) {
         style: _object_spread({
             zIndex: 9999999999
         }, style),
-        children: /* @__PURE__ */ jsxs28(Card4, {
+        children: /* @__PURE__ */ jsxs29(Card4, {
             mb: {
                 initial: void 0,
                 sm: "3"
@@ -4427,7 +4435,7 @@ var FormContainer = function(param) {
 };
 var Content7 = function(props) {
     return /* @__PURE__ */ jsx80(Root11, _object_spread_props(_object_spread({}, props), {
-        children: /* @__PURE__ */ jsxs28(Thread.Root, {
+        children: /* @__PURE__ */ jsxs29(Thread.Root, {
             children: [
                 /* @__PURE__ */ jsx80(Messages2, {}),
                 /* @__PURE__ */ jsx80(FormContainer, {
@@ -4441,9 +4449,9 @@ Content7.Root = Root11;
 Content7.Messages = Messages2;
 Content7.FormContainer = FormContainer;
 // src/components/threads/ThreadDialog/index.tsx
-import { jsx as jsx81, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx81, jsxs as jsxs30 } from "react/jsx-runtime";
 var ThreadDialog = function() {
-    return /* @__PURE__ */ jsxs29(Root9, {
+    return /* @__PURE__ */ jsxs30(Root9, {
         children: [
             /* @__PURE__ */ jsx81(Content7, {}),
             /* @__PURE__ */ jsx81(Trigger, {})
@@ -5134,7 +5142,7 @@ var BarsVisualizer = function(param) {
     });
 };
 // src/components/threads/AudioThread/Visualization/index.tsx
-import { jsx as jsx84, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx84, jsxs as jsxs31 } from "react/jsx-runtime";
 var Visualization = function(props) {
     var audioThreadContext = useAudioThreadContext();
     var assistantNameContext = useContext15(AssistantNameContext);
@@ -5162,7 +5170,7 @@ var Visualization = function(props) {
         draw,
         audioThreadContext
     ]);
-    return /* @__PURE__ */ jsxs30(Flex31, _object_spread_props(_object_spread({
+    return /* @__PURE__ */ jsxs31(Flex31, _object_spread_props(_object_spread({
         direction: "column",
         align: "center",
         justify: "center",
@@ -5187,7 +5195,7 @@ var Visualization = function(props) {
                     barWidth: "24px"
                 })
             }),
-            /* @__PURE__ */ jsxs30(Flex31, {
+            /* @__PURE__ */ jsxs31(Flex31, {
                 ml: "-22.5px",
                 gap: "3",
                 pt: "5",
@@ -5203,7 +5211,7 @@ var Visualization = function(props) {
 };
 // src/components/threads/AudioThread/Status/StatusMessages.tsx
 import { Flex as Flex32, Text as Text9 } from "@radix-ui/themes";
-import { jsx as jsx85, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx85, jsxs as jsxs32 } 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) {
@@ -5212,7 +5220,7 @@ var html = function(param) {
 };
 var StatusMessages = function(param) {
     var texts = param.texts, className = param.className, style = param.style;
-    return /* @__PURE__ */ jsxs31(Flex32, {
+    return /* @__PURE__ */ jsxs32(Flex32, {
         justify: "center",
         pb: "5",
         className: className,
@@ -5295,12 +5303,12 @@ var MicIcon = function(props) {
 // src/components/threads/AudioThread/Form/ActionButton/index.tsx
 import { Flex as Flex33, IconButton as IconButton10 } from "@radix-ui/themes";
 import { StopIcon as StopIcon2, PauseIcon as PauseIcon2, ArrowUpIcon as ArrowUpIcon3, ResumeIcon } from "@radix-ui/react-icons";
-import { jsx as jsx88, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx88, jsxs as jsxs33 } from "react/jsx-runtime";
 var ActionButton = function() {
     var audioThreadContext = useAudioThreadContext();
     var superinterfaceContext = useSuperinterfaceContext();
     if (audioThreadContext.status === "recording") {
-        return /* @__PURE__ */ jsxs32(Flex33, {
+        return /* @__PURE__ */ jsxs33(Flex33, {
             align: "center",
             children: [
                 /* @__PURE__ */ jsx88(Flex33, {
@@ -5371,15 +5379,15 @@ var ActionButton = function() {
     });
 };
 // src/components/threads/AudioThread/Form/index.tsx
-import { jsx as jsx89, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx89, jsxs as jsxs34 } from "react/jsx-runtime";
 var Form = function(props) {
     var audioThreadContext = useAudioThreadContext();
-    return /* @__PURE__ */ jsxs33(Flex34, _object_spread_props(_object_spread({
+    return /* @__PURE__ */ jsxs34(Flex34, _object_spread_props(_object_spread({
         direction: "column",
         align: "center"
     }, props), {
         children: [
-            /* @__PURE__ */ jsxs33(Flex34, {
+            /* @__PURE__ */ jsxs34(Flex34, {
                 pb: "3",
                 align: "center",
                 children: [
@@ -5414,9 +5422,9 @@ var Form = function(props) {
     }));
 };
 // src/components/threads/AudioThread/index.tsx
-import { jsx as jsx90, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx90, jsxs as jsxs35 } from "react/jsx-runtime";
 var AudioThread = function(props) {
-    return /* @__PURE__ */ jsxs34(Root12, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ jsxs35(Root12, _object_spread_props(_object_spread({}, props), {
         children: [
             /* @__PURE__ */ jsx90(Visualization, {}),
             /* @__PURE__ */ jsx90(Status, {}),
@@ -5429,9 +5437,9 @@ AudioThread.Visualization = Visualization;
 AudioThread.Status = Status;
 AudioThread.Form = Form;
 // src/components/threads/AudioThreadDialog/index.tsx
-import { jsx as jsx91, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx91, jsxs as jsxs36 } from "react/jsx-runtime";
 var AudioThreadDialog = function(props) {
-    return /* @__PURE__ */ jsxs35(Root9, _object_spread_props(_object_spread({}, props), {
+    return /* @__PURE__ */ jsxs36(Root9, _object_spread_props(_object_spread({}, props), {
         children: [
             /* @__PURE__ */ jsx91(Content7.Root, {
                 children: /* @__PURE__ */ jsx91(AudioThread, {})