Merge pull request #27 from stavroskasidis/release/4.0.0

Version 4.0: Add closing by keyboard key press (escape by default).
stavroskasidis · Oct 24, 2024 · 4e45a71 · 4e45a71
2 parents 495f438 + 27b80d4
commit 4e45a71
Show file tree

Hide file tree

Showing 13 changed files with 3,929 additions and 2,692 deletions.
diff --git a/.gitignore b/.gitignore
@@ -264,3 +264,4 @@ __pycache__/
 /Artifacts/
 /DemoApp/BlazorDialog.DemoApp/Server/ClientSources/
 /BlazorDialog/wwwroot/styles.min.css
+/BlazorDialog/wwwroot/blazordialog.min.js
diff --git a/BlazorDialog/BlazorDialog.csproj b/BlazorDialog/BlazorDialog.csproj
@@ -12,7 +12,7 @@
     <Copyright />
     <PackageTags>blazor blazor-component blazor-dialog dialog modal blazor-modal blazordialog blazormodaldialog blazormodal razor razor-components razorcomponents</PackageTags>
     <VersionSuffix>$(VersionSuffix)</VersionSuffix>
-    <Version>3.2.0</Version>
+    <Version>4.0.0</Version>
     <Version Condition=" '$(VersionSuffix)' != '' ">$(Version)-$(VersionSuffix)</Version>
     <Product>BlazorDialog</Product>
   </PropertyGroup>

diff --git a/BlazorDialog/Components/ComponentAsDialogContainer.razor b/BlazorDialog/Components/ComponentAsDialogContainer.razor
@@ -8,7 +8,8 @@
                 OnAfterRender="EventUtil.AsNonRenderingEventCallback((bool firstLoad) => OnAfterDialogRender(firstLoad))"
                 OnAfterHide="ComponentDialog.Options.OnAfterHide" OnAfterShow="ComponentDialog.Options.OnAfterShow"
                 OnBeforeHide="ComponentDialog.Options.OnBeforeHide" OnBeforeShow="ComponentDialog.Options.OnBeforeShow"
-                PreventNavigation="ComponentDialog.Options.PreventNavigation">
+                PreventNavigation="ComponentDialog.Options.PreventNavigation" KeyboardCloseEnabled="ComponentDialog.Options.KeyboardCloseEnabled"
+                KeyboardCloseKey="@ComponentDialog.Options.KeyboardCloseKey">
             <DynamicComponent Type="ComponentDialog.Options.ComponentType" Parameters="ComponentDialog.Options.Parameters"></DynamicComponent>
         </Dialog>
     }
@@ -18,7 +19,8 @@
                 OnAfterRender="EventUtil.AsNonRenderingEventCallback((bool firstLoad) => OnAfterDialogRender(firstLoad))"
                 OnAfterHide="ComponentDialog.Options.OnAfterHide" OnAfterShow="ComponentDialog.Options.OnAfterShow"
                 OnBeforeHide="ComponentDialog.Options.OnBeforeHide" OnBeforeShow="ComponentDialog.Options.OnBeforeShow"
-                PreventNavigation="ComponentDialog.Options.PreventNavigation">
+                PreventNavigation="ComponentDialog.Options.PreventNavigation" KeyboardCloseEnabled="ComponentDialog.Options.KeyboardCloseEnabled"
+                KeyboardCloseKey="@ComponentDialog.Options.KeyboardCloseKey">
             <DynamicComponent Type="ComponentDialog.Options.ComponentType" Parameters="ComponentDialog.Options.Parameters"></DynamicComponent>
         </Dialog>
     }

diff --git a/BlazorDialog/Components/Dialog.razor b/BlazorDialog/Components/Dialog.razor
@@ -3,6 +3,7 @@
 @namespace BlazorDialog
 @implements IDisposable
 @inject ILocationChangingHandler locationChangingHandler
+@inject IJSRuntime jsRuntime
 @if (isShowing)
 {
     <CascadingValue Value="this" Name="ParentDialog" IsFixed="true">
@@ -105,9 +106,22 @@
     /// </summary>
     [Parameter] public bool PreventNavigation { get; set; } = true;
 
+    /// <summary>
+    /// If enabled the dialog can be close by a keyboard key (default "Escape"). Defaults to true.
+    /// </summary>
+    [Parameter] public bool KeyboardCloseEnabled { get; set; } = true;
+
+    /// <summary>
+    /// The key to be used when <see cref="KeyboardCloseEnabled"/> is set to true. Default to "Escape".
+    /// </summary>
+    [Parameter] public string KeyboardCloseKey { get; set; } = "Escape";
+
+
     private bool? _forcedPreventNavigation;
     protected TaskCompletionSource<object> taskCompletionSource;
     internal Action<object> OnDialogHide;
+    private DotNetObjectReference<Dialog>? dotNetObjectReference;
+
     protected void NotifyDialogHidden(object result) => OnDialogHide?.Invoke(result);
 
     protected string ContentWrapperCssClass
@@ -168,6 +182,7 @@
                 taskCompletionSource.SetResult(result);
             }
         };
+        dotNetObjectReference = DotNetObjectReference.Create(this);
     }
 
     public override async Task SetParametersAsync(ParameterView parameters)
@@ -196,6 +211,8 @@
             }
 
             locationChangingHandler.RegisterLocationChangingHandler(this);
+
+            await jsRuntime.InvokeVoidAsync("blazorDialog.registerShownDialog", dotNetObjectReference, this.KeyboardCloseEnabled, this.KeyboardCloseKey);
         }
         else if (isShowingChanged && IsShowing == false && isShowing)
         {
@@ -211,6 +228,8 @@
                 var args = new DialogAfterHideEventArgs(this);
                 await OnAfterHide.InvokeAsync(args);
             }
+
+            await jsRuntime.InvokeVoidAsync("blazorDialog.unregisterShownDialog", dotNetObjectReference);
         }
     }
 
@@ -223,6 +242,11 @@
             taskCompletionSource.TrySetCanceled();
             taskCompletionSource = null;
         }
+        if (dotNetObjectReference != null)
+        {
+            dotNetObjectReference.Dispose();
+            dotNetObjectReference = null;
+        }
     }
 
     public async Task Show()
@@ -272,6 +296,8 @@
 
         locationChangingHandler.RegisterLocationChangingHandler(this);
 
+        await jsRuntime.InvokeVoidAsync("blazorDialog.registerShownDialog", dotNetObjectReference, this.KeyboardCloseEnabled, this.KeyboardCloseKey);
+
         taskCompletionSource = new TaskCompletionSource<object>();
         return await taskCompletionSource.Task;
     }
@@ -293,6 +319,8 @@
             var args = new DialogAfterHideEventArgs(this);
             await OnAfterHide.InvokeAsync(args);
         }
+
+        await jsRuntime.InvokeVoidAsync("blazorDialog.unregisterShownDialog", dotNetObjectReference);
     }
 
     public async Task Hide()
@@ -335,4 +363,10 @@
         }
         return base.OnAfterRenderAsync(firstRender);
     }
+
+    [JSInvokable]
+    public async Task HideFromKeyPress()
+    {
+        await this.Hide();
+    }
 }
diff --git a/BlazorDialog/IBlazorDialogStore.cs b/BlazorDialog/IBlazorDialogStore.cs
@@ -78,6 +78,16 @@ public ComponentAsDialogOptions(Type componentType)
         /// </summary>
         public Func<DialogAfterHideEventArgs, Task>? OnAfterHide { get; protected set; }
 
+        /// <summary>
+        /// If enabled the dialog can be close by a keyboard key (default "Escape"). Defaults to true.
+        /// </summary>
+        public bool KeyboardCloseEnabled { get; set; } = true;
+
+        /// <summary>
+        /// The key to be used when <see cref="KeyboardCloseEnabled"/> is set to true. Default to "Escape".
+        /// </summary>
+        public string KeyboardCloseKey { get; set; } = "Escape";
+
         public Func<bool, Task>? OnAfterRender { get; protected set; }
 
         internal event Func<Task> OnOptionsChanged;

diff --git a/BlazorDialog/gulpfile.js b/BlazorDialog/gulpfile.js
@@ -5,9 +5,9 @@
     rimraf = require("rimraf");
 
 
-// gulp.task("clean:js", function (cb) {
-    // rimraf("wwwroot/**/*.min.js", cb);
-// });
+ gulp.task("clean:js", function (cb) {
+     rimraf("wwwroot/**/*.min.js", cb);
+ });
 
 gulp.task("clean:css", function (cb) {
     rimraf("wwwroot/**/*.min.css", cb);
@@ -22,15 +22,15 @@ gulp.task("min:css", function () {
         .pipe(gulp.dest("."));
 });
 
-// gulp.task("min:js", function () {
-    // return gulp.src(["wwwroot/**/*.js", "!wwwroot/**/*.min.js"], { base: "." })
-        // .pipe(uglify())
-        // .pipe(rename({
-            // suffix: ".min"
-        // }))
-        // .pipe(gulp.dest("."));
-// });
+gulp.task("min:js", function () {
+    return gulp.src(["wwwroot/**/*.js", "!wwwroot/**/*.min.js"], { base: "." })
+        .pipe(uglify())
+        .pipe(rename({
+            suffix: ".min"
+        }))
+        .pipe(gulp.dest("."));
+});
 
-gulp.task("clean", gulp.parallel( /* "clean:js",*/ "clean:css"));
-gulp.task("min",  gulp.parallel(/* "min:js" ,*/ "min:css"));
+gulp.task("clean", gulp.parallel( "clean:js", "clean:css"));
+gulp.task("min",  gulp.parallel("min:js" , "min:css"));
 gulp.task("all", gulp.series("clean", "min"));