Overview
The file component is a styled version of FormKit’s file input. It supports single and multiple file uploads, drag-and-drop interaction, and custom icons for file states.
For more detailed information on configuring and using FormKit’s file input, refer to the official FormKit file documentation.
Basic usage
Check out the FormKit documentation in the Foundations section for setup instructions if you’re new to FormKit.
Importing the component
Ensure your application is configured to use the FormKit plugin. You can then include the file input component in your FormKit schema or as a standalone component.
Example usage
Once registered, use the file component like this:
<FormKit
type="file"
label="Upload your documents"
name="documents"
accept=".pdf,.docx"
multiple="true"
/>
Accessibility
The file component inherits accessibility features from the native HTML <input type="file">, supporting keyboard navigation, drag-and-drop, and customisable accessible labels.
Internationalisation
The file input supports internationalised messages and labels, making it adaptable for global use.