Upload Panel

Overview

The upload domain provides components for file uploading. UploadPanel combines a Dropzone and upload queue. Dropzone handles drag-and-drop file selection with file type and size validation. UploadProgressItem displays individual upload progress with pause, resume, cancel, and retry controls.

Usage

import { Dropzone, UploadProgressItem } from "@leanicon/web-builder-library/saas";

<Dropzone
  onFilesSelected={(files) => console.log("Files:", files)}
  multiple
/>

<UploadProgressItem
  item={{ id: "1", file: myFile, folderId: null, status: "uploading", progress: 45, uploadedBytes: 450000 }}
  onPause={() => console.log("Pause")}
  onCancel={() => console.log("Cancel")}
/>

Components

Dropzone - Default

Dropzone (Dark)

Dropzone - Single File

Dropzone - Images Only

Dropzone - Disabled

Dropzone - Custom Content

UploadProgressItem - Uploading

UploadProgressItem - Completed

UploadProgressItem - Failed

UploadProgressItem - Paused

UploadProgressItem - Queued

UploadProgressItem - Compact