I want to set the active panel index based on a query parameter value

Problem Description

When navigating to a Blazor page containing MudTabs with a query parameter specifying the active tab index (e.g., ?tab=1), the application throws an ArgumentOutOfRangeException during the component's first render cycle.

Exception Details

System.ArgumentOutOfRangeException: Index was out of range. Must be non-negative and less than the size of the collection. (Parameter 'index')   at System.Collections.Generic.List`1.get_Item(Int32 index)   at MudBlazor.MudTabs.OnAfterRenderAsync(Boolean firstRender)

Environment

• MudBlazor Version: 7.15.0
• Blazor Hosting Model: Server
• .NET Version: 9.0

Minimal Reproducible Example

Page Component (.razor)

@page "/example/{Id:long}"@using MudBlazor<MudTabs ActivePanelIndexChanged="@OnActivePanelChanged"         @ref="_tabs"><MudTabPanel Text="Details"><p>Details content</p></MudTabPanel><MudTabPanel Text="Tab 2" Disabled="@(!_enableTab2)"><p>Tab 2 content</p></MudTabPanel><MudTabPanel Text="Tab 3" Disabled="@(!_enableTab3)"><p>Tab 3 content</p></MudTabPanel></MudTabs>

Code Behind (.razor.cs)

public partial class Example : ComponentBase{    [Parameter] public long Id { get; set; }    [Parameter, SupplyParameterFromQuery(Name = "tab")]    public int? TabFromQuery { get; set; }    private MudBlazor.MudTabs? _tabs;    private int? _activePanelIndex;    private int? _pendingIndexFromQuery;    private bool _tabsInitialized;    private bool _enableTab2 = false;    private bool _enableTab3 = false;    protected override Task OnParametersSetAsync()    {        // Store query parameter for later use        if (TabFromQuery is int i && i >= 0)            _pendingIndexFromQuery = i;        return Task.CompletedTask;    }    protected override async Task OnAfterRenderAsync(bool firstRender)    {        await base.OnAfterRenderAsync(firstRender);        // Try to activate the tab from query parameter        if (_tabs?.Panels.Count > 0 && !_tabsInitialized)        {            _tabsInitialized = true;            if (_pendingIndexFromQuery.HasValue)            {                var count = _tabs.Panels.Count;                var index = Math.Min(_pendingIndexFromQuery.Value, count - 1);                _tabs.ActivatePanel(index);                _activePanelIndex = index;                _pendingIndexFromQuery = null;            }            else            {                _activePanelIndex = 0;            }        }    }    private void OnActivePanelChanged(int index)    {        _activePanelIndex = index;    }}

Steps to Reproduce

1. Create a page with MudTabs and dynamic/disabled panels
2. Navigate to the page with a query parameter: /example/123?tab=1
3. Exception is thrown in MudTabs.OnAfterRenderAsync()

Root Cause

The exception occurs during the MudTabs component lifecycle:

1. OnParametersSetAsync: Query parameter tab=1 is captured
2. First Render: MudTabs starts rendering, Panels collection is being populated
3. OnAfterRenderAsync(firstRender: true): MudTabs internally tries to access Panels[ActivePanelIndex]
4. Problem: At this moment, Panels collection is not yet fully initialized or is empty
5. Result: ArgumentOutOfRangeException when accessing the index

Expected Behavior

• MudTabs should handle cases where ActivePanelIndex is set before panels are fully initialized
• Should gracefully default to index 0 or wait for panels to be ready
• No exception should occur when navigating with query parameters

Workarounds Attempted

All of these still produce the exception:

❌ Attempt 1: Direct ActivePanelIndex Binding

<MudTabs ActivePanelIndex="@_activePanelIndex" ...>

Result: Same exception during first render

❌ Attempt 2: Using ActivatePanel in OnAfterRenderAsync

if (_tabs?.Panels.Count > 0){    _tabs.ActivatePanel(requestedIndex);}

Result: Exception still occurs before our code executes

❌ Attempt 3: Delaying with StateHasChanged

protected override async Task OnAfterRenderAsync(bool firstRender){    StateHasChanged();    await Task.Delay(100);    _tabs?.ActivatePanel(index);}

Result: Exception occurs before delay

❌ Attempt 4: Setting in OnInitializedAsync

protected override async Task OnInitializedAsync(){    if (_pendingIndexFromQuery.HasValue)        _tabs?.ActivatePanel(_pendingIndexFromQuery.Value);}

Result: _tabs is null, panels don't exist yet