File upload

BsFileUpload is a drop zone over a native file input: drop files on it, click it or use the browse button. Each batch is added to files, reported through onFilesDropped and announced to screen readers. Rows show the name, size and a progress bar you update; fileTemplate replaces a row. With name the input submits its files with a form, no JavaScript needed.

Basic usage

    import { BsFileUpload, type FileUpload } from '@mintplayer/react-bootstrap/file-upload';const [files, setFiles] = useState<FileUpload[]>([]);<BsFileUpload files={files} onFilesChange={setFiles} onFilesDropped={upload} />

    Custom rows

      <BsFileUpload files={files} onFilesChange={setFiles} onFilesDropped={upload}  fileTemplate={({ upload }) => (    <div className="d-flex gap-2">      <span className="flex-grow-1">{upload.file.name}</span>      <button type="button" onClick={() => remove(upload)}>Remove</button>    </div>  )}/>