Radzen html editor visibility and validation issue

[Ck_Cheah]

having issue when using radzen html editor with validation. Please refer to below gif and code to have better understanding.

  <RadzenTemplateForm TItem=@Details Data=@details Submit=@OnSaved>
        <RadzenDropDown Name="ddlAction" TextProperty="Text" ValueProperty="Value" class="w-100"
                        Data=promotionAction @bind-Value=@details.ActionTypeID />
        <RadzenHtmlEditor Name="htmleditor" class="w-100" Style="height:500px;" Visible=@(details.ActionTypeID == 1 && string.IsNullOrWhiteSpace(details.Content))></RadzenHtmlEditor>
        <RadzenRequiredValidator Component="htmleditor" Text="content is required." Visible=@(details.ActionTypeID == 1)></RadzenRequiredValidator>
        <RadzenButton ButtonType=ButtonType.Submit Text="Save"></RadzenButton>
    </RadzenTemplateForm>

@code {
    IList<Option<byte>> promotionAction = new List<Option<byte>>();
    private record Option<T>(string Text, T Value);
    private IList<Option<byte>> PromotionAction() =>
         new List<Option<byte>>
              {
                new Option<byte>("Popup", 1),
                new Option<byte>("Redirection", 2),
                new Option<byte>("No Action", 3)
              };

    public Details details = new Details();

    protected async override Task OnInitializedAsync()
    {
        promotionAction = PromotionAction();
    }

    protected async Task OnSaved()
    {
        JS.InvokeVoidAsync("alert", "ok");
    }
}

[korchev]

Unfortunately I can't understand what the gif is supposed to demonstrate. Please try providing a runnable snippet and instructions what to test. Also the Value of the editor does not seem to be set. Validation will not work otherwise.