feat(Mask): add AppendToBody parameter

src/BootstrapBlazor.Server/Components/Samples/Masks.razor.cs

@@ -1,4 +1,4 @@
-// Licensed to the .NET Foundation under one or more agreements.
+// Licensed to the .NET Foundation under one or more agreements.
 // The .NET Foundation licenses this file to you under the Apache 2.0 License
 // See the LICENSE file in the project root for more information.
 // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>10.5.1-beta01</Version>
+    <Version>10.5.1-beta04</Version>
   </PropertyGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Components/Mask/Mask.razor

@@ -1,4 +1,4 @@
-@namespace BootstrapBlazor.Components
+@namespace BootstrapBlazor.Components
 @inherits BootstrapModuleComponentBase
 @attribute [BootstrapModuleAutoLoader(AutoInvokeInit = false, AutoInvokeDispose = false)]
 

src/BootstrapBlazor/Components/Mask/Mask.razor.cs

@@ -47,7 +47,8 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
             {
                 Show = _options != null,
                 _options?.ContainerId,
-                _options?.Selector
+                _options?.Selector,
+                _options?.AppendToBody
             });
         }
     }
@@ -59,8 +60,20 @@ private Task Show(MaskOption? option)
         return Task.CompletedTask;
     }
 
-    private Task CloseAsync()
+    private Task CloseAsync() => Show(null);
+
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    /// <param name="disposing"></param>
+    /// <returns></returns>
+    protected override async ValueTask DisposeAsync(bool disposing)
     {
-        return Show(null);
+        await base.DisposeAsync(disposing);
+
+        if (disposing)
+        {
+            MaskService.UnRegister(this);
+        }
     }
 }

src/BootstrapBlazor/Components/Mask/Mask.razor.js

@@ -1,7 +1,7 @@
-export function update(id, options) {
+export function update(id, options) {
     const mask = document.getElementById(id);
     if (mask) {
-        const { show } = options;
+        const { show, appendToBody } = options;
         const el = document.querySelector(`[data-bb-mask="${id}"]`);
         const container = getContainerBySelector(options);
         if (container) {
@@ -14,7 +14,7 @@
                 container.appendChild(el);
             }
         }
-        else {
+        else if (appendToBody === true) {
             document.body.appendChild(el);
         }
 

src/BootstrapBlazor/Components/Mask/MaskOption.cs

@@ -46,4 +46,11 @@ public class MaskOption
     /// <para lang="en">Gets or sets Mask Parent Container Selector. Default null</para>
     /// </summary>
     public string? Selector { get; set; }
+
+    /// <summary>
+    /// <para lang="zh">获得/设置 是否将遮罩追加到 body 元素 默认 true</para>
+    /// <para lang="en">Gets or sets whether to append the mask to the body element. Default true</para>
+    /// <para>v<vesion>10.5.1</vesion></para>
+    /// </summary>
+    public bool AppendToBody { get; set; } = true;
 }