Variants

The Variant parameter controls which surface palette drives the button's colour. All variants use the same hover mechanism (rel1) so the hover state is always a natural tint of the base colour — regardless of the containing surface.

Async Click & Spinner

Pass any async Task to Click. The button automatically shows a spinner and disables itself while the task is running, then restores its normal state when it completes. No extra state management needed.

Disabled & ReadOnly

Disabled prevents interaction and dims the button. ReadOnly applies the same visual treatment but does not prevent the HTML element from receiving focus. Both states suppress hover effects.

Custom Content

When ChildContent is provided it replaces the Label string, letting you compose icons, badges, or any markup inside the button.

<BnButton>
    <i class="fa fa-download" />
    Download Report
</BnButton>

BnSubmitButton

BnSubmitButton renders a type="submit" button and integrates with BnEditForm. It shares all parameters with BnButton except Click, and adds FormId to target a specific form element.

<BnEditForm Model="model" OnValidSubmit="HandleSubmit">
    <BnTextBox Label="Name" For="@(() => model.Name)" />
    <BnSubmitButton Label="Submit" />
</BnEditForm>

@* Target a specific form by id *@
<BnSubmitButton Label="Submit" FormId="my-form" />

BnButton Parameters

BnSubmitButton Additional Parameters