@promptbook/components 0.105.0-11 → 0.105.0-12

package/esm/index.es.js

@@ -35,7 +35,7 @@ const BOOK_LANGUAGE_VERSION = '2.0.0';
  * @generated
  * @see https://github.com/webgptorg/promptbook
  */
-const PROMPTBOOK_ENGINE_VERSION = '0.105.0-11';
+const PROMPTBOOK_ENGINE_VERSION = '0.105.0-12';
 /**
  * TODO: string_promptbook_version should be constrained to the all versions of Promptbook engine
  * Note: [💞] Ignore a discrepancy between file name and entity name
@@ -11456,7 +11456,9 @@ const ChatMessageItem = memo(({ message, participant, participants, isLastMessag
                             const toolInfo = TOOL_TITLES[toolCall.name];
                             const toolTitle = (toolTitles === null || toolTitles === void 0 ? void 0 : toolTitles[toolCall.name]) || (toolInfo === null || toolInfo === void 0 ? void 0 : toolInfo.title);
                             const emoji = (toolInfo === null || toolInfo === void 0 ? void 0 : toolInfo.emoji) || '🛠️';
-                            return (jsxs("div", { className: chatStyles.ongoingToolCall, children: [jsx("div", { className: chatStyles.ongoingToolCallSpinner }), jsx("span", { className: chatStyles.ongoingToolCallName, children: toolTitle ? `${emoji} ${toolTitle}...` : `${emoji} Executing ${toolCall.name}...` })] }, index));
+                            return (jsxs("div", { className: chatStyles.ongoingToolCall, children: [jsx("div", { className: chatStyles.ongoingToolCallSpinner }), jsx("span", { className: chatStyles.ongoingToolCallName, children: toolTitle
+                                            ? `${emoji} ${toolTitle}...`
+                                            : `${emoji} Executing ${toolCall.name}...` })] }, index));
                         })) : (jsx("span", { className: chatStyles.NonCompleteMessageFiller, children: '_'.repeat(70) })) })), shouldShowButtons && (jsx("div", { className: chatStyles.messageButtons, children: buttons.map((button, buttonIndex) => (jsx("button", { className: chatStyles.messageButton, onClick: (event) => {
                                 event.stopPropagation();
                                 if (onMessage) {
@@ -11576,7 +11578,6 @@ function Chat(props) {
     const [isUploading, setIsUploading] = useState(false);
     // Voice recognition state
     const [speechRecognitionState, setSpeechRecognitionState] = useState('IDLE');
-    const [speechRecognitionText, setSpeechRecognitionText] = useState('');
     // Use mobile detection from the hook
     const isMobile = isMobileFromHook;
     useEffect(( /* Focus textarea on page load */) => {
@@ -11597,23 +11598,16 @@ function Chat(props) {
         const unsubscribe = speechRecognition.subscribe((event) => {
             if (event.type === 'START') {
                 setSpeechRecognitionState('RECORDING');
-                setSpeechRecognitionText('');
             }
             else if (event.type === 'RESULT') {
-                setSpeechRecognitionText(event.text);
+                // [🧠] Note: This logic assumes that interim results are being updated.
+                //      For OpenAiSpeechRecognition, it's just one final result.
                 if (textareaRef.current) {
                     const textarea = textareaRef.current;
                     const currentValue = textarea.value;
-                    const lastResult = speechRecognitionText;
-                    // If the current value ends with the last interim result, replace it
-                    if (lastResult && currentValue.endsWith(lastResult)) {
-                        textarea.value = currentValue.slice(0, -lastResult.length) + event.text;
-                    }
-                    else {
-                        // Otherwise just append with a space if needed
-                        const separator = currentValue && !currentValue.endsWith(' ') ? ' ' : '';
-                        textarea.value += separator + event.text;
-                    }
+                    // Append the transcribed text with a space if needed
+                    const separator = currentValue && !currentValue.endsWith(' ') && !currentValue.endsWith('\n') ? ' ' : '';
+                    textarea.value += separator + event.text;
                     if (onChange) {
                         onChange(textarea.value);
                     }
@@ -11625,13 +11619,12 @@ function Chat(props) {
             }
             else if (event.type === 'STOP') {
                 setSpeechRecognitionState('IDLE');
-                setSpeechRecognitionText('');
             }
         });
         return () => {
             unsubscribe();
         };
-    }, [speechRecognition, onChange, speechRecognitionText]);
+    }, [speechRecognition, onChange]);
     const handleToggleVoiceInput = useCallback(() => {
         if (!speechRecognition) {
             return;
@@ -11688,6 +11681,15 @@ function Chat(props) {
         event.preventDefault();
         setIsDragOver(false);
     }, []);
+    const handlePaste = useCallback((event) => {
+        if (!onFileUpload)
+            return;
+        const files = event.clipboardData.files;
+        if (files.length > 0) {
+            // event.preventDefault(); // [🧠] Do NOT prevent default, because we want to allow pasting text too
+            handleFileUpload(files);
+        }
+    }, [onFileUpload, handleFileUpload]);
     const handleFileInputChange = useCallback((event) => {
         const files = event.target.files;
         if (files && files.length > 0) {
@@ -11934,7 +11936,7 @@ function Chat(props) {
                                             '--brand-color': buttonColor.toHex(),
                                         }, children: [jsx("textarea", { ref: (element) => {
                                                     textareaRef.current = element;
-                                                }, style: {
+                                                }, onPaste: handlePaste, style: {
                                                     height: Math.max(countLines(((_b = textareaRef.current) === null || _b === void 0 ? void 0 : _b.value) || defaultMessage || ''), (((_c = textareaRef.current) === null || _c === void 0 ? void 0 : _c.value) || defaultMessage || '').split('\n')
                                                         .length, 3) *
                                                         25 +
@@ -12002,13 +12004,27 @@ function Chat(props) {
                                 ? JSON.parse(selectedToolCall.arguments)
                                 : selectedToolCall.arguments || {};
                             const resultRaw = selectedToolCall.result;
-                            const results = Array.isArray(resultRaw)
+                            let results = Array.isArray(resultRaw)
                                 ? resultRaw
                                 : resultRaw && typeof resultRaw === 'object' && Array.isArray(resultRaw.results)
                                     ? resultRaw.results
                                     : [];
+                            // [🧠] In Agent Server, search result might be wrapped in another result object
+                            if (results.length === 0 &&
+                                resultRaw &&
+                                typeof resultRaw === 'object' &&
+                                resultRaw.result) {
+                                const subResult = resultRaw.result;
+                                results = Array.isArray(subResult)
+                                    ? subResult
+                                    : subResult && typeof subResult === 'object' && Array.isArray(subResult.results)
+                                        ? subResult.results
+                                        : [];
+                            }
                             if (isSearch) {
-                                return (jsxs(Fragment, { children: [jsxs("div", { className: chatStyles.searchModalHeader, children: [jsx("span", { className: chatStyles.searchModalIcon, children: "\uD83D\uDD0E" }), jsx("h3", { className: chatStyles.searchModalQuery, children: args.query || 'Search Results' })] }), jsx("div", { className: chatStyles.searchModalContent, children: results.length > 0 ? (jsx("div", { className: chatStyles.searchResultsList, children: results.map((item, i) => (jsxs("div", { className: chatStyles.searchResultItem, children: [jsx("div", { className: chatStyles.searchResultUrl, children: item.url && (jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.url })) }), jsx("h4", { className: chatStyles.searchResultTitle, children: item.url ? (jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.title || 'Untitled' })) : (item.title || 'Untitled') }), jsx("p", { className: chatStyles.searchResultSnippet, children: item.snippet || item.content || '' })] }, i))) })) : (jsx("div", { className: chatStyles.noResults, children: resultRaw ? 'No search results found.' : 'Executing search...' })) })] }));
+                                return (jsxs(Fragment, { children: [jsxs("div", { className: chatStyles.searchModalHeader, children: [jsx("span", { className: chatStyles.searchModalIcon, children: "\uD83D\uDD0E" }), jsx("h3", { className: chatStyles.searchModalQuery, children: args.query || args.searchText || 'Search Results' })] }), jsx("div", { className: chatStyles.searchModalContent, children: results.length > 0 ? (jsx("div", { className: chatStyles.searchResultsList, children: results.map((item, i) => (jsxs("div", { className: chatStyles.searchResultItem, children: [jsx("div", { className: chatStyles.searchResultUrl, children: item.url && (jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.url })) }), jsx("h4", { className: chatStyles.searchResultTitle, children: item.url ? (jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.title || 'Untitled' })) : (item.title || 'Untitled') }), jsx("p", { className: chatStyles.searchResultSnippet, children: item.snippet || item.content || '' })] }, i))) })) : (jsx("div", { className: chatStyles.noResults, children: resultRaw
+                                                    ? 'No search results found.'
+                                                    : 'Search results are not available.' })) })] }));
                             }
                             // Fallback for other tools
                             return (jsxs(Fragment, { children: [jsxs("h3", { children: ["Tool Call: ", (toolTitles === null || toolTitles === void 0 ? void 0 : toolTitles[selectedToolCall.name]) || selectedToolCall.name] }), jsxs("div", { className: chatStyles.toolCallDetails, children: [jsx("p", { children: jsx("strong", { children: "Arguments:" }) }), jsx("div", { className: chatStyles.toolCallDataContainer, children: args && typeof args === 'object' ? (jsx("ul", { className: chatStyles.toolCallArgsList, children: Object.entries(args).map(([key, value]) => (jsxs("li", { children: [jsxs("strong", { children: [key, ":"] }), ' ', typeof value === 'object'
@@ -18361,11 +18377,35 @@ class OpenAiCompatibleExecutionTools {
                     },
                 ]),
             ...threadMessages,
-            {
+        ];
+        if ('files' in prompt && Array.isArray(prompt.files) && prompt.files.length > 0) {
+            const filesContent = await Promise.all(prompt.files.map(async (file) => {
+                const arrayBuffer = await file.arrayBuffer();
+                const base64 = Buffer.from(arrayBuffer).toString('base64');
+                return {
+                    type: 'image_url',
+                    image_url: {
+                        url: `data:${file.type};base64,${base64}`,
+                    },
+                };
+            }));
+            messages.push({
+                role: 'user',
+                content: [
+                    {
+                        type: 'text',
+                        text: rawPromptContent,
+                    },
+                    ...filesContent,
+                ],
+            });
+        }
+        else {
+            messages.push({
                 role: 'user',
                 content: rawPromptContent,
-            },
-        ];
+            });
+        }
         let totalUsage = {
             price: uncertainNumber(0),
             input: {
@@ -19148,6 +19188,27 @@ class OpenAiExecutionTools extends OpenAiCompatibleExecutionTools {
     }
 }
 
+/**
+ * Uploads files to OpenAI and returns their IDs
+ *
+ * @private utility for `OpenAiAssistantExecutionTools` and `OpenAiCompatibleExecutionTools`
+ */
+async function uploadFilesToOpenAi(client, files) {
+    const fileIds = [];
+    for (const file of files) {
+        // Note: OpenAI API expects a File object or a ReadStream
+        // In browser environment, we can pass the File object directly
+        // In Node.js environment, we might need to convert it or use a different approach
+        // But since `Prompt.files` already contains `File` objects, we try to pass them directly
+        const uploadedFile = await client.files.create({
+            file: file,
+            purpose: 'assistants',
+        });
+        fileIds.push(uploadedFile.id);
+    }
+    return fileIds;
+}
+
 /**
  * Execution Tools for calling OpenAI API Assistants
  *
@@ -19244,16 +19305,26 @@ class OpenAiAssistantExecutionTools extends OpenAiExecutionTools {
         const threadMessages = [];
         // TODO: [🈹] Maybe this should not be here but in other place, look at commit 39d705e75e5bcf7a818c3af36bc13e1c8475c30c
         // Add previous messages from thread (if any)
-        if ('thread' in prompt &&
-            Array.isArray(prompt.thread)) {
+        if ('thread' in prompt && Array.isArray(prompt.thread)) {
             const previousMessages = prompt.thread.map((msg) => ({
-                role: (msg.role === 'assistant' ? 'assistant' : 'user'),
+                role: (msg.sender === 'assistant' ? 'assistant' : 'user'),
                 content: msg.content,
             }));
             threadMessages.push(...previousMessages);
         }
         // Always add the current user message
-        threadMessages.push({ role: 'user', content: rawPromptContent });
+        const currentUserMessage = {
+            role: 'user',
+            content: rawPromptContent,
+        };
+        if ('files' in prompt && Array.isArray(prompt.files) && prompt.files.length > 0) {
+            const fileIds = await uploadFilesToOpenAi(client, prompt.files);
+            currentUserMessage.attachments = fileIds.map((fileId) => ({
+                file_id: fileId,
+                tools: [{ type: 'file_search' }, { type: 'code_interpreter' }],
+            }));
+        }
+        threadMessages.push(currentUserMessage);
         // Check if tools are being used - if so, use non-streaming mode
         const hasTools = modelRequirements.tools !== undefined && modelRequirements.tools.length > 0;
         const start = $getCurrentDate();