@syncfusion/ej2-dropdowns 24.1.46 → 24.2.3

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 24.1.46
+*  version : 24.2.3
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-dropdowns@*",
-  "_id": "@syncfusion/ej2-dropdowns@24.1.45",
+  "_id": "@syncfusion/ej2-dropdowns@24.1.47",
   "_inBundle": false,
-  "_integrity": "sha512-9Tee0dj1aMn5axMGjUn7hjYgWlXaj+QYybJ8fQGf1xgEos5c40ydWNn26Mx7aiG4ZasQTGTffCTvCYOF6ES9OA==",
+  "_integrity": "sha512-I3+Mj2wn5OPW697yvRQWhro8Icabx1JIekMBEsV/HpiHgy3F3GIoVZpagekzhRnlGGzWrAWngi5yn5YWHOgR2A==",
   "_location": "/@syncfusion/ej2-dropdowns",
   "_phantomChildren": {},
   "_requested": {
@@ -34,8 +34,8 @@
     "/@syncfusion/ej2-spreadsheet",
     "/@syncfusion/ej2-vue-dropdowns"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-24.1.45.tgz",
-  "_shasum": "793b012671db03deaa00d976f86dde916be7c315",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-24.1.47.tgz",
+  "_shasum": "152c36b552fa7b299fc54980ce7c316016c3fd26",
   "_spec": "@syncfusion/ej2-dropdowns@*",
   "_where": "/jenkins/workspace/elease-automation_release_24.1.1/packages/included",
   "author": {
@@ -43,13 +43,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~24.1.46",
-    "@syncfusion/ej2-data": "~24.1.41",
-    "@syncfusion/ej2-inputs": "~24.1.45",
-    "@syncfusion/ej2-lists": "~24.1.46",
-    "@syncfusion/ej2-navigations": "~24.1.46",
-    "@syncfusion/ej2-notifications": "~24.1.41",
-    "@syncfusion/ej2-popups": "~24.1.46"
+    "@syncfusion/ej2-base": "~24.2.3",
+    "@syncfusion/ej2-data": "~24.2.3",
+    "@syncfusion/ej2-inputs": "~24.2.3",
+    "@syncfusion/ej2-lists": "~24.2.3",
+    "@syncfusion/ej2-navigations": "~24.2.3",
+    "@syncfusion/ej2-notifications": "~24.2.3",
+    "@syncfusion/ej2-popups": "~24.2.3"
   },
   "deprecated": false,
   "description": "Essential JS 2 DropDown Components",
@@ -74,7 +74,7 @@
   "module": "./index.js",
   "name": "@syncfusion/ej2-dropdowns",
   "typings": "index.d.ts",
-  "version": "24.1.46",
+  "version": "24.2.3",
   "sideEffects": false,
   "homepage": "https://www.syncfusion.com/javascript-ui-controls"
 }

package/src/drop-down-base/drop-down-base.js

@@ -800,24 +800,27 @@ var DropDownBase = /** @class */ (function (_super) {
      * @returns {HTMLElement} Return the ul li list items.
      */
     DropDownBase.prototype.createListItems = function (dataSource, fields) {
-        if (dataSource && fields.groupBy || this.element.querySelector('optgroup')) {
-            if (fields.groupBy) {
-                if (this.sortOrder !== 'None') {
-                    dataSource = this.getSortedDataSource(dataSource);
+        if (dataSource) {
+            if (fields.groupBy || this.element.querySelector('optgroup')) {
+                if (fields.groupBy) {
+                    if (this.sortOrder !== 'None') {
+                        dataSource = this.getSortedDataSource(dataSource);
+                    }
+                    dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);
                 }
-                dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);
+                addClass([this.list], dropDownBaseClasses.grouping);
             }
-            addClass([this.list], dropDownBaseClasses.grouping);
-        }
-        else {
-            dataSource = this.getSortedDataSource(dataSource);
+            else {
+                dataSource = this.getSortedDataSource(dataSource);
+            }
+            var options = this.listOption(dataSource, fields);
+            var spliceData = (dataSource.length > 100) ?
+                new DataManager(dataSource).executeLocal(new Query().take(100))
+                : dataSource;
+            this.sortedData = dataSource;
+            return ListBase.createList(this.createElement, (this.getModuleName() === 'autocomplete') ? spliceData : dataSource, options, true, this);
         }
-        var options = this.listOption(dataSource, fields);
-        var spliceData = (dataSource.length > 100) ?
-            new DataManager(dataSource).executeLocal(new Query().take(100))
-            : dataSource;
-        this.sortedData = dataSource;
-        return ListBase.createList(this.createElement, (this.getModuleName() === 'autocomplete') ? spliceData : dataSource, options, true, this);
+        return null;
     };
     DropDownBase.prototype.listOption = function (dataSource, fields) {
         var iconCss = isNullOrUndefined(fields.iconCss) ? false : true;
@@ -905,7 +908,8 @@ var DropDownBase = /** @class */ (function (_super) {
     };
     DropDownBase.prototype.updateGroupFixedHeader = function (element, target) {
         this.fixedHeaderElement.innerHTML = element.innerHTML;
-        this.fixedHeaderElement.style.top = target.scrollTop + 'px';
+        this.fixedHeaderElement.style.position = 'fixed';
+        this.fixedHeaderElement.style.top = this.list.parentElement.offsetTop + this.list.offsetTop + 'px';
         this.fixedHeaderElement.style.display = 'block';
     };
     DropDownBase.prototype.getValidLi = function () {
@@ -1080,10 +1084,12 @@ var DropDownBase = /** @class */ (function (_super) {
     DropDownBase.prototype.getIndexByValueFilter = function (value) {
         var index;
         var listItems = this.renderItems(this.selectData, this.fields);
-        for (var i = 0; i < listItems.children.length; i++) {
-            if (!isNullOrUndefined(value) && listItems.children[i].getAttribute('data-value') === value.toString()) {
-                index = i;
-                break;
+        if (listItems && listItems.children) {
+            for (var i = 0; i < listItems.children.length; i++) {
+                if (!isNullOrUndefined(value) && listItems.children[i].getAttribute('data-value') === value.toString()) {
+                    index = i;
+                    break;
+                }
             }
         }
         return index;

package/src/list-box/list-box.js

@@ -378,6 +378,19 @@ var ListBox = /** @class */ (function (_super) {
             this.list.insertBefore(searchEle, this.list.firstElementChild);
             this.filterParent = this.list.getElementsByClassName('e-filter-parent')[0];
             this.filterWireEvents(searchEle);
+            var inputSearch = searchEle.querySelector('.e-input-filter');
+            if (inputSearch) {
+                inputSearch.addEventListener('focus', function () {
+                    if (!searchEle.childNodes[0].classList.contains('e-input-focus')) {
+                        searchEle.childNodes[0].classList.add('e-input-focus');
+                    }
+                });
+                inputSearch.addEventListener('blur', function () {
+                    if (searchEle.childNodes[0].classList.contains('e-input-focus')) {
+                        searchEle.childNodes[0].classList.remove('e-input-focus');
+                    }
+                });
+            }
         }
         this.initWrapper();
         this.setSelection();

package/src/mention/mention.js

@@ -1178,12 +1178,6 @@ var Mention = /** @class */ (function (_super) {
             if (this.isPopupOpen) {
                 this.hidePopup();
             }
-            //New event to update the RichTextEditor value, when a mention item is selected using mouse click action. 
-            if (!isNullOrUndefined(e.pointerType) && e.pointerType === 'mouse') {
-                var event_1 = new CustomEvent('content-changed', { detail: { click: true } });
-                this.inputElement.dispatchEvent(event_1);
-            }
-            ;
             this.onChangeEvent(e);
         }
         else {
@@ -1229,6 +1223,12 @@ var Mention = /** @class */ (function (_super) {
             if (this.isPopupOpen) {
                 this.hidePopup();
             }
+            //New event to update the RichTextEditor value, when a mention item is selected using mouse click action. 
+            if (!isNullOrUndefined(e.pointerType) && e.pointerType === 'mouse') {
+                var event_1 = new CustomEvent('content-changed', { detail: { click: true } });
+                this.inputElement.dispatchEvent(event_1);
+            }
+            ;
             this.onChangeEvent(e);
         }
     };

package/src/multi-select/multi-select.js

@@ -327,7 +327,9 @@ var MultiSelect = /** @class */ (function (_super) {
         }
         if (activeElement && activeElement.item !== null) {
             this.addListFocus(activeElement.item);
-            this.scrollBottom(activeElement.item, activeElement.index);
+            if (((this.allowCustomValue || this.allowFiltering) && this.isPopupOpen() && this.closePopupOnSelect) || this.closePopupOnSelect) {
+                this.scrollBottom(activeElement.item, activeElement.index);
+            }
         }
     };
     MultiSelect.prototype.getAriaAttributes = function () {

package/styles/bootstrap-dark.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0070f0;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #414141;
   height: auto;

package/styles/bootstrap.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #317ab9;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid rgba(119, 119, 119, 0.25);
   height: auto;

package/styles/bootstrap4.css

@@ -117,11 +117,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #007bff;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid rgba(0, 0, 0, 0.15);
   height: auto;

package/styles/bootstrap5-dark.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0d6efd;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #444c54;
   height: auto;

package/styles/bootstrap5.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0d6efd;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #dee2e6;
   height: auto;

package/styles/drop-down-base/_layout.scss

@@ -101,11 +101,6 @@
     cursor: default;
   }
 
-  .e-mention .e-mention-chip::selection {
-    color: $mention-gradient-color;
-    background: $mention-active-font-color;
-  }
-
   .e-mention.e-editable-element {
     border: 2px solid $ddl-list-border-color;
     height: auto;

package/styles/drop-down-base/bootstrap-dark.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0070f0;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #414141;
   height: auto;

package/styles/drop-down-base/bootstrap.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #317ab9;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid rgba(119, 119, 119, 0.25);
   height: auto;

package/styles/drop-down-base/bootstrap4.css

@@ -117,11 +117,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #007bff;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid rgba(0, 0, 0, 0.15);
   height: auto;

package/styles/drop-down-base/bootstrap5-dark.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0d6efd;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #444c54;
   height: auto;

package/styles/drop-down-base/bootstrap5.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0d6efd;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #dee2e6;
   height: auto;

package/styles/drop-down-base/fabric-dark.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0074cc;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #414040;
   height: auto;

package/styles/drop-down-base/fabric.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0078d6;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid rgba(234, 234, 234, 0.25);
   height: auto;

package/styles/drop-down-base/fluent-dark.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0078d4;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #292827;
   height: auto;

package/styles/drop-down-base/fluent.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0078d4;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #edebe9;
   height: auto;

package/styles/drop-down-base/highcontrast-light.css

@@ -121,11 +121,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #000;
-  background: #400074;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #757575;
   height: auto;

package/styles/drop-down-base/highcontrast.css

@@ -121,11 +121,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #000;
-  background: #ffd939;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #969696;
   height: auto;

package/styles/drop-down-base/material-dark.css

@@ -106,11 +106,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #000;
-  background: #00b0ff;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid transparent;
   height: auto;

package/styles/drop-down-base/material.css

@@ -106,11 +106,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #e3165b;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e0e0e0;
   height: auto;

package/styles/drop-down-base/material3-dark.css

@@ -160,11 +160,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: rgba(var(--color-sf-surface));
-  background: rgba(var(--color-sf-primary));
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e0e0e0;
   height: auto;

package/styles/drop-down-base/material3.css

@@ -216,11 +216,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: rgba(var(--color-sf-surface));
-  background: rgba(var(--color-sf-primary));
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e0e0e0;
   height: auto;

package/styles/drop-down-base/tailwind-dark.css

@@ -141,11 +141,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #22d3ee;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #4b5563;
   height: auto;

package/styles/drop-down-base/tailwind.css

@@ -141,11 +141,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #4f46e5;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e5e7eb;
   height: auto;

package/styles/fabric-dark.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0074cc;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #414040;
   height: auto;

package/styles/fabric.css

@@ -107,11 +107,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0078d6;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid rgba(234, 234, 234, 0.25);
   height: auto;

package/styles/fluent-dark.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0078d4;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #292827;
   height: auto;

package/styles/fluent.css

@@ -133,11 +133,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #0078d4;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #edebe9;
   height: auto;

package/styles/highcontrast-light.css

@@ -121,11 +121,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #000;
-  background: #400074;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #757575;
   height: auto;

package/styles/highcontrast.css

@@ -121,11 +121,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #000;
-  background: #ffd939;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #969696;
   height: auto;

package/styles/material-dark.css

@@ -106,11 +106,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #000;
-  background: #00b0ff;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid transparent;
   height: auto;

package/styles/material.css

@@ -106,11 +106,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #e3165b;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e0e0e0;
   height: auto;

package/styles/material3-dark.css

@@ -160,11 +160,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: rgba(var(--color-sf-surface));
-  background: rgba(var(--color-sf-primary));
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e0e0e0;
   height: auto;

package/styles/material3.css

@@ -216,11 +216,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: rgba(var(--color-sf-surface));
-  background: rgba(var(--color-sf-primary));
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e0e0e0;
   height: auto;

package/styles/tailwind-dark.css

@@ -141,11 +141,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #22d3ee;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #4b5563;
   height: auto;

package/styles/tailwind.css

@@ -141,11 +141,6 @@
   cursor: default;
 }
 
-.e-mention .e-mention-chip::selection {
-  color: #fff;
-  background: #4f46e5;
-}
-
 .e-mention.e-editable-element {
   border: 2px solid #e5e7eb;
   height: auto;