Welcome UI - FileUpload

FileUpload

The File Upload component enables users to select and upload files from their device. It supports both drag-and-drop and traditional file selection methods, providing a straightforward way to manage file uploads. This component is essential for applications that require users to submit documents, images, or other file types, ensuring a smooth and efficient upload experience.

import { FileUpload } from 'welcome-ui/FileUpload'

const Example = () => {
  const handleChange = () => {
    // your code
  }

  return (
    <FileUpload
      accept="*/*"
      handleAddFile={handleChange}
      handleRemoveFile={handleChange}
      name="file"
      value=""
    />
  )
}

export default Example

Examples

Preview

Multiple

Add multiple property.

Disabled

Customize

Button

You can change the upload button component.

Preview

You can change the preview component.

You can also set the preview prop to null and handle your own preview in place of the upload button with files & onRemoveFile render props.