Components / File Upload

File Upload

A dashed dropzone over the Navius FileUpload primitive wrapping a real hidden input. Dropped or picked files render as rows with name, size, and a remove button, with Accept, MaxSize, and MaxFiles validation reported through OnRejected. Click or drag below. This preview is the real component running in WebAssembly.

Examples

Click to browse or drag & drop

PNG, JPG, or PDF up to 5MB

    0 file(s) selected

    razor
    <ZitsFileUpload Multiple="true" MaxSize="5242880"
                Hint="PNG, JPG, or PDF up to 5MB"
                @bind-Files="_files" />

@code { IReadOnlyList<IBrowserFile> _files = Array.Empty<IBrowserFile>(); }

    Installation

    Terminal bash
    navius add file-upload

    API reference

    ZitsFileUpload (files are IBrowserFile):

    Prop Type Default
    Files IReadOnlyList<IBrowserFile>? null
    FilesChanged EventCallback<...> -
    Accept string? null
    Multiple bool false
    MaxFiles int? null
    MaxSize long 0 (no cap)
    Directory bool false
    Hint string? null
    OnAccepted EventCallback<...> -
    OnRejected EventCallback<...> -
    Disabled bool false