Code

Props
Data Type
Required

className

string

id

string

name

string

placeholder

string

label

string

info

string

buttontext

string

helpText

string

error

boolean

errorMessage

string

readOnly

boolean

disabled

boolean

files

'All' | 'Images' | 'Audio' | 'Video'

onChange

Function

This component only allows users to select one single file. In the case developers would like the user to select multiple files, it is recommened to use instead the FileUploadRegion component.

Files

This feature sets filters for the OS finder to show just the selected file types. But this is not a filter to prevent the user from uploading or not different file types. That's a validation developers have to implement by themselves to have a better control of processes.

Event Response

Property
Data Type

id

string

file

file object

fileExtension

string

fileName

string

fileURL

string

name

string

label

string

Example

<FileUploadInput
  className="FileUploadInputExample"
  errorMessage="Optional error message can offer better guidance."
  files="Images"
  id="textInputId"
  name="textInputName"
  onChange={(e)=>{console.log(e)}}
  placeholder="Placeholder..."
/>

Live Demo

For detailed code usage documentation, see the Storybooks for each framework below.

React

Last updated