LoadingButtonExample2.razor

@namespace MudExtensions.Docs.Examples

<MudGrid>
    <MudItem xs="12" sm="8" Class="d-flex gap-4 align-center flex-wrap">
        <MudLoadingButton @bind-Loading="_loading" LoadingAdornment="_adornment" LoadingCircularColor="Color.Primary" OnClick="ButtonClick" Variant="Variant.Filled" Color="Color.Primary">
            <LoadingContent>
                LOADING
            </LoadingContent>

            <ChildContent>
                CLICK ME
            </ChildContent>
        </MudLoadingButton>

        <MudLoadingButton ButtonVariant="ButtonVariant.IconButton" @bind-Loading="_loading" Icon="@Icons.Custom.Brands.MudBlazor" LoadingAdornment="_adornment" LoadingCircularColor="Color.Primary" OnClick="ButtonClick" Variant="Variant.Filled" Color="Color.Primary">
            <LoadingContent>
                LOADING
            </LoadingContent>
        </MudLoadingButton>

        <MudLoadingButton ButtonVariant="ButtonVariant.Fab" @bind-Loading="_loading" StartIcon="@Icons.Custom.Brands.MudBlazor" LoadingAdornment="_adornment" LoadingCircularColor="Color.Primary" OnClick="ButtonClick" Variant="Variant.Filled" Color="Color.Primary">
            <LoadingContent>
                LOADING
            </LoadingContent>
        </MudLoadingButton>
    </MudItem>

    <MudItem xs="12" sm="4">
        <MudStack>
            <MudSwitchM3 @bind-Value="_loading" Color="Color.Secondary">Loading</MudSwitchM3>
            <MudSelect @bind-Value="_adornment" Variant="Variant.Outlined" Label="Loading Adornment" AnchorOrigin="Origin.BottomCenter">
                <MudSelectItem Value="Adornment.Start">Start</MudSelectItem>
                <MudSelectItem Value="Adornment.End">End</MudSelectItem>
            </MudSelect>
        </MudStack>
    </MudItem>
</MudGrid>

@code{
    bool _loading = false;
    Adornment _adornment = Adornment.Start;

    private async Task ButtonClick()
    {
        _loading = true;
        await Task.Delay(2000);
        _loading = false;
    }
}