<div class="loading" style="display:@(IsVisible ? "block" : "none");">
    <div class="spinner">
        <div class="rect1"></div>
        <div class="rect2"></div>
        <div class="rect3"></div>
        <div class="rect4"></div>
        <div class="rect5"></div>
    </div>
</div>

@code {
    private bool IsVisible { get; set; }

    /// <summary>
    /// Shows the loading indicator.
    /// </summary>
    public void Show()
    {
        IsVisible = true;
        StateHasChanged();
    }

    /// <summary>
    /// Hides the loading indicator.
    /// </summary>
    public void Hide()
    {
        IsVisible = false;
        StateHasChanged();
    }
}
