UploadManager

import '@bluui/web/styles.css'

import { createUploadManager } from "@bluui/web";
export function mount(host: HTMLElement) {
  const output = document.createElement("p");
  host.append(output);
  const csrf = document.querySelector<HTMLMetaElement>(
    'meta[name="csrf-token"]',
  )?.content;
  const uploads = createUploadManager(
    host,
    {
      UploadUrl: "/demo/upload", // Disposable endpoint included by the starter's Vite dev server.
      Headers: csrf ? { "x-csrf-token": csrf } : {},
      Accept: ".txt,.png,.jpg,.jpeg,.pdf",
      MaxFiles: 5,
      MaxFileSizeMB: 1,
    },
    {
      Uploaded: (_key, name) => {
        output.textContent = `${name} transferred and discarded.`;
      },
      Error: (message) => {
        output.textContent = message;
      },
    },
  );
  // Use your own authorized HTTPS multipart endpoint when integrating into an application.
  return {
    destroy() {
      uploads.destroy();
      output.remove();
    },
  };
}

const instance = mount(document.getElementById('example')!)

// When this page or framework component is removed:
// instance.destroy()