File Upload Blocks

A file upload card with a drag-and-drop dropzone and an Attachment list that shows each file with a spinner while uploading and a check when done.

A compact inline file-upload form field with a bordered row and a "Choose file" label-trigger, plus an Attachment showing the selected file with its name, size, and a remove action.

A drag-and-drop file uploader with an Attachment list that reflects uploading, done, and error states, with validation, toasts, and remove actions.

An image gallery uploader with a responsive thumbnail grid, a cover badge on the first image, per-image remove on hover, an upload tile, and an image count. For photo or asset galleries.

An avatar uploader with a circular preview and change and remove actions, showing the selected image with a format hint.

Pro file-upload: an animated dropzone uploader where files stream in with a blur rise, each row showing a circular SVG progress ring, mono speed and ETA, pause/cancel/retry, an aggregate progress bar with a count-up complete total, and a check morph on completion.

Pro file-upload: an image gallery grid where grayscale thumbnails drag to reorder with layout animation, the cover badge follows the first slot, hover reveals set-cover and remove actions, and tiles blur-rise in on load.

Pro file-upload: a two-column transfer composer with a share panel on the left (count-up total size, file count, expiry select, and a copy-link button that blur-swaps to a copied state) and the transfer contents on the right as a fixed-height Attachment list with an empty state and a pinned add action that reflow via layout animation.

Pro file-upload: a cloud drive file-manager panel with a breadcrumb, a count-up storage meter, a fixed-height scroll-faded file and folder list with owner avatars and sync status dots, and a drag-anywhere-to-upload overlay that blurs the list behind a drop target.

Pro file-upload: a CSV import preview with a shadcn data table, plain column headers over detected field names, count-up row and column stats, sanctioned-color validation chips, and skipped and rejected rows tinted in place.