@syncfusion/ej2-dropdowns 20.1.58 → 20.1.61

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

@@ -2427,11 +2427,9 @@ let DropDownList = class DropDownList extends DropDownBase {
         if (this.setValue(e)) {
             return;
         }
-        if (this.isPopupOpen) {
-            attributes(this.targetElement(), { 'aria-activedescendant': this.selectedLI ? this.selectedLI.id : null });
-            if (this.isFilterLayout() && this.filterInput) {
-                attributes(this.filterInput, { 'aria-activedescendant': this.selectedLI ? this.selectedLI.id : null });
-            }
+        attributes(this.targetElement(), { 'aria-activedescendant': this.selectedLI ? this.selectedLI.id : null });
+        if (this.isFilterLayout() && this.filterInput) {
+            attributes(this.filterInput, { 'aria-activedescendant': this.selectedLI ? this.selectedLI.id : null });
         }
         if ((!this.isPopupOpen && !isNullOrUndefined(li)) || (this.isPopupOpen && !isNullOrUndefined(e) &&
             (e.type !== 'keydown' || e.type === 'keydown' && e.action === 'enter'))) {
@@ -2464,13 +2462,21 @@ let DropDownList = class DropDownList extends DropDownBase {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         if (this.isReact) {
             this.clearTemplate(['valueTemplate']);
+            if (this.valueTempElement) {
+                detach(this.valueTempElement);
+                this.inputElement.style.display = 'block';
+                this.valueTempElement = null;
+            }
         }
         if (!this.valueTempElement) {
             this.valueTempElement = this.createElement('span', { className: dropDownListClasses.value });
             this.inputElement.parentElement.insertBefore(this.valueTempElement, this.inputElement);
             this.inputElement.style.display = 'none';
         }
-        this.valueTempElement.innerHTML = '';
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        if (!this.isReact) {
+            this.valueTempElement.innerHTML = '';
+        }
         const valuecheck = this.dropdownCompiler(this.valueTemplate);
         if (valuecheck) {
             compiledString = compile(document.querySelector(this.valueTemplate).innerHTML.trim());
@@ -3387,7 +3393,7 @@ let DropDownList = class DropDownList extends DropDownBase {
             EventHandler.remove(this.filterInput, 'paste', this.pasteHandler);
             this.filterInput = null;
         }
-        attributes(this.targetElement(), { 'aria-expanded': 'false', 'aria-activedescendant': null });
+        attributes(this.targetElement(), { 'aria-expanded': 'false' });
         this.inputWrapper.container.classList.remove(dropDownListClasses.iconAnimation);
         if (this.isFiltering()) {
             this.actionCompleteData.isUpdated = false;
@@ -3620,7 +3626,7 @@ let DropDownList = class DropDownList extends DropDownBase {
             || (!(props.dataSource instanceof DataManager) && props.dataSource.length === 0)))) {
             this.clearAll(null, props);
         }
-        if ((this.fields.groupBy && props.fields) && !this.isGroupChecking) {
+        if ((this.fields.groupBy && props.fields) && !this.isGroupChecking && this.list) {
             EventHandler.remove(this.list, 'scroll', this.setFloatingHeader);
             EventHandler.add(this.list, 'scroll', this.setFloatingHeader, this);
         }
@@ -8811,7 +8817,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
                         else if (containerAttr.indexOf(htmlAttr) > -1) {
                             this.overAllWrapper.setAttribute(htmlAttr, this.htmlAttributes[htmlAttr]);
                         }
-                        else {
+                        else if (htmlAttr !== 'size') {
                             this.inputElement.setAttribute(htmlAttr, this.htmlAttributes[htmlAttr]);
                         }
                         break;
@@ -9275,6 +9281,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
     }
     getQuery(query) {
         const filterQuery = query ? query.clone() : this.query ? this.query.clone() : new Query();
+        if (this.isFiltered) {
+            return filterQuery;
+        }
         if (this.filterAction) {
             if (this.targetElement() !== null) {
                 const dataType = this.typeOfData(this.dataSource).typeof;
@@ -9840,7 +9849,6 @@ let MultiSelect = class MultiSelect extends DropDownBase {
             if (!document.activeElement.classList.contains(FILTERINPUT)) {
                 e.preventDefault();
                 this.keyAction = true;
-                this.list.focus();
             }
             this.selectByKey(e);
         }
@@ -13398,6 +13406,7 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
     }
     initWrapper() {
         const hiddenSelect = this.createElement('select', { className: 'e-hidden-select', attrs: { 'multiple': '' } });
+        hiddenSelect.style.visibility = 'hidden';
         this.list.classList.add('e-listbox-wrapper');
         if (this.itemTemplate) {
             this.list.classList.add('e-list-template');
@@ -13723,12 +13732,12 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
         }
     }
     beforeDragEnd(args) {
-        const dragValue = this.getFormattedValue(args.droppedElement.getAttribute('data-value'));
-        if (this.value.indexOf(dragValue) > -1) {
+        this.dragValue = this.getFormattedValue(args.droppedElement.getAttribute('data-value'));
+        if (this.value.indexOf(this.dragValue) > -1) {
             args.items = this.getDataByValues(this.value);
         }
         else {
-            args.items = this.getDataByValues([dragValue]);
+            args.items = this.getDataByValues([this.dragValue]);
         }
         this.trigger('beforeDrop', args);
     }
@@ -14841,7 +14850,16 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
         return listObj;
     }
     getGrabbedItems() {
-        const elems = Array.prototype.slice.call(this.element.querySelectorAll('.e-grabbed'));
+        for (let i = 0; i < this.value.length; i++) {
+            if (this.value[i] === this.dragValue) {
+                const liColl = this.list.querySelectorAll('[aria-selected="true"]');
+                for (let i = 0; i < liColl.length; i++) {
+                    liColl[i].classList.add('e-grabbed');
+                }
+                break;
+            }
+        }
+        const elems = Array.prototype.slice.call(this.element.nextElementSibling.querySelectorAll('.e-grabbed'));
         return elems;
     }
     getDragArgs(args, isDragEnd) {