@syncfusion/ej2-base 20.2.38 → 20.2.39

package/dist/global/index.d.ts

@@ -1,12 +1,3 @@
-/*!
-*  filename: index.d.ts
-*  version : 20.2.38
-*  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
-*  Use of this code is subject to the terms of our license.
-*  A copy of the current license can be obtained at any time by e-mailing
-*  licensing@syncfusion.com. Any infringement will be prosecuted under
-*  applicable laws. 
-*/
 import * as _base from '@syncfusion/ej2-base';
 
 export declare namespace ej {

package/package.json

@@ -1,164 +1,5 @@
 {
-  "_from": "@syncfusion/ej2-base@*",
-  "_id": "@syncfusion/ej2-base@20.2.36",
-  "_inBundle": false,
-  "_integrity": "sha512-PVVdLzKeoDUW4CQ7OC3O+gWeFMLnll6YsVnM/pJkUYo7ny/CZ6FvlHF7YZvTqcUCM6ndZebEom30WKk4YtKecA==",
-  "_location": "/@syncfusion/ej2-base",
-  "_phantomChildren": {},
-  "_requested": {
-    "type": "range",
-    "registry": true,
-    "raw": "@syncfusion/ej2-base@*",
-    "name": "@syncfusion/ej2-base",
-    "escapedName": "@syncfusion%2fej2-base",
-    "scope": "@syncfusion",
-    "rawSpec": "*",
-    "saveSpec": null,
-    "fetchSpec": "*"
-  },
-  "_requiredBy": [
-    "/",
-    "/@syncfusion/ej2",
-    "/@syncfusion/ej2-angular-barcode-generator",
-    "/@syncfusion/ej2-angular-base",
-    "/@syncfusion/ej2-angular-buttons",
-    "/@syncfusion/ej2-angular-calendars",
-    "/@syncfusion/ej2-angular-charts",
-    "/@syncfusion/ej2-angular-circulargauge",
-    "/@syncfusion/ej2-angular-diagrams",
-    "/@syncfusion/ej2-angular-documenteditor",
-    "/@syncfusion/ej2-angular-dropdowns",
-    "/@syncfusion/ej2-angular-filemanager",
-    "/@syncfusion/ej2-angular-gantt",
-    "/@syncfusion/ej2-angular-grids",
-    "/@syncfusion/ej2-angular-heatmap",
-    "/@syncfusion/ej2-angular-inplace-editor",
-    "/@syncfusion/ej2-angular-inputs",
-    "/@syncfusion/ej2-angular-kanban",
-    "/@syncfusion/ej2-angular-layouts",
-    "/@syncfusion/ej2-angular-lineargauge",
-    "/@syncfusion/ej2-angular-lists",
-    "/@syncfusion/ej2-angular-maps",
-    "/@syncfusion/ej2-angular-navigations",
-    "/@syncfusion/ej2-angular-notifications",
-    "/@syncfusion/ej2-angular-pdfviewer",
-    "/@syncfusion/ej2-angular-pivotview",
-    "/@syncfusion/ej2-angular-popups",
-    "/@syncfusion/ej2-angular-progressbar",
-    "/@syncfusion/ej2-angular-querybuilder",
-    "/@syncfusion/ej2-angular-richtexteditor",
-    "/@syncfusion/ej2-angular-schedule",
-    "/@syncfusion/ej2-angular-splitbuttons",
-    "/@syncfusion/ej2-angular-spreadsheet",
-    "/@syncfusion/ej2-angular-treegrid",
-    "/@syncfusion/ej2-angular-treemap",
-    "/@syncfusion/ej2-barcode-generator",
-    "/@syncfusion/ej2-buttons",
-    "/@syncfusion/ej2-calendars",
-    "/@syncfusion/ej2-charts",
-    "/@syncfusion/ej2-circulargauge",
-    "/@syncfusion/ej2-data",
-    "/@syncfusion/ej2-diagrams",
-    "/@syncfusion/ej2-documenteditor",
-    "/@syncfusion/ej2-drawings",
-    "/@syncfusion/ej2-dropdowns",
-    "/@syncfusion/ej2-excel-export",
-    "/@syncfusion/ej2-filemanager",
-    "/@syncfusion/ej2-gantt",
-    "/@syncfusion/ej2-grids",
-    "/@syncfusion/ej2-heatmap",
-    "/@syncfusion/ej2-inplace-editor",
-    "/@syncfusion/ej2-inputs",
-    "/@syncfusion/ej2-kanban",
-    "/@syncfusion/ej2-layouts",
-    "/@syncfusion/ej2-lineargauge",
-    "/@syncfusion/ej2-lists",
-    "/@syncfusion/ej2-maps",
-    "/@syncfusion/ej2-navigations",
-    "/@syncfusion/ej2-notifications",
-    "/@syncfusion/ej2-pdfviewer",
-    "/@syncfusion/ej2-pivotview",
-    "/@syncfusion/ej2-popups",
-    "/@syncfusion/ej2-progressbar",
-    "/@syncfusion/ej2-querybuilder",
-    "/@syncfusion/ej2-react-barcode-generator",
-    "/@syncfusion/ej2-react-base",
-    "/@syncfusion/ej2-react-buttons",
-    "/@syncfusion/ej2-react-calendars",
-    "/@syncfusion/ej2-react-charts",
-    "/@syncfusion/ej2-react-circulargauge",
-    "/@syncfusion/ej2-react-diagrams",
-    "/@syncfusion/ej2-react-documenteditor",
-    "/@syncfusion/ej2-react-dropdowns",
-    "/@syncfusion/ej2-react-filemanager",
-    "/@syncfusion/ej2-react-gantt",
-    "/@syncfusion/ej2-react-grids",
-    "/@syncfusion/ej2-react-heatmap",
-    "/@syncfusion/ej2-react-inplace-editor",
-    "/@syncfusion/ej2-react-inputs",
-    "/@syncfusion/ej2-react-kanban",
-    "/@syncfusion/ej2-react-layouts",
-    "/@syncfusion/ej2-react-lineargauge",
-    "/@syncfusion/ej2-react-lists",
-    "/@syncfusion/ej2-react-maps",
-    "/@syncfusion/ej2-react-navigations",
-    "/@syncfusion/ej2-react-notifications",
-    "/@syncfusion/ej2-react-pdfviewer",
-    "/@syncfusion/ej2-react-pivotview",
-    "/@syncfusion/ej2-react-popups",
-    "/@syncfusion/ej2-react-progressbar",
-    "/@syncfusion/ej2-react-querybuilder",
-    "/@syncfusion/ej2-react-richtexteditor",
-    "/@syncfusion/ej2-react-schedule",
-    "/@syncfusion/ej2-react-splitbuttons",
-    "/@syncfusion/ej2-react-spreadsheet",
-    "/@syncfusion/ej2-react-treegrid",
-    "/@syncfusion/ej2-react-treemap",
-    "/@syncfusion/ej2-richtexteditor",
-    "/@syncfusion/ej2-schedule",
-    "/@syncfusion/ej2-splitbuttons",
-    "/@syncfusion/ej2-spreadsheet",
-    "/@syncfusion/ej2-svg-base",
-    "/@syncfusion/ej2-treegrid",
-    "/@syncfusion/ej2-treemap",
-    "/@syncfusion/ej2-vue-barcode-generator",
-    "/@syncfusion/ej2-vue-base",
-    "/@syncfusion/ej2-vue-buttons",
-    "/@syncfusion/ej2-vue-calendars",
-    "/@syncfusion/ej2-vue-charts",
-    "/@syncfusion/ej2-vue-circulargauge",
-    "/@syncfusion/ej2-vue-diagrams",
-    "/@syncfusion/ej2-vue-documenteditor",
-    "/@syncfusion/ej2-vue-dropdowns",
-    "/@syncfusion/ej2-vue-filemanager",
-    "/@syncfusion/ej2-vue-gantt",
-    "/@syncfusion/ej2-vue-grids",
-    "/@syncfusion/ej2-vue-heatmap",
-    "/@syncfusion/ej2-vue-inplace-editor",
-    "/@syncfusion/ej2-vue-inputs",
-    "/@syncfusion/ej2-vue-kanban",
-    "/@syncfusion/ej2-vue-layouts",
-    "/@syncfusion/ej2-vue-lineargauge",
-    "/@syncfusion/ej2-vue-lists",
-    "/@syncfusion/ej2-vue-maps",
-    "/@syncfusion/ej2-vue-navigations",
-    "/@syncfusion/ej2-vue-notifications",
-    "/@syncfusion/ej2-vue-pdfviewer",
-    "/@syncfusion/ej2-vue-pivotview",
-    "/@syncfusion/ej2-vue-popups",
-    "/@syncfusion/ej2-vue-progressbar",
-    "/@syncfusion/ej2-vue-querybuilder",
-    "/@syncfusion/ej2-vue-richtexteditor",
-    "/@syncfusion/ej2-vue-schedule",
-    "/@syncfusion/ej2-vue-splitbuttons",
-    "/@syncfusion/ej2-vue-spreadsheet",
-    "/@syncfusion/ej2-vue-treegrid",
-    "/@syncfusion/ej2-vue-treemap"
-  ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-base/-/ej2-base-20.2.36.tgz",
-  "_shasum": "32d82d3499a3fb502a4e982ec6725dc535c1f06a",
-  "_spec": "@syncfusion/ej2-base@*",
-  "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
+
   "author": {
     "name": "Syncfusion Inc."
   },
@@ -210,7 +51,7 @@
     "type": "git",
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
+  "sideEffects": true,
   "typings": "index.d.ts",
-  "version": "20.2.38",
-  "sideEffects": true
-}
+  "version": "20.2.39"
+}

package/src/draggable.d.ts

@@ -331,6 +331,9 @@ export declare class Draggable extends Base<HTMLElement> implements INotifyPrope
     private getProcessedPositionValue;
     private calculateParentPosition;
     private intDrag;
+    private getScrollParent;
+    private getScrollPosition;
+    private getPathElements;
     private triggerOutFunction;
     private getDragPosition;
     private getDocumentWidthHeight;

package/src/draggable.js

@@ -510,23 +510,30 @@ var Draggable = /** @class */ (function (_super) {
             draEleTop -= this.parentScrollY;
             draEleLeft -= this.parentScrollX;
         }
-        if (this.helperElement.classList.contains('e-treeview')) {
-            var body = document.body;
-            var html = document.documentElement;
-            var tempHeight = Math.max(body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
-            var tempWidth = Math.max(body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth);
-            if (draEleTop > tempHeight) {
-                draEleTop = tempHeight;
-            }
-            if (draEleLeft > tempWidth) {
-                draEleLeft = tempWidth;
-            }
-        }
         var dragValue = this.getProcessedPositionValue({ top: draEleTop + 'px', left: draEleLeft + 'px' });
         setStyleAttribute(helperElement, this.getDragPosition(dragValue));
-        if (!this.elementInViewport(helperElement) && this.enableAutoScroll) {
+        if (!this.elementInViewport(helperElement) && this.enableAutoScroll && !this.helperElement.classList.contains('e-treeview')) {
             this.helperElement.scrollIntoView();
         }
+        var elements = document.querySelectorAll(':hover');
+        if (this.enableAutoScroll && this.helperElement.classList.contains('e-treeview')) {
+            if (elements.length === 0) {
+                elements = this.getPathElements(evt);
+            }
+            /* tslint:disable no-any */
+            var scrollParent = this.getScrollParent(elements, false);
+            if (this.elementInViewport(this.helperElement)) {
+                this.getScrollPosition(scrollParent, draEleTop);
+            }
+            else if (!this.elementInViewport(this.helperElement)) {
+                elements = [].slice.call(document.querySelectorAll(':hover'));
+                if (elements.length === 0) {
+                    elements = this.getPathElements(evt);
+                }
+                scrollParent = this.getScrollParent(elements, true);
+                this.getScrollPosition(scrollParent, draEleTop);
+            }
+        }
         this.dragProcessStarted = true;
         this.prevLeft = left;
         this.prevTop = top;
@@ -535,6 +542,48 @@ var Draggable = /** @class */ (function (_super) {
         this.pageX = pagex;
         this.pageY = pagey;
     };
+    /* tslint:disable no-any */
+    Draggable.prototype.getScrollParent = function (node, reverse) {
+        /* tslint:disable no-any */
+        var nodeEl = reverse ? node.reverse() : node;
+        var hasScroll;
+        for (var i = nodeEl.length - 1; i >= 0; i--) {
+            hasScroll = window.getComputedStyle(nodeEl[i])['overflow-y'];
+            if ((hasScroll === 'auto' || hasScroll === 'scroll')
+                && nodeEl[i].scrollHeight > nodeEl[i].clientHeight) {
+                return nodeEl[i];
+            }
+        }
+        hasScroll = window.getComputedStyle(document.scrollingElement)['overflow-y'];
+        if (hasScroll === 'visible') {
+            document.scrollingElement.style.overflow = 'auto';
+            return document.scrollingElement;
+        }
+    };
+    Draggable.prototype.getScrollPosition = function (nodeEle, draEleTop) {
+        if (nodeEle && nodeEle === document.scrollingElement) {
+            if ((nodeEle.clientHeight - nodeEle.getBoundingClientRect().top - this.helperElement.clientHeight) < draEleTop
+                && nodeEle.getBoundingClientRect().height > draEleTop) {
+                nodeEle.scrollTop += this.helperElement.clientHeight;
+            }
+            else if (nodeEle.scrollHeight - nodeEle.clientHeight > draEleTop) {
+                nodeEle.scrollTop -= this.helperElement.clientHeight;
+            }
+        }
+        else if (nodeEle && nodeEle !== document.scrollingElement) {
+            if ((nodeEle.clientHeight + nodeEle.getBoundingClientRect().top - this.helperElement.clientHeight) < draEleTop) {
+                nodeEle.scrollTop += this.helperElement.clientHeight;
+            }
+            else if (nodeEle.getBoundingClientRect().top > (draEleTop - this.helperElement.clientHeight)) {
+                nodeEle.scrollTop -= this.helperElement.clientHeight;
+            }
+        }
+    };
+    Draggable.prototype.getPathElements = function (evt) {
+        var elementTop = evt.clientX > 0 ? evt.clientX : 0;
+        var elementLeft = evt.clientY > 0 ? evt.clientY : 0;
+        return document.elementsFromPoint(elementTop, elementLeft);
+    };
     Draggable.prototype.triggerOutFunction = function (evt, eleObj) {
         this.hoverObject.instance.intOut(evt, eleObj.target);
         this.hoverObject.instance.dragData[this.scope] = null;