@syncfusion/ej2-dropdowns 33.2.12 → 34.1.29

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

@@ -3141,6 +3141,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     DropDownBase.prototype.destroy = function () {
+        if (this.keyboardModule) {
+            this.keyboardModule.destroy();
+        }
         if (document) {
             if (this.fields && this.fields.groupBy) {
                 var elements = this.getScrollableParent();
@@ -3180,6 +3183,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
         this.virtualSelectAllData = null;
         this.incrementalListData = null;
         _super.prototype.destroy.call(this);
+        this.keyboardModule = null;
     };
     __decorate([
         Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)
@@ -6313,9 +6317,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                 ulElement = null;
             },
             targetExitViewport: function () {
-                if (!Browser.isDevice) {
-                    _this.hidePopup();
-                }
+                _this.hidePopup();
             }
         });
     };
@@ -6931,8 +6933,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
             if (!this.targetElement().hasAttribute('aria-label')) {
                 attributes(this.targetElement(), { 'aria-label': this.getModuleName() });
             }
-            if (!this.inputElement.hasAttribute('aria-label')) {
-                this.inputElement.setAttribute('aria-label', this.getModuleName());
+            if (!this.inputElement.hasAttribute('aria-labelledby')) {
+                this.inputElement.setAttribute('aria-labelledby', this.hiddenElement.id);
             }
             this.inputElement.setAttribute('aria-expanded', 'false');
         }
@@ -8770,12 +8772,13 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         EventHandler.add(this.inputWrapper, 'mousemove', this.mouseIn, this);
         EventHandler.add(this.inputWrapper, 'mouseout', this.onMouseLeave, this);
         EventHandler.add(this.overAllClear, 'mousedown', this.clearAll, this);
-        EventHandler.add(window, 'resize', this.windowResizeContext);
+        this.windowResizeHandler = this.windowResize.bind(this);
+        EventHandler.add(window, 'resize', this.windowResizeHandler, this);
         var formElement = closest(this.inputWrapper, 'form');
         if (formElement) {
             EventHandler.add(formElement, 'reset', this.resetValueHandler, this);
         }
-        this.keyboardModule = new KeyboardEvents(this.inputWrapper, {
+        this.treeKeyboardModule = new KeyboardEvents(this.inputWrapper, {
             keyAction: this.keyActionHandler.bind(this),
             keyConfigs: this.keyConfigs,
             eventName: 'keydown'
@@ -8789,7 +8792,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         });
     };
     DropDownTree.prototype.wireCheckAllWrapperEvents = function () {
-        this.keyboardModule = new KeyboardEvents(this.checkAllParent, {
+        this.checkAllKeyboardModule = new KeyboardEvents(this.checkAllParent, {
             keyAction: this.checkAllAction.bind(this),
             keyConfigs: this.keyConfigs,
             eventName: 'keydown'
@@ -8806,12 +8809,20 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         EventHandler.remove(this.inputWrapper, 'mousemove', this.mouseIn);
         EventHandler.remove(this.inputWrapper, 'mouseout', this.onMouseLeave);
         EventHandler.remove(this.overAllClear, 'mousedown', this.clearAll);
-        EventHandler.remove(window, 'resize', this.windowResizeContext);
+        EventHandler.remove(window, 'resize', this.windowResizeHandler);
         var formElement = closest(this.inputWrapper, 'form');
         if (formElement) {
             EventHandler.remove(formElement, 'reset', this.resetValueHandler);
         }
-        this.keyboardModule.destroy();
+        if (this.keyboardModule) {
+            this.keyboardModule.destroy();
+        }
+        if (this.treeKeyboardModule) {
+            this.treeKeyboardModule.destroy();
+        }
+        if (this.checkAllKeyboardModule) {
+            this.checkAllKeyboardModule.destroy();
+        }
         if (this.showSelectAll && this.checkAllParent) {
             EventHandler.remove(this.checkAllParent, 'mouseup', this.clickHandler);
         }
@@ -11470,9 +11481,22 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         this.overFlowWrapper = null;
         this.keyboardModule = null;
         _super.prototype.destroy.call(this);
+        this.treeKeyboardModule = null;
+        this.checkAllKeyboardModule = null;
+        this.selectedData = [];
+        this.treeData = null;
+        this.treeItems = [];
+        this.valueTemplateContainer = null;
+        this.filterContainer = null;
+        this.windowResizeHandler = null;
+        this.documentClickHandler = null;
         this.setProperties({ value: [] }, true);
     };
     DropDownTree.prototype.destroyFilter = function () {
+        if (this.filterTimer) {
+            window.clearTimeout(this.filterTimer);
+            this.filterTimer = null;
+        }
         if (this.filterObj) {
             this.filterObj.destroy();
             detach(this.filterObj.element);
@@ -13675,6 +13699,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         _this.selectAllEventEle = [];
         _this.preventSetCurrentData = false;
         _this.isSelectAllLoop = false;
+        _this.isInitialFocusAnnouncementDone = false;
         _this.scrollFocusStatus = false;
         _this.keyDownStatus = false;
         return _this;
@@ -14914,6 +14939,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             return;
         }
         this.inputFocus = false;
+        this.isInitialFocusAnnouncementDone = false;
         this.overAllWrapper.classList.remove(FOCUS);
         if (this.addTagOnBlur) {
             var dataChecks = this.getValueByText(this.inputElement.value, this.ignoreCase, this.ignoreAccent);
@@ -15181,6 +15207,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                 this.trigger('focus', args);
                 this.focused = false;
             }
+            if (!this.isInitialFocusAnnouncementDone) {
+                this.announceInitialFocusInstruction();
+                this.isInitialFocusAnnouncementDone = true;
+            }
             if (!this.overAllWrapper.classList.contains(FOCUS)) {
                 this.overAllWrapper.classList.add(FOCUS);
             }
@@ -15372,7 +15402,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         this.isKeyBoardAction = false;
     };
     MultiSelect.prototype.onKeyDown = function (e) {
-        if (this.readonly || !this.enabled && this.mode !== 'CheckBox') {
+        if (this.readonly || !this.enabled && this.mode !== 'CheckBox' || this.preventKeyboardInteraction) {
             return;
         }
         this.preventSetCurrentData = false;
@@ -15906,6 +15936,25 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
         this.checkPlaceholderSize();
     };
+    MultiSelect.prototype.announceSelection = function (text) {
+        if (text && this.chipAnnouncerLiveRegion) {
+            var count = this.value ? this.value.length : 0;
+            var announcement = text + " added to selection " + count + " items selected";
+            this.chipAnnouncerLiveRegion.textContent = announcement;
+        }
+    };
+    MultiSelect.prototype.announceInitialFocusInstruction = function () {
+        var _this = this;
+        if (this.chipAnnouncerLiveRegion) {
+            var instruction_1 = 'Use arrow keys to open popup and navigate items, Enter to select, and Backspace to delete selections';
+            this.chipAnnouncerLiveRegion.textContent = '';
+            setTimeout(function () {
+                if (_this.chipAnnouncerLiveRegion) {
+                    _this.chipAnnouncerLiveRegion.textContent = instruction_1;
+                }
+            }, 200);
+        }
+    };
     MultiSelect.prototype.moveByTop = function (state) {
         var elements = this.list.querySelectorAll('li.' + dropDownBaseClasses.li);
         var index;
@@ -16489,6 +16538,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         if (this.mode !== 'Delimiter' && this.mode !== 'CheckBox') {
             this.addChip(text, value, eve);
         }
+        else {
+            this.announceSelection(text);
+        }
         if (this.hideSelectedItem && this.fields.groupBy) {
             this.hideGroupItem(value);
         }
@@ -16701,6 +16753,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                 }
                 EventHandler.add(chipClose, 'mousedown', _this.onChipRemove, _this);
                 _this.chipCollectionWrapper.appendChild(chip);
+                _this.announceSelection(data);
                 if (!_this.changeOnBlur && e) {
                     _this.updateValueState(e, _this.value, _this.tempValues);
                 }
@@ -17219,9 +17272,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             this.search(e);
         }
     };
-    MultiSelect.prototype.onWheelScroll = function (e) {
-        this.scrollEvent = e;
-    };
     MultiSelect.prototype.pasteHandler = function (event) {
         var _this = this;
         setTimeout(function () {
@@ -17229,6 +17279,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             _this.search(event);
         });
     };
+    MultiSelect.prototype.onWheelScroll = function (e) {
+        this.scrollEvent = e;
+    };
     MultiSelect.prototype.performFiltering = function (e) {
         var _this = this;
         var eventArgs = {
@@ -18570,6 +18623,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
     };
     MultiSelect.prototype.selectAllItem = function (state, event, list) {
         var li;
+        this.isSelectAllClicked = state;
         if (!isNullOrUndefined(this.list)) {
             li = this.list.querySelectorAll(state ?
                 'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)' :
@@ -18698,13 +18752,37 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     }
                     index++;
                 }
+                var contentEl_1 = null;
+                var selectAllEl_1 = null;
+                var inputEl_1 = null;
                 if (length > 50) {
                     createSpinner({ target: this.filterParent, width: Browser.isDevice ? '16px' : '14px' }, this.createElement);
                     showSpinner(this.filterParent);
-                    if (this.popupObj && this.filterParent) {
-                        [this.popupObj.element.querySelector('.e-content'), this.popupObj.element.querySelector('.e-selectall-parent'), this.filterParent].forEach(function (el) { return el && (el.style.opacity = '0.5'); });
-                        this.filterParent.querySelector('.e-input').setAttribute('readonly', 'true');
+                    this.preventKeyboardInteraction = true;
+                    if (this.popupObj && this.popupObj.element && this.filterParent) {
+                        contentEl_1 = this.popupObj.element.querySelector('.e-content');
+                        selectAllEl_1 = this.popupObj.element.querySelector('.e-selectall-parent');
+                        inputEl_1 = this.filterParent.querySelector('.e-input');
+                        [contentEl_1, selectAllEl_1, this.filterParent].forEach(function (el) {
+                            if (el) {
+                                el.style.opacity = '0.5';
+                            }
+                        });
+                        if (inputEl_1) {
+                            inputEl_1.setAttribute('readonly', 'true');
+                        }
                         this.filterParent.style.cursor = 'progress';
+                        [contentEl_1, selectAllEl_1].forEach(function (el) {
+                            if (!el) {
+                                return;
+                            }
+                            el.style.pointerEvents = 'none';
+                            el.style.userSelect = 'none';
+                            el.style.touchAction = 'none';
+                            if (el === contentEl_1) {
+                                el.style.overflow = 'hidden';
+                            }
+                        });
                     }
                     setTimeout(function () {
                         var dataArray = _this.virtualSelectAllData;
@@ -18733,6 +18811,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                                 requestAnimationFrame(processBatch);
                             }
                             else {
+                                _this.preventKeyboardInteraction = false;
                                 _this.updatedataValueItems(event);
                                 _this.isSelectAllLoop = false;
                                 if (!_this.changeOnBlur) {
@@ -18749,9 +18828,26 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                                 _this.checkSelectAll();
                                 hideSpinner(_this.filterParent);
                                 if (_this.popupObj && _this.filterParent) {
-                                    [_this.popupObj.element.querySelector('.e-content'), _this.popupObj.element.querySelector('.e-selectall-parent'), _this.filterParent].forEach(function (el) { return el && (el.style.opacity = ''); });
+                                    [contentEl_1, selectAllEl_1, _this.filterParent].forEach(function (el) {
+                                        if (el) {
+                                            el.style.opacity = '';
+                                        }
+                                    });
+                                    if (contentEl_1) {
+                                        contentEl_1.style.pointerEvents = 'auto';
+                                        contentEl_1.style.userSelect = 'auto';
+                                        contentEl_1.style.touchAction = 'auto';
+                                        contentEl_1.style.overflow = 'auto';
+                                    }
+                                    if (selectAllEl_1) {
+                                        selectAllEl_1.style.pointerEvents = 'auto';
+                                        selectAllEl_1.style.userSelect = 'auto';
+                                        selectAllEl_1.style.touchAction = 'auto';
+                                    }
+                                    if (inputEl_1) {
+                                        inputEl_1.removeAttribute('readonly');
+                                    }
                                     _this.filterParent.style.cursor = '';
-                                    _this.filterParent.querySelector('.e-input').removeAttribute('readonly');
                                 }
                             }
                         };
@@ -18775,10 +18871,34 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                 this.isProcessingVirtualSelectAll = true;
                 createSpinner({ target: this.filterParent, width: Browser.isDevice ? '16px' : '14px' }, this.createElement);
                 showSpinner(this.filterParent);
-                if (this.popupObj && this.filterParent) {
-                    [this.popupObj.element.querySelector('.e-content'), this.popupObj.element.querySelector('.e-selectall-parent'), this.filterParent].forEach(function (el) { return el && (el.style.opacity = '0.5'); });
-                    this.filterParent.querySelector('.e-input').setAttribute('readonly', 'true');
+                this.preventKeyboardInteraction = true;
+                var contentEl_2 = null;
+                var selectAllEl_2 = null;
+                var inputEl_2 = null;
+                if (this.popupObj && this.popupObj.element && this.filterParent) {
+                    contentEl_2 = this.popupObj.element.querySelector('.e-content');
+                    selectAllEl_2 = this.popupObj.element.querySelector('.e-selectall-parent');
+                    inputEl_2 = this.filterParent.querySelector('.e-input');
+                    [contentEl_2, selectAllEl_2, this.filterParent].forEach(function (el) {
+                        if (el) {
+                            el.style.opacity = '0.5';
+                        }
+                    });
+                    if (inputEl_2) {
+                        inputEl_2.setAttribute('readonly', 'true');
+                    }
                     this.filterParent.style.cursor = 'progress';
+                    [contentEl_2, selectAllEl_2].forEach(function (el) {
+                        if (!el) {
+                            return;
+                        }
+                        el.style.pointerEvents = 'none';
+                        el.style.userSelect = 'none';
+                        el.style.touchAction = 'none';
+                        if (el === contentEl_2) {
+                            el.style.overflow = 'hidden';
+                        }
+                    });
                 }
                 var processBatch_1 = function () {
                     var endIndex = Math.min(currentIndex_1 + batchSize_1, dataArray_1.length);
@@ -18796,10 +18916,28 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     else {
                         // All batches completed
                         _this.isProcessingVirtualSelectAll = false;
+                        _this.preventKeyboardInteraction = false;
                         hideSpinner(_this.filterParent);
                         if (_this.popupObj && _this.filterParent) {
-                            [_this.popupObj.element.querySelector('.e-content'), _this.popupObj.element.querySelector('.e-selectall-parent'), _this.filterParent].forEach(function (el) { return el && (el.style.opacity = ''); });
-                            _this.filterParent.querySelector('.e-input').removeAttribute('readonly');
+                            [contentEl_2, selectAllEl_2, _this.filterParent].forEach(function (el) {
+                                if (el) {
+                                    el.style.opacity = '';
+                                }
+                            });
+                            if (contentEl_2) {
+                                contentEl_2.style.pointerEvents = 'auto';
+                                contentEl_2.style.userSelect = 'auto';
+                                contentEl_2.style.touchAction = 'auto';
+                                contentEl_2.style.overflow = 'auto';
+                            }
+                            if (selectAllEl_2) {
+                                selectAllEl_2.style.pointerEvents = 'auto';
+                                selectAllEl_2.style.userSelect = 'auto';
+                                selectAllEl_2.style.touchAction = 'auto';
+                            }
+                            if (inputEl_2) {
+                                inputEl_2.removeAttribute('readonly');
+                            }
                             _this.filterParent.style.cursor = '';
                         }
                         if (!_this.isSelectAllClicked) {
@@ -18889,10 +19027,34 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     if (length > 50) {
                         createSpinner({ target: this.filterParent, width: Browser.isDevice ? '16px' : '14px' }, this.createElement);
                         showSpinner(this.filterParent);
-                        if (this.popupObj && this.filterParent) {
-                            [this.popupObj.element.querySelector('.e-content'), this.popupObj.element.querySelector('.e-selectall-parent'), this.filterParent].forEach(function (el) { return el && (el.style.opacity = '0.5'); });
-                            this.filterParent.querySelector('.e-input').setAttribute('readonly', 'true');
+                        this.preventKeyboardInteraction = true;
+                        var contentEl_3 = null;
+                        var selectAllEl_3 = null;
+                        var inputEl_3 = null;
+                        if (this.popupObj && this.popupObj.element && this.filterParent) {
+                            contentEl_3 = this.popupObj.element.querySelector('.e-content');
+                            selectAllEl_3 = this.popupObj.element.querySelector('.e-selectall-parent');
+                            inputEl_3 = this.filterParent.querySelector('.e-input');
+                            [contentEl_3, selectAllEl_3, this.filterParent].forEach(function (el) {
+                                if (el) {
+                                    el.style.opacity = '0.5';
+                                }
+                            });
+                            if (inputEl_3) {
+                                inputEl_3.setAttribute('readonly', 'true');
+                            }
                             this.filterParent.style.cursor = 'progress';
+                            [contentEl_3, selectAllEl_3].forEach(function (el) {
+                                if (!el) {
+                                    return;
+                                }
+                                el.style.pointerEvents = 'none';
+                                el.style.userSelect = 'none';
+                                el.style.touchAction = 'none';
+                                if (el === contentEl_3) {
+                                    el.style.overflow = 'hidden';
+                                }
+                            });
                         }
                         this.isProcessingVirtualSelectAll = !this.isSelectAllClicked;
                         var indexLocal_1 = index; // preserve original index value
@@ -18919,9 +19081,27 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                                         }
                                     }
                                     hideSpinner(this.filterParent);
+                                    this.preventKeyboardInteraction = false;
                                     if (this.popupObj && this.filterParent) {
-                                        [this.popupObj.element.querySelector('.e-content'), this.popupObj.element.querySelector('.e-selectall-parent'), this.filterParent].forEach(function (el) { return el && (el.style.opacity = ''); });
-                                        this.filterParent.querySelector('.e-input').removeAttribute('readonly');
+                                        [contentEl_3, selectAllEl_3, this.filterParent].forEach(function (el) {
+                                            if (el) {
+                                                el.style.opacity = '';
+                                            }
+                                        });
+                                        if (contentEl_3) {
+                                            contentEl_3.style.pointerEvents = 'auto';
+                                            contentEl_3.style.userSelect = 'auto';
+                                            contentEl_3.style.touchAction = 'auto';
+                                            contentEl_3.style.overflow = 'auto';
+                                        }
+                                        if (selectAllEl_3) {
+                                            selectAllEl_3.style.pointerEvents = 'auto';
+                                            selectAllEl_3.style.userSelect = 'auto';
+                                            selectAllEl_3.style.touchAction = 'auto';
+                                        }
+                                        if (inputEl_3) {
+                                            inputEl_3.removeAttribute('readonly');
+                                        }
                                         this.filterParent.style.cursor = '';
                                     }
                                     return;
@@ -21230,8 +21410,10 @@ var CheckBoxSelection = /** @__PURE__ @class */ (function () {
         }
     };
     CheckBoxSelection.prototype.setLocale = function (unSelect) {
-        if (this.parent.selectAllText !== 'Select All' || this.parent.unSelectAllText !== 'Unselect All') {
-            var template = unSelect ? this.parent.unSelectAllText : this.parent.selectAllText;
+        var template = unSelect ? this.parent.unSelectAllText : this.parent.selectAllText;
+        var isListBox = this.parent.element.classList.contains('e-listbox');
+        if ((this.parent.selectAllText !== 'Select All' || this.parent.unSelectAllText !== 'Unselect All') &&
+            (!isListBox || typeof template === 'function' || (typeof template === 'string' && /<[a-z][\s\S]*>/i.test(template)))) {
             this.selectAllSpan.textContent = '';
             var compiledString = compile(template);
             var templateName = unSelect ? 'unSelectAllText' : 'selectAllText';
@@ -24169,10 +24351,8 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
         this.unBindCommonEvent();
     };
     Mention.prototype.bindCommonEvent = function () {
-        if (!Browser.isDevice) {
-            this.keydownHandler = this.keyDownHandler.bind(this);
-            this.inputElement.addEventListener('keydown', this.keydownHandler, !this.isRTE);
-        }
+        this.keydownHandler = this.keyDownHandler.bind(this);
+        this.inputElement.addEventListener('keydown', this.keydownHandler, !this.isRTE);
     };
     /**
      * Hides the spinner loader.
@@ -24360,7 +24540,7 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
         return !isNullOrUndefined(element);
     };
     Mention.prototype.unBindCommonEvent = function () {
-        if (!Browser.isDevice && this.keydownHandler) {
+        if (this.keydownHandler) {
             this.inputElement.removeEventListener('keydown', this.keydownHandler, !this.isRTE);
             this.keydownHandler = null;
         }
@@ -24377,10 +24557,8 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
             return;
         }
         this.isTyped = e.code !== 'Enter' && e.code !== 'Space' && e.code !== 'ArrowDown' && e.code !== 'ArrowUp' ? true : false;
-        var activeParent = document.activeElement && document.activeElement.parentElement;
-        var isRteImage = activeParent && !!activeParent.querySelector('.e-rte-image');
-        var isBECodeDropdownFocused = activeParent && !!activeParent.querySelector('.e-blockeditor .e-code-block-container .e-input-group.e-input-focus');
-        if (document.activeElement !== this.inputElement && !isRteImage && !isBECodeDropdownFocused) {
+        var isRteImage = document.activeElement.parentElement && document.activeElement.parentElement.querySelector('.e-rte-image') ? true : false;
+        if (document.activeElement !== this.inputElement && !isRteImage) {
             this.inputElement.focus();
         }
         if (this.isContentEditable(this.inputElement)) {
@@ -24501,7 +24679,6 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
                 this.initValue();
             }
             if (!this.isPopupOpen && e.keyCode !== 38 && e.keyCode !== 40 && this.queryString.length >= this.minLength) {
-                this.didPopupOpenByTypingInitialChar = true;
                 this.showPopup();
                 if (this.initRemoteRender && this.list.querySelectorAll('li').length === 0) {
                     this.showWaitingSpinner();
@@ -24760,8 +24937,6 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
         if (document.activeElement !== this.inputElement) {
             this.inputElement.focus();
         }
-        this.queryString = this.didPopupOpenByTypingInitialChar ? this.queryString : '';
-        this.didPopupOpenByTypingInitialChar = false;
         if (this.isContentEditable(this.inputElement)) {
             this.range = this.getCurrentRange();
         }