File Upload

import * as FileUpload from "@/registry/react-aria/ui/file-upload"
 
export default function FileUploadExample() {
  return (
    <FileUpload.Root
      allowsMultiple
      onSelect={(files) => {
        if (files) {
          console.log(
            "Selected files:",
            Array.from(files).map((f) => f.name)
          )
        }
      }}
    >
      <FileUpload.Icon as={CloudUpload} />
      <div className="space-y-1.5">
        <div className="text-foreground text-sm font-medium">
          Choose a file or drag & drop it here.
        </div>
        <div className="text-muted-foreground text-xs">
          JPEG, PNG, PDF, and MP4 formats, up to 50 MB.
        </div>
      </div>
      <FileUpload.Button>Browse File</FileUpload.Button>
    </FileUpload.Root>
  )
}