@syncfusion/ej2-dropdowns 25.1.35 → 25.1.39

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.
Files changed (48) hide show
  1. package/CHANGELOG.md +48 -0
  2. package/dist/ej2-dropdowns.min.js +2 -2
  3. package/dist/ej2-dropdowns.umd.min.js +2 -2
  4. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-dropdowns.es2015.js +270 -109
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +272 -111
  8. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  9. package/dist/global/ej2-dropdowns.min.js +2 -2
  10. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +9 -9
  13. package/src/auto-complete/auto-complete.js +45 -29
  14. package/src/combo-box/combo-box.js +1 -4
  15. package/src/common/highlight-search.js +4 -0
  16. package/src/common/interface.d.ts +1 -0
  17. package/src/common/virtual-scroll.js +5 -5
  18. package/src/drop-down-base/drop-down-base.d.ts +3 -0
  19. package/src/drop-down-base/drop-down-base.js +37 -4
  20. package/src/drop-down-list/drop-down-list.js +71 -34
  21. package/src/drop-down-tree/drop-down-tree.js +21 -9
  22. package/src/list-box/list-box-model.d.ts +13 -1
  23. package/src/list-box/list-box.d.ts +12 -0
  24. package/src/list-box/list-box.js +4 -1
  25. package/src/mention/mention.js +1 -1
  26. package/src/multi-select/checkbox-selection.d.ts +2 -0
  27. package/src/multi-select/checkbox-selection.js +8 -1
  28. package/src/multi-select/multi-select-model.d.ts +1 -1
  29. package/src/multi-select/multi-select.d.ts +1 -0
  30. package/src/multi-select/multi-select.js +75 -22
  31. package/styles/fluent-dark.css +1 -1
  32. package/styles/fluent.css +1 -1
  33. package/styles/list-box/_layout.scss +6 -2
  34. package/styles/list-box/tailwind-dark.css +0 -10
  35. package/styles/list-box/tailwind.css +0 -10
  36. package/styles/material-dark.css +9 -0
  37. package/styles/material.css +9 -0
  38. package/styles/multi-select/_fluent-definition.scss +1 -1
  39. package/styles/multi-select/_material-dark-definition.scss +11 -0
  40. package/styles/multi-select/_material-definition.scss +11 -0
  41. package/styles/multi-select/fluent-dark.css +1 -1
  42. package/styles/multi-select/fluent.css +1 -1
  43. package/styles/multi-select/material-dark.css +9 -0
  44. package/styles/multi-select/material.css +9 -0
  45. package/styles/tailwind-dark.css +0 -10
  46. package/styles/tailwind.css +0 -10
  47. package/.eslintrc.json +0 -260
  48. package/tslint.json +0 -111
@@ -190,6 +190,10 @@ function resetIncrementalSearchValues(elementId) {
190
190
  * @returns {void}
191
191
  */
192
192
  function highlightSearch(element, query, ignoreCase, type) {
193
+ var isHtmlElement = /<[^>]*>/g.test(element.innerText);
194
+ if (isHtmlElement) {
195
+ element.innerText = element.innerText.replace(/[\u00A0-\u9999<>&]/g, function (match) { return "&#" + match.charCodeAt(0) + ";"; });
196
+ }
193
197
  if (query === '') {
194
198
  return;
195
199
  }
@@ -471,10 +475,8 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
471
475
  this.parent.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList);
472
476
  }
473
477
  var query = this.parent.getForQuery(this.parent.value).clone();
474
- if (!this.parent.allowFiltering) { //need to check with allowFiltering false
475
- var skipvalue = this.parent.viewPortInfo.startIndex - this.parent.value.length >= 0 ? this.parent.viewPortInfo.startIndex - this.parent.value.length : 0;
476
- query = query.skip(skipvalue);
477
- }
478
+ var skipvalue = this.parent.viewPortInfo.startIndex - this.parent.value.length >= 0 ? this.parent.viewPortInfo.startIndex - this.parent.value.length : 0;
479
+ query = query.skip(skipvalue);
478
480
  this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
479
481
  isListUpdated = false;
480
482
  }
@@ -640,7 +642,9 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
640
642
  if (this.parent.keyboardEvent != null) {
641
643
  this.parent.handleVirtualKeyboardActions(this.parent.keyboardEvent, this.parent.pageCount);
642
644
  }
643
- this.parent.isCustomFilter = false;
645
+ if (!this.parent.customFilterQuery) {
646
+ this.parent.isCustomFilter = false;
647
+ }
644
648
  return [2 /*return*/];
645
649
  }
646
650
  });
@@ -902,6 +906,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
902
906
  _this.incrementalPreQueryString = '';
903
907
  _this.isObjectCustomValue = false;
904
908
  _this.appendUncheckList = false;
909
+ _this.getInitialData = false;
910
+ _this.preventPopupOpen = true;
911
+ _this.customFilterQuery = new Query();
905
912
  _this.virtualListInfo = {
906
913
  currentPageNumber: null,
907
914
  direction: null,
@@ -1216,6 +1223,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1216
1223
  var actualCount = this.virtualListHeight > 0 ? Math.floor(this.virtualListHeight / this.listItemHeight) : 0;
1217
1224
  this.skeletonCount = actualCount * 2 < this.itemCount ? this.itemCount : actualCount * 2;
1218
1225
  this.itemCount = retainSkeleton ? this.itemCount : this.skeletonCount;
1226
+ this.virtualItemCount = this.itemCount;
1219
1227
  this.skeletonCount = Math.floor(this.skeletonCount / 2) + 2;
1220
1228
  };
1221
1229
  DropDownBase.prototype.GetVirtualTrackHeight = function () {
@@ -1309,6 +1317,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1309
1317
  */
1310
1318
  DropDownBase.prototype.initialize = function (e) {
1311
1319
  this.bindEvent = true;
1320
+ this.preventPopupOpen = true;
1312
1321
  this.actionFailureTemplateId = "" + this.element.id + ACTIONFAILURETEMPLATE_PROPERTY;
1313
1322
  if (this.element.tagName === 'UL') {
1314
1323
  var jsonElement = ListBase.createJsonFromElement(this.element);
@@ -1494,6 +1503,12 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1494
1503
  }
1495
1504
  _this.isRequested = false;
1496
1505
  _this.bindChildItems(listItems, ulElement, fields, e);
1506
+ if (_this.getInitialData) {
1507
+ _this.setListData(dataSource, fields, query, event);
1508
+ _this.getInitialData = false;
1509
+ _this.preventPopupOpen = false;
1510
+ return;
1511
+ }
1497
1512
  }
1498
1513
  });
1499
1514
  }).catch(function (e) {
@@ -1565,6 +1580,11 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1565
1580
  _this.renderGroupTemplate(ulElement);
1566
1581
  }
1567
1582
  _this.bindChildItems(localDataArgs.result, ulElement, fields);
1583
+ if (_this.getInitialData) {
1584
+ _this.getInitialData = false;
1585
+ _this.preventPopupOpen = false;
1586
+ return;
1587
+ }
1568
1588
  setTimeout(function () {
1569
1589
  if (_this.getModuleName() === 'multiselect' && _this.itemTemplate != null && (ulElement.childElementCount > 0 && (ulElement.children[0].childElementCount > 0 || (_this.fields.groupBy && ulElement.children[1] && ulElement.children[1].childElementCount > 0)))) {
1570
1590
  _this.updateDataList();
@@ -1666,7 +1686,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1666
1686
  DropDownBase.prototype.onActionComplete = function (ulElement, list, e) {
1667
1687
  /* eslint-enable @typescript-eslint/no-unused-vars */
1668
1688
  this.listData = list;
1669
- if (this.isVirtualizationEnabled && !this.isCustomDataUpdated) {
1689
+ if (this.isVirtualizationEnabled && !this.isCustomDataUpdated && !this.virtualSelectAll) {
1670
1690
  this.notify("setGeneratedData", {
1671
1691
  module: "VirtualScroll",
1672
1692
  });
@@ -1888,6 +1908,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1888
1908
  this.fixedHeaderElement.style.display = 'block';
1889
1909
  };
1890
1910
  DropDownBase.prototype.getValidLi = function () {
1911
+ if (this.isVirtualizationEnabled) {
1912
+ return this.liCollections[0].classList.contains('e-virtual-list') ? this.liCollections[this.skeletonCount] : this.liCollections[0];
1913
+ }
1891
1914
  return this.liCollections[0];
1892
1915
  };
1893
1916
  /**
@@ -1962,7 +1985,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1962
1985
  }
1963
1986
  this.updateListElements(listData);
1964
1987
  }
1965
- else if ((!virtualUlElement)) {
1988
+ else if ((!virtualUlElement) || (!virtualUlElement.firstChild)) {
1966
1989
  this.list.innerHTML = '';
1967
1990
  this.createVirtualContent();
1968
1991
  this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
@@ -2307,6 +2330,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2307
2330
  }
2308
2331
  }
2309
2332
  var itemsCount = this.getItems().length;
2333
+ var isListboxEmpty = itemsCount === 0;
2310
2334
  var selectedItemValue = this.list.querySelector('.' + dropDownBaseClasses.selected);
2311
2335
  items = (items instanceof Array ? items : [items]);
2312
2336
  var index;
@@ -2341,11 +2365,24 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2341
2365
  li.setAttribute('role', 'option');
2342
2366
  this.notify('addItem', { module: 'CheckBoxSelection', item: li });
2343
2367
  liCollections.push(li);
2344
- this.listData.push(item);
2368
+ if (this.getModuleName() === 'listbox') {
2369
+ this.listData.splice(isListboxEmpty ? this.listData.length : index, 0, item);
2370
+ if (this.listData.length !== this.sortedData.length) {
2371
+ this.sortedData = this.listData;
2372
+ }
2373
+ }
2374
+ else {
2375
+ this.listData.push(item);
2376
+ }
2345
2377
  if (this.sortOrder === 'None' && isNullOrUndefined(itemIndex) && index === 0) {
2346
2378
  index = null;
2347
2379
  }
2348
- this.updateActionCompleteData(li, item, index);
2380
+ if (this.getModuleName() === 'listbox') {
2381
+ this.updateActionCompleteData(li, item, isListboxEmpty ? null : index);
2382
+ }
2383
+ else {
2384
+ this.updateActionCompleteData(li, item, index);
2385
+ }
2349
2386
  //Listbox event
2350
2387
  this.trigger('beforeItemRender', { element: li, item: item });
2351
2388
  }
@@ -4232,6 +4269,10 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4232
4269
  e.preventDefault();
4233
4270
  break;
4234
4271
  default:
4272
+ if (this.isFiltering() && this.getModuleName() === 'combobox' && isNullOrUndefined(this.list)) {
4273
+ this.getInitialData = true;
4274
+ this.renderList();
4275
+ }
4235
4276
  this.typedString = this.filterInput.value;
4236
4277
  this.preventAutoFill = false;
4237
4278
  this.searchLists(e);
@@ -4280,13 +4321,13 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4280
4321
  if (!(this.dataSource instanceof DataManager) && dataType === 'string' || dataType === 'number') {
4281
4322
  filterQuery.where('', filterType, this.typedString, this.ignoreCase, this.ignoreAccent);
4282
4323
  }
4283
- else {
4324
+ else if (((this.getModuleName() !== 'combobox') || this.enableVirtualization) || (this.isFiltering() && this.getModuleName() === 'combobox' && this.typedString !== '')) {
4284
4325
  var fields = (this.fields.text) ? this.fields.text : '';
4285
4326
  filterQuery.where(fields, filterType, this.typedString, this.ignoreCase, this.ignoreAccent);
4286
4327
  }
4287
4328
  }
4288
4329
  else {
4289
- filterQuery = query ? query.clone() : this.query ? this.query.clone() : new Query();
4330
+ filterQuery = (this.enableVirtualization && !isNullOrUndefined(this.customFilterQuery)) ? this.customFilterQuery.clone() : query ? query.clone() : this.query ? this.query.clone() : new Query();
4290
4331
  }
4291
4332
  if (this.enableVirtualization && (this.viewPortInfo.endIndex != 0) && (!(this.dataSource instanceof DataManager) || (this.dataSource instanceof DataManager && this.virtualGroupDataSource))) {
4292
4333
  var takeValue = this.getTakeValue();
@@ -4301,26 +4342,36 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4301
4342
  }
4302
4343
  var queryTakeValue = 0;
4303
4344
  var querySkipValue = 0;
4304
- if (this.query && this.query.queries.length > 0) {
4305
- for (var queryElements_1 = 0; queryElements_1 < this.query.queries.length; queryElements_1++) {
4306
- if (this.query.queries[queryElements_1].fn === 'onSkip') {
4307
- querySkipValue = this.query.queries[queryElements_1].e.nos;
4345
+ if (filterQuery && filterQuery.queries.length > 0) {
4346
+ for (var queryElements_1 = 0; queryElements_1 < filterQuery.queries.length; queryElements_1++) {
4347
+ if (filterQuery.queries[queryElements_1].fn === 'onSkip') {
4348
+ querySkipValue = filterQuery.queries[queryElements_1].e.nos;
4308
4349
  }
4309
- if (this.query.queries[queryElements_1].fn === 'onTake') {
4310
- queryTakeValue = takeValue <= this.query.queries[queryElements_1].e.nos ? this.query.queries[queryElements_1].e.nos : takeValue;
4350
+ if (filterQuery.queries[queryElements_1].fn === 'onTake') {
4351
+ queryTakeValue = takeValue <= filterQuery.queries[queryElements_1].e.nos ? filterQuery.queries[queryElements_1].e.nos : takeValue;
4352
+ }
4353
+ }
4354
+ }
4355
+ if (queryTakeValue <= 0 && this.query && this.query.queries.length > 0) {
4356
+ for (var queryElements_2 = 0; queryElements_2 < this.query.queries.length; queryElements_2++) {
4357
+ if (this.query.queries[queryElements_2].fn === 'onTake') {
4358
+ queryTakeValue = takeValue <= this.query.queries[queryElements_2].e.nos ? this.query.queries[queryElements_2].e.nos : takeValue;
4311
4359
  }
4312
4360
  }
4313
4361
  }
4314
4362
  var skipExists = false;
4315
- var takeExists = false;
4316
4363
  if (filterQuery && filterQuery.queries.length > 0) {
4317
- for (var queryElements_2 = 0; queryElements_2 < filterQuery.queries.length; queryElements_2++) {
4318
- if (filterQuery.queries[queryElements_2].fn === 'onSkip') {
4319
- skipExists = true;
4364
+ for (var queryElements_3 = 0; queryElements_3 < filterQuery.queries.length; queryElements_3++) {
4365
+ if (filterQuery.queries[queryElements_3].fn === 'onSkip') {
4366
+ querySkipValue = filterQuery.queries[queryElements_3].e.nos;
4367
+ filterQuery.queries.splice(queryElements_3, 1);
4368
+ --queryElements_3;
4369
+ continue;
4320
4370
  }
4321
- if (filterQuery.queries[queryElements_2].fn === 'onTake') {
4322
- takeExists = true;
4323
- filterQuery.queries[queryElements_2].e.nos = filterQuery.queries[queryElements_2].e.nos <= queryTakeValue ? queryTakeValue : filterQuery.queries[queryElements_2].e.nos;
4371
+ if (filterQuery.queries[queryElements_3].fn === 'onTake') {
4372
+ queryTakeValue = filterQuery.queries[queryElements_3].e.nos <= queryTakeValue ? queryTakeValue : filterQuery.queries[queryElements_3].e.nos;
4373
+ filterQuery.queries.splice(queryElements_3, 1);
4374
+ --queryElements_3;
4324
4375
  }
4325
4376
  }
4326
4377
  }
@@ -4336,17 +4387,23 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4336
4387
  filterQuery.take(this.incrementalEndIndex);
4337
4388
  }
4338
4389
  else {
4339
- if (!takeExists) {
4340
- if (queryTakeValue > 0) {
4341
- filterQuery.take(queryTakeValue);
4342
- }
4343
- else {
4344
- filterQuery.take(takeValue);
4345
- }
4390
+ if (queryTakeValue > 0) {
4391
+ filterQuery.take(queryTakeValue);
4392
+ }
4393
+ else {
4394
+ filterQuery.take(takeValue);
4346
4395
  }
4347
4396
  }
4348
4397
  filterQuery.requiresCount();
4349
4398
  }
4399
+ else if (this.enableVirtualization && (this.dataSource instanceof DataManager && !this.virtualGroupDataSource)) {
4400
+ for (var queryElements_4 = 0; queryElements_4 < filterQuery.queries.length; queryElements_4++) {
4401
+ if (filterQuery.queries[queryElements_4].fn === 'onSkip' || filterQuery.queries[queryElements_4].fn === 'onTake') {
4402
+ filterQuery.queries.splice(queryElements_4, 1);
4403
+ --queryElements_4;
4404
+ }
4405
+ }
4406
+ }
4350
4407
  return filterQuery;
4351
4408
  };
4352
4409
  DropDownList.prototype.getSelectionPoints = function () {
@@ -4373,6 +4430,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4373
4430
  return;
4374
4431
  }
4375
4432
  _this.isCustomFilter = true;
4433
+ _this.customFilterQuery = query;
4376
4434
  _this.filteringAction(dataSource, query, fields);
4377
4435
  },
4378
4436
  baseEventArgs: e,
@@ -4400,7 +4458,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4400
4458
  };
4401
4459
  DropDownList.prototype.filteringAction = function (dataSource, query, fields) {
4402
4460
  if (!isNullOrUndefined(this.filterInput)) {
4403
- this.beforePopupOpen = (!this.isPopupOpen && this.getModuleName() === 'combobox' && this.filterInput.value === '') ?
4461
+ this.beforePopupOpen = ((!this.isPopupOpen && this.getModuleName() === 'combobox' && this.filterInput.value === '') || this.getInitialData) ?
4404
4462
  false : true;
4405
4463
  var isNoData = this.list.classList.contains(dropDownBaseClasses.noData);
4406
4464
  if (this.filterInput.value.trim() === '' && !this.itemTemplate) {
@@ -4408,6 +4466,12 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4408
4466
  this.isTyped = false;
4409
4467
  if (!isNullOrUndefined(this.actionCompleteData.ulElement) && !isNullOrUndefined(this.actionCompleteData.list)) {
4410
4468
  if (this.enableVirtualization) {
4469
+ if (this.isFiltering()) {
4470
+ this.isPreventScrollAction = true;
4471
+ this.list.scrollTop = 0;
4472
+ this.previousStartIndex = 0;
4473
+ this.virtualListInfo = null;
4474
+ }
4411
4475
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
4412
4476
  this.totalItemCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;
4413
4477
  this.resetList(dataSource, fields, query);
@@ -4578,6 +4642,13 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4578
4642
  this.isNotSearchList = false;
4579
4643
  return;
4580
4644
  }
4645
+ if (this.getInitialData) {
4646
+ this.updateActionCompleteDataValues(ulElement, list);
4647
+ }
4648
+ if (!this.preventPopupOpen && this.getModuleName() === 'combobox') {
4649
+ this.beforePopupOpen = true;
4650
+ this.preventPopupOpen = true;
4651
+ }
4581
4652
  var tempItemCount = this.itemCount;
4582
4653
  if (this.isActive || !isNullOrUndefined(ulElement)) {
4583
4654
  var selectedItem = this.selectedLI ? this.selectedLI.cloneNode(true) : null;
@@ -4761,7 +4832,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4761
4832
  else {
4762
4833
  this.actionCompleteData.ulElement.appendChild(li.cloneNode(true));
4763
4834
  }
4764
- if (this.isFiltering() && this.actionCompleteData.list.indexOf(item) < 0) {
4835
+ if (this.isFiltering() && this.actionCompleteData.list && this.actionCompleteData.list.indexOf(item) < 0) {
4765
4836
  this.actionCompleteData.list.push(item);
4766
4837
  }
4767
4838
  };
@@ -4817,7 +4888,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4817
4888
  popupEle.setAttribute('aria-label', _this.element.id);
4818
4889
  popupEle.setAttribute('role', 'dialog');
4819
4890
  var searchBox = _this.setSearchBox(popupEle);
4820
- _this.listContainerHeight = formatUnit(_this.popupHeight);
4891
+ _this.listContainerHeight = _this.allowFiltering && _this.getModuleName() === 'dropdownlist' && Browser.isDevice ? formatUnit(Math.round(window.outerHeight).toString() + 'px') : formatUnit(_this.popupHeight);
4821
4892
  if (_this.headerTemplate) {
4822
4893
  _this.setHeaderTemplate(popupEle);
4823
4894
  }
@@ -4832,6 +4903,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4832
4903
  _this.listItemHeight = listitems.length > 0 ? Math.ceil(listitems[0].getBoundingClientRect().height) : 0;
4833
4904
  }
4834
4905
  if (_this.enableVirtualization && !_this.list.classList.contains(dropDownBaseClasses.noData)) {
4906
+ _this.getSkeletonCount();
4907
+ _this.skeletonCount = _this.totalItemCount < (_this.itemCount * 2) ? 0 : _this.skeletonCount;
4835
4908
  if (!_this.list.querySelector('.e-virtual-ddl-content')) {
4836
4909
  _this.list.appendChild(_this.createElement('div', {
4837
4910
  className: 'e-virtual-ddl-content',
@@ -5138,7 +5211,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5138
5211
  var inputWidth = this.inputWrapper.container.offsetWidth * parseFloat(width) / 100;
5139
5212
  width = inputWidth.toString() + 'px';
5140
5213
  }
5141
- if (Browser.isDevice && (!this.allowFiltering && (this.getModuleName() === 'dropdownlist' ||
5214
+ if (Browser.isDevice && (width.indexOf('px') > -1) && (!this.allowFiltering && (this.getModuleName() === 'dropdownlist' ||
5142
5215
  (this.isDropDownClick && this.getModuleName() === 'combobox')))) {
5143
5216
  var firstItem = this.isEmptyList() ? this.list : this.liCollections[0];
5144
5217
  width = (parseInt(width, 10) + (parseInt(getComputedStyle(firstItem).textIndent, 10) -
@@ -5442,7 +5515,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5442
5515
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
5443
5516
  dataSourceCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;
5444
5517
  }
5445
- if (this.enableVirtualization && this.isFiltering() && this.value != null && isFilterValue && this.totalItemCount !== dataSourceCount) {
5518
+ if (this.enableVirtualization && this.isFiltering() && isFilterValue && this.totalItemCount !== dataSourceCount) {
5446
5519
  this.updateInitialData();
5447
5520
  this.checkAndResetCache();
5448
5521
  }
@@ -5563,7 +5636,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5563
5636
  this.setFields();
5564
5637
  this.inputWrapper.container.style.width = formatUnit(this.width);
5565
5638
  this.inputWrapper.container.classList.add('e-ddl');
5566
- if (this.floatLabelType === 'Auto') {
5639
+ if (this.floatLabelType !== 'Never') {
5567
5640
  Input.calculateWidth(this.inputElement, this.inputWrapper.container);
5568
5641
  }
5569
5642
  if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && this.inputWrapper.container.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never') {
@@ -6213,6 +6286,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
6213
6286
  }
6214
6287
  }
6215
6288
  this.isVirtualTrackHeight = false;
6289
+ this.customFilterQuery = null;
6216
6290
  this.closePopup(0, e);
6217
6291
  var dataItem = this.getItemData();
6218
6292
  var isSelectVal = !isNullOrUndefined(this.selectedLI);
@@ -6250,7 +6324,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
6250
6324
  }
6251
6325
  addClass([this.inputWrapper.container], [dropDownListClasses.inputFocus]);
6252
6326
  this.onFocus(e);
6253
- if (this.floatLabelType === 'Auto') {
6327
+ if (this.floatLabelType !== 'Never') {
6254
6328
  Input.calculateWidth(this.inputElement, this.inputWrapper.container);
6255
6329
  }
6256
6330
  };
@@ -6272,7 +6346,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
6272
6346
  this.targetElement().blur();
6273
6347
  }
6274
6348
  removeClass([this.inputWrapper.container], [dropDownListClasses.inputFocus]);
6275
- if (this.floatLabelType === 'Auto' && this.inputElement.value === '') {
6349
+ if (this.floatLabelType !== 'Never') {
6276
6350
  Input.calculateWidth(this.inputElement, this.inputWrapper.container);
6277
6351
  }
6278
6352
  };
@@ -6323,17 +6397,18 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
6323
6397
  detach(this.inputWrapper.container);
6324
6398
  }
6325
6399
  this.hiddenElement = null;
6400
+ this.filterInput = null;
6326
6401
  this.inputWrapper = null;
6327
6402
  this.keyboardModule = null;
6328
6403
  this.ulElement = null;
6329
6404
  this.list = null;
6405
+ this.clearIconElement = null;
6330
6406
  this.popupObj = null;
6331
6407
  this.popupContentElement = null;
6332
6408
  this.rippleFun = null;
6333
6409
  this.selectedLI = null;
6334
6410
  this.liCollections = null;
6335
6411
  this.item = null;
6336
- this.inputWrapper = null;
6337
6412
  this.footer = null;
6338
6413
  this.header = null;
6339
6414
  this.previousSelectedLI = null;
@@ -6350,9 +6425,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
6350
6425
  floatLabelType: this.floatLabelType,
6351
6426
  properties: this.properties
6352
6427
  }, this.clearButton);
6353
- if (this.isAngular) {
6354
- this.inputElement = null;
6355
- }
6428
+ this.clearButton = null;
6429
+ this.inputElement = null;
6356
6430
  _super.prototype.destroy.call(this);
6357
6431
  };
6358
6432
  /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */
@@ -6878,7 +6952,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6878
6952
  cancel: false,
6879
6953
  preventDefaultAction: false,
6880
6954
  event: event,
6881
- text: value,
6955
+ text: value.trim(),
6882
6956
  fields: filterFields
6883
6957
  };
6884
6958
  this.trigger('filtering', args, function (args) {
@@ -6886,7 +6960,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6886
6960
  var flag = false;
6887
6961
  var fields = void 0;
6888
6962
  _this.isFilteredData = true;
6889
- if (value === '') {
6963
+ if (args.text === '') {
6890
6964
  _this.isFilteredData = false;
6891
6965
  _this.isFilterRestore = true;
6892
6966
  _this.isFromFilterChange = false;
@@ -6897,18 +6971,18 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
6897
6971
  }
6898
6972
  else {
6899
6973
  if (_this.treeDataType === 1) {
6900
- fields = _this.selfReferencefilter(value, args.fields);
6974
+ fields = _this.selfReferencefilter(args.text, args.fields);
6901
6975
  }
6902
6976
  else {
6903
6977
  if (_this.fields.dataSource instanceof DataManager) {
6904
- fields = _this.remoteDataFilter(value, args.fields);
6978
+ fields = _this.remoteDataFilter(args.text, args.fields);
6905
6979
  fields.child = _this.fields.child;
6906
6980
  _this.treeObj.fields = _this.getTreeFields(args.fields);
6907
6981
  _this.treeObj.dataBind();
6908
6982
  flag = true;
6909
6983
  }
6910
6984
  else {
6911
- fields = _this.nestedFilter(value, args.fields);
6985
+ fields = _this.nestedFilter(args.text, args.fields);
6912
6986
  }
6913
6987
  }
6914
6988
  }
@@ -7584,12 +7658,12 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
7584
7658
  DropDownTree.prototype.createHiddenElement = function () {
7585
7659
  if (this.allowMultiSelection || this.showCheckBox) {
7586
7660
  this.hiddenElement = this.createElement('select', {
7587
- attrs: { 'aria-hidden': 'true', 'class': HIDDENELEMENT, 'tabindex': '-1', 'multiple': '' }
7661
+ attrs: { 'aria-hidden': 'true', 'class': HIDDENELEMENT, 'tabindex': '-1', 'multiple': '', 'aria-label': this.getModuleName() }
7588
7662
  });
7589
7663
  }
7590
7664
  else {
7591
7665
  this.hiddenElement = this.createElement('select', {
7592
- attrs: { 'aria-hidden': 'true', 'tabindex': '-1', 'class': HIDDENELEMENT }
7666
+ attrs: { 'aria-hidden': 'true', 'tabindex': '-1', 'class': HIDDENELEMENT, 'aria-label': this.getModuleName() }
7593
7667
  });
7594
7668
  }
7595
7669
  prepend([this.hiddenElement], this.inputWrapper);
@@ -7734,9 +7808,11 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
7734
7808
  };
7735
7809
  DropDownTree.prototype.setAttributes = function () {
7736
7810
  this.inputEle.setAttribute('tabindex', '-1');
7811
+ this.inputEle.setAttribute('aria-label', this.getModuleName());
7737
7812
  var id = this.element.getAttribute('id');
7738
7813
  this.hiddenElement.id = id + '_hidden';
7739
7814
  this.inputWrapper.setAttribute('tabindex', '0');
7815
+ this.inputWrapper.setAttribute('aria-label', this.getModuleName());
7740
7816
  attributes(this.inputWrapper, this.getAriaAttributes());
7741
7817
  };
7742
7818
  DropDownTree.prototype.setHTMLAttributes = function () {
@@ -8081,7 +8157,12 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
8081
8157
  focusedElement.setAttribute('tabindex', '0');
8082
8158
  }
8083
8159
  else {
8084
- focusedElement = _this.treeObj.element.querySelector('li');
8160
+ var oldFocussedNode = _this.treeObj.element.querySelector('.e-node-focus');
8161
+ focusedElement = _this.treeObj.element.querySelector('li:not(.e-disable):not(.e-prevent)');
8162
+ if (oldFocussedNode && oldFocussedNode != focusedElement) {
8163
+ oldFocussedNode.setAttribute('tabindex', '-1');
8164
+ removeClass([oldFocussedNode], 'e-node-focus');
8165
+ }
8085
8166
  }
8086
8167
  focusedElement.focus();
8087
8168
  addClass([focusedElement], ['e-node-focus']);
@@ -8929,7 +9010,12 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
8929
9010
  };
8930
9011
  DropDownTree.prototype.setFooterTemplate = function () {
8931
9012
  if (this.footer) {
8932
- this.footer.innerHTML = '';
9013
+ if (this.isReact && typeof this.footerTemplate === 'function') {
9014
+ this.clearTemplate(['footerTemplate']);
9015
+ }
9016
+ else {
9017
+ this.footer.innerHTML = '';
9018
+ }
8933
9019
  }
8934
9020
  else {
8935
9021
  this.footer = this.createElement('div');
@@ -10273,7 +10359,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
10273
10359
  this.preventAutoFill = this.inputElement.value === '' ? false : this.preventAutoFill;
10274
10360
  this.setAutoFill(activeElement, isKeyNavigate);
10275
10361
  }
10276
- else if (this.inputElement.value === '') {
10362
+ else if (!isNullOrUndefined(this.inputElement) && this.inputElement.value === '') {
10277
10363
  this.activeIndex = null;
10278
10364
  if (!isNullOrUndefined(this.list)) {
10279
10365
  if (!this.enableVirtualization) {
@@ -10530,9 +10616,6 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
10530
10616
  ComboBox.prototype.render = function () {
10531
10617
  _super.prototype.render.call(this);
10532
10618
  this.setSearchBox();
10533
- if (this.isFiltering() && this.getModuleName() === 'combobox' && isNullOrUndefined(this.list)) {
10534
- _super.prototype.renderList.call(this);
10535
- }
10536
10619
  this.renderComplete();
10537
10620
  };
10538
10621
  /**
@@ -10846,7 +10929,12 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
10846
10929
  var filterType = (this.queryString === '' && !isNullOrUndefined(value)) ? 'equal' : this.filterType;
10847
10930
  var queryString = (this.queryString === '' && !isNullOrUndefined(value)) ? value : this.queryString;
10848
10931
  if (this.isFiltered) {
10849
- return filterQuery;
10932
+ if ((this.enableVirtualization && !isNullOrUndefined(this.customFilterQuery))) {
10933
+ filterQuery = this.customFilterQuery.clone();
10934
+ }
10935
+ else if (!this.enableVirtualization) {
10936
+ return filterQuery;
10937
+ }
10850
10938
  }
10851
10939
  if (this.queryString !== null && this.queryString !== '') {
10852
10940
  var dataType = this.typeOfData(this.dataSource).typeof;
@@ -10872,48 +10960,61 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
10872
10960
  if (this.enableVirtualization && (!(this.dataSource instanceof DataManager) || (this.dataSource instanceof DataManager && this.virtualGroupDataSource))) {
10873
10961
  var queryTakeValue = 0;
10874
10962
  var querySkipValue = 0;
10875
- if (this.query && this.query.queries.length > 0) {
10876
- for (var queryElements = 0; queryElements < this.query.queries.length; queryElements++) {
10877
- if (this.query.queries[queryElements].fn === 'onSkip') {
10878
- querySkipValue = this.query.queries[queryElements].e.nos;
10963
+ var takeValue = this.getTakeValue();
10964
+ if (filterQuery && filterQuery.queries.length > 0) {
10965
+ for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
10966
+ if (filterQuery.queries[queryElements].fn === 'onSkip') {
10967
+ querySkipValue = filterQuery.queries[queryElements].e.nos;
10879
10968
  }
10969
+ if (filterQuery.queries[queryElements].fn === 'onTake') {
10970
+ queryTakeValue = takeValue <= filterQuery.queries[queryElements].e.nos ? filterQuery.queries[queryElements].e.nos : takeValue;
10971
+ }
10972
+ }
10973
+ }
10974
+ if (queryTakeValue <= 0 && this.query && this.query.queries.length > 0) {
10975
+ for (var queryElements = 0; queryElements < this.query.queries.length; queryElements++) {
10880
10976
  if (this.query.queries[queryElements].fn === 'onTake') {
10881
10977
  queryTakeValue = takeValue <= this.query.queries[queryElements].e.nos ? this.query.queries[queryElements].e.nos : takeValue;
10882
10978
  }
10883
10979
  }
10884
10980
  }
10885
- var skipExists = false;
10886
- var takeExists = false;
10887
10981
  if (filterQuery && filterQuery.queries.length > 0) {
10888
10982
  for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
10889
10983
  if (filterQuery.queries[queryElements].fn === 'onSkip') {
10890
- skipExists = true;
10984
+ querySkipValue = filterQuery.queries[queryElements].e.nos;
10985
+ filterQuery.queries.splice(queryElements, 1);
10986
+ --queryElements;
10987
+ continue;
10891
10988
  }
10892
10989
  if (filterQuery.queries[queryElements].fn === 'onTake') {
10893
- takeExists = true;
10894
- filterQuery.queries[queryElements].e.nos = filterQuery.queries[queryElements].e.nos <= queryTakeValue ? queryTakeValue : filterQuery.queries[queryElements].e.nos;
10990
+ queryTakeValue = filterQuery.queries[queryElements].e.nos <= queryTakeValue ? queryTakeValue : filterQuery.queries[queryElements].e.nos;
10991
+ filterQuery.queries.splice(queryElements, 1);
10992
+ --queryElements;
10895
10993
  }
10896
10994
  }
10897
10995
  }
10898
- var takeValue = this.getTakeValue();
10899
- if (!skipExists) {
10900
- if (querySkipValue > 0 && this.virtualItemStartIndex <= querySkipValue) {
10901
- filterQuery.skip(querySkipValue);
10902
- }
10903
- else {
10904
- filterQuery.skip(this.virtualItemStartIndex);
10905
- }
10996
+ if (querySkipValue > 0 && this.virtualItemStartIndex <= querySkipValue) {
10997
+ filterQuery.skip(querySkipValue);
10906
10998
  }
10907
- if (!takeExists) {
10908
- if (queryTakeValue > 0 && takeValue <= queryTakeValue) {
10909
- filterQuery.take(queryTakeValue);
10910
- }
10911
- else {
10912
- filterQuery.take(takeValue);
10913
- }
10999
+ else {
11000
+ filterQuery.skip(this.virtualItemStartIndex);
11001
+ }
11002
+ if (queryTakeValue > 0 && takeValue <= queryTakeValue) {
11003
+ filterQuery.take(queryTakeValue);
11004
+ }
11005
+ else {
11006
+ filterQuery.take(takeValue);
10914
11007
  }
10915
11008
  filterQuery.requiresCount();
10916
11009
  }
11010
+ else if (this.enableVirtualization && (this.dataSource instanceof DataManager && !this.virtualGroupDataSource)) {
11011
+ for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
11012
+ if (filterQuery.queries[queryElements].fn === 'onSkip' || filterQuery.queries[queryElements].fn === 'onTake') {
11013
+ filterQuery.queries.splice(queryElements, 1);
11014
+ --queryElements;
11015
+ }
11016
+ }
11017
+ }
10917
11018
  return filterQuery;
10918
11019
  };
10919
11020
  AutoComplete.prototype.searchLists = function (e) {
@@ -10942,6 +11043,7 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
10942
11043
  return;
10943
11044
  }
10944
11045
  _this_1.isFiltered = true;
11046
+ _this_1.customFilterQuery = query;
10945
11047
  _this_1.filterAction(dataSource, query, fields);
10946
11048
  },
10947
11049
  cancel: false
@@ -11072,10 +11174,6 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
11072
11174
  }, 0);
11073
11175
  }
11074
11176
  else {
11075
- var isHtmlElement = /<[^>]*>/g.test(e.item.innerText);
11076
- if (isHtmlElement) {
11077
- e.item.innerText = e.item.innerText.replace(/[\u00A0-\u9999<>&]/g, function (match) { return "&#" + match.charCodeAt(0) + ";"; });
11078
- }
11079
11177
  highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);
11080
11178
  }
11081
11179
  }
@@ -11224,6 +11322,7 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
11224
11322
  revertHighlightSearch(this.liCollections[i]);
11225
11323
  highlightSearch(this.liCollections[i], this.queryString, this.ignoreCase, this.filterType);
11226
11324
  }
11325
+ isHighlight = null;
11227
11326
  }
11228
11327
  }
11229
11328
  };
@@ -11715,7 +11814,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11715
11814
  attributes(_this.inputElement, { 'aria-expanded': 'true', 'aria-owns': _this.element.id + '_popup', 'aria-controls': _this.element.id });
11716
11815
  _this.updateAriaActiveDescendant();
11717
11816
  if (_this.isFirstClick) {
11718
- if (_this.enableVirtualization && _this.mode === 'CheckBox' && _this.value) {
11817
+ if (_this.enableVirtualization && _this.mode === 'CheckBox' && _this.value && _this.enableSelectionOrder) {
11719
11818
  _this.updateVirtualReOrderList();
11720
11819
  }
11721
11820
  _this.loadTemplate();
@@ -11785,9 +11884,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11785
11884
  }
11786
11885
  if (this.enableVirtualization) {
11787
11886
  var focusedItem = this.list.querySelector('.' + dropDownBaseClasses.focus);
11788
- if (focusedItem) {
11789
- this.scrollBottom(focusedItem);
11790
- }
11887
+ this.scrollBottom(focusedItem);
11791
11888
  }
11792
11889
  };
11793
11890
  MultiSelect.prototype.focusAtFirstListItem = function () {
@@ -12158,7 +12255,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12158
12255
  && (this.mode === 'CheckBox' && this.showSelectAll))) || (this.enableVirtualization && this.mode === 'CheckBox' && this.showSelectAll && this.virtualSelectAll && this.value && this.value.length === this.totalItemCount)) {
12159
12256
  this.notify('checkSelectAll', { module: 'CheckBoxSelection', enable: this.mode === 'CheckBox', value: 'check' });
12160
12257
  }
12161
- else if ((searchCount !== searchActiveCount) && (this.mode === 'CheckBox' && this.showSelectAll)) {
12258
+ else if ((searchCount !== searchActiveCount) && (this.mode === 'CheckBox' && this.showSelectAll) && ((!this.enableVirtualization) || (this.enableVirtualization && !this.virtualSelectAll))) {
12162
12259
  this.notify('checkSelectAll', { module: 'CheckBoxSelection', enable: this.mode === 'CheckBox', value: 'uncheck' });
12163
12260
  }
12164
12261
  if (this.enableGroupCheckBox && this.fields.groupBy && !this.enableSelectionOrder) {
@@ -12219,7 +12316,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12219
12316
  MultiSelect.prototype.getQuery = function (query) {
12220
12317
  var filterQuery = query ? query.clone() : this.query ? this.query.clone() : new Query();
12221
12318
  if (this.isFiltered) {
12222
- return filterQuery;
12319
+ if ((this.enableVirtualization && !isNullOrUndefined(this.customFilterQuery))) {
12320
+ filterQuery = this.customFilterQuery.clone();
12321
+ }
12322
+ else if (!this.enableVirtualization) {
12323
+ return filterQuery;
12324
+ }
12223
12325
  }
12224
12326
  if (this.filterAction) {
12225
12327
  if ((this.targetElement() !== null && !this.enableVirtualization) || (this.enableVirtualization && this.targetElement() !== null && this.targetElement().trim() !== '')) {
@@ -12241,6 +12343,15 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12241
12343
  if (this.enableVirtualization && (this.viewPortInfo.endIndex != 0) && !this.virtualSelectAll && (!(this.dataSource instanceof DataManager) || (this.dataSource instanceof DataManager && this.virtualGroupDataSource))) {
12242
12344
  return this.virtualFilterQuery(filterQuery);
12243
12345
  }
12346
+ else if (this.enableVirtualization && (this.dataSource instanceof DataManager && !this.virtualGroupDataSource)) {
12347
+ for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
12348
+ if (filterQuery.queries[queryElements].fn === 'onSkip' || filterQuery.queries[queryElements].fn === 'onTake') {
12349
+ filterQuery.queries.splice(queryElements, 1);
12350
+ --queryElements;
12351
+ }
12352
+ }
12353
+ return filterQuery;
12354
+ }
12244
12355
  return query ? query : this.query ? this.query : new Query();
12245
12356
  }
12246
12357
  };
@@ -12248,7 +12359,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12248
12359
  var takeValue = this.getTakeValue();
12249
12360
  var isReOrder = true;
12250
12361
  var isSkip = true;
12251
- var isTake = true;
12252
12362
  for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
12253
12363
  if (this.getModuleName() === 'multiselect' && ((filterQuery.queries[queryElements].e && filterQuery.queries[queryElements].e.condition == 'or') || (filterQuery.queries[queryElements].e && filterQuery.queries[queryElements].e.operator == 'equal'))) {
12254
12364
  isReOrder = false;
@@ -12257,7 +12367,31 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12257
12367
  isSkip = false;
12258
12368
  }
12259
12369
  if (filterQuery.queries[queryElements].fn === 'onTake') {
12260
- isTake = false;
12370
+
12371
+ }
12372
+ }
12373
+ var queryTakeValue = 0;
12374
+ if (filterQuery && filterQuery.queries.length > 0) {
12375
+ for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
12376
+ if (filterQuery.queries[queryElements].fn === 'onTake') {
12377
+ queryTakeValue = takeValue <= filterQuery.queries[queryElements].e.nos ? filterQuery.queries[queryElements].e.nos : takeValue;
12378
+ }
12379
+ }
12380
+ }
12381
+ if (queryTakeValue <= 0 && this.query && this.query.queries.length > 0) {
12382
+ for (var queryElements = 0; queryElements < this.query.queries.length; queryElements++) {
12383
+ if (this.query.queries[queryElements].fn === 'onTake') {
12384
+ queryTakeValue = takeValue <= this.query.queries[queryElements].e.nos ? this.query.queries[queryElements].e.nos : takeValue;
12385
+ }
12386
+ }
12387
+ }
12388
+ if (filterQuery && filterQuery.queries.length > 0) {
12389
+ for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {
12390
+ if (filterQuery.queries[queryElements].fn === 'onTake') {
12391
+ queryTakeValue = filterQuery.queries[queryElements].e.nos <= queryTakeValue ? queryTakeValue : filterQuery.queries[queryElements].e.nos;
12392
+ filterQuery.queries.splice(queryElements, 1);
12393
+ --queryElements;
12394
+ }
12261
12395
  }
12262
12396
  }
12263
12397
  if ((this.allowFiltering && isSkip) || !isReOrder || (!this.allowFiltering && isSkip)) {
@@ -12268,13 +12402,14 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12268
12402
  filterQuery.skip(this.virtualItemStartIndex);
12269
12403
  }
12270
12404
  }
12271
- if (isTake) {
12272
- if (this.isIncrementalRequest) {
12273
- filterQuery.take(this.incrementalEndIndex);
12274
- }
12275
- else {
12276
- filterQuery.take(takeValue);
12277
- }
12405
+ if (this.isIncrementalRequest) {
12406
+ filterQuery.take(this.incrementalEndIndex);
12407
+ }
12408
+ else if (queryTakeValue > 0) {
12409
+ filterQuery.take(queryTakeValue);
12410
+ }
12411
+ else {
12412
+ filterQuery.take(takeValue);
12278
12413
  }
12279
12414
  filterQuery.requiresCount();
12280
12415
  return filterQuery;
@@ -12597,7 +12732,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12597
12732
  parseInt(getComputedStyle(this.dropIcon).marginRight);
12598
12733
  elementWidth = this.overAllWrapper.clientWidth - (downIconWidth + 2 * (parseInt(getComputedStyle(this.inputElement).paddingRight)));
12599
12734
  }
12600
- if (this.floatLabelType === 'Auto') {
12735
+ if (this.floatLabelType !== 'Never') {
12601
12736
  Input.calculateWidth(elementWidth, this.overAllWrapper, this.getModuleName());
12602
12737
  }
12603
12738
  }
@@ -13849,7 +13984,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13849
13984
  var currentText = [];
13850
13985
  var value_1 = this.allowObjectBinding ? getValue(((this.fields.value) ? this.fields.value : ''), this.value[this.value.length - 1]) : this.value[this.value.length - 1];
13851
13986
  temp = this.getTextByValue(value_1);
13852
- var textValues = this.text != null ? this.text + ',' + temp : temp;
13987
+ var textValues = this.text != null && this.text != "" ? this.text + ',' + temp : temp;
13853
13988
  currentText.push(textValues);
13854
13989
  this.setProperties({ text: currentText.toString() }, true);
13855
13990
  }
@@ -14221,6 +14356,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14221
14356
  }
14222
14357
  }
14223
14358
  });
14359
+ this.checkCollision(this.popupWrapper);
14224
14360
  this.popupContentElement = this.popupObj.element.querySelector('.e-content');
14225
14361
  if (this.mode === 'CheckBox' && Browser.isDevice && this.allowFiltering) {
14226
14362
  this.notify('deviceSearchBox', { module: 'CheckBoxSelection', enable: this.mode === 'CheckBox' });
@@ -14230,6 +14366,15 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14230
14366
  }
14231
14367
  }
14232
14368
  };
14369
+ MultiSelect.prototype.checkCollision = function (popupEle) {
14370
+ if (!(this.mode === 'CheckBox' && Browser.isDevice && this.allowFiltering)) {
14371
+ var collision = isCollide(popupEle);
14372
+ if (collision.length > 0) {
14373
+ popupEle.style.marginTop = -parseInt(getComputedStyle(popupEle).marginTop, 10) + 'px';
14374
+ }
14375
+ this.popupObj.resolveCollision();
14376
+ }
14377
+ };
14233
14378
  MultiSelect.prototype.setHeaderTemplate = function () {
14234
14379
  var compiledString;
14235
14380
  if (this.header) {
@@ -14493,6 +14638,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14493
14638
  return;
14494
14639
  }
14495
14640
  _this.isFiltered = true;
14641
+ _this.customFilterQuery = query;
14496
14642
  _this.remoteFilterAction = true;
14497
14643
  _this.dataUpdater(dataSource, query, fields);
14498
14644
  },
@@ -14781,7 +14927,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14781
14927
  (element && (element.getAttribute('aria-selected') === 'true' && this.hideSelectedItem) &&
14782
14928
  (this.mode === 'Box' || this.mode === 'Default'))) || (this.enableVirtualization && value != null && text != null && !isCustomData)) {
14783
14929
  var currentText = [];
14784
- var textValues = this.text != null ? this.text + ',' + text : text;
14930
+ var textValues = this.text != null && this.text != "" ? this.text + ',' + text : text;
14785
14931
  currentText.push(textValues);
14786
14932
  this.setProperties({ text: currentText.toString() }, true);
14787
14933
  this.addChip(text, value);
@@ -14809,7 +14955,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14809
14955
  this.wireListEvents();
14810
14956
  }
14811
14957
  var currentText = [];
14812
- var textValues = this.text != null ? this.text + ',' + text : text;
14958
+ var textValues = this.text != null && this.text != "" ? this.text + ',' + text : text;
14813
14959
  currentText.push(textValues);
14814
14960
  this.setProperties({ text: currentText.toString() }, true);
14815
14961
  this.addChip(text, value);
@@ -15679,7 +15825,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
15679
15825
  if (this.enableVirtualization) {
15680
15826
  if (state) {
15681
15827
  this.virtualSelectAll = true;
15682
- this.resetList(this.dataSource, this.fields, new Query().skip(this.viewPortInfo.startIndex));
15828
+ this.resetList(this.dataSource, this.fields, new Query());
15683
15829
  if (this.virtualSelectAllData instanceof Array) {
15684
15830
  for (var i = 0; i < this.virtualSelectAllData.length; i++) {
15685
15831
  if (li[this.skeletonCount + i]) {
@@ -15749,8 +15895,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
15749
15895
  }
15750
15896
  this.value = [];
15751
15897
  this.virtualSelectAll = false;
15752
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
15753
- var ulElement = this.renderItems(this.listData, this.fields);
15898
+ if (!isNullOrUndefined(this.viewPortInfo.startIndex) && !isNullOrUndefined(this.viewPortInfo.endIndex)) {
15899
+ this.notify("setCurrentViewDataAsync", {
15900
+ component: this.getModuleName(),
15901
+ module: "VirtualScroll",
15902
+ });
15903
+ }
15754
15904
  }
15755
15905
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
15756
15906
  var virtualTrackElement = this.list.getElementsByClassName('e-virtual-ddl')[0];
@@ -16239,6 +16389,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16239
16389
  duration: 100,
16240
16390
  delay: delay ? delay : 0
16241
16391
  };
16392
+ this.customFilterQuery = null;
16242
16393
  var eventArgs = { popup: this.popupObj, cancel: false, animation: animModel, event: e || null };
16243
16394
  this.trigger('close', eventArgs, function (eventArgs) {
16244
16395
  if (!eventArgs.cancel) {
@@ -16261,7 +16412,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16261
16412
  if (_this.mode === 'CheckBox' && _this.showSelectAll) {
16262
16413
  EventHandler.remove(_this.popupObj.element, 'click', _this.clickHandler);
16263
16414
  }
16264
- if (_this.enableVirtualization && _this.mode === 'CheckBox') {
16415
+ if (_this.enableVirtualization && _this.mode === 'CheckBox' && _this.enableSelectionOrder) {
16265
16416
  _this.viewPortInfo.startIndex = _this.virtualItemStartIndex = 0;
16266
16417
  _this.viewPortInfo.endIndex = _this.virtualItemEndIndex = _this.viewPortInfo.startIndex > 0 ? _this.viewPortInfo.endIndex : _this.itemCount;
16267
16418
  _this.previousStartIndex = 0;
@@ -17284,13 +17435,20 @@ var CheckBoxSelection = /** @__PURE__ @class */ (function () {
17284
17435
  if (this.parent.allowFiltering && this.parent.targetInputElement.value === '') {
17285
17436
  this.parent.search(null);
17286
17437
  }
17287
- this.parent.refreshPopup();
17288
17438
  this.parent.refreshListItems(null);
17439
+ this.parent.refreshPopup();
17289
17440
  this.clearIconElement.style.visibility = 'hidden';
17290
17441
  this.filterInput.focus();
17291
17442
  this.setReorder(e);
17443
+ this.boundPreventListSelection = this.preventListSelection.bind(this);
17444
+ this.parent.popupWrapper.addEventListener('mouseup', this.boundPreventListSelection, true);
17292
17445
  e.preventDefault();
17293
17446
  };
17447
+ CheckBoxSelection.prototype.preventListSelection = function (e) {
17448
+ e.stopPropagation();
17449
+ this.parent.popupWrapper.removeEventListener('mouseup', this.boundPreventListSelection, true);
17450
+ this.boundPreventListSelection = null;
17451
+ };
17294
17452
  CheckBoxSelection.prototype.setDeviceSearchBox = function () {
17295
17453
  this.parent.popupObj.element.classList.add(device);
17296
17454
  this.parent.popupObj.element.classList.add(mobileFilter);
@@ -17717,7 +17875,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
17717
17875
  }
17718
17876
  };
17719
17877
  ListBox.prototype.updateActionCompleteData = function (li, item, index) {
17720
- this.jsonData.splice(index, 0, item);
17878
+ this.jsonData.splice(index === null ? this.jsonData.length : index, 0, item);
17721
17879
  };
17722
17880
  ListBox.prototype.initToolbar = function () {
17723
17881
  var pos = this.toolbarSettings.position;
@@ -19940,6 +20098,9 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
19940
20098
  __decorate$6([
19941
20099
  Property(null)
19942
20100
  ], ListBox.prototype, "filterBarPlaceholder", void 0);
20101
+ __decorate$6([
20102
+ Property('None')
20103
+ ], ListBox.prototype, "sortOrder", void 0);
19943
20104
  __decorate$6([
19944
20105
  Event()
19945
20106
  ], ListBox.prototype, "beforeItemRender", void 0);
@@ -20406,7 +20567,7 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
20406
20567
  }
20407
20568
  }
20408
20569
  else if (this.allowSpaces && this.queryString !== '' && currentRange && currentRange.trim() !== '' && currentRange.replace('\u00a0', ' ').lastIndexOf(' ') < currentRange.length - 1 &&
20409
- e.keyCode !== 38 && e.keyCode !== 40 && e.keyCode !== 8 && this.mentionChar.charCodeAt(0) === lastWordRange.charCodeAt(0)) {
20570
+ e.keyCode !== 38 && e.keyCode !== 40 && e.keyCode !== 8 && (this.mentionChar.charCodeAt(0) === lastWordRange.charCodeAt(0) || (this.liCollections && this.liCollections.length > 0))) {
20410
20571
  this.queryString = currentRange.substring(currentRange.lastIndexOf(this.mentionChar) + 1).replace('\u00a0', ' ');
20411
20572
  this.searchLists(e);
20412
20573
  }