@syncfusion/ej2-dropdowns 24.2.8 → 25.1.35
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/CHANGELOG.md +23 -150
- 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 +2049 -528
- package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
- package/dist/es6/ej2-dropdowns.es5.js +2072 -533
- 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 +13 -13
- package/src/auto-complete/auto-complete-model.d.ts +3 -1
- package/src/auto-complete/auto-complete.d.ts +2 -0
- package/src/auto-complete/auto-complete.js +51 -6
- package/src/combo-box/combo-box-model.d.ts +11 -2
- package/src/combo-box/combo-box.d.ts +10 -2
- package/src/combo-box/combo-box.js +75 -16
- package/src/common/interface.d.ts +32 -0
- package/src/common/virtual-scroll.d.ts +1 -3
- package/src/common/virtual-scroll.js +157 -27
- package/src/drop-down-base/drop-down-base-model.d.ts +1 -1
- package/src/drop-down-base/drop-down-base.d.ts +65 -5
- package/src/drop-down-base/drop-down-base.js +242 -25
- package/src/drop-down-list/drop-down-list-model.d.ts +10 -1
- package/src/drop-down-list/drop-down-list.d.ts +16 -51
- package/src/drop-down-list/drop-down-list.js +180 -217
- package/src/drop-down-tree/drop-down-tree-model.d.ts +16 -12
- package/src/drop-down-tree/drop-down-tree.d.ts +13 -3
- package/src/drop-down-tree/drop-down-tree.js +55 -49
- package/src/global.js +1 -1
- package/src/list-box/list-box.js +9 -4
- package/src/mention/mention.d.ts +2 -0
- package/src/mention/mention.js +21 -9
- package/src/multi-select/checkbox-selection.js +8 -2
- package/src/multi-select/float-label.d.ts +5 -5
- package/src/multi-select/index.d.ts +1 -0
- package/src/multi-select/index.js +1 -0
- package/src/multi-select/interface.d.ts +1 -0
- package/src/multi-select/multi-select-model.d.ts +17 -2
- package/src/multi-select/multi-select.d.ts +34 -4
- package/src/multi-select/multi-select.js +1271 -173
- package/styles/auto-complete/_bds-definition.scss +2 -0
- package/styles/bootstrap-dark.css +8 -2
- package/styles/bootstrap.css +8 -2
- package/styles/bootstrap4.css +3 -2
- package/styles/bootstrap5-dark.css +3 -2
- package/styles/bootstrap5.css +3 -2
- package/styles/combo-box/_bds-definition.scss +2 -0
- package/styles/drop-down-base/_bds-definition.scss +134 -0
- package/styles/drop-down-list/_bds-definition.scss +134 -0
- package/styles/drop-down-list/_layout.scss +1 -1
- package/styles/drop-down-list/bootstrap-dark.css +1 -1
- package/styles/drop-down-list/bootstrap.css +1 -1
- package/styles/drop-down-list/bootstrap4.css +1 -1
- package/styles/drop-down-list/bootstrap5-dark.css +1 -1
- package/styles/drop-down-list/bootstrap5.css +1 -1
- package/styles/drop-down-list/fabric-dark.css +1 -1
- package/styles/drop-down-list/fabric.css +1 -1
- package/styles/drop-down-list/fluent-dark.css +1 -1
- package/styles/drop-down-list/fluent.css +1 -1
- package/styles/drop-down-list/highcontrast-light.css +1 -1
- package/styles/drop-down-list/highcontrast.css +1 -1
- package/styles/drop-down-list/icons/_bds.scss +14 -0
- package/styles/drop-down-list/material-dark.css +1 -1
- package/styles/drop-down-list/material.css +1 -1
- package/styles/drop-down-list/material3-dark.css +1 -1
- package/styles/drop-down-list/material3.css +1 -1
- package/styles/drop-down-list/tailwind-dark.css +1 -1
- package/styles/drop-down-list/tailwind.css +1 -1
- package/styles/drop-down-tree/_bds-definition.scss +61 -0
- package/styles/drop-down-tree/icons/_bds.scss +11 -0
- package/styles/fabric-dark.css +4 -2
- package/styles/fabric.css +4 -2
- package/styles/fluent-dark.css +8 -2
- package/styles/fluent.css +8 -2
- package/styles/highcontrast-light.css +4 -2
- package/styles/highcontrast.css +4 -2
- package/styles/list-box/_bds-definition.scss +136 -0
- package/styles/list-box/icons/_bds.scss +25 -0
- package/styles/material-dark.css +3 -2
- package/styles/material.css +3 -2
- package/styles/material3-dark.css +3 -2
- package/styles/material3.css +3 -2
- package/styles/mention/_bds-definition.scss +1 -0
- package/styles/multi-select/_bds-definition.scss +235 -0
- package/styles/multi-select/_bootstrap-dark-definition.scss +4 -0
- package/styles/multi-select/_bootstrap-definition.scss +4 -0
- package/styles/multi-select/_fluent-definition.scss +5 -0
- package/styles/multi-select/_layout.scss +8 -1
- package/styles/multi-select/bootstrap-dark.css +7 -1
- package/styles/multi-select/bootstrap.css +7 -1
- package/styles/multi-select/bootstrap4.css +2 -1
- package/styles/multi-select/bootstrap5-dark.css +2 -1
- package/styles/multi-select/bootstrap5.css +2 -1
- package/styles/multi-select/fabric-dark.css +3 -1
- package/styles/multi-select/fabric.css +3 -1
- package/styles/multi-select/fluent-dark.css +7 -1
- package/styles/multi-select/fluent.css +7 -1
- package/styles/multi-select/highcontrast-light.css +3 -1
- package/styles/multi-select/highcontrast.css +3 -1
- package/styles/multi-select/icons/_bds.scss +26 -0
- package/styles/multi-select/material-dark.css +2 -1
- package/styles/multi-select/material.css +2 -1
- package/styles/multi-select/material3-dark.css +2 -1
- package/styles/multi-select/material3.css +2 -1
- package/styles/multi-select/tailwind-dark.css +2 -1
- package/styles/multi-select/tailwind.css +2 -1
- package/styles/tailwind-dark.css +3 -2
- package/styles/tailwind.css +3 -2
|
@@ -44,7 +44,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
44
44
|
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
45
45
|
}
|
|
46
46
|
};
|
|
47
|
-
import { EventHandler, Browser, select, isNullOrUndefined } from '@syncfusion/ej2-base';
|
|
47
|
+
import { EventHandler, Browser, select, isNullOrUndefined, getValue } from '@syncfusion/ej2-base';
|
|
48
48
|
import { debounce, Touch } from '@syncfusion/ej2-base';
|
|
49
49
|
import { DataManager, Query } from '@syncfusion/ej2-data';
|
|
50
50
|
var VirtualScroll = /** @class */ (function () {
|
|
@@ -142,7 +142,9 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
142
142
|
if (isQueryGenerated === void 0) { isQueryGenerated = false; }
|
|
143
143
|
var dataSource = this.parent.dataSource;
|
|
144
144
|
if (!isQueryGenerated) {
|
|
145
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
145
146
|
if (!isNullOrUndefined(this.parent.query)) {
|
|
147
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
146
148
|
var newQuery = this.removeSkipAndTakeEvents(this.parent.query.clone());
|
|
147
149
|
query = this.getPageQuery(newQuery, virtualItemStartIndex, virtualItemEndIndex);
|
|
148
150
|
}
|
|
@@ -157,6 +159,7 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
157
159
|
totalData = this.parent.dataSource.dataSource.json.length;
|
|
158
160
|
}
|
|
159
161
|
else if (this.parent.dataSource && this.parent.dataSource.length > 0) {
|
|
162
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
160
163
|
totalData = this.parent.dataSource.length;
|
|
161
164
|
}
|
|
162
165
|
if (totalData > 0) {
|
|
@@ -173,22 +176,151 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
173
176
|
});
|
|
174
177
|
return query;
|
|
175
178
|
};
|
|
176
|
-
VirtualScroll.prototype.setCurrentViewDataAsync = function () {
|
|
179
|
+
VirtualScroll.prototype.setCurrentViewDataAsync = function (component) {
|
|
177
180
|
// eslint-disable-next-line
|
|
178
181
|
var currentData = [];
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
182
|
+
var isResetListCalled = false;
|
|
183
|
+
var isListUpdated = true;
|
|
184
|
+
if (isNullOrUndefined(this.component)) {
|
|
185
|
+
this.component = component.component;
|
|
186
|
+
}
|
|
187
|
+
var endIndex = this.parent.viewPortInfo.endIndex;
|
|
188
|
+
if (this.component === 'multiselect' && this.parent.mode === 'CheckBox' && this.parent.value && Array.isArray(this.parent.value) && this.parent.value.length > 0 && this.parent.enableSelectionOrder) {
|
|
189
|
+
if (this.parent.viewPortInfo.startIndex < this.parent.value.length) {
|
|
190
|
+
endIndex = this.parent.viewPortInfo.endIndex - this.parent.value.length;
|
|
191
|
+
if (this.parent.viewPortInfo.startIndex === 0) {
|
|
192
|
+
this.parent.updateVirtualReOrderList(true);
|
|
193
|
+
if (this.parent.value.length < this.parent.itemCount) {
|
|
194
|
+
var oldUlElement = this.parent.list.querySelector('.e-list-parent' + ':not(.e-reorder)');
|
|
195
|
+
if (oldUlElement) {
|
|
196
|
+
this.parent.list.querySelector('.e-virtual-ddl-content').removeChild(oldUlElement);
|
|
197
|
+
}
|
|
198
|
+
var query = this.parent.getForQuery(this.parent.value).clone();
|
|
199
|
+
query = query.skip(0).take(this.parent.itemCount - (this.parent.value.length - this.parent.viewPortInfo.startIndex));
|
|
200
|
+
this.parent.appendUncheckList = true;
|
|
201
|
+
this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
|
|
202
|
+
isListUpdated = false;
|
|
203
|
+
this.parent.appendUncheckList = false;
|
|
204
|
+
isListUpdated = false;
|
|
205
|
+
}
|
|
206
|
+
else {
|
|
207
|
+
var oldUlElement = this.parent.list.querySelector('.e-list-parent' + ':not(.e-reorder)');
|
|
208
|
+
if (oldUlElement) {
|
|
209
|
+
this.parent.list.querySelector('.e-virtual-ddl-content').removeChild(oldUlElement);
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
isListUpdated = false;
|
|
213
|
+
}
|
|
214
|
+
else if (this.parent.viewPortInfo.startIndex != 0) {
|
|
215
|
+
this.parent.updateVirtualReOrderList(true);
|
|
216
|
+
var oldUlElement = this.parent.list.querySelector('.e-list-parent' + ':not(.e-reorder)');
|
|
217
|
+
if (oldUlElement) {
|
|
218
|
+
this.parent.list.querySelector('.e-virtual-ddl-content').removeChild(oldUlElement);
|
|
219
|
+
}
|
|
220
|
+
isListUpdated = false;
|
|
221
|
+
}
|
|
222
|
+
if (this.parent.viewPortInfo.startIndex != 0 && this.parent.viewPortInfo.startIndex - this.parent.value.length != this.parent.itemCount && (this.parent.viewPortInfo.startIndex + this.parent.itemCount > this.parent.value.length)) {
|
|
223
|
+
var query = this.parent.getForQuery(this.parent.value).clone();
|
|
224
|
+
query = query.skip(0).take(this.parent.itemCount - (this.parent.value.length - this.parent.viewPortInfo.startIndex));
|
|
225
|
+
this.parent.appendUncheckList = true;
|
|
226
|
+
this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
|
|
227
|
+
isListUpdated = false;
|
|
228
|
+
this.parent.appendUncheckList = false;
|
|
229
|
+
}
|
|
230
|
+
}
|
|
231
|
+
else {
|
|
232
|
+
var reOrderList = this.parent.list.querySelectorAll('.e-reorder')[0];
|
|
233
|
+
if (this.parent.list.querySelector('.e-virtual-ddl-content') && reOrderList) {
|
|
234
|
+
this.parent.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList);
|
|
235
|
+
}
|
|
236
|
+
var query = this.parent.getForQuery(this.parent.value).clone();
|
|
237
|
+
if (!this.parent.allowFiltering) { //need to check with allowFiltering false
|
|
238
|
+
var skipvalue = this.parent.viewPortInfo.startIndex - this.parent.value.length >= 0 ? this.parent.viewPortInfo.startIndex - this.parent.value.length : 0;
|
|
239
|
+
query = query.skip(skipvalue);
|
|
240
|
+
}
|
|
241
|
+
this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
|
|
242
|
+
isListUpdated = false;
|
|
243
|
+
}
|
|
244
|
+
this.parent.totalItemsCount();
|
|
245
|
+
}
|
|
246
|
+
if (isListUpdated) {
|
|
247
|
+
for (var i = this.parent.viewPortInfo.startIndex; i < endIndex; i++) {
|
|
248
|
+
var index = i;
|
|
249
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
250
|
+
var alreadyAddedData = this.parent.generatedDataObject[index];
|
|
251
|
+
if (this.component === 'multiselect' && this.parent.hideSelectedItem) {
|
|
252
|
+
if (alreadyAddedData) {
|
|
253
|
+
var value = getValue(this.parent.fields.value, alreadyAddedData[0]);
|
|
254
|
+
if (this.parent.value && value != null && Array.isArray(this.parent.value) && this.parent.value.length > 0 && this.parent.value.indexOf(value) < 0) {
|
|
255
|
+
var query = this.parent.getForQuery(this.parent.value).clone();
|
|
256
|
+
if (this.parent.viewPortInfo.endIndex == this.parent.totalItemCount + this.parent.value.length && this.parent.hideSelectedItem) {
|
|
257
|
+
query = query.skip(this.parent.totalItemCount - this.parent.itemCount);
|
|
258
|
+
}
|
|
259
|
+
else {
|
|
260
|
+
query = query.skip(this.parent.viewPortInfo.startIndex);
|
|
261
|
+
}
|
|
262
|
+
this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
|
|
263
|
+
isResetListCalled = true;
|
|
264
|
+
break;
|
|
265
|
+
}
|
|
266
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
267
|
+
else if ((this.parent.value === null || (this.parent.value && this.parent.value.length === 0))) {
|
|
268
|
+
currentData.push(alreadyAddedData[0]);
|
|
269
|
+
}
|
|
270
|
+
}
|
|
271
|
+
if (index === endIndex - 1) {
|
|
272
|
+
if (currentData.length != this.parent.itemCount) {
|
|
273
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
274
|
+
if (this.parent.hideSelectedItem) {
|
|
275
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
276
|
+
var query = this.parent.getForQuery(this.parent.value).clone();
|
|
277
|
+
if (this.parent.viewPortInfo.endIndex == this.parent.totalItemCount + this.parent.value.length && this.parent.hideSelectedItem) {
|
|
278
|
+
query = query.skip(this.parent.totalItemCount - this.parent.itemCount);
|
|
279
|
+
}
|
|
280
|
+
else {
|
|
281
|
+
query = query.skip(this.parent.viewPortInfo.startIndex);
|
|
282
|
+
}
|
|
283
|
+
this.parent.resetList(this.parent.dataSource, this.parent.fields, query);
|
|
284
|
+
isResetListCalled = true;
|
|
285
|
+
}
|
|
286
|
+
}
|
|
287
|
+
}
|
|
288
|
+
}
|
|
289
|
+
else {
|
|
290
|
+
if (alreadyAddedData) {
|
|
291
|
+
currentData.push(alreadyAddedData[0]);
|
|
292
|
+
}
|
|
293
|
+
}
|
|
184
294
|
}
|
|
185
295
|
}
|
|
186
|
-
|
|
296
|
+
if (!isResetListCalled && isListUpdated) {
|
|
297
|
+
if (this.component === 'multiselect' && this.parent.allowCustomValue && this.parent.viewPortInfo.startIndex == 0 && this.parent.virtualCustomData) {
|
|
298
|
+
currentData.splice(0, 0, this.parent.virtualCustomData);
|
|
299
|
+
}
|
|
300
|
+
var totalData = [];
|
|
301
|
+
if (this.component === 'multiselect' && this.parent.allowCustomValue && this.parent.viewPortInfo.endIndex == this.parent.totalItemCount) {
|
|
302
|
+
if (this.parent.virtualCustomSelectData && this.parent.virtualCustomSelectData.length > 0) {
|
|
303
|
+
totalData = currentData.concat(this.parent.virtualCustomSelectData);
|
|
304
|
+
currentData = totalData;
|
|
305
|
+
}
|
|
306
|
+
}
|
|
307
|
+
var ulElement = this.parent.renderItems(currentData, this.parent.fields, this.component === 'multiselect' && this.parent.mode === 'CheckBox');
|
|
308
|
+
}
|
|
309
|
+
if (this.component === 'multiselect') {
|
|
310
|
+
this.parent.updatevirtualizationList();
|
|
311
|
+
}
|
|
312
|
+
this.parent.getSkeletonCount();
|
|
187
313
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
188
314
|
var virtualTrackElement = this.parent.list.getElementsByClassName('e-virtual-ddl')[0];
|
|
189
315
|
if (virtualTrackElement) {
|
|
190
316
|
(virtualTrackElement).style = this.parent.GetVirtualTrackHeight();
|
|
191
317
|
}
|
|
318
|
+
else if (!virtualTrackElement && this.parent.skeletonCount > 0 && this.parent.popupWrapper) {
|
|
319
|
+
var virualElement = this.parent.createElement('div', {
|
|
320
|
+
id: this.parent.element.id + '_popup', className: 'e-virtual-ddl', styles: this.parent.GetVirtualTrackHeight()
|
|
321
|
+
});
|
|
322
|
+
this.parent.popupWrapper.querySelector('.e-dropdownbase').appendChild(virualElement);
|
|
323
|
+
}
|
|
192
324
|
this.parent.UpdateSkeleton();
|
|
193
325
|
this.parent.liCollections = this.parent.list.querySelectorAll('.e-list-item');
|
|
194
326
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -199,13 +331,17 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
199
331
|
if (this.parent.fields.groupBy) {
|
|
200
332
|
this.parent.scrollStop();
|
|
201
333
|
}
|
|
334
|
+
if (this.parent.keyCode == 40 && this.parent.isScrollChanged && this.parent.hideSelectedItem && !isNullOrUndefined(this.parent.currentFocuedListElement)) {
|
|
335
|
+
var currentSelectElem = this.parent.getElementByValue(this.parent.currentFocuedListElement.getAttribute('data-value'));
|
|
336
|
+
this.parent.addListFocus(currentSelectElem);
|
|
337
|
+
this.parent.isScrollChanged = false;
|
|
338
|
+
}
|
|
202
339
|
};
|
|
203
340
|
VirtualScroll.prototype.generateQueryAndSetQueryIndexAsync = function (query, isPopupOpen) {
|
|
204
341
|
var isStartIndexInitialised = false;
|
|
205
342
|
var queryStartIndex = 0;
|
|
206
343
|
var queryEndIndex = 0;
|
|
207
|
-
var
|
|
208
|
-
var vEndIndex = this.parent && this.parent.viewPortInfo.endIndex !== 0 ? this.parent.viewPortInfo.endIndex : sortedDataStartIndex + this.parent.getItems().length;
|
|
344
|
+
var vEndIndex = this.parent.viewPortInfo.endIndex;
|
|
209
345
|
if (!isPopupOpen && vEndIndex !== 0) {
|
|
210
346
|
for (var i = this.parent.viewPortInfo.startIndex; i <= vEndIndex; i++) {
|
|
211
347
|
if (!(i in this.parent.generatedDataObject)) {
|
|
@@ -223,6 +359,13 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
223
359
|
this.parent.virtualItemStartIndex = queryStartIndex;
|
|
224
360
|
this.parent.virtualItemEndIndex = queryEndIndex;
|
|
225
361
|
this.generateAndExecuteQueryAsync(query, queryStartIndex, queryEndIndex);
|
|
362
|
+
if (this.component === 'multiselect' && this.parent.hideSelectedItem && this.parent.value && Array.isArray(this.parent.value) && this.parent.value.length > 0) {
|
|
363
|
+
this.parent.totalItemsCount();
|
|
364
|
+
}
|
|
365
|
+
if (this.component === 'multiselect' && this.parent.virtualItemStartIndex === this.parent.virtualItemEndIndex) {
|
|
366
|
+
this.parent.virtualItemStartIndex = this.parent.viewPortInfo.startIndex;
|
|
367
|
+
this.parent.virtualItemEndIndex = this.parent.viewPortInfo.endIndex;
|
|
368
|
+
}
|
|
226
369
|
}
|
|
227
370
|
this.setCurrentViewDataAsync();
|
|
228
371
|
};
|
|
@@ -268,7 +411,8 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
268
411
|
};
|
|
269
412
|
VirtualScroll.prototype.scrollListener = function (scrollArgs) {
|
|
270
413
|
var _this = this;
|
|
271
|
-
if (!this.parent.isPreventScrollAction) {
|
|
414
|
+
if (!this.parent.isPreventScrollAction && !this.parent.isVirtualTrackHeight) {
|
|
415
|
+
this.parent.preventSetCurrentData = false;
|
|
272
416
|
var info = scrollArgs.sentinel;
|
|
273
417
|
var pStartIndex = this.parent.previousStartIndex;
|
|
274
418
|
this.parent.viewPortInfo = this.getInfoFromView(scrollArgs.direction, info, scrollArgs.offset, false);
|
|
@@ -304,20 +448,6 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
304
448
|
this.parent.previousInfo = this.parent.viewPortInfo;
|
|
305
449
|
}
|
|
306
450
|
};
|
|
307
|
-
VirtualScroll.prototype.getPageCount = function (popupElement, returnExactCount) {
|
|
308
|
-
if (returnExactCount === void 0) { returnExactCount = false; }
|
|
309
|
-
var list = popupElement && popupElement.querySelector('.e-content');
|
|
310
|
-
if (list) {
|
|
311
|
-
var liHeight = list.classList.contains('e-nodata') ? null : getComputedStyle(list.querySelectorAll('.e-list-item')[0], null).getPropertyValue('height');
|
|
312
|
-
var pageCount = list.getBoundingClientRect().height / parseInt(liHeight, 10);
|
|
313
|
-
return returnExactCount ? pageCount : Math.round(pageCount);
|
|
314
|
-
}
|
|
315
|
-
return 0;
|
|
316
|
-
};
|
|
317
|
-
;
|
|
318
|
-
VirtualScroll.prototype.getRowHeight = function () {
|
|
319
|
-
return (isNullOrUndefined(this.parent.liCollections) || this.parent.liCollections.length == 0) ? 0 : Math.ceil(this.parent.liCollections[0].getBoundingClientRect().height);
|
|
320
|
-
};
|
|
321
451
|
VirtualScroll.prototype.getInfoFromView = function (direction, info, e, isscrollAction) {
|
|
322
452
|
var infoType = {
|
|
323
453
|
direction: direction, sentinelInfo: info, offsets: e,
|
|
@@ -353,7 +483,7 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
353
483
|
var idxAddedToExactTop = (pageSizeBy4) > infoViewIndices ? pageSizeBy4 :
|
|
354
484
|
(infoViewIndices + infoViewIndices / 4);
|
|
355
485
|
var eIndex = Math.round(exactTopIndex + idxAddedToExactTop);
|
|
356
|
-
infoType.endIndex = eIndex < totalItemCount ? eIndex : totalItemCount;
|
|
486
|
+
infoType.endIndex = (eIndex < totalItemCount || this.component == "multiselect") ? eIndex : totalItemCount;
|
|
357
487
|
var sIndex = infoType.endIndex - this.parent.virtualItemCount;
|
|
358
488
|
infoType.startIndex = sIndex > 0 ? sIndex : 0;
|
|
359
489
|
infoType.endIndex = sIndex < 0 ? this.parent.virtualItemCount : infoType.endIndex;
|
|
@@ -388,7 +518,7 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
388
518
|
top: top,
|
|
389
519
|
left: left
|
|
390
520
|
};
|
|
391
|
-
if (_this.parent.list.querySelectorAll('.e-virtual-list').length > 0) {
|
|
521
|
+
if (_this.parent.list && _this.parent.list.querySelectorAll('.e-virtual-list').length > 0) {
|
|
392
522
|
var infoview = _this.getInfoFromView(direction, current, scrollOffsetargs, true);
|
|
393
523
|
if (_this.parent.scrollPreStartIndex != pstartIndex && !_this.parent.isPreventScrollAction) {
|
|
394
524
|
_this.parent.isScrollActionTriggered = true;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component, EventHandler, addClass, append, Property, Event, KeyboardEvents, EmitType, L10n, compile, KeyboardEventArgs } from '@syncfusion/ej2-base';import { setStyleAttribute, extend, removeClass, prepend, isNullOrUndefined, detach, getValue, AnimationModel } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, rippleEffect, RippleOptions, ChildProperty, Complex } from '@syncfusion/ej2-base';import { DataManager, Query, DataOptions, DataUtil } from '@syncfusion/ej2-data';import { ListBase, SortOrder } from '@syncfusion/ej2-lists';import { Popup } from '@syncfusion/ej2-popups';import { remove, select, selectAll } from '@syncfusion/ej2-base';
|
|
1
|
+
import { Component, EventHandler, addClass, append, Property, Event, KeyboardEvents, EmitType, L10n, compile, KeyboardEventArgs } from '@syncfusion/ej2-base';import { setStyleAttribute, extend, removeClass, prepend, isNullOrUndefined, detach, getValue, AnimationModel } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, rippleEffect, RippleOptions, ChildProperty, Complex } from '@syncfusion/ej2-base';import { DataManager, Query, DataOptions, DataUtil } from '@syncfusion/ej2-data';import { ListBase, SortOrder } from '@syncfusion/ej2-lists';import { Popup } from '@syncfusion/ej2-popups';import { remove, select, selectAll } from '@syncfusion/ej2-base';import { VirtualInfo, VirtualScroll } from '../common/virtual-scroll';import { GeneratedData } from '../drop-down-list';import { Skeleton } from '@syncfusion/ej2-notifications';
|
|
2
2
|
import {FilterType,SelectEventArgs} from "./drop-down-base";
|
|
3
3
|
import {ComponentModel} from '@syncfusion/ej2-base';
|
|
4
4
|
|
|
@@ -5,6 +5,8 @@ import { DataManager, Query } from '@syncfusion/ej2-data';
|
|
|
5
5
|
import { SortOrder } from '@syncfusion/ej2-lists';
|
|
6
6
|
import { DropDownBaseModel, FieldSettingsModel } from './drop-down-base-model';
|
|
7
7
|
import { Popup } from '@syncfusion/ej2-popups';
|
|
8
|
+
import { VirtualInfo, VirtualScroll } from '../common/virtual-scroll';
|
|
9
|
+
import { GeneratedData } from '../drop-down-list';
|
|
8
10
|
export declare type FilterType = 'StartsWith' | 'EndsWith' | 'Contains';
|
|
9
11
|
export declare class FieldSettings extends ChildProperty<FieldSettings> {
|
|
10
12
|
/**
|
|
@@ -53,6 +55,7 @@ export interface DropDownBaseClassList {
|
|
|
53
55
|
disabled: string;
|
|
54
56
|
group: string;
|
|
55
57
|
grouping: string;
|
|
58
|
+
virtualList: string;
|
|
56
59
|
}
|
|
57
60
|
export interface SelectEventArgs {
|
|
58
61
|
/**
|
|
@@ -224,8 +227,10 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
224
227
|
protected isAddNewItemTemplate: boolean;
|
|
225
228
|
private isRequesting;
|
|
226
229
|
private isVirtualizationEnabled;
|
|
230
|
+
protected isCustomDataUpdated: boolean;
|
|
227
231
|
private isAllowFiltering;
|
|
228
232
|
private virtualizedItemsCount;
|
|
233
|
+
private isCheckBoxSelection;
|
|
229
234
|
protected totalItemCount: number;
|
|
230
235
|
protected dataCount: number;
|
|
231
236
|
protected isRemoteDataUpdated: boolean;
|
|
@@ -234,6 +239,49 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
234
239
|
}[] | DataManager | string[] | number[] | boolean[];
|
|
235
240
|
protected isIncrementalRequest: boolean;
|
|
236
241
|
protected itemCount: number;
|
|
242
|
+
protected initialRemoteRender: boolean;
|
|
243
|
+
protected virtualListHeight: number;
|
|
244
|
+
protected virtualItemCount: number;
|
|
245
|
+
protected isVirtualScrolling: boolean;
|
|
246
|
+
protected observer: VirtualScroll;
|
|
247
|
+
protected isPreventScrollAction: boolean;
|
|
248
|
+
protected scrollPreStartIndex: number;
|
|
249
|
+
protected isScrollActionTriggered: boolean;
|
|
250
|
+
protected previousStartIndex: number;
|
|
251
|
+
protected isMouseScrollAction: boolean;
|
|
252
|
+
protected isKeyBoardAction: boolean;
|
|
253
|
+
protected isScrollChanged: boolean;
|
|
254
|
+
protected isUpwardScrolling: boolean;
|
|
255
|
+
protected containerElementRect: ClientRect;
|
|
256
|
+
protected previousEndIndex: number;
|
|
257
|
+
protected previousInfo: VirtualInfo;
|
|
258
|
+
protected startIndex: number;
|
|
259
|
+
protected currentPageNumber: number;
|
|
260
|
+
protected pageCount: number;
|
|
261
|
+
protected isPreventKeyAction: boolean;
|
|
262
|
+
protected virtualItemStartIndex: number;
|
|
263
|
+
protected virtualItemEndIndex: number;
|
|
264
|
+
protected generatedDataObject: GeneratedData;
|
|
265
|
+
protected listItemHeight: number;
|
|
266
|
+
protected skeletonCount: number;
|
|
267
|
+
protected popupContentElement: HTMLElement;
|
|
268
|
+
protected keyboardEvent: KeyboardEventArgs;
|
|
269
|
+
protected listContainerHeight: string;
|
|
270
|
+
protected isVirtualTrackHeight: boolean;
|
|
271
|
+
protected virtualSelectAll: boolean;
|
|
272
|
+
protected incrementalQueryString: string;
|
|
273
|
+
protected incrementalEndIndex: number;
|
|
274
|
+
protected incrementalStartIndex: number;
|
|
275
|
+
protected incrementalPreQueryString: string;
|
|
276
|
+
protected isObjectCustomValue: boolean;
|
|
277
|
+
protected appendUncheckList: boolean;
|
|
278
|
+
protected virtualSelectAllData: {
|
|
279
|
+
[key: string]: Object;
|
|
280
|
+
}[] | DataManager | string[] | number[] | boolean[];
|
|
281
|
+
protected firstItem: string | number | boolean | object;
|
|
282
|
+
protected virtualListInfo: VirtualInfo;
|
|
283
|
+
protected viewPortInfo: VirtualInfo;
|
|
284
|
+
protected selectedValueInfo: VirtualInfo;
|
|
237
285
|
/**
|
|
238
286
|
|
|
239
287
|
/**
|
|
@@ -454,6 +502,15 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
454
502
|
private getItemValue;
|
|
455
503
|
private templateCompiler;
|
|
456
504
|
protected l10nUpdate(actionFailure?: boolean): void;
|
|
505
|
+
protected checkAndResetCache(): void;
|
|
506
|
+
protected updateIncrementalInfo(startIndex: number, endIndex: number): void;
|
|
507
|
+
protected updateIncrementalView(startIndex: number, endIndex: number): void;
|
|
508
|
+
protected updateVirtualItemIndex(): void;
|
|
509
|
+
protected getFilteringSkeletonCount(): void;
|
|
510
|
+
protected getSkeletonCount(retainSkeleton?: boolean): void;
|
|
511
|
+
protected GetVirtualTrackHeight(): string;
|
|
512
|
+
protected getTransformValues(): string;
|
|
513
|
+
protected UpdateSkeleton(isSkeletonCountChange?: boolean, skeletonCount?: number): void;
|
|
457
514
|
protected getLocaleName(): string;
|
|
458
515
|
protected getTextByValue(value: string | number | boolean): string;
|
|
459
516
|
protected getFormattedValue(value: string): string | number | boolean;
|
|
@@ -506,6 +563,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
506
563
|
protected updatePopupState(): void;
|
|
507
564
|
protected updateRemoteData(): void;
|
|
508
565
|
private bindChildItems;
|
|
566
|
+
protected isObjectInArray(objectToFind: any, array: any[]): boolean;
|
|
509
567
|
protected updateListValues(): void;
|
|
510
568
|
protected findListElement(list: HTMLElement, findNode: string, attribute: string, value: string | boolean | number): HTMLElement;
|
|
511
569
|
private raiseDataBound;
|
|
@@ -527,7 +585,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
527
585
|
* @returns {Query} Returns the query to do the data query operation.
|
|
528
586
|
*/
|
|
529
587
|
protected getQuery(query: Query): Query;
|
|
530
|
-
protected updateVirtualizationProperties(itemCount: number, filtering: boolean): void;
|
|
588
|
+
protected updateVirtualizationProperties(itemCount: number, filtering: boolean, isCheckbox?: boolean): void;
|
|
531
589
|
/**
|
|
532
590
|
* To render the template content for group header element.
|
|
533
591
|
*
|
|
@@ -561,7 +619,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
561
619
|
*/
|
|
562
620
|
protected renderItems(listData: {
|
|
563
621
|
[key: string]: Object;
|
|
564
|
-
}[], fields: FieldSettingsModel): HTMLElement;
|
|
622
|
+
}[], fields: FieldSettingsModel, isCheckBoxUpdate?: boolean): HTMLElement;
|
|
565
623
|
private createVirtualContent;
|
|
566
624
|
private updateListElements;
|
|
567
625
|
protected templateListItem(dataSource: {
|
|
@@ -580,7 +638,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
580
638
|
* @param {string | number | boolean} value - Specifies given value.
|
|
581
639
|
* @returns {number} Returns the index of the item.
|
|
582
640
|
*/
|
|
583
|
-
protected getIndexByValue(value: string | number | boolean): number;
|
|
641
|
+
protected getIndexByValue(value: string | number | boolean | object): number;
|
|
584
642
|
/**
|
|
585
643
|
* Return the index of item which matched with given value in data source
|
|
586
644
|
*
|
|
@@ -616,9 +674,11 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
616
674
|
protected updateSelectElementData(isFiltering: boolean): void;
|
|
617
675
|
protected updateSelection(): void;
|
|
618
676
|
protected renderList(): void;
|
|
619
|
-
protected updateDataSource(props?: DropDownBaseModel): void;
|
|
677
|
+
protected updateDataSource(props?: DropDownBaseModel, oldProps?: DropDownBaseModel): void;
|
|
620
678
|
protected setUpdateInitial(props: string[], newProp: {
|
|
621
679
|
[key: string]: string;
|
|
680
|
+
}, oldProp?: {
|
|
681
|
+
[key: string]: string;
|
|
622
682
|
}): void;
|
|
623
683
|
/**
|
|
624
684
|
* When property value changes happened, then onPropertyChanged method will execute the respective changes in this component.
|
|
@@ -678,7 +738,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
|
|
|
678
738
|
* @param { string | number } value - Specifies the value of the list item.
|
|
679
739
|
* @returns {Object}
|
|
680
740
|
*/
|
|
681
|
-
getDataByValue(value: string | number | boolean): {
|
|
741
|
+
getDataByValue(value: string | number | boolean | object): {
|
|
682
742
|
[key: string]: Object;
|
|
683
743
|
} | string | number | boolean;
|
|
684
744
|
/**
|