@syncfusion/ej2-navigations 33.1.45 → 33.1.47

package/dist/es6/ej2-navigations.es5.js

@@ -148,6 +148,7 @@ var HScroll = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     HScroll.prototype.destroy = function () {
+        var _this = this;
         var ele = this.element;
         ele.style.display = '';
         ele.classList.remove(CLS_ROOT);
@@ -155,8 +156,22 @@ var HScroll = /** @__PURE__ @class */ (function (_super) {
         ele.classList.remove(CLS_RTL);
         var nav = selectAll('.e-' + ele.id + '_nav.' + CLS_HSCROLLNAV, ele);
         var overlay = selectAll('.' + CLS_OVERLAY, ele);
-        [].slice.call(overlay).forEach(function (ele) {
-            detach(ele);
+        [].slice.call(overlay).forEach(function (oElem) {
+            if (_this.onKeyPressBound) {
+                oElem.removeEventListener('keydown', _this.onKeyPressBound);
+            }
+            if (_this.onKeyUpBound) {
+                oElem.removeEventListener('keyup', _this.onKeyUpBound);
+            }
+            if (_this.repeatScrollBound) {
+                oElem.removeEventListener('mouseup', _this.repeatScrollBound);
+                oElem.removeEventListener('touchend', _this.repeatScrollBound);
+            }
+            if (_this.contextMenuBound) {
+                oElem.removeEventListener('contextmenu', _this.contextMenuBound);
+            }
+            EventHandler.remove(oElem, 'click', _this.clickEventHandler);
+            detach(oElem);
         });
         for (var _i = 0, _a = [].slice.call(this.scrollItems.children); _i < _a.length; _i++) {
             var elem = _a[_i];
@@ -167,14 +182,37 @@ var HScroll = /** @__PURE__ @class */ (function (_super) {
         }
         detach(this.scrollEle);
         if (nav.length > 0) {
-            detach(nav[0]);
-            if (!isNullOrUndefined(nav[1])) {
-                detach(nav[1]);
-            }
+            [].slice.call(nav).forEach(function (nElem) {
+                if (_this.onKeyPressBound) {
+                    nElem.removeEventListener('keydown', _this.onKeyPressBound);
+                }
+                if (_this.onKeyUpBound) {
+                    nElem.removeEventListener('keyup', _this.onKeyUpBound);
+                }
+                if (_this.repeatScrollBound) {
+                    nElem.removeEventListener('mouseup', _this.repeatScrollBound);
+                    nElem.removeEventListener('touchend', _this.repeatScrollBound);
+                }
+                if (_this.contextMenuBound) {
+                    nElem.removeEventListener('contextmenu', _this.contextMenuBound);
+                }
+                EventHandler.remove(nElem, 'click', _this.clickEventHandler);
+                detach(nElem);
+            });
         }
         EventHandler.remove(this.scrollEle, 'scroll', this.scrollHandler);
         this.touchModule.destroy();
         this.touchModule = null;
+        if (this.navTouchCollection) {
+            this.navTouchCollection.forEach(function (t) { if (t && typeof t.destroy === 'function') {
+                t.destroy();
+            } });
+            this.navTouchCollection = null;
+        }
+        this.onKeyPressBound = null;
+        this.onKeyUpBound = null;
+        this.repeatScrollBound = null;
+        this.contextMenuBound = null;
         _super.prototype.destroy.call(this);
     };
     /**
@@ -261,17 +299,34 @@ var HScroll = /** @__PURE__ @class */ (function (_super) {
     HScroll.prototype.eventBinding = function (ele) {
         var _this = this;
         [].slice.call(ele).forEach(function (el) {
-            new Touch(el, { tapHold: _this.tabHoldHandler.bind(_this), tapHoldThreshold: 500 });
-            el.addEventListener('keydown', _this.onKeyPress.bind(_this));
-            el.addEventListener('keyup', _this.onKeyUp.bind(_this));
-            el.addEventListener('mouseup', _this.repeatScroll.bind(_this));
-            el.addEventListener('touchend', _this.repeatScroll.bind(_this));
-            el.addEventListener('contextmenu', function (e) {
-                e.preventDefault();
-            });
+            var navTouch = new Touch(el, { tapHold: _this.tabHoldHandler.bind(_this), tapHoldThreshold: 500 });
+            if (!_this.navTouchCollection) {
+                _this.navTouchCollection = [];
+            }
+            _this.navTouchCollection.push(navTouch);
+            if (!_this.onKeyPressBound) {
+                _this.onKeyPressBound = _this.onKeyPress.bind(_this);
+            }
+            if (!_this.onKeyUpBound) {
+                _this.onKeyUpBound = _this.onKeyUp.bind(_this);
+            }
+            if (!_this.repeatScrollBound) {
+                _this.repeatScrollBound = _this.repeatScroll.bind(_this);
+            }
+            if (!_this.contextMenuBound) {
+                _this.contextMenuBound = _this.contextMenuHandler.bind(_this);
+            }
+            el.addEventListener('keydown', _this.onKeyPressBound);
+            el.addEventListener('keyup', _this.onKeyUpBound);
+            el.addEventListener('mouseup', _this.repeatScrollBound);
+            el.addEventListener('touchend', _this.repeatScrollBound);
+            el.addEventListener('contextmenu', _this.contextMenuBound);
             EventHandler.add(el, 'click', _this.clickEventHandler, _this);
         });
     };
+    HScroll.prototype.contextMenuHandler = function (e) {
+        e.preventDefault();
+    };
     HScroll.prototype.repeatScroll = function () {
         clearInterval(this.timeout);
     };
@@ -1405,11 +1460,13 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
         if (!Browser.isDevice) {
             this.delegateMoverHandler = this.moverHandler.bind(this);
             this.delegateMouseDownHandler = this.mouseDownHandler.bind(this);
+            this.delegateDomKeyHandler = this.domKeyHandler.bind(this);
             EventHandler.add(this.isMenu ? document : wrapper, 'mouseover', this.delegateMoverHandler, this);
             EventHandler.add(document, 'mousedown', this.delegateMouseDownHandler, this);
-            EventHandler.add(document, 'keydown', this.domKeyHandler, this);
+            EventHandler.add(document, 'keydown', this.delegateDomKeyHandler, this);
             if (!this.isMenu && !this.target) {
-                EventHandler.add(document, 'scroll', this.scrollHandler, this);
+                this.delegateScrollHandler = this.scrollHandler.bind(this);
+                EventHandler.add(document, 'scroll', this.delegateScrollHandler, this);
             }
         }
         this.delegateClickHandler = this.clickHandler.bind(this);
@@ -1418,7 +1475,8 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
         this.rippleFn = rippleEffect(wrapper, { selector: '.' + ITEM });
         if (!this.isMenu && this.enableScrolling) {
             this.enableTouchScroll(wrapper);
-            document.addEventListener('touchstart', this.touchOutsideHandler.bind(this), { passive: true });
+            this.delegateTouchOutsideHandler = this.touchOutsideHandler.bind(this);
+            document.addEventListener('touchstart', this.delegateTouchOutsideHandler, { passive: true });
         }
     };
     MenuBase.prototype.wireKeyboardEvent = function (element) {
@@ -3142,20 +3200,38 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
             }
         }
         if (!Browser.isDevice) {
-            EventHandler.remove(this.isMenu ? document : wrapper, 'mouseover', this.delegateMoverHandler);
-            EventHandler.remove(document, 'mousedown', this.delegateMouseDownHandler);
-            EventHandler.remove(document, 'keydown', this.domKeyHandler);
+            if (this.delegateMoverHandler) {
+                EventHandler.remove(this.isMenu ? document : wrapper, 'mouseover', this.delegateMoverHandler);
+                this.delegateMoverHandler = null;
+            }
+            if (this.delegateMouseDownHandler) {
+                EventHandler.remove(document, 'mousedown', this.delegateMouseDownHandler);
+                this.delegateMouseDownHandler = null;
+            }
+            if (this.delegateDomKeyHandler) {
+                EventHandler.remove(document, 'keydown', this.delegateDomKeyHandler);
+                this.delegateDomKeyHandler = null;
+            }
             if (!this.isMenu && !this.target) {
-                EventHandler.remove(document, 'scroll', this.scrollHandler);
+                if (this.delegateScrollHandler) {
+                    EventHandler.remove(document, 'scroll', this.delegateScrollHandler);
+                    this.delegateScrollHandler = null;
+                }
             }
         }
-        EventHandler.remove(document, 'click', this.delegateClickHandler);
+        if (this.delegateClickHandler) {
+            EventHandler.remove(document, 'click', this.delegateClickHandler);
+            this.delegateClickHandler = null;
+        }
         this.unWireKeyboardEvent(wrapper);
         this.rippleFn();
         if (!this.isMenu && this.enableScrolling) {
             wrapper.removeEventListener('touchstart', this.touchStartFn);
             wrapper.removeEventListener('touchmove', this.touchMoveFn);
-            document.removeEventListener('touchstart', this.touchOutsideHandler);
+            if (this.delegateTouchOutsideHandler) {
+                document.removeEventListener('touchstart', this.delegateTouchOutsideHandler);
+                this.delegateTouchOutsideHandler = null;
+            }
         }
     };
     MenuBase.prototype.unWireKeyboardEvent = function (element) {
@@ -4024,14 +4100,19 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
         }
     };
     Toolbar.prototype.destroyItems = function () {
+        var _this = this;
         if (this.element) {
-            [].slice.call(this.element.querySelectorAll('.' + CLS_ITEM)).forEach(function (el) { detach(el); });
+            [].slice.call(this.element.querySelectorAll('.' + CLS_ITEM)).forEach(function (el) {
+                EventHandler.remove(el, 'click', _this.itemClick);
+                detach(el);
+            });
         }
         if (this.tbarAlign) {
             var tbarItems = this.element.querySelector('.' + CLS_ITEMS);
             if (tbarItems) {
                 if (tbarItems.children) {
                     [].slice.call(tbarItems.children).forEach(function (el) {
+                        EventHandler.remove(el, 'click', _this.itemClick);
                         detach(el);
                     });
                 }
@@ -5776,7 +5857,7 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
                     dom.setAttribute('aria-label', (item.text || item.tooltipText));
                     dom.setAttribute('aria-disabled', 'false');
                     innerEle.appendChild(dom);
-                    innerEle.addEventListener('click', this.itemClick.bind(this));
+                    EventHandler.add(innerEle, 'click', this.itemClick, this);
                     break;
                 case 'Separator':
                     this.add(innerEle, CLS_SEPARATOR);
@@ -6440,6 +6521,11 @@ var Accordion = /** @__PURE__ @class */ (function (_super) {
         if (!isNullOrUndefined(this.keyModule)) {
             this.keyModule.destroy();
         }
+        var headerEles = [].slice.call(this.element.querySelectorAll('.' + CLS_HEADER));
+        for (var _i = 0, headerEles_1 = headerEles; _i < headerEles_1.length; _i++) {
+            var hdr = headerEles_1[_i];
+            EventHandler.clearEvents(hdr);
+        }
     };
     Accordion.prototype.wireEvents = function () {
         EventHandler.add(this.element, 'click', this.clickHandler, this);
@@ -7361,6 +7447,10 @@ var Accordion = /** @__PURE__ @class */ (function (_super) {
             this.clearTemplate();
         }
         [].slice.call(this.element.querySelectorAll('.' + CLS_ITEM$1)).forEach(function (el) {
+            var hdr = select('.' + CLS_HEADER, el);
+            if (hdr) {
+                EventHandler.clearEvents(hdr);
+            }
             detach(el);
         });
     };
@@ -9560,12 +9650,20 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
                     }
                     if (properties[j] === 'cssClass') {
                         if (!isNullOrUndefined(hdrItem)) {
-                            hdrItem.classList.remove(oldVal);
-                            hdrItem.classList.add(newVal);
+                            if (!isNullOrUndefined(oldVal) && oldVal !== '') {
+                                hdrItem.classList.remove(oldVal);
+                            }
+                            if (!isNullOrUndefined(newVal) && newVal !== '') {
+                                hdrItem.classList.add(newVal);
+                            }
                         }
                         if (!isNullOrUndefined(cntItem)) {
-                            cntItem.classList.remove(oldVal);
-                            cntItem.classList.add(newVal);
+                            if (!isNullOrUndefined(oldVal) && oldVal !== '') {
+                                cntItem.classList.remove(oldVal);
+                            }
+                            if (!isNullOrUndefined(newVal) && newVal !== '') {
+                                cntItem.classList.add(newVal);
+                            }
                         }
                     }
                     if (properties[j] === 'disabled') {
@@ -15366,6 +15464,18 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
         this.wireExpandOnEvent(false);
         EventHandler.remove(this.element, 'mouseover', this.onMouseOver);
         EventHandler.remove(this.element, 'mouseout', this.onMouseLeave);
+        var liElements = selectAll('.' + LISTITEM, this.element);
+        for (var i = 0; i < liElements.length; i++) {
+            var li = liElements[parseInt(i.toString(), 10)];
+            EventHandler.remove(li, 'focus', this.focusIn);
+            EventHandler.remove(li, 'blur', this.focusOut);
+            var frame = select('.' + CHECKBOXFRAME, li);
+            if (frame) {
+                EventHandler.remove(frame, 'mousedown', this.frameMouseHandler);
+                EventHandler.remove(frame, 'mouseup', this.frameMouseHandler);
+                EventHandler.remove(frame, 'mouseleave', this.frameMouseHandler);
+            }
+        }
         if (!this.disabled) {
             this.keyboardModule.destroy();
         }
@@ -16594,6 +16704,7 @@ var Sidebar = /** @__PURE__ @class */ (function (_super) {
     function Sidebar(options, element) {
         var _this = _super.call(this, options, element) || this;
         _this.documentClickContext = _this.documentclickHandler.bind(_this);
+        _this.resizeHandler = _this.resize.bind(_this);
         return _this;
     }
     Sidebar.prototype.preRender = function () {
@@ -16999,11 +17110,12 @@ var Sidebar = /** @__PURE__ @class */ (function (_super) {
     };
     Sidebar.prototype.wireEvents = function () {
         this.setEnableGestures();
-        EventHandler.add(window, 'resize', this.resize, this);
+        EventHandler.add(window, 'resize', this.resizeHandler);
     };
     Sidebar.prototype.unWireEvents = function () {
-        EventHandler.remove(window, 'resize', this.resize);
+        EventHandler.remove(window, 'resize', this.resizeHandler);
         EventHandler.remove(document, 'mousedown touchstart', this.documentclickHandler);
+        EventHandler.remove(this.element, 'transitionend', this.transitionEnd);
         if (this.mainContentEle) {
             this.mainContentEle.destroy();
         }
@@ -17898,7 +18010,7 @@ var Breadcrumb = /** @__PURE__ @class */ (function (_super) {
             detach(this.popupObj.element);
         }
     };
-    Breadcrumb.prototype.resize = function () {
+    Breadcrumb.prototype.resize = function (e) {
         this._maxItems = this.maxItems;
         this.initPvtProps();
         this.reRenderItems();
@@ -17989,7 +18101,8 @@ var Breadcrumb = /** @__PURE__ @class */ (function (_super) {
         this.delegateClickHanlder = this.documentClickHandler.bind(this);
         EventHandler.add(document, 'click', this.delegateClickHanlder, this);
         EventHandler.add(this.element, 'click', this.clickHandler, this);
-        window.addEventListener('resize', this.resize.bind(this));
+        this.resizeHandler = this.resize.bind(this);
+        window.addEventListener('resize', this.resizeHandler);
     };
     Breadcrumb.prototype.popupWireEvents = function () {
         EventHandler.add(this.popupObj.element, 'click', this.clickHandler, this);
@@ -17998,7 +18111,8 @@ var Breadcrumb = /** @__PURE__ @class */ (function (_super) {
     Breadcrumb.prototype.unWireEvents = function () {
         EventHandler.remove(document, 'click', this.delegateClickHanlder);
         EventHandler.remove(this.element, 'click', this.clickHandler);
-        window.removeEventListener('resize', this.resize.bind(this));
+        window.removeEventListener('resize', this.resizeHandler);
+        this.resizeHandler = null;
         if (this.popupObj) {
             EventHandler.remove(this.popupObj.element, 'click', this.clickHandler);
             EventHandler.remove(this.popupObj.element, 'keydown', this.popupKeyDownHandler);
@@ -20160,12 +20274,20 @@ var Stepper = /** @__PURE__ @class */ (function (_super) {
         }
     };
     Stepper.prototype.wireEvents = function () {
-        EventHandler.add(window, 'resize', this.updateResize, this);
-        EventHandler.add(window, 'click', this.updateStepFocus, this);
+        this.windowEventHandlers = {};
+        this.windowEventHandlers.resize = this.updateResize.bind(this);
+        this.windowEventHandlers.click = this.updateStepFocus.bind(this);
+        EventHandler.add(window, 'resize', this.windowEventHandlers.resize);
+        EventHandler.add(window, 'click', this.windowEventHandlers.click);
     };
     Stepper.prototype.unWireEvents = function () {
-        EventHandler.remove(window, 'resize', this.updateResize);
-        EventHandler.remove(window, 'click', this.updateStepFocus);
+        EventHandler.remove(window, 'resize', this.windowEventHandlers && this.windowEventHandlers.resize);
+        EventHandler.remove(window, 'click', this.windowEventHandlers && this.windowEventHandlers.click);
+        if (this.windowEventHandlers) {
+            this.windowEventHandlers.resize = null;
+            this.windowEventHandlers.click = null;
+            this.windowEventHandlers = null;
+        }
     };
     Stepper.prototype.updateResize = function () {
         if (this.stepperItemList && this.progressbar && this.element.classList.contains(HORIZSTEP$1)) {