ComponentsInputs & forms
File dropzone
A drop area with a small stack of paper that lifts on hover and fans out when files are dragged over, listing the chosen files below.
"use client";
import { FileDropzone } from "@/components/miyuki-ui/file-dropzone";
export default function FileDropzoneDemo() {
return (
<FileDropzone
className="max-w-md"
label="Drop GPX tracks or photos"
accept={[".gpx", "image/*"]}
maxSize={20 * 1024 * 1024}
/>
);
}Install
npx shadcn@latest add @miyuki-ui/file-dropzoneThis needs the @miyuki-ui registry in your components.json. See Using the shadcn CLI.
Props
FileDropzone
Prop
Type