Feature/update nuget to 1 2 3 (#175)

## Target
<!--
  Why are you making this change?
 -->

#### Open Questions
<!-- OPTIONAL
- [ ] Use the GitHub checklists to spark discussion on issues that may
arise from your approach. Please tick the box and explain your answer.
-->

## Checklist
<!--
It serves as a gentle reminder for common tasks. Confirm it's done and
check everything that applies.
-->
- [x] Documentation updated
- [x] Tests cover new or modified code
- [x] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [x] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] New dependencies added
- [ ] Includes breaking changes
- [x] Version bumped

## Visuals
<!-- OPTIONAL
Show results both before and after this change. When the output changes,
it can be a screenshot of a trace, metric, or log illustrating the
change.
-->

---------

Co-authored-by: ColdForeign <[email protected]>
Co-authored-by: George Radchuk <[email protected]>

.github/dependabot.yml

@@ -4,4 +4,4 @@ updates:
     directory: "/src/Cropper.Blazor"
     target-branch: "dev" # Location of package manifests
     schedule:
-      interval: "weekly"
+      interval: "monthly"

README.md

@@ -21,9 +21,11 @@
 - [CropperBlazor.github.io/demo](https://CropperBlazor.github.io/demo)
 
 ## Prerequisites
-- Supported .NET versions
-  - [.NET 7.0](https://dotnet.microsoft.com/download/dotnet/7.0) for versions greater than v1.1.0
-  - [.NET 6.0](https://dotnet.microsoft.com/download/dotnet/6.0) for v1.0.x
+- Supported .NET 7.0, .NET 6.0 versions for these web platforms:
+  - Blazor WebAssembly
+  - Blazor Server
+  - Blazor Server Hybrid with MVC
+  - MAUI Blazor Hybrid
 
 ## Installation
 

src/Cropper.Blazor/Client/.config/dotnet-tools.json

@@ -3,7 +3,7 @@
   "isRoot": true,
   "tools": {
     "excubo.webcompiler": {
-      "version": "3.5.20",
+      "version": "3.5.54",
       "commands": [
         "webcompiler"
       ]

src/Cropper.Blazor/Client/Components/Docs/SectionContent.razor

@@ -14,20 +14,31 @@
         @if (Codes != null || ChildContent != null)
         {
             <MudToolBar Class="@ToolbarClassname">
+                <MudButtonGroup Color="Color.Primary" Class="mud-width-full" Variant="Variant.Outlined" VerticalAlign="IsVerticalAlign">
                 @if(Codes != null)
                 {
                     @foreach (var codefile in Codes)
                     {
-                        <MudButton Class="@GetActiveCode(codefile.code)" OnClick="@(() => SetActiveCode(codefile.code))" Size="Size.Small">@codefile.title</MudButton>
+                        <MudButton
+                            Class="@GetActiveCode(codefile.code)"
+                            OnClick="@(() => SetActiveCode(codefile.code))"
+                            Style="word-break: break-word;"
+                            Size="Size.Small">
+                                @codefile.title
+                        </MudButton>
                     }
                 }
                 <MudSpacer/>
                 @if (HasCode && ChildContent != null)
                 {
-                    <MudButton OnClick="OnShowCode" StartIcon="@(ShowCode ? @Icons.Material.Rounded.CodeOff : Icons.Material.Rounded.Code)" Color="Color.Default" Size="Size.Small">
-                        @(ShowCode ? "Hide code" : "Show code")
+                    <MudButton OnClick="OnShowCode"
+                        StartIcon="@(ShowCode ? @Icons.Material.Rounded.CodeOff : Icons.Material.Rounded.Code)"
+                        Color="Color.Default"
+                        Size="Size.Small">
+                            @(ShowCode ? "Hide code" : "Show code")
                     </MudButton>
                 }
+                </MudButtonGroup>
             </MudToolBar>
         }
         @if (ChildContent != null)
@@ -44,6 +55,11 @@
         <div class="docs-section-source-container">
             @CodeComponent(ActiveCode)
         </div>
-        <MudIconButton Icon="@Icons.Material.Outlined.FileCopy" Size="Size.Small" Class="copy-code-button" @onclick="CopyTextToClipboard" />
+        <MudIconButton
+            Icon="@Icons.Material.Outlined.FileCopy"
+            Size="Size.Medium"
+            Color="Color.Error"
+            Class="copy-code-button"
+            @onclick="CopyTextToClipboardAsync" />
     </div>
 }

src/Cropper.Blazor/Client/Components/Docs/SectionContent.razor.cs

@@ -2,13 +2,15 @@
 using Cropper.Blazor.Client.Models;
 using Microsoft.AspNetCore.Components;
 using MudBlazor;
+using MudBlazor.Services;
 using MudBlazor.Utilities;
 
 namespace Cropper.Blazor.Client.Components.Docs;
 
 public partial class SectionContent
 {
     [Inject] protected IJsApiService? JsApiService { get; set; }
+    [Inject] IBreakpointService BreakpointService { get; set; } = null!;
 
     protected string Classname =>
         new CssBuilder("docs-section-content")
@@ -17,6 +19,7 @@ public partial class SectionContent
             .AddClass("show-code", HasCode && ShowCode)
             .AddClass(Class)
             .Build();
+
     protected string ToolbarClassname =>
         new CssBuilder("docs-section-content-toolbar")
             .AddClass($"outlined", Outlined && ChildContent != null)
@@ -50,7 +53,9 @@ public partial class SectionContent
     [Parameter] public RenderFragment ChildContent { get; set; }
 
     private bool HasCode;
-    private string ActiveCode;
+    public string ActiveCode;
+
+    private bool IsVerticalAlign = false;
 
     protected override void OnParametersSet()
     {
@@ -59,13 +64,27 @@ protected override void OnParametersSet()
             HasCode = true;
             ActiveCode = Codes.FirstOrDefault().code;
         }
-        else if (!String.IsNullOrWhiteSpace(Code))
+        else if (!string.IsNullOrWhiteSpace(Code))
         {
             HasCode = true;
             ActiveCode = Code;
         }
     }
 
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            await BreakpointService!.SubscribeAsync((br) =>
+            {
+                IsVerticalAlign = BreakpointService!.IsMediaSize(br, Breakpoint.Xs);
+                InvokeAsync(StateHasChanged);
+            });
+        }
+
+        await base.OnAfterRenderAsync(firstRender);
+    }
+
     public void OnShowCode()
     {
         ShowCode = !ShowCode;
@@ -88,9 +107,9 @@ private string GetActiveCode(string value)
         }
     }
 
-    private async Task CopyTextToClipboard()
+    private async Task CopyTextToClipboardAsync()
     {
-        await JsApiService.CopyToClipboardAsync(Snippets.GetCode(string.IsNullOrWhiteSpace(Code) ? ActiveCode : Code));
+        await JsApiService!.CopyToClipboardAsync(Snippets.GetCode(string.IsNullOrWhiteSpace(Code) ? ActiveCode : Code));
     }
 
     RenderFragment CodeComponent(string code) => builder =>

src/Cropper.Blazor/Client/Cropper.Blazor.Client.csproj

@@ -31,7 +31,7 @@
     <PackageReference Include="Microsoft.AspNetCore.WebUtilities" Version="2.2.0" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="7.0.8" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="7.0.8" PrivateAssets="all" />
-    <PackageReference Include="MudBlazor" Version="6.4.1" />
+    <PackageReference Include="MudBlazor" Version="6.7.0" />
     <PackageReference Include="Blazored.LocalStorage" Version="4.3.0" />
   </ItemGroup>
 
@@ -105,6 +105,7 @@
 			<FilesToClean Include="./wwwroot/jsObjectModule.min.js" />
 			<FilesToClean Include="./Models/Snippets.generated.cs" />
 			<FilesToClean Include="./wwwroot/helper.min.js" />
+			<FilesToClean Include="./wwwroot/sw-registrator.min.js" />
 		</ItemGroup>
 		<Delete Files="@(FilesToClean)" />
 	</Target>
@@ -123,6 +124,7 @@
 		<Exec Command="dotnet webcompiler ./wwwroot/overrideCropperJsInteropModule.js -c excubowebcompiler.json" StandardOutputImportance="high" StandardErrorImportance="high" />
 		<Exec Command="dotnet webcompiler ./wwwroot/jsObjectModule.js -c excubowebcompiler.json" StandardOutputImportance="high" StandardErrorImportance="high" />
 		<Exec Command="dotnet webcompiler ./wwwroot/helper.js -c excubowebcompiler.json" StandardOutputImportance="high" StandardErrorImportance="high" />
+		<Exec Command="dotnet webcompiler ./wwwroot/sw-registrator.js -c excubowebcompiler.json" StandardOutputImportance="high" StandardErrorImportance="high" />
 	</Target>
 
 	<Target Name="IncludeGeneratedStaticFiles" DependsOnTargets="WebCompiler">
@@ -132,13 +134,15 @@
 		<Error Condition="!Exists('wwwroot/overrideCropperJsInteropModule.min.js')" Text="Missing overrideCropperJsInteropModule.min.js in wwwroot" />
 		<Error Condition="!Exists('wwwroot/jsObjectModule.min.js')" Text="Missing jsObjectModule.min.js in wwwroot" />
 		<Error Condition="!Exists('wwwroot/helper.min.js')" Text="Missing helper.min.js in wwwroot" />
+		<Error Condition="!Exists('wwwroot/sw-registrator.min.js')" Text="Missing sw-registrator.min.js in wwwroot" />
 		<ItemGroup>
 			<Content Include="wwwroot/Cropper.Blazor.Client.min.css" Condition="!Exists('wwwroot/Cropper.Blazor.Client.min.css')" />
 			<Content Include="wwwroot/service-worker.min.js" Condition="!Exists('wwwroot/service-worker.min.js')" />
 			<Content Include="wwwroot/service-worker.published.min.js" Condition="!Exists('wwwroot/service-worker.published.min.js')" />
 			<Content Include="wwwroot/overrideCropperJsInteropModule.min.js" Condition="!Exists('wwwroot/overrideCropperJsInteropModule.min.js')" />
 			<Content Include="wwwroot/jsObjectModule.min.js" Condition="!Exists('wwwroot/jsObjectModule.min.js')" />
 			<Content Include="wwwroot/helper.min.js" Condition="!Exists('wwwroot/helper.min.js')" />
+			<Content Include="wwwroot/sw-registrator.min.js" Condition="!Exists('wwwroot/sw-registrator.min.js')" />
 		</ItemGroup>
 	</Target>
 

src/Cropper.Blazor/Client/Enums/CropperFace.cs

@@ -0,0 +1,11 @@
+namespace Cropper.Blazor.Client.Enums
+{
+    public enum CropperFace
+    {
+        Default,
+        Close,
+        Pentagon,
+        Circle,
+        Arrow
+    }
+}

src/Cropper.Blazor/Client/Extensions/DocsVeiewExtension.cs

@@ -11,13 +11,13 @@ public static void TryAddDocsViewServices(this IServiceCollection services)
     {
         services.AddMudServices(config =>
         {
-            config.SnackbarConfiguration.PositionClass = Defaults.Classes.Position.BottomLeft;
+            config.SnackbarConfiguration.PositionClass = Defaults.Classes.Position.BottomRight;
             config.SnackbarConfiguration.PreventDuplicates = false;
             config.SnackbarConfiguration.NewestOnTop = false;
             config.SnackbarConfiguration.ShowCloseIcon = true;
             config.SnackbarConfiguration.VisibleStateDuration = 10000;
-            config.SnackbarConfiguration.HideTransitionDuration = 500;
-            config.SnackbarConfiguration.ShowTransitionDuration = 500;
+            config.SnackbarConfiguration.HideTransitionDuration = 200;
+            config.SnackbarConfiguration.ShowTransitionDuration = 100;
             config.SnackbarConfiguration.SnackbarVariant = Variant.Filled;
         });