@syncfusion/ej2-lists 26.2.10 → 26.2.14
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-lists.min.js +2 -2
- package/dist/ej2-lists.umd.min.js +2 -2
- package/dist/ej2-lists.umd.min.js.map +1 -1
- package/dist/es6/ej2-lists.es2015.js +86 -18
- package/dist/es6/ej2-lists.es2015.js.map +1 -1
- package/dist/es6/ej2-lists.es5.js +93 -24
- package/dist/es6/ej2-lists.es5.js.map +1 -1
- package/dist/global/ej2-lists.min.js +2 -2
- package/dist/global/ej2-lists.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +7 -7
- package/src/list-view/list-view.d.ts +1 -1
- package/src/list-view/list-view.js +50 -5
- package/src/list-view/virtualization.d.ts +1 -0
- package/src/list-view/virtualization.js +43 -19
- package/hotfix/26.1.35_Vol2.txt +0 -1
package/dist/global/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* filename: index.d.ts
|
|
3
|
-
* version : 26.2.
|
|
3
|
+
* version : 26.2.14
|
|
4
4
|
* Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
|
|
5
5
|
* Use of this code is subject to the terms of our license.
|
|
6
6
|
* A copy of the current license can be obtained at any time by e-mailing
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"_from": "@syncfusion/ej2-lists@*",
|
|
3
|
-
"_id": "@syncfusion/ej2-lists@26.2.
|
|
3
|
+
"_id": "@syncfusion/ej2-lists@26.2.11",
|
|
4
4
|
"_inBundle": false,
|
|
5
|
-
"_integrity": "sha512-
|
|
5
|
+
"_integrity": "sha512-yo1HOlO0dHRPbZd8hjUaGhEQ67pOUGo53jAw5GxNQfh5I1B9U6hC2RnbT6MIOHP7b15OelWakWjpIR5AhOJKJA==",
|
|
6
6
|
"_location": "/@syncfusion/ej2-lists",
|
|
7
7
|
"_phantomChildren": {},
|
|
8
8
|
"_requested": {
|
|
@@ -35,8 +35,8 @@
|
|
|
35
35
|
"/@syncfusion/ej2-schedule",
|
|
36
36
|
"/@syncfusion/ej2-vue-lists"
|
|
37
37
|
],
|
|
38
|
-
"_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-lists/-/ej2-lists-26.2.
|
|
39
|
-
"_shasum": "
|
|
38
|
+
"_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-lists/-/ej2-lists-26.2.11.tgz",
|
|
39
|
+
"_shasum": "2e63a389c4a6364d3c7002ba5bdad90624c98033",
|
|
40
40
|
"_spec": "@syncfusion/ej2-lists@*",
|
|
41
41
|
"_where": "/jenkins/workspace/elease-automation_release_26.1.1/packages/included",
|
|
42
42
|
"author": {
|
|
@@ -46,8 +46,8 @@
|
|
|
46
46
|
"dependencies": {
|
|
47
47
|
"@syncfusion/ej2-base": "~26.2.10",
|
|
48
48
|
"@syncfusion/ej2-buttons": "~26.2.10",
|
|
49
|
-
"@syncfusion/ej2-data": "~26.2.
|
|
50
|
-
"@syncfusion/ej2-popups": "~26.2.
|
|
49
|
+
"@syncfusion/ej2-data": "~26.2.14",
|
|
50
|
+
"@syncfusion/ej2-popups": "~26.2.11"
|
|
51
51
|
},
|
|
52
52
|
"deprecated": false,
|
|
53
53
|
"description": "The listview control allows you to select an item or multiple items from a list-like interface and represents the data in interactive hierarchical structure across different layouts or views.",
|
|
@@ -87,7 +87,7 @@
|
|
|
87
87
|
"url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/lists"
|
|
88
88
|
},
|
|
89
89
|
"typings": "index.d.ts",
|
|
90
|
-
"version": "26.2.
|
|
90
|
+
"version": "26.2.14",
|
|
91
91
|
"sideEffects": false,
|
|
92
92
|
"homepage": "https://www.syncfusion.com/javascript-ui-controls"
|
|
93
93
|
}
|
|
@@ -445,6 +445,7 @@ export declare class ListView extends Component<HTMLElement> implements INotifyP
|
|
|
445
445
|
* Refresh the height of the list item only on enabling the virtualization property.
|
|
446
446
|
*/
|
|
447
447
|
refreshItemHeight(): void;
|
|
448
|
+
private handleCheckboxState;
|
|
448
449
|
targetElement: Element;
|
|
449
450
|
private clickHandler;
|
|
450
451
|
private removeElement;
|
|
@@ -665,7 +666,6 @@ export interface ListSelectedItem {
|
|
|
665
666
|
* ```props
|
|
666
667
|
* Top:- The scrollbar is moved upwards.
|
|
667
668
|
* Bottom:- The scrollbar is moved downwards.
|
|
668
|
-
|
|
669
669
|
* ```
|
|
670
670
|
*/
|
|
671
671
|
export declare type direction = 'Top' | 'Bottom';
|
|
@@ -228,6 +228,7 @@ var ListView = /** @class */ (function (_super) {
|
|
|
228
228
|
}
|
|
229
229
|
break;
|
|
230
230
|
case 'dataSource':
|
|
231
|
+
this.previousScrollTop = this.element.scrollTop;
|
|
231
232
|
if (this.enableVirtualization) {
|
|
232
233
|
this.virtualizationModule.reRenderUiVirtualization();
|
|
233
234
|
}
|
|
@@ -626,6 +627,28 @@ var ListView = /** @class */ (function (_super) {
|
|
|
626
627
|
this.virtualizationModule.refreshItemHeight();
|
|
627
628
|
}
|
|
628
629
|
};
|
|
630
|
+
ListView.prototype.handleCheckboxState = function (li, checkIcon, checkboxElement, isCheckedBefore, isFocusedBefore, eventArgs, isSetCheckboxLI, textAreaFocus) {
|
|
631
|
+
this.trigger('select', eventArgs, function (observedArgs) {
|
|
632
|
+
if (observedArgs.cancel) {
|
|
633
|
+
if (isSetCheckboxLI ? isCheckedBefore : !isCheckedBefore) {
|
|
634
|
+
checkIcon.classList.add(classNames.checked);
|
|
635
|
+
li.classList.add(classNames.selected);
|
|
636
|
+
}
|
|
637
|
+
else {
|
|
638
|
+
checkIcon.classList.remove(classNames.checked);
|
|
639
|
+
li.classList.remove(classNames.selected);
|
|
640
|
+
}
|
|
641
|
+
checkboxElement.setAttribute('aria-checked', isSetCheckboxLI ? (isCheckedBefore ? 'true' : 'false') : (isCheckedBefore ? 'false' : 'true'));
|
|
642
|
+
merge(eventArgs, { isChecked: checkIcon.classList.contains(classNames.checked) });
|
|
643
|
+
if (isFocusedBefore) {
|
|
644
|
+
li.classList.remove(classNames.focused);
|
|
645
|
+
if (textAreaFocus) {
|
|
646
|
+
textAreaFocus.classList.remove('e-focused');
|
|
647
|
+
}
|
|
648
|
+
}
|
|
649
|
+
}
|
|
650
|
+
});
|
|
651
|
+
};
|
|
629
652
|
ListView.prototype.clickHandler = function (e) {
|
|
630
653
|
if (Array.isArray(this.dataSource) && this.dataSource.length === 0) {
|
|
631
654
|
return;
|
|
@@ -667,7 +690,10 @@ var ListView = /** @class */ (function (_super) {
|
|
|
667
690
|
var eventArgs = this.selectEventData(li, e);
|
|
668
691
|
var checkIcon = li.querySelector('.' + classNames.checkboxIcon);
|
|
669
692
|
merge(eventArgs, { isChecked: checkIcon.classList.contains(classNames.checked) });
|
|
670
|
-
|
|
693
|
+
var checkboxElement = li.querySelector('.' + classNames.checkboxWrapper);
|
|
694
|
+
var isCheckedBefore = checkIcon.classList.contains(classNames.checked);
|
|
695
|
+
var isFocusedBefore = li.classList.contains(classNames.focused);
|
|
696
|
+
this.handleCheckboxState(li, checkIcon, checkboxElement, isCheckedBefore, isFocusedBefore, eventArgs, false);
|
|
671
697
|
}
|
|
672
698
|
}
|
|
673
699
|
else if (li.classList.contains(classNames.hasChild)) {
|
|
@@ -888,7 +914,13 @@ var ListView = /** @class */ (function (_super) {
|
|
|
888
914
|
}
|
|
889
915
|
var eventArgs = this.selectEventData(li, e);
|
|
890
916
|
merge(eventArgs, { isChecked: checkIcon ? checkIcon.classList.contains(classNames.checked) : false });
|
|
891
|
-
|
|
917
|
+
if (!isNullOrUndefined(li)) {
|
|
918
|
+
var cbElement = li.querySelector('.' + classNames.checkboxWrapper);
|
|
919
|
+
var checkboxIcon = li.querySelector('.' + classNames.checkboxIcon);
|
|
920
|
+
var isCheckedBefore = checkboxIcon.classList.contains(classNames.checked);
|
|
921
|
+
var isFocusedBefore = li.classList.contains(classNames.focused);
|
|
922
|
+
this.handleCheckboxState(li, checkboxIcon, cbElement, isCheckedBefore, isFocusedBefore, eventArgs, false);
|
|
923
|
+
}
|
|
892
924
|
this.updateSelectedId();
|
|
893
925
|
}
|
|
894
926
|
};
|
|
@@ -963,8 +995,9 @@ var ListView = /** @class */ (function (_super) {
|
|
|
963
995
|
if (!isNullOrUndefined(this.scroll)) {
|
|
964
996
|
EventHandler.remove(this.element, 'scroll', this.onListScroll);
|
|
965
997
|
}
|
|
966
|
-
if (this.touchModule)
|
|
998
|
+
if (this.touchModule) {
|
|
967
999
|
this.touchModule.destroy();
|
|
1000
|
+
}
|
|
968
1001
|
this.touchModule = null;
|
|
969
1002
|
};
|
|
970
1003
|
ListView.prototype.removeFocus = function () {
|
|
@@ -1017,7 +1050,9 @@ var ListView = /** @class */ (function (_super) {
|
|
|
1017
1050
|
var checkboxElement = li.querySelector('.' + classNames.checkboxWrapper);
|
|
1018
1051
|
var checkIcon = checkboxElement.querySelector('.' + classNames.checkboxIcon + '.' + classNames.icon);
|
|
1019
1052
|
this.removeHover();
|
|
1020
|
-
|
|
1053
|
+
var isCheckedBefore = checkIcon.classList.contains(classNames.checked);
|
|
1054
|
+
var isFocusedBefore = li.classList.contains(classNames.focused);
|
|
1055
|
+
if (!isCheckedBefore) {
|
|
1021
1056
|
checkIcon.classList.add(classNames.checked);
|
|
1022
1057
|
li.classList.add(classNames.selected);
|
|
1023
1058
|
}
|
|
@@ -1032,7 +1067,7 @@ var ListView = /** @class */ (function (_super) {
|
|
|
1032
1067
|
if (this.enableVirtualization) {
|
|
1033
1068
|
this.virtualizationModule.setCheckboxLI(li, e);
|
|
1034
1069
|
}
|
|
1035
|
-
this.
|
|
1070
|
+
this.handleCheckboxState(li, checkIcon, checkboxElement, isCheckedBefore, isFocusedBefore, eventArgs, true, textAreaFocus);
|
|
1036
1071
|
this.setSelectedItemData(li);
|
|
1037
1072
|
this.renderSubList(li);
|
|
1038
1073
|
}
|
|
@@ -1101,6 +1136,10 @@ var ListView = /** @class */ (function (_super) {
|
|
|
1101
1136
|
_this.selectedLI = li;
|
|
1102
1137
|
_this.renderSubList(li);
|
|
1103
1138
|
}
|
|
1139
|
+
else {
|
|
1140
|
+
li.classList.remove(classNames.selected);
|
|
1141
|
+
_this.selectedLI = li;
|
|
1142
|
+
}
|
|
1104
1143
|
});
|
|
1105
1144
|
}
|
|
1106
1145
|
};
|
|
@@ -1319,6 +1358,9 @@ var ListView = /** @class */ (function (_super) {
|
|
|
1319
1358
|
var ele = this.element.querySelector('[pid=\'' + uID + '\']');
|
|
1320
1359
|
this.curDSLevel.push(uID);
|
|
1321
1360
|
this.setViewDataSource(this.getSubDS());
|
|
1361
|
+
if (this.enableVirtualization) {
|
|
1362
|
+
this.virtualizationModule.updateDOMItemCount();
|
|
1363
|
+
}
|
|
1322
1364
|
if (!ele) {
|
|
1323
1365
|
var data = this.curViewDS;
|
|
1324
1366
|
ele = ListBase.createListFromJson(this.createElement, data, this.listBaseOption, this.curDSLevel.length, null, this);
|
|
@@ -1427,6 +1469,9 @@ var ListView = /** @class */ (function (_super) {
|
|
|
1427
1469
|
}
|
|
1428
1470
|
this.curDSLevel.pop();
|
|
1429
1471
|
this.setViewDataSource(this.getSubDS());
|
|
1472
|
+
if (this.enableVirtualization) {
|
|
1473
|
+
this.virtualizationModule.updateDOMItemCount();
|
|
1474
|
+
}
|
|
1430
1475
|
var toUL = this.element.querySelector('[data-uid=\'' + pID + '\']');
|
|
1431
1476
|
var fromUL = this.curUL;
|
|
1432
1477
|
if (!toUL) {
|
|
@@ -32,18 +32,21 @@ var Virtualization = /** @class */ (function () {
|
|
|
32
32
|
*/
|
|
33
33
|
Virtualization.prototype.uiVirtualization = function () {
|
|
34
34
|
this.wireScrollEvent(false);
|
|
35
|
+
var isRendered = this.listViewInstance.isRendered;
|
|
36
|
+
var firstIndex = isRendered && !isNullOrUndefined(this.uiFirstIndex) ? this.uiFirstIndex : 0;
|
|
35
37
|
var curViewDS = this.listViewInstance.curViewDS;
|
|
36
|
-
var firstDs = curViewDS.slice(
|
|
38
|
+
var firstDs = curViewDS.slice(firstIndex, firstIndex + 1);
|
|
37
39
|
this.listViewInstance.ulElement = this.listViewInstance.curUL = ListBase.createList(this.listViewInstance.createElement, firstDs, this.listViewInstance.listBaseOption, null, this.listViewInstance);
|
|
38
40
|
this.listViewInstance.contentContainer = this.listViewInstance.createElement('div', { className: classNames.container });
|
|
39
41
|
this.listViewInstance.element.appendChild(this.listViewInstance.contentContainer);
|
|
40
42
|
this.listViewInstance.contentContainer.appendChild(this.listViewInstance.ulElement);
|
|
41
43
|
this.listItemHeight = this.listViewInstance.ulElement.firstElementChild.getBoundingClientRect().height;
|
|
42
44
|
this.expectedDomItemCount = this.ValidateItemCount(10000);
|
|
43
|
-
this.
|
|
44
|
-
this.
|
|
45
|
-
this.
|
|
46
|
-
|
|
45
|
+
this.updateDOMItemCount();
|
|
46
|
+
var lastIndex = isRendered && !isNullOrUndefined(this.uiLastIndex) ? this.uiLastIndex : this.domItemCount - 1;
|
|
47
|
+
this.uiFirstIndex = firstIndex;
|
|
48
|
+
this.uiLastIndex = lastIndex;
|
|
49
|
+
var otherDs = curViewDS.slice(firstIndex + 1, lastIndex + 1);
|
|
47
50
|
var listItems = ListBase.createListItemFromJson(this.listViewInstance.createElement, otherDs, this.listViewInstance.listBaseOption, null, null, this.listViewInstance);
|
|
48
51
|
append(listItems, this.listViewInstance.ulElement);
|
|
49
52
|
this.listViewInstance.liCollection = this.listViewInstance.curUL.querySelectorAll('li');
|
|
@@ -52,11 +55,14 @@ var Virtualization = /** @class */ (function () {
|
|
|
52
55
|
this.bottomElement = this.listViewInstance.createElement('div');
|
|
53
56
|
this.listViewInstance.ulElement.insertBefore(this.bottomElement, null);
|
|
54
57
|
this.totalHeight = (Object.keys(curViewDS).length * this.listItemHeight) - (this.domItemCount * this.listItemHeight);
|
|
55
|
-
this.topElement.style.height =
|
|
56
|
-
this.bottomElement.style.height = this.totalHeight + 'px';
|
|
57
|
-
this.topElementHeight = 0;
|
|
58
|
-
this.bottomElementHeight = this.totalHeight;
|
|
59
|
-
this.listDiff = 0;
|
|
58
|
+
this.topElement.style.height = isRendered ? this.topElementHeight + 'px' : '0px';
|
|
59
|
+
this.bottomElement.style.height = isRendered ? (this.totalHeight - this.topElementHeight) + 'px' : this.totalHeight + 'px';
|
|
60
|
+
this.topElementHeight = isRendered ? this.topElementHeight : 0;
|
|
61
|
+
this.bottomElementHeight = isRendered ? (this.totalHeight - this.topElementHeight) : this.totalHeight;
|
|
62
|
+
this.listDiff = isRendered ? this.listDiff : 0;
|
|
63
|
+
if (isRendered) {
|
|
64
|
+
this.listViewInstance.element.scrollTop = this.listViewInstance.previousScrollTop;
|
|
65
|
+
}
|
|
60
66
|
this.uiIndicesInitialization();
|
|
61
67
|
};
|
|
62
68
|
Virtualization.prototype.wireScrollEvent = function (destroy) {
|
|
@@ -98,6 +104,9 @@ var Virtualization = /** @class */ (function () {
|
|
|
98
104
|
}
|
|
99
105
|
return itemCount;
|
|
100
106
|
};
|
|
107
|
+
Virtualization.prototype.updateDOMItemCount = function () {
|
|
108
|
+
this.domItemCount = this.ValidateItemCount(Object.keys(this.listViewInstance.curViewDS).length);
|
|
109
|
+
};
|
|
101
110
|
Virtualization.prototype.uiIndicesInitialization = function () {
|
|
102
111
|
this.uiIndices = { 'activeIndices': [], 'disabledItemIndices': [], 'hiddenItemIndices': [] };
|
|
103
112
|
var data = this.listViewInstance.curViewDS;
|
|
@@ -397,18 +406,19 @@ var Virtualization = /** @class */ (function () {
|
|
|
397
406
|
}
|
|
398
407
|
};
|
|
399
408
|
Virtualization.prototype.selectItem = function (obj) {
|
|
409
|
+
var _this = this;
|
|
400
410
|
var resutJSON = this.findDSAndIndexFromId(this.listViewInstance.curViewDS, obj);
|
|
401
411
|
if (Object.keys(resutJSON).length) {
|
|
402
412
|
var isSelected = this.activeIndex === resutJSON.index;
|
|
403
|
-
var
|
|
413
|
+
var isChecked_1;
|
|
404
414
|
this.activeIndex = resutJSON.index;
|
|
405
415
|
if (this.listViewInstance.showCheckBox) {
|
|
406
416
|
if (this.uiIndices.activeIndices.indexOf(resutJSON.index) === -1) {
|
|
407
|
-
|
|
417
|
+
isChecked_1 = true;
|
|
408
418
|
this.uiIndices.activeIndices.push(resutJSON.index);
|
|
409
419
|
}
|
|
410
420
|
else {
|
|
411
|
-
|
|
421
|
+
isChecked_1 = false;
|
|
412
422
|
this.uiIndices.activeIndices.splice(this.uiIndices.activeIndices.indexOf(resutJSON.index), 1);
|
|
413
423
|
}
|
|
414
424
|
if (this.listViewInstance.curUL.querySelector('.' + classNames.focused)) {
|
|
@@ -424,10 +434,10 @@ var Virtualization = /** @class */ (function () {
|
|
|
424
434
|
}
|
|
425
435
|
}
|
|
426
436
|
else {
|
|
427
|
-
var
|
|
437
|
+
var eventArgs_1;
|
|
428
438
|
if (typeof this.listViewInstance.dataSource[0] === 'string' ||
|
|
429
439
|
typeof this.listViewInstance.dataSource[0] === 'number') {
|
|
430
|
-
|
|
440
|
+
eventArgs_1 = {
|
|
431
441
|
text: this.listViewInstance.curViewDS[this.activeIndex],
|
|
432
442
|
data: this.listViewInstance.curViewDS[this.activeIndex],
|
|
433
443
|
index: this.activeIndex
|
|
@@ -435,19 +445,33 @@ var Virtualization = /** @class */ (function () {
|
|
|
435
445
|
}
|
|
436
446
|
else {
|
|
437
447
|
var curViewDS = this.listViewInstance.curViewDS;
|
|
438
|
-
|
|
448
|
+
eventArgs_1 = {
|
|
439
449
|
text: curViewDS[this.activeIndex][this.listViewInstance.fields.text],
|
|
440
450
|
data: curViewDS[this.activeIndex],
|
|
441
451
|
index: this.activeIndex
|
|
442
452
|
};
|
|
443
453
|
}
|
|
444
454
|
if (this.listViewInstance.showCheckBox) {
|
|
445
|
-
|
|
446
|
-
|
|
455
|
+
this.listViewInstance.trigger('select', eventArgs_1, function (observedArgs) {
|
|
456
|
+
if (observedArgs.cancel) {
|
|
457
|
+
if (!isChecked_1) {
|
|
458
|
+
eventArgs_1.isChecked = isChecked_1;
|
|
459
|
+
_this.uiIndices.activeIndices.push(resutJSON.index);
|
|
460
|
+
}
|
|
461
|
+
else {
|
|
462
|
+
eventArgs_1.isChecked = !isChecked_1;
|
|
463
|
+
_this.uiIndices.activeIndices.splice(_this.uiIndices.activeIndices.indexOf(resutJSON.index), 1);
|
|
464
|
+
}
|
|
465
|
+
}
|
|
466
|
+
});
|
|
447
467
|
}
|
|
448
468
|
else if (!isSelected) {
|
|
449
469
|
this.listViewInstance.removeSelect();
|
|
450
|
-
this.listViewInstance.trigger('select',
|
|
470
|
+
this.listViewInstance.trigger('select', eventArgs_1, function (observedArgs) {
|
|
471
|
+
if (observedArgs.cancel) {
|
|
472
|
+
_this.activeIndex = undefined;
|
|
473
|
+
}
|
|
474
|
+
});
|
|
451
475
|
}
|
|
452
476
|
}
|
|
453
477
|
}
|
package/hotfix/26.1.35_Vol2.txt
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
hotfix/26.1.35_Vol2
|