Fix element not closed issue when navigation ends with a non-zero lev…

…el + add API section to the navigation
havit · Oct 19, 2022 · b75e2b6 · b75e2b6
1 parent da0a46d
commit b75e2b6
Show file tree

Hide file tree

Showing 11 changed files with 99 additions and 44 deletions.
diff --git a/Havit.Blazor.Components.Web.Bootstrap.Documentation.Server/Startup.cs b/Havit.Blazor.Components.Web.Bootstrap.Documentation.Server/Startup.cs
@@ -16,7 +16,7 @@ public void ConfigureServices(IServiceCollection services)
 
 		services.AddTransient<IComponentApiDocModelBuilder, ComponentApiDocModelBuilder>();
 		services.AddSingleton<IDocXmlProvider, DocXmlProvider>();
-		services.AddSingleton<ISectionTitleHolder, SectionTitleHolder>();
+		services.AddSingleton<ISectionDataHolder, SectionDataHolder>();
 	}
 
 	public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

diff --git a/Havit.Blazor.Components.Web.Bootstrap.Documentation/Program.cs b/Havit.Blazor.Components.Web.Bootstrap.Documentation/Program.cs
@@ -20,7 +20,7 @@ public static async Task Main(string[] args)
 
 		builder.Services.AddTransient<IComponentApiDocModelBuilder, ComponentApiDocModelBuilder>();
 		builder.Services.AddSingleton<IDocXmlProvider, DocXmlProvider>();
-		builder.Services.AddSingleton<ISectionTitleHolder, SectionTitleHolder>();
+		builder.Services.AddSingleton<ISectionDataHolder, SectionDataHolder>();
 
 		await builder.Build().RunAsync();
 	}

diff --git a/...mentation/Services/ISectionTitleHolder.cs → ...umentation/Services/ISectionDataHolder.cs b/...mentation/Services/ISectionTitleHolder.cs → ...umentation/Services/ISectionDataHolder.cs
@@ -2,11 +2,11 @@
 
 namespace Havit.Blazor.Components.Web.Bootstrap.Documentation.Services;
 
-public interface ISectionTitleHolder
+public interface ISectionDataHolder
 {
-	void RegisterNew(SectionTitle sectionTitle, string url);
+	void RegisterNew(ISectionData sectionTitle, string url);
 
-	ICollection<SectionTitle> RetrieveAll(string url);
+	ICollection<ISectionData> RetrieveAll(string url);
 
 	void Clear();
 }
diff --git a/...umentation/Services/SectionTitleHolder.cs → ...cumentation/Services/SectionDataHolder.cs b/...umentation/Services/SectionTitleHolder.cs → ...cumentation/Services/SectionDataHolder.cs
@@ -2,11 +2,11 @@
 
 namespace Havit.Blazor.Components.Web.Bootstrap.Documentation.Services;
 
-public class SectionTitleHolder : ISectionTitleHolder
+public class SectionDataHolder : ISectionDataHolder
 {
-	private Dictionary<string, List<SectionTitle>> sectionTitles = new();
+	private Dictionary<string, List<ISectionData>> sectionTitles = new();
 
-	public void RegisterNew(SectionTitle sectionTitle, string url)
+	public void RegisterNew(ISectionData sectionTitle, string url)
 	{
 		string page = GetPageFromUrl(url);
 		EnsureKey(page);
@@ -17,7 +17,7 @@ public void RegisterNew(SectionTitle sectionTitle, string url)
 		}
 	}
 
-	public ICollection<SectionTitle> RetrieveAll(string url)
+	public ICollection<ISectionData> RetrieveAll(string url)
 	{
 		string page = GetPageFromUrl(url);
 		EnsureKey(page);
@@ -28,7 +28,7 @@ private void EnsureKey(string page)
 	{
 		if (!sectionTitles.ContainsKey(page))
 		{
-			sectionTitles.Add(page, new List<SectionTitle>());
+			sectionTitles.Add(page, new List<ISectionData>());
 		}
 	}
 

diff --git a/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/ComponentApiDoc.razor b/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/ComponentApiDoc.razor
@@ -10,19 +10,19 @@
 @ChildContent
 @MainContent
 
-@if (model.HasValues || CssVariables is not null)
+@if (hasApi)
 {
-	<h2>API</h2>
+	<SectionTitle HeadingTag="h2" Id="api">API</SectionTitle>
 }
 
-@if (model.IsDelegate)
+@if (isDelegate)
 {
-	<h6><code>@((MarkupString)model.DelegateSignature)</code></h6>
+	<SectionTitle HeadingTag="h6"><code>@((MarkupString)model.DelegateSignature)</code></SectionTitle>
 }
 
-@if (model.IsEnum)
+@if (isEnum)
 {
-	<h3>Enum Values</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="enum-values">Enum Values</SectionTitle>
 	<div class="table-responsive">
 		<table class="table table-bordered">
 			<thead>
@@ -46,9 +46,9 @@
 	</div>
 }
 
-@if (model.Parameters.Any())
+@if (hasParameters)
 {
-	<h3>Parameters</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="parameters">Parameters</SectionTitle>
 
 	<div class="table-responsive">
 		<table class="table table-bordered">
@@ -84,9 +84,9 @@
 	</div>
 }
 
-@if (model.Properties.Any())
+@if (hasProperties)
 {
-	<h3>Other properties</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="properties">Other properties</SectionTitle>
 	<div class="table-responsive">
 		<table class="table table-bordered">
 			<thead>
@@ -110,9 +110,9 @@
 	</div>
 }
 
-@if (model.Events.Any())
+@if (hasEvents)
 {
-	<h3>Event callbacks</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="events">Event callbacks</SectionTitle>
 
 	<div class="table-responsive">
 		<table class="table table-bordered">
@@ -137,9 +137,9 @@
 	</div>
 }
 
-@if (!model.IsEnum && model.Methods.Any())
+@if (hasMethods)
 {
-	<h3>Methods</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="methods">Methods</SectionTitle>
 	<div class="table-responsive">
 		<table class="table table-bordered">
 			<thead>
@@ -163,9 +163,9 @@
 	</div>
 }
 
-@if (model.StaticProperties.Any())
+@if (hasStaticProperties)
 {
-	<h3>Static properties</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="static-properties">Static properties</SectionTitle>
 
 	<div class="table-responsive">
 		<table class="table table-bordered">
@@ -190,9 +190,9 @@
 	</div>
 }
 
-@if (!model.IsEnum && model.StaticMethods.Any())
+@if (hasStaticMethods)
 {
-	<h3>Static Methods</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="static-methods">Static Methods</SectionTitle>
 
 	<div class="table-responsive">
 		<table class="table table-bordered">
@@ -217,9 +217,9 @@
 	</div>
 }
 
-@if (CssVariables is not null)
+@if (hasCssVariables)
 {
-	<h3>CSS Variables</h3>
+	<SectionTitle HeadingTag="@ApiSectionHeadingTag" Level="1" Id="css-variables">CSS Variables</SectionTitle>
 	<div class="table-responsive">
 		<table class="table table-bordered">
 			<thead>

diff --git a/....Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/ComponentApiDoc.razor.cs b/....Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/ComponentApiDoc.razor.cs
@@ -5,6 +5,8 @@ namespace Havit.Blazor.Components.Web.Bootstrap.Documentation.Shared.Components;
 
 public partial class ComponentApiDoc
 {
+	private const string ApiSectionHeadingTag = "h3";
+
 	[Parameter] public RenderFragment ChildContent { get; set; }
 
 	[Parameter] public RenderFragment MainContent { get; set; }
@@ -20,6 +22,17 @@ public partial class ComponentApiDoc
 
 	private ComponentApiDocModel model;
 
+	private bool hasApi => model.HasValues || CssVariables is not null;
+	private bool isDelegate => model.IsDelegate;
+	private bool isEnum => model.IsEnum;
+	private bool hasParameters => model.Parameters.Any();
+	private bool hasProperties => model.Properties.Any();
+	private bool hasEvents => model.Events.Any();
+	private bool hasMethods => !model.IsEnum && model.Methods.Any();
+	private bool hasStaticProperties => model.StaticProperties.Any();
+	private bool hasStaticMethods => !model.IsEnum && model.StaticMethods.Any();
+	private bool hasCssVariables => CssVariables is not null;
+
 	protected override void OnParametersSet()
 	{
 		model = ComponentApiDocModelBuilder.BuildModel(this.Type);

diff --git a/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/ISectionData.cs b/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/ISectionData.cs
@@ -0,0 +1,11 @@
+namespace Havit.Blazor.Components.Web.Bootstrap.Documentation.Shared.Components;
+
+public interface ISectionData
+{
+	string Id { get; set; }
+	int Level { get; set; }
+	string TitleEffective { get; }
+	RenderFragment ChildContent { get; set; }
+
+	string GetSectionUrl(string currentUrl);
+}
diff --git a/...or.Components.Web.Bootstrap.Documentation/Shared/Components/OnThisPageNavigation.razor.cs b/...or.Components.Web.Bootstrap.Documentation/Shared/Components/OnThisPageNavigation.razor.cs
@@ -5,14 +5,14 @@ namespace Havit.Blazor.Components.Web.Bootstrap.Documentation.Shared.Components;
 
 public partial class OnThisPageNavigation
 {
-	[Inject] public ISectionTitleHolder SectionTitleHolder { get; set; }
+	[Inject] public ISectionDataHolder SectionDataHolder { get; set; }
 	[Inject] public NavigationManager NavigationManager { get; set; }
 
 	[Parameter] public string CssClass { get; set; }
 
 	[Parameter] public RenderFragment ChildContent { get; set; }
 
-	private IEnumerable<SectionTitle> Sections { get; set; }
+	private IEnumerable<ISectionData> Sections { get; set; }
 
 	protected override void OnInitialized()
 	{
@@ -23,14 +23,14 @@ protected override void OnAfterRender(bool firstRender)
 	{
 		if (firstRender)
 		{
-			Sections = SectionTitleHolder.RetrieveAll(NavigationManager.Uri);
+			Sections = SectionDataHolder.RetrieveAll(NavigationManager.Uri);
 			StateHasChanged();
 		}
 	}
 
 	private void LoadSections(object sender, LocationChangedEventArgs eventArgs)
 	{
-		Sections = SectionTitleHolder.RetrieveAll(eventArgs.Location);
+		Sections = SectionDataHolder.RetrieveAll(eventArgs.Location);
 		StateHasChanged();
 	}
 
@@ -46,7 +46,7 @@ private RenderFragment GenerateSectionTree() => builder =>
 		int sequence = 1;
 		for (int i = 0; i < Sections.Count(); i++)
 		{
-			SectionTitle currentSection = Sections.ElementAt(i);
+			ISectionData currentSection = Sections.ElementAt(i);
 
 			// Handle level adjustments - nested lists.
 			int levelDifference = Math.Abs(currentSection.Level - currentLevel);
@@ -70,13 +70,18 @@ private RenderFragment GenerateSectionTree() => builder =>
 			builder.OpenElement(sequence++, "li");
 
 			builder.OpenElement(sequence++, "a");
-			builder.AddAttribute(sequence++, "href", currentSection.GetSectionUrl());
+			builder.AddAttribute(sequence++, "href", currentSection.GetSectionUrl(NavigationManager.Uri));
 			builder.AddAttribute(sequence++, "class", "text-secondary mb-1");
 			builder.AddContent(sequence++, currentSection.TitleEffective);
 			builder.AddContent(sequence++, currentSection.ChildContent);
 			builder.CloseElement();
 
 			builder.CloseElement();
 		}
+
+		for (int j = 0; j < currentLevel; j++)
+		{
+			builder.CloseElement();
+		}
 	};
 }
diff --git a/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/SectionData.cs b/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/SectionData.cs
@@ -0,0 +1,16 @@
+namespace Havit.Blazor.Components.Web.Bootstrap.Documentation.Shared.Components;
+
+public class SectionData : ISectionData
+{
+	public string Id { get; set; }
+	public int Level { get; set; }
+
+	public string TitleEffective { get; init; }
+
+	public RenderFragment ChildContent { get; set; }
+
+	public string GetSectionUrl(string currentUrl)
+	{
+		return $"{currentUrl}#{Id}";
+	}
+}
diff --git a/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/SectionTitle.razor b/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/SectionTitle.razor
@@ -3,5 +3,5 @@
 <HxDynamicElement ElementName="@HeadingTagEffective" id="@Id">
     @TitleEffective
     @ChildContent
-    <a href="@GetSectionUrl()">#</a>
+    <a href="@GetEffectiveSectionUrl()">#</a>
 </HxDynamicElement>
diff --git a/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/SectionTitle.razor.cs b/Havit.Blazor.Components.Web.Bootstrap.Documentation/Shared/Components/SectionTitle.razor.cs
@@ -3,7 +3,7 @@
 
 namespace Havit.Blazor.Components.Web.Bootstrap.Documentation.Shared.Components;
 
-public partial class SectionTitle
+public partial class SectionTitle : ISectionData
 {
 	/// <summary>
 	/// Which heading tags are to be used for which levels.
@@ -12,7 +12,8 @@ public partial class SectionTitle
 	{
 		{ 0, "h3" },
 		{ 1, "h4" },
-		{ 2, "h5" }
+		{ 2, "h5" },
+		{ 3, "h6" }
 	};
 
 	[Inject] public NavigationManager NavigationManager { get; set; }
@@ -34,10 +35,15 @@ public partial class SectionTitle
 
 	[Parameter] public RenderFragment ChildContent { get; set; }
 
-	[Inject] public ISectionTitleHolder SectionTitleHolder { get; set; }
+	/// <summary>
+	/// Tag for the section title.
+	/// </summary>
+	[Parameter] public string HeadingTag { get; set; }
+
+	[Inject] public ISectionDataHolder SectionTitleHolder { get; set; }
 
 	public string TitleEffective => Title ?? (ChildContent is null ? GetTitleFromHref() : string.Empty);
-	protected string HeadingTagEffective => LevelHeadingTags.ContainsKey(Level) ? LevelHeadingTags[Level] : LevelHeadingTags.Values.LastOrDefault();
+	protected string HeadingTagEffective => HeadingTag ?? (LevelHeadingTags.ContainsKey(Level) ? LevelHeadingTags[Level] : LevelHeadingTags.Values.LastOrDefault());
 
 	protected override void OnParametersSet()
 	{
@@ -64,12 +70,16 @@ private string GetTitleFromHref()
 		return result;
 	}
 
-	public string GetSectionUrl()
+	public string GetSectionUrl(string currentUrl)
 	{
-		string uri = NavigationManager.Uri;
-		uri = uri.Split('?')[0];
+		string uri = currentUrl.Split('?')[0];
 		uri = uri.Split('#')[0];
 
 		return $"{uri}#{Id}";
 	}
+
+	private string GetEffectiveSectionUrl()
+	{
+		return GetSectionUrl(NavigationManager.Uri);
+	}
 }