@uppy/dashboard

Drag-and-Drop File Upload

This feature allows users to drag and drop files into a designated area for uploading. The code sample demonstrates how to set up the Uppy Dashboard with drag-and-drop functionality.

const Uppy = require('@uppy/core');
const Dashboard = require('@uppy/dashboard');

const uppy = Uppy();
uppy.use(Dashboard, {
  target: '#drag-drop-area',
  inline: true
});

File Previews

This feature provides previews of the files that are being uploaded. The code sample shows how to configure the Uppy Dashboard to display file previews and upload progress details.

const Uppy = require('@uppy/core');
const Dashboard = require('@uppy/dashboard');

const uppy = Uppy();
uppy.use(Dashboard, {
  target: '#file-preview-area',
  inline: true,
  showLinkToFileUploadResult: true,
  showProgressDetails: true
});

Progress Indicators

This feature shows progress indicators for file uploads. The code sample demonstrates how to set up the Uppy Dashboard to display detailed progress indicators for each file being uploaded.

const Uppy = require('@uppy/core');
const Dashboard = require('@uppy/dashboard');

const uppy = Uppy();
uppy.use(Dashboard, {
  target: '#progress-indicator-area',
  inline: true,
  showProgressDetails: true
});