@syncfusion/ej2-layouts - npm Package Compare versions

Comparing version 16.4.44 to 16.4.47

CHANGELOG.md

@@ -7,2 +7,10 @@ # Changelog
 
+#### Bug Fixes
+
+- The issue with dynamically updating the pane size has been fixed.
+
+## 16.4.44 (2018-12-24)
+
+### Splitter
+
 #### New Features
@@ -9,0 +17,0 @@

dist/ej2-layouts.umd.min.js

 /*!
 *  filename: ej2-layouts.umd.min.js
-*  version : 16.4.44
-*  Copyright Syncfusion Inc. 2001 - 2018. All rights reserved.
+*  version : 16.4.47
+*  Copyright Syncfusion Inc. 2001 - 2019. All rights reserved.
 *  Use of this code is subject to the terms of our license.
@@ -10,3 +10,3 @@ *  A copy of the current license can be obtained at any time by e-mailing
 */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@syncfusion/ej2-base")):"function"==typeof define&&define.amd?define(["exports","@syncfusion/ej2-base"],t):t(e.ej={},e.ej2Base)}(this,function(e,t){"use strict";var i=function(){var e=function(t,i){return(e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])})(t,i)};return function(t,i){function n(){this.constructor=t}e(t,i),t.prototype=null===i?Object.create(i):(n.prototype=i.prototype,new n)}}(),n=function(e,t,i,n){var s,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,n);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(r<3?s(a):r>3?s(t,i,a):s(t,i))||a);return r>3&&a&&Object.defineProperty(t,i,a),a},s="e-splitter",r="e-splitter-horizontal",a="e-splitter-vertical",o="e-pane",h="e-pane-horizontal",l="e-pane-vertical",d="e-split-bar",p="e-split-bar-horizontal",u="e-split-bar-vertical",c="e-static-pane",P="e-scrollable",v="e-resize-handler",f="e-resizable-split-bar",g="e-split-bar-hover",x="e-split-bar-active",m="e-hide-handler",y="e-disabled",C=function(e){function s(){return null!==e&&e.apply(this,arguments)||this}return i(s,e),n([t.Property()],s.prototype,"size",void 0),n([t.Property(!0)],s.prototype,"resizable",void 0),n([t.Property(null)],s.prototype,"min",void 0),n([t.Property(null)],s.prototype,"max",void 0),n([t.Property()],s.prototype,"content",void 0),s}(t.ChildProperty),S=function(e){function S(t,i){var n=e.call(this,t,i)||this;return n.allPanes=[],n.paneOrder=[],n.separatorOrder=[],n.allBars=[],n.previousCoordinates={},n.currentCoordinates={},n.updatePrePaneInPercentage=!1,n.updateNextPaneInPercentage=!1,n.panesDimensions=[],n.border=0,n.validDataAttributes=["data-size","data-min","data-max","data-collapsible","data-resizable"],n.validElementAttributes=["data-orientation","data-width","data-height"],n}return i(S,e),S.prototype.onPropertyChanged=function(e,i){if(this.element.classList.contains(s))for(var n=0,r=Object.keys(e);n<r.length;n++){switch(r[n]){case"height":this.setSplitterSize(this.element,e.height,"height");break;case"width":this.setSplitterSize(this.element,e.width,"width");break;case"cssClass":this.setCssClass(e.cssClass);break;case"enabled":this.isEnabled(this.enabled);break;case"separatorSize":this.setSeparatorSize(e.separatorSize);break;case"orientation":this.changeOrientation(e.orientation);break;case"paneSettings":if(!(e.paneSettings instanceof Array&&i.paneSettings instanceof Array))for(var a=Object.keys(e.paneSettings),o=0;o<a.length;o++){var h=parseInt(Object.keys(e.paneSettings)[o],10),l=Object.keys(e.paneSettings[h])[0],d=Object(e.paneSettings[h])[l];h=this.enableRtl?this.allBars.length-1-h:h,"content"===l&&(this.allPanes[h].innerHTML="",this.setTemplate(d,this.allPanes[h])),"resizable"===l&&(t.EventHandler.remove(this.allBars[h],"mousedown",this.onMouseDown),d?(t.EventHandler.add(this.allBars[h],"mousedown",this.onMouseDown,this),this.currentSeparator=this.allBars[h],this.isResizable()&&(this.showResizer(this.allBars[h]),this.allBars[h].classList.add(f))):(this.hideResizer(this.allBars[h]),this.allBars[h].classList.remove(f))),"size"===l&&(this.allPanes[h].style.flexBasis=d)}break;case"enableRtl":this.setRTL(e.enableRtl)}}},S.prototype.preRender=function(){this.wrapper=this.element.cloneNode(!0),this.wrapperParent=this.element.parentElement,t.removeClass([this.wrapper],["e-control","e-lib",s]);var e="Horizontal"===this.orientation?r:a;t.addClass([this.element],e),t.Browser.isDevice&&t.addClass([this.element],"e-splitter-touch")},S.prototype.getPersistData=function(){return this.addOnPersist([])},S.prototype.getModuleName=function(){return"splitter"},S.prototype.render=function(){this.checkDataAttributes(),this.setCssClass(this.cssClass),this.isEnabled(this.enabled),this.setDimension(this.getHeight(this.element),this.getWidth(this.element)),this.createSplitPane(this.element),this.addSeparator(this.element),this.getPanesDimensions(),this.setRTL(this.enableRtl)},S.prototype.checkDataAttributes=function(){for(var e,i,n=0;n<this.validElementAttributes.length;n++)i=this.element.getAttribute(this.validElementAttributes[n]),t.isNullOrUndefined(i)||(this[e=this.removeDataPrefix(this.validElementAttributes[n])]=i);for(var s=0;s<this.element.children.length;s++)for(var r=0;r<this.validDataAttributes.length;r++)if(i=this.element.children[s].getAttribute(this.validDataAttributes[r]),!t.isNullOrUndefined(i)){i="collapsible"===(e=this.removeDataPrefix(this.validDataAttributes[r]))||"resizable"===e?"true"===i:i,t.isNullOrUndefined(this.paneSettings[s])&&(this.paneSettings[s]={size:"",min:null,max:null,content:"",resizable:!0});var a=this.paneSettings[s][e];"resizable"===e&&this.paneSettings[s].resizable&&(this.paneSettings[s][e]=i),(t.isNullOrUndefined(a)||""===a)&&(this.paneSettings[s][e]=i)}},S.prototype.removeDataPrefix=function(e){return e.slice(e.lastIndexOf("-")+1)},S.prototype.setRTL=function(e){e?t.addClass([this.element],"e-rtl"):t.removeClass([this.element],"e-rtl")},S.prototype.setSplitterSize=function(e,i,n){var s="width"===n?{width:t.formatUnit(i)}:{height:t.formatUnit(i)};t.setStyleAttribute(e,s)},S.prototype.getPanesDimensions=function(){for(var e=0;e<this.allPanes.length;e++)"Horizontal"===this.orientation?this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().width):this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().height)},S.prototype.setCssClass=function(e){""!==e&&t.addClass([this.element],e.split(" "))},S.prototype.hideResizer=function(e){t.addClass([t.select("."+v,e)],m)},S.prototype.showResizer=function(e){t.removeClass([t.select("."+v,e)],m)},S.prototype.isEnabled=function(e){e?t.removeClass([this.element],y):t.addClass([this.element],y)},S.prototype.setSeparatorSize=function(e){for(var i=t.isNullOrUndefined(e)?"auto":e+"px",n="Horizontal"===this.orientation?p:u,s=0;s<this.allBars.length;s++){var r=t.selectAll("."+n,this.element)[s],a=t.selectAll("."+v,r)[0];"Horizontal"===this.orientation?(r.style.width=i,t.isNullOrUndefined(a)||(a.style.width=i)):(r.style.height=i,t.isNullOrUndefined(a)||(a.style.height=i))}},S.prototype.changeOrientation=function(e){var t="Vertical"===e;this.element.classList.remove(t?r:a),this.element.classList.add(t?a:r),this.element.removeAttribute("aria-orientation"),this.element.setAttribute("aria-orientation",e);for(var i=0;i<this.allPanes.length;i++)this.allPanes[i].classList.remove(t?h:l),this.allPanes[i].classList.add(t?l:h);for(i=0;i<this.allBars.length;i++)this.allBars[i].classList.remove(t?p:u),this.allBars[i].classList.add(t?u:p)},S.prototype.getPrevPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2+1:(t-1)/2;return e.parentElement.children[i]},S.prototype.getNextPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2:(t-1)/2+1;return e.parentElement.children[i]},S.prototype.addResizeHandler=function(e){var i=this.createElement("div");t.addClass([i],[v,"e-icons"]);var n=t.isNullOrUndefined(this.separatorSize)?"1px":this.separatorSize+"px";"Horizontal"===this.orientation?i.style.width=n:i.style.height=n,e.appendChild(i)},S.prototype.getHeight=function(e){this.height;return""!==e.style.height&&"100%"===this.height?e.style.height:this.height},S.prototype.getWidth=function(e){this.width;return""!==e.style.width&&"100%"===this.width?e.style.width:this.width},S.prototype.setDimension=function(e,i){t.setStyleAttribute(this.element,{height:e,width:i})},S.prototype.createSeparator=function(e){var i=this.createElement("div");return this.allBars.push(i),"Horizontal"===this.orientation?(t.addClass([i],[d,p]),i.style.width=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"):(t.addClass([i],[d,u]),i.style.height=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"),this.addMouseActions(i),this.addResizeHandler(i),i},S.prototype.addSeparator=function(e){for(var i=this.allPanes.length,n=e.children,s=0;s<i;s++)if(s<i-1){var r=this.createSeparator(s);if(t.setStyleAttribute(r,{order:2*s+1}),this.separatorOrder.push(2*s+1),n[s].parentNode.appendChild(r),this.currentSeparator=r,r.setAttribute("role","separator"),this.isResizable()){t.EventHandler.add(r,"mousedown",this.onMouseDown,this);var a="msie"===t.Browser.info.name?"pointerdown":"touchstart";t.EventHandler.add(r,a,this.onMouseDown,this),r.classList.add(f)}else this.hideResizer(r)}},S.prototype.isResizable=function(){var e=!1;return(!t.isNullOrUndefined(this.paneSettings[this.getPreviousPaneIndex()])&&this.paneSettings[this.getPreviousPaneIndex()].resizable&&!t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()])&&this.paneSettings[this.getNextPaneIndex()].resizable||t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()]))&&(e=!0),e},S.prototype.addMouseActions=function(e){e.addEventListener("mouseover",function(){t.addClass([e],[g])}),e.addEventListener("mouseout",function(){t.removeClass([e],[g])})},S.prototype.getEventType=function(e){return e.indexOf("mouse")>-1?"mouse":"touch"},S.prototype.updateCurrentSeparator=function(e){this.currentSeparator=this.isSeparator(e)?e:e.parentElement},S.prototype.isSeparator=function(e){var t=!0;return(e.classList.contains(v)||e.classList.contains("e-split-line"))&&(t=!1),t},S.prototype.isMouseEvent=function(e){var i=!1;return("mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType))&&(i=!0),i},S.prototype.updateCursorPosition=function(e,i){if(this.isMouseEvent(e))this.changeCoordinates({x:e.pageX,y:e.pageY},i);else{var n="msie"!==t.Browser.info.name?e.touches[0]:e;this.changeCoordinates({x:n.pageX,y:n.pageY},i)}},S.prototype.changeCoordinates=function(e,t){"previous"===t?this.previousCoordinates=e:this.currentCoordinates=e},S.prototype.wireResizeEvents=function(){t.EventHandler.add(document,"mousemove",this.onMouseMove,this),t.EventHandler.add(document,"mouseup",this.onMouseUp,this);var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.add(document,e,this.onMouseMove,this),t.EventHandler.add(document,i,this.onMouseUp,this)},S.prototype.unwireResizeEvents=function(){var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.remove(document,"mousemove",this.onMouseMove),t.EventHandler.remove(document,"mouseup",this.onMouseUp),t.EventHandler.remove(document,e,this.onMouseMove),t.EventHandler.remove(document,i,this.onMouseUp)},S.prototype.onMouseDown=function(e){e.preventDefault();var i=e.target;this.updateCurrentSeparator(i),t.addClass([this.currentSeparator],x),this.updateCursorPosition(e,"previous"),this.getPaneDetails();var n={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.getPreviousPaneIndex(),this.getNextPaneIndex()],separator:this.currentSeparator,cancel:!1};if(this.trigger("resizeStart",n),!n.cancel)if(this.wireResizeEvents(),this.previousPane.style.flexBasis.indexOf("%")>0||this.nextPane.style.flexBasis.indexOf("%")>0){var s=this.updatePaneFlexBasis(this.previousPane),r=this.updatePaneFlexBasis(this.nextPane);this.totalPercent=s+r,this.totalWidth=this.convertPercentageToPixel(this.totalPercent+"%")}else this.totalWidth="Horizontal"===this.orientation?this.previousPane.offsetWidth+this.nextPane.offsetWidth:this.previousPane.offsetHeight+this.nextPane.offsetHeight},S.prototype.updatePaneFlexBasis=function(e){var t;if(e.style.flexBasis.indexOf("%")>0)t=this.removePercentageUnit(e.style.flexBasis);else if(""!==e.style.flexBasis)t=this.convertPixelToPercentage(this.convertPixelToNumber(e.style.flexBasis));else{var i="Horizontal"===this.orientation?e.offsetWidth+this.currentSeparator.offsetWidth:e.offsetHeight+this.currentSeparator.offsetHeight;t=this.convertPixelToPercentage(i)}return t},S.prototype.removePercentageUnit=function(e){return parseFloat(e.slice(0,e.indexOf("%")))},S.prototype.convertPercentageToPixel=function(e,i){var n,s=e.toString();if(s.indexOf("%")>-1){n=parseFloat(s.slice(0,s.indexOf("%")));var r=void 0;r=t.isNullOrUndefined(i)?"Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight:this.panesDimensions[this.allPanes.indexOf(i)],n=Math.ceil(r*(n/100))}else n=parseInt(s,10);return n},S.prototype.convertPixelToPercentage=function(e){return e/("Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight)*100},S.prototype.convertPixelToNumber=function(e){return e.indexOf("p")>-1?parseFloat(e.slice(0,e.indexOf("p"))):parseFloat(e)},S.prototype.calcDragPosition=function(e,t){var i,n;return i="Horizontal"===this.orientation?this.currentCoordinates.x-e:this.currentCoordinates.y-e,n=i/t,(n=n>1?1:n<0?0:n)*t},S.prototype.getSeparatorPosition=function(e){this.updateCursorPosition(e,"current");var t="Horizontal"===this.orientation?this.element.getBoundingClientRect().left:this.element.getBoundingClientRect().top,i="Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight;return this.calcDragPosition(t,i)},S.prototype.getMinMax=function(e,i,n){var s="min"===n?0:null,r=null;return"min"===n?t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(r=this.paneSettings[e].min):t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(r=this.paneSettings[e].max),this.paneSettings.length>0&&!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(r)?(r.indexOf("%")>0&&(r=this.convertPercentageToPixel(r).toString()),this.convertPixelToNumber(r)):s},S.prototype.getPreviousPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e+1:e},S.prototype.getNextPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e:e+1},S.prototype.getPaneDetails=function(){this.order=parseInt(this.currentSeparator.style.order,10),this.previousPane=this.getPrevPane(this.currentSeparator,this.order),this.nextPane=this.getNextPane(this.currentSeparator,this.order),this.prevPaneIndex=this.getPreviousPaneIndex(),this.nextPaneIndex=this.getNextPaneIndex()},S.prototype.getPaneHeight=function(e){return"Horizontal"===this.orientation?e.offsetWidth.toString():e.offsetHeight.toString()},S.prototype.boundingRectValues=function(e){return"Horizontal"===this.orientation?e.getBoundingClientRect().width:e.getBoundingClientRect().height},S.prototype.isValidSize=function(e){var i=!1;return!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(this.paneSettings[e].size)&&this.paneSettings[e].size.indexOf("%")>-1&&(i=!0),i},S.prototype.getPaneDimensions=function(){if(this.previousPaneHeightWidth=""===this.previousPane.style.flexBasis?this.getPaneHeight(this.previousPane):this.previousPane.style.flexBasis,this.nextPaneHeightWidth=""===this.nextPane.style.flexBasis?this.getPaneHeight(this.nextPane):this.nextPane.style.flexBasis,this.paneSettings.length<1)return this.prePaneDimenson=this.boundingRectValues(this.previousPane),void(this.nextPaneDimension=this.boundingRectValues(this.nextPane));this.isValidSize(this.prevPaneIndex)&&(this.previousPaneHeightWidth=this.convertPercentageToPixel(this.previousPaneHeightWidth).toString(),this.updatePrePaneInPercentage=!0),this.isValidSize(this.nextPaneIndex)&&(this.nextPaneHeightWidth=this.convertPercentageToPixel(this.nextPaneHeightWidth).toString(),this.updateNextPaneInPercentage=!0),this.prePaneDimenson=this.convertPixelToNumber(this.previousPaneHeightWidth.toString()),this.nextPaneDimension=this.convertPixelToNumber(this.nextPaneHeightWidth.toString())},S.prototype.checkCoordinates=function(e,t){var i=!0;return e!==this.previousCoordinates.x&&t!==this.previousCoordinates.y||(i=!1),i},S.prototype.isCursorMoved=function(e){return"mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType)?this.checkCoordinates(e.pageX,e.pageY):"msie"!==t.Browser.info.name?this.checkCoordinates(e.touches[0].pageX,e.touches[0].pageY):this.checkCoordinates(e.pageX,e.pageY)},S.prototype.getBorder=function(){this.border=0;var e="Horizontal"===this.orientation?(this.element.offsetWidth-this.element.clientWidth)/2:(this.element.offsetHeight-this.element.clientHeight)/2;this.border="chrome"!==t.Browser.info.name?this.border:e},S.prototype.onMouseMove=function(e){if(this.isCursorMoved(e)){this.getPaneDetails(),this.getPaneDimensions();var t={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],paneSize:[this.prePaneDimenson,this.nextPaneDimension],separator:this.currentSeparator};this.trigger("resizing",t);var i,n=this.validateDraggedPosition(this.getSeparatorPosition(e),this.prePaneDimenson,this.nextPaneDimension);if(this.getBorder(),i="Horizontal"===this.orientation?this.element.getBoundingClientRect().left+n-this.currentSeparator.getBoundingClientRect().left+this.border:this.element.getBoundingClientRect().top+n-this.currentSeparator.getBoundingClientRect().top+this.border,this.nextPaneHeightWidth="string"==typeof this.nextPaneHeightWidth&&this.nextPaneHeightWidth.indexOf("p")>-1?this.convertPixelToNumber(this.nextPaneHeightWidth):parseInt(this.nextPaneHeightWidth,10),this.prevPaneCurrentWidth=i+this.convertPixelToNumber(this.previousPaneHeightWidth),this.nextPaneCurrentWidth=this.nextPaneHeightWidth-i,this.validateMinMaxValues(),this.nextPaneCurrentWidth<0&&(this.nextPaneCurrentWidth=0),this.prevPaneCurrentWidth<0&&(this.prevPaneCurrentWidth=0),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth>this.totalWidth&&(this.nextPaneCurrentWidth<this.prevPaneCurrentWidth?this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth):this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth)),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth<this.totalWidth){var s=this.totalWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth);this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+s}this.calculateCurrentDimensions(),this.addStaticPaneClass(),this.previousPane.style.flexBasis=this.prevPaneCurrentWidth,this.nextPane.style.flexBasis=this.nextPaneCurrentWidth}},S.prototype.validateMinRange=function(e,i,n){var s,r,a=null,o=0;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(a=this.paneSettings[e].min.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i<(s=this.convertPixelToNumber(a))&&(o=i-s<=0?0:i-s,this.totalWidth=this.totalWidth-o,this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},S.prototype.validateMaxRange=function(e,i,n){var s,r,a=null;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(a=this.paneSettings[e].max.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i>(s=this.convertPixelToNumber(a))&&(this.totalWidth=this.totalWidth-(i-s),this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},S.prototype.validateMinMaxValues=function(){this.prevPaneCurrentWidth=this.validateMinRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMinRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane),this.prevPaneCurrentWidth=this.validateMaxRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMaxRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane)},S.prototype.equatePaneWidths=function(){var e;this.prevPaneCurrentWidth+this.nextPaneCurrentWidth>this.totalPercent&&(e=this.prevPaneCurrentWidth+this.nextPaneCurrentWidth-this.totalPercent,this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-e/2+"%"),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth<this.totalPercent&&(e=this.totalPercent-(this.prevPaneCurrentWidth+this.nextPaneCurrentWidth),this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+e/2+"%")},S.prototype.calculateCurrentDimensions=function(){this.updatePrePaneInPercentage||this.updateNextPaneInPercentage?(this.prevPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.prevPaneCurrentWidth))/10)),this.nextPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.nextPaneCurrentWidth))/10)),0===this.prevPaneCurrentWidth&&(this.nextPaneCurrentWidth=this.totalPercent),0===this.nextPaneCurrentWidth&&(this.prevPaneCurrentWidth=this.totalPercent),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth!==this.totalPercent?this.equatePaneWidths():(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"%"),this.prevPaneCurrentWidth=this.updatePrePaneInPercentage?this.prevPaneCurrentWidth:this.convertPercentageToPixel(this.prevPaneCurrentWidth)+"px",this.nextPaneCurrentWidth=this.updateNextPaneInPercentage?this.nextPaneCurrentWidth:this.convertPercentageToPixel(this.nextPaneCurrentWidth)+"px",this.updatePrePaneInPercentage=!1,this.updateNextPaneInPercentage=!1):(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"px",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"px")},S.prototype.addStaticPaneClass=function(){this.previousPane.classList.contains(c)||this.previousPane.classList.add(c),this.nextPane.classList.contains(c)||this.nextPane.classList.add(c)},S.prototype.validateDraggedPosition=function(e,i,n){var s="Horizontal"===this.orientation?this.currentSeparator.offsetLeft:this.currentSeparator.offsetTop,r=s-i,a=n+s,o=this.getMinMax(this.prevPaneIndex,this.previousPane,"min"),h=this.getMinMax(this.nextPaneIndex,this.nextPane,"min"),l=this.getMinMax(this.prevPaneIndex,this.previousPane,"max"),d=this.getMinMax(this.nextPaneIndex,this.nextPane,"max"),p=e;return e>a-h?p=a-h:e<r+o&&(p=r+o),t.isNullOrUndefined(l)?t.isNullOrUndefined(d)||e<a-d&&(p=a-d):e>r+l&&(p=r+l),p},S.prototype.onMouseUp=function(e){t.removeClass([this.currentSeparator],x),this.unwireResizeEvents();var i={event:e,element:this.element,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],separator:this.currentSeparator,paneSize:[this.prePaneDimenson,this.nextPaneDimension]};this.trigger("resizeStop",i)},S.prototype.panesDimension=function(e,i){var n,s=i.length;parseInt(this.getHeight(this.element),10),t.isNullOrUndefined(this.paneSettings[e])?t.setStyleAttribute(i[e],{order:2*e}):t.isNullOrUndefined(this.paneSettings[e].size)?(this.sizeFlag=!0,t.setStyleAttribute(i[e],{order:2*e})):(n=this.paneSettings[e].size,e<s&&(t.setStyleAttribute(i[e],{"flex-basis":n,order:2*e}),e<s-1?t.addClass([i[e]],c):this.sizeFlag||(i[e].style.flexBasis=null),e===s-1&&this.sizeFlag&&t.addClass([i[e]],c))),this.paneOrder.push(2*e)},S.prototype.setTemplate=function(e,i){for(var n=[],s=0,r=t.compile(e)({});s<r.length;s++){var a=r[s];n.push(a)}t.append([].slice.call(n),i)},S.prototype.createSplitPane=function(e){var i=e.children.length;if(i<this.paneSettings.length)for(var n=0;n<this.paneSettings.length;n++){var s=this.createElement("div");this.element.appendChild(s)}i=e.children.length;var r=[].slice.call(e.children);if(this.element.setAttribute("aria-orientation",this.orientation),this.element.setAttribute("role","splitter"),this.sizeFlag=!1,i>1)for(n=0;n<i;n++)1===r[n].nodeType&&(this.allPanes.push(r[n]),"Horizontal"===this.orientation?(t.addClass([r[n]],[o,h,P]),this.panesDimension(n,r)):(t.addClass([r[n]],[o,l,P]),this.panesDimension(n,r)),t.isNullOrUndefined(this.paneSettings[n])||t.isNullOrUndefined(this.paneSettings[n].content)||this.setTemplate(this.paneSettings[n].content,r[n]))},S.prototype.destroy=function(){t.detach(this.element),this.element=this.wrapper,this.wrapperParent.appendChild(this.wrapper)},S.prototype.addPaneClass=function(e){return"Horizontal"===this.orientation?t.addClass([e],[o,h,P]):t.addClass([e],[o,l,P]),e},S.prototype.removePaneOrders=function(e){for(var t=document.querySelectorAll("."+e),i=0;i<t.length;i++)t[i].style.removeProperty("order")},S.prototype.setPaneOrder=function(){for(var e=0;e<this.allPanes.length;e++)this.panesDimension(e,this.allPanes)},S.prototype.removeSeparator=function(){for(var e=0;e<this.allBars.length;e++)t.detach(this.allBars[e]);this.allBars=[]},S.prototype.updatePanes=function(){this.setPaneOrder(),this.removeSeparator(),this.addSeparator(this.element)},S.prototype.addPane=function(e,i){var n=this.createElement("div");n=this.addPaneClass(n),i=i>this.allPanes.length+1?this.allPanes.length:i;var s={size:t.isNullOrUndefined(e.size)?"":e.size,min:t.isNullOrUndefined(e.min)?null:e.min,max:t.isNullOrUndefined(e.max)?null:e.max,content:t.isNullOrUndefined(e.content)?"":e.content,resizable:!!t.isNullOrUndefined(e.resizable)||e.resizable};this.paneSettings.splice(i,0,s),"Horizontal"===this.orientation?(this.element.insertBefore(n,this.element.querySelectorAll("."+h)[i]),this.removePaneOrders(h)):(this.element.insertBefore(n,this.element.querySelectorAll("."+l)[i]),this.removePaneOrders(l)),this.allPanes.splice(i,0,n),this.updatePanes(),this.setTemplate(this.paneSettings[i].content,n),this.allPanes[this.allPanes.length-1].classList.remove(c)},S.prototype.removePane=function(e){e=e>this.allPanes.length+1?this.allPanes.length:e;var i="Horizontal"===this.orientation?h:l;t.detach(this.element.querySelectorAll("."+i)[e]),this.allPanes.splice(e,1),this.removePaneOrders(i),this.updatePanes(),this.allPanes[this.allPanes.length-1].classList.remove(c)},n([t.Property("100%")],S.prototype,"height",void 0),n([t.Property("100%")],S.prototype,"width",void 0),n([t.Collection([],C)],S.prototype,"paneSettings",void 0),n([t.Property("Horizontal")],S.prototype,"orientation",void 0),n([t.Property("")],S.prototype,"cssClass",void 0),n([t.Property(!0)],S.prototype,"enabled",void 0),n([t.Property(!1)],S.prototype,"enableRtl",void 0),n([t.Property(null)],S.prototype,"separatorSize",void 0),n([t.Event()],S.prototype,"created",void 0),n([t.Event()],S.prototype,"resizeStart",void 0),n([t.Event()],S.prototype,"resizing",void 0),n([t.Event()],S.prototype,"resizeStop",void 0),S=n([t.NotifyPropertyChanges],S)}(t.Component);e.PaneProperties=C,e.Splitter=S,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@syncfusion/ej2-base")):"function"==typeof define&&define.amd?define(["exports","@syncfusion/ej2-base"],t):t(e.ej={},e.ej2Base)}(this,function(e,t){"use strict";var i=function(){var e=function(t,i){return(e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])})(t,i)};return function(t,i){function n(){this.constructor=t}e(t,i),t.prototype=null===i?Object.create(i):(n.prototype=i.prototype,new n)}}(),n=function(e,t,i,n){var s,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,n);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(r<3?s(a):r>3?s(t,i,a):s(t,i))||a);return r>3&&a&&Object.defineProperty(t,i,a),a},s="e-splitter",r="e-splitter-horizontal",a="e-splitter-vertical",o="e-pane",h="e-pane-horizontal",l="e-pane-vertical",d="e-split-bar",p="e-split-bar-horizontal",u="e-split-bar-vertical",c="e-static-pane",P="e-scrollable",v="e-resize-handler",f="e-resizable-split-bar",g="e-split-bar-hover",x="e-split-bar-active",m="e-hide-handler",y="e-disabled",C=function(e){function s(){return null!==e&&e.apply(this,arguments)||this}return i(s,e),n([t.Property()],s.prototype,"size",void 0),n([t.Property(!0)],s.prototype,"resizable",void 0),n([t.Property(null)],s.prototype,"min",void 0),n([t.Property(null)],s.prototype,"max",void 0),n([t.Property()],s.prototype,"content",void 0),s}(t.ChildProperty),S=function(e){function S(t,i){var n=e.call(this,t,i)||this;return n.allPanes=[],n.paneOrder=[],n.separatorOrder=[],n.allBars=[],n.previousCoordinates={},n.currentCoordinates={},n.updatePrePaneInPercentage=!1,n.updateNextPaneInPercentage=!1,n.panesDimensions=[],n.border=0,n.validDataAttributes=["data-size","data-min","data-max","data-collapsible","data-resizable","data-content"],n.validElementAttributes=["data-orientation","data-width","data-height"],n}return i(S,e),S.prototype.onPropertyChanged=function(e,i){if(this.element.classList.contains(s))for(var n=0,r=Object.keys(e);n<r.length;n++){switch(r[n]){case"height":this.setSplitterSize(this.element,e.height,"height");break;case"width":this.setSplitterSize(this.element,e.width,"width");break;case"cssClass":this.setCssClass(e.cssClass);break;case"enabled":this.isEnabled(this.enabled);break;case"separatorSize":this.setSeparatorSize(e.separatorSize);break;case"orientation":this.changeOrientation(e.orientation);break;case"paneSettings":if(!(e.paneSettings instanceof Array&&i.paneSettings instanceof Array))for(var a=Object.keys(e.paneSettings),o=0;o<a.length;o++)for(var h=parseInt(Object.keys(e.paneSettings)[o],10),l=Object.keys(e.paneSettings[h]).length,d=0;d<l;d++){var p=Object.keys(e.paneSettings[h])[d],u=Object(e.paneSettings[h])[p];h=this.enableRtl?this.allBars.length-1-h:h,"content"===p&&(this.allPanes[h].innerHTML="",this.setTemplate(u,this.allPanes[h])),"resizable"===p&&(t.EventHandler.remove(this.allBars[h],"mousedown",this.onMouseDown),u?(t.EventHandler.add(this.allBars[h],"mousedown",this.onMouseDown,this),this.currentSeparator=this.allBars[h],this.isResizable()&&(this.showResizer(this.allBars[h]),this.allBars[h].classList.add(f))):(this.hideResizer(this.allBars[h]),this.allBars[h].classList.remove(f))),"size"===p&&(this.allPanes[h].style.flexBasis=u)}break;case"enableRtl":this.setRTL(e.enableRtl)}}},S.prototype.preRender=function(){this.wrapper=this.element.cloneNode(!0),this.wrapperParent=this.element.parentElement,t.removeClass([this.wrapper],["e-control","e-lib",s]);var e="Horizontal"===this.orientation?r:a;t.addClass([this.element],e),t.Browser.isDevice&&t.addClass([this.element],"e-splitter-touch")},S.prototype.getPersistData=function(){return this.addOnPersist([])},S.prototype.getModuleName=function(){return"splitter"},S.prototype.render=function(){this.checkDataAttributes(),this.setCssClass(this.cssClass),this.isEnabled(this.enabled),this.setDimension(this.getHeight(this.element),this.getWidth(this.element)),this.createSplitPane(this.element),this.addSeparator(this.element),this.getPanesDimensions(),this.setRTL(this.enableRtl)},S.prototype.checkDataAttributes=function(){for(var e,i,n=0;n<this.validElementAttributes.length;n++)i=this.element.getAttribute(this.validElementAttributes[n]),t.isNullOrUndefined(i)||(this[e=this.removeDataPrefix(this.validElementAttributes[n])]=i);for(var s=0;s<this.element.children.length;s++)for(var r=0;r<this.validDataAttributes.length;r++)if(i=this.element.children[s].getAttribute(this.validDataAttributes[r]),!t.isNullOrUndefined(i)){i="collapsible"===(e=this.removeDataPrefix(this.validDataAttributes[r]))||"resizable"===e?"true"===i:i,t.isNullOrUndefined(this.paneSettings[s])&&(this.paneSettings[s]={size:"",min:null,max:null,content:"",resizable:!0});var a=this.paneSettings[s][e];"resizable"===e&&this.paneSettings[s].resizable&&(this.paneSettings[s][e]=i),(t.isNullOrUndefined(a)||""===a)&&(this.paneSettings[s][e]=i)}},S.prototype.removeDataPrefix=function(e){return e.slice(e.lastIndexOf("-")+1)},S.prototype.setRTL=function(e){e?t.addClass([this.element],"e-rtl"):t.removeClass([this.element],"e-rtl")},S.prototype.setSplitterSize=function(e,i,n){var s="width"===n?{width:t.formatUnit(i)}:{height:t.formatUnit(i)};t.setStyleAttribute(e,s)},S.prototype.getPanesDimensions=function(){for(var e=0;e<this.allPanes.length;e++)"Horizontal"===this.orientation?this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().width):this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().height)},S.prototype.setCssClass=function(e){""!==e&&t.addClass([this.element],e.split(" "))},S.prototype.hideResizer=function(e){t.addClass([t.select("."+v,e)],m)},S.prototype.showResizer=function(e){t.removeClass([t.select("."+v,e)],m)},S.prototype.isEnabled=function(e){e?t.removeClass([this.element],y):t.addClass([this.element],y)},S.prototype.setSeparatorSize=function(e){for(var i=t.isNullOrUndefined(e)?"auto":e+"px",n="Horizontal"===this.orientation?p:u,s=0;s<this.allBars.length;s++){var r=t.selectAll("."+n,this.element)[s],a=t.selectAll("."+v,r)[0];"Horizontal"===this.orientation?(r.style.width=i,t.isNullOrUndefined(a)||(a.style.width=i)):(r.style.height=i,t.isNullOrUndefined(a)||(a.style.height=i))}},S.prototype.changeOrientation=function(e){var t="Vertical"===e;this.element.classList.remove(t?r:a),this.element.classList.add(t?a:r),this.element.removeAttribute("aria-orientation"),this.element.setAttribute("aria-orientation",e);for(var i=0;i<this.allPanes.length;i++)this.allPanes[i].classList.remove(t?h:l),this.allPanes[i].classList.add(t?l:h);for(i=0;i<this.allBars.length;i++)this.allBars[i].classList.remove(t?p:u),this.allBars[i].classList.add(t?u:p)},S.prototype.getPrevPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2+1:(t-1)/2;return e.parentElement.children[i]},S.prototype.getNextPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2:(t-1)/2+1;return e.parentElement.children[i]},S.prototype.addResizeHandler=function(e){var i=this.createElement("div");t.addClass([i],[v,"e-icons"]);var n=t.isNullOrUndefined(this.separatorSize)?"1px":this.separatorSize+"px";"Horizontal"===this.orientation?i.style.width=n:i.style.height=n,e.appendChild(i)},S.prototype.getHeight=function(e){this.height;return""!==e.style.height&&"100%"===this.height?e.style.height:this.height},S.prototype.getWidth=function(e){this.width;return""!==e.style.width&&"100%"===this.width?e.style.width:this.width},S.prototype.setDimension=function(e,i){t.setStyleAttribute(this.element,{height:e,width:i})},S.prototype.createSeparator=function(e){var i=this.createElement("div");return this.allBars.push(i),"Horizontal"===this.orientation?(t.addClass([i],[d,p]),i.style.width=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"):(t.addClass([i],[d,u]),i.style.height=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"),this.addMouseActions(i),this.addResizeHandler(i),i},S.prototype.addSeparator=function(e){for(var i=this.allPanes.length,n=e.children,s=0;s<i;s++)if(s<i-1){var r=this.createSeparator(s);if(t.setStyleAttribute(r,{order:2*s+1}),this.separatorOrder.push(2*s+1),n[s].parentNode.appendChild(r),this.currentSeparator=r,r.setAttribute("role","separator"),this.isResizable()){t.EventHandler.add(r,"mousedown",this.onMouseDown,this);var a="msie"===t.Browser.info.name?"pointerdown":"touchstart";t.EventHandler.add(r,a,this.onMouseDown,this),r.classList.add(f)}else this.hideResizer(r)}},S.prototype.isResizable=function(){var e=!1;return(!t.isNullOrUndefined(this.paneSettings[this.getPreviousPaneIndex()])&&this.paneSettings[this.getPreviousPaneIndex()].resizable&&!t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()])&&this.paneSettings[this.getNextPaneIndex()].resizable||t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()]))&&(e=!0),e},S.prototype.addMouseActions=function(e){e.addEventListener("mouseover",function(){t.addClass([e],[g])}),e.addEventListener("mouseout",function(){t.removeClass([e],[g])})},S.prototype.getEventType=function(e){return e.indexOf("mouse")>-1?"mouse":"touch"},S.prototype.updateCurrentSeparator=function(e){this.currentSeparator=this.isSeparator(e)?e:e.parentElement},S.prototype.isSeparator=function(e){var t=!0;return(e.classList.contains(v)||e.classList.contains("e-split-line"))&&(t=!1),t},S.prototype.isMouseEvent=function(e){var i=!1;return("mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType))&&(i=!0),i},S.prototype.updateCursorPosition=function(e,i){if(this.isMouseEvent(e))this.changeCoordinates({x:e.pageX,y:e.pageY},i);else{var n="msie"!==t.Browser.info.name?e.touches[0]:e;this.changeCoordinates({x:n.pageX,y:n.pageY},i)}},S.prototype.changeCoordinates=function(e,t){"previous"===t?this.previousCoordinates=e:this.currentCoordinates=e},S.prototype.wireResizeEvents=function(){t.EventHandler.add(document,"mousemove",this.onMouseMove,this),t.EventHandler.add(document,"mouseup",this.onMouseUp,this);var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.add(document,e,this.onMouseMove,this),t.EventHandler.add(document,i,this.onMouseUp,this)},S.prototype.unwireResizeEvents=function(){var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.remove(document,"mousemove",this.onMouseMove),t.EventHandler.remove(document,"mouseup",this.onMouseUp),t.EventHandler.remove(document,e,this.onMouseMove),t.EventHandler.remove(document,i,this.onMouseUp)},S.prototype.onMouseDown=function(e){e.preventDefault();var i=e.target;this.updateCurrentSeparator(i),t.addClass([this.currentSeparator],x),this.updateCursorPosition(e,"previous"),this.getPaneDetails();var n={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.getPreviousPaneIndex(),this.getNextPaneIndex()],separator:this.currentSeparator,cancel:!1};if(this.trigger("resizeStart",n),!n.cancel)if(this.wireResizeEvents(),this.previousPane.style.flexBasis.indexOf("%")>0||this.nextPane.style.flexBasis.indexOf("%")>0){var s=this.updatePaneFlexBasis(this.previousPane),r=this.updatePaneFlexBasis(this.nextPane);this.totalPercent=s+r,this.totalWidth=this.convertPercentageToPixel(this.totalPercent+"%")}else this.totalWidth="Horizontal"===this.orientation?this.previousPane.offsetWidth+this.nextPane.offsetWidth:this.previousPane.offsetHeight+this.nextPane.offsetHeight},S.prototype.updatePaneFlexBasis=function(e){var t;if(e.style.flexBasis.indexOf("%")>0)t=this.removePercentageUnit(e.style.flexBasis);else if(""!==e.style.flexBasis)t=this.convertPixelToPercentage(this.convertPixelToNumber(e.style.flexBasis));else{var i="Horizontal"===this.orientation?e.offsetWidth+this.currentSeparator.offsetWidth:e.offsetHeight+this.currentSeparator.offsetHeight;t=this.convertPixelToPercentage(i)}return t},S.prototype.removePercentageUnit=function(e){return parseFloat(e.slice(0,e.indexOf("%")))},S.prototype.convertPercentageToPixel=function(e,i){var n,s=e.toString();if(s.indexOf("%")>-1){n=parseFloat(s.slice(0,s.indexOf("%")));var r=void 0;r=t.isNullOrUndefined(i)?"Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight:this.panesDimensions[this.allPanes.indexOf(i)],n=Math.ceil(r*(n/100))}else n=parseInt(s,10);return n},S.prototype.convertPixelToPercentage=function(e){return e/("Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight)*100},S.prototype.convertPixelToNumber=function(e){return e.indexOf("p")>-1?parseFloat(e.slice(0,e.indexOf("p"))):parseFloat(e)},S.prototype.calcDragPosition=function(e,t){var i,n;return i="Horizontal"===this.orientation?this.currentCoordinates.x-e:this.currentCoordinates.y-e,n=i/t,(n=n>1?1:n<0?0:n)*t},S.prototype.getSeparatorPosition=function(e){this.updateCursorPosition(e,"current");var t="Horizontal"===this.orientation?this.element.getBoundingClientRect().left:this.element.getBoundingClientRect().top,i="Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight;return this.calcDragPosition(t,i)},S.prototype.getMinMax=function(e,i,n){var s="min"===n?0:null,r=null;return"min"===n?t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(r=this.paneSettings[e].min):t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(r=this.paneSettings[e].max),this.paneSettings.length>0&&!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(r)?(r.indexOf("%")>0&&(r=this.convertPercentageToPixel(r).toString()),this.convertPixelToNumber(r)):s},S.prototype.getPreviousPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e+1:e},S.prototype.getNextPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e:e+1},S.prototype.getPaneDetails=function(){this.order=parseInt(this.currentSeparator.style.order,10),this.previousPane=this.getPrevPane(this.currentSeparator,this.order),this.nextPane=this.getNextPane(this.currentSeparator,this.order),this.prevPaneIndex=this.getPreviousPaneIndex(),this.nextPaneIndex=this.getNextPaneIndex()},S.prototype.getPaneHeight=function(e){return"Horizontal"===this.orientation?e.offsetWidth.toString():e.offsetHeight.toString()},S.prototype.boundingRectValues=function(e){return"Horizontal"===this.orientation?e.getBoundingClientRect().width:e.getBoundingClientRect().height},S.prototype.isValidSize=function(e){var i=!1;return!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(this.paneSettings[e].size)&&this.paneSettings[e].size.indexOf("%")>-1&&(i=!0),i},S.prototype.getPaneDimensions=function(){if(this.previousPaneHeightWidth=""===this.previousPane.style.flexBasis?this.getPaneHeight(this.previousPane):this.previousPane.style.flexBasis,this.nextPaneHeightWidth=""===this.nextPane.style.flexBasis?this.getPaneHeight(this.nextPane):this.nextPane.style.flexBasis,this.paneSettings.length<1)return this.prePaneDimenson=this.boundingRectValues(this.previousPane),void(this.nextPaneDimension=this.boundingRectValues(this.nextPane));this.isValidSize(this.prevPaneIndex)&&(this.previousPaneHeightWidth=this.convertPercentageToPixel(this.previousPaneHeightWidth).toString(),this.updatePrePaneInPercentage=!0),this.isValidSize(this.nextPaneIndex)&&(this.nextPaneHeightWidth=this.convertPercentageToPixel(this.nextPaneHeightWidth).toString(),this.updateNextPaneInPercentage=!0),this.prePaneDimenson=this.convertPixelToNumber(this.previousPaneHeightWidth.toString()),this.nextPaneDimension=this.convertPixelToNumber(this.nextPaneHeightWidth.toString())},S.prototype.checkCoordinates=function(e,t){var i=!0;return e!==this.previousCoordinates.x&&t!==this.previousCoordinates.y||(i=!1),i},S.prototype.isCursorMoved=function(e){return"mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType)?this.checkCoordinates(e.pageX,e.pageY):"msie"!==t.Browser.info.name?this.checkCoordinates(e.touches[0].pageX,e.touches[0].pageY):this.checkCoordinates(e.pageX,e.pageY)},S.prototype.getBorder=function(){this.border=0;var e="Horizontal"===this.orientation?(this.element.offsetWidth-this.element.clientWidth)/2:(this.element.offsetHeight-this.element.clientHeight)/2;this.border="chrome"!==t.Browser.info.name?this.border:e},S.prototype.onMouseMove=function(e){if(this.isCursorMoved(e)){this.getPaneDetails(),this.getPaneDimensions();var t={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],paneSize:[this.prePaneDimenson,this.nextPaneDimension],separator:this.currentSeparator};this.trigger("resizing",t);var i,n=this.validateDraggedPosition(this.getSeparatorPosition(e),this.prePaneDimenson,this.nextPaneDimension);if(this.getBorder(),i="Horizontal"===this.orientation?this.element.getBoundingClientRect().left+n-this.currentSeparator.getBoundingClientRect().left+this.border:this.element.getBoundingClientRect().top+n-this.currentSeparator.getBoundingClientRect().top+this.border,this.nextPaneHeightWidth="string"==typeof this.nextPaneHeightWidth&&this.nextPaneHeightWidth.indexOf("p")>-1?this.convertPixelToNumber(this.nextPaneHeightWidth):parseInt(this.nextPaneHeightWidth,10),this.prevPaneCurrentWidth=i+this.convertPixelToNumber(this.previousPaneHeightWidth),this.nextPaneCurrentWidth=this.nextPaneHeightWidth-i,this.validateMinMaxValues(),this.nextPaneCurrentWidth<0&&(this.nextPaneCurrentWidth=0),this.prevPaneCurrentWidth<0&&(this.prevPaneCurrentWidth=0),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth>this.totalWidth&&(this.nextPaneCurrentWidth<this.prevPaneCurrentWidth?this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth):this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth)),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth<this.totalWidth){var s=this.totalWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth);this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+s}this.calculateCurrentDimensions(),this.addStaticPaneClass(),this.previousPane.style.flexBasis=this.prevPaneCurrentWidth,this.nextPane.style.flexBasis=this.nextPaneCurrentWidth}},S.prototype.validateMinRange=function(e,i,n){var s,r,a=null,o=0;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(a=this.paneSettings[e].min.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i<(s=this.convertPixelToNumber(a))&&(o=i-s<=0?0:i-s,this.totalWidth=this.totalWidth-o,this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},S.prototype.validateMaxRange=function(e,i,n){var s,r,a=null;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(a=this.paneSettings[e].max.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i>(s=this.convertPixelToNumber(a))&&(this.totalWidth=this.totalWidth-(i-s),this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},S.prototype.validateMinMaxValues=function(){this.prevPaneCurrentWidth=this.validateMinRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMinRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane),this.prevPaneCurrentWidth=this.validateMaxRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMaxRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane)},S.prototype.equatePaneWidths=function(){var e;this.prevPaneCurrentWidth+this.nextPaneCurrentWidth>this.totalPercent&&(e=this.prevPaneCurrentWidth+this.nextPaneCurrentWidth-this.totalPercent,this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-e/2+"%"),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth<this.totalPercent&&(e=this.totalPercent-(this.prevPaneCurrentWidth+this.nextPaneCurrentWidth),this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+e/2+"%")},S.prototype.calculateCurrentDimensions=function(){this.updatePrePaneInPercentage||this.updateNextPaneInPercentage?(this.prevPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.prevPaneCurrentWidth))/10)),this.nextPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.nextPaneCurrentWidth))/10)),0===this.prevPaneCurrentWidth&&(this.nextPaneCurrentWidth=this.totalPercent),0===this.nextPaneCurrentWidth&&(this.prevPaneCurrentWidth=this.totalPercent),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth!==this.totalPercent?this.equatePaneWidths():(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"%"),this.prevPaneCurrentWidth=this.updatePrePaneInPercentage?this.prevPaneCurrentWidth:this.convertPercentageToPixel(this.prevPaneCurrentWidth)+"px",this.nextPaneCurrentWidth=this.updateNextPaneInPercentage?this.nextPaneCurrentWidth:this.convertPercentageToPixel(this.nextPaneCurrentWidth)+"px",this.updatePrePaneInPercentage=!1,this.updateNextPaneInPercentage=!1):(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"px",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"px")},S.prototype.addStaticPaneClass=function(){this.previousPane.classList.contains(c)||this.previousPane.classList.add(c),this.nextPane.classList.contains(c)||this.nextPane.classList.add(c)},S.prototype.validateDraggedPosition=function(e,i,n){var s="Horizontal"===this.orientation?this.currentSeparator.offsetLeft:this.currentSeparator.offsetTop,r=s-i,a=n+s,o=this.getMinMax(this.prevPaneIndex,this.previousPane,"min"),h=this.getMinMax(this.nextPaneIndex,this.nextPane,"min"),l=this.getMinMax(this.prevPaneIndex,this.previousPane,"max"),d=this.getMinMax(this.nextPaneIndex,this.nextPane,"max"),p=e;return e>a-h?p=a-h:e<r+o&&(p=r+o),t.isNullOrUndefined(l)?t.isNullOrUndefined(d)||e<a-d&&(p=a-d):e>r+l&&(p=r+l),p},S.prototype.onMouseUp=function(e){t.removeClass([this.currentSeparator],x),this.unwireResizeEvents();var i={event:e,element:this.element,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],separator:this.currentSeparator,paneSize:[this.prePaneDimenson,this.nextPaneDimension]};this.trigger("resizeStop",i)},S.prototype.panesDimension=function(e,i){var n,s=i.length;parseInt(this.getHeight(this.element),10),t.isNullOrUndefined(this.paneSettings[e])?t.setStyleAttribute(i[e],{order:2*e}):t.isNullOrUndefined(this.paneSettings[e].size)?(this.sizeFlag=!0,t.setStyleAttribute(i[e],{order:2*e})):(n=this.paneSettings[e].size,e<s&&(t.setStyleAttribute(i[e],{"flex-basis":n,order:2*e}),e<s-1?t.addClass([i[e]],c):this.sizeFlag||(i[e].style.flexBasis=null),e===s-1&&this.sizeFlag&&t.addClass([i[e]],c))),this.paneOrder.push(2*e)},S.prototype.setTemplate=function(e,i){for(var n=[],s=0,r=t.compile(e)({});s<r.length;s++){var a=r[s];n.push(a)}t.append([].slice.call(n),i)},S.prototype.createSplitPane=function(e){for(var i=e.children.length,n=0;n<this.paneSettings.length;n++)if(i<this.paneSettings.length){var s=this.createElement("div");this.element.appendChild(s),i+=1}i=e.children.length;var r=[].slice.call(e.children);if(this.element.setAttribute("aria-orientation",this.orientation),this.element.setAttribute("role","splitter"),this.sizeFlag=!1,i>1)for(n=0;n<i;n++)1===r[n].nodeType&&(this.allPanes.push(r[n]),"Horizontal"===this.orientation?(t.addClass([r[n]],[o,h,P]),this.panesDimension(n,r)):(t.addClass([r[n]],[o,l,P]),this.panesDimension(n,r)),t.isNullOrUndefined(this.paneSettings[n])||t.isNullOrUndefined(this.paneSettings[n].content)||this.setTemplate(this.paneSettings[n].content,r[n]))},S.prototype.destroy=function(){t.detach(this.element),this.element=this.wrapper,this.wrapperParent.appendChild(this.wrapper)},S.prototype.addPaneClass=function(e){return"Horizontal"===this.orientation?t.addClass([e],[o,h,P]):t.addClass([e],[o,l,P]),e},S.prototype.removePaneOrders=function(e){for(var t=document.querySelectorAll("."+e),i=0;i<t.length;i++)t[i].style.removeProperty("order")},S.prototype.setPaneOrder=function(){for(var e=0;e<this.allPanes.length;e++)this.panesDimension(e,this.allPanes)},S.prototype.removeSeparator=function(){for(var e=0;e<this.allBars.length;e++)t.detach(this.allBars[e]);this.allBars=[]},S.prototype.updatePanes=function(){this.setPaneOrder(),this.removeSeparator(),this.addSeparator(this.element)},S.prototype.addPane=function(e,i){var n=this.createElement("div");n=this.addPaneClass(n),i=i>this.allPanes.length+1?this.allPanes.length:i;var s={size:t.isNullOrUndefined(e.size)?"":e.size,min:t.isNullOrUndefined(e.min)?null:e.min,max:t.isNullOrUndefined(e.max)?null:e.max,content:t.isNullOrUndefined(e.content)?"":e.content,resizable:!!t.isNullOrUndefined(e.resizable)||e.resizable};this.paneSettings.splice(i,0,s),"Horizontal"===this.orientation?(this.element.insertBefore(n,this.element.querySelectorAll("."+h)[i]),this.removePaneOrders(h)):(this.element.insertBefore(n,this.element.querySelectorAll("."+l)[i]),this.removePaneOrders(l)),this.allPanes.splice(i,0,n),this.updatePanes(),this.setTemplate(this.paneSettings[i].content,n),this.allPanes[this.allPanes.length-1].classList.remove(c)},S.prototype.removePane=function(e){e=e>this.allPanes.length+1?this.allPanes.length:e;var i="Horizontal"===this.orientation?h:l;t.isNullOrUndefined(this.element.querySelectorAll("."+i)[e])||(t.detach(this.element.querySelectorAll("."+i)[e]),this.allPanes.splice(e,1),this.removePaneOrders(i),this.updatePanes(),this.allPanes[this.allPanes.length-1].classList.remove(c))},n([t.Property("100%")],S.prototype,"height",void 0),n([t.Property("100%")],S.prototype,"width",void 0),n([t.Collection([],C)],S.prototype,"paneSettings",void 0),n([t.Property("Horizontal")],S.prototype,"orientation",void 0),n([t.Property("")],S.prototype,"cssClass",void 0),n([t.Property(!0)],S.prototype,"enabled",void 0),n([t.Property(!1)],S.prototype,"enableRtl",void 0),n([t.Property(null)],S.prototype,"separatorSize",void 0),n([t.Event()],S.prototype,"created",void 0),n([t.Event()],S.prototype,"resizeStart",void 0),n([t.Event()],S.prototype,"resizing",void 0),n([t.Event()],S.prototype,"resizeStop",void 0),S=n([t.NotifyPropertyChanges],S)}(t.Component);e.PaneProperties=C,e.Splitter=S,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=ej2-layouts.umd.min.js.map

dist/es6/ej2-layouts.es2015.js

@@ -88,3 +88,3 @@ import { Browser, ChildProperty, Collection, Component, Event, EventHandler, NotifyPropertyChanges, Property, addClass, append, compile, detach, formatUnit, isNullOrUndefined, removeClass, select, selectAll, setStyleAttribute } from '@syncfusion/ej2-base';
         this.border = 0;
-        this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible', 'data-resizable'];
+        this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible', 'data-resizable', 'data-content'];
         this.validElementAttributes = ['data-orientation', 'data-width', 'data-height'];
@@ -125,30 +125,33 @@ }
                     if (!(newProp.paneSettings instanceof Array && oldProp.paneSettings instanceof Array)) {
-                        let changedProp = Object.keys(newProp.paneSettings);
-                        for (let j = 0; j < changedProp.length; j++) {
-                            let index = parseInt(Object.keys(newProp.paneSettings)[j], 10);
-                            let property = Object.keys(newProp.paneSettings[index])[0];
-                            let newVal = Object(newProp.paneSettings[index])[property];
-                            index = (this.enableRtl) ? (this.allBars.length - 1) - index : index;
-                            if (property === 'content') {
-                                this.allPanes[index].innerHTML = '';
-                                this.setTemplate(newVal, this.allPanes[index]);
-                            }
-                            if (property === 'resizable') {
-                                EventHandler.remove(this.allBars[index], 'mousedown', this.onMouseDown);
-                                if (newVal) {
-                                    EventHandler.add(this.allBars[index], 'mousedown', this.onMouseDown, this);
-                                    this.currentSeparator = this.allBars[index];
-                                    if (this.isResizable()) {
-                                        this.showResizer(this.allBars[index]);
-                                        this.allBars[index].classList.add(RESIZABLE_BAR);
+                        let paneCounts = Object.keys(newProp.paneSettings);
+                        for (let i = 0; i < paneCounts.length; i++) {
+                            let index = parseInt(Object.keys(newProp.paneSettings)[i], 10);
+                            let changedPropsCount = Object.keys(newProp.paneSettings[index]).length;
+                            for (let j = 0; j < changedPropsCount; j++) {
+                                let property = Object.keys(newProp.paneSettings[index])[j];
+                                let newVal = Object(newProp.paneSettings[index])[property];
+                                index = (this.enableRtl) ? (this.allBars.length - 1) - index : index;
+                                if (property === 'content') {
+                                    this.allPanes[index].innerHTML = '';
+                                    this.setTemplate(newVal, this.allPanes[index]);
+                                }
+                                if (property === 'resizable') {
+                                    EventHandler.remove(this.allBars[index], 'mousedown', this.onMouseDown);
+                                    if (newVal) {
+                                        EventHandler.add(this.allBars[index], 'mousedown', this.onMouseDown, this);
+                                        this.currentSeparator = this.allBars[index];
+                                        if (this.isResizable()) {
+                                            this.showResizer(this.allBars[index]);
+                                            this.allBars[index].classList.add(RESIZABLE_BAR);
+                                        }
                                     }
+                                    else {
+                                        this.hideResizer(this.allBars[index]);
+                                        this.allBars[index].classList.remove(RESIZABLE_BAR);
+                                    }
                                 }
-                                else {
-                                    this.hideResizer(this.allBars[index]);
-                                    this.allBars[index].classList.remove(RESIZABLE_BAR);
+                                if (property === 'size') {
+                                    this.allPanes[index].style.flexBasis = newVal;
                                 }
                             }
-                            if (property === 'size') {
-                                this.allPanes[index].style.flexBasis = newVal;
-                            }
                         }
@@ -902,6 +905,7 @@ }
         let childCount = target.children.length;
-        if (childCount < this.paneSettings.length) {
-            for (let i = 0; i < this.paneSettings.length; i++) {
+        for (let i = 0; i < this.paneSettings.length; i++) {
+            if (childCount < this.paneSettings.length) {
                 let childElement = this.createElement('div');
                 this.element.appendChild(childElement);
+                childCount = childCount + 1;
             }
@@ -975,2 +979,8 @@ }
     }
+    /**
+     * Allows you to add a pane dynamically to the specified index position by passing the pane properties.
+     * @param { PanePropertiesModel } paneProperties - Specifies the pane’s properties that apply to new pane.
+     * @param { number } index - Specifies the index where the pane will be inserted.
+     * @returns void
+     */
     addPane(paneProperties, index) {
@@ -1001,5 +1011,13 @@ let newPane = this.createElement('div');
     }
+    /**
+     * Allows you to remove the specified pane dynamically by passing its index value.
+     * @param { number } index - Specifies the index value to remove the corresponding pane.
+     * @returns void
+     */
     removePane(index) {
         index = (index > this.allPanes.length + 1) ? this.allPanes.length : index;
         let elementClass = (this.orientation === 'Horizontal') ? SPLIT_H_PANE : SPLIT_V_PANE;
+        if (isNullOrUndefined(this.element.querySelectorAll('.' + elementClass)[index])) {
+            return;
+        }
         detach(this.element.querySelectorAll('.' + elementClass)[index]);
@@ -1006,0 +1024,0 @@ this.allPanes.splice(index, 1);

dist/es6/ej2-layouts.es5.js

@@ -107,3 +107,3 @@ import { Browser, ChildProperty, Collection, Component, Event, EventHandler, NotifyPropertyChanges, Property, addClass, append, compile, detach, formatUnit, isNullOrUndefined, removeClass, select, selectAll, setStyleAttribute } from '@syncfusion/ej2-base';
         _this.border = 0;
-        _this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible', 'data-resizable'];
+        _this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible', 'data-resizable', 'data-content'];
         _this.validElementAttributes = ['data-orientation', 'data-width', 'data-height'];
@@ -146,30 +146,33 @@ return _this;
                     if (!(newProp.paneSettings instanceof Array && oldProp.paneSettings instanceof Array)) {
-                        var changedProp = Object.keys(newProp.paneSettings);
-                        for (var j = 0; j < changedProp.length; j++) {
-                            var index = parseInt(Object.keys(newProp.paneSettings)[j], 10);
-                            var property = Object.keys(newProp.paneSettings[index])[0];
-                            var newVal = Object(newProp.paneSettings[index])[property];
-                            index = (this.enableRtl) ? (this.allBars.length - 1) - index : index;
-                            if (property === 'content') {
-                                this.allPanes[index].innerHTML = '';
-                                this.setTemplate(newVal, this.allPanes[index]);
-                            }
-                            if (property === 'resizable') {
-                                EventHandler.remove(this.allBars[index], 'mousedown', this.onMouseDown);
-                                if (newVal) {
-                                    EventHandler.add(this.allBars[index], 'mousedown', this.onMouseDown, this);
-                                    this.currentSeparator = this.allBars[index];
-                                    if (this.isResizable()) {
-                                        this.showResizer(this.allBars[index]);
-                                        this.allBars[index].classList.add(RESIZABLE_BAR);
+                        var paneCounts = Object.keys(newProp.paneSettings);
+                        for (var i = 0; i < paneCounts.length; i++) {
+                            var index = parseInt(Object.keys(newProp.paneSettings)[i], 10);
+                            var changedPropsCount = Object.keys(newProp.paneSettings[index]).length;
+                            for (var j = 0; j < changedPropsCount; j++) {
+                                var property = Object.keys(newProp.paneSettings[index])[j];
+                                var newVal = Object(newProp.paneSettings[index])[property];
+                                index = (this.enableRtl) ? (this.allBars.length - 1) - index : index;
+                                if (property === 'content') {
+                                    this.allPanes[index].innerHTML = '';
+                                    this.setTemplate(newVal, this.allPanes[index]);
+                                }
+                                if (property === 'resizable') {
+                                    EventHandler.remove(this.allBars[index], 'mousedown', this.onMouseDown);
+                                    if (newVal) {
+                                        EventHandler.add(this.allBars[index], 'mousedown', this.onMouseDown, this);
+                                        this.currentSeparator = this.allBars[index];
+                                        if (this.isResizable()) {
+                                            this.showResizer(this.allBars[index]);
+                                            this.allBars[index].classList.add(RESIZABLE_BAR);
+                                        }
                                     }
+                                    else {
+                                        this.hideResizer(this.allBars[index]);
+                                        this.allBars[index].classList.remove(RESIZABLE_BAR);
+                                    }
                                 }
-                                else {
-                                    this.hideResizer(this.allBars[index]);
-                                    this.allBars[index].classList.remove(RESIZABLE_BAR);
+                                if (property === 'size') {
+                                    this.allPanes[index].style.flexBasis = newVal;
                                 }
                             }
-                            if (property === 'size') {
-                                this.allPanes[index].style.flexBasis = newVal;
-                            }
                         }
@@ -924,6 +927,7 @@ }
         var childCount = target.children.length;
-        if (childCount < this.paneSettings.length) {
-            for (var i = 0; i < this.paneSettings.length; i++) {
+        for (var i = 0; i < this.paneSettings.length; i++) {
+            if (childCount < this.paneSettings.length) {
                 var childElement = this.createElement('div');
                 this.element.appendChild(childElement);
+                childCount = childCount + 1;
             }
@@ -997,2 +1001,8 @@ }
     };
+    /**
+     * Allows you to add a pane dynamically to the specified index position by passing the pane properties.
+     * @param { PanePropertiesModel } paneProperties - Specifies the pane’s properties that apply to new pane.
+     * @param { number } index - Specifies the index where the pane will be inserted.
+     * @returns void
+     */
     Splitter.prototype.addPane = function (paneProperties, index) {
@@ -1023,5 +1033,13 @@ var newPane = this.createElement('div');
     };
+    /**
+     * Allows you to remove the specified pane dynamically by passing its index value.
+     * @param { number } index - Specifies the index value to remove the corresponding pane.
+     * @returns void
+     */
     Splitter.prototype.removePane = function (index) {
         index = (index > this.allPanes.length + 1) ? this.allPanes.length : index;
         var elementClass = (this.orientation === 'Horizontal') ? SPLIT_H_PANE : SPLIT_V_PANE;
+        if (isNullOrUndefined(this.element.querySelectorAll('.' + elementClass)[index])) {
+            return;
+        }
         detach(this.element.querySelectorAll('.' + elementClass)[index]);
@@ -1028,0 +1046,0 @@ this.allPanes.splice(index, 1);

dist/global/ej2-layouts.min.js

 /*!
 *  filename: ej2-layouts.min.js
-*  version : 16.4.44
-*  Copyright Syncfusion Inc. 2001 - 2018. All rights reserved.
+*  version : 16.4.47
+*  Copyright Syncfusion Inc. 2001 - 2019. All rights reserved.
 *  Use of this code is subject to the terms of our license.
@@ -10,3 +10,3 @@ *  A copy of the current license can be obtained at any time by e-mailing
 */
-this.ej=this.ej||{},this.ej.layouts=function(e,t){"use strict";var i=function(){var e=function(t,i){return(e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])})(t,i)};return function(t,i){function n(){this.constructor=t}e(t,i),t.prototype=null===i?Object.create(i):(n.prototype=i.prototype,new n)}}(),n=function(e,t,i,n){var s,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,n);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(r<3?s(a):r>3?s(t,i,a):s(t,i))||a);return r>3&&a&&Object.defineProperty(t,i,a),a},s="e-pane",r="e-pane-horizontal",a="e-pane-vertical",o="e-split-bar-horizontal",h="e-split-bar-vertical",l="e-static-pane",d="e-resize-handler",p=function(e){function s(){return null!==e&&e.apply(this,arguments)||this}return i(s,e),n([t.Property()],s.prototype,"size",void 0),n([t.Property(!0)],s.prototype,"resizable",void 0),n([t.Property(null)],s.prototype,"min",void 0),n([t.Property(null)],s.prototype,"max",void 0),n([t.Property()],s.prototype,"content",void 0),s}(t.ChildProperty),u=function(e){function u(t,i){var n=e.call(this,t,i)||this;return n.allPanes=[],n.paneOrder=[],n.separatorOrder=[],n.allBars=[],n.previousCoordinates={},n.currentCoordinates={},n.updatePrePaneInPercentage=!1,n.updateNextPaneInPercentage=!1,n.panesDimensions=[],n.border=0,n.validDataAttributes=["data-size","data-min","data-max","data-collapsible","data-resizable"],n.validElementAttributes=["data-orientation","data-width","data-height"],n}return i(u,e),u.prototype.onPropertyChanged=function(e,i){if(this.element.classList.contains("e-splitter"))for(var n=0,s=Object.keys(e);n<s.length;n++)switch(s[n]){case"height":this.setSplitterSize(this.element,e.height,"height");break;case"width":this.setSplitterSize(this.element,e.width,"width");break;case"cssClass":this.setCssClass(e.cssClass);break;case"enabled":this.isEnabled(this.enabled);break;case"separatorSize":this.setSeparatorSize(e.separatorSize);break;case"orientation":this.changeOrientation(e.orientation);break;case"paneSettings":if(!(e.paneSettings instanceof Array&&i.paneSettings instanceof Array))for(var r=Object.keys(e.paneSettings),a=0;a<r.length;a++){var o=parseInt(Object.keys(e.paneSettings)[a],10),h=Object.keys(e.paneSettings[o])[0],l=Object(e.paneSettings[o])[h];o=this.enableRtl?this.allBars.length-1-o:o,"content"===h&&(this.allPanes[o].innerHTML="",this.setTemplate(l,this.allPanes[o])),"resizable"===h&&(t.EventHandler.remove(this.allBars[o],"mousedown",this.onMouseDown),l?(t.EventHandler.add(this.allBars[o],"mousedown",this.onMouseDown,this),this.currentSeparator=this.allBars[o],this.isResizable()&&(this.showResizer(this.allBars[o]),this.allBars[o].classList.add("e-resizable-split-bar"))):(this.hideResizer(this.allBars[o]),this.allBars[o].classList.remove("e-resizable-split-bar"))),"size"===h&&(this.allPanes[o].style.flexBasis=l)}break;case"enableRtl":this.setRTL(e.enableRtl)}},u.prototype.preRender=function(){this.wrapper=this.element.cloneNode(!0),this.wrapperParent=this.element.parentElement,t.removeClass([this.wrapper],["e-control","e-lib","e-splitter"]);var e="Horizontal"===this.orientation?"e-splitter-horizontal":"e-splitter-vertical";t.addClass([this.element],e),t.Browser.isDevice&&t.addClass([this.element],"e-splitter-touch")},u.prototype.getPersistData=function(){return this.addOnPersist([])},u.prototype.getModuleName=function(){return"splitter"},u.prototype.render=function(){this.checkDataAttributes(),this.setCssClass(this.cssClass),this.isEnabled(this.enabled),this.setDimension(this.getHeight(this.element),this.getWidth(this.element)),this.createSplitPane(this.element),this.addSeparator(this.element),this.getPanesDimensions(),this.setRTL(this.enableRtl)},u.prototype.checkDataAttributes=function(){for(var e,i,n=0;n<this.validElementAttributes.length;n++)i=this.element.getAttribute(this.validElementAttributes[n]),t.isNullOrUndefined(i)||(this[e=this.removeDataPrefix(this.validElementAttributes[n])]=i);for(var s=0;s<this.element.children.length;s++)for(var r=0;r<this.validDataAttributes.length;r++)if(i=this.element.children[s].getAttribute(this.validDataAttributes[r]),!t.isNullOrUndefined(i)){i="collapsible"===(e=this.removeDataPrefix(this.validDataAttributes[r]))||"resizable"===e?"true"===i:i,t.isNullOrUndefined(this.paneSettings[s])&&(this.paneSettings[s]={size:"",min:null,max:null,content:"",resizable:!0});var a=this.paneSettings[s][e];"resizable"===e&&this.paneSettings[s].resizable&&(this.paneSettings[s][e]=i),(t.isNullOrUndefined(a)||""===a)&&(this.paneSettings[s][e]=i)}},u.prototype.removeDataPrefix=function(e){return e.slice(e.lastIndexOf("-")+1)},u.prototype.setRTL=function(e){e?t.addClass([this.element],"e-rtl"):t.removeClass([this.element],"e-rtl")},u.prototype.setSplitterSize=function(e,i,n){var s="width"===n?{width:t.formatUnit(i)}:{height:t.formatUnit(i)};t.setStyleAttribute(e,s)},u.prototype.getPanesDimensions=function(){for(var e=0;e<this.allPanes.length;e++)"Horizontal"===this.orientation?this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().width):this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().height)},u.prototype.setCssClass=function(e){""!==e&&t.addClass([this.element],e.split(" "))},u.prototype.hideResizer=function(e){t.addClass([t.select("."+d,e)],"e-hide-handler")},u.prototype.showResizer=function(e){t.removeClass([t.select("."+d,e)],"e-hide-handler")},u.prototype.isEnabled=function(e){e?t.removeClass([this.element],"e-disabled"):t.addClass([this.element],"e-disabled")},u.prototype.setSeparatorSize=function(e){for(var i=t.isNullOrUndefined(e)?"auto":e+"px",n="Horizontal"===this.orientation?o:h,s=0;s<this.allBars.length;s++){var r=t.selectAll("."+n,this.element)[s],a=t.selectAll("."+d,r)[0];"Horizontal"===this.orientation?(r.style.width=i,t.isNullOrUndefined(a)||(a.style.width=i)):(r.style.height=i,t.isNullOrUndefined(a)||(a.style.height=i))}},u.prototype.changeOrientation=function(e){var t="Vertical"===e;this.element.classList.remove(t?"e-splitter-horizontal":"e-splitter-vertical"),this.element.classList.add(t?"e-splitter-vertical":"e-splitter-horizontal"),this.element.removeAttribute("aria-orientation"),this.element.setAttribute("aria-orientation",e);for(i=0;i<this.allPanes.length;i++)this.allPanes[i].classList.remove(t?r:a),this.allPanes[i].classList.add(t?a:r);for(var i=0;i<this.allBars.length;i++)this.allBars[i].classList.remove(t?o:h),this.allBars[i].classList.add(t?h:o)},u.prototype.getPrevPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2+1:(t-1)/2;return e.parentElement.children[i]},u.prototype.getNextPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2:(t-1)/2+1;return e.parentElement.children[i]},u.prototype.addResizeHandler=function(e){var i=this.createElement("div");t.addClass([i],[d,"e-icons"]);var n=t.isNullOrUndefined(this.separatorSize)?"1px":this.separatorSize+"px";"Horizontal"===this.orientation?i.style.width=n:i.style.height=n,e.appendChild(i)},u.prototype.getHeight=function(e){this.height;return""!==e.style.height&&"100%"===this.height?e.style.height:this.height},u.prototype.getWidth=function(e){this.width;return""!==e.style.width&&"100%"===this.width?e.style.width:this.width},u.prototype.setDimension=function(e,i){t.setStyleAttribute(this.element,{height:e,width:i})},u.prototype.createSeparator=function(e){var i=this.createElement("div");return this.allBars.push(i),"Horizontal"===this.orientation?(t.addClass([i],["e-split-bar",o]),i.style.width=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"):(t.addClass([i],["e-split-bar",h]),i.style.height=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"),this.addMouseActions(i),this.addResizeHandler(i),i},u.prototype.addSeparator=function(e){for(var i=this.allPanes.length,n=e.children,s=0;s<i;s++)if(s<i-1){var r=this.createSeparator(s);if(t.setStyleAttribute(r,{order:2*s+1}),this.separatorOrder.push(2*s+1),n[s].parentNode.appendChild(r),this.currentSeparator=r,r.setAttribute("role","separator"),this.isResizable()){t.EventHandler.add(r,"mousedown",this.onMouseDown,this);var a="msie"===t.Browser.info.name?"pointerdown":"touchstart";t.EventHandler.add(r,a,this.onMouseDown,this),r.classList.add("e-resizable-split-bar")}else this.hideResizer(r)}},u.prototype.isResizable=function(){var e=!1;return(!t.isNullOrUndefined(this.paneSettings[this.getPreviousPaneIndex()])&&this.paneSettings[this.getPreviousPaneIndex()].resizable&&!t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()])&&this.paneSettings[this.getNextPaneIndex()].resizable||t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()]))&&(e=!0),e},u.prototype.addMouseActions=function(e){e.addEventListener("mouseover",function(){t.addClass([e],["e-split-bar-hover"])}),e.addEventListener("mouseout",function(){t.removeClass([e],["e-split-bar-hover"])})},u.prototype.getEventType=function(e){return e.indexOf("mouse")>-1?"mouse":"touch"},u.prototype.updateCurrentSeparator=function(e){this.currentSeparator=this.isSeparator(e)?e:e.parentElement},u.prototype.isSeparator=function(e){var t=!0;return(e.classList.contains(d)||e.classList.contains("e-split-line"))&&(t=!1),t},u.prototype.isMouseEvent=function(e){var i=!1;return("mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType))&&(i=!0),i},u.prototype.updateCursorPosition=function(e,i){if(this.isMouseEvent(e))this.changeCoordinates({x:e.pageX,y:e.pageY},i);else{var n="msie"!==t.Browser.info.name?e.touches[0]:e;this.changeCoordinates({x:n.pageX,y:n.pageY},i)}},u.prototype.changeCoordinates=function(e,t){"previous"===t?this.previousCoordinates=e:this.currentCoordinates=e},u.prototype.wireResizeEvents=function(){t.EventHandler.add(document,"mousemove",this.onMouseMove,this),t.EventHandler.add(document,"mouseup",this.onMouseUp,this);var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.add(document,e,this.onMouseMove,this),t.EventHandler.add(document,i,this.onMouseUp,this)},u.prototype.unwireResizeEvents=function(){var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.remove(document,"mousemove",this.onMouseMove),t.EventHandler.remove(document,"mouseup",this.onMouseUp),t.EventHandler.remove(document,e,this.onMouseMove),t.EventHandler.remove(document,i,this.onMouseUp)},u.prototype.onMouseDown=function(e){e.preventDefault();var i=e.target;this.updateCurrentSeparator(i),t.addClass([this.currentSeparator],"e-split-bar-active"),this.updateCursorPosition(e,"previous"),this.getPaneDetails();var n={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.getPreviousPaneIndex(),this.getNextPaneIndex()],separator:this.currentSeparator,cancel:!1};if(this.trigger("resizeStart",n),!n.cancel)if(this.wireResizeEvents(),this.previousPane.style.flexBasis.indexOf("%")>0||this.nextPane.style.flexBasis.indexOf("%")>0){var s=this.updatePaneFlexBasis(this.previousPane),r=this.updatePaneFlexBasis(this.nextPane);this.totalPercent=s+r,this.totalWidth=this.convertPercentageToPixel(this.totalPercent+"%")}else this.totalWidth="Horizontal"===this.orientation?this.previousPane.offsetWidth+this.nextPane.offsetWidth:this.previousPane.offsetHeight+this.nextPane.offsetHeight},u.prototype.updatePaneFlexBasis=function(e){var t;if(e.style.flexBasis.indexOf("%")>0)t=this.removePercentageUnit(e.style.flexBasis);else if(""!==e.style.flexBasis)t=this.convertPixelToPercentage(this.convertPixelToNumber(e.style.flexBasis));else{var i="Horizontal"===this.orientation?e.offsetWidth+this.currentSeparator.offsetWidth:e.offsetHeight+this.currentSeparator.offsetHeight;t=this.convertPixelToPercentage(i)}return t},u.prototype.removePercentageUnit=function(e){return parseFloat(e.slice(0,e.indexOf("%")))},u.prototype.convertPercentageToPixel=function(e,i){var n,s=e.toString();if(s.indexOf("%")>-1){n=parseFloat(s.slice(0,s.indexOf("%")));var r=void 0;r=t.isNullOrUndefined(i)?"Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight:this.panesDimensions[this.allPanes.indexOf(i)],n=Math.ceil(r*(n/100))}else n=parseInt(s,10);return n},u.prototype.convertPixelToPercentage=function(e){return e/("Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight)*100},u.prototype.convertPixelToNumber=function(e){return e.indexOf("p")>-1?parseFloat(e.slice(0,e.indexOf("p"))):parseFloat(e)},u.prototype.calcDragPosition=function(e,t){var i,n;return i="Horizontal"===this.orientation?this.currentCoordinates.x-e:this.currentCoordinates.y-e,n=i/t,(n=n>1?1:n<0?0:n)*t},u.prototype.getSeparatorPosition=function(e){this.updateCursorPosition(e,"current");var t="Horizontal"===this.orientation?this.element.getBoundingClientRect().left:this.element.getBoundingClientRect().top,i="Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight;return this.calcDragPosition(t,i)},u.prototype.getMinMax=function(e,i,n){var s="min"===n?0:null,r=null;return"min"===n?t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(r=this.paneSettings[e].min):t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(r=this.paneSettings[e].max),this.paneSettings.length>0&&!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(r)?(r.indexOf("%")>0&&(r=this.convertPercentageToPixel(r).toString()),this.convertPixelToNumber(r)):s},u.prototype.getPreviousPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e+1:e},u.prototype.getNextPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e:e+1},u.prototype.getPaneDetails=function(){this.order=parseInt(this.currentSeparator.style.order,10),this.previousPane=this.getPrevPane(this.currentSeparator,this.order),this.nextPane=this.getNextPane(this.currentSeparator,this.order),this.prevPaneIndex=this.getPreviousPaneIndex(),this.nextPaneIndex=this.getNextPaneIndex()},u.prototype.getPaneHeight=function(e){return"Horizontal"===this.orientation?e.offsetWidth.toString():e.offsetHeight.toString()},u.prototype.boundingRectValues=function(e){return"Horizontal"===this.orientation?e.getBoundingClientRect().width:e.getBoundingClientRect().height},u.prototype.isValidSize=function(e){var i=!1;return!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(this.paneSettings[e].size)&&this.paneSettings[e].size.indexOf("%")>-1&&(i=!0),i},u.prototype.getPaneDimensions=function(){if(this.previousPaneHeightWidth=""===this.previousPane.style.flexBasis?this.getPaneHeight(this.previousPane):this.previousPane.style.flexBasis,this.nextPaneHeightWidth=""===this.nextPane.style.flexBasis?this.getPaneHeight(this.nextPane):this.nextPane.style.flexBasis,this.paneSettings.length<1)return this.prePaneDimenson=this.boundingRectValues(this.previousPane),void(this.nextPaneDimension=this.boundingRectValues(this.nextPane));this.isValidSize(this.prevPaneIndex)&&(this.previousPaneHeightWidth=this.convertPercentageToPixel(this.previousPaneHeightWidth).toString(),this.updatePrePaneInPercentage=!0),this.isValidSize(this.nextPaneIndex)&&(this.nextPaneHeightWidth=this.convertPercentageToPixel(this.nextPaneHeightWidth).toString(),this.updateNextPaneInPercentage=!0),this.prePaneDimenson=this.convertPixelToNumber(this.previousPaneHeightWidth.toString()),this.nextPaneDimension=this.convertPixelToNumber(this.nextPaneHeightWidth.toString())},u.prototype.checkCoordinates=function(e,t){var i=!0;return e!==this.previousCoordinates.x&&t!==this.previousCoordinates.y||(i=!1),i},u.prototype.isCursorMoved=function(e){return"mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType)?this.checkCoordinates(e.pageX,e.pageY):"msie"!==t.Browser.info.name?this.checkCoordinates(e.touches[0].pageX,e.touches[0].pageY):this.checkCoordinates(e.pageX,e.pageY)},u.prototype.getBorder=function(){this.border=0;var e="Horizontal"===this.orientation?(this.element.offsetWidth-this.element.clientWidth)/2:(this.element.offsetHeight-this.element.clientHeight)/2;this.border="chrome"!==t.Browser.info.name?this.border:e},u.prototype.onMouseMove=function(e){if(this.isCursorMoved(e)){this.getPaneDetails(),this.getPaneDimensions();var t={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],paneSize:[this.prePaneDimenson,this.nextPaneDimension],separator:this.currentSeparator};this.trigger("resizing",t);var i,n=this.validateDraggedPosition(this.getSeparatorPosition(e),this.prePaneDimenson,this.nextPaneDimension);if(this.getBorder(),i="Horizontal"===this.orientation?this.element.getBoundingClientRect().left+n-this.currentSeparator.getBoundingClientRect().left+this.border:this.element.getBoundingClientRect().top+n-this.currentSeparator.getBoundingClientRect().top+this.border,this.nextPaneHeightWidth="string"==typeof this.nextPaneHeightWidth&&this.nextPaneHeightWidth.indexOf("p")>-1?this.convertPixelToNumber(this.nextPaneHeightWidth):parseInt(this.nextPaneHeightWidth,10),this.prevPaneCurrentWidth=i+this.convertPixelToNumber(this.previousPaneHeightWidth),this.nextPaneCurrentWidth=this.nextPaneHeightWidth-i,this.validateMinMaxValues(),this.nextPaneCurrentWidth<0&&(this.nextPaneCurrentWidth=0),this.prevPaneCurrentWidth<0&&(this.prevPaneCurrentWidth=0),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth>this.totalWidth&&(this.nextPaneCurrentWidth<this.prevPaneCurrentWidth?this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth):this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth)),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth<this.totalWidth){var s=this.totalWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth);this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+s}this.calculateCurrentDimensions(),this.addStaticPaneClass(),this.previousPane.style.flexBasis=this.prevPaneCurrentWidth,this.nextPane.style.flexBasis=this.nextPaneCurrentWidth}},u.prototype.validateMinRange=function(e,i,n){var s,r,a=null,o=0;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(a=this.paneSettings[e].min.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i<(s=this.convertPixelToNumber(a))&&(o=i-s<=0?0:i-s,this.totalWidth=this.totalWidth-o,this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},u.prototype.validateMaxRange=function(e,i,n){var s,r,a=null;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(a=this.paneSettings[e].max.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i>(s=this.convertPixelToNumber(a))&&(this.totalWidth=this.totalWidth-(i-s),this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},u.prototype.validateMinMaxValues=function(){this.prevPaneCurrentWidth=this.validateMinRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMinRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane),this.prevPaneCurrentWidth=this.validateMaxRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMaxRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane)},u.prototype.equatePaneWidths=function(){var e;this.prevPaneCurrentWidth+this.nextPaneCurrentWidth>this.totalPercent&&(e=this.prevPaneCurrentWidth+this.nextPaneCurrentWidth-this.totalPercent,this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-e/2+"%"),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth<this.totalPercent&&(e=this.totalPercent-(this.prevPaneCurrentWidth+this.nextPaneCurrentWidth),this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+e/2+"%")},u.prototype.calculateCurrentDimensions=function(){this.updatePrePaneInPercentage||this.updateNextPaneInPercentage?(this.prevPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.prevPaneCurrentWidth))/10)),this.nextPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.nextPaneCurrentWidth))/10)),0===this.prevPaneCurrentWidth&&(this.nextPaneCurrentWidth=this.totalPercent),0===this.nextPaneCurrentWidth&&(this.prevPaneCurrentWidth=this.totalPercent),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth!==this.totalPercent?this.equatePaneWidths():(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"%"),this.prevPaneCurrentWidth=this.updatePrePaneInPercentage?this.prevPaneCurrentWidth:this.convertPercentageToPixel(this.prevPaneCurrentWidth)+"px",this.nextPaneCurrentWidth=this.updateNextPaneInPercentage?this.nextPaneCurrentWidth:this.convertPercentageToPixel(this.nextPaneCurrentWidth)+"px",this.updatePrePaneInPercentage=!1,this.updateNextPaneInPercentage=!1):(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"px",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"px")},u.prototype.addStaticPaneClass=function(){this.previousPane.classList.contains(l)||this.previousPane.classList.add(l),this.nextPane.classList.contains(l)||this.nextPane.classList.add(l)},u.prototype.validateDraggedPosition=function(e,i,n){var s="Horizontal"===this.orientation?this.currentSeparator.offsetLeft:this.currentSeparator.offsetTop,r=s-i,a=n+s,o=this.getMinMax(this.prevPaneIndex,this.previousPane,"min"),h=this.getMinMax(this.nextPaneIndex,this.nextPane,"min"),l=this.getMinMax(this.prevPaneIndex,this.previousPane,"max"),d=this.getMinMax(this.nextPaneIndex,this.nextPane,"max"),p=e;return e>a-h?p=a-h:e<r+o&&(p=r+o),t.isNullOrUndefined(l)?t.isNullOrUndefined(d)||e<a-d&&(p=a-d):e>r+l&&(p=r+l),p},u.prototype.onMouseUp=function(e){t.removeClass([this.currentSeparator],"e-split-bar-active"),this.unwireResizeEvents();var i={event:e,element:this.element,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],separator:this.currentSeparator,paneSize:[this.prePaneDimenson,this.nextPaneDimension]};this.trigger("resizeStop",i)},u.prototype.panesDimension=function(e,i){var n,s=i.length;parseInt(this.getHeight(this.element),10),t.isNullOrUndefined(this.paneSettings[e])?t.setStyleAttribute(i[e],{order:2*e}):t.isNullOrUndefined(this.paneSettings[e].size)?(this.sizeFlag=!0,t.setStyleAttribute(i[e],{order:2*e})):(n=this.paneSettings[e].size,e<s&&(t.setStyleAttribute(i[e],{"flex-basis":n,order:2*e}),e<s-1?t.addClass([i[e]],l):this.sizeFlag||(i[e].style.flexBasis=null),e===s-1&&this.sizeFlag&&t.addClass([i[e]],l))),this.paneOrder.push(2*e)},u.prototype.setTemplate=function(e,i){for(var n=[],s=0,r=t.compile(e)({});s<r.length;s++){var a=r[s];n.push(a)}t.append([].slice.call(n),i)},u.prototype.createSplitPane=function(e){var i=e.children.length;if(i<this.paneSettings.length)for(h=0;h<this.paneSettings.length;h++){var n=this.createElement("div");this.element.appendChild(n)}i=e.children.length;var o=[].slice.call(e.children);if(this.element.setAttribute("aria-orientation",this.orientation),this.element.setAttribute("role","splitter"),this.sizeFlag=!1,i>1)for(var h=0;h<i;h++)1===o[h].nodeType&&(this.allPanes.push(o[h]),"Horizontal"===this.orientation?(t.addClass([o[h]],[s,r,"e-scrollable"]),this.panesDimension(h,o)):(t.addClass([o[h]],[s,a,"e-scrollable"]),this.panesDimension(h,o)),t.isNullOrUndefined(this.paneSettings[h])||t.isNullOrUndefined(this.paneSettings[h].content)||this.setTemplate(this.paneSettings[h].content,o[h]))},u.prototype.destroy=function(){t.detach(this.element),this.element=this.wrapper,this.wrapperParent.appendChild(this.wrapper)},u.prototype.addPaneClass=function(e){return"Horizontal"===this.orientation?t.addClass([e],[s,r,"e-scrollable"]):t.addClass([e],[s,a,"e-scrollable"]),e},u.prototype.removePaneOrders=function(e){for(var t=document.querySelectorAll("."+e),i=0;i<t.length;i++)t[i].style.removeProperty("order")},u.prototype.setPaneOrder=function(){for(var e=0;e<this.allPanes.length;e++)this.panesDimension(e,this.allPanes)},u.prototype.removeSeparator=function(){for(var e=0;e<this.allBars.length;e++)t.detach(this.allBars[e]);this.allBars=[]},u.prototype.updatePanes=function(){this.setPaneOrder(),this.removeSeparator(),this.addSeparator(this.element)},u.prototype.addPane=function(e,i){var n=this.createElement("div");n=this.addPaneClass(n),i=i>this.allPanes.length+1?this.allPanes.length:i;var s={size:t.isNullOrUndefined(e.size)?"":e.size,min:t.isNullOrUndefined(e.min)?null:e.min,max:t.isNullOrUndefined(e.max)?null:e.max,content:t.isNullOrUndefined(e.content)?"":e.content,resizable:!!t.isNullOrUndefined(e.resizable)||e.resizable};this.paneSettings.splice(i,0,s),"Horizontal"===this.orientation?(this.element.insertBefore(n,this.element.querySelectorAll("."+r)[i]),this.removePaneOrders(r)):(this.element.insertBefore(n,this.element.querySelectorAll("."+a)[i]),this.removePaneOrders(a)),this.allPanes.splice(i,0,n),this.updatePanes(),this.setTemplate(this.paneSettings[i].content,n),this.allPanes[this.allPanes.length-1].classList.remove(l)},u.prototype.removePane=function(e){e=e>this.allPanes.length+1?this.allPanes.length:e;var i="Horizontal"===this.orientation?r:a;t.detach(this.element.querySelectorAll("."+i)[e]),this.allPanes.splice(e,1),this.removePaneOrders(i),this.updatePanes(),this.allPanes[this.allPanes.length-1].classList.remove(l)},n([t.Property("100%")],u.prototype,"height",void 0),n([t.Property("100%")],u.prototype,"width",void 0),n([t.Collection([],p)],u.prototype,"paneSettings",void 0),n([t.Property("Horizontal")],u.prototype,"orientation",void 0),n([t.Property("")],u.prototype,"cssClass",void 0),n([t.Property(!0)],u.prototype,"enabled",void 0),n([t.Property(!1)],u.prototype,"enableRtl",void 0),n([t.Property(null)],u.prototype,"separatorSize",void 0),n([t.Event()],u.prototype,"created",void 0),n([t.Event()],u.prototype,"resizeStart",void 0),n([t.Event()],u.prototype,"resizing",void 0),n([t.Event()],u.prototype,"resizeStop",void 0),u=n([t.NotifyPropertyChanges],u)}(t.Component);return e.PaneProperties=p,e.Splitter=u,e}({},ej.base),this.ejs=ej;
+this.ej=this.ej||{},this.ej.layouts=function(e,t){"use strict";var i=function(){var e=function(t,i){return(e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])})(t,i)};return function(t,i){function n(){this.constructor=t}e(t,i),t.prototype=null===i?Object.create(i):(n.prototype=i.prototype,new n)}}(),n=function(e,t,i,n){var s,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,n);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(r<3?s(a):r>3?s(t,i,a):s(t,i))||a);return r>3&&a&&Object.defineProperty(t,i,a),a},s="e-pane",r="e-pane-horizontal",a="e-pane-vertical",o="e-split-bar-horizontal",h="e-split-bar-vertical",l="e-static-pane",d="e-resize-handler",p=function(e){function s(){return null!==e&&e.apply(this,arguments)||this}return i(s,e),n([t.Property()],s.prototype,"size",void 0),n([t.Property(!0)],s.prototype,"resizable",void 0),n([t.Property(null)],s.prototype,"min",void 0),n([t.Property(null)],s.prototype,"max",void 0),n([t.Property()],s.prototype,"content",void 0),s}(t.ChildProperty),u=function(e){function u(t,i){var n=e.call(this,t,i)||this;return n.allPanes=[],n.paneOrder=[],n.separatorOrder=[],n.allBars=[],n.previousCoordinates={},n.currentCoordinates={},n.updatePrePaneInPercentage=!1,n.updateNextPaneInPercentage=!1,n.panesDimensions=[],n.border=0,n.validDataAttributes=["data-size","data-min","data-max","data-collapsible","data-resizable","data-content"],n.validElementAttributes=["data-orientation","data-width","data-height"],n}return i(u,e),u.prototype.onPropertyChanged=function(e,i){if(this.element.classList.contains("e-splitter"))for(var n=0,s=Object.keys(e);n<s.length;n++)switch(s[n]){case"height":this.setSplitterSize(this.element,e.height,"height");break;case"width":this.setSplitterSize(this.element,e.width,"width");break;case"cssClass":this.setCssClass(e.cssClass);break;case"enabled":this.isEnabled(this.enabled);break;case"separatorSize":this.setSeparatorSize(e.separatorSize);break;case"orientation":this.changeOrientation(e.orientation);break;case"paneSettings":if(!(e.paneSettings instanceof Array&&i.paneSettings instanceof Array))for(var r=Object.keys(e.paneSettings),a=0;a<r.length;a++)for(var o=parseInt(Object.keys(e.paneSettings)[a],10),h=Object.keys(e.paneSettings[o]).length,l=0;l<h;l++){var d=Object.keys(e.paneSettings[o])[l],p=Object(e.paneSettings[o])[d];o=this.enableRtl?this.allBars.length-1-o:o,"content"===d&&(this.allPanes[o].innerHTML="",this.setTemplate(p,this.allPanes[o])),"resizable"===d&&(t.EventHandler.remove(this.allBars[o],"mousedown",this.onMouseDown),p?(t.EventHandler.add(this.allBars[o],"mousedown",this.onMouseDown,this),this.currentSeparator=this.allBars[o],this.isResizable()&&(this.showResizer(this.allBars[o]),this.allBars[o].classList.add("e-resizable-split-bar"))):(this.hideResizer(this.allBars[o]),this.allBars[o].classList.remove("e-resizable-split-bar"))),"size"===d&&(this.allPanes[o].style.flexBasis=p)}break;case"enableRtl":this.setRTL(e.enableRtl)}},u.prototype.preRender=function(){this.wrapper=this.element.cloneNode(!0),this.wrapperParent=this.element.parentElement,t.removeClass([this.wrapper],["e-control","e-lib","e-splitter"]);var e="Horizontal"===this.orientation?"e-splitter-horizontal":"e-splitter-vertical";t.addClass([this.element],e),t.Browser.isDevice&&t.addClass([this.element],"e-splitter-touch")},u.prototype.getPersistData=function(){return this.addOnPersist([])},u.prototype.getModuleName=function(){return"splitter"},u.prototype.render=function(){this.checkDataAttributes(),this.setCssClass(this.cssClass),this.isEnabled(this.enabled),this.setDimension(this.getHeight(this.element),this.getWidth(this.element)),this.createSplitPane(this.element),this.addSeparator(this.element),this.getPanesDimensions(),this.setRTL(this.enableRtl)},u.prototype.checkDataAttributes=function(){for(var e,i,n=0;n<this.validElementAttributes.length;n++)i=this.element.getAttribute(this.validElementAttributes[n]),t.isNullOrUndefined(i)||(this[e=this.removeDataPrefix(this.validElementAttributes[n])]=i);for(var s=0;s<this.element.children.length;s++)for(var r=0;r<this.validDataAttributes.length;r++)if(i=this.element.children[s].getAttribute(this.validDataAttributes[r]),!t.isNullOrUndefined(i)){i="collapsible"===(e=this.removeDataPrefix(this.validDataAttributes[r]))||"resizable"===e?"true"===i:i,t.isNullOrUndefined(this.paneSettings[s])&&(this.paneSettings[s]={size:"",min:null,max:null,content:"",resizable:!0});var a=this.paneSettings[s][e];"resizable"===e&&this.paneSettings[s].resizable&&(this.paneSettings[s][e]=i),(t.isNullOrUndefined(a)||""===a)&&(this.paneSettings[s][e]=i)}},u.prototype.removeDataPrefix=function(e){return e.slice(e.lastIndexOf("-")+1)},u.prototype.setRTL=function(e){e?t.addClass([this.element],"e-rtl"):t.removeClass([this.element],"e-rtl")},u.prototype.setSplitterSize=function(e,i,n){var s="width"===n?{width:t.formatUnit(i)}:{height:t.formatUnit(i)};t.setStyleAttribute(e,s)},u.prototype.getPanesDimensions=function(){for(var e=0;e<this.allPanes.length;e++)"Horizontal"===this.orientation?this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().width):this.panesDimensions.push(this.allPanes[e].getBoundingClientRect().height)},u.prototype.setCssClass=function(e){""!==e&&t.addClass([this.element],e.split(" "))},u.prototype.hideResizer=function(e){t.addClass([t.select("."+d,e)],"e-hide-handler")},u.prototype.showResizer=function(e){t.removeClass([t.select("."+d,e)],"e-hide-handler")},u.prototype.isEnabled=function(e){e?t.removeClass([this.element],"e-disabled"):t.addClass([this.element],"e-disabled")},u.prototype.setSeparatorSize=function(e){for(var i=t.isNullOrUndefined(e)?"auto":e+"px",n="Horizontal"===this.orientation?o:h,s=0;s<this.allBars.length;s++){var r=t.selectAll("."+n,this.element)[s],a=t.selectAll("."+d,r)[0];"Horizontal"===this.orientation?(r.style.width=i,t.isNullOrUndefined(a)||(a.style.width=i)):(r.style.height=i,t.isNullOrUndefined(a)||(a.style.height=i))}},u.prototype.changeOrientation=function(e){var t="Vertical"===e;this.element.classList.remove(t?"e-splitter-horizontal":"e-splitter-vertical"),this.element.classList.add(t?"e-splitter-vertical":"e-splitter-horizontal"),this.element.removeAttribute("aria-orientation"),this.element.setAttribute("aria-orientation",e);for(i=0;i<this.allPanes.length;i++)this.allPanes[i].classList.remove(t?r:a),this.allPanes[i].classList.add(t?a:r);for(var i=0;i<this.allBars.length;i++)this.allBars[i].classList.remove(t?o:h),this.allBars[i].classList.add(t?h:o)},u.prototype.getPrevPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2+1:(t-1)/2;return e.parentElement.children[i]},u.prototype.getNextPane=function(e,t){var i=this.enableRtl&&"Horizontal"===this.orientation?(t-1)/2:(t-1)/2+1;return e.parentElement.children[i]},u.prototype.addResizeHandler=function(e){var i=this.createElement("div");t.addClass([i],[d,"e-icons"]);var n=t.isNullOrUndefined(this.separatorSize)?"1px":this.separatorSize+"px";"Horizontal"===this.orientation?i.style.width=n:i.style.height=n,e.appendChild(i)},u.prototype.getHeight=function(e){this.height;return""!==e.style.height&&"100%"===this.height?e.style.height:this.height},u.prototype.getWidth=function(e){this.width;return""!==e.style.width&&"100%"===this.width?e.style.width:this.width},u.prototype.setDimension=function(e,i){t.setStyleAttribute(this.element,{height:e,width:i})},u.prototype.createSeparator=function(e){var i=this.createElement("div");return this.allBars.push(i),"Horizontal"===this.orientation?(t.addClass([i],["e-split-bar",o]),i.style.width=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"):(t.addClass([i],["e-split-bar",h]),i.style.height=t.isNullOrUndefined(this.separatorSize)?"auto":this.separatorSize+"px"),this.addMouseActions(i),this.addResizeHandler(i),i},u.prototype.addSeparator=function(e){for(var i=this.allPanes.length,n=e.children,s=0;s<i;s++)if(s<i-1){var r=this.createSeparator(s);if(t.setStyleAttribute(r,{order:2*s+1}),this.separatorOrder.push(2*s+1),n[s].parentNode.appendChild(r),this.currentSeparator=r,r.setAttribute("role","separator"),this.isResizable()){t.EventHandler.add(r,"mousedown",this.onMouseDown,this);var a="msie"===t.Browser.info.name?"pointerdown":"touchstart";t.EventHandler.add(r,a,this.onMouseDown,this),r.classList.add("e-resizable-split-bar")}else this.hideResizer(r)}},u.prototype.isResizable=function(){var e=!1;return(!t.isNullOrUndefined(this.paneSettings[this.getPreviousPaneIndex()])&&this.paneSettings[this.getPreviousPaneIndex()].resizable&&!t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()])&&this.paneSettings[this.getNextPaneIndex()].resizable||t.isNullOrUndefined(this.paneSettings[this.getNextPaneIndex()]))&&(e=!0),e},u.prototype.addMouseActions=function(e){e.addEventListener("mouseover",function(){t.addClass([e],["e-split-bar-hover"])}),e.addEventListener("mouseout",function(){t.removeClass([e],["e-split-bar-hover"])})},u.prototype.getEventType=function(e){return e.indexOf("mouse")>-1?"mouse":"touch"},u.prototype.updateCurrentSeparator=function(e){this.currentSeparator=this.isSeparator(e)?e:e.parentElement},u.prototype.isSeparator=function(e){var t=!0;return(e.classList.contains(d)||e.classList.contains("e-split-line"))&&(t=!1),t},u.prototype.isMouseEvent=function(e){var i=!1;return("mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType))&&(i=!0),i},u.prototype.updateCursorPosition=function(e,i){if(this.isMouseEvent(e))this.changeCoordinates({x:e.pageX,y:e.pageY},i);else{var n="msie"!==t.Browser.info.name?e.touches[0]:e;this.changeCoordinates({x:n.pageX,y:n.pageY},i)}},u.prototype.changeCoordinates=function(e,t){"previous"===t?this.previousCoordinates=e:this.currentCoordinates=e},u.prototype.wireResizeEvents=function(){t.EventHandler.add(document,"mousemove",this.onMouseMove,this),t.EventHandler.add(document,"mouseup",this.onMouseUp,this);var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.add(document,e,this.onMouseMove,this),t.EventHandler.add(document,i,this.onMouseUp,this)},u.prototype.unwireResizeEvents=function(){var e="msie"===t.Browser.info.name?"pointermove":"touchmove",i="msie"===t.Browser.info.name?"pointerup":"touchend";t.EventHandler.remove(document,"mousemove",this.onMouseMove),t.EventHandler.remove(document,"mouseup",this.onMouseUp),t.EventHandler.remove(document,e,this.onMouseMove),t.EventHandler.remove(document,i,this.onMouseUp)},u.prototype.onMouseDown=function(e){e.preventDefault();var i=e.target;this.updateCurrentSeparator(i),t.addClass([this.currentSeparator],"e-split-bar-active"),this.updateCursorPosition(e,"previous"),this.getPaneDetails();var n={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.getPreviousPaneIndex(),this.getNextPaneIndex()],separator:this.currentSeparator,cancel:!1};if(this.trigger("resizeStart",n),!n.cancel)if(this.wireResizeEvents(),this.previousPane.style.flexBasis.indexOf("%")>0||this.nextPane.style.flexBasis.indexOf("%")>0){var s=this.updatePaneFlexBasis(this.previousPane),r=this.updatePaneFlexBasis(this.nextPane);this.totalPercent=s+r,this.totalWidth=this.convertPercentageToPixel(this.totalPercent+"%")}else this.totalWidth="Horizontal"===this.orientation?this.previousPane.offsetWidth+this.nextPane.offsetWidth:this.previousPane.offsetHeight+this.nextPane.offsetHeight},u.prototype.updatePaneFlexBasis=function(e){var t;if(e.style.flexBasis.indexOf("%")>0)t=this.removePercentageUnit(e.style.flexBasis);else if(""!==e.style.flexBasis)t=this.convertPixelToPercentage(this.convertPixelToNumber(e.style.flexBasis));else{var i="Horizontal"===this.orientation?e.offsetWidth+this.currentSeparator.offsetWidth:e.offsetHeight+this.currentSeparator.offsetHeight;t=this.convertPixelToPercentage(i)}return t},u.prototype.removePercentageUnit=function(e){return parseFloat(e.slice(0,e.indexOf("%")))},u.prototype.convertPercentageToPixel=function(e,i){var n,s=e.toString();if(s.indexOf("%")>-1){n=parseFloat(s.slice(0,s.indexOf("%")));var r=void 0;r=t.isNullOrUndefined(i)?"Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight:this.panesDimensions[this.allPanes.indexOf(i)],n=Math.ceil(r*(n/100))}else n=parseInt(s,10);return n},u.prototype.convertPixelToPercentage=function(e){return e/("Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight)*100},u.prototype.convertPixelToNumber=function(e){return e.indexOf("p")>-1?parseFloat(e.slice(0,e.indexOf("p"))):parseFloat(e)},u.prototype.calcDragPosition=function(e,t){var i,n;return i="Horizontal"===this.orientation?this.currentCoordinates.x-e:this.currentCoordinates.y-e,n=i/t,(n=n>1?1:n<0?0:n)*t},u.prototype.getSeparatorPosition=function(e){this.updateCursorPosition(e,"current");var t="Horizontal"===this.orientation?this.element.getBoundingClientRect().left:this.element.getBoundingClientRect().top,i="Horizontal"===this.orientation?this.element.offsetWidth:this.element.offsetHeight;return this.calcDragPosition(t,i)},u.prototype.getMinMax=function(e,i,n){var s="min"===n?0:null,r=null;return"min"===n?t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(r=this.paneSettings[e].min):t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(r=this.paneSettings[e].max),this.paneSettings.length>0&&!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(r)?(r.indexOf("%")>0&&(r=this.convertPercentageToPixel(r).toString()),this.convertPixelToNumber(r)):s},u.prototype.getPreviousPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e+1:e},u.prototype.getNextPaneIndex=function(){var e=(parseInt(this.currentSeparator.style.order,10)-1)/2;return this.enableRtl?e:e+1},u.prototype.getPaneDetails=function(){this.order=parseInt(this.currentSeparator.style.order,10),this.previousPane=this.getPrevPane(this.currentSeparator,this.order),this.nextPane=this.getNextPane(this.currentSeparator,this.order),this.prevPaneIndex=this.getPreviousPaneIndex(),this.nextPaneIndex=this.getNextPaneIndex()},u.prototype.getPaneHeight=function(e){return"Horizontal"===this.orientation?e.offsetWidth.toString():e.offsetHeight.toString()},u.prototype.boundingRectValues=function(e){return"Horizontal"===this.orientation?e.getBoundingClientRect().width:e.getBoundingClientRect().height},u.prototype.isValidSize=function(e){var i=!1;return!t.isNullOrUndefined(this.paneSettings[e])&&!t.isNullOrUndefined(this.paneSettings[e].size)&&this.paneSettings[e].size.indexOf("%")>-1&&(i=!0),i},u.prototype.getPaneDimensions=function(){if(this.previousPaneHeightWidth=""===this.previousPane.style.flexBasis?this.getPaneHeight(this.previousPane):this.previousPane.style.flexBasis,this.nextPaneHeightWidth=""===this.nextPane.style.flexBasis?this.getPaneHeight(this.nextPane):this.nextPane.style.flexBasis,this.paneSettings.length<1)return this.prePaneDimenson=this.boundingRectValues(this.previousPane),void(this.nextPaneDimension=this.boundingRectValues(this.nextPane));this.isValidSize(this.prevPaneIndex)&&(this.previousPaneHeightWidth=this.convertPercentageToPixel(this.previousPaneHeightWidth).toString(),this.updatePrePaneInPercentage=!0),this.isValidSize(this.nextPaneIndex)&&(this.nextPaneHeightWidth=this.convertPercentageToPixel(this.nextPaneHeightWidth).toString(),this.updateNextPaneInPercentage=!0),this.prePaneDimenson=this.convertPixelToNumber(this.previousPaneHeightWidth.toString()),this.nextPaneDimension=this.convertPixelToNumber(this.nextPaneHeightWidth.toString())},u.prototype.checkCoordinates=function(e,t){var i=!0;return e!==this.previousCoordinates.x&&t!==this.previousCoordinates.y||(i=!1),i},u.prototype.isCursorMoved=function(e){return"mouse"===this.getEventType(e.type)||!t.isNullOrUndefined(e.pointerType)&&"mouse"===this.getEventType(e.pointerType)?this.checkCoordinates(e.pageX,e.pageY):"msie"!==t.Browser.info.name?this.checkCoordinates(e.touches[0].pageX,e.touches[0].pageY):this.checkCoordinates(e.pageX,e.pageY)},u.prototype.getBorder=function(){this.border=0;var e="Horizontal"===this.orientation?(this.element.offsetWidth-this.element.clientWidth)/2:(this.element.offsetHeight-this.element.clientHeight)/2;this.border="chrome"!==t.Browser.info.name?this.border:e},u.prototype.onMouseMove=function(e){if(this.isCursorMoved(e)){this.getPaneDetails(),this.getPaneDimensions();var t={element:this.element,event:e,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],paneSize:[this.prePaneDimenson,this.nextPaneDimension],separator:this.currentSeparator};this.trigger("resizing",t);var i,n=this.validateDraggedPosition(this.getSeparatorPosition(e),this.prePaneDimenson,this.nextPaneDimension);if(this.getBorder(),i="Horizontal"===this.orientation?this.element.getBoundingClientRect().left+n-this.currentSeparator.getBoundingClientRect().left+this.border:this.element.getBoundingClientRect().top+n-this.currentSeparator.getBoundingClientRect().top+this.border,this.nextPaneHeightWidth="string"==typeof this.nextPaneHeightWidth&&this.nextPaneHeightWidth.indexOf("p")>-1?this.convertPixelToNumber(this.nextPaneHeightWidth):parseInt(this.nextPaneHeightWidth,10),this.prevPaneCurrentWidth=i+this.convertPixelToNumber(this.previousPaneHeightWidth),this.nextPaneCurrentWidth=this.nextPaneHeightWidth-i,this.validateMinMaxValues(),this.nextPaneCurrentWidth<0&&(this.nextPaneCurrentWidth=0),this.prevPaneCurrentWidth<0&&(this.prevPaneCurrentWidth=0),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth>this.totalWidth&&(this.nextPaneCurrentWidth<this.prevPaneCurrentWidth?this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth):this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth-this.totalWidth)),this.nextPaneCurrentWidth+this.prevPaneCurrentWidth<this.totalWidth){var s=this.totalWidth-(this.nextPaneCurrentWidth+this.prevPaneCurrentWidth);this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+s}this.calculateCurrentDimensions(),this.addStaticPaneClass(),this.previousPane.style.flexBasis=this.prevPaneCurrentWidth,this.nextPane.style.flexBasis=this.nextPaneCurrentWidth}},u.prototype.validateMinRange=function(e,i,n){var s,r,a=null,o=0;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].min)||(a=this.paneSettings[e].min.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i<(s=this.convertPixelToNumber(a))&&(o=i-s<=0?0:i-s,this.totalWidth=this.totalWidth-o,this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},u.prototype.validateMaxRange=function(e,i,n){var s,r,a=null;return t.isNullOrUndefined(this.paneSettings[e])||t.isNullOrUndefined(this.paneSettings[e].max)||(a=this.paneSettings[e].max.toString()),t.isNullOrUndefined(a)||(a.indexOf("%")>0&&(a=this.convertPercentageToPixel(a).toString()),i>(s=this.convertPixelToNumber(a))&&(this.totalWidth=this.totalWidth-(i-s),this.totalPercent=this.convertPixelToPercentage(this.totalWidth),r=s)),t.isNullOrUndefined(r)?i:r},u.prototype.validateMinMaxValues=function(){this.prevPaneCurrentWidth=this.validateMinRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMinRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane),this.prevPaneCurrentWidth=this.validateMaxRange(this.prevPaneIndex,this.prevPaneCurrentWidth,this.previousPane),this.nextPaneCurrentWidth=this.validateMaxRange(this.nextPaneIndex,this.nextPaneCurrentWidth,this.nextPane)},u.prototype.equatePaneWidths=function(){var e;this.prevPaneCurrentWidth+this.nextPaneCurrentWidth>this.totalPercent&&(e=this.prevPaneCurrentWidth+this.nextPaneCurrentWidth-this.totalPercent,this.prevPaneCurrentWidth=this.prevPaneCurrentWidth-e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth-e/2+"%"),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth<this.totalPercent&&(e=this.totalPercent-(this.prevPaneCurrentWidth+this.nextPaneCurrentWidth),this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+e/2+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+e/2+"%")},u.prototype.calculateCurrentDimensions=function(){this.updatePrePaneInPercentage||this.updateNextPaneInPercentage?(this.prevPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.prevPaneCurrentWidth))/10)),this.nextPaneCurrentWidth=Math.round(Number(Math.round(10*this.convertPixelToPercentage(this.nextPaneCurrentWidth))/10)),0===this.prevPaneCurrentWidth&&(this.nextPaneCurrentWidth=this.totalPercent),0===this.nextPaneCurrentWidth&&(this.prevPaneCurrentWidth=this.totalPercent),this.prevPaneCurrentWidth+this.nextPaneCurrentWidth!==this.totalPercent?this.equatePaneWidths():(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"%",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"%"),this.prevPaneCurrentWidth=this.updatePrePaneInPercentage?this.prevPaneCurrentWidth:this.convertPercentageToPixel(this.prevPaneCurrentWidth)+"px",this.nextPaneCurrentWidth=this.updateNextPaneInPercentage?this.nextPaneCurrentWidth:this.convertPercentageToPixel(this.nextPaneCurrentWidth)+"px",this.updatePrePaneInPercentage=!1,this.updateNextPaneInPercentage=!1):(this.prevPaneCurrentWidth=this.prevPaneCurrentWidth+"px",this.nextPaneCurrentWidth=this.nextPaneCurrentWidth+"px")},u.prototype.addStaticPaneClass=function(){this.previousPane.classList.contains(l)||this.previousPane.classList.add(l),this.nextPane.classList.contains(l)||this.nextPane.classList.add(l)},u.prototype.validateDraggedPosition=function(e,i,n){var s="Horizontal"===this.orientation?this.currentSeparator.offsetLeft:this.currentSeparator.offsetTop,r=s-i,a=n+s,o=this.getMinMax(this.prevPaneIndex,this.previousPane,"min"),h=this.getMinMax(this.nextPaneIndex,this.nextPane,"min"),l=this.getMinMax(this.prevPaneIndex,this.previousPane,"max"),d=this.getMinMax(this.nextPaneIndex,this.nextPane,"max"),p=e;return e>a-h?p=a-h:e<r+o&&(p=r+o),t.isNullOrUndefined(l)?t.isNullOrUndefined(d)||e<a-d&&(p=a-d):e>r+l&&(p=r+l),p},u.prototype.onMouseUp=function(e){t.removeClass([this.currentSeparator],"e-split-bar-active"),this.unwireResizeEvents();var i={event:e,element:this.element,pane:[this.previousPane,this.nextPane],index:[this.prevPaneIndex,this.nextPaneIndex],separator:this.currentSeparator,paneSize:[this.prePaneDimenson,this.nextPaneDimension]};this.trigger("resizeStop",i)},u.prototype.panesDimension=function(e,i){var n,s=i.length;parseInt(this.getHeight(this.element),10),t.isNullOrUndefined(this.paneSettings[e])?t.setStyleAttribute(i[e],{order:2*e}):t.isNullOrUndefined(this.paneSettings[e].size)?(this.sizeFlag=!0,t.setStyleAttribute(i[e],{order:2*e})):(n=this.paneSettings[e].size,e<s&&(t.setStyleAttribute(i[e],{"flex-basis":n,order:2*e}),e<s-1?t.addClass([i[e]],l):this.sizeFlag||(i[e].style.flexBasis=null),e===s-1&&this.sizeFlag&&t.addClass([i[e]],l))),this.paneOrder.push(2*e)},u.prototype.setTemplate=function(e,i){for(var n=[],s=0,r=t.compile(e)({});s<r.length;s++){var a=r[s];n.push(a)}t.append([].slice.call(n),i)},u.prototype.createSplitPane=function(e){for(var i=e.children.length,n=0;n<this.paneSettings.length;n++)if(i<this.paneSettings.length){var o=this.createElement("div");this.element.appendChild(o),i+=1}i=e.children.length;var h=[].slice.call(e.children);if(this.element.setAttribute("aria-orientation",this.orientation),this.element.setAttribute("role","splitter"),this.sizeFlag=!1,i>1)for(n=0;n<i;n++)1===h[n].nodeType&&(this.allPanes.push(h[n]),"Horizontal"===this.orientation?(t.addClass([h[n]],[s,r,"e-scrollable"]),this.panesDimension(n,h)):(t.addClass([h[n]],[s,a,"e-scrollable"]),this.panesDimension(n,h)),t.isNullOrUndefined(this.paneSettings[n])||t.isNullOrUndefined(this.paneSettings[n].content)||this.setTemplate(this.paneSettings[n].content,h[n]))},u.prototype.destroy=function(){t.detach(this.element),this.element=this.wrapper,this.wrapperParent.appendChild(this.wrapper)},u.prototype.addPaneClass=function(e){return"Horizontal"===this.orientation?t.addClass([e],[s,r,"e-scrollable"]):t.addClass([e],[s,a,"e-scrollable"]),e},u.prototype.removePaneOrders=function(e){for(var t=document.querySelectorAll("."+e),i=0;i<t.length;i++)t[i].style.removeProperty("order")},u.prototype.setPaneOrder=function(){for(var e=0;e<this.allPanes.length;e++)this.panesDimension(e,this.allPanes)},u.prototype.removeSeparator=function(){for(var e=0;e<this.allBars.length;e++)t.detach(this.allBars[e]);this.allBars=[]},u.prototype.updatePanes=function(){this.setPaneOrder(),this.removeSeparator(),this.addSeparator(this.element)},u.prototype.addPane=function(e,i){var n=this.createElement("div");n=this.addPaneClass(n),i=i>this.allPanes.length+1?this.allPanes.length:i;var s={size:t.isNullOrUndefined(e.size)?"":e.size,min:t.isNullOrUndefined(e.min)?null:e.min,max:t.isNullOrUndefined(e.max)?null:e.max,content:t.isNullOrUndefined(e.content)?"":e.content,resizable:!!t.isNullOrUndefined(e.resizable)||e.resizable};this.paneSettings.splice(i,0,s),"Horizontal"===this.orientation?(this.element.insertBefore(n,this.element.querySelectorAll("."+r)[i]),this.removePaneOrders(r)):(this.element.insertBefore(n,this.element.querySelectorAll("."+a)[i]),this.removePaneOrders(a)),this.allPanes.splice(i,0,n),this.updatePanes(),this.setTemplate(this.paneSettings[i].content,n),this.allPanes[this.allPanes.length-1].classList.remove(l)},u.prototype.removePane=function(e){e=e>this.allPanes.length+1?this.allPanes.length:e;var i="Horizontal"===this.orientation?r:a;t.isNullOrUndefined(this.element.querySelectorAll("."+i)[e])||(t.detach(this.element.querySelectorAll("."+i)[e]),this.allPanes.splice(e,1),this.removePaneOrders(i),this.updatePanes(),this.allPanes[this.allPanes.length-1].classList.remove(l))},n([t.Property("100%")],u.prototype,"height",void 0),n([t.Property("100%")],u.prototype,"width",void 0),n([t.Collection([],p)],u.prototype,"paneSettings",void 0),n([t.Property("Horizontal")],u.prototype,"orientation",void 0),n([t.Property("")],u.prototype,"cssClass",void 0),n([t.Property(!0)],u.prototype,"enabled",void 0),n([t.Property(!1)],u.prototype,"enableRtl",void 0),n([t.Property(null)],u.prototype,"separatorSize",void 0),n([t.Event()],u.prototype,"created",void 0),n([t.Event()],u.prototype,"resizeStart",void 0),n([t.Event()],u.prototype,"resizing",void 0),n([t.Event()],u.prototype,"resizeStop",void 0),u=n([t.NotifyPropertyChanges],u)}(t.Component);return e.PaneProperties=p,e.Splitter=u,e}({},ej.base),this.ejs=ej;
 //# sourceMappingURL=ej2-layouts.min.js.map

dist/global/index.d.ts

 /*!
 *  filename: index.d.ts
-*  version : 16.4.44
-*  Copyright Syncfusion Inc. 2001 - 2018. All rights reserved.
+*  version : 16.4.47
+*  Copyright Syncfusion Inc. 2001 - 2019. All rights reserved.
 *  Use of this code is subject to the terms of our license.
@@ -6,0 +6,0 @@ *  A copy of the current license can be obtained at any time by e-mailing

package.json

 {
   "name": "@syncfusion/ej2-layouts",
-  "version": "16.4.44",
+  "version": "16.4.47",
   "description": "A package of Essential JS 2 layout pure CSS components such as card and avatar. The card is used as small container to show content in specific structure, whereas the avatars are icons, initials or figures representing particular person.",
@@ -8,3 +8,3 @@ "author": "Syncfusion Inc.",
   "dependencies": {
-    "@syncfusion/ej2-base": "~16.4.42"
+    "@syncfusion/ej2-base": "~16.4.47"
   },
@@ -11,0 +11,0 @@ "devDependencies": {

README.md

@@ -100,2 +100,2 @@ # ej2-layouts
 
-© Copyright 2018 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.
+© Copyright 2019 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.

src/splitter/splitter.d.ts

@@ -253,5 +253,16 @@ import { Component, ChildProperty } from '@syncfusion/ej2-base';
     private setPaneOrder;
-    removeSeparator(): void;
+    private removeSeparator;
     private updatePanes;
+    /**
+     * Allows you to add a pane dynamically to the specified index position by passing the pane properties.
+     * @param { PanePropertiesModel } paneProperties - Specifies the pane’s properties that apply to new pane.
+     * @param { number } index - Specifies the index where the pane will be inserted.
+     * @returns void
+     */
     addPane(paneProperties: PanePropertiesModel, index: number): void;
+    /**
+     * Allows you to remove the specified pane dynamically by passing its index value.
+     * @param { number } index - Specifies the index value to remove the corresponding pane.
+     * @returns void
+     */
     removePane(index: number): void;
@@ -258,0 +269,0 @@ }

src/splitter/splitter.js

@@ -109,3 +109,3 @@ var __extends = (this && this.__extends) || (function () {
         _this.border = 0;
-        _this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible', 'data-resizable'];
+        _this.validDataAttributes = ['data-size', 'data-min', 'data-max', 'data-collapsible', 'data-resizable', 'data-content'];
         _this.validElementAttributes = ['data-orientation', 'data-width', 'data-height'];
@@ -148,30 +148,33 @@ return _this;
                     if (!(newProp.paneSettings instanceof Array && oldProp.paneSettings instanceof Array)) {
-                        var changedProp = Object.keys(newProp.paneSettings);
-                        for (var j = 0; j < changedProp.length; j++) {
-                            var index = parseInt(Object.keys(newProp.paneSettings)[j], 10);
-                            var property = Object.keys(newProp.paneSettings[index])[0];
-                            var newVal = Object(newProp.paneSettings[index])[property];
-                            index = (this.enableRtl) ? (this.allBars.length - 1) - index : index;
-                            if (property === 'content') {
-                                this.allPanes[index].innerHTML = '';
-                                this.setTemplate(newVal, this.allPanes[index]);
-                            }
-                            if (property === 'resizable') {
-                                EventHandler.remove(this.allBars[index], 'mousedown', this.onMouseDown);
-                                if (newVal) {
-                                    EventHandler.add(this.allBars[index], 'mousedown', this.onMouseDown, this);
-                                    this.currentSeparator = this.allBars[index];
-                                    if (this.isResizable()) {
-                                        this.showResizer(this.allBars[index]);
-                                        this.allBars[index].classList.add(RESIZABLE_BAR);
+                        var paneCounts = Object.keys(newProp.paneSettings);
+                        for (var i = 0; i < paneCounts.length; i++) {
+                            var index = parseInt(Object.keys(newProp.paneSettings)[i], 10);
+                            var changedPropsCount = Object.keys(newProp.paneSettings[index]).length;
+                            for (var j = 0; j < changedPropsCount; j++) {
+                                var property = Object.keys(newProp.paneSettings[index])[j];
+                                var newVal = Object(newProp.paneSettings[index])[property];
+                                index = (this.enableRtl) ? (this.allBars.length - 1) - index : index;
+                                if (property === 'content') {
+                                    this.allPanes[index].innerHTML = '';
+                                    this.setTemplate(newVal, this.allPanes[index]);
+                                }
+                                if (property === 'resizable') {
+                                    EventHandler.remove(this.allBars[index], 'mousedown', this.onMouseDown);
+                                    if (newVal) {
+                                        EventHandler.add(this.allBars[index], 'mousedown', this.onMouseDown, this);
+                                        this.currentSeparator = this.allBars[index];
+                                        if (this.isResizable()) {
+                                            this.showResizer(this.allBars[index]);
+                                            this.allBars[index].classList.add(RESIZABLE_BAR);
+                                        }
                                     }
+                                    else {
+                                        this.hideResizer(this.allBars[index]);
+                                        this.allBars[index].classList.remove(RESIZABLE_BAR);
+                                    }
                                 }
-                                else {
-                                    this.hideResizer(this.allBars[index]);
-                                    this.allBars[index].classList.remove(RESIZABLE_BAR);
+                                if (property === 'size') {
+                                    this.allPanes[index].style.flexBasis = newVal;
                                 }
                             }
-                            if (property === 'size') {
-                                this.allPanes[index].style.flexBasis = newVal;
-                            }
                         }
@@ -926,6 +929,7 @@ }
         var childCount = target.children.length;
-        if (childCount < this.paneSettings.length) {
-            for (var i = 0; i < this.paneSettings.length; i++) {
+        for (var i = 0; i < this.paneSettings.length; i++) {
+            if (childCount < this.paneSettings.length) {
                 var childElement = this.createElement('div');
                 this.element.appendChild(childElement);
+                childCount = childCount + 1;
             }
@@ -999,2 +1003,8 @@ }
     };
+    /**
+     * Allows you to add a pane dynamically to the specified index position by passing the pane properties.
+     * @param { PanePropertiesModel } paneProperties - Specifies the pane’s properties that apply to new pane.
+     * @param { number } index - Specifies the index where the pane will be inserted.
+     * @returns void
+     */
     Splitter.prototype.addPane = function (paneProperties, index) {
@@ -1025,5 +1035,13 @@ var newPane = this.createElement('div');
     };
+    /**
+     * Allows you to remove the specified pane dynamically by passing its index value.
+     * @param { number } index - Specifies the index value to remove the corresponding pane.
+     * @returns void
+     */
     Splitter.prototype.removePane = function (index) {
         index = (index > this.allPanes.length + 1) ? this.allPanes.length : index;
         var elementClass = (this.orientation === 'Horizontal') ? SPLIT_H_PANE : SPLIT_V_PANE;
+        if (isNullOrUndefined(this.element.querySelectorAll('.' + elementClass)[index])) {
+            return;
+        }
         detach(this.element.querySelectorAll('.' + elementClass)[index]);
@@ -1030,0 +1048,0 @@ this.allPanes.splice(index, 1);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

978432

increased by0.97%

Lines of code

14853

increased by0.45%

Dependency changes

• Updated@syncfusion/ej2-base@~16.4.47