@syncfusion/ej2-dropdowns 34.1.29 → 34.1.30

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.
@@ -266,6 +266,7 @@ var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _argume
266
266
  };
267
267
  class VirtualScroll {
268
268
  constructor(parent) {
269
+ this.previousScrollTop = 0;
269
270
  this.sentinelInfo = {
270
271
  'up': {
271
272
  check: (rect, info) => {
@@ -325,9 +326,14 @@ class VirtualScroll {
325
326
  getModuleName() {
326
327
  return 'VirtualScroll';
327
328
  }
329
+ isFilterScrollScenario() {
330
+ return this.component === 'dropdownlist' && this.parent.allowFiltering;
331
+ }
328
332
  popupScrollHandler() {
329
333
  this.parent.isMouseScrollAction = true;
330
- this.parent.isPreventScrollAction = false;
334
+ if (!(this.isFilterScrollScenario() && this.parent.isVirtualScrolling)) {
335
+ this.parent.isPreventScrollAction = false;
336
+ }
331
337
  }
332
338
  getPageQuery(query, virtualStartIndex, virtualEndIndex) {
333
339
  if (virtualEndIndex !== 0 && !this.parent.allowFiltering && this.component !== 'autocomplete') {
@@ -685,7 +691,8 @@ class VirtualScroll {
685
691
  });
686
692
  }
687
693
  scrollListener(scrollArgs) {
688
- if (!this.parent.isPreventScrollAction && !this.parent.isVirtualTrackHeight) {
694
+ const preventReentrant = this.isFilterScrollScenario() && this.parent.isVirtualScrolling;
695
+ if (!this.parent.isPreventScrollAction && !this.parent.isVirtualTrackHeight && !preventReentrant) {
689
696
  this.parent.preventSetCurrentData = false;
690
697
  const info = scrollArgs.sentinel;
691
698
  const pStartIndex = this.parent.previousStartIndex;
@@ -697,6 +704,8 @@ class VirtualScroll {
697
704
  this.parent.virtualListInfo = Object.assign({}, this.parent.viewPortInfo);
698
705
  this.parent.isPreventKeyAction = true;
699
706
  this.parent.isVirtualScrolling = true;
707
+ const savedScrollTop = this.parent.popupContentElement ?
708
+ this.parent.popupContentElement.scrollTop : 0;
700
709
  setTimeout(() => {
701
710
  this.parent.pageCount = this.parent.getPageCount();
702
711
  this.parent.isRequesting = false;
@@ -706,9 +715,16 @@ class VirtualScroll {
706
715
  this.parent.updateSelectionList();
707
716
  this.parent.liCollections = this.parent.getItems();
708
717
  }
718
+ if (this.isFilterScrollScenario()) {
719
+ const scrollContainer = this.parent.popupContentElement || this.parent.list;
720
+ if (scrollContainer && scrollContainer.scrollTop < savedScrollTop) {
721
+ scrollContainer.scrollTop = savedScrollTop;
722
+ }
723
+ this.previousScrollTop = scrollContainer ? scrollContainer.scrollTop : savedScrollTop;
724
+ }
709
725
  this.parent.isKeyBoardAction = false;
710
- this.parent.isVirtualScrolling = false;
711
726
  this.parent.isPreventKeyAction = false;
727
+ this.parent.isVirtualScrolling = false;
712
728
  });
713
729
  }, 5);
714
730
  }
@@ -781,14 +797,17 @@ class VirtualScroll {
781
797
  }
782
798
  virtualScrollHandler(callback) {
783
799
  const delay = Browser.info.name === 'chrome' ? 200 : 100;
784
- let prevTop = 0;
785
800
  const debounced100 = debounce(callback, delay);
786
801
  const debounced50 = debounce(callback, 50);
787
802
  return (e) => {
788
803
  const top = e.target.scrollTop;
789
804
  const left = e.target.scrollLeft;
790
- const direction = prevTop < top && !this.parent.isUpwardScrolling ? 'down' : 'up';
791
- prevTop = top;
805
+ if (this.isFilterScrollScenario() && (this.parent.isVirtualScrolling || this.parent.isPreventScrollAction)) {
806
+ this.previousScrollTop = top;
807
+ return;
808
+ }
809
+ const direction = this.previousScrollTop < top && !this.parent.isUpwardScrolling ? 'down' : 'up';
810
+ this.previousScrollTop = top;
792
811
  const current = this.sentinelInfo[direction];
793
812
  const pstartIndex = this.parent.scrollPreStartIndex;
794
813
  const scrollOffsetargs = {
@@ -4726,7 +4745,7 @@ let DropDownList = class DropDownList extends DropDownBase {
4726
4745
  }
4727
4746
  }
4728
4747
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
4729
- setValue(e) {
4748
+ setValue(e, autofill) {
4730
4749
  const dataItem = this.getItemData();
4731
4750
  this.isTouched = !isNullOrUndefined(e);
4732
4751
  if (dataItem.value === null) {
@@ -4758,7 +4777,7 @@ let DropDownList = class DropDownList extends DropDownBase {
4758
4777
  (this.previousValue != null && this.isObjectInArray(this.previousValue, [this.allowCustom &&
4759
4778
  this.isObjectCustomValue ? this.value ? this.value : dataItem : dataItem.value ?
4760
4779
  this.getDataByValue(dataItem.value) : dataItem])))) {
4761
- if (this.getModuleName() === 'combobox' && this.autoFill && e && (e.type === 'click' || e.action === 'enter')) {
4780
+ if (this.getModuleName() === 'combobox' && autofill && e && (e.type === 'click' || e.action === 'enter')) {
4762
4781
  return false;
4763
4782
  }
4764
4783
  this.isSelected = false;
@@ -12017,7 +12036,7 @@ let ComboBox = class ComboBox extends DropDownList {
12017
12036
  return false;
12018
12037
  }
12019
12038
  else {
12020
- return super.setValue(e);
12039
+ return super.setValue(e, this.autofill);
12021
12040
  }
12022
12041
  }
12023
12042
  checkCustomValue() {
@@ -13869,49 +13888,154 @@ let MultiSelect = class MultiSelect extends DropDownBase {
13869
13888
  getForQuery(valuecheck, isCheckbox) {
13870
13889
  let predicate;
13871
13890
  const field = this.isPrimitiveData ? '' : this.fields.value;
13872
- if (this.enableVirtualization && valuecheck) {
13873
- if (isCheckbox) {
13874
- const startindex = this.viewPortInfo.startIndex;
13875
- const endindex = (((startindex + this.viewPortInfo.endIndex) <= (valuecheck.length)) &&
13876
- valuecheck[(startindex + this.viewPortInfo.endIndex)]) &&
13877
- (this.dataSource instanceof DataManager && this.totalItemCount !== 0 && this.totalItemCount > (this.itemCount * 2))
13878
- ? (startindex + this.viewPortInfo.endIndex)
13879
- : (valuecheck.length);
13880
- for (let i = startindex; i < endindex; i++) {
13881
- const value = this.allowObjectBinding ? getValue((this.fields.value) ?
13882
- this.fields.value : '', valuecheck[i]) : valuecheck[i];
13883
- if (i === startindex) {
13884
- predicate = new Predicate(field, 'equal', (value));
13891
+ if (valuecheck && valuecheck.length >= 3000) {
13892
+ // Batch size to prevent stack overflow with large preselected values (EJ2-Fix-MaxCallStack)
13893
+ const BATCH_SIZE = 100;
13894
+ if (this.enableVirtualization) {
13895
+ if (isCheckbox) {
13896
+ const startindex = this.viewPortInfo.startIndex;
13897
+ const endindex = (((startindex + this.viewPortInfo.endIndex) <= (valuecheck.length)) &&
13898
+ valuecheck[(startindex + this.viewPortInfo.endIndex)]) &&
13899
+ (this.dataSource instanceof DataManager && this.totalItemCount !== 0 && this.totalItemCount > (this.itemCount * 2))
13900
+ ? (startindex + this.viewPortInfo.endIndex)
13901
+ : (valuecheck.length);
13902
+ // Build predicates in batches to prevent stack overflow
13903
+ const predicateBatches = [];
13904
+ for (let batchStart = startindex; batchStart < endindex; batchStart += BATCH_SIZE) {
13905
+ let batchPredicate;
13906
+ const batchEnd = Math.min(batchStart + BATCH_SIZE, endindex);
13907
+ for (let i = batchStart; i < batchEnd; i++) {
13908
+ const itemAtIndex = valuecheck[i];
13909
+ const value = this.allowObjectBinding ? getValue((this.fields.value) ?
13910
+ this.fields.value : '', itemAtIndex) : itemAtIndex;
13911
+ if (i === batchStart) {
13912
+ batchPredicate = new Predicate(field, 'equal', (value));
13913
+ }
13914
+ else {
13915
+ batchPredicate = batchPredicate.or(field, 'equal', (value));
13916
+ }
13917
+ }
13918
+ predicateBatches.push(batchPredicate);
13885
13919
  }
13886
- else {
13887
- predicate = predicate.or(field, 'equal', (value));
13920
+ // Combine all batch predicates
13921
+ predicate = predicateBatches[0];
13922
+ for (let i = 1; i < predicateBatches.length; i++) {
13923
+ predicate = predicate.or(predicateBatches[i]);
13888
13924
  }
13925
+ return new Query().where(predicate);
13926
+ }
13927
+ else {
13928
+ // Build predicates in batches to prevent stack overflow
13929
+ const predicateBatches = [];
13930
+ const isAddNonPresentItems = this.isaddNonPresentItems;
13931
+ for (let batchStart = 0; batchStart < valuecheck.length; batchStart += BATCH_SIZE) {
13932
+ let batchPredicate;
13933
+ const batchEnd = Math.min(batchStart + BATCH_SIZE, valuecheck.length);
13934
+ for (let i = batchStart; i < batchEnd; i++) {
13935
+ const itemAtIndex = valuecheck[i];
13936
+ const value = this.allowObjectBinding ? getValue((this.fields.value) ?
13937
+ this.fields.value : '', itemAtIndex) : itemAtIndex;
13938
+ if (i === batchStart) {
13939
+ if (isAddNonPresentItems) {
13940
+ batchPredicate = new Predicate(field, 'equal', itemAtIndex);
13941
+ }
13942
+ else {
13943
+ batchPredicate = new Predicate(field, 'notequal', (value));
13944
+ }
13945
+ }
13946
+ else {
13947
+ if (isAddNonPresentItems) {
13948
+ batchPredicate = batchPredicate.or(field, 'equal', itemAtIndex);
13949
+ }
13950
+ else {
13951
+ batchPredicate = batchPredicate.and(field, 'notequal', (value));
13952
+ }
13953
+ }
13954
+ }
13955
+ predicateBatches.push(batchPredicate);
13956
+ }
13957
+ // Combine batch predicates
13958
+ predicate = predicateBatches[0];
13959
+ for (let i = 1; i < predicateBatches.length; i++) {
13960
+ if (isAddNonPresentItems) {
13961
+ predicate = predicate.or(predicateBatches[i]);
13962
+ }
13963
+ else {
13964
+ predicate = predicate.and(predicateBatches[i]);
13965
+ }
13966
+ }
13967
+ return new Query().where(predicate);
13889
13968
  }
13890
- return new Query().where(predicate);
13891
13969
  }
13892
13970
  else {
13893
- for (let i = 0; i < valuecheck.length; i++) {
13894
- const value = this.allowObjectBinding ? getValue((this.fields.value) ?
13895
- this.fields.value : '', valuecheck[i]) : valuecheck[i];
13896
- if (this.isaddNonPresentItems) {
13897
- predicate = i === 0 ? new Predicate(field, 'equal', valuecheck[i])
13898
- : predicate.or(field, 'equal', valuecheck[i]);
13899
- }
13900
- else {
13901
- predicate = i === 0 ? predicate = new Predicate(field, 'notequal', (value))
13902
- : predicate.and(field, 'notequal', (value));
13971
+ // Build predicates in batches to prevent stack overflow with large preselected values
13972
+ const predicateBatches = [];
13973
+ for (let batchStart = 0; batchStart < valuecheck.length; batchStart += BATCH_SIZE) {
13974
+ let batchPredicate;
13975
+ const batchEnd = Math.min(batchStart + BATCH_SIZE, valuecheck.length);
13976
+ for (let i = batchStart; i < batchEnd; i++) {
13977
+ const itemAtIndex = valuecheck[i];
13978
+ if (i === batchStart) {
13979
+ batchPredicate = new Predicate(field, 'equal', itemAtIndex);
13980
+ }
13981
+ else {
13982
+ batchPredicate = batchPredicate.or(field, 'equal', itemAtIndex);
13983
+ }
13903
13984
  }
13985
+ predicateBatches.push(batchPredicate);
13986
+ }
13987
+ // Combine all batch predicates
13988
+ predicate = predicateBatches[0];
13989
+ for (let i = 1; i < predicateBatches.length; i++) {
13990
+ predicate = predicate.or(predicateBatches[i]);
13904
13991
  }
13905
- return new Query().where(predicate);
13906
13992
  }
13907
13993
  }
13908
13994
  else {
13909
- for (let i = 0; i < valuecheck.length; i++) {
13910
- if (i === 0) {
13911
- predicate = new Predicate(field, 'equal', valuecheck[i]);
13995
+ if (this.enableVirtualization && valuecheck) {
13996
+ if (isCheckbox) {
13997
+ const startindex = this.viewPortInfo.startIndex;
13998
+ const endindex = (((startindex + this.viewPortInfo.endIndex) <= (valuecheck.length)) &&
13999
+ valuecheck[(startindex + this.viewPortInfo.endIndex)]) &&
14000
+ (this.dataSource instanceof DataManager && this.totalItemCount !== 0 && this.totalItemCount > (this.itemCount * 2))
14001
+ ? (startindex + this.viewPortInfo.endIndex)
14002
+ : (valuecheck.length);
14003
+ for (let i = startindex; i < endindex; i++) {
14004
+ const value = this.allowObjectBinding ? getValue((this.fields.value) ?
14005
+ this.fields.value : '', valuecheck[i]) : valuecheck[i];
14006
+ if (i === startindex) {
14007
+ predicate = new Predicate(field, 'equal', (value));
14008
+ }
14009
+ else {
14010
+ predicate = predicate.or(field, 'equal', (value));
14011
+ }
14012
+ }
14013
+ return new Query().where(predicate);
13912
14014
  }
13913
14015
  else {
13914
- predicate = predicate.or(field, 'equal', valuecheck[i]);
14016
+ for (let i = 0; i < valuecheck.length; i++) {
14017
+ const value = this.allowObjectBinding ? getValue((this.fields.value) ?
14018
+ this.fields.value : '', valuecheck[i]) : valuecheck[i];
14019
+ if (this.isaddNonPresentItems) {
14020
+ predicate = i === 0 ? new Predicate(field, 'equal', valuecheck[i])
14021
+ : predicate.or(field, 'equal', valuecheck[i]);
14022
+ }
14023
+ else {
14024
+ predicate = i === 0 ? predicate = new Predicate(field, 'notequal', (value))
14025
+ : predicate.and(field, 'notequal', (value));
14026
+ }
14027
+ }
14028
+ return new Query().where(predicate);
14029
+ }
14030
+ }
14031
+ else {
14032
+ for (let i = 0; i < valuecheck.length; i++) {
14033
+ if (i === 0) {
14034
+ predicate = new Predicate(field, 'equal', valuecheck[i]);
14035
+ }
14036
+ else {
14037
+ predicate = predicate.or(field, 'equal', valuecheck[i]);
14038
+ }
13915
14039
  }
13916
14040
  }
13917
14041
  }
@@ -16171,6 +16295,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
16171
16295
  }
16172
16296
  }
16173
16297
  }
16298
+ isFilteringWithRemoteData() {
16299
+ return !isNullOrUndefined(this.mainData) && this.mainData.length > 0 && this.allowFiltering;
16300
+ }
16174
16301
  removeChip(value, isClearAll) {
16175
16302
  if (this.chipCollectionWrapper) {
16176
16303
  if (!(this.enableVirtualization && isClearAll)) {
@@ -17366,6 +17493,9 @@ let MultiSelect = class MultiSelect extends DropDownBase {
17366
17493
  getValue(((this.fields.value) ? this.fields.value : ''), this.value[index]) :
17367
17494
  this.value[index];
17368
17495
  element = this.findListElement(this.hideSelectedItem ? this.ulElement : this.list, 'li', 'data-value', value);
17496
+ if (!element && !isNullOrUndefined(this.mainList) && this.isFilteringWithRemoteData()) {
17497
+ element = this.findListElement(this.mainList, 'li', 'data-value', value);
17498
+ }
17369
17499
  let isCustomData = false;
17370
17500
  if (this.enableVirtualization) {
17371
17501
  text = null;
@@ -17412,6 +17542,12 @@ let MultiSelect = class MultiSelect extends DropDownBase {
17412
17542
  }
17413
17543
  else {
17414
17544
  text = this.getTextByValue(value);
17545
+ if (text === value && this.isFilteringWithRemoteData()) {
17546
+ const savedListData = this.listData;
17547
+ this.listData = this.mainData;
17548
+ text = this.getTextByValue(value);
17549
+ this.listData = savedListData;
17550
+ }
17415
17551
  }
17416
17552
  if (((element && (element.getAttribute('aria-selected') !== 'true')) ||
17417
17553
  (element && (element.getAttribute('aria-selected') === 'true' && this.hideSelectedItem) &&
@@ -19680,6 +19816,8 @@ let MultiSelect = class MultiSelect extends DropDownBase {
19680
19816
  this.chipCollectionWrapper = this.createElement('span', {
19681
19817
  className: CHIP_WRAPPER$1
19682
19818
  });
19819
+ this.chipCollectionWrapper.setAttribute('role', 'listbox');
19820
+ this.chipCollectionWrapper.setAttribute('aria-label', 'multiselect');
19683
19821
  this.chipCollectionWrapper.style.display = 'none';
19684
19822
  if (this.mode === 'Default') {
19685
19823
  this.chipCollectionWrapper.setAttribute('id', getUniqueID('chip_default'));