MudExpansionPanelsOverride.razor

@inject IDialogService DialogService

<MudText Class="mt-1">This test page shows a 'bug' in Mud expansion panels...</MudText>
<MudText Class="mt-1">Click the add panels button (once). Several panels are created. Then, click on the top panel's pushpin to delete it. Once deleted, the panel below it auto-expands. This is <strong>undesired</strong> behaviour. </MudText>
<MudText Class="mt-1">Note: if you delete panels from bottom up, no panel get expanded. It appears only the panel directly below the delted on expands.</MudText>
<MudButton @onclick="AddPanels" Variant="Variant.Filled" Color="Color.Primary">
    Add Panels
</MudButton>

<MudExpansionPanels>
	@foreach (var item in AllFeatureItems)
	{
      <MudExpansionPanel Text="@item" MaxHeight="150" Disabled="disabled">
        <TitleContent>
            <MudPaper Class="d-flex py-2 px-1" Elevation="0">
                <MudIcon Icon="@Icons.Material.Filled.PushPin" Class="mr-2" @onclick="() => DeletePanel(item)" />
                <MudText Class="mt-1">@item</MudText>
            </MudPaper>
        </TitleContent>
        <ChildContent>
            <MudText Class="mt-1">@item</MudText>
            <MudText Class="mt-1">more stuff here..</MudText>
        </ChildContent>
    </MudExpansionPanel>
    }
</MudExpansionPanels>

@code {
bool disabled =false;
 List<string> AllFeatureItems { get; set; } = new List<string>();

   
    private void AddPanels()
    {
        AllFeatureItems.Add("One");
        AllFeatureItems.Add("Two");
        AllFeatureItems.Add("Three");
        AllFeatureItems.Add("Four)");
        AllFeatureItems.Add("Five)");
        AllFeatureItems.Add("Six)");
    }

    private async Task DeletePanel(string item)
    {   disabled =true;
        AllFeatureItems.Remove(item);
       await Task.Delay(500);
       disabled = false;
    }
}