Getting started
Foundation
Typography
Navigation
Feedback
Forms
File input lets users upload files from their computer.
Simulated upload progress is automatically shown when onUpload
event handler returns a promise.
If onUpload
takes less than 200ms to execute, upload progress won't be displayed.
When an uploaded file doesn't pass some additional validation, throw a FileUploadError
with an error message that will be displayed in FileInput
.
Try uploading any file in the example below to see how it works.
When onUpload
throws any other error, FileInput
will show a generic error message.
When user is not allowed to upload a file, FileInput
can be disabled.
Inherits margin props.
Name | Default | Description |
---|---|---|
isDisabled | false | boolean Determines whether file input is disabled. |
accept | — | string[] List of file extensions to accept in this file input. |
maxSize | 1000 * 1000 * 10 (10 megabytes) | number Maximum file size. |
onUpload | — | (file: File) => Promise<void> | void Event handler when user has selected a file. |