@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.
- package/dist/ej2-dropdowns.min.js +2 -2
- package/dist/ej2-dropdowns.umd.min.js +2 -2
- package/dist/ej2-dropdowns.umd.min.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es2015.js +178 -40
- package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es5.js +178 -40
- package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
- package/dist/global/ej2-dropdowns.min.js +2 -2
- package/dist/global/ej2-dropdowns.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +5 -5
- package/src/combo-box/combo-box.js +1 -1
- package/src/common/virtual-scroll.d.ts +2 -0
- package/src/common/virtual-scroll.js +25 -6
- package/src/drop-down-list/drop-down-list.d.ts +1 -1
- package/src/drop-down-list/drop-down-list.js +2 -2
- package/src/multi-select/multi-select.d.ts +1 -0
- package/src/multi-select/multi-select.js +150 -31
|
@@ -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.
|
|
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
|
-
|
|
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
|
-
|
|
791
|
-
|
|
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' &&
|
|
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 (
|
|
13873
|
-
|
|
13874
|
-
|
|
13875
|
-
|
|
13876
|
-
|
|
13877
|
-
|
|
13878
|
-
|
|
13879
|
-
|
|
13880
|
-
|
|
13881
|
-
|
|
13882
|
-
|
|
13883
|
-
|
|
13884
|
-
|
|
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
|
-
|
|
13887
|
-
|
|
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
|
-
|
|
13894
|
-
|
|
13895
|
-
|
|
13896
|
-
|
|
13897
|
-
|
|
13898
|
-
|
|
13899
|
-
|
|
13900
|
-
|
|
13901
|
-
|
|
13902
|
-
|
|
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
|
-
|
|
13910
|
-
if (
|
|
13911
|
-
|
|
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
|
-
|
|
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'));
|