File Upload
A drag-and-drop file upload field with configurable file types, size limits, and multi-file support.
The File Upload field lets users attach files to their form submission. It supports drag-and-drop, file type restrictions, size limits, multi-file uploads, and inline previews for image files. Uploaded files can be stored as public or private depending on your use case.
Configuration
| Property | Type | Default | Description |
|---|---|---|---|
| label | string | -- | Label text displayed above the field |
| required | boolean | false | Whether at least one file must be uploaded before submission |
| width | LayoutWidth | "full" | Horizontal space the field occupies |
| help | string | -- | Help text displayed below the field |
| key | string | -- | Variable name for referencing the field value |
| accept | string | -- | Comma-separated MIME types or extensions (e.g. ".pdf,.docx,.xlsx,.jpg,.png") |
| maxSizeMB | number | -- | Maximum file size in megabytes per file |
| maxFiles | number | -- | Maximum number of files allowed |
| storageType | FileStorageType | "private" | Storage visibility: "public" or "private" |
| showPreview | boolean | -- | Whether to show inline previews for image files |
| allowedExtensions | string[] | -- | Array of allowed file extensions (e.g. ["pdf", "docx", "jpg", "png"]) |
| description | string | -- | Hint text displayed in the upload area describing allowed file types |
Storage Types
- private -- Files are stored with restricted access. URLs require authentication to download. Use this for sensitive documents like contracts, IDs, or financial records.
- public -- Files are stored with public read access. Use this for content that is meant to be shared, like portfolio images or public documents.
Validation
In addition to file type and size restrictions, the File Upload field inherits standard input validations:
| Property | Type | Description |
|---|---|---|
| min | number | Minimum number of files required |
| max | number | Maximum number of files allowed |
Example Usage
A job application form accepting resumes and cover letters:
{
"type": "fileUpload",
"label": "Upload Resume",
"required": true,
"accept": ".pdf,.docx",
"maxSizeMB": 10,
"maxFiles": 2,
"storageType": "private",
"showPreview": false,
"allowedExtensions": ["pdf", "docx"],
"description": "PDF or Word documents, max 10 MB each"
}