Merge branch 'hotfix/hotfix-v27.1.48' into ej2-824314-imgaeediotor

Author: gopi-jp

blazor-toc.html

@@ -0,0 +1,16 @@
+---
+title: Essential Studio for Blazor Weekly Nuget Release Release Notes  
+description: Essential Studio for Blazor Weekly Nuget Release Release Notes  
+platform: Blazor
+documentation: ug
+---
+
+# Essential Studio for Blazor  Release Notes  
+
+{% include release-info.html date="September 24, 2024"  version="v27.1.50" %} 
+
+{% directory path: _includes/release-notes/v27.1.50 %}
+
+{% include {{file.url}} %}
+
+{% enddirectory %}

blazor/Release-Notes/27.1.50.md

@@ -376,7 +376,7 @@ You can change the font style of the annotations with the font specific properti
         Diagram.Nodes[0].Annotations[0].Style.Bold = false;
         Diagram.Nodes[0].Annotations[0].Style.TextDecoration = TextDecoration.None;
         Diagram.Nodes[0].Annotations[0].Style.Color = "Red";
-        Diagram.EndUpdate();
+        Diagram.EndUpdateAsync();
     }
 }
 ```

blazor/diagram/annotations/appearance.md

@@ -133,7 +133,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
         connector.ID = RandomId();
         connector.SourcePoint = new DiagramPoint { X = 100, Y = 100 };
         connector.TargetPoint = new DiagramPoint { X = 200, Y = 100 };
-        await diagram.AddDiagramElements(new DiagramObjectCollection<NodeBase>() { connector });
+        await diagram.AddDiagramElementsAsync(new DiagramObjectCollection<NodeBase>() { connector });
 
     }
     internal string RandomId()
@@ -152,9 +152,9 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
 ![Clonning Node](../images/CloneConnector.gif)
 ## How to add connector with annotations at runtime
 
-You can add connector with annotation at runtime in the diagram component by using the [AddDiagramElements](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_AddDiagramElements_Syncfusion_Blazor_Diagram_DiagramObjectCollection_Syncfusion_Blazor_Diagram_NodeBase__) method.
+You can add connector with annotation at runtime in the diagram component by using the [AddDiagramElementsAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_AddDiagramElementsAsync_Syncfusion_Blazor_Diagram_DiagramObjectCollection_Syncfusion_Blazor_Diagram_NodeBase__) method.
 
-The following code explains how to add an connector with annotation  at runtime by using `AddDiagramElements` method.
+The following code explains how to add an connector with annotation  at runtime by using `AddDiagramElementsAsync` method.
 
 ```cshtml
 @using Syncfusion.Blazor.Diagram
@@ -200,7 +200,7 @@ The following code explains how to add an connector with annotation  at runtime
             },
         };
         NodeCollection.Add(NewConnector);
-       await Diagram.AddDiagramElements(NodeCollection);
+       await Diagram.AddDiagramElementsAsync(NodeCollection);
     }
 }
 ```
@@ -393,13 +393,13 @@ The following code example explains how to change the connector properties.
         Diagram.BeginUpdate();
         Diagram.Connectors[0].SourcePoint.X = 50;
         Diagram.Connectors[0].SourcePoint.Y = 50;
-        Diagram.EndUpdate();
+        Diagram.EndUpdateAsync();
     }
 }
 ```
 You can download a complete working sample from [GitHub](https://github.com/SyncfusionExamples/Blazor-Diagram-Examples/tree/master/UG-Samples/Connectors/ActionofConnectors/UpdateConnectorAtRunTime)
 
-N> BeginUpdate and EndUpdate methods allow you to stop the continuous update of control and resume it finally.
+N> BeginUpdate and EndUpdateAsync methods allow you to stop the continuous update of control and resume it finally.
 
 ## Connections
 

blazor/diagram/connectors/connectors.md

@@ -244,7 +244,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
 
 ![Avoid overlapping with bezier](../../../images/bezierOverlap.png)
 
-### How to customize Bezier Segment Thumb Shape 
+## How to customize Bezier Segment Thumb Shape 
 
 The Bezier connector can have multiple segments between the source and target points. By default, these segments are rendered as circles, but this can be customized either globally or for individual connectors using the [SegmentThumbSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SegmentThumbSettings.html) class.
 

blazor/diagram/connectors/segments/bezier/bezier.md

@@ -100,7 +100,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
 
 ![Editing Straight Segment in Blazor Diagram](../../images/blazor-diagram-edit-straight-segment.gif)
 
-### How to customize Straight Segment Thumb Shape 
+## How to customize Straight Segment Thumb Shape 
 
 The Straight connector can have multiple segments between the source and target points. By default, these segments are rendered as circles, but this can be customized either globally or for individual connectors using the [SegmentThumbSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SegmentThumbSettings.html) class.
 

blazor/diagram/connectors/segments/straight.md

@@ -236,7 +236,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
         (node4 as NodeGroup).Children = array;
         node4.OffsetX += 25;
         node4.OffsetY += 25;
-        await diagram.AddDiagramElements(new DiagramObjectCollection<NodeBase>() { node2, node3, node4 });
+        await diagram.AddDiagramElementsAsync(new DiagramObjectCollection<NodeBase>() { node2, node3, node4 });
     }
 
     internal string RandomId()
@@ -384,7 +384,7 @@ The following code illustrates how a node group is added at runtime.
 }
 ```
 You can download a complete working sample from [GitHub](https://github.com/SyncfusionExamples/Blazor-Diagram-Examples/tree/master/UG-Samples/Group/AddGroupAtRunTime)
-* Also, you can add the child to the node group through [AddChild](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_AddChild_Syncfusion_Blazor_Diagram_NodeGroup_Syncfusion_Blazor_Diagram_NodeBase_) method. The following code illustrates how to add child to the existing node group through AddChild method.
+* Also, you can add the child to the node group through [AddChildAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_AddChildAsync_Syncfusion_Blazor_Diagram_NodeGroup_Syncfusion_Blazor_Diagram_NodeBase_) method. The following code illustrates how to add child to the existing node group through AddChildAsync method.
 
 ```cshtml
 @using Syncfusion.Blazor.Diagram
@@ -466,7 +466,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
                 }
             }
         };
-        await diagram.AddChild(group as NodeGroup, node);
+        await diagram.AddChildAsync(group as NodeGroup, node);
     }
 }
 ```

blazor/diagram/group.md

@@ -50,11 +50,11 @@ To create a node, define the Node object and add it to the nodes collection of t
 ```
 You can download a complete working sample from [GitHub](https://github.com/SyncfusionExamples/Blazor-Diagram-Examples/tree/master/UG-Samples/Methods/AddMethod)
 
-## How to add nodes through AddDiagramElements
+## How to add nodes through AddDiagramElementsAsync
 
- Unlike the Add() method, the [AddDiagramElements](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_AddDiagramElements_Syncfusion_Blazor_Diagram_DiagramObjectCollection_Syncfusion_Blazor_Diagram_NodeBase__) method will measure the passed elements before re-rendering the complete diagram component at once. When using the Add() method to add multiple nodes and connectors simultaneously, the connectors will be rendered before the nodes. As a result, connectors may be misplaced due to the synchronous behavior of the Add method. To overcome this, use the asynchronous AddDiagramElements() method.
+ Unlike the Add() method, the [AddDiagramElementsAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_AddDiagramElementsAsync_Syncfusion_Blazor_Diagram_DiagramObjectCollection_Syncfusion_Blazor_Diagram_NodeBase__) method will measure the passed elements before re-rendering the complete diagram component at once. When using the Add() method to add multiple nodes and connectors simultaneously, the connectors will be rendered before the nodes. As a result, connectors may be misplaced due to the synchronous behavior of the Add method. To overcome this, use the asynchronous AddDiagramElementsAsync() method.
 
-* AddDiagramElements() method is a preferred way to add a collection of items to the diagram to get better performance compared to Add() method.
+* AddDiagramElementsAsync() method is a preferred way to add a collection of items to the diagram to get better performance compared to Add() method.
 
 ```cshtml
 @using Syncfusion.Blazor.Diagram
@@ -147,7 +147,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
         NodeCollection.Add(node1);
         NodeCollection.Add(node2);
         NodeCollection.Add(Connector);
-        await Diagram.AddDiagramElements(NodeCollection);
+        await Diagram.AddDiagramElementsAsync(NodeCollection);
     }
 }
 ```
@@ -958,8 +958,8 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
  ```
 You can download a complete working sample from [GitHub](https://github.com/SyncfusionExamples/Blazor-Diagram-Examples/tree/master/UG-Samples/Methods/GetCustomCursor)
 
-## How to use the BeginUpdate and EndUpdate
- [BeginUpdate](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_BeginUpdate) prevents visual updates to the diagram until the EndUpdate() method is called. [EndUpdate](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_EndUpdate) means that the diagram is unlocked following a call to the BeginUpdate(Boolean) method, resulting in an immediate visual update.
+## How to use the BeginUpdate and EndUpdateAsync
+ [BeginUpdate](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_BeginUpdate) prevents visual updates to the diagram until the EndUpdateAsync() method is called. [EndUpdateAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_EndUpdateAsync) means that the diagram is unlocked following a call to the BeginUpdate(Boolean) method, resulting in an immediate visual update.
 
 ```cshtml
 @using Syncfusion.Blazor.Diagram
@@ -1032,7 +1032,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
         diagram.BeginUpdate();
         diagram.Nodes[0].Height = 150;
         diagram.Nodes[0].Width = 150;
-        diagram.EndUpdate();
+        diagram.EndUpdateAsync();
 
     }
 }
@@ -1305,7 +1305,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
             {
                 sfDiagram.EndGroupAction();
             }
-            _ = sfDiagram.EndUpdate();
+            _ = sfDiagram.EndUpdateAsync();
             base.OnMouseUp(args);
             this.InAction = true;
         }
@@ -1525,7 +1525,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
 You can download a complete working sample from [GitHub](https://github.com/SyncfusionExamples/Blazor-Diagram-Examples/tree/master/UG-Samples/Methods/ZoomAndPan)
 
 ## How to refresh the datasource
- [RefreshDataSource](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_RefreshDataSource) will refresh the layout based on the changes in the data source.
+ [RefreshDataSourceAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Diagram.SfDiagramComponent.html#Syncfusion_Blazor_Diagram_SfDiagramComponent_RefreshDataSourceAsync) will refresh the layout based on the changes in the data source.
 
 ```cshtml
 @using Syncfusion.Blazor.Diagram
@@ -1599,7 +1599,7 @@ You can download a complete working sample from [GitHub](https://github.com/Sync
         new MindMapDetails() { Id= "4",  Label="Sessions", ParentId ="2", Branch = "subRight" },
         new MindMapDetails() { Id= "5",  Label="Complementing", ParentId ="2", Branch = "subRight" },
         };
-        await Diagram.RefreshDataSource();
+        await Diagram.RefreshDataSourceAsync();
     }
 }
 ```

blazor/diagram/how-to.md

@@ -251,7 +251,7 @@ Clone is a virtual method of the node that is used to create a copy of a diagram
             groupNode.OffsetX += 25;
             groupNode.OffsetY += 25;
         }
-        diagram.AddDiagramElements(new DiagramObjectCollection<NodeBase>() { groupNode });
+        diagram.AddDiagramElementsAsync(new DiagramObjectCollection<NodeBase>() { groupNode });
         return groupNode.ID;
     }
     public string CloneNode(Node node, bool isChild)
@@ -264,7 +264,7 @@ Clone is a virtual method of the node that is used to create a copy of a diagram
             nodeChild.OffsetX += 25;
             nodeChild.OffsetY += 25;
         }
-        diagram.AddDiagramElements(new DiagramObjectCollection<NodeBase>() { nodeChild });
+        diagram.AddDiagramElementsAsync(new DiagramObjectCollection<NodeBase>() { nodeChild });
         diagram.EndGroupAction();
         return nodeChild.ID;
     }
@@ -278,7 +278,7 @@ Clone is a virtual method of the node that is used to create a copy of a diagram
             connectorChild.SourcePoint = new DiagramPoint() { X = connectorChild.SourcePoint.X + 25, Y = connectorChild.SourcePoint.Y + 25 };
             connectorChild.TargetPoint = new DiagramPoint() { X = connectorChild.TargetPoint.X + 25, Y = connectorChild.TargetPoint.Y + 25 };
         }
-        diagram.AddDiagramElements(new DiagramObjectCollection<NodeBase>() { connectorChild });
+        diagram.AddDiagramElementsAsync(new DiagramObjectCollection<NodeBase>() { connectorChild });
         diagram.EndGroupAction();
         return connectorChild.ID;
     }

blazor/diagram/interaction.md

@@ -196,7 +196,7 @@ public void UpdateSpacing()
     Diagram.BeginUpdate();
     HorizontalSpacing += 10;
     VerticalSpacing += 10;
-    Diagram.EndUpdate();
+    Diagram.EndUpdateAsync();
 }
 ```
 
@@ -221,7 +221,7 @@ public void UpdateMargin()
     Diagram.BeginUpdate();
     left += 10;
     top += 10;
-    Diagram.EndUpdate();
+    Diagram.EndUpdateAsync();
 }
 ```