update CSS classes, attribute name refactoring

samples/MudBlazor.Markdown.Core/sample.md

@@ -9,6 +9,7 @@ Some regular text. *Text in italics*, **text in bold** and ~~text in strikethrou
 **Bold and *italics within***.
 *Italics and **bold within***.
 It is possible to `highlight some code`.
+*~Invalid **or** unknown~ markdown is shown as it is*.
 Please visit the [MudBlazor project site](https://mudblazor.com/).
 ***
 > Quote someone.

src/MudBlazor.Markdown/Components/MudLinkButton.razor.cs

@@ -57,10 +57,10 @@ protected override void BuildRenderTree(RenderTreeBuilder builder)
 	{
 		var i = 0;
 
-		builder.OpenElement(i++, "span");
-		builder.AddAttribute(i++, "class", Classname);
-		builder.AddAttribute(i++, "style", Style);
-		builder.AddAttribute(i++, "onclick", EventCallback.Factory.Create(this, OnClick));
+		builder.OpenElement(i++, ElementNames.Span);
+		builder.AddAttribute(i++, AttributeNames.Class, Classname);
+		builder.AddAttribute(i++, AttributeNames.Style, Style);
+		builder.AddAttribute(i++, AttributeNames.OnClick, EventCallback.Factory.Create(this, OnClick));
 		builder.AddContent(i++, ChildContent);
 		builder.CloseElement();
 	}
@@ -73,4 +73,4 @@ private void OnClick()
 		if (Command?.CanExecute(CommandParameter) ?? false)
 			Command.Execute(CommandParameter);
 	}
-}
+}

src/MudBlazor.Markdown/Components/MudMathJax.razor.cs

@@ -41,11 +41,13 @@ private static MathDelimiter GetDelimiter(in string delimiter) =>
 		{
 			"$" => new MathDelimiter("\\(", "\\)"),
 			"$$" => new MathDelimiter(delimiter),
-			_ => new MathDelimiter(delimiter)
+			_ => new MathDelimiter(delimiter),
 		};
 
 	private readonly ref struct MathDelimiter
 	{
+		public readonly string Start, End;
+
 		public MathDelimiter(string delimiter)
 		{
 			Start = End = delimiter;
@@ -56,9 +58,5 @@ public MathDelimiter(string start, string end)
 			Start = start;
 			End = end;
 		}
-
-		public string Start { get; }
-
-		public string End { get; }
 	}
 }

src/MudBlazor.Markdown/Enums/AttributeNames.cs

@@ -0,0 +1,11 @@
+namespace MudBlazor;
+
+internal static class AttributeNames
+{
+	public const string OnClick = "onclick",
+		Class = "class",
+		Id = "id",
+		LinkRelation = "rel",
+		Style = "style",
+		Start = "start";
+}

src/MudBlazor.Markdown/Enums/CodeBlockTheme.cs

@@ -243,5 +243,5 @@ public enum CodeBlockTheme : ushort
 	WindowsNtBase16,
 	WoodlandBase16,
 	XcodeDuskBase16,
-	ZenburnBase16
-}
+	ZenburnBase16,
+}

src/MudBlazor.Markdown/Enums/ElementNames.cs

@@ -0,0 +1,6 @@
+namespace MudBlazor;
+
+internal static class ElementNames
+{
+	public const string Span = "span";
+}

src/MudBlazor.Markdown/Extensions/CodeBlockThemeEx.cs

@@ -247,6 +247,6 @@ public static string GetStylesheetPath(this CodeBlockTheme @this) =>
 			CodeBlockTheme.WoodlandBase16 => "base16/woodland.min.css",
 			CodeBlockTheme.XcodeDuskBase16 => "base16/xcode-dusk.min.css",
 			CodeBlockTheme.ZenburnBase16 => "base16/zenburn.min.css",
-			_ => string.Empty
+			_ => string.Empty,
 		};
-}
+}

src/MudBlazor.Markdown/Extensions/EmphasisInlineEx.cs

@@ -14,17 +14,17 @@ public static bool TryGetEmphasisElement(this EmphasisInline emphasis, out strin
 			{
 				1 => italics,
 				2 => bold,
-				_ => string.Empty
+				_ => string.Empty,
 			},
 			'_' => italics,
 			'~' => emphasis.DelimiterCount switch
 			{
 				2 => strikethrough,
-				_ => string.Empty
+				_ => string.Empty,
 			},
-			_ => string.Empty
+			_ => string.Empty,
 		};
 
 		return !string.IsNullOrEmpty(value);
 	}
-}
+}

src/MudBlazor.Markdown/Extensions/HeadingBlockEx.cs

@@ -26,7 +26,7 @@ private static string GetStringContent(this Inline @this)
 		var slice = @this switch
 		{
 			LiteralInline x => x.Content,
-			_ => StringSlice.Empty
+			_ => StringSlice.Empty,
 		};
 
 		return PrepareStringContent(slice.ToString());
@@ -42,4 +42,4 @@ private static string PrepareStringContent(this string @this)
 
 		return str;
 	}
-}
+}

src/MudBlazor.Markdown/MudMarkdown.razor.cs

@@ -100,7 +100,7 @@ protected override void BuildRenderTree(RenderTreeBuilder builder)
 			return;
 
 		builder.OpenElement(ElementIndex++, "article");
-		builder.AddAttribute(ElementIndex++, "class", "mud-markdown-body");
+		builder.AddAttribute(ElementIndex++, AttributeNames.Class, "mud-markdown-body");
 		RenderMarkdown(parsedText, builder);
 		builder.CloseElement();
 	}
@@ -209,7 +209,7 @@ protected virtual void RenderParagraphBlock(LeafBlock paragraph, RenderTreeBuild
 		builder.OpenComponent<MudText>(ElementIndex++);
 
 		if (!string.IsNullOrEmpty(id))
-			builder.AddAttribute(ElementIndex++, "id", id);
+			builder.AddAttribute(ElementIndex++, AttributeNames.Id, id);
 
 		builder.AddAttribute(ElementIndex++, nameof(MudText.Typo), typo);
 		builder.AddAttribute(ElementIndex++, nameof(MudText.ChildContent), (RenderFragment)(contentBuilder => RenderInlines(paragraph.Inline, contentBuilder)));
@@ -250,7 +250,7 @@ protected virtual void RenderInlines(ContainerInline inlines, RenderTreeBuilder
 					if (!x.TryGetEmphasisElement(out var elementName))
 					{
 						var markdownValue = x.Span.TryGetText(Value);
-						TryRenderMarkdownError(markdownValue, builder, htmlElement: "span");
+						TryRenderMarkdownError(markdownValue, builder, ElementNames.Span);
 						continue;
 					}
 
@@ -286,14 +286,14 @@ protected virtual void RenderInlines(ContainerInline inlines, RenderTreeBuilder
 						if (url.IsExternalUri(NavigationManager?.BaseUri))
 						{
 							builder.AddAttribute(ElementIndex++, nameof(MudLink.Target), "_blank");
-							builder.AddAttribute(ElementIndex++, "rel", "noopener noreferrer");
+							builder.AddAttribute(ElementIndex++, AttributeNames.LinkRelation, "noopener noreferrer");
 						}
 						// (prevent scrolling to the top of the page)
 						// custom implementation only for links on the same page
 						else if (url?.StartsWith('#') ?? false)
 						{
-							builder.AddEventPreventDefaultAttribute(ElementIndex++, "onclick", true);
-							builder.AddAttribute(ElementIndex++, "onclick", EventCallback.Factory.Create<MouseEventArgs>(this, () =>
+							builder.AddEventPreventDefaultAttribute(ElementIndex++, AttributeNames.OnClick, true);
+							builder.AddAttribute(ElementIndex++, AttributeNames.OnClick, EventCallback.Factory.Create<MouseEventArgs>(this, () =>
 							{
 								if (NavigationManager == null)
 									return;
@@ -351,7 +351,7 @@ protected virtual void TryRenderMarkdownError(string? text, RenderTreeBuilder bu
 			return;
 
 		builder.OpenElement(ElementIndex++, htmlElement);
-		builder.AddAttribute(ElementIndex++, "class", "markdown-error");
+		builder.AddAttribute(ElementIndex++, AttributeNames.Class, "mud-markdown-error");
 		builder.AddContent(ElementIndex++, text);
 		builder.CloseElement();
 	}
@@ -403,7 +403,7 @@ protected virtual void RenderTableRow(TableRow row, string cellElementName, Rend
 			builder.OpenElement(ElementIndex++, cellElementName);
 
 			if (minWidth is > 0)
-				builder.AddAttribute(ElementIndex++, "style", $"min-width:{minWidth}px");
+				builder.AddAttribute(ElementIndex++, AttributeNames.Style, $"min-width:{minWidth}px");
 
 			if (cell.Count != 0 && cell[0] is ParagraphBlock paragraphBlock)
 				RenderParagraphBlock(paragraphBlock, builder);
@@ -426,7 +426,7 @@ protected virtual void RenderList(ListBlock list, RenderTreeBuilder builder)
 
 		if (orderStart > 1)
 		{
-			builder.AddAttribute(ElementIndex++, "start", orderStart);
+			builder.AddAttribute(ElementIndex++, AttributeNames.Start, orderStart);
 		}
 
 		for (var i = 0; i < list.Count; i++)

src/MudBlazor.Markdown/Resources/MudBlazor.Markdown.css

@@ -104,7 +104,7 @@ pre code.hljs {
 	margin-bottom: 0 !important;
 }
 
-.mud-markdown-body p .markdown-error {
+.mud-markdown-body p .mud-markdown-error {
 	white-space: pre;
 }
 

tests/MudBlazor.Markdown.Tests/MarkdownComponentTests/MarkdownComponentCasesShould.cs

@@ -571,7 +571,7 @@ public void RenderTableWithWeirdFormat()
 <article class='mud-markdown-body'>
 	<h3 id='my-table' class='mud-typography mud-typography-h3'>My Table:</h3>
 	<p class='mud-typography mud-typography-body1'>
-		<div class='markdown-error'>
+		<div class='mud-markdown-error'>
 			| **Column 1** | **Column 2**   | **Column 3**                |
 			|--------------|----------------|-----------------------------|
 			| Row 1, Col 1 | Row 1, Col 2   |                             |

tests/MudBlazor.Markdown.Tests/MarkdownComponentTests/MarkdownComponentShould.cs

@@ -59,12 +59,12 @@ Some text <code>code</code> again text - <i>italics</i> text and also <b>bold</b
 	[InlineData("==")] // marked
 	public void RenderInvalidEmphasis(string emphasisDelimiter)
 	{
-		string value = $"I expect that {emphasisDelimiter}emphasis{emphasisDelimiter} will be rendered as escaped. {emphasisDelimiter}**Nested markdown is also escaped**{emphasisDelimiter}.";
-		string expected =
+		var value = $"I expect that {emphasisDelimiter}emphasis{emphasisDelimiter} will be rendered as escaped. {emphasisDelimiter}**Nested markdown is also escaped**{emphasisDelimiter}.";
+		var expected =
 $"""
 <article class='mud-markdown-body'>
 	<p class="mud-typography mud-typography-body1">
-		I expect that <span class="markdown-error">{emphasisDelimiter}emphasis{emphasisDelimiter}</span> will be rendered as escaped. <span class="markdown-error">{emphasisDelimiter}**Nested markdown is also escaped**{emphasisDelimiter}</span>.
+		I expect that <span class="mud-markdown-error">{emphasisDelimiter}emphasis{emphasisDelimiter}</span> will be rendered as escaped. <span class="mud-markdown-error">{emphasisDelimiter}**Nested markdown is also escaped**{emphasisDelimiter}</span>.
 	</p>
 </article>
 """;