BrandUI Checkbox - PrimerBlazor

Basic Checkbox

Checked: False

<PrimerBrandCheckBox @bind-Value="@isChecked" />
<PrimerElement Tag="ElementTag.P">Checked: @isChecked</PrimerElement>

Disabled Checkbox

<PrimerBrandCheckBox Value="true" Disabled="true" />

Multiple Checkboxes

<PrimerStack Direction="StackDirection.Column" Gap="StackGap.Gap8">
    <PrimerBrandCheckBox @bind-Value="@check1" />
    <PrimerBrandCheckBox @bind-Value="@check2" />
    <PrimerBrandCheckBox @bind-Value="@check3" />
</PrimerStack>

Custom ID

<PrimerBrandCheckBox Id="custom_checkbox_001" @bind-Value="@customChecked" />

Checkbox Component Options

Available options for PrimerBrandCheckBox

Name	Description	Default Value	CSS Class
Value	Current checked state	false	Checkbox-input
ValueChanged	Callback for change event	-	-
Id	Checkbox element ID (auto-generated if not set)	brand_checkbox_{GUID}	Checkbox-wrapper, Checkbox
Disabled	Indicates if the checkbox is disabled	false	disabled

private bool isChecked = false;
private bool check1, check2, check3;
private bool customChecked = false;