Why does my radio button binding not work properly?

I have trouble with the binding of radio buttons in Blazor. I created a blazor fiddle. Please test the following:

1. Open the fiddle.
2. Click some radio buttons and see that the text input is updated properly.
3. Re-run the fiddle.
4. Enter "L" in the input, hit enter and see, that the L-button is selected.
5. Click the U-button.
6. Again, enter "L" in the input, hit enter and see, that the L-button is not selected.

What is wrong here?

That took me way too long, but I found the issue.

You need to set "Id" to shape. Because in the setter of Id, you do all the processing of the booleans, and set Shape itself there.

    private void SetShape(string shape)
    {
        Id = shape;
    }

You had it like this, which does not trigger the setter logic.

    private void SetShape(string shape)
    {
        Shape = shape;
    }

New working fiddle:
https://blazorfiddle.com/s/4u9pyxjp

I'd recommend you checking out libraries such as MudBlazor or similar however, as they will (most likely) make development easier overall. :)
Also, is there a reason for having all the variables as static? I think that could cause issues down the line, as they are application-level variables - which will cause issues in multi-user scenarios like web servers (atleast for Blazor Interactive Server).

Full code, in case of future searches and the fiddles are down.

@page "/"

@* shape I *@
<RadioButton Shape="I" ShapeChanged="@(() => SetShape("I"))"
             Value="@IsIChecked" ValueChanged="@(() => IsIChecked = true)" />

@* shape L *@
<RadioButton Shape="L" ShapeChanged="@(() => SetShape("L"))"
             Value="@IsLChecked" ValueChanged="@(() => IsLChecked = true)" />

@* shape U *@
<RadioButton Shape="U" ShapeChanged="@(() => SetShape("U"))"
             Value="@IsUChecked" ValueChanged="@(() => IsUChecked = true)" />

@* shape Z *@
<RadioButton Shape="Z" ShapeChanged="@(() => SetShape("Z"))"
             Value="@IsZChecked" ValueChanged="@(() => IsZChecked = true)" />

<input type="text" id="unique-id" class="d-inline-block" @bind="Id">


@code {
    public static string Shape { get; set; } = "I";
    public static bool IsIChecked { get; set; } = true;
    public static bool IsLChecked { get; set; } = false;
    public static bool IsUChecked { get; set; } = false;
    public static bool IsZChecked { get; set; } = false;

    public static string Id
    {
        get => Shape;
        set
        {
            Shape = value.ToUpper();

            IsIChecked = false;
            IsLChecked = false;
            IsUChecked = false;
            IsZChecked = false;
            if (Shape == "I")
                IsIChecked = true;
            else if (Shape == "L")
                IsLChecked = true;
            else if (Shape == "U")
                IsUChecked = true;
            else if (Shape == "Z")
                IsZChecked = true;
        }
    }

    private void SetShape(string shape)
    {
        Id = shape;
    }
}