# Form File Upload

Attach a CV and degree to an HR job application.

- id: `form-file-upload`
- Page: https://agentic-ui-kit.com/components/form-file-upload
- Live preview: https://agentic-ui-kit.com/live/component/form-file-upload

## Install

```bash
agentic-ui add form-file-upload
npx shadcn@4.17.0 add @agentic-ui/form-file-upload
```

## Metadata

- **Level:** block
- **Category:** block
- **Installable in:** Radix UI (registry variant new-york)
- **Capabilities:** drag-and-drop, file-picker, per-file-progress, type-validation, size-validation, max-files-limit, retry-failed-upload, remove-file, empty-state, keyboard-navigation
- **Intents:** import-export, create-edit
- **Suits domains:** media, file-storage, hr, healthcare, operations
- **Interaction:** drag-and-drop, file-picker, keyboard-navigation, retry, remove
- **Screen role:** flow
- **Density:** medium
- **Dark mode:** yes
- **Use it for:** attach a CV and degree to an HR job application, import a batch of images into a media library, upload clinical reports to a patient record, attach supporting documentation to an operations ticket
- **Avoid when:** a single required file with no progress or validation (a file input is enough), the upload is a multi-step flow with a prior review (use form-multi-step-wizard), editing or cropping the file after uploading it is needed
- **Preserve when adapting:** validation-feedback, per-file-progress, error-recovery, keyboard-contract
- **Replace when adapting:** domain-copy, accepted-types, size-limits, upload-adapter
- **Adaptation effort:** low
- **Coupling:** low
- **Quality score:** 8.9/10
- **Quality breakdown:** visual 8/10, responsive 9/10, accessibility 9/10, code 9/10
- **Uses primitives:** button, progress
- **Motion:** profile subtle, library css, reduced-motion fallback yes
- **Registry dependencies:** lib-primitives
