FileUpload
Drag-and-drop or click-to-browse file upload with progress indication and file list.
Examples
Basic Dropzone
Drag-and-drop zone for file uploads.
With Preview
Shows file names after they are added.
Drag Active State
Visual feedback while dragging over the zone.
Disabled
Upload zone in disabled state.
Installation
pnpm add @rokle/components @rokle/tokensInstalls with the default Rokle brand. Generate a custom brand on rokle.app to use your own colours and personality.
Usage
import { FileUpload } from "@rokle/components";import { FileUpload } from "@rokle/components";
export function Example() {
return <FileUpload />;
}API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| accept | string | - | Accepted MIME types or file extensions. |
| multiple | boolean | false | Allow multiple file selection. |
| onFilesChange | (files: File[]) => void | - | Called when files are added or removed. |