@syncfusion/ej2-dropdowns 24.2.3 → 24.2.5

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

@@ -842,7 +842,7 @@ let DropDownBase = class DropDownBase extends Component {
                         }
                     }
                     else {
-                        if (noDataElement[i] instanceof HTMLElement) {
+                        if (noDataElement[i] instanceof HTMLElement || noDataElement[i] instanceof Text) {
                             ele.appendChild(noDataElement[i]);
                         }
                     }
@@ -3339,6 +3339,9 @@ let DropDownList = class DropDownList extends DropDownBase {
             if (this.inputWrapper.container.classList.contains(dropDownListClasses.inputFocus) || this.isPopupOpen) {
                 this.isDocumentClick = true;
                 const isActive = this.isRequested;
+                if (this.getModuleName() === 'combobox' && this.isTyped) {
+                    this.isInteracted = false;
+                }
                 this.hidePopup(e);
                 this.isInteracted = false;
                 if (!isActive) {
@@ -4024,6 +4027,11 @@ let DropDownList = class DropDownList extends DropDownBase {
                     this.virtualListInfo = null;
                 }
                 this.resetList(dataSource, fields, query);
+                if (this.getModuleName() === 'dropdownlist' && this.list.classList.contains(dropDownBaseClasses.noData)) {
+                    this.popupContentElement.setAttribute('role', 'status');
+                    this.popupContentElement.setAttribute('id', 'no-record');
+                    attributes(this.filterInputObj.container, { 'aria-activedescendant': 'no-record' });
+                }
                 if (this.enableVirtualization && isNoData && !this.list.classList.contains(dropDownBaseClasses.noData)) {
                     if (!this.list.querySelector('.e-virtual-ddl-content')) {
                         this.list.appendChild(this.createElement('div', {
@@ -4564,6 +4572,11 @@ let DropDownList = class DropDownList extends DropDownBase {
                     }, 5);
                 }
                 attributes(this.targetElement(), { 'aria-expanded': 'true', 'aria-owns': this.element.id + '_popup', 'aria-controls': this.element.id });
+                if (this.getModuleName() !== 'dropdownlist' && this.list.classList.contains('e-nodata')) {
+                    attributes(this.targetElement(), { 'aria-activedescendant': 'no-record' });
+                    this.popupContentElement.setAttribute('role', 'status');
+                    this.popupContentElement.setAttribute('id', 'no-record');
+                }
                 this.inputElement.setAttribute('aria-expanded', 'true');
                 this.inputElement.setAttribute('aria-controls', this.element.id);
                 const inputParent = this.isFiltering() ? this.filterInput.parentElement : this.inputWrapper.container;
@@ -5850,6 +5863,9 @@ let DropDownList = class DropDownList extends DropDownBase {
             this.clearTemplate();
         }
         this.hidePopup();
+        if (this.popupObj) {
+            this.popupObj.hide();
+        }
         this.unWireEvent();
         if (this.list) {
             this.unWireListEvents();
@@ -7922,9 +7938,6 @@ let DropDownTree = class DropDownTree extends Component {
             if (this.value === null) {
                 this.setProperties({ value: [] }, true);
             }
-            if (args.node.classList.contains("e-active")) {
-                this.hidePopup();
-            }
         }
     }
     updateHiddenValue() {
@@ -11146,6 +11159,11 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         }
     }
     removelastSelection(e) {
+        const selectedElem = this.chipCollectionWrapper.querySelector('span.' + CHIP_SELECTED);
+        if (selectedElem !== null) {
+            this.removeSelectedChip(e);
+            return;
+        }
         const elements = this.chipCollectionWrapper.querySelectorAll('span.' + CHIP$1);
         const value = elements[elements.length - 1].getAttribute('data-value');
         if (!isNullOrUndefined(this.value)) {
@@ -11222,6 +11240,12 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         else {
             this.updateActionList(ulElement, list, e);
         }
+        if (this.dataSource instanceof DataManager && this.allowCustomValue && !this.isCustomRendered && this.inputElement.value && this.inputElement.value !== '') {
+            let query = new Query();
+            query = this.allowFiltering ? query.where(this.fields.text, 'startswith', this.inputElement.value, this.ignoreCase, this.ignoreAccent) : query;
+            this.checkForCustomValue(query, this.fields);
+            this.isCustomRendered = true;
+        }
         if (this.dataSource instanceof DataManager && this.mode === 'CheckBox' && this.allowFiltering) {
             this.removeFocus();
         }
@@ -11243,7 +11267,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         if ((this.remoteCustomValue || list.length <= 0) && this.allowCustomValue && this.inputFocus && this.allowFiltering &&
             this.inputElement.value && this.inputElement.value !== '') {
             this.checkForCustomValue(this.tempQuery, this.fields);
-            return;
+            if (this.isCustomRendered) {
+                return;
+            }
         }
         if (this.value && this.value.length && ((this.mode !== 'CheckBox' && !isNullOrUndefined(this.inputElement) && this.inputElement.value.trim() !== '') ||
             this.mode === 'CheckBox' || ((this.keyCode === 8 || this.keyCode === 46) && this.allowFiltering &&
@@ -11510,12 +11536,12 @@ let MultiSelect = class MultiSelect extends DropDownBase {
     }
     checkForCustomValue(query, fields) {
         const dataChecks = !this.getValueByText(this.inputElement.value, this.ignoreCase);
+        const field = fields ? fields : this.fields;
         if (this.allowCustomValue && dataChecks) {
             const value = this.inputElement.value;
-            const field = fields ? fields : this.fields;
             const customData = (!isNullOrUndefined(this.mainData) && this.mainData.length > 0) ?
                 this.mainData[0] : this.mainData;
-            if (typeof (customData) !== 'string' && typeof (customData) !== 'number' && typeof (customData) !== 'boolean') {
+            if (customData && typeof (customData) !== 'string' && typeof (customData) !== 'number' && typeof (customData) !== 'boolean') {
                 const dataItem = {};
                 setValue(field.text, value, dataItem);
                 if (typeof getValue((this.fields.value ? this.fields.value : 'value'), customData)
@@ -11529,7 +11555,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
                 tempData.splice(0, 0, dataItem);
                 this.resetList(tempData, field, query);
             }
-            else {
+            else if (this.listData) {
                 const tempData = JSON.parse(JSON.stringify(this.listData));
                 tempData.splice(0, 0, this.inputElement.value);
                 tempData[0] = (typeof customData === 'number' && !isNaN(parseFloat(tempData[0]))) ?
@@ -11539,6 +11565,19 @@ let MultiSelect = class MultiSelect extends DropDownBase {
                 this.resetList(tempData, field);
             }
         }
+        else if (this.listData && this.mainData && !dataChecks && this.allowCustomValue) {
+            if (this.allowFiltering && this.isRemoteSelection && this.remoteCustomValue) {
+                this.isRemoteSelection = false;
+                this.resetList(this.listData, field, query);
+            }
+            else if (!this.allowFiltering && this.list) {
+                const liCollections = this.list.querySelectorAll('li.' + dropDownBaseClasses.li + ':not(.e-hide-listitem)');
+                const activeElement = Search(this.targetElement(), liCollections, 'StartsWith', this.ignoreCase);
+                if (activeElement && activeElement.item !== null) {
+                    this.addListFocus(activeElement.item);
+                }
+            }
+        }
         if (this.value && this.value.length) {
             this.refreshSelection();
         }
@@ -13159,6 +13198,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         else {
             const text = this.targetElement();
             if (this.allowFiltering) {
+                if (this.allowCustomValue) {
+                    this.isRemoteSelection = true;
+                }
                 const eventArgs = {
                     preventDefaultAction: false,
                     text: this.targetElement(),
@@ -13184,7 +13226,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
             }
             else if (this.allowCustomValue) {
                 let query = new Query();
-                query = (text !== '') ? query.where(this.fields.text, 'startswith', text, this.ignoreCase, this.ignoreAccent) : query;
+                query = this.allowFiltering && (text !== '') ? query.where(this.fields.text, 'startswith', text, this.ignoreCase, this.ignoreAccent) : query;
                 this.dataUpdater(this.mainData, query, this.fields);
             }
             else {
@@ -13226,6 +13268,8 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         this.focused = true;
         this.initial = true;
         this.backCommand = true;
+        this.isCustomRendered = false;
+        this.isRemoteSelection = false;
     }
     updateData(delimiterChar, e) {
         let data = '';
@@ -13268,7 +13312,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
         if (delim) {
             this.updateWrapperText(this.delimiterWrapper, data);
             this.delimiterWrapper.setAttribute('id', getUniqueID('delim_val'));
-            this.inputElement.setAttribute('aria-labelledby', this.delimiterWrapper.id);
+            this.inputElement.setAttribute('aria-describedby', this.delimiterWrapper.id);
         }
         const targetEle = e && e.target;
         const isClearAll = (targetEle && targetEle.classList.contains('e-close-hooker')) ? true : null;
@@ -14238,7 +14282,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
             this.hiddenElement.innerHTML = hiddenValue;
             this.updateWrapperText(this.delimiterWrapper, wrapperText);
             this.delimiterWrapper.setAttribute('id', getUniqueID('delim_val'));
-            this.inputElement.setAttribute('aria-labelledby', this.delimiterWrapper.id);
+            this.inputElement.setAttribute('aria-describedby', this.delimiterWrapper.id);
             this.setProperties({ text: text.toString() }, true);
             this.refreshInputHight();
             this.refreshPlaceHolder();
@@ -14748,7 +14792,7 @@ let MultiSelect = class MultiSelect extends DropDownBase {
             }
         });
         if (this.mode === 'Default' || this.mode === 'Box') {
-            this.inputElement.setAttribute('aria-labelledby', this.chipCollectionWrapper.id);
+            this.inputElement.setAttribute('aria-describedby', this.chipCollectionWrapper.id);
         }
         if (this.element.tagName !== this.getNgDirective()) {
             this.element.style.display = 'none';
@@ -14997,7 +15041,7 @@ __decorate$5([
     Property(true)
 ], MultiSelect.prototype, "enabled", void 0);
 __decorate$5([
-    Property(false)
+    Property(true)
 ], MultiSelect.prototype, "enableHtmlSanitizer", void 0);
 __decorate$5([
     Property([])
@@ -15765,6 +15809,13 @@ let ListBox = ListBox_1 = class ListBox extends DropDownBase {
      * @returns {void}
      */
     render() {
+        if (this.isAngular && this.allowFiltering) {
+            const originalElement = this.element;
+            const clonedElement = originalElement.cloneNode(true);
+            originalElement.parentNode.replaceChild(clonedElement, originalElement);
+            this.element = clonedElement;
+            setValue('ej2_instances', [this], this.element);
+        }
         this.inputString = '';
         this.initLoad = true;
         this.isCustomFiltering = false;
@@ -18398,7 +18449,7 @@ let Mention = class Mention extends DropDownBase {
             rangetextContent = this.range.startContainer.textContent.split('');
         }
         let currentRange = this.getTextRange();
-        const lastWordRange = this.getLastLetter(currentRange);
+        let lastWordRange = this.getLastLetter(currentRange);
         const lastTwoLetters = this.mentionChar.toString() + this.mentionChar.toString();
         // eslint-disable-next-line security/detect-non-literal-regexp
         const Regex = new RegExp(this.mentionChar.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'g');
@@ -18428,7 +18479,9 @@ let Mention = class Mention extends DropDownBase {
             }
             return;
         }
-        this.queryString = lastWordRange.replace(this.mentionChar, '');
+        if (lastWordRange.includes(this.mentionChar)) {
+            this.queryString = lastWordRange.replace(this.mentionChar, '');
+        }
         if (this.mentionChar.charCodeAt(0) === lastWordRange.charCodeAt(0) &&
             this.queryString !== '' && e.keyCode !== 38 && e.keyCode !== 40 && !this.lineBreak) {
             this.searchLists(e);
@@ -18772,6 +18825,7 @@ let Mention = class Mention extends DropDownBase {
                     this.inputElement.parentElement.parentElement.classList.contains('e-richtexteditor')) {
                     if (popupEle.firstElementChild && popupEle.firstElementChild.childElementCount > 0) {
                         popupEle.firstElementChild.setAttribute('aria-owns', this.inputElement.parentElement.parentElement.id);
+                        addClass([popupEle], 'e-rte-elements');
                     }
                 }
                 if ((!this.popupObj || !document.body.contains(this.popupObj.element)) ||