@syncfusion/ej2-dropdowns 20.2.39 → 20.2.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -485,7 +485,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
485
485
  *
486
486
  * @returns {void}
487
487
  */
488
- DropDownBase.prototype.initialize = function () {
488
+ DropDownBase.prototype.initialize = function (e) {
489
489
  this.bindEvent = true;
490
490
  this.actionFailureTemplateId = "" + this.element.id + ACTIONFAILURETEMPLATE_PROPERTY;
491
491
  if (this.element.tagName === 'UL') {
@@ -504,7 +504,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
504
504
  }
505
505
  }
506
506
  else {
507
- this.setListData(this.dataSource, this.fields, this.query);
507
+ this.setListData(this.dataSource, this.fields, this.query, e);
508
508
  }
509
509
  };
510
510
  /**
@@ -612,7 +612,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
612
612
  * @param {Query} query - Accepts the external Query that execute along with data processing.
613
613
  * @returns {void}
614
614
  */
615
- DropDownBase.prototype.setListData = function (dataSource, fields, query) {
615
+ DropDownBase.prototype.setListData = function (dataSource, fields, query, event) {
616
616
  var _this = this;
617
617
  fields = fields ? fields : this.fields;
618
618
  var ulElement;
@@ -659,7 +659,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
659
659
  _this.trigger('actionComplete', localDataArgs, function (localDataArgs) {
660
660
  if (!localDataArgs.cancel) {
661
661
  ulElement = _this.renderItems(localDataArgs.result, fields);
662
- _this.onActionComplete(ulElement, localDataArgs.result);
662
+ _this.onActionComplete(ulElement, localDataArgs.result, event);
663
663
  if (_this.groupTemplate) {
664
664
  _this.renderGroupTemplate(ulElement);
665
665
  }
@@ -1049,7 +1049,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1049
1049
  * @param {Query} query - Accepts the external Query that execute along with data processing.
1050
1050
  * @returns {void}
1051
1051
  */
1052
- DropDownBase.prototype.resetList = function (dataSource, fields, query) {
1052
+ DropDownBase.prototype.resetList = function (dataSource, fields, query, e) {
1053
1053
  if (this.list) {
1054
1054
  if ((this.element.tagName === 'SELECT' && this.element.options.length > 0)
1055
1055
  || (this.element.tagName === 'UL' && this.element.childNodes.length > 0)) {
@@ -1060,7 +1060,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1060
1060
  }
1061
1061
  }
1062
1062
  dataSource = this.getModuleName() === 'combobox' && this.selectData && dataSource instanceof Array && dataSource.length < this.selectData.length ? this.selectData : dataSource;
1063
- this.setListData(dataSource, fields, query);
1063
+ this.setListData(dataSource, fields, query, e);
1064
1064
  }
1065
1065
  };
1066
1066
  DropDownBase.prototype.updateSelectElementData = function (isFiltering) {
@@ -1152,7 +1152,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1152
1152
  * @private
1153
1153
  * @returns {void}
1154
1154
  */
1155
- DropDownBase.prototype.render = function (isEmptyData) {
1155
+ DropDownBase.prototype.render = function (e, isEmptyData) {
1156
1156
  this.list = this.createElement('div', { className: dropDownBaseClasses.content, attrs: { 'tabindex': '0' } });
1157
1157
  this.list.classList.add(dropDownBaseClasses.root);
1158
1158
  this.setFields();
@@ -1176,7 +1176,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1176
1176
  this.setEnableRtl();
1177
1177
  this.setEnabled();
1178
1178
  if (!isEmptyData) {
1179
- this.initialize();
1179
+ this.initialize(e);
1180
1180
  }
1181
1181
  };
1182
1182
  /**
@@ -1611,8 +1611,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
1611
1611
  this.popupObj.setProperties({ 'zIndex': this.zIndex });
1612
1612
  }
1613
1613
  };
1614
- DropDownList.prototype.renderList = function (isEmptyData) {
1615
- _super.prototype.render.call(this, isEmptyData);
1614
+ DropDownList.prototype.renderList = function (e, isEmptyData) {
1615
+ _super.prototype.render.call(this, e, isEmptyData);
1616
1616
  this.unWireListEvents();
1617
1617
  this.wireListEvents();
1618
1618
  };
@@ -2097,7 +2097,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
2097
2097
  var isTabAction = e.action === 'tab' || e.action === 'close';
2098
2098
  if (this.list === undefined && !this.isRequested && !isTabAction && e.action !== 'escape') {
2099
2099
  this.searchKeyEvent = e;
2100
- this.renderList();
2100
+ this.renderList(e);
2101
2101
  }
2102
2102
  if (isNullOrUndefined(this.list) || (!isNullOrUndefined(this.liCollections) &&
2103
2103
  isNavigation && this.liCollections.length === 0) || this.isRequested) {
@@ -2136,7 +2136,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
2136
2136
  }
2137
2137
  break;
2138
2138
  case 'open':
2139
- this.showPopup();
2139
+ this.showPopup(e);
2140
2140
  break;
2141
2141
  case 'hide':
2142
2142
  this.preventAltUp = this.isPopupOpen;
@@ -2328,7 +2328,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
2328
2328
  }
2329
2329
  if (!this.readonly) {
2330
2330
  if (this.isPopupOpen) {
2331
- this.hidePopup();
2331
+ this.hidePopup(e);
2332
2332
  if (this.isFilterLayout()) {
2333
2333
  this.focusDropDown(e);
2334
2334
  }
@@ -2338,7 +2338,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
2338
2338
  this.floatLabelChange();
2339
2339
  this.queryString = this.inputElement.value.trim() === '' ? null : this.inputElement.value;
2340
2340
  this.isDropDownClick = true;
2341
- this.showPopup();
2341
+ this.showPopup(e);
2342
2342
  }
2343
2343
  // eslint-disable-next-line @typescript-eslint/no-this-alias
2344
2344
  var proxy_1 = this;
@@ -2983,6 +2983,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
2983
2983
  }
2984
2984
  this.initial = false;
2985
2985
  }
2986
+ else if (this.getModuleName() === 'autocomplete' && this.value) {
2987
+ this.setInputValue();
2988
+ }
2986
2989
  if (this.getModuleName() !== 'autocomplete' && this.isFiltering() && !this.isTyped) {
2987
2990
  if (!this.actionCompleteData.isUpdated || ((!this.isCustomFilter
2988
2991
  && !this.isFilterFocus) || (isNullOrUndefined(this.itemData) && this.allowFiltering)
@@ -3004,7 +3007,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3004
3007
  }
3005
3008
  }
3006
3009
  if (this.beforePopupOpen) {
3007
- this.renderPopup();
3010
+ this.renderPopup(e);
3008
3011
  }
3009
3012
  }
3010
3013
  };
@@ -3076,7 +3079,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3076
3079
  removeClass(highlightedItem, dropDownListClasses.focus);
3077
3080
  }
3078
3081
  };
3079
- DropDownList.prototype.renderPopup = function () {
3082
+ DropDownList.prototype.renderPopup = function (e) {
3080
3083
  var _this = this;
3081
3084
  if (this.popupObj && document.body.contains(this.popupObj.element)) {
3082
3085
  this.refreshPopup();
@@ -3179,7 +3182,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3179
3182
  var animModel = { name: 'FadeIn', duration: 100 };
3180
3183
  _this.beforePopupOpen = true;
3181
3184
  var popupInstance = _this.popupObj;
3182
- var eventArgs = { popup: popupInstance, cancel: false, animation: animModel };
3185
+ var eventArgs = { popup: popupInstance, event: e, cancel: false, animation: animModel };
3183
3186
  _this.trigger('open', eventArgs, function (eventArgs) {
3184
3187
  if (!eventArgs.cancel) {
3185
3188
  addClass([_this.inputWrapper.container], [dropDownListClasses.iconAnimation]);
@@ -3592,7 +3595,12 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3592
3595
  DropDownList.prototype.setFooterTemplate = function (popupEle) {
3593
3596
  var compiledString;
3594
3597
  if (this.footer) {
3595
- this.footer.innerHTML = '';
3598
+ if (this.isReact) {
3599
+ this.clearTemplate(['footerTemplate']);
3600
+ }
3601
+ else {
3602
+ this.footer.innerHTML = '';
3603
+ }
3596
3604
  }
3597
3605
  else {
3598
3606
  this.footer = this.createElement('div');
@@ -3784,6 +3792,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3784
3792
  }
3785
3793
  });
3786
3794
  }
3795
+ else if (this_1.getModuleName() === 'autocomplete') {
3796
+ this_1.setInputValue(newProp, oldProp);
3797
+ }
3787
3798
  else {
3788
3799
  this_1.setOldText(oldProp.text);
3789
3800
  }
@@ -3825,6 +3836,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3825
3836
  }
3826
3837
  });
3827
3838
  }
3839
+ else if (this_1.getModuleName() === 'autocomplete') {
3840
+ this_1.setInputValue(newProp, oldProp);
3841
+ }
3828
3842
  else {
3829
3843
  this_1.setOldValue(oldProp.value);
3830
3844
  }
@@ -3943,6 +3957,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3943
3957
  removeClass([this.inputWrapper.container], ['e-readonly']);
3944
3958
  }
3945
3959
  };
3960
+ DropDownList.prototype.setInputValue = function (newProp, oldProp) {
3961
+ };
3946
3962
  DropDownList.prototype.setCssClass = function (newClass, oldClass) {
3947
3963
  if (!isNullOrUndefined(oldClass)) {
3948
3964
  oldClass = (oldClass.replace(/\s+/g, ' ')).trim();
@@ -3969,7 +3985,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3969
3985
  *
3970
3986
  * @returns {void}
3971
3987
  */
3972
- DropDownList.prototype.showPopup = function () {
3988
+ DropDownList.prototype.showPopup = function (e) {
3973
3989
  if (!this.enabled) {
3974
3990
  return;
3975
3991
  }
@@ -3989,11 +4005,11 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3989
4005
  }
3990
4006
  else if (isNullOrUndefined(this.list) || !isUndefined(this.list) && (this.list.classList.contains(dropDownBaseClasses.noData) ||
3991
4007
  this.list.querySelectorAll('.' + dropDownBaseClasses.li).length <= 0)) {
3992
- this.renderList();
4008
+ this.renderList(e);
3993
4009
  }
3994
- this.invokeRenderPopup();
4010
+ this.invokeRenderPopup(e);
3995
4011
  };
3996
- DropDownList.prototype.invokeRenderPopup = function () {
4012
+ DropDownList.prototype.invokeRenderPopup = function (e) {
3997
4013
  if (Browser.isDevice && this.isFilterLayout()) {
3998
4014
  // eslint-disable-next-line @typescript-eslint/no-this-alias
3999
4015
  var proxy_2 = this;
@@ -4003,7 +4019,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4003
4019
  history.pushState({}, '');
4004
4020
  }
4005
4021
  if (!isNullOrUndefined(this.list.children[0]) || this.list.classList.contains(dropDownBaseClasses.noData)) {
4006
- this.renderPopup();
4022
+ this.renderPopup(e);
4007
4023
  }
4008
4024
  attributes(this.targetElement(), { 'aria-activedescendant': this.selectedLI ? this.selectedLI.id : null });
4009
4025
  };
@@ -6042,7 +6058,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6042
6058
  }
6043
6059
  return 2;
6044
6060
  }
6045
- this.fields.dataSource = isNullOrUndefined(this.fields.dataSource) ? [] : this.fields.dataSource;
6061
+ if (isNullOrUndefined(this.fields.dataSource))
6062
+ this.fields.dataSource = [];
6046
6063
  for (var i = 0, len = this.fields.dataSource.length; i < len; i++) {
6047
6064
  if ((typeof field.child === 'string') && !isNullOrUndefined(getValue(field.child, this.fields.dataSource[i]))) {
6048
6065
  return 2;
@@ -7795,7 +7812,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
7795
7812
  }
7796
7813
  };
7797
7814
  ComboBox.prototype.incrementalSearch = function (e) {
7798
- this.showPopup();
7815
+ this.showPopup(e);
7799
7816
  if (!isNullOrUndefined(this.listData)) {
7800
7817
  this.inlineSearch(e);
7801
7818
  e.preventDefault();
@@ -8058,8 +8075,8 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
8058
8075
  * @returns {void}
8059
8076
  * @deprecated
8060
8077
  */
8061
- ComboBox.prototype.showPopup = function () {
8062
- _super.prototype.showPopup.call(this);
8078
+ ComboBox.prototype.showPopup = function (e) {
8079
+ _super.prototype.showPopup.call(this, e);
8063
8080
  };
8064
8081
  /* eslint-disable valid-jsdoc, jsdoc/require-param */
8065
8082
  /**
@@ -8296,10 +8313,10 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8296
8313
  * @private
8297
8314
  */
8298
8315
  function AutoComplete(options, element) {
8299
- var _this = _super.call(this, options, element) || this;
8300
- _this.isFiltered = false;
8301
- _this.searchList = false;
8302
- return _this;
8316
+ var _this_1 = _super.call(this, options, element) || this;
8317
+ _this_1.isFiltered = false;
8318
+ _this_1.searchList = false;
8319
+ return _this_1;
8303
8320
  }
8304
8321
  /**
8305
8322
  * Initialize the event handler
@@ -8347,17 +8364,17 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8347
8364
  return filterQuery;
8348
8365
  };
8349
8366
  AutoComplete.prototype.searchLists = function (e) {
8350
- var _this = this;
8367
+ var _this_1 = this;
8351
8368
  this.isTyped = true;
8352
8369
  this.isDataFetched = this.isSelectCustom = false;
8353
8370
  if (isNullOrUndefined(this.list)) {
8354
- _super.prototype.renderList.call(this, true);
8371
+ _super.prototype.renderList.call(this, e, true);
8355
8372
  }
8356
8373
  this.queryString = this.filterInput.value;
8357
8374
  if (e.type !== 'mousedown' && (e.keyCode === 40 || e.keyCode === 38)) {
8358
8375
  this.queryString = this.queryString === '' ? null : this.queryString;
8359
8376
  this.beforePopupOpen = true;
8360
- this.resetList(this.dataSource, this.fields);
8377
+ this.resetList(this.dataSource, this.fields, null, e);
8361
8378
  return;
8362
8379
  }
8363
8380
  this.isSelected = false;
@@ -8369,15 +8386,15 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8369
8386
  if (eventArgs.cancel) {
8370
8387
  return;
8371
8388
  }
8372
- _this.isFiltered = true;
8373
- _this.filterAction(dataSource, query, fields);
8389
+ _this_1.isFiltered = true;
8390
+ _this_1.filterAction(dataSource, query, fields);
8374
8391
  },
8375
8392
  cancel: false
8376
8393
  };
8377
8394
  this.trigger('filtering', eventArgs, function (eventArgs) {
8378
- if (!eventArgs.cancel && !_this.isFiltered && !eventArgs.preventDefaultAction) {
8379
- _this.searchList = true;
8380
- _this.filterAction(_this.dataSource, null, _this.fields);
8395
+ if (!eventArgs.cancel && !_this_1.isFiltered && !eventArgs.preventDefaultAction) {
8396
+ _this_1.searchList = true;
8397
+ _this_1.filterAction(_this_1.dataSource, null, _this_1.fields, e);
8381
8398
  }
8382
8399
  });
8383
8400
  };
@@ -8394,13 +8411,13 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8394
8411
  this.isFiltered = true;
8395
8412
  this.filterAction(dataSource, query, fields);
8396
8413
  };
8397
- AutoComplete.prototype.filterAction = function (dataSource, query, fields) {
8414
+ AutoComplete.prototype.filterAction = function (dataSource, query, fields, e) {
8398
8415
  this.beforePopupOpen = true;
8399
8416
  if (this.queryString !== '' && (this.queryString.length >= this.minLength)) {
8400
- this.resetList(dataSource, fields, query);
8417
+ this.resetList(dataSource, fields, query, e);
8401
8418
  }
8402
8419
  else {
8403
- this.hidePopup();
8420
+ this.hidePopup(e);
8404
8421
  this.beforePopupOpen = false;
8405
8422
  }
8406
8423
  this.renderReactTemplates();
@@ -8457,18 +8474,18 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8457
8474
  }
8458
8475
  };
8459
8476
  AutoComplete.prototype.listOption = function (dataSource, fieldsSettings) {
8460
- var _this = this;
8477
+ var _this_1 = this;
8461
8478
  var fields = _super.prototype.listOption.call(this, dataSource, fieldsSettings);
8462
8479
  if (isNullOrUndefined(fields.itemCreated)) {
8463
8480
  fields.itemCreated = function (e) {
8464
- if (_this.highlight) {
8465
- if (_this.element.tagName === _this.getNgDirective() && _this.itemTemplate) {
8481
+ if (_this_1.highlight) {
8482
+ if (_this_1.element.tagName === _this_1.getNgDirective() && _this_1.itemTemplate) {
8466
8483
  setTimeout(function () {
8467
- highlightSearch(e.item, _this.queryString, _this.ignoreCase, _this.filterType);
8484
+ highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);
8468
8485
  }, 0);
8469
8486
  }
8470
8487
  else {
8471
- highlightSearch(e.item, _this.queryString, _this.ignoreCase, _this.filterType);
8488
+ highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);
8472
8489
  }
8473
8490
  }
8474
8491
  };
@@ -8476,10 +8493,10 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8476
8493
  else {
8477
8494
  var itemCreated_1 = fields.itemCreated;
8478
8495
  fields.itemCreated = function (e) {
8479
- if (_this.highlight) {
8480
- highlightSearch(e.item, _this.queryString, _this.ignoreCase, _this.filterType);
8496
+ if (_this_1.highlight) {
8497
+ highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);
8481
8498
  }
8482
- itemCreated_1.apply(_this, [e]);
8499
+ itemCreated_1.apply(_this_1, [e]);
8483
8500
  };
8484
8501
  }
8485
8502
  return fields;
@@ -8487,9 +8504,9 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8487
8504
  AutoComplete.prototype.isFiltering = function () {
8488
8505
  return true;
8489
8506
  };
8490
- AutoComplete.prototype.renderPopup = function () {
8507
+ AutoComplete.prototype.renderPopup = function (e) {
8491
8508
  this.list.scrollTop = 0;
8492
- _super.prototype.renderPopup.call(this);
8509
+ _super.prototype.renderPopup.call(this, e);
8493
8510
  };
8494
8511
  AutoComplete.prototype.isEditTextBox = function () {
8495
8512
  return true && this.inputElement.value.trim() !== '';
@@ -8501,13 +8518,37 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8501
8518
  AutoComplete.prototype.isSelectFocusItem = function (element) {
8502
8519
  return false;
8503
8520
  };
8521
+ AutoComplete.prototype.setInputValue = function (newProp, oldProp) {
8522
+ var oldValue = oldProp && oldProp.text ? oldProp.text : oldProp ? oldProp.value : oldProp;
8523
+ var value = newProp && newProp.text ? newProp.text : newProp && newProp.value ? newProp.value : this.value;
8524
+ if (value && this.typedString === '' && !this.allowCustom && !(this.dataSource instanceof DataManager)) {
8525
+ var checkFields_1_1 = this.typeOfData(this.dataSource).typeof === 'string' ? '' : this.fields.value;
8526
+ var listLength_1 = this.getItems().length;
8527
+ var query = new Query();
8528
+ var _this_2 = this;
8529
+ new DataManager(this.dataSource).executeQuery(query.where(new Predicate(checkFields_1_1, 'equal', value)))
8530
+ .then(function (e) {
8531
+ if (e.result.length > 0) {
8532
+ _this_2.value = checkFields_1_1 !== '' ? e.result[0][_this_2.fields.value].toString() : e.result[0].toString();
8533
+ _this_2.addItem(e.result, listLength_1);
8534
+ _this_2.updateValues();
8535
+ }
8536
+ else {
8537
+ newProp && newProp.text ? _this_2.setOldText(oldValue) : newProp && newProp.value ? _this_2.setOldValue(oldValue) : _this_2.updateValues();
8538
+ }
8539
+ });
8540
+ }
8541
+ else if (newProp) {
8542
+ newProp.text ? this.setOldText(oldValue) : this.setOldValue(oldValue);
8543
+ }
8544
+ };
8504
8545
  /**
8505
8546
  * Search the entered text and show it in the suggestion list if available.
8506
8547
  *
8507
8548
  * @returns {void}
8508
8549
  * @deprecated
8509
8550
  */
8510
- AutoComplete.prototype.showPopup = function () {
8551
+ AutoComplete.prototype.showPopup = function (e) {
8511
8552
  if (!this.enabled) {
8512
8553
  return;
8513
8554
  }
@@ -8518,10 +8559,10 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
8518
8559
  this.beforePopupOpen = true;
8519
8560
  this.preventAutoFill = true;
8520
8561
  if (isNullOrUndefined(this.list)) {
8521
- this.renderList();
8562
+ this.renderList(e);
8522
8563
  }
8523
8564
  else {
8524
- this.resetList(this.dataSource, this.fields);
8565
+ this.resetList(this.dataSource, this.fields, null, e);
8525
8566
  }
8526
8567
  };
8527
8568
  /**
@@ -9023,7 +9064,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9023
9064
  }
9024
9065
  }
9025
9066
  };
9026
- MultiSelect.prototype.onPopupShown = function () {
9067
+ MultiSelect.prototype.onPopupShown = function (e) {
9027
9068
  var _this = this;
9028
9069
  if (Browser.isDevice && (this.mode === 'CheckBox' && this.allowFiltering)) {
9029
9070
  // eslint-disable-next-line @typescript-eslint/no-this-alias
@@ -9035,7 +9076,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9035
9076
  history.pushState({}, '');
9036
9077
  }
9037
9078
  var animModel = { name: 'FadeIn', duration: 100 };
9038
- var eventArgs = { popup: this.popupObj, cancel: false, animation: animModel };
9079
+ var eventArgs = { popup: this.popupObj, event: e, cancel: false, animation: animModel };
9039
9080
  this.trigger('open', eventArgs, function (eventArgs) {
9040
9081
  if (!eventArgs.cancel) {
9041
9082
  _this.focusAtFirstListItem();
@@ -9259,7 +9300,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9259
9300
  this.renderPopup();
9260
9301
  if (this.beforePopupOpen) {
9261
9302
  this.beforePopupOpen = false;
9262
- this.onPopupShown();
9303
+ this.onPopupShown(e);
9263
9304
  }
9264
9305
  };
9265
9306
  MultiSelect.prototype.refreshSelection = function () {
@@ -9551,7 +9592,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9551
9592
  }
9552
9593
  if (!this.isPopupOpen() &&
9553
9594
  (this.openOnClick || (this.showDropDownIcon && e.target && e.target.className === dropdownIcon))) {
9554
- this.showPopup();
9595
+ this.showPopup(e);
9555
9596
  }
9556
9597
  else {
9557
9598
  this.hidePopup(e);
@@ -9845,7 +9886,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
9845
9886
  break;
9846
9887
  case 40:
9847
9888
  if (!this.isPopupOpen()) {
9848
- this.showPopup();
9889
+ this.showPopup(e);
9849
9890
  e.preventDefault();
9850
9891
  }
9851
9892
  break;
@@ -11036,7 +11077,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11036
11077
  this.keyCode = e.keyCode;
11037
11078
  }
11038
11079
  if (!this.isPopupOpen() && this.openOnClick) {
11039
- this.showPopup();
11080
+ this.showPopup(e);
11040
11081
  }
11041
11082
  this.openClick(e);
11042
11083
  if (this.checkTextLength() && !this.allowFiltering && !isNullOrUndefined(e) && (e.keyCode !== 8)) {
@@ -11183,7 +11224,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11183
11224
  || this.list.querySelector('.e-ul') && this.list.querySelector('.e-ul').childElementCount === 0)) {
11184
11225
  isEmptyData = true;
11185
11226
  }
11186
- _super.prototype.render.call(this, isEmptyData);
11227
+ _super.prototype.render.call(this, null, isEmptyData);
11187
11228
  this.unwireListEvents();
11188
11229
  this.wireListEvents();
11189
11230
  };
@@ -11271,7 +11312,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11271
11312
  }
11272
11313
  };
11273
11314
  MultiSelect.prototype.updateDataList = function () {
11274
- if (this.mainList && this.ulElement && !(this.isFiltered || this.filterAction)) {
11315
+ if (this.mainList && this.ulElement && !(this.isFiltered || this.filterAction || this.targetElement().trim())) {
11275
11316
  var isDynamicGroupItemUpdate = this.mainList.childElementCount < this.ulElement.childElementCount;
11276
11317
  var isReactTemplateUpdate = ((this.ulElement.childElementCount > 0 && this.ulElement.children[0].childElementCount > 0) && (this.mainList.children[0].childElementCount < this.ulElement.children[0].childElementCount));
11277
11318
  var isAngularTemplateUpdate = this.itemTemplate && this.ulElement.childElementCount > 0 && !(this.ulElement.childElementCount < this.mainList.childElementCount) && (this.ulElement.children[0].childElementCount > 0 || (this.fields.groupBy && this.ulElement.children[1] && this.ulElement.children[1].childElementCount > 0));
@@ -12456,7 +12497,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12456
12497
  *
12457
12498
  * @returns {void}
12458
12499
  */
12459
- MultiSelect.prototype.showPopup = function () {
12500
+ MultiSelect.prototype.showPopup = function (e) {
12460
12501
  var _this = this;
12461
12502
  if (!this.enabled) {
12462
12503
  return;
@@ -12466,7 +12507,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12466
12507
  if (!args.cancel) {
12467
12508
  if (!_this.ulElement) {
12468
12509
  _this.beforePopupOpen = true;
12469
- _super.prototype.render.call(_this);
12510
+ _super.prototype.render.call(_this, e);
12470
12511
  if (_this.mode === 'CheckBox' && Browser.isDevice && _this.allowFiltering) {
12471
12512
  _this.notify('popupFullScreen', { module: 'CheckBoxSelection', enable: _this.mode === 'CheckBox' });
12472
12513
  }
@@ -12482,7 +12523,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12482
12523
  _this.beforePopupOpen = false;
12483
12524
  return;
12484
12525
  }
12485
- _this.onPopupShown();
12526
+ _this.onPopupShown(e);
12486
12527
  }
12487
12528
  });
12488
12529
  };
@@ -15018,9 +15059,20 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
15018
15059
  fListBox.value = [];
15019
15060
  listData = listData
15020
15061
  .filter(function (data) { return data.isHeader !== true; });
15021
- tListBox.listData = listData;
15022
- tListBox.jsonData = jsonData;
15023
- fListBox.listData = fListBox.sortedData = fListBox.jsonData = [];
15062
+ tListBox.listData = tListBox.jsonData = listData;
15063
+ if (fListBox.listData.length == fListBox.jsonData.length) {
15064
+ fListBox.listData = fListBox.sortedData = fListBox.jsonData = [];
15065
+ }
15066
+ else if (this.allowFiltering) {
15067
+ for (var i = 0; i < fListBox.listData.length; i++) {
15068
+ for (var j = 0; j < fListBox.jsonData.length; j++) {
15069
+ if (fListBox.listData[i] === fListBox.jsonData[j]) {
15070
+ fListBox.jsonData.splice(j, 1);
15071
+ }
15072
+ }
15073
+ }
15074
+ fListBox.listData = fListBox.sortedData = [];
15075
+ }
15024
15076
  if (isRefresh) {
15025
15077
  var sourceElem = tListBox.renderItems(listData, tListBox.fields);
15026
15078
  tListBox.updateListItems(sourceElem, tListBox.ulElement);