Multi-File Queue

Stacked upload list with done, uploading, and failed rows each ending in the matching status icon.

brand-guide.pdf4.2 MB

hero-video.mov

logo-dark.svg18 KB

pricing.xlsx2.1 MB

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Upload13 } from "@/components/beste/piece/upload13";

<Upload13
  files={[
    {
      "filename": "brand-guide.pdf",
      "size": "4.2 MB",
      "state": "done"
    },
    {
      "filename": "hero-video.mov",
      "size": "312 MB",
      "state": "uploading",
      "percent": 62
    },
    {
      "filename": "logo-dark.svg",
      "size": "18 KB",
      "state": "done"
    },
    {
      "filename": "pricing.xlsx",
      "size": "2.1 MB",
      "state": "failed"
    }
  ]}
/>