ProductUI Underline nav

Basic Underline Navigation

<PrimerUnderlineTabGroup Tabs="@TabItems" Selected="@SelectedTab" />

Underline Navigation with Counter

<PrimerUnderlineTabGroup Tabs="@TabItemsWithCounter" Selected="@SelectedTabCounter" />

Underline Navigation Options

Available options for PrimerUnderlineTabGroup component

Name	Description	Default Value	CSS Class
Tabs	List of tabs	-	-
Selected	Currently selected tab value	-	-

private List<PrimerUnderlineTabGroup.TabItem> TabItems = new()
{
    new() { Label = "Overview", Icon = IconName.Home16, Value = "overview" },
    new() { Label = "Issues", Icon = IconName.IssueOpened16, Value = "issues" },
    new() { Label = "Pull Requests", Icon = IconName.GitPullRequest16, Value = "prs" },
    new() { Label = "Settings", Icon = IconName.Gear16, Value = "settings" }
};

private List<PrimerUnderlineTabGroup.TabItem> TabItemsWithCounter = new()
{
    new() { Label = "Overview", Icon = IconName.Home16, Value = "overview", Counter = 20 },
    new() { Label = "Issues", Icon = IconName.IssueOpened16, Value = "issues", Counter = 15 },
    new() { Label = "Pull Requests", Icon = IconName.GitPullRequest16, Value = "prs", Counter = 3 },
    new() { Label = "Settings", Icon = IconName.Gear16, Value = "settings" }
};

private string SelectedTab = "overview";
private string SelectedTabCounter = "overview";