SusRadio

Single radio option — pairs with parent SusRadioGroup for exclusive choice.
Package
SusKit · Atoms (commercial)
Props
| Name | Type | Default | |
|---|---|---|---|
Model | Prop<bool> | false | v-model |
Value | Prop<string> | "" | v-model |
Label | Prop<string> | "" | v-model |
Color | Prop<string> | "primary" | v-model |
Disabled | Prop<bool> | false | v-model |
Readonly | Prop<bool> | false | v-model |
Density | Prop<string> | "default" | v-model |
Error | Prop<string> | "" | v-model |
HideDetails | Prop<string> | "auto" | v-model |
Slots
No slots.
Events
| Name | Field | Payload |
|---|---|---|
Change | OnChange | bool |
Style hooks
USS class contract — override appearance without touching C#. States toggle via these classes:
keyboard-focussus-radiosus-radio__detailssus-radio__dotsus-radio__inputsus-radio__labelsus-radio--checkedsus-radio--dangersus-radio--density-comfortablesus-radio--density-compactsus-radio--density-defaultsus-radio--disabledsus-radio--errorsus-radio--primarysus-radio--readonlysus-radio--secondarysus-radio--successsus-radio--warning
Usage
xml
<template>
<sus:SusRadio Label="Hard"
Value="hard"
Color="primary"
@change="OnPicked" />
</template>
<script>
void OnPicked(bool selected) { /* … */ }
</script>csharp
var radio = new SusRadio();
radio.Label.Value = "Normal";
radio.Value.Value = "normal";
radio.Color.Value = "primary";
radio.OnChange += selected => { /* … */ };Notes
- Place radios under
SusRadioGroup(molecule); the atom registers itself and syncsModelfrom the group selection. - Standalone: drive
Model/SyncCheckedyourself when not inside a group. Error+HideDetailsfollow the same form-field pattern as checkbox / text inputs.