Radio Group

<CascadingValue Value="@radioGroup">
  <RadioGroup @ref="radioGroup" Value="@selectedOption" ValueChanged="@HandleOptionChanged">
    <RadioGroupItem Value="option1">Option 1</RadioGroupItem>
    <RadioGroupItem Value="option2">Option 2</RadioGroupItem>
    <RadioGroupItem Value="option3">Option 3</RadioGroupItem>
  </RadioGroup>
</CascadingValue>

@code {
    private RadioGroup? radioGroup;
    private string? selectedOption;

    private void HandleOptionChanged(string value)
    {
        selectedOption = value;
    }
}

<CascadingValue Value="@radioGroup">
  <RadioGroup @ref="radioGroup" @bind-Value="selectedOption">
    <RadioGroupItem Value="small">Small</RadioGroupItem>
    <RadioGroupItem Value="medium">Medium</RadioGroupItem>
    <RadioGroupItem Value="large">Large</RadioGroupItem>
  </RadioGroup>
</CascadingValue>

@code {
    private RadioGroup? radioGroup;
    private string? selectedOption;
}

<div class="space-y-4">
  <Label>Select Size</Label>
  <CascadingValue Value="@radioGroup">
    <RadioGroup @ref="radioGroup" @bind-Value="selectedSize" ClassName="space-y-3">
      <RadioGroupItem Value="xs">Extra Small</RadioGroupItem>
      <RadioGroupItem Value="sm">Small</RadioGroupItem>
      <RadioGroupItem Value="md">Medium</RadioGroupItem>
      <RadioGroupItem Value="lg">Large</RadioGroupItem>
      <RadioGroupItem Value="xl">Extra Large</RadioGroupItem>
    </RadioGroup>
  </CascadingValue>
</div>

@code {
    private RadioGroup? radioGroup;
    private string? selectedSize;
}

<EditForm Model="@model" OnValidSubmit="HandleSubmit">
  <div class="space-y-4">
    <div>
      <Label>Payment Method</Label>
      <CascadingValue Value="@paymentGroup">
        <RadioGroup @ref="paymentGroup" @bind-Value="model.PaymentMethod" ClassName="space-y-3 mt-2">
          <RadioGroupItem Value="credit">Credit Card</RadioGroupItem>
          <RadioGroupItem Value="debit">Debit Card</RadioGroupItem>
          <RadioGroupItem Value="paypal">PayPal</RadioGroupItem>
          <RadioGroupItem Value="bank">Bank Transfer</RadioGroupItem>
        </RadioGroup>
      </CascadingValue>
    </div>
    <Button Type="submit">Continue</Button>
  </div>
</EditForm>

@code {
    private RadioGroup? paymentGroup;
    private FormModel model = new();

    private void HandleSubmit()
    {
        // Handle form submission
    }

    private class FormModel
    {
        public string PaymentMethod { get; set; } = "";
    }
}

<CascadingValue Value="@radioGroup">
  <RadioGroup @ref="radioGroup" @bind-Value="selectedOption" ClassName="flex gap-4">
    <RadioGroupItem Value="left">Left</RadioGroupItem>
    <RadioGroupItem Value="center">Center</RadioGroupItem>
    <RadioGroupItem Value="right">Right</RadioGroupItem>
  </RadioGroup>
</CascadingValue>

@code {
    private RadioGroup? radioGroup;
    private string? selectedOption;
}

shellui add radio-group