diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index 41bf45b..855ed4a 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -25,7 +25,7 @@ jobs: - name: Setup .NET Core SDK uses: actions/setup-dotnet@v1.8.0 with: - dotnet-version: "5.0" + dotnet-version: "7.0" - run: dotnet tool install -g Microsoft.Web.LibraryManager.Cli - run: | diff --git a/.gitignore b/.gitignore index 8b9c010..e03e85e 100644 --- a/.gitignore +++ b/.gitignore @@ -351,3 +351,6 @@ MigrationBackup/ # Client-Side Libraries **/wwwroot/lib/ + +# vscode +.vscode/ diff --git a/demo/MermaidJS.Blazor.Demo/MermaidJS.Blazor.Demo.csproj b/demo/MermaidJS.Blazor.Demo/MermaidJS.Blazor.Demo.csproj index 8de0ac1..4cc1346 100644 --- a/demo/MermaidJS.Blazor.Demo/MermaidJS.Blazor.Demo.csproj +++ b/demo/MermaidJS.Blazor.Demo/MermaidJS.Blazor.Demo.csproj @@ -1,13 +1,15 @@ - net5.0 + net7.0 + disable + enable - - - + + + diff --git a/demo/MermaidJS.Blazor.Demo/Program.cs b/demo/MermaidJS.Blazor.Demo/Program.cs index 9752e5c..42f1dca 100644 --- a/demo/MermaidJS.Blazor.Demo/Program.cs +++ b/demo/MermaidJS.Blazor.Demo/Program.cs @@ -1,32 +1,16 @@ -using System; -using System.Collections.Generic; -using System.Net.Http; -using System.Text; -using System.Threading.Tasks; - +using MermaidJS.Blazor; +using MermaidJS.Blazor.Demo; using Microsoft.AspNetCore.Components.WebAssembly.Hosting; -using Microsoft.Extensions.Configuration; -using Microsoft.Extensions.DependencyInjection; -using Microsoft.Extensions.Logging; -namespace MermaidJS.Blazor.Demo -{ - public class Program - { - public static async Task Main(string[] args) - { - var builder = WebAssemblyHostBuilder.CreateDefault(args); - builder.RootComponents.Add("#app"); +var builder = WebAssemblyHostBuilder.CreateDefault(args); +builder.RootComponents.Add("#app"); - builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); +builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); - builder.Services.AddMermaidJS(options => - { - options.MaxTextSize = 100000; - options.SecurityLevel = MermaidSecurityLevels.Loose; - }); +builder.Services.AddMermaidJS(options => +{ + options.MaxTextSize = 100000; + options.SecurityLevel = MermaidSecurityLevels.Loose; +}); - await builder.Build().RunAsync(); - } - } -} +await builder.Build().RunAsync(); diff --git a/src/MermaidJS.Blazor/Extensions/IServiceCollectionExtensions.cs b/src/MermaidJS.Blazor/Extensions/IServiceCollectionExtensions.cs index ec2b304..d6000ec 100644 --- a/src/MermaidJS.Blazor/Extensions/IServiceCollectionExtensions.cs +++ b/src/MermaidJS.Blazor/Extensions/IServiceCollectionExtensions.cs @@ -1,10 +1,11 @@ -using System; - -using MermaidJS.Blazor; +using MermaidJS.Blazor; using MermaidJS.Blazor.Internal; namespace Microsoft.Extensions.DependencyInjection { + /// + /// MermaidJS service collection extensions + /// public static class IServiceCollectionExtensions { /// diff --git a/src/MermaidJS.Blazor/Internal/MermaidDiagramInterop.cs b/src/MermaidJS.Blazor/Internal/MermaidDiagramInterop.cs index f3c574d..159280e 100644 --- a/src/MermaidJS.Blazor/Internal/MermaidDiagramInterop.cs +++ b/src/MermaidJS.Blazor/Internal/MermaidDiagramInterop.cs @@ -1,20 +1,15 @@ -using System; -using System.Threading.Tasks; - -using Microsoft.Extensions.Options; +using Microsoft.Extensions.Options; using Microsoft.JSInterop; namespace MermaidJS.Blazor.Internal { internal class MermaidDiagramInterop { - private readonly IJSRuntime _jsRuntime; private readonly IOptionsSnapshot _mermaidOptions; private readonly Lazy> _jsModule; public MermaidDiagramInterop(IJSRuntime jsRuntime, IOptionsSnapshot mermaidOptions) { - _jsRuntime = jsRuntime; _mermaidOptions = mermaidOptions; _jsModule = new(() => jsRuntime.InvokeAsync("import", "./_content/MermaidJS.Blazor/MermaidDiagramInterop.js").AsTask()); } diff --git a/src/MermaidJS.Blazor/MermaidJS.Blazor.csproj b/src/MermaidJS.Blazor/MermaidJS.Blazor.csproj index 0e0588f..f9ffab7 100644 --- a/src/MermaidJS.Blazor/MermaidJS.Blazor.csproj +++ b/src/MermaidJS.Blazor/MermaidJS.Blazor.csproj @@ -1,8 +1,9 @@ - + - net5.0 + net7.0 enable + enable JoshJohnson, TrueCommercePSG TrueCommerce, Inc MermaidJS.Blazor @@ -17,7 +18,7 @@ - + diff --git a/src/MermaidJS.Blazor/MermaidOptions.cs b/src/MermaidJS.Blazor/MermaidOptions.cs index 5fbb58e..79664cd 100644 --- a/src/MermaidJS.Blazor/MermaidOptions.cs +++ b/src/MermaidJS.Blazor/MermaidOptions.cs @@ -1,7 +1,4 @@ -using System.Collections.Generic; -using System.Linq; - -namespace MermaidJS.Blazor +namespace MermaidJS.Blazor { /// /// Options used when initializing MermaidJS. @@ -39,7 +36,7 @@ public class MermaidOptions public string SecurityLevel { get; set; } = "strict"; /// - /// Dictates whether mermaind starts on Page load. + /// Dictates whether mermaid starts on Page load. /// public bool StartOnLoad { get; set; } = true; diff --git a/src/MermaidJS.Blazor/libman.json b/src/MermaidJS.Blazor/libman.json index 7a288e6..4171246 100644 --- a/src/MermaidJS.Blazor/libman.json +++ b/src/MermaidJS.Blazor/libman.json @@ -3,7 +3,7 @@ "defaultProvider": "cdnjs", "libraries": [ { - "library": "mermaid@8.13.2", + "library": "mermaid@10.3.0", "destination": "wwwroot/lib/mermaid" } ] diff --git a/src/MermaidJS.Blazor/wwwroot/MermaidDiagramInterop.js b/src/MermaidJS.Blazor/wwwroot/MermaidDiagramInterop.js index f2f6107..c4d40f8 100644 --- a/src/MermaidJS.Blazor/wwwroot/MermaidDiagramInterop.js +++ b/src/MermaidJS.Blazor/wwwroot/MermaidDiagramInterop.js @@ -9,7 +9,7 @@ script.async = false; script.defer = false; script.onload = () => { - window.mermaid.mermaidAPI.initialize(window.mermaidDiagramBlazorOptions); + window.mermaid.initialize(window.mermaidDiagramBlazorOptions); resolve(); }; @@ -52,14 +52,15 @@ export function beginRender(componentId, definition) { return; } + if (!definition) { + return; + } + try { - window.mermaid.mermaidAPI.render(`${componentId}-svg`, definition, (svg, bind) => { + mermaid.render(`${componentId}-svg`, definition).then(({ svg, bindFunctions }) => { const host = document.getElementById(componentId); - host.innerHTML = svg; - - bind(host); - + bindFunctions?.(host); componentRef.invokeMethodAsync("OnRenderCompleted"); }); }