File Upload
File upload with special uploading animation. Make sure to try the drag and drop.
Installation
Usage
import { FileUpload } from "viora-ui";import { FileUpload } from "viora-ui";
export default function FileUploadDemo() {
return (
<div className="flex min-h-[350px] w-full items-center justify-center p-6">
<FileUpload />
</div>
);
}API Reference
FileError
| Prop | Type | Default | Description |
|---|---|---|---|
| message | string | - | Configuration for message. |
| code | string | - | Configuration for code. |
FileUpload
| Prop | Type | Default | Description |
|---|---|---|---|
| onUploadSuccess? | (file: File) => void | - | Callback fired on uploadsuccess event. |
| onUploadError? | (error: FileError) => void | - | Callback fired on uploaderror event. |
| acceptedFileTypes? | string[] | [] | Configuration for acceptedFileTypes. |
| maxFileSize? | number | - | Configuration for maxFileSize. |
| currentFile? | File | null | - | Configuration for currentFile. |
| onFileRemove? | () => void | - | Callback fired on fileremove event. |
| uploadDelay? | number | - | Configuration for uploadDelay. |
| validateFile? | (file: File) => FileError | null | - | Configuration for validateFile. |
| className? | string | "" | Additional CSS classes for custom styling. |
Built by Otis
Last updated: 10/12/2026