@uppy/components

@uppy/components

Headless Uppy components, such as Dropzone, FilesList and FilesGrid, and the controllers behind hooks like useDropzone. Use them to build your own upload UI instead of the Dashboard.

You normally don't install this package yourself. The framework packages, @uppy/react, @uppy/vue and @uppy/svelte, depend on it and expose its components and hooks in their own idiom.

Uppy is being developed by the folks at Transloadit, a versatile file encoding service.

Example

With React:

import { useState } from 'react'
import Uppy from '@uppy/core'
import {
  Dropzone,
  FilesList,
  UploadButton,
  UppyContextProvider,
} from '@uppy/react'
import '@uppy/react/css/style.css'

function Uploader() {
  const [uppy] = useState(() => new Uppy())
  return (
    <UppyContextProvider uppy={uppy}>
      <Dropzone />
      <FilesList />
      <UploadButton />
    </UppyContextProvider>
  )
}

Installation

$ npm install @uppy/drop-target

Documentation

The components and hooks are documented with each framework: React, Vue and Svelte.

License

The MIT License.