Merge pull request #7112 from syncfusion-content/986121-ie3

986121- IE Blazor UG correction based on shared prompt

Author: Gowrimathi

blazor/image-editor/how-to/clear-image.md

@@ -1,15 +1,15 @@
 ---
 layout: post
 title: Clear an Image with Blazor Image Editor Component | Syncfusion
-description: Learn here all about Clear an Image in Blazor Image Editor component in Blazor Server App and Blazor WebAssembly App.
+description: Learn how to clear an image in the Blazor Image Editor component for Blazor Server and WebAssembly applications.
 platform: Blazor
 control: Image Editor
 documentation: ug
 ---
 
 # Clear an Image in the Blazor Image Editor component
 
-The [`ClearImageAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.SfImageEditor.html#Syncfusion_Blazor_ImageEditor_SfImageEditor_ClearImageAsync) method in the image editor control is indeed useful for scenarios where you need to ensure that the image editor is emptied before reopening it, especially if the editor is used within a dialog. By using `ClearImageAsync` before closing the dialog, you can ensure that the editor does not retain the previously loaded image when the dialog is reopened. This allows users to start fresh with a new image selection.
+The [ClearImageAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.SfImageEditor.html#Syncfusion_Blazor_ImageEditor_SfImageEditor_ClearImageAsync) method clears the current image from the editor. This is useful when the component is rendered in a dialog: calling `ClearImageAsync` before closing the dialog prevents the previously loaded image from persisting when the dialog is reopened, ensuring a fresh state for a new selection.
 
 ```cshtml
 @using Syncfusion.Blazor.ImageEditor
@@ -37,4 +37,4 @@ The [`ClearImageAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.
 }
 ```
 
-![Blazor Image Editor with Resize the custom selection](../images/blazor-image-editor-clear-image.jpg)
+![Blazor Image Editor clearing the image](../images/blazor-image-editor-clear-image.jpg)

blazor/image-editor/how-to/render-dialog.md

@@ -1,15 +1,15 @@
 ---
 layout: post
-title: Clear an Image with Blazor Image Editor Component | Syncfusion
-description: Learn here all about Clear an Image in Blazor Image Editor component in Blazor Server App and Blazor WebAssembly App.
+title: Render Image Editor in a Dialog Component | Syncfusion
+description: Render the Blazor Image Editor in a modal dialog for a focused, space-saving editing experience in Blazor Server and WebAssembly applications.
 platform: Blazor
 control: Image Editor
 documentation: ug
 ---
 
 # Render Image Editor in Dialog Component
 
-Rendering the Image Editor in a dialog involves displaying the image editor component within a modal dialog window, allowing users to edit images in a pop-up interface. This can be useful for maintaining a clean layout and providing a focused editing experience without navigating away from the current page.
+Rendering the Image Editor in a dialog displays the component within a modal window, enabling image editing in a pop-up interface. This approach helps maintain a clean layout and provides a focused editing experience without navigating away from the current page.
 
 ```cshtml
 @using Syncfusion.Blazor.ImageEditor
@@ -23,44 +23,45 @@ Rendering the Image Editor in a dialog involves displaying the image editor comp
         <SfButton OnClick="OpenDialogAsync">Open Image</SfButton>
     }
 </div>
- <SfDialog Height="75%" Width="435px" Target="#target" ShowCloseIcon="true" @bind-Visible="Visibility">
+
+<SfDialog MinHeight="400px" Width="340px" Target="#target" ShowCloseIcon="true" @bind-Visible="Visibility">
     <DialogTemplates>
         <Content>
             <div class="dialogContent">
-                <SfImageEditor @ref="ImageEditor" Height="400px">
+                <SfImageEditor @ref="ImageEditor" Height="300px">
                 </SfImageEditor>
             </div>
         </Content>
     </DialogTemplates>
     <DialogEvents OnOpen="@BeforeDialogOpen" Opened="OpenAsync" Closed="@DialogClosed"></DialogEvents>
-
 </SfDialog>
 
 @code {
     private bool Visibility { get; set; } = false;
     private bool ShowButton { get; set; } = true;
-    SfImageEditor ImageEditor; 
+    SfImageEditor ImageEditor;
 
-    private async void OpenDialogAsync() 
-    { 
+    private void OpenDialogAsync()
+    {
         this.Visibility = true;
     }
 
-    private async void OpenAsync() 
-    { 
-        await ImageEditor.OpenAsync("https://ej2.syncfusion.com/react/demos/src/image-editor/images/bridge.png"); 
+    private async void OpenAsync()
+    {
+        await ImageEditor.OpenAsync("https://ej2.syncfusion.com/react/demos/src/image-editor/images/bridge.png");
+        ImageEditor.RefreshAsync();
     }
 
-    private void BeforeDialogOpen(BeforeOpenEventArgs args)
+    private void BeforeDialogOpen(Syncfusion.Blazor.Popups.BeforeOpenEventArgs args)
     {
         this.ShowButton = false;
     }
 
-    private void DialogClosed(CloseEventArgs args)
+    private void DialogClosed(Syncfusion.Blazor.Popups.CloseEventArgs args)
     {
         this.ShowButton = true;
     }
 }
 ```
 
-![Blazor Image Editor with Resize the custom selection](../images/blazor-image-editor-dialog.jpg)
+![Blazor Image Editor rendered in a dialog](../images/blazor-image-editor-dialog.jpg)

blazor/image-editor/how-to/reset.md

@@ -1,14 +1,14 @@
 ---
 layout: post
-title: Reset an Image with Blazor Image Editor Component | Syncfusion
-description: Learn here all about Reset an image in Blazor Image Editor component in Blazor Server App and Blazor WebAssembly App.
+title: Reset an image in the Blazor Image Editor | Syncfusion
+description: Learn how to reset an image in the Blazor Image Editor component for Blazor Server and WebAssembly applications.
 platform: Blazor
 control: Image Editor
 documentation: ug
 ---
 
 # Reset an image in the Blazor Image Editor component
 
-The [`ResetAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.SfImageEditor.html#Syncfusion_Blazor_ImageEditor_SfImageEditor_ResetAsync) method in the Image Editor control provides the capability to undo all the changes made to an image and revert it back to its original state. This method is particularly useful when multiple adjustments, annotations, or transformations have been applied to an image and you want to start over with the original, unmodified version of the image. 
+The [ResetAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.SfImageEditor.html#Syncfusion_Blazor_ImageEditor_SfImageEditor_ResetAsync) method in the Image Editor control provides the capability to undo all changes made to an image and revert it to its original state. This method is particularly useful when multiple adjustments, annotations, or transformations have been applied to an image and a return to the original, unmodified version is required.
 
-By invoking the `ResetAsync` method, any modifications or edits made to the image will be undone, and the image will be restored to its initial state. This allows you to easily discard any changes and begin again with the fresh, unaltered image. 
+Invoking the `ResetAsync` method discards all modifications and restores the image to its initial state, enabling a clean restart of the editing process.

blazor/image-editor/images/blazor-image-editor-clear-image.jpg

@@ -1,30 +1,30 @@
 ---
 layout: post
 title: Resizing with Blazor Image Editor Component | Syncfusion
-description: Checkout the Resizing available in Blazor Image Editor component in Blazor Server App and Blazor WebAssembly App.
+description: Explore the resizing support in the Blazor Image Editor component for Blazor Server and WebAssembly applications.
 platform: Blazor
 control: Image Editor
 documentation: ug
 ---
 
 # Resize in the Blazor Image Editor component
 
-The resize feature in an Image Editor is a valuable tool that empowers users to modify the size or dimensions of an image to meet their specific requirements. Whether it's for printing, web display, or any other purpose, this feature allows users to tailor images to their desired specifications.
+The resize feature adjusts the size or dimensions of an image to match specific requirements for printing, web display, or other use cases.
 
 ## Apply resize to the image 
 
-The Image Editor control includes a [`ImageResizeAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.SfImageEditor.html#Syncfusion_Blazor_ImageEditor_SfImageEditor_ImageResizeAsync_System_Int32_System_Int32_System_Boolean_) method, which allows you to adjust the size of an image. This method takes three parameters that define how the resizing should be carried out:
+The Image Editor control provides the [`ImageResizeAsync`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.SfImageEditor.html#Syncfusion_Blazor_ImageEditor_SfImageEditor_ImageResizeAsync_System_Int32_System_Int32_System_Boolean_) method to change image size. This method accepts three parameters that define the resizing behavior:
 
-* width: Specifies the resizing width of the image.
+- width: Sets the target width of the image.
 
-* height: Specifies the resizing height of the image.
+- height: Sets the target height of the image.
 
-* isAspectRatio: Specifies a boolean value indicating whether the image should maintain its original aspect ratio during resizing.
-    * When set to `true`, the image maintains its original aspect ratio. The width is applied as specified, and the height is automatically adjusted to maintain the aspect ratio.
-    * When set to `false`, the image is resized according to the specified width and height, without maintaining the aspect ratio.
-    * The default value is `false`.
+- isAspectRatio: Indicates whether to preserve the original aspect ratio.
+  - When `true`, the image maintains its original aspect ratio. The specified width is applied, and the height adjusts automatically.
+  - When `false`, the image resizes to the specified width and height without preserving the aspect ratio.
+  - The default value is `false`.
 
-Here is an example of resizing the image using the `ImageResizeAsync` method.  
+Here is an example of resizing the image using the `ImageResizeAsync` method.
 
 ```cshtml
 @using Syncfusion.Blazor.ImageEditor
@@ -60,22 +60,22 @@ Here is an example of resizing the image using the `ImageResizeAsync` method.
 }
 ```
 
-![Blazor Image Editor with Resize an image](./images/blazor-image-editor-resize.png)
+![Blazor Image Editor with a resized image](./images/blazor-image-editor-resize.jpg)
 
 ## Resizing event
 
-The [`ImageResizing`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageEditorEvents.html#Syncfusion_Blazor_ImageEditor_ImageEditorEvents_ImageResizing) event is triggered when resizing the image. This event provides information encapsulated within an object, which includes details about the previous and current height and width of an image.
+The [`ImageResizing`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageEditorEvents.html#Syncfusion_Blazor_ImageEditor_ImageEditorEvents_ImageResizing) event triggers while an image is being resized and provides details about the previous and current dimensions.
 
-The parameter available in ResizeEventArgs is,
+Parameters available in [ImageResizeEventArgs](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html):
 
-* [`ImageResizeEventArgs.PreviousWidth`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_PreviousWidth) - The width of the image before resizing is performed.
+- [`ImageResizeEventArgs.PreviousWidth`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_PreviousWidth) – The width of the image before resizing.
 
-* [`ImageResizeEventArgs.PreviousHeight`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_PreviousHeight) - The height of the image before resizing is performed.
+- [`ImageResizeEventArgs.PreviousHeight`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_PreviousHeight) – The height of the image before resizing.
 
-* [`ImageResizeEventArgs.Width`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_Width) - The width of the image after resizing is performed.
+- [`ImageResizeEventArgs.Width`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_Width) – The width of the image after resizing.
 
-* [`ImageResizeEventArgs.Height`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_Height) - The width of the image after resizing is performed.
+- [`ImageResizeEventArgs.Height`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_Height) – The height of the image after resizing.
 
-* [`ImageResizeEventArgs.IsAspectRatio`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_IsAspectRatio) - The type of resizing performed such as aspect ratio or non-aspect ratio.
+- [`ImageResizeEventArgs.IsAspectRatio`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_IsAspectRatio) – Indicates whether the resizing preserved the aspect ratio.
 
-* [`ImageResizeEventArgs.Cancel`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_Cancel) - Specifies a boolean value to cancel the resizing action.
+- [`ImageResizeEventArgs.Cancel`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.ImageEditor.ImageResizeEventArgs.html#Syncfusion_Blazor_ImageEditor_ImageResizeEventArgs_Cancel) – A boolean value that cancels the resizing action when set to true.