FileUpload.razor

@namespace DataJuggler.Blazor.FileUpload

<style>
    .progressbar
    {
        color: firebrick;
        width: @ProgressWidth;
        height: @ProgressHeight;
    }
    .verticalcenter
    {
        display: flex;
        justify-content: center;
        align-items: center;
    }
</style>

@if (!uploadComplete)
{
    @if (ShowCustomButton)
    {
        <label>
            @if (MultipleFiles)
            {
                <InputFile class="@InputFileClassName" OnChange="OnFileChange" Visible="@Visible" accept="@AllowedExtensions" multiple />
            }
            else
            {
                <InputFile class="@InputFileClassName" OnChange="OnFileChange" Visible="@Visible" accept="@AllowedExtensions" />                
            }
            <span class="verticalcenter @CustomButtonClassName"><span class="@CustomButtonTextClassName"></span>@ButtonText</span>
        </label>
    }
    else
    {
        <div class="inputfilecontainer">
            @if (MultipleFiles)
            {
                <InputFile Visible="@Visible" OnChange="@OnFileChange" accept="@AllowedExtensions" multiple />
            }
            else
            {
                <InputFile Visible="@Visible" OnChange="@OnFileChange" accept="@AllowedExtensions" />
            }
        </div>
    }
    @if (ProgressVisible)
    {
        <div class="progressbar">
        </div>
    }   
}
else if (ShowResetButton)
{
    <button class="@ResetButtonClassName" @onclick="Reset">@ResetButtonText</button>
}

@if ((ShowStatus) && (HasStatus))
{
    <p class="@MessageClassName">@status</p>
}