The active class is set on the wrong div on the MudNavLink when using an onclick event (and thus setting the class via code).

I’m using MudBlazor in a .net 8 application and I have created a blazor page that contains a MudNavMenu like this:

<MudNavMenu>
    <MudNavLink OnClick="@(e => ToggleActiveSection("Profile"))" Class="@($"{(ActiveSection == "Profile" ? "active" : "")}")">Profile</MudNavLink>
    <MudNavLink OnClick="@(e => ToggleActiveSection("Security"))" Class="@($"{(ActiveSection == "Security" ? "active" : "")}")">Security</MudNavLink>
</MudNavMenu>

The ToggleActiveSection renders a component in the page depending on the MudNavLink clicked (
<Profile /> or <Security />. It also sets the property ActiveSection. This works fine. Accept for displaying the active link. When I look at the code in my browser, I notice that active is not set to the correct div:

It is set to the div with “mud-nav-item” instead of “mud-nav-link”. When I change this in the browser, the active link shows up on my screen.

Am I doing something wrong?