@syncfusion/ej2-inputs 32.2.5 → 32.2.7

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

@@ -1207,8 +1207,9 @@ var NumericTextBox = /** @__PURE__ @class */ (function (_super) {
             }
             this.element.classList.remove('e-control', 'e-numerictextbox');
             this.element.appendChild(input);
+            setValue('ej2_instances', ejInstance, input);
+            setValue('ej2_instances', null, this.element);
             this.element = input;
-            setValue('ej2_instances', ejInstance, this.element);
         }
         attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off' });
         var localeText = {
@@ -3989,8 +3990,9 @@ var MaskedTextBox = /** @__PURE__ @class */ (function (_super) {
             this.element.classList.remove('e-control', 'e-maskedtextbox');
             this.element.classList.add('e-mask-container');
             this.element.appendChild(input);
+            setValue('ej2_instances', ejInstance, input);
+            setValue('ej2_instances', null, this.element);
             this.element = input;
-            setValue('ej2_instances', ejInstance, this.element);
         }
         this.updateHTMLAttrToElement();
         this.checkHtmlAttributes(false);
@@ -8933,8 +8935,10 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
                 inputElement.setAttribute('name', 'UploadFiles');
             }
             this.element.appendChild(inputElement);
+            setValue('ej2_instances', ejInstance, inputElement);
+            // Clear reference from this.element to avoid retaining component instance
+            setValue('ej2_instances', null, this.element);
             this.element = inputElement;
-            setValue('ej2_instances', ejInstance, this.element);
         }
         /* istanbul ignore next */
         if (ejInstance[0].isPureReactComponent) {
@@ -9325,7 +9329,8 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
     Uploader.prototype.wireEvents = function () {
         EventHandler.add(this.browseButton, 'click', this.browseButtonClick, this);
         EventHandler.add(this.element, 'change', this.onSelectFiles, this);
-        EventHandler.add(document, 'click', this.removeFocus, this);
+        this.documentClickHandler = this.removeFocus.bind(this);
+        EventHandler.add(document, 'click', this.documentClickHandler);
         this.keyboardModule = new KeyboardEvents(this.uploadWrapper, {
             keyAction: this.keyActionHandler.bind(this),
             keyConfigs: this.keyConfigs,
@@ -9338,7 +9343,10 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
     Uploader.prototype.unWireEvents = function () {
         EventHandler.remove(this.browseButton, 'click', this.browseButtonClick);
         EventHandler.remove(this.element, 'change', this.onSelectFiles);
-        EventHandler.remove(document, 'click', this.removeFocus);
+        if (this.documentClickHandler) {
+            EventHandler.remove(document, 'click', this.documentClickHandler);
+            this.documentClickHandler = null;
+        }
         if (this.isForm) {
             EventHandler.remove(this.formElement, 'reset', this.resetForm);
         }
@@ -12379,6 +12387,9 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
             }
         });
         this.splitBtn.createElement = this.createElement;
+        if (this.isAngular) {
+            this.splitBtn.isAngular = this.isAngular;
+        }
         this.splitBtn.appendTo(splitButton);
         this.splitBtn.element.setAttribute('aria-label', 'colorpicker');
         var preview = this.createElement('span', { className: SPLITPREVIEW });
@@ -12452,8 +12463,9 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
                         _this.modal = _this.createElement('div');
                         _this.modal.className = 'e-' + _this.getModuleName() + ' e-modal';
                         _this.modal.style.display = 'none';
-                        document.body.insertBefore(_this.modal, popupEle);
-                        document.body.className += ' e-colorpicker-overflow';
+                        var appendToElement = _this.getAppendToElement();
+                        appendToElement.insertBefore(_this.modal, popupEle);
+                        appendToElement.className += ' e-colorpicker-overflow';
                         _this.modal.style.display = 'block';
                         _this.modal.style.zIndex = (Number(popupEle.style.zIndex) - 1).toString();
                     }
@@ -12487,6 +12499,16 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
             return callBackPromise;
         };
     };
+    ColorPicker.prototype.getAppendToElement = function () {
+        if (this.isAngular) {
+            var cdkPane = this.element.closest('.cdk-overlay-pane');
+            var popoverEl = this.element.closest('[popover]');
+            if (cdkPane && popoverEl) {
+                return cdkPane;
+            }
+        }
+        return document.body;
+    };
     ColorPicker.prototype.onPopupClose = function () {
         this.unWireEvents();
         this.destroyOtherComp();
@@ -12496,7 +12518,8 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
         this.container.innerHTML = '';
         removeClass([this.container], [PICKERCONTENT, PALETTECONTENT]);
         if (Browser.isDevice && this.modal) {
-            removeClass([document.body], 'e-colorpicker-overflow');
+            var appendToElement = this.getAppendToElement();
+            removeClass([appendToElement], 'e-colorpicker-overflow');
             this.modal.style.display = 'none';
             this.modal.outerHTML = '';
             this.modal = null;
@@ -13701,6 +13724,10 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
                 this.unWireEvents();
                 this.destroyOtherComp();
             }
+            this.splitBtn.beforeClose = null;
+            this.splitBtn.beforeOpen = null;
+            this.splitBtn.click = null;
+            this.splitBtn.open = null;
             this.splitBtn.destroy();
             this.splitBtn = null;
         }
@@ -14458,8 +14485,9 @@ var TextBox = /** @__PURE__ @class */ (function (_super) {
                 }
             }
             this.element.appendChild(inputElement);
+            setValue('ej2_instances', ejInstance, inputElement);
+            setValue('ej2_instances', null, this.element);
             this.element = inputElement;
-            setValue('ej2_instances', ejInstance, this.element);
         }
         this.updateHTMLAttributesToElement();
         this.checkAttributes(false);
@@ -15362,8 +15390,9 @@ var TextArea = /** @__PURE__ @class */ (function (_super) {
                 }
             }
             this.element.appendChild(inputElement);
+            setValue('ej2_instances', ejInstance, inputElement);
+            setValue('ej2_instances', null, this.element);
             this.element = inputElement;
-            setValue('ej2_instances', ejInstance, this.element);
         }
         this.updateHTMLAttributesToElement();
         this.checkAttributes(false);
@@ -16779,7 +16808,8 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
         if (isNullOrUndefined(this.pointColl) && !this.isReadOnly && !this.disabled) {
             EventHandler.add(this.canvasContext.canvas, 'mousedown touchstart', this.mouseDownHandler, this);
             EventHandler.add(this.canvasContext.canvas, 'keydown', this.keyboardHandler, this);
-            window.addEventListener('resize', this.resizeHandler.bind(this));
+            this.boundResizeHandler = this.resizeHandler.bind(this);
+            window.addEventListener('resize', this.boundResizeHandler);
         }
         else if (this.pointColl) {
             EventHandler.add(this.canvasContext.canvas, 'mousemove touchmove', this.mouseMoveHandler, this);
@@ -16800,7 +16830,10 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
                 EventHandler.remove(this.canvasContext.canvas, 'mousedown touchstart', this.mouseDownHandler);
                 EventHandler.remove(this.canvasContext.canvas, 'keydown', this.keyboardHandler);
             }
-            window.removeEventListener('resize', this.resizeHandler);
+            if (this.boundResizeHandler) {
+                window.removeEventListener('resize', this.boundResizeHandler);
+                this.boundResizeHandler = null;
+            }
         }
     };
     SignatureBase.prototype.setHTMLProperties = function () {