forms contract
FileUpload
Drag-and-drop + click-to-browse file input. With progress and error per file.
Variants
- dropzone
- Large dashed area — primary uploader
- button
- Single button — secondary surfaces
- avatar
- Round 96pt avatar uploader with crop popover
Sizes
- md
- 180pt tall dropzone
- lg
- 260pt tall dropzone
Example
<FileUpload variant="dropzone" accept="image/*" maxSize={5 * 1024 * 1024} onUpload={handle} multiple />Usage rule
accept attribute restricts MIME types; reject silently with toast feedback, not a blocking dialog.
The full FileUpload contract has 5 more rules, plus the do-not patterns. Get the full recipe.