<p> The DateInput Value is: @DateValue </p>

@if (ShouldRenderDateInput)
{
    <TelerikDateInput @bind-Value="@DateValue"
                    Format="dd/MM/yyyy"
                    AutoCorrectParts="false"
                    Width="200px" />
}
@* the else block is optional to prevent delayed component appearance *@
else
{
    <TelerikDateInput @bind-Value="@DateValue"
                    Format="dd/MM/yyyy"
                    AutoCorrectParts="false"
                    Width="200px" />
}

@code {
    private DateTime? DateValue { get; set; }
    private bool ShouldRenderDateInput { get; set; }

    protected override async Task OnInitializedAsync()
    {
        await Task.Delay(200);
        DateValue = new DateTime(2026, 06, 22);
        ShouldRenderDateInput = true;
    }
}

<TelerikButton OnClick="@ToggleStep">Toggle attachments step visibility</TelerikButton>

@if (WizardVisible)
{
    <TelerikWizard @bind-Value="@CurrStepIndex">
        <WizardSteps>
            <WizardStep Label="Personal Details" Icon="SvgIcon.User">
                <Content>
                    content here
                </Content>
            </WizardStep>

            @if (AttachmentsStepVisible)
            {
                <WizardStep Label="Attachments" Icon="SvgIcon.Paperclip">
                    <Content>
                        conditional content here
                    </Content>
                </WizardStep>
            }

            <WizardStep Label="Confirmation" Icon="SvgIcon.Check">
                <Content>
                    other content here
                </Content>
            </WizardStep>
        </WizardSteps>
    </TelerikWizard>
}


@code {
    private bool AttachmentsStepVisible { get; set; }
    private bool WizardVisible { get; set; } = true;

    private int CurrStepIndex { get; set; }

    private async void ToggleStep()
    {
        //dispose the Wizard
        WizardVisible = false;

        // defence against hiding the step when it is the last step, which would cause an exception
        if (AttachmentsStepVisible && CurrStepIndex == 2)
        {
            CurrStepIndex = 1;
        }

        //the actual visibility toggle
        AttachmentsStepVisible = !AttachmentsStepVisible;

        //allow some time for the disposal and toggling the step visibility prior to re-initialization
        await Task.Delay(10);

        //re-initialize the Wizard
        WizardVisible = true;

        StateHasChanged();
    }
}

@using System.Dynamic
@using Telerik.DataSource
@using Telerik.DataSource.Extensions

<TelerikGrid OnRead="@OnGridRead"
             TItem="@ExpandoObject"
             Pageable="true"
             Sortable="true"
             FilterMode="@GridFilterMode.FilterMenu"
             FilterMenuType="@FilterMenuType.CheckBoxList"
             Height="400px">
    <GridToolBarTemplate>
        <GridSearchBox />
    </GridToolBarTemplate>
    <GridColumns>
        @{
            if (GridData != null && GridData.Any())
            {
                <GridColumn Field="PropertyInt" FieldType="@GridPropertyTypes["PropertyInt"]" />
                <GridColumn Field="PropertyString" FieldType="@GridPropertyTypes["PropertyString"]" />
                <GridColumn Field="PropertyGroup" FieldType="@GridPropertyTypes["PropertyString"]" />
                <GridColumn Field="PropertyDate" FieldType="@GridPropertyTypes["PropertyDate"]" />
                <GridColumn Field="PropertyBool" FieldType="@GridPropertyTypes["PropertyBool"]" />
            }
        }
    </GridColumns>
</TelerikGrid>

@code {
    private List<ExpandoObject> GridData { get; set; } = new List<ExpandoObject>();

    private Dictionary<string, Type> GridPropertyTypes { get; set; } = new Dictionary<string, Type>() {
        { "Id", typeof(int) },
        { "PropertyInt", typeof(int) },
        { "PropertyString", typeof(string) },
        { "PropertyGroup", typeof(string) },
        { "PropertyDate", typeof(DateTime) },
        { "PropertyBool", typeof(bool) }
    };

    private async Task OnGridRead(GridReadEventArgs args)
    {
        args.Request.Filters.OfType<CompositeFilterDescriptor>()
        .Each(x =>
        {
            x.FilterDescriptors.OfType<FilterDescriptor>()
                .Each(y => y.MemberType = GridPropertyTypes[y.Member]);
        });

        var result = GridData.ToDataSourceResult(args.Request);

        args.Data = result.Data;
        args.Total = result.Total;
        args.AggregateResults = result.AggregateResults;
    }

    protected override void OnInitialized()
    {
        for (int i = 1; i <= 18; i++)
        {
            dynamic expando = new ExpandoObject();

            expando.Id = i;
            expando.PropertyGroup = $"Group {(i % 3 + 1)}";
            expando.PropertyInt = i;
            expando.PropertyString = $"String {(char)(64 + i)}{(char)(64 + i)}";
            expando.PropertyDate = DateTime.Now.AddMonths(-i);
            expando.PropertyBool = i % 2 != 0;

            GridData.Add(expando);
        }
    }
}