From 57f6da3fe08b82d37fa63b70e846f7dedd4c6a51 Mon Sep 17 00:00:00 2001
From: Build Automaion <buildautomation@syncfusion.com>
Date: Fri, 5 Jul 2024 10:51:15 +0530
Subject: [PATCH] Integrated latest changes at 07-05-2024 10:30:10 AM

---
 ej2-javascript-toc.html                       |  11 ++-
 .../diagram/images/SymmetricNoneImage.png     | Bin 0 -> 14535 bytes
 .../diagram/js/bezier-controlPoint.md         |  26 +++---
 .../diagram/js/bezier-segEditOrientation.md   |  10 ++-
 .../diagram/js/connector-customization.md     |   4 +-
 .../diagram/js/connector-interaction.md       |   6 +-
 ej2-javascript/diagram/js/constraints.md      |  47 +----------
 .../diagram/ts/bezier-controlPoint.md         |  25 +++---
 .../diagram/ts/bezier-segEditOrientation.md   |   9 ++-
 .../diagram/ts/connector-customization.md     |   4 +-
 .../diagram/ts/connector-interaction.md       |   6 +-
 ej2-javascript/diagram/ts/constraints.md      |  47 +----------
 .../gantt/js/es5-getting-started.md           |  76 +++++++++---------
 ej2-javascript/treegrid/js/getting-started.md |  50 ++++++------
 ej2-typescript-toc.html                       |  11 +--
 15 files changed, 126 insertions(+), 206 deletions(-)
 create mode 100644 ej2-javascript/diagram/images/SymmetricNoneImage.png

diff --git a/ej2-javascript-toc.html b/ej2-javascript-toc.html
index 43d786b22..72aa5f1ac 100644
--- a/ej2-javascript-toc.html
+++ b/ej2-javascript-toc.html
@@ -726,7 +726,7 @@
             <li><a href="/ej2-javascript/diagram/bpmn-dataObject">BPMN Data Object</a></li>
             <li><a href="/ej2-javascript/diagram/bpmn-dataSource">BPMN Data Source</a></li>
             <li><a href="/ej2-javascript/diagram/bpmn-textAnnotation">BPMN Text Annotation</a></li>
-            <li><a href="/ej2-javascript/diagram/bpmn-groups">BPMN Group</a></li>
+            <li><a href="/ej2-javascript/diagram/bpmn-group">BPMN Group</a></li>
             <li><a href="/ej2-javascript/diagram/bpmn-expandedSubProcess">BPMN Expanded SubProcess</a></li>
             <li><a href="/ej2-javascript/diagram/bpmn-flows">BPMN Flow Connectors</a></li>
         </ul>
@@ -765,7 +765,7 @@
             <li><a href="/ej2-javascript/diagram/node-labels">Annotation for Node</a></li>
             <li><a href="/ej2-javascript/diagram/connector-labels">Annotation for Connector</a></li>
             <li><a href="/ej2-javascript/diagram/label-appearance">Annotation Appearance</a></li>
-            <li><a href="/ej2-javascript/diagram/label-interaction">Annotation Iteraction</a></li>
+            <li><a href="/ej2-javascript/diagram/label-interaction">Annotation Interaction</a></li>
             <li><a href="/ej2-javascript/diagram/label-events">Annotation Events</a></li>
     
         </ul>
@@ -794,7 +794,7 @@
         <li><a href="/ej2-javascript/diagram/radial-layout">Radial tree</a></li>
         <li><a href="/ej2-javascript/diagram/mindmap-layout">Mind Map tree</a></li>
         <li><a href="/ej2-javascript/diagram/symmetric-layout">Symmetric layout</a></li>
-        <li><a href="/ej2-javascript/diagram/layout-customization">Layout customization tree</a></li>
+        <li><a href="/ej2-javascript/diagram/layout-customization">Layout customization</a></li>
         <li><a href="/ej2-javascript/diagram/layout-event">Events</a></li>
         </ul>
     </li>
@@ -1200,6 +1200,8 @@
                 <li><a href="/ej2-javascript/gantt/pdf-export/pdf-export">Pdf Export</a>
                     <ul>
                         <li><a href="/ej2-javascript/gantt/pdf-export/multiple-gantt-exporting">Multiple Gantt Exporting</a></li>
+                        <li><a href="/ej2-javascript/gantt/pdf-export/customize-pdf-export">Customize PDF Export</a></li>
+                        <li><a href="/ej2-javascript/gantt/pdf-export/header-and-footer">Header and Footer</a></li> 
                     </ul>
                 </li>
             </ul>
@@ -1227,7 +1229,8 @@
         </li>
         <li><a href="https://ej2.syncfusion.com/documentation/api/gantt/">API Reference</a></li>
     </ul>
-</li><li>
+</li>
+<li>
 Grid
 <ul>
 <li><a href="/ej2-javascript/grid/getting-started">Getting Started</a></li>
diff --git a/ej2-javascript/diagram/images/SymmetricNoneImage.png b/ej2-javascript/diagram/images/SymmetricNoneImage.png
new file mode 100644
index 0000000000000000000000000000000000000000..85355961169937e981d357717e7fb6811cfc1b6a
GIT binary patch
literal 14535
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

literal 0
HcmV?d00001

diff --git a/ej2-javascript/diagram/js/bezier-controlPoint.md b/ej2-javascript/diagram/js/bezier-controlPoint.md
index fc424f6b3..aaf414f1d 100644
--- a/ej2-javascript/diagram/js/bezier-controlPoint.md
+++ b/ej2-javascript/diagram/js/bezier-controlPoint.md
@@ -9,16 +9,18 @@ documentation: ug
 domainurl: ##DomainURL##
 ---
 
-### How to interact with the bezier segments efficiently
+# Bezier Control points 
+
+## How to interact with the bezier segments efficiently
 
 While interacting with multiple bezier segments, maintain their control points at the same distance and angle by using the bezierSettings.smoothness property of the connector class.
 
 | BezierSmoothness value | Description | Output |
 |-------- | -------- | -------- |
-| SymmetricDistance| Both control points of adjacent segments will be at the same distance when any one of them is editing. | ![Symmetric distance](../../../images/Symmetric-distance.gif) |
-| SymmetricAngle | Both control points of adjacent segments will be at the same angle when any one of them is editing. | ![Symmetric Angle](../../../images/symmetric-Angle.gif) |
-| Default | Both control points of adjacent segments will be at the same angle and same distance when any one of them is editing. | ![Default](../../../images/DefaultSymmetric.gif) |
-| None | Segment’s control points are interacted independently from each other. | ![None](../../../images/SymmetricNone.gif) |
+| SymmetricDistance| Both control points of adjacent segments will be at the same distance when any one of them is editing. | ![Symmetric distance](../images/Symmetric-distance.gif) |
+| SymmetricAngle | Both control points of adjacent segments will be at the same angle when any one of them is editing. | ![Symmetric Angle](../images/symmetric-Angle.gif) |
+| Default | Both control points of adjacent segments will be at the same angle and same distance when any one of them is editing. | ![Default](../images/DefaultSymmetric.gif) |
+| None | Segment’s control points are interacted independently from each other. | ![None](../images/SymmetricNoneImage.png) |
 
 {% tabs %}
 {% highlight js tabtitle="index.js" %}
@@ -31,14 +33,14 @@ While interacting with multiple bezier segments, maintain their control points a
         
 {% previewsample "page.domainurl/code-snippet/diagram/connectors-cs17" %}
 
-### How to show or hide the bezier segment’s control points
+## How to show or hide the bezier segment’s control points
 
-By using the [`controlPointsVisibility`](../api/diagram/controlPointsVisibility/) property of the Connector class, you can enable or disable the visibility of the bezier segment’s control points.
+By using the [`controlPointsVisibility`](../api/diagram/controlPointsVisibility/) property of [`bezierSettings`](../api/diagram/bezierSettingsModel/), you can enable or disable the visibility of the bezier segment’s control points.
 
 | ControlPointsVisibility value | Description | Output |
 |-------- | -------- | -------- |
-| None |It allows you to hide all control points of the bezier connector. | ![ControlPointsVisibility None](../../../images/Symmetric-distance.gif) |
-| Source | It allows you to show control points of the source segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Source](../../../images/symmetric-Angle.gif) |
-| Target | It allows you to show control points of the target segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Target](../../../images/DefaultSymmetric.gif) |
-| Intermediate | It allows you to show control points of the intermediate segments and hides all other control points in a bezier connector.| ![ControlPointsVisibility Intermediate](../../../images/SymmetricNone.gif) |
-| All | It allows you to show all the control points of the bezier connector, including the source, target, and intermediate segments’ control points. | ![ControlPointsVisibility All](../../../images/SymmetricNone.gif) |
+| None |It allows you to hide all control points of the bezier connector. | ![ControlPointsVisibility None](../images/controlPointVisibilityNone.png) |
+| Source | It allows you to show control points of the source segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Source](../images/controlPointVisibilitySource.png) |
+| Target | It allows you to show control points of the target segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Target](../images/controlPointVisibilityTarget.png) |
+| Intermediate | It allows you to show control points of the intermediate segments and hides all other control points in a bezier connector.| ![ControlPointsVisibility Intermediate](../images/controlPointVisibilityIntermediate.png) |
+| All | It allows you to show all the control points of the bezier connector, including the source, target, and intermediate segments’ control points. | ![ControlPointsVisibility All](../images/controlPointVisibilityAll.png) |
diff --git a/ej2-javascript/diagram/js/bezier-segEditOrientation.md b/ej2-javascript/diagram/js/bezier-segEditOrientation.md
index 30fd6df51..c0f9526f1 100644
--- a/ej2-javascript/diagram/js/bezier-segEditOrientation.md
+++ b/ej2-javascript/diagram/js/bezier-segEditOrientation.md
@@ -9,16 +9,18 @@ documentation: ug
 domainurl: ##DomainURL##
 ---
 
+# Bezier Connector Settings
+
 ## How to edit bezier segments based on bezier connector settings
 
-The intermediate point of two adjacent bezier segments can be edited interactively based on the [`segmentEditOrientation`](../api/diagram/bezierSegmentEditOrientation/) property of the Connector class.
+The intermediate point of two adjacent bezier segments can be edited interactively based on the [`segmentEditOrientation`](../api/diagram/bezierSegmentEditOrientation/) property of [`bezierSettings`](../api/diagram/bezierSettingsModel/).
 
 | SegmentEditOrientation value | Description | Output |
 |-------- | -------- | -------- |
-| Bidirectional |It allows the intermediate points to be dragged in either vertical or horizontal directions. | ![Bidirectional](../../../images/bez-bidirectional.gif) |
-| Freeform | It allows the intermediate points to be dragged in any direction. | ![Freeform](../../../images/bez-freeform.gif) |
+| Bidirectional |It allows the intermediate points to be dragged in either vertical or horizontal directions. | ![Bidirectional](../images/bez-bidirectional.gif) |
+| Freeform | It allows the intermediate points to be dragged in any direction. | ![Freeform](../images/bez-freeform.gif) |
 
-The following code illustrates how to interact with Bezier efficiently by using the [`smoothness`](../api/diagram/bezierSmoothness/) and `segmentEditOrientation` properties of the Connector class.
+The following code illustrates how to interact with Bezier efficiently by using the [`smoothness`](../api/diagram/bezierSmoothness/) and `segmentEditOrientation` properties of the `bezierSettings`.
 
 {% tabs %}
 {% highlight js tabtitle="index.js" %}
diff --git a/ej2-javascript/diagram/js/connector-customization.md b/ej2-javascript/diagram/js/connector-customization.md
index 23671dc8f..659051136 100644
--- a/ej2-javascript/diagram/js/connector-customization.md
+++ b/ej2-javascript/diagram/js/connector-customization.md
@@ -59,7 +59,7 @@ The following code example illustrates how to customize the appearance of the de
 
 The gradient property is used to set the gradient color for the decorator. There are two types of gradient.
  * Linear
- * Raial
+ * Radial
 
 The following code example illustrates how to apply gradient for the decorator.
 
@@ -273,5 +273,5 @@ The following code illustrates how to split the connector and create a connectio
         
 {% previewsample "page.domainurl/code-snippet/diagram/connectors-cs29" %}
 
-![Enable Connector Split](../images/EnableSplit.gif)
+![Enable Connector Split](images/EnableSplit.gif)
 
diff --git a/ej2-javascript/diagram/js/connector-interaction.md b/ej2-javascript/diagram/js/connector-interaction.md
index 3f015aaba..af04517a9 100644
--- a/ej2-javascript/diagram/js/connector-interaction.md
+++ b/ej2-javascript/diagram/js/connector-interaction.md
@@ -17,8 +17,6 @@ Connectors can be selected, dragged, and routed over the diagram page.
 
 A connector can be selected, simply just by clicking on it.
 
-![Connector select unSelect GIF](../images/connector-SelectionGif.gif)
-
 A connector can be selected at runtime by using the Select method and clear the selection in the diagram using the ClearSelection. The following code explains how to select and clear selection in the diagram.
 
 {% tabs %}
@@ -36,7 +34,7 @@ A connector can be selected at runtime by using the Select method and clear the
 
 Connector can be dragged by just clicking on the connector and dragging.
 
-![Connector Drag Gif](../images/connector-dragGif.gif)
+![Connector Drag Gif](images/connector-dragGif.gif)
 
 A connector can be dragged at runtime by using the Drag method. The following code explains how to drag the connector by using the drag method.
 
@@ -55,7 +53,7 @@ A connector can be dragged at runtime by using the Drag method. The following co
 
 The connector can be selected by clicking it. When the connector is selected, circles will be added on the starting and ending of the connector that is represented by Thumbs. Clicking and dragging those handles helps you to adjust the source and target points.
 
-![End Point drag GIF](../images/EndPointDragGif.gif)
+![End Point drag GIF](images/EndPointDragGif.gif)
 
 The following code example shows how to drag connector end point at runtime.
 
diff --git a/ej2-javascript/diagram/js/constraints.md b/ej2-javascript/diagram/js/constraints.md
index 7f57e79ba..335bbe98f 100644
--- a/ej2-javascript/diagram/js/constraints.md
+++ b/ej2-javascript/diagram/js/constraints.md
@@ -19,14 +19,6 @@ To know more about Bitwise operators, refer to [`Bitwise Operations`](#bitwise-o
 
 [`Diagram constraints`](../api/diagram/diagramconstraints/) allows you to enable or disable the following behaviors:
 
-* Page editing
-* Bridging
-* Zoom and pan
-* Undo/redo
-* Tooltip
-* Line routing
-* Virtualization
-
 The following table displays the list of all diagram constraints.
 
 | Constraints | Description |
@@ -93,16 +85,6 @@ N> By default, the following constraints are enabled in the diagram,
 
 Node constraints allows to enable or disable the following behaviors of node. They are as follows:
 
-* Select
-* Drag
-* Resize
-* Rotate
-* Delete
-* InConnect
-* OutConnect
-* Shadow
-* Tooltip
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Disable all node Constraints|
@@ -207,15 +189,6 @@ N>By default, the following constraints are enabled for the node,
 
 Connector constraints allows you to enable or disable certain behaviors of connectors.
 
-* Select
-* Drag
-* DragSourceEnd
-* DragTargetEnd
-* Delete
-* InheritBridging
-* PointerEvents
-* Tooltip
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Disable all connector Constraints.|
@@ -332,9 +305,6 @@ N>By default, the following constraints are enabled for the connector,
 
 The constraints property of the Port allows you to enable or disable the following behaviors of port.
 
-* InConnect
-* OutConnect
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Disable all port Constraints.|
@@ -476,10 +446,6 @@ For more details about annotation constraints, refer to [`AnnotationConstraints`
 
 Selector visually represents the selected elements with certain editable thumbs. The visibility of the thumbs can be controlled with selector constraints. The part of selector is categorized as follows:
 
-* Resizer
-* Rotator
-* User handles
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Hides all the selector elements.|
@@ -550,12 +516,7 @@ N> By default, the following constraints are enabled for the selected items,
 
 ## Snap constraints
 
-Snap constraints control the visibility of gridlines and enable/disable snapping. Snap constraints allow to set the following behaviors.
-
-* Show only horizontal or vertical gridlines.
-* Show both horizontal and vertical gridlines.
-* Snap to either horizontal or vertical gridlines.
-* Snap to both horizontal and vertical gridlines.
+Snap constraints control the visibility of gridlines and enable/disable snapping.
 
 The following list of snapping constraints are used to enable or disable certain features of snapping.
 
@@ -617,11 +578,7 @@ N> By default, the following constraints are enabled for the snap functionality
 
 ## Boundary constraints
 
-Boundary constraints defines a boundary for the diagram inside which the interaction should be done. Boundary constraints allow to set the following behaviors.
-
-* Infinite
-* Diagram
-* Page
+Boundary constraints defines a boundary for the diagram inside which the interaction should be done.
 
 The following list of constraints are used to enable or disable certain features of boundary interactions of the diagram.
 
diff --git a/ej2-javascript/diagram/ts/bezier-controlPoint.md b/ej2-javascript/diagram/ts/bezier-controlPoint.md
index e16799316..6b9e84ee2 100644
--- a/ej2-javascript/diagram/ts/bezier-controlPoint.md
+++ b/ej2-javascript/diagram/ts/bezier-controlPoint.md
@@ -8,17 +8,18 @@ publishingplatform: ##Platform_Name##
 documentation: ug
 domainurl: ##DomainURL##
 ---
+# Bezier Control points 
 
-### How to interact with the bezier segments efficiently
+## How to interact with the bezier segments efficiently
 
 While interacting with multiple bezier segments, maintain their control points at the same distance and angle by using the bezierSettings.smoothness property of the connector class.
 
 | BezierSmoothness value | Description | Output |
 |-------- | -------- | -------- |
-| SymmetricDistance| Both control points of adjacent segments will be at the same distance when any one of them is editing. | ![Symmetric distance](../../../images/Symmetric-distance.gif) |
-| SymmetricAngle | Both control points of adjacent segments will be at the same angle when any one of them is editing. | ![Symmetric Angle](../../../images/symmetric-Angle.gif) |
-| Default | Both control points of adjacent segments will be at the same angle and same distance when any one of them is editing. | ![Default](../../../images/DefaultSymmetric.gif) |
-| None | Segment’s control points are interacted independently from each other. | ![None](../../../images/SymmetricNone.gif) |
+| SymmetricDistance| Both control points of adjacent segments will be at the same distance when any one of them is editing. | ![Symmetric distance](../images/Symmetric-distance.gif) |
+| SymmetricAngle | Both control points of adjacent segments will be at the same angle when any one of them is editing. | ![Symmetric Angle](../images/symmetric-Angle.gif) |
+| Default | Both control points of adjacent segments will be at the same angle and same distance when any one of them is editing. | ![Default](../images/DefaultSymmetric.gif) |
+| None | Segment’s control points are interacted independently from each other. | ![None](../images/SymmetricNoneImage.png) |
 
 {% tabs %}
 {% highlight ts tabtitle="index.ts" %}
@@ -31,14 +32,14 @@ While interacting with multiple bezier segments, maintain their control points a
         
 {% previewsample "page.domainurl/code-snippet/diagram/connectors-cs17" %}
 
-### How to show or hide the bezier segment’s control points
+## How to show or hide the bezier segment’s control points
 
-By using the [`controlPointsVisibility`](../api/diagram/controlPointsVisibility/) property of the Connector class, you can enable or disable the visibility of the bezier segment’s control points.
+By using the [`controlPointsVisibility`](../api/diagram/controlPointsVisibility/) property of [`bezierSettings`](../api/diagram/bezierSettingsModel/), you can enable or disable the visibility of the bezier segment’s control points.
 
 | ControlPointsVisibility value | Description | Output |
 |-------- | -------- | -------- |
-| None |It allows you to hide all control points of the bezier connector. | ![ControlPointsVisibility None](../../../images/Symmetric-distance.gif) |
-| Source | It allows you to show control points of the source segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Source](../../../images/symmetric-Angle.gif) |
-| Target | It allows you to show control points of the target segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Target](../../../images/DefaultSymmetric.gif) |
-| Intermediate | It allows you to show control points of the intermediate segments and hides all other control points in a bezier connector.| ![ControlPointsVisibility Intermediate](../../../images/SymmetricNone.gif) |
-| All | It allows you to show all the control points of the bezier connector, including the source, target, and intermediate segments’ control points. | ![ControlPointsVisibility All](../../../images/SymmetricNone.gif) |
+| None |It allows you to hide all control points of the bezier connector. | ![ControlPointsVisibility None](../images/controlPointVisibilityNone.png) |
+| Source | It allows you to show control points of the source segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Source](../images/controlPointVisibilitySource.png) |
+| Target | It allows you to show control points of the target segment and hides all other control points in a bezier connector. | ![ControlPointsVisibility Target](../images/controlPointVisibilityTarget.png) |
+| Intermediate | It allows you to show control points of the intermediate segments and hides all other control points in a bezier connector.| ![ControlPointsVisibility Intermediate](../images/controlPointVisibilityIntermediate.png) |
+| All | It allows you to show all the control points of the bezier connector, including the source, target, and intermediate segments’ control points. | ![ControlPointsVisibility All](../images/controlPointVisibilityAll.png) |
diff --git a/ej2-javascript/diagram/ts/bezier-segEditOrientation.md b/ej2-javascript/diagram/ts/bezier-segEditOrientation.md
index b8dce54ab..b210fadee 100644
--- a/ej2-javascript/diagram/ts/bezier-segEditOrientation.md
+++ b/ej2-javascript/diagram/ts/bezier-segEditOrientation.md
@@ -8,17 +8,18 @@ publishingplatform: ##Platform_Name##
 documentation: ug
 domainurl: ##DomainURL##
 ---
+# Bezier Connector Settings
 
 ## How to edit bezier segments based on bezier connector settings
 
-The intermediate point of two adjacent bezier segments can be edited interactively based on the [`segmentEditOrientation`](../api/diagram/bezierSegmentEditOrientation/) property of the Connector class.
+The intermediate point of two adjacent bezier segments can be edited interactively based on the [`segmentEditOrientation`](../api/diagram/bezierSegmentEditOrientation/) property of [`bezierSettings`](../api/diagram/bezierSettingsModel/).
 
 | SegmentEditOrientation value | Description | Output |
 |-------- | -------- | -------- |
-| Bidirectional |It allows the intermediate points to be dragged in either vertical or horizontal directions. | ![Bidirectional](../../../images/bez-bidirectional.gif) |
-| Freeform | It allows the intermediate points to be dragged in any direction. | ![Freeform](../../../images/bez-freeform.gif) |
+| Bidirectional |It allows the intermediate points to be dragged in either vertical or horizontal directions. | ![Bidirectional](../images/bez-bidirectional.gif) |
+| Freeform | It allows the intermediate points to be dragged in any direction. | ![Freeform](../images/bez-freeform.gif) |
 
-The following code illustrates how to interact with Bezier efficiently by using the [`smoothness`](../api/diagram/bezierSmoothness/) and `segmentEditOrientation` properties of the Connector class.
+The following code illustrates how to interact with Bezier efficiently by using the [`smoothness`](../api/diagram/bezierSmoothness/) and `segmentEditOrientation` properties of the `bezierSettings`.
 
 {% tabs %}
 {% highlight ts tabtitle="index.ts" %}
diff --git a/ej2-javascript/diagram/ts/connector-customization.md b/ej2-javascript/diagram/ts/connector-customization.md
index cb9fcaaee..01ebcadd7 100644
--- a/ej2-javascript/diagram/ts/connector-customization.md
+++ b/ej2-javascript/diagram/ts/connector-customization.md
@@ -59,7 +59,7 @@ The following code example illustrates how to customize the appearance of the de
 
 The gradient property is used to set the gradient color for the decorator. There are two types of gradient.
  * Linear
- * Raial
+ * Radial
  
 The following code example illustrates how to apply gradient for the decorator.
 
@@ -274,5 +274,5 @@ The following code illustrates how to split the connector and create a connectio
         
 {% previewsample "page.domainurl/code-snippet/diagram/connectors-cs29" %}
 
-![Enable Connector Split](../images/EnableSplit.gif)
+![Enable Connector Split](images/EnableSplit.gif)
 
diff --git a/ej2-javascript/diagram/ts/connector-interaction.md b/ej2-javascript/diagram/ts/connector-interaction.md
index ac03ed2ba..d83ed8b8f 100644
--- a/ej2-javascript/diagram/ts/connector-interaction.md
+++ b/ej2-javascript/diagram/ts/connector-interaction.md
@@ -17,8 +17,6 @@ Connectors can be selected, dragged, and routed over the diagram page.
 
 A connector can be selected, simply just by clicking on it.
 
-![Connector select unSelect GIF](../images/connector-SelectionGif.gif)
-
 A connector can be selected at runtime by using the Select method and clear the selection in the diagram using the ClearSelection. The following code explains how to select and clear selection in the diagram.
 
 {% tabs %}
@@ -36,7 +34,7 @@ A connector can be selected at runtime by using the Select method and clear the
 
 Connector can be dragged by just clicking on the connector and dragging.
 
-![Connector Drag Gif](../images/connector-dragGif.gif)
+![Connector Drag Gif](images/connector-dragGif.gif)
 
 A connector can be dragged at runtime by using the Drag method. The following code explains how to drag the connector by using the drag method.
 
@@ -55,7 +53,7 @@ A connector can be dragged at runtime by using the Drag method. The following co
 
 The connector can be selected by clicking it. When the connector is selected, circles will be added on the starting and ending of the connector that is represented by Thumbs. Clicking and dragging those handles helps you to adjust the source and target points.
 
-![End Point drag GIF](../images/EndPointDragGif.gif)
+![End Point drag GIF](images/EndPointDragGif.gif)
 
 The following code example shows how to drag connector end point at runtime.
 
diff --git a/ej2-javascript/diagram/ts/constraints.md b/ej2-javascript/diagram/ts/constraints.md
index c762e5883..06133f2a2 100644
--- a/ej2-javascript/diagram/ts/constraints.md
+++ b/ej2-javascript/diagram/ts/constraints.md
@@ -19,14 +19,6 @@ To know more about Bitwise operators, refer to [`Bitwise Operations`](#bitwise-o
 
 [`Diagram constraints`](../api/diagram/diagramconstraints/) allows you to enable or disable the following behaviors:
 
-* Page editing
-* Bridging
-* Zoom and pan
-* Undo/redo
-* Tooltip
-* Line routing
-* Virtualization
-
 The following table displays the list of all diagram constraints.
 
 | Constraints | Description |
@@ -93,16 +85,6 @@ N> By default, the following constraints are enabled in the diagram,
 
 Node constraints allows to enable or disable the following behaviors of node. They are as follows:
 
-* Select
-* Drag
-* Resize
-* Rotate
-* Delete
-* InConnect
-* OutConnect
-* Shadow
-* Tooltip
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Disable all node Constraints|
@@ -207,15 +189,6 @@ N>By default, the following constraints are enabled for the node,
 
 Connector constraints allows you to enable or disable certain behaviors of connectors.
 
-* Select
-* Drag
-* DragSourceEnd
-* DragTargetEnd
-* Delete
-* InheritBridging
-* PointerEvents
-* Tooltip
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Disable all connector Constraints.|
@@ -332,9 +305,6 @@ N>By default, the following constraints are enabled for the connector,
 
 The constraints property of the Port allows you to enable or disable the following behaviors of port.
 
-* InConnect
-* OutConnect
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Disable all port Constraints.|
@@ -476,10 +446,6 @@ For more details about annotation constraints, refer to [`AnnotationConstraints`
 
 Selector visually represents the selected elements with certain editable thumbs. The visibility of the thumbs can be controlled with selector constraints. The part of selector is categorized as follows:
 
-* Resizer
-* Rotator
-* User handles
-
 | Constraints | Description |
 | -------- | -------- |
 |None|Hides all the selector elements.|
@@ -550,12 +516,7 @@ N> By default, the following constraints are enabled for the selected items,
 
 ## Snap constraints
 
-Snap constraints control the visibility of gridlines and enable/disable snapping. Snap constraints allow to set the following behaviors.
-
-* Show only horizontal or vertical gridlines.
-* Show both horizontal and vertical gridlines.
-* Snap to either horizontal or vertical gridlines.
-* Snap to both horizontal and vertical gridlines.
+Snap constraints control the visibility of gridlines and enable/disable snapping.
 
 The following list of snapping constraints are used to enable or disable certain features of snapping.
 
@@ -617,11 +578,7 @@ N> By default, the following constraints are enabled for the snap functionality
 
 ## Boundary constraints
 
-Boundary constraints defines a boundary for the diagram inside which the interaction should be done. Boundary constraints allow to set the following behaviors.
-
-* Infinite
-* Diagram
-* Page
+Boundary constraints defines a boundary for the diagram inside which the interaction should be done.
 
 The following list of constraints are used to enable or disable certain features of boundary interactions of the diagram.
 
diff --git a/ej2-javascript/gantt/js/es5-getting-started.md b/ej2-javascript/gantt/js/es5-getting-started.md
index 77a765c58..f05dd5823 100644
--- a/ej2-javascript/gantt/js/es5-getting-started.md
+++ b/ej2-javascript/gantt/js/es5-getting-started.md
@@ -72,9 +72,9 @@ Refer to the following code to find the location of Gantt script and style file.
 
 **Example:**
 
-> Script: `C:/Program Files (x86)/Syncfusion/Essential Studio/16.4.40/Essential JS 2/ej2-gantt/dist/global/ej2-gantt.min.js`
+> Script: `C:/Program Files (x86)/Syncfusion/Essential Studio/26.1.35/Essential JS 2/ej2-gantt/dist/global/ej2-gantt.min.js`
 >
-> Styles: `C:/Program Files (x86)/Syncfusion/Essential Studio/16.4.40/Essential JS 2/ej2-gantt/styles/material.css`
+> Styles: `C:/Program Files (x86)/Syncfusion/Essential Studio/26.1.35/Essential JS 2/ej2-gantt/styles/material.css`
 
 After copying the files, then you can refer the gantt's scripts and styles into the `index.html` file.
 The below html code example shows the minimal dependency for Gantt.
@@ -138,15 +138,15 @@ Refer to the Gantt's CDN links as follows.
 
 **Syntax:**
 
-> Script: `http://cdn.syncfusion.com/ej2/{PACKAGE_NAME}/dist/global/{PACKAGE_NAME}.min.js`
+> Script: `http://cdn.syncfusion.com/ej2/{RELEASE_VERSION}/{PACKAGE_NAME}/dist/global/{PACKAGE_NAME}.min.js`
 >
-> Styles: `http://cdn.syncfusion.com/ej2/{PACKAGE_NAME}/styles/material.css`
+> Styles: `http://cdn.syncfusion.com/ej2/{RELEASE_VERSION}/{PACKAGE_NAME}/styles/material.css`
 
 **Example:**
 
-> Script: [`http://cdn.syncfusion.com/ej2/ej2-gantt/dist/global/ej2-gantt.min.js`](http://cdn.syncfusion.com/ej2/ej2-gantt/dist/global/ej2-gantt.min.js)
+> Script: [`http://cdn.syncfusion.com/ej2/26.1.35/ej2-gantt/dist/global/ej2-gantt.min.js`](http://cdn.syncfusion.com/ej2/ej2-gantt/dist/global/ej2-gantt.min.js)
 >
-> Styles: [`http://cdn.syncfusion.com/ej2/ej2-gantt/styles/material.css`](http://cdn.syncfusion.com/ej2/ej2-gantt/styles/material.css)
+> Styles: [`http://cdn.syncfusion.com/ej2/26.1.35/ej2-gantt/styles/material.css`](http://cdn.syncfusion.com/ej2/ej2-gantt/styles/material.css)
 
 The below html code example shows the dependency of gantt.
 
@@ -156,42 +156,42 @@ The below html code example shows the dependency of gantt.
        <head>
             <title>Essential JS 2 Gantt</title>
             <!-- Essential JS 2 gantt's dependent material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-buttons/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-navigations/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-lists/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-dropdowns/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-inputs/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-calendars/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-layouts/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-richtexteditor/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-buttons/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-navigations/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-lists/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-dropdowns/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-inputs/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-calendars/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-layouts/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-richtexteditor/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
             <!-- Essential JS 2 material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-gantt/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-gantt/styles/material.css" rel="stylesheet" type="text/css"/>
 
             <!-- Essential JS 2 Gantt's dependent scripts -->
-            <script src="http://cdn.syncfusion.com/ej2/ej2-base/dist/global/ej2-base.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-data/dist/global/ej2-data.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-buttons/dist/global/ej2-buttons.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-popups/dist/global/ej2-popups.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-navigations/dist/global/ej2-navigations.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-lists/dist/global/ej2-lists.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-dropdowns/dist/global/ej2-dropdowns.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-inputs/dist/global/ej2-inputs.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-calendars/dist/global/ej2-calendars.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-layouts/dist/global/ej2-layouts.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-richtexteditor/dist/global/ej2-richtexteditor.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-grids/dist/global/ej2-grids.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-treegrid/dist/global/ej2-treegrid.min.js" type="text/javascript"></script>
-            <script src="https://cdn.syncfusion.com/ej2/ej2-splitbuttons/dist/global/ej2-splitbuttons.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-excel-export/dist/global/ej2-excel-export.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-file-utils/dist/global/ej2-file-utils.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-compression/dist/global/ej2-compression.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-pdf-export/dist/global/ej2-pdf-export.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-base/dist/global/ej2-base.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-data/dist/global/ej2-data.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-buttons/dist/global/ej2-buttons.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-popups/dist/global/ej2-popups.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-navigations/dist/global/ej2-navigations.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-lists/dist/global/ej2-lists.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-dropdowns/dist/global/ej2-dropdowns.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-inputs/dist/global/ej2-inputs.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-calendars/dist/global/ej2-calendars.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-layouts/dist/global/ej2-layouts.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-richtexteditor/dist/global/ej2-richtexteditor.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-grids/dist/global/ej2-grids.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/dist/global/ej2-treegrid.min.js" type="text/javascript"></script>
+            <script src="https://cdn.syncfusion.com/ej2/26.1.35/ej2-splitbuttons/dist/global/ej2-splitbuttons.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-excel-export/dist/global/ej2-excel-export.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-file-utils/dist/global/ej2-file-utils.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-compression/dist/global/ej2-compression.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-pdf-export/dist/global/ej2-pdf-export.min.js" type="text/javascript"></script>
             <!-- Essential JS 2 Gantt's global script -->
-            <script src="http://cdn.syncfusion.com/ej2/ej2-gantt/dist/global/ej2-gantt.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-gantt/dist/global/ej2-gantt.min.js" type="text/javascript"></script>
        </head>
        <body>
            <!-- Add the HTML <div> element for Gantt  -->
diff --git a/ej2-javascript/treegrid/js/getting-started.md b/ej2-javascript/treegrid/js/getting-started.md
index d46317084..a36441187 100644
--- a/ej2-javascript/treegrid/js/getting-started.md
+++ b/ej2-javascript/treegrid/js/getting-started.md
@@ -69,9 +69,9 @@ Refer to the following code to find location TreeGrid's script and style file.
 
 **Example:**
 
-> Script: `C:/Program Files (x86)/Syncfusion/Essential Studio/16.4.40/Essential JS 2/ej2-treegrid/dist/global/ej2-treegrid.min.js`
+> Script: `C:/Program Files (x86)/Syncfusion/Essential Studio/26.1.35/Essential JS 2/ej2-treegrid/dist/global/ej2-treegrid.min.js`
 >
-> Styles: `C:/Program Files (x86)/Syncfusion/Essential Studio/16.4.40/Essential JS 2/ej2-treegrid/styles/material.css`
+> Styles: `C:/Program Files (x86)/Syncfusion/Essential Studio/26.1.35/Essential JS 2/ej2-treegrid/styles/material.css`
 
 After copying the files, refer the TreeGrid's scripts and styles into the `index.html` file.
 The following HTML code example shows the minimal dependency of TreeGrid.
@@ -110,15 +110,15 @@ Refer to the TreeGrid's CDN links as follows.
 
 **Syntax:**
 
-> Script: `http://cdn.syncfusion.com/ej2/{PACKAGE_NAME}/dist/global/{PACKAGE_NAME}.min.js`
+> Script: `http://cdn.syncfusion.com/ej2/{RELEASE_VERSION}/{PACKAGE_NAME}/dist/global/{PACKAGE_NAME}.min.js`
 >
-> Styles: `http://cdn.syncfusion.com/ej2/{PACKAGE_NAME}/styles/material.css`
+> Styles: `http://cdn.syncfusion.com/ej2/{RELEASE_VERSION}/{PACKAGE_NAME}/styles/material.css`
 
 **Example:**
 
-> Script: [`http://cdn.syncfusion.com/ej2/ej2-treegrid/dist/global/ej2-treegrid.min.js`](http://cdn.syncfusion.com/ej2/ej2-treegrid/dist/global/ej2-treegrid.min.js)
+> Script: [`http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/dist/global/ej2-treegrid.min.js`](http://cdn.syncfusion.com/ej2/ej2-treegrid/dist/global/ej2-treegrid.min.js)
 >
-> Styles: [`http://cdn.syncfusion.com/ej2/ej2-treegrid/styles/material.css`](http://cdn.syncfusion.com/ej2/ej2-treegrid/styles/material.css)
+> Styles: [`http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/styles/material.css`](http://cdn.syncfusion.com/ej2/ej2-treegrid/styles/material.css)
 
 The following HTML code example shows the minimal dependency of TreeGrid.
 
@@ -128,19 +128,19 @@ The following HTML code example shows the minimal dependency of TreeGrid.
        <head>
             <title>Essential JS 2 TreeGrid</title>
             <!-- Essential JS 2 TreeGrid's dependent material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
             <!-- Essential JS 2 material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
 
             <!-- Essential JS 2 TreeGrid's dependent script -->
-            <script src="http://cdn.syncfusion.com/ej2/ej2-base/dist/global/ej2-base.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-data/dist/global/ej2-data.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-popups/dist/global/ej2-popups.min.js" type="text/javascript"></script>
-            <script src="http://cdn.syncfusion.com/ej2/ej2-grids/dist/global/ej2-grids.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-base/dist/global/ej2-base.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-data/dist/global/ej2-data.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-popups/dist/global/ej2-popups.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-grids/dist/global/ej2-grids.min.js" type="text/javascript"></script>
             <!-- Essential JS 2 TreeGrid's global script -->
-            <script src="http://cdn.syncfusion.com/ej2/ej2-treegrid/dist/global/ej2-treegrid.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/dist/global/ej2-treegrid.min.js" type="text/javascript"></script>
        </head>
        <body>
        </body>
@@ -160,14 +160,14 @@ In this document context, the `ej2.min.js` is used, which includes all the Essen
        <head>
             <title>Essential JS 2 TreeGrid</title>
             <!-- Essential JS 2 TreeGrid's dependent material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
             <!-- Essential JS 2 material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
 
             <!-- Essential JS 2 all script -->
-            <script src="http://cdn.syncfusion.com/ej2/dist/ej2.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/dist/ej2.min.js" type="text/javascript"></script>
        </head>
        <body>
            <!-- Add the HTML <div> element for TreeGrid  -->
@@ -197,14 +197,14 @@ Data for the TreeGrid control is bind by using the `dataSource` property. It acc
        <head>
             <title>Essential JS 2 TreeGrid</title>
             <!-- Essential JS 2 TreeGrid's dependent material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
-            <link href="http://cdn.syncfusion.com/ej2/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-base/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-popups/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-grids/styles/material.css" rel="stylesheet" type="text/css"/>
             <!-- Essential JS 2 material theme -->
-            <link href="http://cdn.syncfusion.com/ej2/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
+            <link href="http://cdn.syncfusion.com/ej2/26.1.35/ej2-treegrid/styles/material.css" rel="stylesheet" type="text/css"/>
 
             <!-- Essential JS 2 all script -->
-            <script src="http://cdn.syncfusion.com/ej2/dist/ej2.min.js" type="text/javascript"></script>
+            <script src="http://cdn.syncfusion.com/ej2/26.1.35/dist/ej2.min.js" type="text/javascript"></script>
        </head>
        <body>
            <!-- Add the HTML <div> element for TreeGrid  -->
diff --git a/ej2-typescript-toc.html b/ej2-typescript-toc.html
index d38cbe7a8..726bc8810 100644
--- a/ej2-typescript-toc.html
+++ b/ej2-typescript-toc.html
@@ -730,7 +730,7 @@
                 <li><a href="/ej2-typescript/diagram/bpmn-dataObject">BPMN Data Object</a></li>
                 <li><a href="/ej2-typescript/diagram/bpmn-dataSource">BPMN Data Source</a></li>
                 <li><a href="/ej2-typescript/diagram/bpmn-textAnnotation">BPMN Text Annotation</a></li>
-                <li><a href="/ej2-typescript/diagram/bpmn-groups">BPMN Group</a></li>
+                <li><a href="/ej2-typescript/diagram/bpmn-group">BPMN Group</a></li>
                 <li><a href="/ej2-typescript/diagram/bpmn-expandedSubProcess">BPMN Expanded SubProcess</a></li>
                 <li><a href="/ej2-typescript/diagram/bpmn-flows">BPMN Flow Connectors</a></li>
             </ul>
@@ -769,7 +769,7 @@
         <li><a href="/ej2-typescript/diagram/node-labels">Annotation for Node</a></li>
         <li><a href="/ej2-typescript/diagram/connector-labels">Annotation for Connector</a></li>
         <li><a href="/ej2-typescript/diagram/label-appearance">Annotation Appearance</a></li>
-        <li><a href="/ej2-typescript/diagram/label-interaction">Annotation Iteraction</a></li>
+        <li><a href="/ej2-typescript/diagram/label-interaction">Annotation Interaction</a></li>
         <li><a href="/ej2-typescript/diagram/label-events">Annotation Events</a></li>
         </ul>
     </li>
@@ -797,7 +797,7 @@
         <li><a href="/ej2-typescript/diagram/radial-layout">Radial tree</a></li>
         <li><a href="/ej2-typescript/diagram/mindmap-layout">Mind Map tree</a></li>
         <li><a href="/ej2-typescript/diagram/symmetric-layout">Symmetric layout</a></li>
-        <li><a href="/ej2-typescript/diagram/layout-customization">Layout customization tree</a></li>
+        <li><a href="/ej2-typescript/diagram/layout-customization">Layout customization</a></li>
         <li><a href="/ej2-typescript/diagram/layout-event">Events</a></li>
         </ul>
     </li>
@@ -1202,8 +1202,9 @@
                 </li>
                 <li><a href="/ej2-typescript/gantt/pdf-export/pdf-export">Pdf Export</a>
                     <ul>
-                        <li><a href="/ej2-typescript/gantt/pdf-export/multiple-gantt-exporting">Multiple Gantt Exporting</a>
-                        </li>
+                        <li><a href="/ej2-typescript/gantt/pdf-export/multiple-gantt-exporting">Multiple Gantt Exporting</a></li>
+                        <li><a href="/ej2-typescript/gantt/pdf-export/customize-pdf-export">Customize PDF Export</a></li>
+                        <li><a href="/ej2-typescript/gantt/pdf-export/header-and-footer">Header and Footer</a></li>
                     </ul>
                 </li>
             </ul>