SwitchField
Labelled switch field with inline layout — wraps the Switch primitive with a right-side label and optional help text
Interactive-mode
Examples
Default switch field
Switch field with help text
Switch between light and dark interface theme.
API
The element family below can be composed together. Click an element to jump to its properties.
| Element | Purpose |
|---|---|
| SwitchField | A labelled switch field chunk with inline layout. The switch sits on the left; the label and optional help text stack to the right. Wraps the Switch primitive. |
SwitchField
A labelled switch field chunk with inline layout. The switch sits on the left; the label and optional help text stack to the right. Wraps the Switch primitive.
| Property | Type | Required | Description |
|---|---|---|---|
| Label | string? | Label text rendered to the right of the switch via FormLabel. Omit to hide the label. | |
| HelpText | string? | Helper text rendered below the label. Shown in text-danger-fg when Error is true, otherwise text-muted-foreground. | |
| Error | bool | Applies error styling to the label and help text. Default: false. | |
| Required | bool | Appends a red asterisk to the label via FormLabel. Default: false. | |
| Disabled | bool | Disables the underlying switch. Default: false. | |
| Id | string | HTML id wired to the label's for attribute. Auto-generated by default. | |
| Value | bool | Whether the switch is on. Use @bind-Value for two-way binding. | |
| ValueChanged | EventCallback<bool> | Fires when the switch state changes. Part of the @bind-Value pair. |