nuxt-x-formkit
File Upload Input
FormKit custom input type for drag-and-drop or click-to-browse file selection with preview.
File Upload Input
The file-upload FormKit input type renders a drag-and-drop upload zone with click-to-browse fallback, file type filtering, size limits, and thumbnail previews for images. Auto-registered by the layer.
Components
<FormKit type="file-upload" />
<FormKit
type="file-upload"
name="avatar"
label="Profile Photo"
accept="image/*"
:max-size="2"
:multiple="false"
validation="required"
/>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
name | string | required | FormKit field name; value is a File or File[] |
label | string | — | Visible field label |
accept | string | '*' | MIME type filter (e.g. 'image/*', '.pdf,.doc') |
multiple | boolean | false | Allow multiple file selection |
maxSize | number | — | Maximum file size in MB per file |
validation | string | — | FormKit validation rules |
preview | boolean | true | Show image thumbnail previews after selection |
AI Context
component: FormKit type="file-upload"
package: "@xenterprises/nuxt-x-formkit"
use-when: File or image upload fields in FormKit forms with drag-and-drop and preview support