@syncfusion/ej2-dropdowns 33.2.4 → 33.2.6

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

@@ -1006,6 +1006,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
         _this.isVirtualTrackHeight = false;
         _this.virtualSelectAll = false;
         _this.isVirtualReorder = false;
+        _this.isVirtualOrder = false;
         _this.incrementalQueryString = '';
         _this.incrementalEndIndex = 0;
         _this.incrementalStartIndex = 0;
@@ -2464,6 +2465,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
             if (this.getModuleName() === 'multiselect' && (this.virtualSelectAll && !isClearAll)) {
                 this.virtualSelectAllData = listData;
                 listData = listData.slice(this.virtualItemStartIndex, this.virtualItemEndIndex);
+                if (this.virtualSelectAllData.length < (this.itemCount * 2) && this.isCheckBoxSelection && this.isVirtualOrder) {
+                    listData = this.virtualSelectAllData;
+                }
             }
             ulElement = this.createListItems(listData, fields);
             if (this.isIncrementalRequest) {
@@ -2487,6 +2491,12 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
                         else {
                             virtualUlElement.appendChild(ulElement);
                         }
+                        if (this.getModuleName() === 'multiselect' && this.isCheckBoxSelection && !this.appendUncheckList && this.isVirtualOrder) {
+                            var selectedUlElement = this.list.querySelector('.e-list-parent' + '.e-reorder');
+                            if (!isNullOrUndefined(selectedUlElement)) {
+                                virtualUlElement.removeChild(selectedUlElement);
+                            }
+                        }
                     }
                     this.updateListElements(listData);
                 }
@@ -5694,7 +5704,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
             }
             else if (this.enableVirtualization && this.getModuleName() !== 'autocomplete' && !this.isFiltering()) {
                 var value = this.getItemData().value;
-                this.activeIndex = this.getIndexByValue(value);
+                this.activeIndex = !isNullOrUndefined(value) ? this.getIndexByValue(value) : this.activeIndex;
                 var element = this.findListElement(this.list, 'li', 'data-value', value);
                 this.selectedLI = element;
                 element = null;
@@ -6932,14 +6942,16 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
             if (this.enableVirtualization) {
                 this.listItemHeight = this.getListHeight();
                 this.getSkeletonCount();
+                this.skeletonCount = this.totalItemCount < (this.itemCount * 2) && ((!(this.dataSource instanceof DataManager)) ||
+                    ((this.dataSource instanceof DataManager) && (this.totalItemCount <= this.itemCount))) ? 0 : this.skeletonCount;
                 this.updateVirtualizationProperties(this.itemCount, this.allowFiltering);
-                if (this.index !== null) {
-                    this.activeIndex = this.index + this.skeletonCount;
-                }
             }
             this.initValue();
             this.selectedValueInfo = this.viewPortInfo;
             if (this.enableVirtualization) {
+                if (this.index !== null) {
+                    this.activeIndex = this.index + this.skeletonCount;
+                }
                 this.activeIndex = this.activeIndex + this.skeletonCount;
             }
         }
@@ -14075,7 +14087,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             if (isCheckbox) {
                 var startindex = this.viewPortInfo.startIndex;
                 var endindex = (((startindex + this.viewPortInfo.endIndex) <= (valuecheck.length)) &&
-                    valuecheck[(startindex + this.viewPortInfo.endIndex)]) ? (startindex + this.viewPortInfo.endIndex)
+                    valuecheck[(startindex + this.viewPortInfo.endIndex)]) &&
+                    (this.dataSource instanceof DataManager && this.totalItemCount !== 0 && this.totalItemCount > (this.itemCount * 2))
+                    ? (startindex + this.viewPortInfo.endIndex)
                     : (valuecheck.length);
                 for (var i = startindex; i < endindex; i++) {
                     var value = this.allowObjectBinding ? getValue((this.fields.value) ?
@@ -15845,6 +15859,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             if (!isNullOrUndefined(this.value)) {
                 this.tempValues = this.allowObjectBinding ? this.value.slice() : this.value.slice();
             }
+            var removedChipTitle = selectedElem.getAttribute('title');
             temp = selectedElem.nextElementSibling;
             if (temp !== null) {
                 this.removeChipSelection();
@@ -15856,6 +15871,11 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             this.removeValue(currentChip, e);
             this.updateDelimeter(this.delimiterChar, e);
             this.makeTextBoxEmpty();
+            if (removedChipTitle && this.chipAnnouncerLiveRegion) {
+                var remainingCount = this.value ? this.value.length : 0;
+                var announcement = removedChipTitle + " removed from selection " + remainingCount + " items selected";
+                this.chipAnnouncerLiveRegion.textContent = announcement;
+            }
         }
         if (this.closePopupOnSelect) {
             this.hidePopup(e);
@@ -16048,6 +16068,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             var selectedChips = this.chipCollectionWrapper.querySelectorAll('span.' + CHIP$1 + '.' + CHIP_SELECTED);
             if (selectedChips && selectedChips.length === 1) {
                 selectedChips[0].removeAttribute('id');
+                selectedChips[0].removeAttribute('aria-hidden');
                 if (!isNullOrUndefined(this.inputElement) && this.inputElement.hasAttribute('aria-activedescendant')) {
                     this.inputElement.removeAttribute('aria-activedescendant');
                     if (!this.inputElement.hasAttribute('aria-describedby') && this.chipCollectionWrapper.id) {
@@ -16062,16 +16083,18 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         addClass([element], CHIP_SELECTED);
         if (element) {
             element.setAttribute('id', this.element.id + '_chip_item');
+            element.setAttribute('aria-hidden', 'true');
+            var chipTitle = element.getAttribute('title');
+            if (chipTitle && this.chipAnnouncerLiveRegion) {
+                var announcement = chipTitle + " focused. Press Backspace to remove";
+                this.chipAnnouncerLiveRegion.textContent = announcement;
+            }
             if (!isNullOrUndefined(this.inputElement) && element.id) {
                 this.inputElement.setAttribute('aria-activedescendant', element.id);
                 if (this.inputElement.hasAttribute('aria-describedby')) {
                     this.inputElement.removeAttribute('aria-describedby');
                 }
             }
-            var chipClose = element.querySelector('span.' + CHIP_CLOSE$1.split(' ')[0]);
-            if (chipClose) {
-                chipClose.removeAttribute('aria-hidden');
-            }
         }
         this.trigger('chipSelection', e);
     };
@@ -16558,15 +16581,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         var closeElements = this.chipCollectionWrapper.querySelectorAll('span.' + CHIP_CLOSE$1.split(' ')[0]);
         if (Browser.isDevice) {
             for (var index = 0; index < closeElements.length; index++) {
-                closeElements[index].setAttribute('aria-hidden', 'true');
                 closeElements[index].style.display = 'none';
             }
         }
-        else {
-            for (var index = 0; index < closeElements.length; index++) {
-                closeElements[index].setAttribute('aria-hidden', 'true');
-            }
-        }
     };
     MultiSelect.prototype.onMobileChipInteraction = function (e) {
         var chipElem = closest(e.target, '.' + CHIP$1);
@@ -16607,7 +16624,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         });
         var compiledString;
         var chipContent = this.createElement('span', { className: CHIP_CONTENT$1 });
-        var chipClose = this.createElement('span', { className: CHIP_CLOSE$1, attrs: { 'aria-label': 'delete', 'aria-hidden': 'true', 'tabindex': '-1' } });
+        var chipClose = this.createElement('span', { className: CHIP_CLOSE$1, attrs: { 'aria-hidden': 'true' } });
         if (this.mainData) {
             itemData = this.getDataByValue(value);
         }
@@ -16875,6 +16892,11 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     }, targetExitViewport: function () {
                         if (!Browser.isDevice) {
                             _this.hidePopup();
+                            var previousValue = _this.tempValues;
+                            if (isNullOrUndefined(previousValue)) {
+                                previousValue = [];
+                            }
+                            _this.updateValueState(_this.scrollEvent, _this.value, previousValue);
                         }
                     }
                 });
@@ -17155,6 +17177,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         EventHandler.add(this.componentWrapper, 'mouseout', this.mouseOut, this);
         EventHandler.add(this.overAllClear, 'mousedown', this.clearAll, this);
         EventHandler.add(this.inputElement, 'paste', this.pasteHandler, this);
+        EventHandler.add(document, 'wheel', this.onWheelScroll, this);
+        EventHandler.add(document, 'scroll', this.onWheelScroll, this);
     };
     MultiSelect.prototype.onInput = function (e) {
         if (this.keyDownStatus) {
@@ -17169,6 +17193,9 @@ 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 () {
@@ -17665,7 +17692,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             else {
                 this.updateDelimeter(this.delimiterChar, null, isInitialVirtualData);
             }
-            if (this.mode === 'CheckBox' && this.showSelectAll && (isNullOrUndefined(this.value) || !this.value.length)) {
+            if (this.mode === 'CheckBox' && this.showSelectAll && (isNullOrUndefined(this.value) || !this.value.length || (this.value.length !== this.listData.length))) {
                 this.notify('checkSelectAll', { module: 'CheckBoxSelection', enable: this.mode === 'CheckBox', value: 'uncheck' });
             }
             if (this.mode === 'Box' || (this.mode === 'Default' && this.inputFocus)) {
@@ -18484,6 +18511,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         if (!isNullOrUndefined(this.inputElement)) {
             EventHandler.remove(this.inputElement, 'paste', this.pasteHandler);
         }
+        EventHandler.remove(document, 'wheel', this.onWheelScroll);
+        EventHandler.remove(document, 'scroll', this.onWheelScroll);
     };
     MultiSelect.prototype.resizingWireEvent = function () {
         // Mouse events
@@ -18797,12 +18826,18 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     this.virtualSelectAllState = state;
                     this.virtualSelectAll = true;
                     this.CurrentEvent = event;
+                    if (this.mode === 'CheckBox' && this.value && Array.isArray(this.value) && this.value.length > 0 && this.enableSelectionOrder && this.targetElement().trim() === '' && this.viewPortInfo.startIndex < this.value.length) {
+                        this.isVirtualOrder = true;
+                    }
                     if (!this.virtualSelectAllData) {
                         this.resetList(this.dataSource, this.fields, new Query());
                     }
                     if (this.virtualSelectAllData) {
                         this.virtualSelectionAll(state, li, event);
                     }
+                    if (this.mode === 'CheckBox' && this.value && Array.isArray(this.value) && this.value.length > 0 && this.enableSelectionOrder && this.targetElement().trim() === '' && this.viewPortInfo.startIndex < this.value.length) {
+                        this.isVirtualOrder = false;
+                    }
                 }
                 else {
                     while (index < length && index <= 50 && index < count) {
@@ -19101,7 +19136,11 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     if (this.fields.disabled) {
                         this.removeDisabledItemsValue(this.value);
                     }
-                    this.updateVal(this.value, oldProp.value, 'value');
+                    if (this.enableVirtualization && !isNullOrUndefined(oldProp.value) && !isNullOrUndefined(newProp.value)
+                        && !this.validateValues(newProp.value, oldProp.value)) {
+                        return;
+                    }
+                    this.updateVal(this.value, oldProp.value, 'value', this.enableVirtualization);
                     this.addValidInputClass();
                     if (!this.closePopupOnSelect && this.isPopupOpen()) {
                         this.refreshPopup();
@@ -19297,9 +19336,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             _this.updateActionList(ulElement, list, event);
         });
     };
-    MultiSelect.prototype.updateVal = function (newProp, oldProp, prop) {
+    MultiSelect.prototype.updateVal = function (newProp, oldProp, prop, isVirtual) {
         var _this = this;
-        if (!this.list) {
+        if (isVirtual === void 0) { isVirtual = false; }
+        if (!this.list || (isVirtual && prop === 'value' && ((isNullOrUndefined(oldProp) && !isNullOrUndefined(newProp)) || (!isNullOrUndefined(oldProp) && isNullOrUndefined(newProp)) || (this.validateValues(newProp, oldProp) && newProp.length > 0)))) {
             this.onLoadSelect();
             if (this.enableVirtualization) {
                 this.setProperties({ text: '' }, true);
@@ -19823,6 +19863,14 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             this.overAllWrapper.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never')) {
             this.overAllWrapper.getElementsByClassName('e-float-text-content')[0].classList.add('e-icon');
         }
+        if (!this.chipAnnouncerLiveRegion) {
+            this.chipAnnouncerLiveRegion = this.createElement('div', {
+                attrs: { 'aria-live': 'polite', 'aria-atomic': 'true', 'class': 'e-chip-announcer' }
+            });
+            this.chipAnnouncerLiveRegion.style.position = 'absolute';
+            this.chipAnnouncerLiveRegion.style.left = '-10000px';
+            this.componentWrapper.appendChild(this.chipAnnouncerLiveRegion);
+        }
         this.renderComplete();
     };
     MultiSelect.prototype.setResize = function () {
@@ -20444,6 +20492,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         this.mainListCollection = null;
         this.footer = null;
         this.selectAllEventEle = null;
+        this.chipAnnouncerLiveRegion = null;
         _super.prototype.destroy.call(this);
     };
     __decorate$5([
@@ -21346,7 +21395,6 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
         this.list.classList.add('e-wrapper');
         this.list.classList.add('e-lib');
         if (this.element.tagName === 'EJS-LISTBOX') {
-            this.element.setAttribute('tabindex', '0');
             if (this.initLoad) {
                 this.element.appendChild(this.list);
             }