Upload

Preview

Usage

import { FileUpload } from "@/components/docs/Uploading"

export default function App() {
  const handleFilesSelected = (files: File[]) => {
    console.log("Files selected:", files)
  }

  const handleUpload = async (files: File[]) => {
    console.log("Uploading files:", files)
  }

  return (
    <FileUpload
      onFilesSelected={handleFilesSelected}
      onUpload={handleUpload}
      acceptedFormats="image/jpeg,image/png,image/svg+xml"
      maxFileSize={5 * 1024 * 1024}
    />
  )
}

API Surface

Prop	Type	Default	Description
onFilesSelected	(files: File[]) => void	—	Callback when files are selected or dropped.
onUpload	(files: File[]) => Promise<void>	—	Async callback for handling the upload process.
maxFileSize	number	5MB	Maximum allowed file size in bytes.
acceptedFormats	string[] | string	Images	Comma-separated string or array of accepted MIME types.
multiple	boolean	true	Whether to allow multiple file selection.
showProgress	boolean	true	Whether to show the progress bar.
onUploadSuccess	() => void	—	Callback when upload completes successfully.