@syncfusion/ej2-multicolumn-combobox 26.2.10 → 27.1.48

package/dist/es6/ej2-multicolumn-combobox.es5.js

@@ -200,11 +200,11 @@ var GridSettings = /** @__PURE__ @class */ (function (_super) {
  * The selected value will be displayed in the input element.
  *
  * ```html
- *  <input type="text" id="multi-column"></input>
+ *  <input type='text' id='multi-column'></input>
  * ```
  * ```typescript
  *  let multiColObj: MultiColumnComboBox = new MultiColumnComboBox();
- *  multiColObj.appendTo("#multi-column");
+ *  multiColObj.appendTo('#multi-column');
  * ```
  */
 var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
@@ -314,6 +314,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
                 if (args.requestType === 'sorting') {
                     _this.updateRowSelection(args);
                 }
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 var dataRows = args.rows;
                 if (_this.isDataFiltered && dataRows.length > 0 && _this.inputEle.value !== '' && args.requestType !== 'sorting') {
                     var firstRowEle = _this.gridObj.getRows()[0];
@@ -349,7 +350,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
         }
         this.gridObj.appendTo(this.gridEle);
     };
-    // eslint-disable @typescript-eslint/no-explicit-any
+    /* eslint-disable @typescript-eslint/no-explicit-any */
     MultiColumnComboBox.prototype.isRowMatching = function (data, selectedValue, selectedText) {
         var values = Object.values(data).map(String);
         var isRowPresent = values.includes(selectedValue) && values.includes(selectedText);
@@ -379,10 +380,11 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
     };
     MultiColumnComboBox.prototype.findIndex = function (arr, obj) {
         return arr.findIndex(function (item) {
+            // eslint-disable-next-line
             return Object.keys(obj).every(function (key) { return item[key] === obj[key]; });
         });
     };
-    // eslint-enable @typescript-eslint/no-explicit-any
+    /* eslint-enable @typescript-eslint/no-explicit-any */
     MultiColumnComboBox.prototype.getGridColumns = function () {
         var _this = this;
         return this.columns.map(function (column) {
@@ -416,7 +418,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
                 showDropArea: false,
                 columns: [this.fields.groupBy],
                 captionTemplate: (this.groupTemplate && this.fields.groupBy !== '' && !isNullOrUndefined(this.fields.groupBy))
-                    ? this.groupTemplate : "${key}"
+                    ? this.groupTemplate : '${key}'
             };
             if (this.isVue) {
                 this.gridObj.isVue = this.isVue;
@@ -440,7 +442,9 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
             }
         }
         if (this.isInitialRender) {
-            var rowHeight = !this.popupDiv.classList.contains(NODATA) ? this.popupDiv.querySelector('.e-gridcontent tr').getBoundingClientRect().height : this.popupDiv.getBoundingClientRect().height;
+            var rowHeight = !this.popupDiv.classList.contains(NODATA) ? this.popupDiv.querySelector('.e-gridcontent tr') ?
+                this.popupDiv.querySelector('.e-gridcontent tr').getBoundingClientRect().height : 0 :
+                this.popupDiv.getBoundingClientRect().height;
             this.popupRowHeight = rowHeight;
             this.popupObj.hide();
             this.popupEle.style.visibility = 'unset';
@@ -621,8 +625,29 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
                 });
             }
             else if (!isNullOrUndefined(this.dataSource) && this.dataSource instanceof Array) {
-                item = this.dataSource[this.index];
-                updateValues(this.dataSource);
+                if (!this.fields.groupBy) {
+                    item = this.dataSource[this.index];
+                    updateValues(this.dataSource);
+                }
+                else {
+                    setTimeout(function () {
+                        var rows = _this.gridObj.getRows();
+                        if (rows && rows.length > 0) {
+                            var rowData = _this.gridObj.getRowInfo(rows[_this.index]).rowData;
+                            var value = _this.fields.value;
+                            for (var i = 0; i < rows.length; i++) {
+                                if (rowData && rowData[parseInt(value.toString(), 10)] ===
+                                    _this.dataSource[parseInt(i.toString(), 10)][parseInt(value.toString(), 10)]) {
+                                    item = rowData;
+                                    updateValues(_this.dataSource);
+                                    _this.updateChangeEvent(item, prevItemData, prevItemEle, currentValue, currentText, currentIndex, isRerender, isInitial);
+                                    _this.gridObj.selectRow(_this.index);
+                                    break;
+                                }
+                            }
+                        }
+                    });
+                }
             }
         }
         if (!(this.dataSource instanceof DataManager)) {
@@ -905,6 +930,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
         var data;
         if (this.dataSource instanceof DataManager) {
             var query = new Query();
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
             this.dataSource.executeQuery(query).then(function (result) {
                 var totaldata = result.result;
                 data = totaldata.filter(function (item) {
@@ -938,26 +964,47 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     MultiColumnComboBox.prototype.filterAction = function (dataSource, inputValue, query, fields) {
         var _this = this;
-        var filterType = this.filterType.toString().toLowerCase();
-        var isQuery = query || new Query();
-        var filteredData;
-        if (dataSource instanceof DataManager) {
-            // Handle filtering for DataManager
-            dataSource.executeQuery(isQuery).then(function (e) {
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                var dataLists = e.result;
-                var dataLength = dataLists.length;
-                filteredData = dataLists.filter(function (item) { return _this.filterData(item, filterType, inputValue, fields); });
-                _this.updateGridDataSource(filteredData, dataLength);
-            });
+        if (isNullOrUndefined(query) && isNullOrUndefined(fields)) {
+            this.updateGridDataSource(dataSource);
         }
-        else if (Array.isArray(dataSource)) {
-            // Handle filtering for array data source
-            filteredData = dataSource.filter(function (item) {
-                return _this.filterData(item, filterType, inputValue, fields);
-            });
-            this.updateGridDataSource(filteredData);
+        else if (query) {
+            if (dataSource instanceof DataManager) {
+                this.filteringHandler(dataSource, inputValue, query, fields);
+            }
+            else {
+                new DataManager(dataSource).executeQuery(query).then(function (e) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    var dataLists = e.result;
+                    _this.updateGridDataSource(dataLists);
+                });
+            }
         }
+        else {
+            var isQuery = query || new Query();
+            if (dataSource instanceof DataManager) {
+                this.filteringHandler(dataSource, inputValue, isQuery, fields);
+            }
+            else if (Array.isArray(dataSource)) {
+                var filterType_1 = this.filterType.toString().toLowerCase();
+                var filteredData = dataSource.filter(function (item) {
+                    return _this.filterData(item, filterType_1, inputValue, fields);
+                });
+                this.updateGridDataSource(filteredData);
+            }
+        }
+    };
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    MultiColumnComboBox.prototype.filteringHandler = function (dataSource, inputValue, query, fields) {
+        var _this = this;
+        var filterType = this.filterType.toString().toLowerCase();
+        var filteredData;
+        dataSource.executeQuery(query).then(function (e) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            var dataLists = e.result;
+            var dataLength = dataLists.length;
+            filteredData = dataLists.filter(function (item) { return _this.filterData(item, filterType, inputValue, fields); });
+            _this.updateGridDataSource(filteredData, dataLength);
+        });
     };
     MultiColumnComboBox.prototype.filterData = function (item, filterType, inputValue, fields) {
         var itemValue = item[fields ? fields.text : this.fields.text].toString().toLowerCase();
@@ -975,7 +1022,8 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
     MultiColumnComboBox.prototype.updateGridDataSource = function (dataSource, dataLength) {
         var autoHeight = true;
         if (dataSource.length > 0) {
-            var length_1 = this.dataSource instanceof DataManager ? dataLength : this.dataSource.length;
+            var length_1 = this.dataSource instanceof DataManager ? dataLength
+                : this.dataSource.length;
             autoHeight = length_1 !== dataSource.length;
             removeClass([this.popupDiv], [NODATA]);
             var noRecordEle = this.popupDiv.querySelector('.e-no-records');
@@ -1084,6 +1132,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
     };
     MultiColumnComboBox.prototype.updateValuesOnInput = function (mouseEvent, keyEvent, isClearValues) {
         var _this = this;
+        if (isClearValues === void 0) { isClearValues = false; }
         var e = mouseEvent ? mouseEvent : keyEvent;
         this.hidePopup(e);
         if (this.matchedRowEle && !isClearValues) {
@@ -1230,7 +1279,8 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
     MultiColumnComboBox.prototype.updateSelectedItem = function (e, isUpdateIndex, isInputTarget) {
         if (isUpdateIndex === void 0) { isUpdateIndex = true; }
         if (this.isPopupOpen) {
-            var index = !this.fields.groupBy ? this.gridObj.selectedRowIndex : this.gridObj.selectedRowIndex ? this.gridObj.selectedRowIndex : 0;
+            var index = !this.fields.groupBy ? this.gridObj.selectedRowIndex
+                : this.gridObj.selectedRowIndex ? this.gridObj.selectedRowIndex : 0;
             if ((index === -1 && (e.action === 'moveDown' || e.action === 'moveUp')) || (e.action === 'home')) {
                 index = 0;
             }
@@ -1250,7 +1300,7 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
                 focusedEle.classList.remove('e-row-focus');
             }
             if (isUpdateIndex) {
-                this.selectedGridRow(this.gridObj.getRows()[index], e, true);
+                this.selectedGridRow(this.gridObj.getRows()[parseInt(index.toString(), 10)], e, true);
             }
         }
     };
@@ -1291,19 +1341,22 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
         if (this.isPopupOpen) {
             this.hidePopup(e);
         }
-        removeClass([this.inputWrapper], [INPUTFOCUS]);
-        var clearIconEle = this.inputWrapper.querySelector('.e-clear-icon');
-        if (clearIconEle) {
-            clearIconEle.style.display = 'none';
-        }
-        if (this.floatLabelType !== 'Never') {
-            Input.calculateWidth(this.inputEle, this.inputWrapper);
+        if (this.inputWrapper) {
+            removeClass([this.inputWrapper], [INPUTFOCUS]);
+            var clearIconEle = this.inputWrapper.querySelector('.e-clear-icon');
+            if (clearIconEle) {
+                clearIconEle.style.display = 'none';
+            }
+            if (this.floatLabelType !== 'Never') {
+                Input.calculateWidth(this.inputEle, this.inputWrapper);
+            }
         }
     };
     /**
      * Opens the popup that displays the list of items.
      *
      * @param {MouseEvent | KeyboardEventArgs | TouchEvent} e - Specifies the event.
+     * @param {boolean} isInputOpen - Specifies whether the input is open or not.
      * @returns {void}
      */
     MultiColumnComboBox.prototype.showPopup = function (e, isInputOpen) {
@@ -1318,9 +1371,19 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
                 attributes(_this.inputEle, { 'aria-expanded': 'true', 'aria-owns': _this.element.id + '_popup', 'aria-controls': _this.element.id });
                 if (!isInputOpen) {
                     if ((_this.value || _this.text || _this.index)) {
-                        var dataRows = _this.gridObj.currentViewData;
+                        var dataRows = _this.gridObj.getRowsObject();
+                        var groupIndex_1;
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
                         dataRows.forEach(function (data, index) {
-                            _this.selectDataRow(data, index);
+                            if (_this.fields.groupBy && isNullOrUndefined(data.data.items)) {
+                                if (isNullOrUndefined(groupIndex_1)) {
+                                    groupIndex_1 = 0;
+                                }
+                                else {
+                                    groupIndex_1 += 1;
+                                }
+                            }
+                            _this.selectDataRow(data.data, !_this.fields.groupBy ? index : groupIndex_1);
                         });
                     }
                     _this.focusIn(e);
@@ -1535,12 +1598,14 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
                     this.initValue(true, false);
                     break;
                 case 'index':
-                    this.initValue();
+                    this.initValue(true);
                     break;
                 case 'sortOrder':
                     if (this.gridObj) {
-                        this.gridObj.sortSettings.columns = [{ field: this.fields.text, direction: newProp.sortOrder === SortOrder.Ascending ?
-                                    SortOrder.Ascending : SortOrder.Descending }];
+                        this.gridObj.sortSettings.columns = [{
+                                field: this.fields.text, direction: newProp.sortOrder === SortOrder.Ascending ?
+                                    SortOrder.Ascending : SortOrder.Descending
+                            }];
                     }
                     break;
                 case 'htmlAttributes':
@@ -1607,7 +1672,10 @@ var MultiColumnComboBox = /** @__PURE__ @class */ (function (_super) {
                     }
                     break;
                 case 'sortType':
-                    this.sortType = newProp.sortType;
+                    if (this.gridObj) {
+                        this.sortType = newProp.sortType;
+                        this.gridObj.allowMultiSorting = this.sortType.toString().toLowerCase() === 'multiplecolumns' && this.allowSorting;
+                    }
                     break;
                 case 'allowFiltering':
                     this.allowFiltering = newProp.allowFiltering;