Merge branch 'development' into 1010807_diataxis_pdf

Author: VenkadaSubramanian-Durai

Document-Processing-toc.html

@@ -1028,6 +1028,7 @@
 							<li><a href="/document-processing/pdf/pdf-viewer/react/text-selection">Text Selection</a></li>
 							<li><a href="/document-processing/pdf/pdf-viewer/react/globalization">Globalization</a></li>
 							<li><a href="/document-processing/pdf/pdf-viewer/react/accessibility">Accessibility</a></li>
+							<li><a href="/document-processing/pdf/pdf-viewer/react/theming-and-styling">Theming and Styling</a></li>
 							<li><a href="/document-processing/pdf/pdf-viewer/react/context-menu/context-menu">Context Menu</a>
 								<ul>
 									<li><a href="/document-processing/pdf/pdf-viewer/react/context-menu/builtin-context-menu">Built-in Context Menu</a></li>
@@ -1081,6 +1082,7 @@
 									<li><a href="/document-processing/pdf/pdf-viewer/react/how-to/show-hide-annotation">Show and Hide Annotation</a></li>
 									<li><a href="/document-processing/pdf/pdf-viewer/react/how-to/enable-text-selection">Dynamically Enable or Disable Text Selection</a></li>
 									<li><a href="/document-processing/pdf/pdf-viewer/react/how-to/load-document-after-resources-loaded">Load document after resources loaded</a></li>
+									<li><a href="/document-Processing/pdf/pdf-viewer/react/how-to/existing-react-layout">Integrate PDF Viewer into existing react layout</a></li>
 								</ul>
 							</li>
 							<li>Troubleshooting
@@ -5210,25 +5212,25 @@
 							<li><a href="/document-processing/excel/spreadsheet/react/getting-started">Getting Started</a></li>
 							<li><a href="/document-processing/excel/spreadsheet/react/nextjs-getting-started">Getting Started with NextJS</a></li>
 							<li><a href="/document-processing/excel/spreadsheet/react/data-binding">Data Binding</a></li>
-							<li><a href="/document-processing/excel/spreadsheet/react/open-excel-file">Open Excel Files</a>
+							<li><a href="/document-processing/excel/spreadsheet/react/open-excel-files">Open Excel Files</a>
 								<ul>
-									<li><a href="/document-processing/excel/spreadsheet/react/open-excel-files/aws-s3-bucket">From AWS S3</a></li>
-									<li><a href="/document-processing/excel/spreadsheet/react/open-excel-files/azure-blob-storage">From Azure Blob Storage</a></li>
-									<li><a href="/document-processing/excel/spreadsheet/react/open-excel-files/google-cloud-storage">From Google Cloud Storage</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/open-excel-file/from-aws-s3-bucket">From AWS S3</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/open-excel-file/from-azure-blob-storage">From Azure Blob Storage</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/open-excel-file/from-google-cloud-storage">From Google Cloud Storage</a></li>
 								</ul>
 							</li>
-							<li><a href="/document-processing/excel/spreadsheet/react/save-excel-file">Save Excel Files</a>
+							<li><a href="/document-processing/excel/spreadsheet/react/save-excel-files">Save Excel Files</a>
 								<ul>
-									<li><a href="/document-processing/excel/spreadsheet/react/save-excel-files/aws-s3-bucket">To AWS S3</a></li>
-									<li><a href="/document-processing/excel/spreadsheet/react/save-excel-files/azure-blob-storage">To Azure Blob Storage</a></li>
-									<li><a href="/document-processing/excel/spreadsheet/react/save-excel-files/google-cloud-storage">To Google Cloud Storage</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/save-excel-file/to-aws-s3-bucket">To AWS S3</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/save-excel-file/to-azure-blob-storage">To Azure Blob Storage</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/save-excel-file/to-google-cloud-storage">To Google Cloud Storage</a></li>
 								</ul>
 							</li>
-							<li>Server Deployment
+							<li><a href="/document-processing/excel/spreadsheet/react/server-deployment/spreadsheet-server-docker-image-overview">Server Deployment</a>
 							    <ul>
-									<li><a href="/document-processing/excel/spreadsheet/react/server-deployment/docker-deployment">Spreadsheet Server Docker Overview</a></li>
-									<li><a href="/document-processing/excel/spreadsheet/react/server-deployment/how-to-deploy-spreadsheet-server-to-azure-app-service-using-visual-studio">Deploy Spreadsheet Docker to Azure App Service using Azure CLI</a></li>
-									<li><a href="/document-processing/excel/spreadsheet/react/server-deployment/how-to-deploy-spreadsheet-server-to-azure-app-service-using-azure-cli">Publish Spreadsheet Server to Azure App Service using Visual Studio</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/server-deployment/spreadsheet-server-docker-image-overview">Spreadsheet Server Docker Overview</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/server-deployment/deploy-spreadsheet-docker-to-azure-using-azure-cli">Deploy Spreadsheet Docker to Azure App Service using Azure CLI</a></li>
+									<li><a href="/document-processing/excel/spreadsheet/react/server-deployment/publish-spreadsheet-server-to-azure-using-visual-studio">Publish Spreadsheet Server to Azure App Service using Visual Studio</a></li>
 								</ul>
 							</li>
 							<li><a href="/document-processing/excel/spreadsheet/react/worksheet">Worksheet</a></li>

…/React/Open-Excel-Files/aws-s3-bucket.md …ct/Open-Excel-File/from-aws-s3-bucket.mdDocument-Processing/Excel/Spreadsheet/React/Open-Excel-Files/aws-s3-bucket.md renamed to Document-Processing/Excel/Spreadsheet/React/Open-Excel-File/from-aws-s3-bucket.md Document-Processing/Excel/Spreadsheet/React/Open-Excel-Files/aws-s3-bucket.md renamed to Document-Processing/Excel/Spreadsheet/React/Open-Excel-File/from-aws-s3-bucket.md

@@ -13,11 +13,11 @@ To load a file from AWS S3 in a Spreadsheet Component, you can follow the steps
 
 **Step 1:** Create a Simple Spreadsheet Sample in React
 
-Start by following the steps provided in this [link](../../React//getting-started.md) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
+Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
 
 **Step 2:** Modify the `SpreadsheetController.cs` File in the Web Service Project
 
-1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](../../../Spreadsheet/React/open-save.md) for instructions on how to create a web service project.
+1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](https://www.syncfusion.com/blogs/post/host-spreadsheet-open-and-save-services) for instructions on how to create a web service project.
 
 2. Open the `SpreadsheetController.cs` file in your web service project.
 
@@ -141,7 +141,7 @@ N> Replace **Your Access Key from AWS S3**, **Your Secret Key from AWS S3**, and
 
 **Step 3:**  Modify the index File in the Spreadsheet sample to make a fetch call to the server to retrieve and load the Excel file from the AWS S3 bucket into the client-side spreadsheet.
 
-```typescript
+```ts
 
 <button class="e-btn" (click)="openFromS3()">Import XLS files from AWS S3 bucket</button>
 

…t/Open-Excel-Files/azure-blob-storage.md …en-Excel-File/from-azure-blob-storage.mdDocument-Processing/Excel/Spreadsheet/React/Open-Excel-Files/azure-blob-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Open-Excel-File/from-azure-blob-storage.md Document-Processing/Excel/Spreadsheet/React/Open-Excel-Files/azure-blob-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Open-Excel-File/from-azure-blob-storage.md

@@ -13,11 +13,11 @@ To load a file from Azure Blob Storage in a Spreadsheet Component, you can follo
 
 **Step 1:** Create a Simple Spreadsheet Sample in React
 
-Start by following the steps provided in this [link](../../React//getting-started.md) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
+Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
 
 **Step 2:** Modify the `SpreadsheetController.cs` File in the Web Service Project
 
-1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](../../../Spreadsheet/React/open-save.md) for instructions on how to create a web service project.
+1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](https://www.syncfusion.com/blogs/post/host-spreadsheet-open-and-save-services) for instructions on how to create a web service project.
 
 2. Open the `SpreadsheetController.cs` file in your web service project.
 
@@ -39,7 +39,7 @@ using Azure.Storage.Blobs.Specialized;
 
 4. Add the following private fields and constructor parameters to the `SpreadsheetController` class, In the constructor, assign the values from the configuration to the corresponding fields.
 
-```Csharp
+```csharp
 
 private readonly string _storageConnectionString;
 private readonly string _storageContainerName;
@@ -55,7 +55,7 @@ public SpreadsheetController(IConfiguration configuration)
 
 5. Create the `OpenFromAzure()` method to open the document from the Azure Blob Storage.
 
-```Csharp
+```csharp
 
 [HttpPost]
 [Route("OpenFromAzure")]
@@ -107,7 +107,7 @@ public class FileOptions
 
 6. Open the `appsettings.json` file in your web service project, Add the following lines below the existing `"AllowedHosts"` configuration.
 
-```Json
+```json
 
 {
   "Logging": {
@@ -126,7 +126,7 @@ N> Note: Install the Azure.Storage.Blobs NuGet package in the service project.
 
 **Step 3:** Modify the index File in the Spreadsheet sample to make a fetch call to the server to retrieve and load the Excel file from the Google Cloud Storage into the client-side spreadsheet.
 
-```typescript
+```ts
 
 <button class="e-btn" onClick={openFromAzure}>
   Import XLS file from Azure Blob Storage

…Open-Excel-Files/google-cloud-storage.md …-Excel-File/from-google-cloud-storage.mdDocument-Processing/Excel/Spreadsheet/React/Open-Excel-Files/google-cloud-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Open-Excel-File/from-google-cloud-storage.md Document-Processing/Excel/Spreadsheet/React/Open-Excel-Files/google-cloud-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Open-Excel-File/from-google-cloud-storage.md

@@ -13,11 +13,11 @@ To load a file from Google Cloud Storage in a Spreadsheet Component, you can fol
 
 **Step 1:** Create a Simple Spreadsheet Sample in React
 
-Start by following the steps provided in this [link](../../React//getting-started.md) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
+Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
 
 **Step 2:** Modify the `SpreadsheetController.cs` File in the Web Service Project
 
-1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](../../../Spreadsheet/React/open-save.md) for instructions on how to create a web service project.
+1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](https://www.syncfusion.com/blogs/post/host-spreadsheet-open-and-save-services) for instructions on how to create a web service project.
 
 2. Open the `SpreadsheetController.cs` file in your web service project.
 

…/React/Save-Excel-Files/aws-s3-bucket.md …eact/Save-Excel-File/to-aws-s3-bucket.mdDocument-Processing/Excel/Spreadsheet/React/Save-Excel-Files/aws-s3-bucket.md renamed to Document-Processing/Excel/Spreadsheet/React/Save-Excel-File/to-aws-s3-bucket.md Document-Processing/Excel/Spreadsheet/React/Save-Excel-Files/aws-s3-bucket.md renamed to Document-Processing/Excel/Spreadsheet/React/Save-Excel-File/to-aws-s3-bucket.md

@@ -13,11 +13,11 @@ To save a file to the AWS S3, you can follow the steps below
 
 **Step 1:** Create a Simple Spreadsheet Sample in React
 
-Start by following the steps provided in this [link](../../React//getting-started.md) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
+Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
 
 **Step 2:** Modify the `SpreadsheetController.cs` File in the Web Service Project
 
-1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](../../../Spreadsheet/React/open-save.md) for instructions on how to create a web service project.
+1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](https://www.syncfusion.com/blogs/post/host-spreadsheet-open-and-save-services) for instructions on how to create a web service project.
 
 2. Open the `SpreadsheetController.cs` file in your web service project.
 

…t/Save-Excel-Files/azure-blob-storage.md …Save-Excel-File/to-azure-blob-storage.mdDocument-Processing/Excel/Spreadsheet/React/Save-Excel-Files/azure-blob-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Save-Excel-File/to-azure-blob-storage.md Document-Processing/Excel/Spreadsheet/React/Save-Excel-Files/azure-blob-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Save-Excel-File/to-azure-blob-storage.md

@@ -7,17 +7,17 @@ control: Save file to Azure Blob Storage
 documentation: ug
 ---
 
-# Save file to Google Cloud Storage
+# Save file to Azure Cloud Storage
 
 To save a file to Azure Blob Storage in a Spreadsheet Component, you can follow the steps below
 
 **Step 1:** Create a Simple Spreadsheet Sample in React
 
-Start by following the steps provided in this [link](../../React//getting-started.md) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
+Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
 
 **Step 2:** Modify the `SpreadsheetController.cs` File in the Web Service Project
 
-1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](../../../Spreadsheet/React/open-save.md) for instructions on how to create a web service project.
+1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](https://www.syncfusion.com/blogs/post/host-spreadsheet-open-and-save-services) for instructions on how to create a web service project.
 
 2. Open the `SpreadsheetController.cs` file in your web service project.
 

…Save-Excel-Files/google-cloud-storage.md …ve-Excel-File/to-google-cloud-storage.mdDocument-Processing/Excel/Spreadsheet/React/Save-Excel-Files/google-cloud-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Save-Excel-File/to-google-cloud-storage.md Document-Processing/Excel/Spreadsheet/React/Save-Excel-Files/google-cloud-storage.md renamed to Document-Processing/Excel/Spreadsheet/React/Save-Excel-File/to-google-cloud-storage.md

@@ -13,11 +13,11 @@ To save a file to Google Cloud Storage in a Spreadsheet Component, you can follo
 
 **Step 1:** Create a Simple Spreadsheet Sample in React
 
-Start by following the steps provided in this [link](../../React//getting-started.md) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
+Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/excel/spreadsheet/react/getting-started) to create a simple Spreadsheet sample in React. This will give you a basic setup of the Spreadsheet component.
 
 **Step 2:** Modify the `SpreadsheetController.cs` File in the Web Service Project
 
-1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](../../../Spreadsheet/React/open-save.md) for instructions on how to create a web service project.
+1. Create a web service project in .NET Core 3.0 or above. You can refer to this [link](https://www.syncfusion.com/blogs/post/host-spreadsheet-open-and-save-services) for instructions on how to create a web service project.
 
 2. Open the `SpreadsheetController.cs` file in your web service project.
 
@@ -33,8 +33,7 @@ using Syncfusion.EJ2.Spreadsheet;
 
 4. Add the following private fields and constructor parameters to the `SpreadsheetController` class, In the constructor, assign the values from the configuration to the corresponding fields.
 
-```Csharp
-
+```csharp
 private readonly string _bucketName;
 private readonly StorageClient _storageClient;
 
@@ -50,13 +49,11 @@ public SpreadsheetController(IConfiguration configuration)
     // Bucket that stores the Excel files
     _bucketName = configuration.GetValue<string>("BucketName");
 }
-
 ```
 
 5. Create the `SaveToGoogleCloud()` method to save the document to the Google Cloud storage.
 
-```Csharp
-
+```csharp
 [HttpPost]
 [Route("SaveToGoogleCloud")]
 public async Task<IActionResult> SaveToGoogleCloud([FromForm] SaveSettings saveSettings)
@@ -80,17 +77,14 @@ public async Task<IActionResult> SaveToGoogleCloud([FromForm] SaveSettings saveS
         return BadRequest("Error saving file to Google Cloud Storage: " + ex.Message);
     }
 }
-
 ```
 
 **Step 3:**  Modify the index File in the Spreadsheet sample to using [`saveAsJson`](https://ej2.syncfusion.com/react/documentation/api/spreadsheet/index-default#saveasjson) method to serialize the spreadsheet and send it to the back-end
 
-```csharp
-
+```js
 <button class="e-btn" onClick={saveToGoogleCloud}>
   Save to Google Cloud Storage
 </button>
-
 const saveToGoogleCloud = () => {
   spreadsheet.saveAsJson().then(json => {
     const formData = new FormData();
@@ -115,7 +109,6 @@ const saveToGoogleCloud = () => {
       .catch(err => window.alert('Error saving to server: ' + err));
   });
 };
-
 ```
 
 N> Note: The back-end requires the Google.Cloud.Storage.V1 NuGet package and a service-account key that has Storage Object Admin (or equivalent) permissions on the target bucket.

…-to-azure-app-service-using-azure-cli.md …sheet-docker-to-azure-using-azure-cli.mdDocument-Processing/Excel/Spreadsheet/React/Server-Deployment/how-to-deploy-spreadsheet-server-to-azure-app-service-using-azure-cli.md renamed to Document-Processing/Excel/Spreadsheet/React/Server-Deployment/deploy-spreadsheet-docker-to-azure-using-azure-cli.md Document-Processing/Excel/Spreadsheet/React/Server-Deployment/how-to-deploy-spreadsheet-server-to-azure-app-service-using-azure-cli.md renamed to Document-Processing/Excel/Spreadsheet/React/Server-Deployment/deploy-spreadsheet-docker-to-azure-using-azure-cli.md

@@ -7,7 +7,7 @@ control: Docker deployment
 documentation: ug
 ---
 
-# Docker Image Overview in React Spreadsheet component
+# Spreadsheet server docker image overview in React Spreadsheet
 
 The [**Syncfusion<sup style="font-size:70%">&reg;</sup> Spreadsheet (also known as Excel Viewer)**](https://www.syncfusion.com/spreadsheet-editor-sdk/react-spreadsheet-editor) is a feature-rich control for organizing and analyzing data in a tabular format. It provides all the common Excel features, including data binding, selection, editing, formatting, resizing, sorting, filtering, importing, and exporting Excel documents.