@syncfusion/ej2-layouts 19.3.44 → 19.4.43

package/dist/es6/ej2-layouts.es2015.js

@@ -97,23 +97,6 @@ let Splitter = class Splitter extends Component {
      */
     constructor(options, element) {
         super(options, element);
-        this.allPanes = [];
-        this.paneOrder = [];
-        this.separatorOrder = [];
-        this.allBars = [];
-        this.previousCoordinates = {};
-        this.currentCoordinates = {};
-        this.updatePrePaneInPercentage = false;
-        this.updateNextPaneInPercentage = false;
-        this.panesDimensions = [];
-        this.border = 0;
-        this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible',
-            'data-resizable', 'data-content', 'data-collapsed'];
-        this.validElementAttributes = ['data-orientation', 'data-width', 'data-height'];
-        this.iconsDelay = 300;
-        this.templateElement = [];
-        this.collapseFlag = false;
-        this.expandFlag = true;
     }
     /**
      * Gets called when the model property changes.The data that describes the old and new values of the property that changed.
@@ -235,8 +218,32 @@ let Splitter = class Splitter extends Component {
         }
         this.allPanes[index].classList.add(STATIC_PANE);
     }
+    initializeValues() {
+        this.allPanes = [];
+        this.paneOrder = [];
+        this.separatorOrder = [];
+        this.allBars = [];
+        this.previousCoordinates = {};
+        this.currentCoordinates = {};
+        this.updatePrePaneInPercentage = false;
+        this.updateNextPaneInPercentage = false;
+        this.panesDimensions = [];
+        this.border = 0;
+        this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible',
+            'data-resizable', 'data-content', 'data-collapsed'];
+        this.validElementAttributes = ['data-orientation', 'data-width', 'data-height'];
+        this.iconsDelay = 300;
+        this.templateElement = [];
+        this.collapseFlag = false;
+        this.expandFlag = true;
+    }
     preRender() {
+        this.initializeValues();
         this.onReportWindowSize = this.reportWindowSize.bind(this);
+        this.onMouseMoveHandler = this.onMouseMove.bind(this);
+        this.onMouseUpHandler = this.onMouseUp.bind(this);
+        this.onTouchMoveHandler = this.onMouseMove.bind(this);
+        this.onTouchEndHandler = this.onMouseUp.bind(this);
         this.wrapper = this.element.cloneNode(true);
         this.wrapperParent = this.element.parentElement;
         removeClass([this.wrapper], ['e-control', 'e-lib', ROOT]);
@@ -1050,21 +1057,21 @@ let Splitter = class Splitter extends Component {
         }
     }
     wireResizeEvents() {
-        EventHandler.add(document, 'mousemove', this.onMouseMove, this);
-        EventHandler.add(document, 'mouseup', this.onMouseUp, this);
+        document.addEventListener('mousemove', this.onMouseMoveHandler, true);
+        document.addEventListener('mouseup', this.onMouseUpHandler, true);
         const touchMoveEvent = (Browser.info.name === 'msie') ? 'pointermove' : 'touchmove';
         const touchEndEvent = (Browser.info.name === 'msie') ? 'pointerup' : 'touchend';
-        EventHandler.add(document, touchMoveEvent, this.onMouseMove, this);
-        EventHandler.add(document, touchEndEvent, this.onMouseUp, this);
+        document.addEventListener(touchMoveEvent, this.onTouchMoveHandler, true);
+        document.addEventListener(touchEndEvent, this.onTouchEndHandler, true);
     }
     unwireResizeEvents() {
         this.element.ownerDocument.defaultView.removeEventListener('resize', this.onReportWindowSize);
         const touchMoveEvent = (Browser.info.name === 'msie') ? 'pointermove' : 'touchmove';
         const touchEndEvent = (Browser.info.name === 'msie') ? 'pointerup' : 'touchend';
-        EventHandler.remove(document, 'mousemove', this.onMouseMove);
-        EventHandler.remove(document, 'mouseup', this.onMouseUp);
-        EventHandler.remove(document, touchMoveEvent, this.onMouseMove);
-        EventHandler.remove(document, touchEndEvent, this.onMouseUp);
+        document.removeEventListener('mousemove', this.onMouseMoveHandler, true);
+        document.removeEventListener('mouseup', this.onMouseUpHandler, true);
+        document.removeEventListener(touchMoveEvent, this.onTouchMoveHandler, true);
+        document.removeEventListener(touchEndEvent, this.onTouchEndHandler, true);
     }
     wireClickEvents() {
         EventHandler.add(this.currentSeparator, 'touchstart click', this.clickHandler, this);
@@ -2846,10 +2853,6 @@ let DashboardLayout = class DashboardLayout extends Component {
                 currentX = this.getMaxWidth(panelModel) - this.elementWidth;
                 this.mOffX = dX - currentX;
             }
-            else if (this.elementX + this.elementWidth + dX > this.maxLeft) {
-                currentX = this.maxLeft - this.elementX - this.elementWidth;
-                this.mOffX = dX - currentX;
-            }
             this.elementWidth += currentX;
         }
         el.style.top = this.elementY + 'px';
@@ -3089,7 +3092,6 @@ let DashboardLayout = class DashboardLayout extends Component {
                     const row = parseInt(ele.getAttribute('data-row'), 10);
                     const col = parseInt(ele.getAttribute('data-col'), 10);
                     this.panelPropertyChange(cellInstance, { row: row, col: col });
-                    this.updatePanelLayout(ele, cellInstance);
                     this.setHeightAndWidth(ele, this.getCellInstance(ele.id));
                     this.setPanelPosition(ele, row, col);
                     this.updateRowHeight();