newOS for Developers
Back to Overview
UploadDialog
input494 linesPlaygroundFile selection and preview dialog with type detection, image thumbnails, and content mode selection.
Props Interface
{
files: FileWithPreview[]; // Files already selected
internalUrls?: string[]; // URLs to embed
chatContent?: string; // Current chat text (for URL extraction)
// Callbacks
onChange: (files: FileWithPreview[]) => void;
onUrlsChange?: (urls: string[]) => void;
onContentModeChange?: (mode: string) => void;
// Styling
style?: CSSProperties;
wrapperStyle?: CSSProperties;
maxItems?: number; // Max files allowed
}Key Features
File Type Detection
detectFileKind() categorizes files as image, video, audio, pdf, document, archive, or generic.
Image Thumbnails
Images display inline previews. PDFs and other types show file icon with name/size.
URL Extraction
Extracts internal URLs from chat content using INTERNAL_URL_REGEX_NG.
Content Mode
Select "last", "first", or "each" for how content is applied to multiple files.
handleFilesSelected (Static)
Static method to process FileList from input elements or drop events.
Edge Cases
Max Items — Limit enforced via
maxItems prop. Default behavior is unlimited.Preview Generation — Images generate object URLs for preview. Clean up with
URL.revokeObjectURL().