@syncfusion/ej2-dropdowns 25.1.40 → 25.2.3

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 (23) hide show
  1. package/CHANGELOG.md +22 -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 +280 -166
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +279 -165
  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 +12 -12
  13. package/src/auto-complete/auto-complete.js +2 -10
  14. package/src/combo-box/combo-box.js +1 -1
  15. package/src/common/interface.d.ts +2 -0
  16. package/src/common/virtual-scroll.js +13 -4
  17. package/src/drop-down-base/drop-down-base.d.ts +3 -0
  18. package/src/drop-down-base/drop-down-base.js +67 -42
  19. package/src/drop-down-list/drop-down-list.d.ts +1 -1
  20. package/src/drop-down-list/drop-down-list.js +37 -27
  21. package/src/list-box/list-box.js +1 -6
  22. package/src/multi-select/multi-select.d.ts +3 -1
  23. package/src/multi-select/multi-select.js +157 -68
package/dist/es6/ej2-dropdowns.es5.js CHANGED
@@ -439,9 +439,10 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
439
439
  var query = this.parent.getForQuery(this.parent.value).clone();
440
440
  query = query.skip(0).take(this.parent.itemCount - (this.parent.value.length - this.parent.viewPortInfo.startIndex));
441
441
  this.parent.appendUncheckList = true;
442
+ this.parent.setCurrentView = false;
442
443
  this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
443
444
  isListUpdated = false;
444
- this.parent.appendUncheckList = false;
445
+ this.parent.appendUncheckList = this.parent.dataSource instanceof DataManager ? this.parent.appendUncheckList : false;
445
446
  isListUpdated = false;
446
447
  }
447
448
  else {
@@ -464,9 +465,10 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
464
465
  var query = this.parent.getForQuery(this.parent.value).clone();
465
466
  query = query.skip(0).take(this.parent.itemCount - (this.parent.value.length - this.parent.viewPortInfo.startIndex));
466
467
  this.parent.appendUncheckList = true;
468
+ this.parent.setCurrentView = false;
467
469
  this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
468
470
  isListUpdated = false;
469
- this.parent.appendUncheckList = false;
471
+ this.parent.appendUncheckList = this.parent.dataSource instanceof DataManager ? this.parent.appendUncheckList : false;
470
472
  }
471
473
  }
472
474
  else {
@@ -477,6 +479,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
477
479
  var query = this.parent.getForQuery(this.parent.value).clone();
478
480
  var skipvalue = this.parent.viewPortInfo.startIndex - this.parent.value.length >= 0 ? this.parent.viewPortInfo.startIndex - this.parent.value.length : 0;
479
481
  query = query.skip(skipvalue);
482
+ this.parent.setCurrentView = false;
480
483
  this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
481
484
  isListUpdated = false;
482
485
  }
@@ -498,6 +501,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
498
501
  else {
499
502
  query = query.skip(this.parent.viewPortInfo.startIndex);
500
503
  }
504
+ this.parent.setCurrentView = false;
501
505
  this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
502
506
  isResetListCalled = true;
503
507
  break;
@@ -519,6 +523,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
519
523
  else {
520
524
  query = query.skip(this.parent.viewPortInfo.startIndex);
521
525
  }
526
+ this.parent.setCurrentView = false;
522
527
  this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
523
528
  isResetListCalled = true;
524
529
  }
@@ -530,6 +535,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
530
535
  currentData.push(alreadyAddedData[0]);
531
536
  }
532
537
  }
538
+ this.parent.setCurrentView = false;
533
539
  }
534
540
  }
535
541
  if (!isResetListCalled && isListUpdated) {
@@ -597,6 +603,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
597
603
  if (isStartIndexInitialised && !((this.parent.totalItemCount == queryStartIndex) && (this.parent.totalItemCount == queryEndIndex))) {
598
604
  this.parent.virtualItemStartIndex = queryStartIndex;
599
605
  this.parent.virtualItemEndIndex = queryEndIndex;
606
+ this.parent.setCurrentView = true;
600
607
  this.generateAndExecuteQueryAsync(query, queryStartIndex, queryEndIndex);
601
608
  if (this.component === 'multiselect' && this.parent.hideSelectedItem && this.parent.value && Array.isArray(this.parent.value) && this.parent.value.length > 0) {
602
609
  this.parent.totalItemsCount();
@@ -606,7 +613,9 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
606
613
  this.parent.virtualItemEndIndex = this.parent.viewPortInfo.endIndex;
607
614
  }
608
615
  }
609
- this.setCurrentViewDataAsync();
616
+ if (!(this.parent.dataSource instanceof DataManager) || (this.parent.dataSource instanceof DataManager && !this.parent.isRequesting)) {
617
+ this.setCurrentViewDataAsync();
618
+ }
610
619
  };
611
620
  VirtualScroll.prototype.dataProcessAsync = function (isOpenPopup) {
612
621
  this.parent.selectedValueInfo = null;
@@ -639,7 +648,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
639
648
  return [4 /*yield*/, this.dataProcessAsync()];
640
649
  case 1:
641
650
  _a.sent();
642
- if (this.parent.keyboardEvent != null) {
651
+ if (this.parent.keyboardEvent != null && (!(this.parent.dataSource instanceof DataManager) || (this.parent.dataSource instanceof DataManager && !this.parent.isRequesting))) {
643
652
  this.parent.handleVirtualKeyboardActions(this.parent.keyboardEvent, this.parent.pageCount);
644
653
  }
645
654
  if (!this.parent.customFilterQuery) {
@@ -879,9 +888,10 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
879
888
  _this.isCheckBoxSelection = false;
880
889
  _this.totalItemCount = 0;
881
890
  _this.dataCount = 0;
891
+ _this.remoteDataCount = -1;
882
892
  _this.isRemoteDataUpdated = false;
883
893
  _this.isIncrementalRequest = false;
884
- _this.itemCount = 10;
894
+ _this.itemCount = 30;
885
895
  _this.virtualListHeight = 0;
886
896
  _this.isVirtualScrolling = false;
887
897
  _this.isPreventScrollAction = false;
@@ -908,7 +918,6 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
908
918
  _this.appendUncheckList = false;
909
919
  _this.getInitialData = false;
910
920
  _this.preventPopupOpen = true;
911
- _this.customFilterQuery = new Query();
912
921
  _this.virtualListInfo = {
913
922
  currentPageNumber: null,
914
923
  direction: null,
@@ -1184,10 +1193,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1184
1193
  this.virtualListInfo = this.viewPortInfo;
1185
1194
  };
1186
1195
  DropDownBase.prototype.getFilteringSkeletonCount = function () {
1187
- var difference = this.dataCount - this.viewPortInfo.endIndex;
1188
1196
  var currentSkeletonCount = this.skeletonCount;
1189
1197
  this.getSkeletonCount(true);
1190
- this.skeletonCount = this.dataCount > this.itemCount * 2 ? this.skeletonCount : difference > this.skeletonCount ? this.skeletonCount : difference > 0 ? difference : 0;
1198
+ this.skeletonCount = this.dataCount > this.itemCount * 2 ? this.skeletonCount : 0;
1191
1199
  var skeletonUpdated = true;
1192
1200
  if ((this.getModuleName() === 'autocomplete' || this.getModuleName() === 'multiselect') && (this.totalItemCount < (this.itemCount * 2))) {
1193
1201
  this.skeletonCount = 0;
@@ -1221,10 +1229,10 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1221
1229
  DropDownBase.prototype.getSkeletonCount = function (retainSkeleton) {
1222
1230
  this.virtualListHeight = this.listContainerHeight != null ? parseInt(this.listContainerHeight, 10) : this.virtualListHeight;
1223
1231
  var actualCount = this.virtualListHeight > 0 ? Math.floor(this.virtualListHeight / this.listItemHeight) : 0;
1224
- this.skeletonCount = actualCount * 2 < this.itemCount ? this.itemCount : actualCount * 2;
1232
+ this.skeletonCount = actualCount * 4 < this.itemCount ? this.itemCount : actualCount * 4;
1225
1233
  this.itemCount = retainSkeleton ? this.itemCount : this.skeletonCount;
1226
1234
  this.virtualItemCount = this.itemCount;
1227
- this.skeletonCount = Math.floor(this.skeletonCount / 2) + 2;
1235
+ this.skeletonCount = Math.floor(this.skeletonCount / 2);
1228
1236
  };
1229
1237
  DropDownBase.prototype.GetVirtualTrackHeight = function () {
1230
1238
  var height = this.totalItemCount === this.viewPortInfo.endIndex ? this.totalItemCount * this.listItemHeight - this.itemCount * this.listItemHeight : this.totalItemCount * this.listItemHeight;
@@ -1449,41 +1457,53 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1449
1457
  if (!eventArgs.cancel) {
1450
1458
  _this.isRequesting = true;
1451
1459
  _this.showSpinner();
1452
- if (dataSource instanceof DataManager && !_this.virtualGroupDataSource) {
1460
+ if (dataSource instanceof DataManager) {
1453
1461
  _this.isRequested = true;
1462
+ var isWhereExist_1 = false;
1454
1463
  if (_this.isDataFetched) {
1455
1464
  _this.emptyDataRequest(fields);
1456
1465
  return;
1457
1466
  }
1458
1467
  eventArgs.data.executeQuery(_this.getQuery(eventArgs.query)).then(function (e) {
1459
1468
  _this.isPreventChange = _this.isAngular && _this.preventChange ? true : _this.isPreventChange;
1460
- _this.trigger('actionComplete', e, function (e) {
1461
- if (!_this.virtualGroupDataSource && _this.isVirtualizationEnabled) {
1462
- _this.isRemoteDataUpdated = true;
1463
- if ((_this.getModuleName() === 'combobox' && !_this.initialRemoteRender && _this.isAllowFiltering && _this.isVirtualizationEnabled && e.result)) {
1464
- e.result = e.result.result;
1469
+ var isReOrder = true;
1470
+ if (!_this.virtualSelectAll) {
1471
+ var newQuery = _this.getQuery(eventArgs.query);
1472
+ for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {
1473
+ if (newQuery.queries[queryElements].fn === 'onWhere') {
1474
+ isWhereExist_1 = true;
1465
1475
  }
1466
- if (e.result.length > 0) {
1467
- var dataSource_2 = e.result;
1468
- if (_this.isVirtualizationEnabled && _this.fields.groupBy) {
1469
- var data = new DataManager(dataSource_2).executeLocal(new Query().group(_this.fields.groupBy));
1470
- _this.virtualGroupDataSource = data.records;
1476
+ }
1477
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
1478
+ if (_this.isVirtualizationEnabled && (e.count != 0 && e.count < (_this.itemCount * 2))) {
1479
+ if (newQuery) {
1480
+ for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {
1481
+ if (newQuery.queries[queryElements].fn === 'onTake') {
1482
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
1483
+ newQuery.queries[queryElements].e.nos = e.count;
1484
+ }
1485
+ if (_this.getModuleName() === 'multiselect' && (newQuery.queries[queryElements].e.condition == 'or' || newQuery.queries[queryElements].e.operator == 'equal')) {
1486
+ isReOrder = false;
1487
+ }
1471
1488
  }
1472
- else {
1473
- _this.virtualGroupDataSource = dataSource_2;
1474
- _this.hideSpinner();
1475
- _this.isRequested = false;
1476
- _this.isRequesting = false;
1477
- _this.setListData(dataSource_2, fields, query, event);
1478
- return;
1489
+ }
1490
+ }
1491
+ else {
1492
+ _this.isVirtualTrackHeight = false;
1493
+ if (newQuery) {
1494
+ for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {
1495
+ if (_this.getModuleName() === 'multiselect' && ((newQuery.queries[queryElements].e && newQuery.queries[queryElements].e.condition == 'or') || (newQuery.queries[queryElements].e && newQuery.queries[queryElements].e.operator == 'equal'))) {
1496
+ isReOrder = false;
1497
+ }
1479
1498
  }
1480
1499
  }
1481
- _this.hideSpinner();
1482
- _this.isRequested = false;
1483
- _this.isRequesting = false;
1484
- _this.updatePopupState();
1485
- return;
1486
1500
  }
1501
+ }
1502
+ if (isReOrder) {
1503
+ // eslint-disable @typescript-eslint/no-explicit-any
1504
+ _this.dataCount = _this.totalItemCount = e.count;
1505
+ }
1506
+ _this.trigger('actionComplete', e, function (e) {
1487
1507
  if (!e.cancel) {
1488
1508
  _this.isRequesting = false;
1489
1509
  var listItems = e.result;
@@ -1491,12 +1511,16 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1491
1511
  ulElement = _this.renderItems(listItems, fields);
1492
1512
  return;
1493
1513
  }
1494
- if (listItems.length === 0) {
1514
+ if ((!_this.isVirtualizationEnabled && listItems.length === 0) || (_this.isVirtualizationEnabled && listItems.length === 0 && !isWhereExist_1)) {
1495
1515
  _this.isDataFetched = true;
1496
1516
  }
1517
+ if (!isWhereExist_1) {
1518
+ _this.remoteDataCount = e.count;
1519
+ }
1497
1520
  _this.dataCount = e.count;
1498
1521
  _this.totalItemCount = e.count;
1499
1522
  ulElement = _this.renderItems(listItems, fields);
1523
+ _this.appendUncheckList = false;
1500
1524
  _this.onActionComplete(ulElement, listItems, e);
1501
1525
  if (_this.groupTemplate) {
1502
1526
  _this.renderGroupTemplate(ulElement);
@@ -1509,6 +1533,17 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1509
1533
  _this.preventPopupOpen = false;
1510
1534
  return;
1511
1535
  }
1536
+ if (_this.isVirtualizationEnabled && _this.setCurrentView) {
1537
+ _this.notify("setCurrentViewDataAsync", {
1538
+ module: "VirtualScroll",
1539
+ });
1540
+ }
1541
+ if (_this.keyboardEvent != null) {
1542
+ _this.handleVirtualKeyboardActions(_this.keyboardEvent, _this.pageCount);
1543
+ }
1544
+ if (_this.isVirtualizationEnabled) {
1545
+ _this.getFilteringSkeletonCount();
1546
+ }
1512
1547
  }
1513
1548
  });
1514
1549
  }).catch(function (e) {
@@ -1545,7 +1580,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1545
1580
  }
1546
1581
  if (isReOrder) {
1547
1582
  listItems = (newQuery).executeLocal(dataManager);
1548
- _this.isVirtualTrackHeight = true;
1583
+ _this.isVirtualTrackHeight = (!(_this.dataSource instanceof DataManager) && !_this.isCustomDataUpdated) ? true : false;
1549
1584
  }
1550
1585
  }
1551
1586
  }
@@ -1560,7 +1595,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1560
1595
  }
1561
1596
  }
1562
1597
  }
1563
- if (isReOrder) {
1598
+ if (isReOrder && (!(_this.dataSource instanceof DataManager) && !_this.isCustomDataUpdated)) {
1564
1599
  // eslint-disable @typescript-eslint/no-explicit-any
1565
1600
  _this.dataCount = _this.totalItemCount = _this.virtualSelectAll ? listItems.length : listItems.count;
1566
1601
  }
@@ -1597,6 +1632,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1597
1632
  });
1598
1633
  }
1599
1634
  };
1635
+ DropDownBase.prototype.handleVirtualKeyboardActions = function (e, pageCount) {
1636
+ // Used this method in component side.
1637
+ };
1600
1638
  DropDownBase.prototype.updatePopupState = function () {
1601
1639
  // Used this method in component side.
1602
1640
  };
@@ -1708,6 +1746,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1708
1746
  addClass([ulElement.children[i]], HIDE_GROUPLIST);
1709
1747
  }
1710
1748
  }
1749
+ if (ulElement.children[0].classList.contains('e-hide-group-header')) {
1750
+ setStyleAttribute(ulElement.children[1], { zIndex: 11 });
1751
+ }
1711
1752
  }
1712
1753
  }
1713
1754
  if (!isNullOrUndefined(this.list)) {
@@ -1851,29 +1892,15 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
1851
1892
  var topIndex = Math.round(target.scrollTop / liHeight);
1852
1893
  var liCollections = this.list.querySelectorAll('li' + ':not(.e-hide-listitem)');
1853
1894
  var virtualListCount = this.list.querySelectorAll('.e-virtual-list').length;
1854
- var count = 0;
1855
- var isCount = false;
1856
1895
  for (var i = topIndex; i > -1; i--) {
1857
1896
  var index = this.isVirtualizationEnabled ? i + virtualListCount : i;
1858
1897
  if (this.isVirtualizationEnabled) {
1859
- var groupListLength = this.list.querySelectorAll('.e-list-group-item').length;
1860
- var loadedGroupList = 0;
1861
- if (isCount) {
1862
- count++;
1863
- }
1864
1898
  if (this.fixedHeaderElement && this.updateGroupHeader(index, liCollections, target)) {
1865
- loadedGroupList++;
1866
- if (count >= this.getPageCount()) {
1867
- break;
1868
- }
1869
- if (groupListLength <= loadedGroupList) {
1870
- break;
1871
- }
1899
+ break;
1872
1900
  }
1873
1901
  if (isDownkey) {
1874
1902
  if ((!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.selected) && this.getModuleName() !== 'autocomplete') || (!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.focus) && this.getModuleName() === 'autocomplete')) {
1875
- count++;
1876
- isCount = true;
1903
+
1877
1904
  }
1878
1905
  }
1879
1906
  }
@@ -2379,6 +2406,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2379
2406
  }
2380
2407
  if (this.getModuleName() === 'listbox') {
2381
2408
  this.updateActionCompleteData(li, item, isListboxEmpty ? null : index);
2409
+ isListboxEmpty = true;
2382
2410
  }
2383
2411
  else {
2384
2412
  this.updateActionCompleteData(li, item, index);
@@ -2426,7 +2454,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
2426
2454
  }
2427
2455
  }
2428
2456
  else {
2429
- if (this.liCollections[index]) {
2457
+ if (this.liCollections[index] && this.liCollections[index].parentNode) {
2430
2458
  this.liCollections[index].parentNode.insertBefore(liCollections[i], this.liCollections[index]);
2431
2459
  }
2432
2460
  else {
@@ -3489,8 +3517,11 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3489
3517
  var focusEle = this.list.querySelector('.' + dropDownListClasses.focus);
3490
3518
  if (this.isSelectFocusItem(focusEle) && !isVirtualKeyAction) {
3491
3519
  this.setSelection(focusEle, e);
3492
- if (this.enableVirtualization && !this.fields.groupBy && this.getModuleName() !== 'combobox') {
3520
+ if (this.enableVirtualization) {
3493
3521
  var selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.selectedLI.offsetTop + (this.virtualListInfo.startIndex * this.selectedLI.offsetHeight) : this.selectedLI.offsetTop;
3522
+ if (this.fields.groupBy) {
3523
+ selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex == 0 ? this.selectedLI.offsetHeight - selectedLiOffsetTop : selectedLiOffsetTop - this.selectedLI.offsetHeight;
3524
+ }
3494
3525
  this.list.scrollTop = selectedLiOffsetTop - (this.list.querySelectorAll('.e-virtual-list').length * this.selectedLI.offsetHeight);
3495
3526
  }
3496
3527
  }
@@ -3527,7 +3558,13 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3527
3558
  }
3528
3559
  }
3529
3560
  if (!isNullOrUndefined(nextItem)) {
3561
+ var focusAtFirstElement = this.liCollections[this.skeletonCount] && this.liCollections[this.skeletonCount].classList.contains('e-item-focus');
3530
3562
  this.setSelection(nextItem, e);
3563
+ if (focusAtFirstElement && this.enableVirtualization && this.getModuleName() === 'autocomplete' && !isVirtualKeyAction) {
3564
+ var selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.selectedLI.offsetTop + (this.virtualListInfo.startIndex * this.selectedLI.offsetHeight) : this.selectedLI.offsetTop;
3565
+ selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex == 0 && this.fields.groupBy ? this.selectedLI.offsetHeight - selectedLiOffsetTop : selectedLiOffsetTop - this.selectedLI.offsetHeight;
3566
+ this.list.scrollTop = selectedLiOffsetTop - (this.list.querySelectorAll('.e-virtual-list').length * this.selectedLI.offsetHeight);
3567
+ }
3531
3568
  }
3532
3569
  else if (this.enableVirtualization && !this.isPopupOpen && this.getModuleName() !== 'autocomplete' && ((this.viewPortInfo.endIndex !== this.totalItemCount && e.action === 'down') || (this.viewPortInfo.startIndex !== 0 && e.action === 'up'))) {
3533
3570
  if (e.action === 'down') {
@@ -3654,14 +3691,13 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3654
3691
  }
3655
3692
  break;
3656
3693
  case 'pageUp':
3657
- var count = (pageCount * 2) - 4;
3658
- this.activeIndex = Math.round(count);
3694
+ this.activeIndex = this.getModuleName() === 'autocomplete' ? this.getIndexByValue(this.selectedLI.getAttribute('data-value')) + this.getPageCount() - 1 : this.getIndexByValue(this.previousValue);
3659
3695
  this.pageUpSelection(this.activeIndex - this.getPageCount(), e, true);
3660
3696
  e.preventDefault();
3661
3697
  break;
3662
3698
  case 'pageDown':
3663
- this.activeIndex = 1;
3664
- this.pageDownSelection(this.activeIndex + this.getPageCount(), e, true);
3699
+ this.activeIndex = this.getModuleName() === 'autocomplete' ? this.getIndexByValue(this.selectedLI.getAttribute('data-value')) - this.getPageCount() : this.getIndexByValue(this.previousValue);
3700
+ this.pageDownSelection(!isNullOrUndefined(this.activeIndex) ? (this.activeIndex + this.getPageCount()) : (2 * this.getPageCount()), e, true);
3665
3701
  e.preventDefault();
3666
3702
  break;
3667
3703
  case 'home':
@@ -3698,8 +3734,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3698
3734
  };
3699
3735
  DropDownList.prototype.pageUpSelection = function (steps, event, isVirtualKeyAction) {
3700
3736
  var previousItem = steps >= 0 ? this.liCollections[steps + 1] : this.liCollections[0];
3701
- if ((this.enableVirtualization && this.activeIndex == null) || isVirtualKeyAction) {
3702
- previousItem = steps >= 0 ? this.liCollections[steps + this.skeletonCount + 1] : this.liCollections[0];
3737
+ if ((this.enableVirtualization && this.activeIndex == null)) {
3738
+ previousItem = (this.liCollections.length >= steps && steps >= 0) ? this.liCollections[steps + this.skeletonCount + 1] : this.liCollections[0];
3703
3739
  }
3704
3740
  if (!isNullOrUndefined(previousItem) && previousItem.classList.contains('e-virtual-list')) {
3705
3741
  previousItem = this.liCollections[this.skeletonCount];
@@ -3731,7 +3767,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3731
3767
  steps = this.getModuleName() === 'dropdownlist' && this.allowFiltering ? steps + 1 : steps;
3732
3768
  previousItem = steps < list.length ? this.liCollections[steps] : this.liCollections[list.length - 1];
3733
3769
  }
3734
- if ((this.enableVirtualization && this.activeIndex == null) || isVirtualKeyAction) {
3770
+ if ((this.enableVirtualization && this.activeIndex == null)) {
3735
3771
  previousItem = steps <= list.length ? this.liCollections[steps + this.skeletonCount - 1] : this.liCollections[list.length - 1];
3736
3772
  }
3737
3773
  this.PageUpDownSelection(previousItem, event);
@@ -3917,6 +3953,11 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3917
3953
  }
3918
3954
  }
3919
3955
  else {
3956
+ if (this.enableVirtualization && this.activeIndex == null && this.dataSource instanceof DataManager) {
3957
+ this.UpdateSkeleton();
3958
+ this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);
3959
+ this.ulElement = this.list.querySelector('ul');
3960
+ }
3920
3961
  this.activeIndex = this.getIndexByValue(value);
3921
3962
  }
3922
3963
  };
@@ -3976,7 +4017,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
3976
4017
  if (this.enableVirtualization && this.value) {
3977
4018
  var fields = (this.fields.value) ? this.fields.value : '';
3978
4019
  var currentValue = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;
3979
- if (this.dataSource instanceof DataManager && this.virtualGroupDataSource) {
4020
+ if (this.dataSource instanceof DataManager) {
3980
4021
  var getItem = new DataManager(this.virtualGroupDataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue)));
3981
4022
  if (getItem && getItem.length > 0) {
3982
4023
  this.itemData = getItem[0];
@@ -4321,7 +4362,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4321
4362
  if (!(this.dataSource instanceof DataManager) && dataType === 'string' || dataType === 'number') {
4322
4363
  filterQuery.where('', filterType, this.typedString, this.ignoreCase, this.ignoreAccent);
4323
4364
  }
4324
- else if (((this.getModuleName() !== 'combobox') || this.enableVirtualization) || (this.isFiltering() && this.getModuleName() === 'combobox' && this.typedString !== '')) {
4365
+ else if (((this.getModuleName() !== 'combobox')) || (this.isFiltering() && this.getModuleName() === 'combobox' && this.typedString !== '')) {
4325
4366
  var fields = (this.fields.text) ? this.fields.text : '';
4326
4367
  filterQuery.where(fields, filterType, this.typedString, this.ignoreCase, this.ignoreAccent);
4327
4368
  }
@@ -4329,7 +4370,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4329
4370
  else {
4330
4371
  filterQuery = (this.enableVirtualization && !isNullOrUndefined(this.customFilterQuery)) ? this.customFilterQuery.clone() : query ? query.clone() : this.query ? this.query.clone() : new Query();
4331
4372
  }
4332
- if (this.enableVirtualization && (this.viewPortInfo.endIndex != 0) && (!(this.dataSource instanceof DataManager) || (this.dataSource instanceof DataManager && this.virtualGroupDataSource))) {
4373
+ if (this.enableVirtualization && this.viewPortInfo.endIndex != 0) {
4333
4374
  var takeValue = this.getTakeValue();
4334
4375
  var alreadySkipAdded = false;
4335
4376
  if (filterQuery) {
@@ -4396,14 +4437,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4396
4437
  }
4397
4438
  filterQuery.requiresCount();
4398
4439
  }
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
- }
4407
4440
  return filterQuery;
4408
4441
  };
4409
4442
  DropDownList.prototype.getSelectionPoints = function () {
@@ -4430,7 +4463,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4430
4463
  return;
4431
4464
  }
4432
4465
  _this.isCustomFilter = true;
4433
- _this.customFilterQuery = query;
4466
+ _this.customFilterQuery = query.clone();
4434
4467
  _this.filteringAction(dataSource, query, fields);
4435
4468
  },
4436
4469
  baseEventArgs: e,
@@ -4736,6 +4769,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4736
4769
  this.addNewItem(list, selectedItem);
4737
4770
  }
4738
4771
  if (!isNullOrUndefined(this.itemData) || (isNullOrUndefined(this.itemData) && this.enableVirtualization)) {
4772
+ this.getSkeletonCount();
4773
+ this.skeletonCount = this.totalItemCount != 0 && this.totalItemCount < (this.itemCount * 2) ? 0 : this.skeletonCount;
4774
+ this.UpdateSkeleton();
4739
4775
  this.focusIndexItem();
4740
4776
  }
4741
4777
  if (this.enableVirtualization) {
@@ -4838,7 +4874,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
4838
4874
  };
4839
4875
  DropDownList.prototype.focusIndexItem = function () {
4840
4876
  var value = this.getItemData().value;
4841
- this.activeIndex = this.getIndexByValue(value);
4877
+ this.activeIndex = ((this.enableVirtualization && !isNullOrUndefined(value)) || !this.enableVirtualization) ? this.getIndexByValue(value) : this.activeIndex;
4842
4878
  var element = this.findListElement(this.list, 'li', 'data-value', value);
4843
4879
  this.selectedLI = element;
4844
4880
  this.activeItem(element);
@@ -5258,7 +5294,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5258
5294
  }
5259
5295
  else {
5260
5296
  if (this.enableVirtualization) {
5261
- liCount = keyAction == "pageDown" ? this.getPageCount() : liCount;
5297
+ liCount = keyAction == "pageDown" ? this.getPageCount() + 1 : liCount;
5262
5298
  }
5263
5299
  this.list.scrollTop += this.selectedLI.offsetHeight * liCount;
5264
5300
  }
@@ -5277,7 +5313,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5277
5313
  this.isPreventKeyAction = false;
5278
5314
  this.isKeyBoardAction = false;
5279
5315
  this.isPreventScrollAction = false;
5280
- nextOffset = nextOffset + (this.selectedLI.offsetHeight * liCount);
5281
5316
  }
5282
5317
  this.list.scrollTop = nextOffset;
5283
5318
  }
@@ -5335,7 +5370,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5335
5370
  this.isPreventKeyAction = false;
5336
5371
  this.isKeyBoardAction = false;
5337
5372
  this.isPreventScrollAction = false;
5338
- nextOffset = nextOffset - (this.selectedLI.offsetHeight * liCount);
5339
5373
  }
5340
5374
  this.list.scrollTop = this.list.scrollTop + nextOffset;
5341
5375
  }
@@ -5530,7 +5564,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5530
5564
  sentinelInfo: {},
5531
5565
  offsets: {},
5532
5566
  startIndex: 0,
5533
- endIndex: 0,
5567
+ endIndex: this.itemCount,
5534
5568
  };
5535
5569
  if (this.getModuleName() === 'combobox') {
5536
5570
  this.typedString = "";
@@ -5538,8 +5572,12 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
5538
5572
  this.previousStartIndex = 0;
5539
5573
  this.previousEndIndex = 0;
5540
5574
  if (this.dataSource instanceof DataManager) {
5541
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
5542
- this.totalItemCount = this.dataCount = this.virtualGroupDataSource && this.virtualGroupDataSource.length ? this.virtualGroupDataSource.length : 0;
5575
+ if (this.remoteDataCount >= 0) {
5576
+ this.totalItemCount = this.dataCount = this.remoteDataCount;
5577
+ }
5578
+ else {
5579
+ this.resetList(this.dataSource);
5580
+ }
5543
5581
  }
5544
5582
  else {
5545
5583
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -10010,7 +10048,7 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
10010
10048
  if (this.enableVirtualization && this.value) {
10011
10049
  var fields = (this.fields.value) ? this.fields.value : '';
10012
10050
  var currentValue_1 = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;
10013
- if (this.dataSource instanceof DataManager && this.virtualGroupDataSource) {
10051
+ if (this.dataSource instanceof DataManager) {
10014
10052
  var getItem = new DataManager(this.virtualGroupDataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue_1)));
10015
10053
  if (getItem && getItem.length > 0) {
10016
10054
  this.itemData = getItem[0];
@@ -10941,7 +10979,7 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
10941
10979
  if (!(this.dataSource instanceof DataManager) && dataType === 'string' || dataType === 'number') {
10942
10980
  filterQuery.where('', filterType, queryString, this.ignoreCase, this.ignoreAccent);
10943
10981
  }
10944
- else if ((!this.enableVirtualization) || (this.enableVirtualization && (!(this.dataSource instanceof DataManager) || (this.dataSource instanceof DataManager && this.virtualGroupDataSource)))) {
10982
+ else {
10945
10983
  var mapping = !isNullOrUndefined(this.fields.value) ? this.fields.value : '';
10946
10984
  filterQuery.where(mapping, filterType, queryString, this.ignoreCase, this.ignoreAccent);
10947
10985
  }
@@ -10957,7 +10995,7 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
10957
10995
  }
10958
10996
  filterQuery.take(this.suggestionCount);
10959
10997
  }
10960
- if (this.enableVirtualization && (!(this.dataSource instanceof DataManager) || (this.dataSource instanceof DataManager && this.virtualGroupDataSource))) {
10998
+ if (this.enableVirtualization) {
10961
10999
  var queryTakeValue = 0;
10962
11000
  var querySkipValue = 0;
10963
11001
  var takeValue = this.getTakeValue();
@@ -11007,14 +11045,6 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
11007
11045
  }
11008
11046
  filterQuery.requiresCount();
11009
11047
  }
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
- }
11018
11048
  return filterQuery;
11019
11049
  };
11020
11050
  AutoComplete.prototype.searchLists = function (e) {
@@ -11814,10 +11844,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11814
11844
  attributes(_this.inputElement, { 'aria-expanded': 'true', 'aria-owns': _this.element.id + '_popup', 'aria-controls': _this.element.id });
11815
11845
  _this.updateAriaActiveDescendant();
11816
11846
  if (_this.isFirstClick) {
11817
- if (_this.enableVirtualization && _this.mode === 'CheckBox' && _this.value && _this.enableSelectionOrder) {
11818
- _this.updateVirtualReOrderList();
11847
+ if (!_this.enableVirtualization) {
11848
+ _this.loadTemplate();
11819
11849
  }
11820
- _this.loadTemplate();
11821
11850
  }
11822
11851
  if (_this.mode === 'CheckBox' && _this.showSelectAll) {
11823
11852
  EventHandler.add(_this.popupObj.element, 'click', _this.clickHandler, _this);
@@ -11827,7 +11856,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11827
11856
  };
11828
11857
  MultiSelect.prototype.updateVirtualReOrderList = function (isCheckBoxUpdate) {
11829
11858
  var query = this.getForQuery(this.value, true).clone();
11830
- this.resetList(this.dataSource, this.fields, query);
11859
+ if (this.enableVirtualization && this.dataSource instanceof DataManager) {
11860
+ this.resetList(this.selectedListData, this.fields, query);
11861
+ }
11862
+ else {
11863
+ this.resetList(this.dataSource, this.fields, query);
11864
+ }
11831
11865
  this.UpdateSkeleton();
11832
11866
  this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);
11833
11867
  this.virtualItemCount = this.itemCount;
@@ -11884,6 +11918,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
11884
11918
  }
11885
11919
  if (this.enableVirtualization) {
11886
11920
  var focusedItem = this.list.querySelector('.' + dropDownBaseClasses.focus);
11921
+ this.isKeyBoardAction = false;
11887
11922
  this.scrollBottom(focusedItem);
11888
11923
  }
11889
11924
  };
@@ -12001,15 +12036,15 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12001
12036
  MultiSelect.prototype.getForQuery = function (valuecheck, isCheckbox) {
12002
12037
  var predicate;
12003
12038
  var field = isNullOrUndefined(this.fields.value) ? this.fields.text : this.fields.value;
12004
- if (this.enableVirtualization) {
12039
+ if (this.enableVirtualization && valuecheck) {
12005
12040
  if (isCheckbox) {
12006
12041
  for (var i = 0; i < valuecheck.length; i++) {
12007
12042
  var value = this.allowObjectBinding ? getValue((this.fields.value) ? this.fields.value : '', valuecheck[i]) : valuecheck[i];
12008
12043
  if (i === 0) {
12009
- predicate = new Predicate(field, 'equal', value);
12044
+ predicate = new Predicate(field, 'equal', (value));
12010
12045
  }
12011
12046
  else {
12012
- predicate = predicate.or(field, 'equal', value);
12047
+ predicate = predicate.or(field, 'equal', (value));
12013
12048
  }
12014
12049
  }
12015
12050
  return new Query().where(predicate);
@@ -12018,10 +12053,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12018
12053
  for (var i = 0; i < valuecheck.length; i++) {
12019
12054
  var value = this.allowObjectBinding ? getValue((this.fields.value) ? this.fields.value : '', valuecheck[i]) : valuecheck[i];
12020
12055
  if (i === 0) {
12021
- predicate = new Predicate(field, 'notequal', value);
12056
+ predicate = new Predicate(field, 'notequal', (value));
12022
12057
  }
12023
12058
  else {
12024
- predicate = predicate.and(field, 'notequal', value);
12059
+ predicate = predicate.and(field, 'notequal', (value));
12025
12060
  }
12026
12061
  }
12027
12062
  return new Query().where(predicate);
@@ -12071,7 +12106,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12071
12106
  valuecheck = this.presentItemValue(this.ulElement);
12072
12107
  }
12073
12108
  if (valuecheck.length > 0 && this.dataSource instanceof DataManager && !isNullOrUndefined(this.value)
12074
- && this.listData != null) {
12109
+ && this.listData != null && !this.enableVirtualization) {
12075
12110
  this.addNonPresentItems(valuecheck, this.ulElement, this.listData);
12076
12111
  }
12077
12112
  else {
@@ -12082,6 +12117,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12082
12117
  query = this.allowFiltering ? query.where(this.fields.text, 'startswith', this.inputElement.value, this.ignoreCase, this.ignoreAccent) : query;
12083
12118
  this.checkForCustomValue(query, this.fields);
12084
12119
  this.isCustomRendered = true;
12120
+ this.remoteCustomValue = this.enableVirtualization ? false : this.remoteCustomValue;
12085
12121
  }
12086
12122
  if (this.dataSource instanceof DataManager && this.mode === 'CheckBox' && this.allowFiltering) {
12087
12123
  this.removeFocus();
@@ -12126,7 +12162,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12126
12162
  if (!isNullOrUndefined(this.text) && (isNullOrUndefined(this.value) || this.value.length === 0)) {
12127
12163
  this.initialTextUpdate();
12128
12164
  }
12129
- this.initialValueUpdate();
12165
+ if (!this.enableVirtualization || (this.enableVirtualization && (!(this.dataSource instanceof DataManager)))) {
12166
+ this.initialValueUpdate();
12167
+ }
12130
12168
  this.initialUpdate();
12131
12169
  this.refreshPlaceHolder();
12132
12170
  if (this.mode !== 'CheckBox' && this.changeOnBlur) {
@@ -12329,7 +12367,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12329
12367
  if (!(this.dataSource instanceof DataManager) && dataType === 'string' || dataType === 'number') {
12330
12368
  filterQuery.where('', this.filterType, this.targetElement(), this.ignoreCase, this.ignoreAccent);
12331
12369
  }
12332
- else {
12370
+ else if ((this.enableVirtualization && this.targetElement() !== "") || !this.enableVirtualization) {
12333
12371
  var fields = this.fields;
12334
12372
  filterQuery.where(!isNullOrUndefined(fields.text) ? fields.text : '', this.filterType, this.targetElement(), this.ignoreCase, this.ignoreAccent);
12335
12373
  }
@@ -12340,18 +12378,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12340
12378
  return filterQuery;
12341
12379
  }
12342
12380
  else {
12343
- if (this.enableVirtualization && (this.viewPortInfo.endIndex != 0) && !this.virtualSelectAll && (!(this.dataSource instanceof DataManager) || (this.dataSource instanceof DataManager && this.virtualGroupDataSource))) {
12381
+ if (this.enableVirtualization && (this.viewPortInfo.endIndex != 0) && !this.virtualSelectAll) {
12344
12382
  return this.virtualFilterQuery(filterQuery);
12345
12383
  }
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
- }
12355
12384
  return query ? query : this.query ? this.query : new Query();
12356
12385
  }
12357
12386
  };
@@ -12514,7 +12543,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12514
12543
  var dataItem_1 = {};
12515
12544
  setValue(field.text, value, dataItem_1);
12516
12545
  if (typeof getValue((this.fields.value ? this.fields.value : 'value'), customData)
12517
- === 'number') {
12546
+ === 'number' && this.fields.value !== this.fields.text) {
12518
12547
  setValue(field.value, Math.random(), dataItem_1);
12519
12548
  }
12520
12549
  else {
@@ -12531,17 +12560,19 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12531
12560
  dataItem_1 = this.allowObjectBinding ? emptyObject_1 : dataItem_1;
12532
12561
  if (this.enableVirtualization) {
12533
12562
  this.virtualCustomData = dataItem_1;
12534
- var tempData = this.virtualGroupDataSource ? JSON.parse(JSON.stringify(this.virtualGroupDataSource)) : JSON.parse(JSON.stringify(this.dataSource));
12563
+ var tempData = this.dataSource instanceof DataManager ? JSON.parse(JSON.stringify(this.listData)) : JSON.parse(JSON.stringify(this.dataSource));
12535
12564
  var totalData = [];
12536
12565
  if (this.virtualCustomSelectData && this.virtualCustomSelectData.length > 0) {
12537
12566
  totalData = tempData.concat(this.virtualCustomSelectData);
12538
12567
  }
12539
12568
  tempData.splice(0, 0, dataItem_1);
12540
12569
  this.isCustomDataUpdated = true;
12570
+ var tempCount = this.totalItemCount;
12541
12571
  this.viewPortInfo.startIndex = this.virtualItemStartIndex = 0;
12542
12572
  this.viewPortInfo.endIndex = this.virtualItemEndIndex = this.itemCount;
12543
12573
  this.resetList(tempData, field, query);
12544
12574
  this.isCustomDataUpdated = false;
12575
+ this.totalItemCount = this.enableVirtualization && this.dataSource instanceof DataManager ? tempCount : this.totalItemCount;
12545
12576
  }
12546
12577
  else {
12547
12578
  var tempData = JSON.parse(JSON.stringify(this.listData));
@@ -12562,7 +12593,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12562
12593
  else if (this.listData && this.mainData && !dataChecks && this.allowCustomValue) {
12563
12594
  if (this.allowFiltering && this.isRemoteSelection && this.remoteCustomValue) {
12564
12595
  this.isRemoteSelection = false;
12565
- this.resetList(this.listData, field, query);
12596
+ if (!this.enableVirtualization) {
12597
+ this.resetList(this.listData, field, query);
12598
+ }
12566
12599
  }
12567
12600
  else if (!this.allowFiltering && this.list) {
12568
12601
  var liCollections = this.list.querySelectorAll('li.' + dropDownBaseClasses.li + ':not(.e-hide-listitem)');
@@ -12819,21 +12852,25 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12819
12852
  + dropDownBaseClasses.li + ':not(.' + HIDE_LIST + ')' + ':not(.e-reorder-hide)');
12820
12853
  var previousItem = steps >= 0 ? collection[steps + 1] : collection[0];
12821
12854
  if (this.enableVirtualization && isVirtualKeyAction) {
12822
- previousItem = steps >= 0 && this.viewPortInfo.startIndex != 0 ? this.liCollections[steps + this.skeletonCount + 1] : this.liCollections[this.skeletonCount];
12855
+ previousItem = (this.liCollections.length >= steps && steps >= 0) ? this.liCollections[steps] : this.liCollections[this.skeletonCount];
12823
12856
  }
12824
12857
  if (!isNullOrUndefined(previousItem) && previousItem.classList.contains('e-virtual-list')) {
12825
12858
  previousItem = this.liCollections[this.skeletonCount];
12826
12859
  }
12827
12860
  if (this.enableVirtualization) {
12828
12861
  if (!isNullOrUndefined(previousItem) && !previousItem.classList.contains('e-item-focus')) {
12862
+ this.isKeyBoardAction = true;
12829
12863
  this.addListFocus(previousItem);
12830
12864
  this.scrollTop(previousItem, this.getIndexByValue(previousItem.getAttribute('data-value')), this.keyboardEvent.keyCode);
12831
12865
  }
12832
12866
  else if (this.viewPortInfo.startIndex == 0) {
12867
+ this.isKeyBoardAction = true;
12833
12868
  this.scrollTop(previousItem, this.getIndexByValue(previousItem.getAttribute('data-value')), this.keyboardEvent.keyCode);
12834
12869
  }
12870
+ this.previousFocusItem = previousItem;
12835
12871
  }
12836
12872
  else {
12873
+ this.isKeyBoardAction = true;
12837
12874
  this.addListFocus(previousItem);
12838
12875
  this.scrollTop(previousItem, this.getIndexByValue(previousItem.getAttribute('data-value')), this.keyboardEvent.keyCode);
12839
12876
  }
@@ -12850,7 +12887,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
12850
12887
  if (this.enableVirtualization && isVirtualKeyAction) {
12851
12888
  previousItem = steps <= list.length ? this.liCollections[steps] : this.liCollections[list.length - 1];
12852
12889
  }
12890
+ this.isKeyBoardAction = true;
12853
12891
  this.addListFocus(previousItem);
12892
+ this.previousFocusItem = previousItem;
12854
12893
  this.scrollBottom(previousItem, this.getIndexByValue(previousItem.getAttribute('data-value')), false, this.keyboardEvent.keyCode);
12855
12894
  };
12856
12895
  MultiSelect.prototype.getItems = function () {
@@ -13039,18 +13078,16 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13039
13078
  case 33:
13040
13079
  e.preventDefault();
13041
13080
  if (focusedItem) {
13042
- var count = (this.getPageCount() * 2) - 4;
13043
- activeIndex = Math.round(count);
13044
- activeIndex = this.getIndexByValue(focusedItem.getAttribute('data-value'));
13045
- this.pageUpSelection(activeIndex - this.getPageCount(), true);
13081
+ activeIndex = this.getIndexByValue(this.previousFocusItem.getAttribute('data-value')) - 1;
13082
+ this.pageUpSelection(activeIndex, true);
13046
13083
  this.updateAriaAttribute();
13047
13084
  }
13048
13085
  break;
13049
13086
  case 34:
13050
13087
  e.preventDefault();
13051
13088
  if (focusedItem) {
13052
- activeIndex = this.getIndexByValue(focusedItem.getAttribute('data-value'));
13053
- this.pageDownSelection(activeIndex + this.getPageCount() + 1, true);
13089
+ activeIndex = this.getIndexByValue(this.previousFocusItem.getAttribute('data-value'));
13090
+ this.pageDownSelection(activeIndex, true);
13054
13091
  this.updateAriaAttribute();
13055
13092
  }
13056
13093
  break;
@@ -13086,11 +13123,11 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13086
13123
  else if (this.isPopupOpen()) {
13087
13124
  var focusedItem = this.list.querySelector('.' + dropDownBaseClasses.focus);
13088
13125
  var activeIndex = void 0;
13089
- this.isKeyBoardAction = true;
13090
13126
  switch (e.keyCode) {
13091
13127
  case 36:
13092
13128
  case 35:
13093
13129
  this.isMouseScrollAction = true;
13130
+ this.isKeyBoardAction = true;
13094
13131
  this.homeNavigation((e.keyCode === 36) ? true : false);
13095
13132
  break;
13096
13133
  case 33:
@@ -13104,19 +13141,22 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13104
13141
  case 34:
13105
13142
  e.preventDefault();
13106
13143
  if (focusedItem) {
13107
- this.getIndexByValue(focusedItem.getAttribute('data-value'));
13144
+ activeIndex = this.getIndexByValue(focusedItem.getAttribute('data-value'));
13108
13145
  this.pageDownSelection(activeIndex + this.getPageCount());
13109
13146
  this.updateAriaAttribute();
13110
13147
  }
13111
13148
  return;
13112
13149
  case 38:
13150
+ this.isKeyBoardAction = true;
13113
13151
  this.arrowUp(e);
13114
13152
  break;
13115
13153
  case 40:
13154
+ this.isKeyBoardAction = true;
13116
13155
  this.arrowDown(e);
13117
13156
  break;
13118
13157
  case 27:
13119
13158
  e.preventDefault();
13159
+ this.isKeyBoardAction = true;
13120
13160
  this.hidePopup(e);
13121
13161
  if (this.mode === 'CheckBox') {
13122
13162
  this.inputElement.focus();
@@ -13124,16 +13164,19 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13124
13164
  return;
13125
13165
  case 13:
13126
13166
  e.preventDefault();
13167
+ this.isKeyBoardAction = true;
13127
13168
  if (this.mode !== 'CheckBox') {
13128
13169
  this.selectByKey(e);
13129
13170
  }
13130
13171
  this.checkPlaceholderSize();
13131
13172
  return;
13132
13173
  case 32:
13174
+ this.isKeyBoardAction = true;
13133
13175
  this.spaceKeySelection(e);
13134
13176
  return;
13135
13177
  case 9:
13136
13178
  e.preventDefault();
13179
+ this.isKeyBoardAction = true;
13137
13180
  this.hidePopup(e);
13138
13181
  this.inputElement.focus();
13139
13182
  this.overAllWrapper.classList.add(FOCUS);
@@ -13334,7 +13377,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13334
13377
  this.isPreventKeyAction = false;
13335
13378
  this.isKeyBoardAction = false;
13336
13379
  this.isPreventScrollAction = false;
13337
- nextOffset = nextOffset + (selectedLI.offsetHeight * liCount);
13338
13380
  }
13339
13381
  this.list.scrollTop = nextOffset;
13340
13382
  }
@@ -13366,9 +13408,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13366
13408
  if (this.enableVirtualization && this.isKeyBoardAction && firstElementValue && currentElementValue === firstElementValue && keyCode != 36 && !this.isVirtualScrolling) {
13367
13409
  this.isUpwardScrolling = true;
13368
13410
  this.isPreventKeyAction = true;
13411
+ this.isKeyBoardAction = false;
13369
13412
  this.list.scrollTop -= selectedLI.offsetHeight * liCount;
13370
13413
  this.isPreventKeyAction = this.list.scrollTop != 0 ? this.isPreventKeyAction : false;
13371
- this.isKeyBoardAction = false;
13372
13414
  this.isPreventScrollAction = false;
13373
13415
  }
13374
13416
  else if (this.enableVirtualization && keyCode == 36) {
@@ -13382,7 +13424,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13382
13424
  this.isPreventKeyAction = false;
13383
13425
  this.isKeyBoardAction = false;
13384
13426
  this.isPreventScrollAction = false;
13385
- nextOffset = nextOffset - (selectedLI.offsetHeight * liCount);
13386
13427
  }
13387
13428
  this.list.scrollTop = this.list.scrollTop + nextOffset;
13388
13429
  }
@@ -13583,7 +13624,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13583
13624
  this.addListFocus(elements[temp]);
13584
13625
  }
13585
13626
  else {
13586
- this.addListFocus(elements[++temp]);
13627
+ if (this.enableVirtualization && elements[temp + 1].classList.contains('e-virtual-list')) {
13628
+ this.addListFocus(elements[this.skeletonCount]);
13629
+ }
13630
+ else {
13631
+ this.addListFocus(elements[++temp]);
13632
+ }
13587
13633
  }
13588
13634
  if (temp > -1) {
13589
13635
  this.updateCheck(elements[temp]);
@@ -13802,6 +13848,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
13802
13848
  removeVal = [];
13803
13849
  }
13804
13850
  removeVal.splice(index, 1);
13851
+ if (_this.enableVirtualization && _this.mode === 'CheckBox') {
13852
+ _this.selectedListData.splice(index, 1);
13853
+ }
13805
13854
  _this.setProperties({ value: [].concat([], removeVal) }, true);
13806
13855
  if (_this.enableVirtualization) {
13807
13856
  var currentText = index == 0 ? _this.text.replace(_this.text.split(_this.delimiterChar)[index] + _this.delimiterChar, '') : _this.text.replace(_this.delimiterChar + _this.text.split(_this.delimiterChar)[index], '');
@@ -14046,6 +14095,19 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14046
14095
  _this.listData = list;
14047
14096
  }
14048
14097
  value = _this.allowObjectBinding ? _this.getDataByValue(value) : value;
14098
+ if (_this.enableVirtualization) {
14099
+ if (isNullOrUndefined(_this.selectedListData)) {
14100
+ _this.selectedListData = [(_this.getDataByValue(value))];
14101
+ }
14102
+ else {
14103
+ if (Array.isArray(_this.selectedListData)) {
14104
+ _this.selectedListData.push((_this.getDataByValue(value)));
14105
+ }
14106
+ else {
14107
+ _this.selectedListData = [_this.selectedListData, (_this.getDataByValue(value))];
14108
+ }
14109
+ }
14110
+ }
14049
14111
  if ((_this.enableVirtualization && value) || !_this.enableVirtualization) {
14050
14112
  _this.updateListSelectEventCallback(value, element, eve);
14051
14113
  }
@@ -14237,7 +14299,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14237
14299
  this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);
14238
14300
  this.virtualItemCount = this.itemCount;
14239
14301
  if (this.mode !== 'CheckBox') {
14240
- this.totalItemCount = this.value && this.value.length ? this.totalItemCount - this.value.length : this.totalItemCount;
14302
+ this.totalItemsCount();
14241
14303
  }
14242
14304
  if (!this.list.querySelector('.e-virtual-ddl')) {
14243
14305
  var virualElement = this.createElement('div', {
@@ -14330,6 +14392,13 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14330
14392
  }
14331
14393
  _this.isPreventScrollAction = true;
14332
14394
  _this.setScrollPosition();
14395
+ if (!_this.list.classList.contains(dropDownBaseClasses.noData) && _this.getItems()[1] && _this.getItems()[1].offsetHeight !== 0) {
14396
+ _this.listItemHeight = _this.getItems()[1].offsetHeight;
14397
+ if (_this.list.getElementsByClassName('e-virtual-ddl-content')[0]) {
14398
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
14399
+ _this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = _this.getTransformValues();
14400
+ }
14401
+ }
14333
14402
  if (_this.allowFiltering) {
14334
14403
  _this.notify('inputFocus', {
14335
14404
  module: 'CheckBoxSelection', enable: _this.mode === 'CheckBox', value: 'focus'
@@ -14435,13 +14504,17 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14435
14504
  sentinelInfo: {},
14436
14505
  offsets: {},
14437
14506
  startIndex: 0,
14438
- endIndex: 0,
14507
+ endIndex: this.itemCount,
14439
14508
  };
14440
14509
  this.previousStartIndex = 0;
14441
14510
  this.previousEndIndex = 0;
14442
14511
  if (this.dataSource instanceof DataManager) {
14443
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
14444
- this.totalItemCount = this.dataCount = this.virtualGroupDataSource && this.virtualGroupDataSource.length ? this.virtualGroupDataSource.length : 0;
14512
+ if (this.remoteDataCount >= 0) {
14513
+ this.totalItemCount = this.dataCount = this.remoteDataCount;
14514
+ }
14515
+ else {
14516
+ this.resetList(this.dataSource);
14517
+ }
14445
14518
  }
14446
14519
  else {
14447
14520
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -14583,7 +14656,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14583
14656
  EventHandler.add(formElement, 'reset', this.resetValueHandler, this);
14584
14657
  }
14585
14658
  EventHandler.add(this.componentWrapper, 'mouseout', this.mouseOut, this);
14586
- EventHandler.add(this.overAllClear, 'mouseup', this.clearAll, this);
14659
+ EventHandler.add(this.overAllClear, 'mousedown', this.clearAll, this);
14587
14660
  EventHandler.add(this.inputElement, 'paste', this.pasteHandler, this);
14588
14661
  };
14589
14662
  MultiSelect.prototype.onInput = function (e) {
@@ -14627,9 +14700,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14627
14700
  if (this.allowCustomValue) {
14628
14701
  this.isRemoteSelection = true;
14629
14702
  }
14630
- if (!this.backCommand) {
14631
- this.checkAndResetCache();
14632
- }
14703
+ this.checkAndResetCache();
14633
14704
  var eventArgs_1 = {
14634
14705
  preventDefaultAction: false,
14635
14706
  text: this.targetElement(),
@@ -14658,12 +14729,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14658
14729
  var query = new Query();
14659
14730
  query = this.allowFiltering && (text !== '') ? query.where(this.fields.text, 'startswith', text, this.ignoreCase, this.ignoreAccent) : query;
14660
14731
  if (this.enableVirtualization) {
14661
- if (this.dataSource instanceof DataManager) {
14662
- this.dataUpdater(this.virtualGroupDataSource, query, this.fields);
14663
- }
14664
- else {
14665
- this.dataUpdater(this.dataSource, query, this.fields);
14666
- }
14732
+ this.dataUpdater(this.dataSource, query, this.fields);
14667
14733
  }
14668
14734
  else {
14669
14735
  this.dataUpdater(this.mainData, query, this.fields);
@@ -14822,6 +14888,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14822
14888
  var textValues = this.text != null && this.text != "" ? this.text + ',' + temp : temp;
14823
14889
  data += temp + delimiterChar + ' ';
14824
14890
  text.push(textValues);
14891
+ hiddenElementContent += "<option selected value=\"" + valueItem + "\">" + index + "</option>";
14825
14892
  break;
14826
14893
  }
14827
14894
  else {
@@ -14891,7 +14958,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14891
14958
  this.unwireListEvents();
14892
14959
  this.wireListEvents();
14893
14960
  };
14894
- MultiSelect.prototype.initialValueUpdate = function (listItems) {
14961
+ MultiSelect.prototype.initialValueUpdate = function (listItems, isInitialVirtualData) {
14895
14962
  if (this.list) {
14896
14963
  var text = void 0;
14897
14964
  var element = void 0;
@@ -14911,11 +14978,24 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14911
14978
  for (var i = 0; i < listItems.length; i++) {
14912
14979
  if (getValue((this.fields.value ? this.fields.value : 'value'), listItems[i]) === value) {
14913
14980
  text = getValue(this.fields.text, listItems[i]);
14981
+ if (this.enableVirtualization) {
14982
+ if (isNullOrUndefined(this.selectedListData)) {
14983
+ this.selectedListData = [listItems[i]];
14984
+ }
14985
+ else {
14986
+ if (Array.isArray(this.selectedListData)) {
14987
+ this.selectedListData.push((listItems[i]));
14988
+ }
14989
+ else {
14990
+ this.selectedListData = [this.selectedListData, (listItems[i])];
14991
+ }
14992
+ }
14993
+ }
14914
14994
  break;
14915
14995
  }
14916
14996
  }
14917
14997
  }
14918
- if (isNullOrUndefined(text) && this.allowCustomValue) {
14998
+ if ((isNullOrUndefined(text) && this.allowCustomValue) && ((!(this.dataSource instanceof DataManager)) || (this.dataSource instanceof DataManager && isInitialVirtualData))) {
14919
14999
  text = this.getTextByValue(value);
14920
15000
  isCustomData = true;
14921
15001
  }
@@ -14933,13 +15013,15 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
14933
15013
  this.addChip(text, value);
14934
15014
  this.addListSelection(element);
14935
15015
  }
14936
- else if (value && this.allowCustomValue) {
15016
+ else if ((!this.enableVirtualization && value && this.allowCustomValue) || ((this.enableVirtualization && value && this.allowCustomValue) && ((!(this.dataSource instanceof DataManager)) || (this.dataSource instanceof DataManager && isInitialVirtualData)))) {
14937
15017
  var indexItem = this.listData.length;
14938
15018
  var newValue = {};
14939
15019
  setValue(this.fields.text, value, newValue);
14940
15020
  setValue(this.fields.value, value, newValue);
14941
15021
  var noDataEle = this.popupWrapper.querySelector('.' + dropDownBaseClasses.noData);
14942
- this.addItem(newValue, indexItem);
15022
+ if (!this.enableVirtualization) {
15023
+ this.addItem(newValue, indexItem);
15024
+ }
14943
15025
  if (this.enableVirtualization) {
14944
15026
  if (this.virtualCustomSelectData && this.virtualCustomSelectData.length >= 0) {
14945
15027
  this.virtualCustomSelectData.push(newValue);
@@ -16277,8 +16359,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16277
16359
  MultiSelect.prototype.totalItemsCount = function () {
16278
16360
  var dataSourceCount;
16279
16361
  if (this.dataSource instanceof DataManager) {
16280
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
16281
- dataSourceCount = this.virtualGroupDataSource && this.virtualGroupDataSource.length ? this.virtualGroupDataSource.length : 0;
16362
+ if (this.remoteDataCount >= 0) {
16363
+ dataSourceCount = this.totalItemCount = this.dataCount = this.remoteDataCount;
16364
+ }
16365
+ else {
16366
+ this.resetList(this.dataSource);
16367
+ }
16282
16368
  }
16283
16369
  else {
16284
16370
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -16288,7 +16374,26 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16288
16374
  this.totalItemCount = dataSourceCount != 0 ? dataSourceCount : this.totalItemCount;
16289
16375
  }
16290
16376
  else {
16291
- this.totalItemCount = dataSourceCount != 0 ? dataSourceCount - this.value.length : this.totalItemCount;
16377
+ if (this.hideSelectedItem) {
16378
+ this.totalItemCount = dataSourceCount != 0 && this.value ? dataSourceCount - this.value.length : this.totalItemCount;
16379
+ if (this.allowCustomValue && this.virtualCustomSelectData && this.virtualCustomSelectData.length > 0) {
16380
+ for (var i = 0; i < this.virtualCustomSelectData.length; i++) {
16381
+ for (var j = 0; j < this.value.length; j++) {
16382
+ var value = this.allowObjectBinding ? getValue((this.fields.value) ? this.fields.value : '', this.value[j]) : this.value[j];
16383
+ var customValue = getValue((this.fields.value) ? this.fields.value : '', this.virtualCustomSelectData[i]);
16384
+ if (value === customValue) {
16385
+ this.totalItemCount += 1;
16386
+ }
16387
+ }
16388
+ }
16389
+ }
16390
+ }
16391
+ else {
16392
+ this.totalItemCount = dataSourceCount != 0 ? dataSourceCount : this.totalItemCount;
16393
+ if (this.allowCustomValue && this.virtualCustomSelectData && this.virtualCustomSelectData.length > 0) {
16394
+ this.totalItemCount += this.virtualCustomSelectData.length;
16395
+ }
16396
+ }
16292
16397
  }
16293
16398
  };
16294
16399
  MultiSelect.prototype.presentItemValue = function (ulElement) {
@@ -16327,7 +16432,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16327
16432
  valuecheck = this.presentItemValue(this.ulElement);
16328
16433
  }
16329
16434
  if (prop == 'value' && valuecheck.length > 0 && this.dataSource instanceof DataManager && !isNullOrUndefined(this.value)
16330
- && this.listData != null) {
16435
+ && this.listData != null && !this.enableVirtualization) {
16331
16436
  this.mainData = null;
16332
16437
  this.setDynValue = true;
16333
16438
  this.addNonPresentItems(valuecheck, this.ulElement, this.listData);
@@ -16346,7 +16451,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16346
16451
  var list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
16347
16452
  this.onActionComplete(list, this.mainData);
16348
16453
  }
16349
- this.initialValueUpdate();
16454
+ if (!this.enableVirtualization || (this.enableVirtualization && (!(this.dataSource instanceof DataManager)))) {
16455
+ this.initialValueUpdate();
16456
+ }
16350
16457
  if (this.mode !== 'Box' && !this.inputFocus) {
16351
16458
  this.updateDelimView();
16352
16459
  }
@@ -16399,6 +16506,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16399
16506
  }
16400
16507
  _this.beforePopupOpen = false;
16401
16508
  _this.overAllWrapper.classList.remove(iconAnimation);
16509
+ var typedValue = _this.mode == 'CheckBox' ? _this.targetElement() : null;
16402
16510
  _this.popupObj.hide(new Animation(eventArgs.animation));
16403
16511
  attributes(_this.inputElement, { 'aria-expanded': 'false' });
16404
16512
  _this.inputElement.removeAttribute('aria-owns');
@@ -16412,22 +16520,27 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16412
16520
  if (_this.mode === 'CheckBox' && _this.showSelectAll) {
16413
16521
  EventHandler.remove(_this.popupObj.element, 'click', _this.clickHandler);
16414
16522
  }
16415
- if (_this.enableVirtualization && _this.mode === 'CheckBox' && _this.enableSelectionOrder) {
16523
+ if (_this.enableVirtualization && _this.mode === 'CheckBox' && _this.value && _this.value.length > 0 && _this.enableSelectionOrder) {
16416
16524
  _this.viewPortInfo.startIndex = _this.virtualItemStartIndex = 0;
16417
16525
  _this.viewPortInfo.endIndex = _this.virtualItemEndIndex = _this.viewPortInfo.startIndex > 0 ? _this.viewPortInfo.endIndex : _this.itemCount;
16526
+ _this.virtualListInfo = _this.viewPortInfo;
16418
16527
  _this.previousStartIndex = 0;
16419
16528
  _this.previousEndIndex = 0;
16420
16529
  }
16421
16530
  var dataSourceCount = void 0;
16422
16531
  if (_this.dataSource instanceof DataManager) {
16423
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
16424
- dataSourceCount = _this.virtualGroupDataSource && _this.virtualGroupDataSource.length ? _this.virtualGroupDataSource.length : 0;
16532
+ if (_this.remoteDataCount >= 0) {
16533
+ _this.totalItemCount = _this.dataCount = _this.remoteDataCount;
16534
+ }
16535
+ else {
16536
+ _this.resetList(_this.dataSource);
16537
+ }
16425
16538
  }
16426
16539
  else {
16427
16540
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
16428
16541
  dataSourceCount = _this.dataSource && _this.dataSource.length ? _this.dataSource.length : 0;
16429
16542
  }
16430
- if (_this.enableVirtualization && (_this.allowFiltering || _this.allowCustomValue) && _this.value != null && _this.targetElement() && _this.totalItemCount !== dataSourceCount) {
16543
+ if (_this.enableVirtualization && (_this.allowFiltering || _this.allowCustomValue) && (_this.targetElement() || typedValue) && _this.totalItemCount !== dataSourceCount) {
16431
16544
  _this.updateInitialData();
16432
16545
  _this.checkAndResetCache();
16433
16546
  }
@@ -16762,8 +16875,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16762
16875
  if (this.dataSource instanceof DataManager) {
16763
16876
  this.dataSource.executeQuery(new Query().where(predicate))
16764
16877
  .then(function (e) {
16765
- if (e.result.result.length > 0) {
16766
- listItems_2 = e.result.result;
16878
+ if (e.result.length > 0) {
16879
+ listItems_2 = e.result;
16880
+ _this.initStatus = false;
16881
+ _this.initialValueUpdate(listItems_2, true);
16882
+ _this.initialUpdate();
16883
+ _this.initStatus = true;
16767
16884
  }
16768
16885
  });
16769
16886
  }
@@ -16778,7 +16895,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
16778
16895
  else {
16779
16896
  this.setInitialValue = function () {
16780
16897
  _this.initStatus = false;
16781
- _this.initialValueUpdate(listItems_2);
16898
+ if (!_this.enableVirtualization || (_this.enableVirtualization && (!(_this.dataSource instanceof DataManager)))) {
16899
+ _this.initialValueUpdate(listItems_2);
16900
+ }
16782
16901
  _this.initialUpdate();
16783
16902
  _this.setInitialValue = null;
16784
16903
  _this.initStatus = true;
@@ -19317,12 +19436,6 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
19317
19436
  tListBox.ulElement.removeChild(noRecElem);
19318
19437
  }
19319
19438
  }
19320
- if (isRefresh) {
19321
- var noRecElem = fListBox.ulElement.childNodes[0];
19322
- if (noRecElem) {
19323
- fListBox.ulElement.removeChild(noRecElem);
19324
- }
19325
- }
19326
19439
  if (fListBox.listData.length > 0) {
19327
19440
  // eslint-disable-next-line prefer-spread
19328
19441
  flistboxarray = Array.apply(null, { length: fListBox.ulElement.childElementCount }).map(Number.call, Number);
@@ -19368,6 +19481,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
19368
19481
  tListBox.liCollections = tliCollections.concat(fliCollections);
19369
19482
  }
19370
19483
  fListBox.value = [];
19484
+ listData = listData.filter(function (data) { return (data !== undefined); });
19371
19485
  listData = listData
19372
19486
  .filter(function (data) { return data.isHeader !== true; });
19373
19487
  var sortedData = listData.filter(function (val) {