@syncfusion/ej2-gantt 22.2.12 → 23.1.36

package/src/gantt/models/task-fields.js

@@ -35,6 +35,9 @@ var TaskFields = /** @class */ (function (_super) {
     __decorate([
         Property(null)
     ], TaskFields.prototype, "parentID", void 0);
+    __decorate([
+        Property(null)
+    ], TaskFields.prototype, "hasChildMapping", void 0);
     __decorate([
         Property(null)
     ], TaskFields.prototype, "startDate", void 0);

package/src/gantt/renderer/chart-rows.d.ts

@@ -11,7 +11,7 @@ export declare class ChartRows extends DateProcessor {
     taskBarHeight: number;
     milestoneHeight: number;
     private milesStoneRadius;
-    private baselineTop;
+    baselineTop: number;
     baselineHeight: number;
     private baselineColor;
     private parentTaskbarTemplateFunction;

package/src/gantt/renderer/chart-rows.js

@@ -305,16 +305,16 @@ var ChartRows = /** @class */ (function (_super) {
         return splitTasks;
     };
     ChartRows.prototype.getSplitTaskbarLeftResizerNode = function () {
-        var lResizerLeft = -(this.parent.isAdaptive ? 12 : 2);
+        var lResizerLeft = (!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? 5 : -2;
         var template = '<div class="' + cls.taskBarLeftResizer + ' ' + cls.icon + '"' +
-            ' style="' + (this.parent.enableRtl ? 'right:' : 'left:') + lResizerLeft + 'px;height:' + (this.taskBarHeight) + 'px;"></div>';
+            ' style="' + (this.parent.enableRtl ? 'right:' : 'left:') + lResizerLeft + 'px;height:' + (this.taskBarHeight) + 'px;z-index:1"></div>';
         return template;
     };
     ChartRows.prototype.getSplitTaskbarRightResizerNode = function (segment) {
-        var rResizerLeft = this.parent.isAdaptive ? -2 : -10;
+        var rResizerLeft = (!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? -17 : -10;
         var template = '<div class="' + cls.taskBarRightResizer + ' ' + cls.icon + '"' +
             ' style="' + (this.parent.enableRtl ? 'right:' : 'left:') + (segment.width + rResizerLeft) + 'px;' +
-            'height:' + (this.taskBarHeight) + 'px;"></div>';
+            'height:' + (this.taskBarHeight) + 'px;z-index:1"></div>';
         return template;
     };
     ChartRows.prototype.getSplitProgressResizerNode = function (segment) {
@@ -639,7 +639,7 @@ var ChartRows = /** @class */ (function (_super) {
         }
         else {
             var template = '<div class="' + cls.traceMilestone + '" style="width:' + ((this.parent.renderBaseline ? this.taskBarHeight : this.taskBarHeight - 6)) + 'px;height:' +
-                ((this.parent.renderBaseline ? this.taskBarHeight : this.taskBarHeight - 6)) + 'px;position:absolute;transform: rotate(45deg);top:' + (this.parent.rowHeight > 40 ? 0 : 1) + 'px;left:' + 1 + 'px;"> </div>';
+                ((this.parent.renderBaseline ? this.taskBarHeight : this.taskBarHeight - 6)) + 'px;position:absolute;transform: rotate(45deg);left:' + 1 + 'px;"> </div>';
             milestoneNode = this.createDivElement(template);
         }
         return milestoneNode;
@@ -1017,16 +1017,16 @@ var ChartRows = /** @class */ (function (_super) {
         return this.createDivElement(template);
     };
     ChartRows.prototype.childTaskbarLeftResizer = function () {
-        var lResizerLeft = -(this.parent.isAdaptive ? 12 : 2);
+        var lResizerLeft = (!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? 5 : -2;
         var template = '<div class="' + cls.taskBarLeftResizer + ' ' + cls.icon + '"' +
-            'style="' + (this.parent.enableRtl ? 'right:' : 'left:') + lResizerLeft + 'px;height:' + (this.taskBarHeight) + 'px;"></div>';
+            'style="' + (this.parent.enableRtl ? 'right:' : 'left:') + lResizerLeft + 'px;height:' + (this.taskBarHeight) + 'px;z-index:1"></div>';
         return this.createDivElement(template);
     };
     ChartRows.prototype.childTaskbarRightResizer = function () {
-        var rResizerLeft = this.parent.isAdaptive ? -2 : -10;
+        var rResizerLeft = (!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? -17 : -10;
         var template = '<div class="' + cls.taskBarRightResizer + ' ' + cls.icon + '"' +
             'style="' + (this.parent.enableRtl ? 'right:' : 'left:') + (this.templateData.ganttProperties.width + rResizerLeft) + 'px;' +
-            'height:' + (this.taskBarHeight) + 'px;"></div>';
+            'height:' + (this.taskBarHeight) + 'px;z-index:1"></div>';
         return this.createDivElement(template);
     };
     ChartRows.prototype.childTaskbarProgressResizer = function () {
@@ -1040,8 +1040,10 @@ var ChartRows = /** @class */ (function (_super) {
     };
     ChartRows.prototype.getLeftPointNode = function () {
         var data = this.templateData;
-        var pointerLeft = -((this.parent.isAdaptive ? 14 : 2) + this.connectorPointWidth);
-        var mileStoneLeft = -(this.connectorPointWidth + 2);
+        var left = (!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? 12 : 0;
+        var mileStoneLeftValue = (!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? 6 : 3;
+        var pointerLeft = -(3 + this.connectorPointWidth + left);
+        var mileStoneLeft = -(this.connectorPointWidth + 4 + mileStoneLeftValue);
         var pointerTop = Math.floor(this.milesStoneRadius - (this.connectorPointWidth / 2));
         var marginTop;
         if ((!this.templateData.ganttProperties.isAutoSchedule && this.templateData.hasChildRecords) && this.parent.allowParentDependency) {
@@ -1060,7 +1062,8 @@ var ChartRows = /** @class */ (function (_super) {
     };
     ChartRows.prototype.getRightPointNode = function () {
         var data = this.templateData;
-        var pointerRight = this.parent.isAdaptive ? 10 : -2;
+        var right = (!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? -12 : 0;
+        var pointerRight = -(3 + right);
         var pointerTop = Math.floor(this.milesStoneRadius - (this.connectorPointWidth / 2));
         var marginTop;
         if ((!this.templateData.ganttProperties.isAutoSchedule && this.templateData.hasChildRecords) && this.parent.allowParentDependency) {
@@ -1070,7 +1073,7 @@ var ChartRows = /** @class */ (function (_super) {
             marginTop = 'margin-top:' + this.connectorPointMargin + 'px';
         }
         var template = '<div class="' + cls.rightConnectorPointOuterDiv + '" style="' +
-            ((data.ganttProperties.isMilestone) ? ('left:' + (this.milestoneHeight - 2) + 'px;margin-top:' +
+            ((data.ganttProperties.isMilestone) ? ('left:' + ((!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? (this.milestoneHeight + 5) : this.milestoneHeight - 2) + 'px;margin-top:' +
                 pointerTop + 'px;') : ('left:' + (data.ganttProperties.width + pointerRight) + 'px;' + marginTop + ';')) + '">' +
             '<div class="' + cls.connectorPointRight + ' ' + this.parent.getUnscheduledTaskClass(data.ganttProperties) +
             '" style="width:' + this.connectorPointWidth + 'px;height:' + this.connectorPointWidth + 'px;">' +
@@ -1243,7 +1246,7 @@ var ChartRows = /** @class */ (function (_super) {
      * @private
      */
     ChartRows.prototype.initChartHelperPrivateVariable = function () {
-        var taskbarHeightValue = this.parent.renderBaseline ? 0.45 : 0.62;
+        var taskbarHeightValue = this.parent.renderBaseline ? 0.45 : ((!isNullOrUndefined(document.body.className) && document.body.className.includes("e-bigger")) ? 0.7 : 0.62);
         var taskBarMarginTopValue = this.parent.renderBaseline ? 4 : 2;
         var milestoneHeightValue = this.parent.renderBaseline ? 1.13 : 0.82;
         this.baselineColor = !isNullOrUndefined(this.parent.baselineColor) &&
@@ -1265,8 +1268,8 @@ var ChartRows = /** @class */ (function (_super) {
         this.milestoneMarginTop = Math.floor((this.parent.rowHeight - this.milestoneHeight) / 2);
         this.milesStoneRadius = Math.floor((this.milestoneHeight) / 2);
         this.baselineTop = -(Math.floor((this.parent.rowHeight - (this.taskBarHeight + this.taskBarMarginTop))) - 4);
-        this.connectorPointWidth = this.parent.isAdaptive ? Math.round(this.taskBarHeight / 2) : 10;
-        this.connectorPointMargin = Math.floor((this.taskBarHeight / 2) - (this.connectorPointWidth / 2)) - 1;
+        this.connectorPointWidth = this.parent.isAdaptive ? Math.round(this.taskBarHeight / 2) : 8;
+        this.connectorPointMargin = Math.floor((this.taskBarHeight / 2) - (this.connectorPointWidth / 2));
     };
     /**
      * Function used to refresh Gantt rows.
@@ -1552,11 +1555,24 @@ var ChartRows = /** @class */ (function (_super) {
      * @private
      */
     ChartRows.prototype.setAriaRowIndex = function (tempTemplateData, tRow) {
+        var _this = this;
         var dataSource = this.parent.treeGrid.getCurrentViewRecords();
         var visualData = this.parent.virtualScrollModule && this.parent.enableVirtualization ?
             getValue('virtualScrollModule.visualData', this.parent.treeGrid) : dataSource;
-        var index = visualData.indexOf(tempTemplateData);
-        tRow.setAttribute('aria-rowindex', index.toString());
+        var index;
+        if (!this.parent.loadChildOnDemand && this.parent.taskFields.hasChildMapping) {
+            var gridData = this.parent.treeGrid.grid.contentModule['rows'];
+            var data = gridData.filter(function (x) {
+                if (x['data'][_this.parent.taskFields.id] === tempTemplateData.ganttProperties.taskId) {
+                    return x;
+                }
+            })[0];
+            tRow.setAttribute('aria-rowindex', data['index'].toString());
+        }
+        else {
+            index = visualData.indexOf(tempTemplateData);
+            tRow.setAttribute('aria-rowindex', index.toString());
+        }
     };
     /**
      * To trigger query taskbar info event.
@@ -1932,8 +1948,11 @@ var ChartRows = /** @class */ (function (_super) {
                 this.triggerQueryTaskbarInfoByIndex(tr, data);
             }
             var dataId = this.parent.viewType === 'ProjectView' ? data.ganttProperties.taskId : data.ganttProperties.rowUniqueID;
-            this.parent.treeGrid.grid.setRowData(dataId, data);
-            if (this.parent.viewType === 'ResourceView' && data.hasChildRecords && !data.expanded && this.parent.enableMultiTaskbar && !this.parent.allowTaskbarOverlap) {
+            if (!this.parent.ganttChartModule.isExpandAll && !this.parent.ganttChartModule.isCollapseAll) {
+                this.parent.treeGrid.grid.setRowData(dataId, data);
+            }
+            if (this.parent.viewType === 'ResourceView' && data.hasChildRecords && !data.expanded && this.parent.enableMultiTaskbar && !this.parent.allowTaskbarOverlap &&
+                !this.parent.ganttChartModule.isCollapseAll && !this.parent.ganttChartModule.isExpandAll) {
                 this.updateDragDropRecords(selectedItem, tr);
             }
             if (this.parent.viewType === 'ResourceView' && data.hasChildRecords && this.parent.showOverAllocation && !this.parent.allowTaskbarOverlap) {

package/src/gantt/renderer/connector-line.js

@@ -57,7 +57,7 @@ var ConnectorLine = /** @class */ (function () {
     };
     ConnectorLine.prototype.getTaskbarMidpoint = function (isMilestone) {
         return Math.floor(isMilestone ?
-            (this.parent.chartRowsModule.milestoneMarginTop + (this.parent.chartRowsModule.milestoneHeight / 2)) + 1 :
+            (this.parent.chartRowsModule.milestoneMarginTop + (this.parent.chartRowsModule.milestoneHeight / 2)) :
             (this.parent.chartRowsModule.taskBarMarginTop + (this.parent.chartRowsModule.taskBarHeight / 2))) + 1;
     };
     /**
@@ -71,14 +71,45 @@ var ConnectorLine = /** @class */ (function () {
      */
     ConnectorLine.prototype.createConnectorLineObject = function (parentGanttData, childGanttData, predecessor) {
         var connectorObj = {};
-        var updatedRecords = this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport ?
-            this.parent.flatData : this.expandedRecords;
-        var parentIndex = updatedRecords.indexOf(parentGanttData);
-        var childIndex = updatedRecords.indexOf(childGanttData);
+        var updatedRecords;
+        if (this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport && this.parent.pdfExportModule.helper.exportProps &&
+            this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings && this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings.isFitToWidth) {
+            updatedRecords = this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport ?
+                this.parent.pdfExportModule.helper.beforeSinglePageExport['cloneFlatData'] : this.expandedRecords;
+        }
+        else {
+            updatedRecords = this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport ?
+                this.parent.flatData : this.expandedRecords;
+        }
+        var parentIndex;
+        var childIndex;
+        if (this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport && this.parent.pdfExportModule.helper.exportProps &&
+            this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings && this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings.isFitToWidth) {
+            var parentData = this.parent.flatData.filter(function (data) {
+                return data.ganttProperties.taskId.toString() == parentGanttData.ganttProperties.taskId.toString();
+            })[0];
+            var childData = this.parent.flatData.filter(function (data) {
+                return data.ganttProperties.taskId.toString() == childGanttData.ganttProperties.taskId.toString();
+            })[0];
+            parentIndex = parentData.index;
+            childIndex = childData.index;
+        }
+        else {
+            parentIndex = updatedRecords.indexOf(parentGanttData);
+            childIndex = updatedRecords.indexOf(childGanttData);
+        }
         var parentGanttRecord = parentGanttData.ganttProperties;
         var childGanttRecord = childGanttData.ganttProperties;
-        var currentData = this.parent.virtualScrollModule && this.parent.enableVirtualization ?
-            this.parent.currentViewData : this.parent.getExpandedRecords(this.parent.currentViewData);
+        var currentData;
+        if (this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport && this.parent.pdfExportModule.helper.exportProps &&
+            this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings && this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings.isFitToWidth) {
+            currentData = this.parent.virtualScrollModule && this.parent.enableVirtualization ?
+                this.parent.pdfExportModule.helper.beforeSinglePageExport['cloneFlatData'] : this.parent.getExpandedRecords(this.parent.pdfExportModule.helper.beforeSinglePageExport['cloneFlatData']);
+        }
+        else {
+            currentData = this.parent.virtualScrollModule && this.parent.enableVirtualization ?
+                this.parent.currentViewData : this.parent.getExpandedRecords(this.parent.currentViewData);
+        }
         connectorObj.parentIndexInCurrentView = currentData.indexOf(parentGanttData);
         connectorObj.childIndexInCurrentView = currentData.indexOf(childGanttData);
         var isVirtualScroll = this.parent.virtualScrollModule && this.parent.enableVirtualization;
@@ -864,8 +895,17 @@ var ConnectorLine = /** @class */ (function () {
         if (isNullOrUndefined(id)) {
             return null;
         }
-        return this.parent.viewType === 'ResourceView' ? this.parent.flatData[this.parent.getTaskIds().indexOf('T' + id.toString())] :
-            this.parent.flatData[this.parent.ids.indexOf(id.toString())];
+        if (this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport && this.parent.pdfExportModule.helper.exportProps &&
+            this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings && this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings.isFitToWidth) {
+            var a = this.parent.pdfExportModule.helper.beforeSinglePageExport['cloneFlatData'].filter(function (data) {
+                return data.ganttProperties.taskId.toString() === id.toString();
+            })[0];
+            return a;
+        }
+        else {
+            return this.parent.viewType === 'ResourceView' ? this.parent.flatData[this.parent.getTaskIds().indexOf('T' + id.toString())] :
+                this.parent.flatData[this.parent.ids.indexOf(id.toString())];
+        }
     };
     /**
      * Method to remove connector line from DOM

package/src/gantt/renderer/edit-tooltip.js

@@ -50,6 +50,7 @@ var EditTooltip = /** @class */ (function () {
      * @returns {void} .
      */
     EditTooltip.prototype.updateTooltipPosition = function (args) {
+        args.element.style.visibility = 'visible';
         var parentWithZoomStyle = this.parent.element.closest('[style*="zoom"]');
         if (isNullOrUndefined(parentWithZoomStyle)) {
             var containerPosition = this.parent.getOffsetRect(this.parent.chartPane);
@@ -59,8 +60,8 @@ var EditTooltip = /** @class */ (function () {
                 tooltipPositionX += leftEnd - (tooltipPositionX + args.element.offsetWidth);
             }
             args.element.style.left = tooltipPositionX + 'px';
+            args.element.style.visibility = 'visible';
         }
-        args.element.style.visibility = 'visible';
     };
     /**
      * To show/hide taskbar edit tooltip.

package/src/gantt/renderer/timeline.js

@@ -74,7 +74,9 @@ var Timeline = /** @class */ (function () {
      */
     Timeline.prototype.refreshTimelineByTimeSpan = function () {
         this.validateTimelineProp();
-        this.parent.ganttChartModule.chartTimelineContainer.innerHTML = '';
+        if (!this.parent.pdfExportModule || (this.parent.pdfExportModule && !this.parent.pdfExportModule.isPdfExport) || (this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport && this.parent.pdfExportModule.helper.exportProps && !this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings.isFitToWidth)) {
+            this.parent.ganttChartModule.chartTimelineContainer.innerHTML = '';
+        }
         this.createTimelineSeries();
     };
     /**
@@ -391,7 +393,10 @@ var Timeline = /** @class */ (function () {
         this.customTimelineSettings.topTier.format = this.validateFormat(this.topTier, this.customTimelineSettings.topTier.format);
         this.customTimelineSettings.weekStartDay = this.customTimelineSettings.weekStartDay >= 0 &&
             this.customTimelineSettings.weekStartDay <= 6 ? this.customTimelineSettings.weekStartDay : 0;
-        this.checkCurrentZoomingLevel();
+        if (!(this.parent.pdfExportModule && this.parent.pdfExportModule.helper.exportProps &&
+            this.parent.pdfExportModule.isPdfExport && this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings.isFitToWidth)) {
+            this.checkCurrentZoomingLevel();
+        }
     };
     /**
      * To find the current zooming level of the Gantt control.
@@ -638,13 +643,15 @@ var Timeline = /** @class */ (function () {
             table = createElement('table', { className: cls.timelineHeaderTableContainer, styles: 'display: block;' });
             thead = createElement('thead', { className: cls.timelineHeaderTableBody, styles: 'display:block; border-collapse:collapse' });
             tr = createElement('tr', { innerHTML: this.createTimelineTemplate(tier) });
-            td = createElement('th');
-            div = createElement('div', { styles: 'width: 20px' });
-            td.appendChild(div);
-            tr.appendChild(td);
-            thead.appendChild(tr);
-            table.appendChild(thead);
-            this.parent.ganttChartModule.chartTimelineContainer.appendChild(table);
+            if (!this.parent.pdfExportModule || (this.parent.pdfExportModule && !this.parent.pdfExportModule.isPdfExport) || (this.parent.pdfExportModule && this.parent.pdfExportModule.isPdfExport && this.parent.pdfExportModule.helper.exportProps && !this.parent.pdfExportModule.helper.exportProps.fitToWidthSettings.isFitToWidth)) {
+                td = createElement('th');
+                div = createElement('div', { styles: 'width: 20px' });
+                td.appendChild(div);
+                tr.appendChild(td);
+                thead.appendChild(tr);
+                table.appendChild(thead);
+                this.parent.ganttChartModule.chartTimelineContainer.appendChild(table);
+            }
             tier = 'bottomTier';
             tr = null;
         }

package/src/gantt/renderer/tooltip.js

@@ -88,8 +88,8 @@ var Tooltip = /** @class */ (function () {
                     if (taskbarTemplateNode) {
                         append(taskbarTemplateNode, tooltipTemplate);
                     }
-                    argsData.content = this.toolTipObj.content = taskbarTemplateNode ? tooltipTemplate :
-                        parent.tooltipModule.getTooltipContent((data.ganttProperties.isMilestone ? 'milestone' : 'taskbar'), data, parent, args);
+                    argsData.content = this.toolTipObj.content = taskbarTemplateNode ? tooltipTemplate : data ?
+                        parent.tooltipModule.getTooltipContent((data.ganttProperties.isMilestone ? 'milestone' : 'taskbar'), data, parent, args) : "";
                 }
                 else if (args.target.classList.contains('e-baseline-bar') ||
                     args.target.classList.contains('e-baseline-gantt-milestone')) {
@@ -101,8 +101,8 @@ var Tooltip = /** @class */ (function () {
                     if (baseLineTemplateNode) {
                         append(baseLineTemplateNode, baselineTemplate);
                     }
-                    argsData.content = this.toolTipObj.content = baseLineTemplateNode ? baselineTemplate :
-                        parent.tooltipModule.getTooltipContent((data.ganttProperties.isMilestone ? 'milestone' : 'baseline'), data, parent, args);
+                    argsData.content = this.toolTipObj.content = baseLineTemplateNode ? baselineTemplate : data ?
+                        parent.tooltipModule.getTooltipContent((data.ganttProperties.isMilestone ? 'milestone' : 'baseline'), data, parent, args) : "";
                 }
                 else if (args.target.classList.contains('e-event-markers')) {
                     argsData.content = this.toolTipObj.content = parent.tooltipModule.getTooltipContent('marker', data, parent, args);
@@ -169,7 +169,7 @@ var Tooltip = /** @class */ (function () {
     // eslint-disable-next-line
     Tooltip.prototype.tooltipCloseHandler = function (args) {
         this.tooltipMouseEvent = null;
-        if (!this.parent.isAdaptive) {
+        if (!this.parent.isAdaptive && !isNullOrUndefined(this.currentTarget)) {
             EventHandler.remove(this.currentTarget, 'mousemove', this.mouseMoveHandler);
         }
         this.currentTarget = null;

package/styles/bootstrap-dark.css

@@ -247,6 +247,10 @@
   content: "\e903";
 }
 
+.e-icon-rowselect::before {
+  content: "\e930";
+}
+
 .e-gantt-tooltip-arrow-left::before {
   content: "\e85b";
 }
@@ -299,6 +303,7 @@
 .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-right-hover {
   background-color: #21527d;
   border-color: #1a1a1a;
+  position: relative;
 }
 .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-left-hover:hover,
 .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-right-hover:hover {
@@ -306,6 +311,17 @@
   border-color: #1a1a1a;
   outline: 2px solid #75ACDB;
 }
+.e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-left-hover::after,
+.e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-right-hover::after {
+  content: "";
+  position: absolute;
+  width: 30px;
+  height: 40px;
+  top: -10px;
+}
+.e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-allow-block {
+  cursor: no-drop;
+}
 .e-bigger .e-gantt .e-tab .e-content {
   height: 242px !important;
 }
@@ -349,7 +365,6 @@
 }
 .e-bigger .e-gantt-dialog .e-dialog {
   border-radius: 6px;
-  width: 556px !important;
 }
 .e-bigger .e-gantt-dialog .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
   padding: 0 16px !important; /* stylelint-disable-line declaration-no-important */
@@ -491,10 +506,6 @@
   border-right: none !important; /* stylelint-disable-line declaration-no-important */
   border-left-color: #0070f0;
 }
-.e-gantt.e-gantt-rtl .e-toolbar-right {
-  left: auto !important; /* stylelint-disable-line declaration-no-important */
-  right: 0 !important; /* stylelint-disable-line declaration-no-important */
-}
 .e-gantt.e-gantt-rtl .e-gantt-chart .e-timeline-header-container {
   border-right: none !important; /* stylelint-disable-line declaration-no-important */
   border-left: 1px solid !important; /* stylelint-disable-line declaration-no-important */
@@ -814,6 +825,12 @@
   vertical-align: middle;
   z-index: 3;
 }
+.e-gantt .e-gantt-chart .e-taskbar-main-container:hover {
+  z-index: 4;
+}
+.e-gantt .e-gantt-chart .e-taskbar-main-container.e-gantt-multi-taskbar:hover {
+  z-index: 4;
+}
 .e-gantt .e-gantt-chart .e-left-label-container.e-left-label-temp-container {
   -ms-flex-align: center;
       align-items: center;
@@ -953,72 +970,61 @@
   height: 16px;
   width: 16px;
   left: 14px;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-innerHTML1 {
   height: 16px;
   width: 16px;
   left: 30px;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-innerHTML2 {
   height: 16px;
   width: 16px;
   left: 60px;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-timelineHeader {
   height: 16px;
   width: 82px;
   left: 20px;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-maskcell01 {
   height: 12px;
   width: 88px;
   left: 14px;
   border-radius: 0;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-maskcell02 {
   height: 18px;
   width: 410px;
   border-radius: 0;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-maskcell03 {
   height: 12px;
   width: 88px;
   left: 14px;
   border-radius: 0;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-maskcell04 {
   height: 18px;
   width: 208px;
   border-radius: 0;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-maskcell05 {
   height: 12px;
   width: 108px;
   left: 64px;
   border-radius: 0;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-maskcell06 {
   height: 18px;
   width: 195px;
   left: 192px;
   border-radius: 0;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-maskcell07 {
   height: 18px;
   width: 156px;
   left: 388px;
   border-radius: 0;
-  background: #e1dfdd;
 }
 .e-gantt .e-gantt-chart .e-taskbar-left-resizer,
 .e-gantt .e-gantt-chart .e-taskbar-right-resizer {
@@ -1153,7 +1159,7 @@
   border-left: 1px dashed;
   position: absolute;
   width: 1px;
-  z-index: 2;
+  z-index: 4;
 }
 .e-gantt .e-gantt-chart .e-event-markers .e-span-label {
   border-radius: 3px;
@@ -1371,10 +1377,6 @@
   box-shadow: none;
 }
 
-.e-icon-rowselect::before {
-  content: "\e930";
-}
-
 .e-ganttpopup {
   -moz-user-select: none; /* stylelint-disable-line property-no-vendor-prefix */
   -ms-user-select: none; /* stylelint-disable-line property-no-vendor-prefix */
@@ -1433,6 +1435,15 @@
   font-size: 14px;
 }
 
+.e-bigger .e-gantt .e-gantt-chart .e-timeline-single-header-outer-div {
+  height: 64px !important; /* stylelint-disable-line declaration-no-important */
+}
+
+.e-bigger .e-timeline-single-header-cell {
+  height: 64px !important; /* stylelint-disable-line declaration-no-important */
+  line-height: 64px !important; /* stylelint-disable-line declaration-no-important */
+}
+
 .e-gantt-tooltip-label {
   padding-bottom: 2px;
   padding-right: 2px;
@@ -1477,16 +1488,6 @@
 .e-gantt.e-device .e-gridheader .e-icons {
   font-size: 12px;
 }
-.e-gantt.e-device .e-right-resize-gripper,
-.e-gantt.e-device .e-left-resize-gripper {
-  border: 7px solid;
-  z-index: -1;
-}
-.e-gantt.e-device .e-right-resize-gripper::before,
-.e-gantt.e-device .e-left-resize-gripper::before {
-  font-size: 14px;
-  margin-left: -7px;
-}
 .e-gantt.e-device .e-dependent-div .e-content {
   height: 100%;
 }
@@ -1549,6 +1550,12 @@
   color: #000;
 }
 
+.e-gantt-chart-resize-indicator {
+  height: 100%;
+  position: absolute;
+  z-index: 1;
+}
+
 /*! Gantt theme */
 .e-gantt .e-gantt-splitter {
   border-color: #484848;
@@ -1905,75 +1912,6 @@
 .e-gantt .e-gantt-chart .e-grid .e-gridpopup .e-spanclicked {
   border-color: #000;
 }
-.e-gantt .e-gantt-chart .e-active-parent-task {
-  border-radius: 4px;
-  box-shadow: 4px 4px 3px 0 rgba(0, 0, 0, 0.5);
-}
-.e-gantt .e-gantt-chart .e-active-parent-task .e-gantt-parent-taskbar-inner-div {
-  background: #1a1a1a;
-  border: #1a1a1a;
-}
-.e-gantt .e-gantt-chart .e-active-parent-task .e-gantt-parent-progressbar-inner-div {
-  background-color: transparent;
-  border: transparent;
-}
-.e-gantt .e-gantt-chart .e-active-parent-task .e-task-label {
-  color: transparent;
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-task-label {
-  color: transparent !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-line {
-  border-color: #8A8A8A !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-connector-line-right-arrow {
-  border-left-color: #8A8A8A !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-connector-line-left-arrow {
-  border-right-color: #8A8A8A !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-gantt-child-taskbar-inner-div {
-  background: #D5D5D5 !important; /* stylelint-disable-line declaration-no-important */
-  border: #D5D5D5 !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-gantt-child-progressbar-inner-div {
-  background-color: transparent !important; /* stylelint-disable-line declaration-no-important */
-  border: transparent !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-gantt-milestone {
-  background-color: #D5D5D5 !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-gantt-parent-taskbar-inner-div {
-  background-color: #8A8A8A !important; /* stylelint-disable-line declaration-no-important */
-  border: #8A8A8A !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-gantt-parent-progressbar-inner-div {
-  background-color: transparent !important; /* stylelint-disable-line declaration-no-important */
-  border: transparent !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-active-child-task .e-gantt-child-taskbar-inner-div {
-  background: #0070f0 !important; /* stylelint-disable-line declaration-no-important */
-  border: #0070f0 !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-active-child-task .e-gantt-milestone {
-  background-color: #0070f0 !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-active-connected-task .e-gantt-child-taskbar-inner-div {
-  background: #57a5ff !important; /* stylelint-disable-line declaration-no-important */
-  border: #57a5ff !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-active-connected-task .e-gantt-milestone {
-  background-color: #57a5ff !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-active-connected-task .e-line {
-  border-color: #0070f0 !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-active-connected-task .e-connector-line-right-arrow {
-  border-left-color: #0070f0 !important; /* stylelint-disable-line declaration-no-important */
-}
-.e-gantt .e-gantt-chart .e-predecessor-touch-mode .e-active-connected-task .e-connector-line-left-arrow {
-  border-right-color: #0070f0 !important; /* stylelint-disable-line declaration-no-important */
-}
 .e-gantt .e-icons {
   color: #fff;
 }
@@ -2083,4 +2021,10 @@
 
 .e-gantt .e-gantt-chart .e-critical-milestone {
   background-color: #D13438;
+}
+
+.e-gantt-chart-resize-indicator {
+  border: 1px dashed #248aff;
+  border-bottom: none;
+  border-top: none;
 }