Blazor Server .NET 7, anchor navigation not working on Razor class library page, works on pages in main app

Question

Blazor Server on .NET 7, implemented anchor navigation using the code from text verbatim. This works great for pages in the main app. When applied to pages located in a Razor class library, navigation always routes to the main app index page - why?

I expected a hyperlink click to scroll down to a section lower in the active Razor class library page - not the main app's index page.

AnchorNavigation.razor from the class library:

@inject IJSRuntime JSRuntime
@inject NavigationManager NavigationManager

@implements IDisposable

@code {
    protected override void OnInitialized()
    {
        NavigationManager.LocationChanged += OnLocationChanged;
    }

    private IJSObjectReference? module;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
       // if (firstRender)
       //     module = await JSRuntime.InvokeAsync<IJSObjectReference>("import", "./SharedComponents\\AnchorNavigation.js");

        await ScrollToFragment();
    }

    public async void Dispose()
    {
       // if (module is not null)
       //     await module.DisposeAsync();

        NavigationManager.LocationChanged -= OnLocationChanged;
    }

    private async void OnLocationChanged(object sender, LocationChangedEventArgs e)
    {
        await ScrollToFragment();
    }

    private async Task ScrollToFragment()
    {
        var uri = new Uri(NavigationManager.Uri, UriKind.Absolute);
        var fragment = uri.Fragment;

        if (fragment.StartsWith('#'))
        {
            // Handle text fragment (https://example.org/#test:~:text=foo)
            // https://github.com/WICG/scroll-to-text-fragment/
            var elementId = fragment.Substring(1);
            var index = elementId.IndexOf(":~:", StringComparison.Ordinal);

            if (index > 0)
            {
                elementId = elementId.Substring(0, index);
            }

            if (!string.IsNullOrEmpty(elementId))
            {
                await JSRuntime.InvokeVoidAsync("BlazorScrollToId1", elementId);
            }
        }
    }
}

_Host.cshtml from the main app:

<script>
    function BlazorScrollToId1(id) {
        const element = document.getElementById(id);
        if (element instanceof HTMLElement) {
            element.scrollIntoView({
                behavior: "smooth",
                block: "start",
                inline: "nearest"
            });
        }
    }
</script>

Index.razor from the main app - this works:

...
<Common.SharedComponents.AnchorNavigation /> 
...
 <p><a href="@GetHreff(0)">0.0 Introduction</a></p> 
...

<section id="@GetIdf(0)"> 
...
<h5 class="cardB-title">Introduction</h5>
...
</section>

@code {
    string GetIdf(int i) => "header-" + i;
    string GetHreff(int i) => "#" + GetIdf(i);
}

Table of Contents from class library - this does not work, it navigates to the app's main index page.

@page "/Table of Contents"
<PageTitle>Table of Contents</PageTitle>

<Common.SharedComponents.AnchorNavigation /> 
...
 <p><a href="@GetHreff(0)">Paper 1</a></p> 
...

<section id="@GetIdf(0)"> 
...
<h2>Paper 1</h5>
...
</section>

@code {
    string GetIdf(int i) => "header-" + i;
    string GetHreff(int i) => "#" + GetIdf(i);
}