fix(Blazor.Dagre): added the possibility to provide custom controls t…

…emplate Signed-off-by: Jean-Baptiste Bianchi <jb.bianchi@neuroglia.io>
neuroglia-io · Sep 10, 2024 · a1bc44e · a1bc44e
1 parent d8bd3db
commit a1bc44e
Showing 1 changed file with 48 additions and 15 deletions.
diff --git a/src/Neuroglia.Blazor.Dagre/DagreGraph.razor b/src/Neuroglia.Blazor.Dagre/DagreGraph.razor
@@ -95,21 +95,48 @@
             {
                 @ExtraControls
             }
-            <button class="btn" type="button" @onclick="CenterAsync" title="center graph">
-                <svg>
-                    <use href="#center-target" />
-                </svg>
-            </button>
-            <button class="btn" type="button" @onclick="ZoomToFitAsync" title="zoom to fit">
-                <svg>
-                    <use href="#fit" />
-                </svg>
-            </button>
-            <button class="btn" type="button" @onclick="SaveAsPngAsync" title="save as png">
-                <svg>
-                    <use href="#save" />
-                </svg>
-            </button>
+            @if (CenterControl != null)
+            {
+                <CascadingValue Value="CenterAsync" Name="CenterAsync">
+                    @CenterControl
+                </CascadingValue>
+            }
+            else
+            {
+                <button class="btn" type="button" @onclick="CenterAsync" title="Center graph">
+                    <svg>
+                        <use href="#center-target" />
+                    </svg>
+                </button>
+            }
+            @if (ZoomToFitControl != null)
+            {
+                <CascadingValue Value="ZoomToFitAsync" Name="ZoomToFitAsync">
+                    @ZoomToFitControl
+                </CascadingValue>
+            }
+            else
+            {
+                <button class="btn" type="button" @onclick="ZoomToFitAsync" title="Zoom to fit">
+                    <svg>
+                        <use href="#fit" />
+                    </svg>
+                </button>
+            }
+            @if (SaveAsPngControl != null)
+            {
+                <CascadingValue Value="SaveAsPngAsync" Name="SaveAsPngAsync">
+                    @SaveAsPngControl
+                </CascadingValue>
+            }
+            else
+            {
+                <button class="btn" type="button" @onclick="SaveAsPngAsync" title="Save as png">
+                    <svg>
+                        <use href="#save" />
+                    </svg>
+                </button>
+            }
             <!--<button class="btn" type="button" @onclick="ToggleOrientationAsync" title="toggle orientation">
                 <svg>
                     <use href="#toggle-orientation" />
@@ -138,6 +165,12 @@
 
     [Parameter] public EventCallback<GraphEventArgs<WheelEventArgs>> OnWheel { get; set; }
 
+    [Parameter] public RenderFragment? CenterControl { get; set; }
+
+    [Parameter] public RenderFragment? ZoomToFitControl { get; set; }
+
+    [Parameter] public RenderFragment? SaveAsPngControl { get; set; }
+
     [Parameter] public RenderFragment? ExtraControls { get; set; }
 
     ElementReference graphReference;