@app-studio/components 0.10.17

package/dist/native/components/ChatInput/ChatInput/ChatInput.view.js

@@ -0,0 +1,186 @@
+import React, { useCallback, useMemo } from 'react';
+import { Horizontal, Text, View, useTheme } from 'app-studio';
+import { DefaultChatInputStyles, Shapes, Sizes, Variants, } from './ChatInput.style';
+import { AttachmentGroup } from '../AttachmentGroup';
+import { EditableInput } from '../EditableInput';
+import { Uploader } from '../../Uploader/Uploader';
+import { PromptExamples } from '../PromptExamples';
+import { Loader } from '../../Loader/Loader';
+import { StopIcon, SendIcon, LoadingSpinnerIcon, AttachmentIcon, } from '../../Icon/Icon';
+import { AudioRecorder } from '../AudioRecorder';
+const ChatInputView = React.memo(({ 
+// Props from parent
+onSubmit, placeholder = 'Type your message… use @ to mention', loading = false, disabled = false, isAgentRunning = false, enableAudioRecording = false, leftButtons, rightButtons, onStopAgent, loadingText = 'Agent is working...', autoFocus = true, sandboxId, hideAttachments = false, attachmentText = '', promptExamples = [], suggestions = [], errorMessage, size = 'md', shape = 'rounded', variant = 'default', views = {}, mentionData = [], mentionTrigger = '@', onMentionSelect, onAudioRecordingStart, onAudioRecordingStop, 
+// Non-DOM props from ChatInputProps that must not leak to the underlying div
+showGuideTip, guideVideoUrl, onGuideClose, onFileBrowse, onUploadProgress, onUploadSuccess, onUploadError, onFileUpload, onPromptExampleSelect, 
+// Props from state
+value, handleChange, handleSubmit, editableRef, fileInputRef, isUploading, uploadProgress, isDraggingOver, uploadedFiles, pendingFiles, getPendingFiles, clearPendingFiles, removeUploadedFile, setPendingFiles, setUploadedFiles, setIsUploading, startUpload, selectedModel, handleModelChange, modelOptions, subscriptionStatus, canAccessModel, isGuideTipShown, hideGuideTip, handlePromptExampleSelect, handleDragOver, handleDragLeave, onChange, 
+// Other props
+...props }) => {
+    const {} = useTheme();
+    // Combine styles (memoized to avoid recreation on every render)
+    const containerStyles = useMemo(() => ({
+        ...DefaultChatInputStyles.container,
+        ...Shapes[shape],
+        ...views?.container,
+    }), [shape, views?.container]);
+    const contentStyles = useMemo(() => ({
+        ...DefaultChatInputStyles.content,
+        ...Sizes[size],
+        ...Variants[variant],
+        ...views?.content,
+    }), [size, variant, views?.content]);
+    // Determine if the submit button should be enabled
+    const hasText = (value?.trim().length ?? 0) > 0 || uploadedFiles.length > 0;
+    const handleRecordingComplete = useCallback((file) => {
+        // Enqueue and upload the recorded file
+        startUpload([file]);
+        onAudioRecordingStop?.(file);
+    }, [startUpload, onAudioRecordingStop]);
+    // Handle multiple file uploads for the Uploader component
+    const handleMultipleFileUpload = useCallback((files) => {
+        // Filter files that exceed size limit (50MB)
+        const filteredFiles = files.filter((file) => {
+            if (file.size > 50 * 1024 * 1024) {
+                console.error(`File size exceeds 50MB limit: ${file.name}`);
+                return false;
+            }
+            return true;
+        });
+        if (filteredFiles.length > 0) {
+            // Enqueue and start upload for the batch
+            startUpload(filteredFiles);
+        }
+    }, [startUpload]);
+    const handleDrop = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        handleDragLeave(e);
+        if (e.dataTransfer.files.length > 0) {
+            const files = Array.from(e.dataTransfer.files);
+            handleMultipleFileUpload(files);
+        }
+    }, [handleDragLeave, handleMultipleFileUpload]);
+    // Combine mention data with uploaded files (memoized to avoid recreation on every render)
+    const combinedMentionData = useMemo(() => [
+        ...(mentionData || []),
+        ...uploadedFiles.map((file, index) => ({
+            id: `file-${index}`,
+            name: file.name,
+        })),
+    ], [mentionData, uploadedFiles]);
+    return (<View display="flex" flexDirection="column" 
+    // Width and maxWidth will come from containerStyles
+    boxSizing="border-box" {...containerStyles} {...props} onDragOver={handleDragOver} onDragLeave={handleDragLeave} onDrop={handleDrop}>
+        {/* Prompt Examples */}
+        {promptExamples.length > 0 && (<PromptExamples examples={promptExamples} onSelect={handlePromptExampleSelect} views={{
+                container: views?.promptExamples,
+                item: views?.promptExampleItem,
+            }}/>)}
+
+        {isAgentRunning && (<Horizontal justifyContent="center" alignItems="center" gap={8} padding="8px 0" animate={{
+                from: { opacity: 0, y: -10 },
+                to: { opacity: 1, y: 0 },
+                duration: '0.3s',
+            }} 
+        // animationDuration="0.3s"
+        {...views?.loadingIndicator}>
+            <LoadingSpinnerIcon widthHeight={12} color="currentColor" filled={false} style={{ animation: 'spin 1s linear infinite' }}/>
+            <Text color="color-gray-500">{loadingText}</Text>
+          </Horizontal>)}
+
+        <View position="relative" width="100%" overflow="visible">
+          {/* Input Area */}
+          <View as="form" onSubmit={handleSubmit} overflow="visible" display="flex" flexDirection="column" position="relative" 
+    // transition="background-color 0.2s ease"
+    // Apply base styles first, then override with conditional background color
+    {...contentStyles} {...containerStyles} paddingHorizontal={16} paddingVertical={10} backgroundColor={isDraggingOver ? 'color-blue-50' : undefined}>
+            {/* Attachments */}
+            <AttachmentGroup files={uploadedFiles} sandboxId={sandboxId} onRemove={removeUploadedFile} showPreviews={true} views={{
+            container: views?.attachments,
+            item: views?.attachmentItem,
+            name: views?.attachmentName,
+            size: views?.attachmentSize,
+            removeButton: views?.attachmentRemove,
+        }}/>
+
+            {/* Editable Input */}
+            <EditableInput ref={editableRef} value={value || ''} onChange={handleChange} placeholder={placeholder} disabled={disabled && !isAgentRunning} autoFocus={autoFocus} suggestions={suggestions || []} showSuggestions={suggestions && suggestions.length > 0 && !value} onSuggestionSelect={(suggestion) => {
+            handleChange(suggestion.text);
+        }} mentionData={combinedMentionData} mentionTrigger={mentionTrigger} onMentionSelect={onMentionSelect} views={{
+            container: {},
+            input: views?.editableInput,
+        }}/>
+
+            {/* Bottom Controls */}
+            <Horizontal justifyContent="space-between" alignItems="center" marginTop="8px">
+              <Horizontal gap={8} alignItems="center">
+                {/* File Upload Button */}
+                {!hideAttachments && (<Uploader accept="*/*" icon={<AttachmentIcon widthHeight={16}/>} maxSize={50 * 1024 * 1024} // 50MB limit
+         multiple={true} onMultipleFileSelect={handleMultipleFileUpload} isLoading={isUploading} progress={uploadProgress || 0} text={attachmentText} fileType="file" renderError={({ errorMessage }) => null} views={{
+                container: {
+                    height: '36px',
+                    //margin: '0 12px',
+                    // borderRadius: '8px',
+                    // backgroundColor: 'transparent',
+                    // border: '1px solid',
+                    // borderColor: 'color-gray-300',
+                    cursor: 'pointer',
+                    _hover: {
+                        backgroundColor: 'color-gray-100',
+                    },
+                    ...views?.fileButton,
+                },
+            }} containerProps={{
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                gap: 4,
+                borderRadius: shape === 'rounded' ? '50%' : 4,
+                padding: 10,
+            }} textProps={{
+                fontSize: '14px',
+                color: 'color-gray-600',
+            }} validateFile={(file) => {
+                if (file.size > 50 * 1024 * 1024) {
+                    return 'File size exceeds 50MB limit';
+                }
+                return null;
+            }}/>)}
+                {leftButtons}
+              </Horizontal>
+
+              {/* Submit Button */}
+              <Horizontal gap={8} alignItems="center">
+                {enableAudioRecording && (<AudioRecorder onRecordingStart={onAudioRecordingStart} onRecordingComplete={handleRecordingComplete} views={{ button: views?.recordButton }}/>)}
+                <View as="button" type="button" onClick={handleSubmit} height="40px" width="40px" display="flex" alignItems="center" justifyContent="center" backgroundColor={isAgentRunning
+            ? 'theme-error'
+            : hasText
+                ? 'theme-primary'
+                : 'color-gray-300'} color="color-white" borderRadius={shape === 'rounded' ? '50%' : 4} border="none" cursor={hasText ? 'pointer' : 'not-allowed'} disabled={!hasText || loading || (disabled && !isAgentRunning)} transition="background-color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease" _hover={{
+            opacity: hasText || isAgentRunning ? 0.9 : 1,
+        }} _active={{
+            opacity: hasText || isAgentRunning ? 0.95 : 1,
+        }} _focusVisible={{
+            outline: 'none',
+            boxShadow: '0 0 0 2px white, 0 0 0 4px theme-primary',
+        }} {...views?.submitButton}>
+                  {isAgentRunning ? (<StopIcon widthHeight={16} color="currentColor" filled={false}/>) : loading ? (<Loader type="quarter" size={16} color="color-white"/>) : (<SendIcon widthHeight={16} color="currentColor" filled={false}/>)}
+                </View>
+
+                {rightButtons}
+              </Horizontal>
+            </Horizontal>
+          </View>
+        </View>
+
+        {/* Bottom Tip (Error Message) */}
+        {errorMessage && (<Text color="theme-error" marginTop="4px" {...views?.bottomTip}>
+            {errorMessage}
+          </Text>)}
+
+        {/* Agent Running Indicator */}
+      </View>);
+});
+export default ChatInputView;
+//# sourceMappingURL=ChatInput.view.js.map

package/dist/native/components/ChatInput/ChatInput/ChatInput.view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInput.view.js","sourceRoot":"","sources":["../../../../../src/components/ChatInput/ChatInput/ChatInput.view.tsx"],"names":[],"mappings":"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"}

package/dist/native/components/ChatInput/ChatInput.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ChatInputProps } from './ChatInput/ChatInput.props';
+export declare const ChatInput: React.ForwardRefExoticComponent<ChatInputProps & React.RefAttributes<HTMLElement>>;

package/dist/native/components/ChatInput/ChatInput.js

@@ -0,0 +1,10 @@
+// This file defines the main ChatInput functional component. It uses `forwardRef` to enable ref forwarding, integrates a custom state management hook (`useChatInputState`) for its logic, and delegates the actual rendering to a separate `ChatInputView` component, thereby separating concerns.
+import React, { forwardRef } from 'react';
+import { useChatInputState } from './ChatInput/ChatInput.state';
+import ChatInputView from './ChatInput/ChatInput.view';
+export const ChatInput = forwardRef((props, ref) => {
+    const state = useChatInputState(props);
+    return <ChatInputView {...props} {...state}/>;
+});
+ChatInput.displayName = 'ChatInput';
+//# sourceMappingURL=ChatInput.js.map

package/dist/native/components/ChatInput/ChatInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInput.js","sourceRoot":"","sources":["../../../../src/components/ChatInput/ChatInput.tsx"],"names":[],"mappings":"AAAA,oSAAoS;AACpS,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,aAAa,MAAM,4BAA4B,CAAC;AACvD,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,KAAK,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;IACvC,OAAO,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AACjD,CAAC,CACF,CAAC;AACF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC"}

package/dist/native/components/ChatInput/ChatUploader.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+interface ChatUploaderProps {
+    loading: boolean;
+    disabled: boolean;
+    isAgentRunning: boolean;
+    isUploading: boolean;
+    hideAttachments?: boolean;
+    sandboxId?: string;
+    setPendingFiles: React.Dispatch<React.SetStateAction<File[]>>;
+    setUploadedFiles: React.Dispatch<React.SetStateAction<File[]>>;
+    setIsUploading: React.Dispatch<React.SetStateAction<boolean>>;
+    views?: {
+        button?: any;
+        icon?: any;
+        text?: any;
+        tooltip?: any;
+    };
+}
+export declare const ChatUploader: React.ForwardRefExoticComponent<ChatUploaderProps & React.RefAttributes<HTMLInputElement>>;
+export {};

package/dist/native/components/ChatInput/ChatUploader.js

@@ -0,0 +1,64 @@
+import React, { forwardRef, useEffect } from 'react';
+import { Button, Horizontal } from 'app-studio';
+import { useUpload } from '../Uploader/Uploader/Uploader.state';
+import { AttachmentIcon, LoadingSpinnerIcon } from '../Icon/Icon';
+// Processes selected files locally, including filtering out oversized files, and updates pending and uploaded file lists.
+const handleLocalFiles = (files, setPendingFiles, setUploadedFiles) => {
+    const filteredFiles = files.filter((file) => {
+        if (file.size > 50 * 1024 * 1024) {
+            console.error(`File size exceeds 50MB limit: ${file.name}`);
+            return false;
+        }
+        return true;
+    });
+    setPendingFiles((prevFiles) => [...prevFiles, ...filteredFiles]);
+    setUploadedFiles((prev) => [...prev, ...filteredFiles]);
+};
+// Asynchronously handles file processing, calling `handleLocalFiles` and managing upload state.
+const handleFiles = async (files, sandboxId, setPendingFiles, setUploadedFiles, setIsUploading) => {
+    handleLocalFiles(files, setPendingFiles, setUploadedFiles);
+};
+// The main ChatUploader functional component, wrapped with `forwardRef` to allow parent components to access its DOM node (typically the hidden file input).
+export const ChatUploader = forwardRef(({ loading, disabled, isAgentRunning, isUploading, sandboxId, hideAttachments, setPendingFiles, setUploadedFiles, setIsUploading, views = {}, }, ref) => {
+    // Validates a single file against specific criteria, such as maximum size, returning an error message if validation fails.
+    const validateFile = (file) => {
+        if (file.size > 50 * 1024 * 1024) {
+            return `File size exceeds 50MB limit`;
+        }
+        return null;
+    };
+    // Asynchronously processes a selection of multiple files by delegating to the `handleFiles` function.
+    const handleMultipleFileSelect = async (files) => {
+        await handleFiles(files, sandboxId, setPendingFiles, setUploadedFiles, setIsUploading);
+    };
+    // Utilizes the `useUpload` hook to manage the file input element and its related events (click to open file dialog, change event on file selection).
+    const { fileInputRef, handleClick, handleFileChange } = useUpload({
+        accept: '*/*',
+        maxSize: 50 * 1024 * 1024,
+        multiple: true,
+        onMultipleFileSelect: handleMultipleFileSelect,
+        validateFile,
+    });
+    // Cleans up any object URLs created for uploaded files when the component unmounts to prevent memory leaks.
+    useEffect(() => {
+        return () => {
+            setUploadedFiles((prev) => {
+                return prev;
+            });
+        };
+    }, [setUploadedFiles]);
+    return (<>
+        {hideAttachments && (<Button type="button" onClick={handleClick} variant="ghost" height="36px" padding="0 12px" border={'1px solid'} borderRadius="8px" backgroundColor="transparent" color="color-gray-500" disabled={loading || (disabled && !isAgentRunning) || isUploading} _hover={{
+                backgroundColor: 'color-gray-100',
+            }} {...views?.button}>
+            <Horizontal gap={4} alignItems="center">
+              {isUploading ? (<LoadingSpinnerIcon widthHeight={16} color="currentColor" filled={false} style={{ animation: 'spin 1s linear infinite' }} {...views?.icon}/>) : (<AttachmentIcon widthHeight={16} color="currentColor" filled={false} {...views?.icon}/>)}
+            </Horizontal>
+          </Button>)}
+
+        <input type="file" ref={ref || fileInputRef} style={{ display: 'none' }} onChange={handleFileChange} multiple accept="*/*"/>
+      </>);
+});
+// Sets a display name for the component, useful for debugging and introspection in React DevTools.
+ChatUploader.displayName = 'ChatUploader';
+//# sourceMappingURL=ChatUploader.js.map

package/dist/native/components/ChatInput/ChatUploader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatUploader.js","sourceRoot":"","sources":["../../../../src/components/ChatInput/ChatUploader.tsx"],"names":[],"mappings":"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"}

package/dist/native/components/ChatInput/EditableInput.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+export interface Suggestion {
+    id: string;
+    text: string;
+    description?: string;
+}
+interface MentionData {
+    id: string;
+    name: string;
+    avatar?: string;
+    description?: string;
+}
+interface EditableInputProps {
+    value: string;
+    onChange: (value: string) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    autoFocus?: boolean;
+    suggestions?: Suggestion[];
+    onSuggestionSelect?: (suggestion: Suggestion) => void;
+    showSuggestions?: boolean;
+    mentionData?: MentionData[];
+    mentionTrigger?: string;
+    onMentionSelect?: (mention: MentionData) => void;
+    maxHeight?: string;
+    minHeight?: string;
+    views?: {
+        container?: any;
+        input?: any;
+        placeholder?: any;
+        suggestionsContainer?: any;
+        suggestionItem?: any;
+        mentionContainer?: any;
+        mentionItem?: any;
+    };
+}
+export declare const EditableInput: React.ForwardRefExoticComponent<EditableInputProps & React.RefAttributes<HTMLDivElement>>;
+export {};