@syncfusion/ej2-treegrid 20.2.49 → 20.3.47

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 (88) hide show
  1. package/CHANGELOG.md +1 -54
  2. package/dist/ej2-treegrid.min.js +10 -0
  3. package/dist/ej2-treegrid.umd.min.js +2 -2
  4. package/dist/ej2-treegrid.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-treegrid.es2015.js +366 -56
  6. package/dist/es6/ej2-treegrid.es2015.js.map +1 -1
  7. package/dist/es6/ej2-treegrid.es5.js +395 -61
  8. package/dist/es6/ej2-treegrid.es5.js.map +1 -1
  9. package/dist/global/ej2-treegrid.min.js +2 -2
  10. package/dist/global/ej2-treegrid.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +10 -10
  13. package/src/treegrid/actions/clipboard.d.ts +3 -2
  14. package/src/treegrid/actions/clipboard.js +3 -2
  15. package/src/treegrid/actions/context-menu.js +1 -1
  16. package/src/treegrid/actions/crud-actions.js +4 -0
  17. package/src/treegrid/actions/edit.js +23 -5
  18. package/src/treegrid/actions/freeze-column.d.ts +1 -0
  19. package/src/treegrid/actions/freeze-column.js +39 -3
  20. package/src/treegrid/actions/rowdragdrop.js +8 -5
  21. package/src/treegrid/actions/selection.js +2 -2
  22. package/src/treegrid/actions/virtual-scroll.js +7 -4
  23. package/src/treegrid/base/constant.d.ts +28 -0
  24. package/src/treegrid/base/constant.js +28 -0
  25. package/src/treegrid/base/data.d.ts +1 -0
  26. package/src/treegrid/base/data.js +3 -2
  27. package/src/treegrid/base/treegrid-model.d.ts +1 -1
  28. package/src/treegrid/base/treegrid.d.ts +2 -0
  29. package/src/treegrid/base/treegrid.js +33 -9
  30. package/src/treegrid/renderer/virtual-row-model-generator.js +4 -0
  31. package/src/treegrid/renderer/virtual-tree-content-render.d.ts +3 -0
  32. package/src/treegrid/renderer/virtual-tree-content-render.js +68 -9
  33. package/src/treegrid/renderer/virtual-tree-freeze-render.d.ts +59 -0
  34. package/src/treegrid/renderer/virtual-tree-freeze-render.js +163 -0
  35. package/styles/bootstrap-dark.css +5 -1
  36. package/styles/bootstrap.css +5 -1
  37. package/styles/bootstrap4.css +5 -1
  38. package/styles/bootstrap5-dark.css +6 -1
  39. package/styles/bootstrap5.css +6 -1
  40. package/styles/fabric-dark.css +5 -1
  41. package/styles/fabric.css +5 -1
  42. package/styles/fluent-dark.css +5 -1
  43. package/styles/fluent.css +5 -1
  44. package/styles/highcontrast-light.css +5 -1
  45. package/styles/highcontrast.css +5 -1
  46. package/styles/material-dark.css +5 -1
  47. package/styles/material.css +5 -1
  48. package/styles/tailwind-dark.css +5 -1
  49. package/styles/tailwind.css +5 -1
  50. package/styles/treegrid/_all.scss +1 -1
  51. package/styles/treegrid/_bootstrap-dark-definition.scss +1 -1
  52. package/styles/treegrid/_bootstrap-definition.scss +1 -2
  53. package/styles/treegrid/_bootstrap4-definition.scss +0 -1
  54. package/styles/treegrid/_bootstrap5-definition.scss +0 -1
  55. package/styles/treegrid/_fabric-dark-definition.scss +1 -2
  56. package/styles/treegrid/_fabric-definition.scss +1 -2
  57. package/styles/treegrid/_fluent-definition.scss +0 -1
  58. package/styles/treegrid/_fusionnew-definition.scss +0 -1
  59. package/styles/treegrid/_highcontrast-definition.scss +0 -1
  60. package/styles/treegrid/_highcontrast-light-definition.scss +0 -2
  61. package/styles/treegrid/_icons.scss +1 -1
  62. package/styles/treegrid/_layout.scss +3 -3
  63. package/styles/treegrid/_material-definition.scss +0 -1
  64. package/styles/treegrid/_material3-definition.scss +0 -1
  65. package/styles/treegrid/_tailwind-definition.scss +0 -1
  66. package/styles/treegrid/_theme.scss +1 -0
  67. package/styles/treegrid/bootstrap-dark.css +5 -1
  68. package/styles/treegrid/bootstrap.css +5 -1
  69. package/styles/treegrid/bootstrap4.css +5 -1
  70. package/styles/treegrid/bootstrap5-dark.css +6 -1
  71. package/styles/treegrid/bootstrap5.css +6 -1
  72. package/styles/treegrid/fabric-dark.css +5 -1
  73. package/styles/treegrid/fabric.css +5 -1
  74. package/styles/treegrid/fluent-dark.css +5 -1
  75. package/styles/treegrid/fluent.css +5 -1
  76. package/styles/treegrid/highcontrast-light.css +5 -1
  77. package/styles/treegrid/highcontrast.css +5 -1
  78. package/styles/treegrid/icons/_bootstrap-dark.scss +1 -1
  79. package/styles/treegrid/icons/_bootstrap.scss +1 -1
  80. package/styles/treegrid/icons/_bootstrap4.scss +1 -1
  81. package/styles/treegrid/icons/_fabric-dark.scss +1 -1
  82. package/styles/treegrid/icons/_fabric.scss +1 -1
  83. package/styles/treegrid/icons/_highcontrast-light.scss +1 -1
  84. package/styles/treegrid/icons/_material-dark.scss +1 -1
  85. package/styles/treegrid/material-dark.css +5 -1
  86. package/styles/treegrid/material.css +5 -1
  87. package/styles/treegrid/tailwind-dark.css +5 -1
  88. package/styles/treegrid/tailwind.css +5 -1
@@ -79,6 +79,8 @@ var TreeVirtualRowModelGenerator = /** @class */ (function (_super) {
79
79
  var currentPage = this[model].currentPage;
80
80
  if (clear) {
81
81
  this.cache = {};
82
+ this.movableCache = {};
83
+ this.frozenRightCache = {};
82
84
  this.data = {};
83
85
  this.groups = {};
84
86
  }
@@ -92,6 +94,8 @@ var TreeVirtualRowModelGenerator = /** @class */ (function (_super) {
92
94
  this.cache = {};
93
95
  this.data = {};
94
96
  this.groups = {};
97
+ this.movableCache = {};
98
+ this.frozenRightCache = {};
95
99
  }
96
100
  }
97
101
  return clear;
@@ -25,6 +25,9 @@ export declare class VirtualTreeContentRenderer extends VirtualContentRenderer {
25
25
  /** @hidden */
26
26
  isDataSourceChanged: boolean;
27
27
  getRowByIndex(index: number): Element;
28
+ getMovableVirtualRowByIndex(index: number): Element;
29
+ getFrozenRightVirtualRowByIndex(index: number): Element;
30
+ getRowCollection(index: number, isMovable: boolean, isRowObject?: boolean, isFrozenRight?: boolean): Element | Object;
28
31
  addEventListener(): void;
29
32
  private virtualOtherAction;
30
33
  private indexModifier;
@@ -13,6 +13,7 @@ var __extends = (this && this.__extends) || (function () {
13
13
  })();
14
14
  import { Cell, CellType } from '@syncfusion/ej2-grids';
15
15
  import { VirtualContentRenderer } from '@syncfusion/ej2-grids';
16
+ import * as literals from '../base/constant';
16
17
  import { InterSectionObserver } from '@syncfusion/ej2-grids';
17
18
  import { TreeVirtualRowModelGenerator } from '../renderer/virtual-row-model-generator';
18
19
  import * as events from '../base/constant';
@@ -43,6 +44,29 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
43
44
  VirtualTreeContentRenderer.prototype.getRowByIndex = function (index) {
44
45
  return this.parent.getDataRows().filter(function (e) { return parseInt(e.getAttribute('data-rowindex'), 10) === index; })[0];
45
46
  };
47
+ VirtualTreeContentRenderer.prototype.getMovableVirtualRowByIndex = function (index) {
48
+ return this.getRowCollection(index, true);
49
+ };
50
+ VirtualTreeContentRenderer.prototype.getFrozenRightVirtualRowByIndex = function (index) {
51
+ return this.getRowCollection(index, false, false, true);
52
+ };
53
+ VirtualTreeContentRenderer.prototype.getRowCollection = function (index, isMovable, isRowObject, isFrozenRight) {
54
+ var startIdx = parseInt(this.parent.getRows()[0].getAttribute(literals.dataRowIndex), 10);
55
+ var rowCollection = isMovable ? this.parent.getMovableDataRows() : this.parent.getDataRows();
56
+ rowCollection = isFrozenRight ? this.parent.getFrozenRightDataRows() : rowCollection;
57
+ var collection = isRowObject ? this.parent.getCurrentViewRecords() : rowCollection;
58
+ var selectedRow = collection[index - startIdx];
59
+ if (this.parent.frozenRows && this.parent.pageSettings.currentPage > 1) {
60
+ if (!isRowObject) {
61
+ selectedRow = index <= this.parent.frozenRows ? rowCollection[index]
62
+ : rowCollection[(index - startIdx) + this.parent.frozenRows];
63
+ }
64
+ else {
65
+ selectedRow = index <= this.parent.frozenRows ? this.parent.getRowsObject()[index].data : selectedRow;
66
+ }
67
+ }
68
+ return selectedRow;
69
+ };
46
70
  VirtualTreeContentRenderer.prototype.addEventListener = function () {
47
71
  this.parent.on(events.virtualActionArgs, this.virtualOtherAction, this);
48
72
  this.parent.on(events.indexModifier, this.indexModifier, this);
@@ -70,7 +94,7 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
70
94
  this.startIndex = lastIndex - this.parent.getRows().length;
71
95
  this.endIndex = lastIndex;
72
96
  }
73
- else {
97
+ else if (this.parent.root.editSettings.newRowPosition !== 'Top' && this.parent.root.editModule.selectedIndex !== -1 || this.parent.root.editModule.selectedIndex !== -1) {
74
98
  this.startIndex += 1;
75
99
  this.endIndex += 1;
76
100
  }
@@ -122,7 +146,15 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
122
146
  && this.parent.dataSource.dataSource.offline && this.parent.dataSource.dataSource.url !== '') || !isCountRequired(this.parent)) {
123
147
  if (!isNullOrUndefined(e.count)) {
124
148
  this.totalRecords = e.count;
125
- if (!this.parent.enableColumnVirtualization) {
149
+ // To overcome the white space issue in last page when records collapsed
150
+ if (this.parent.isFrozenGrid() && e.count < Object.keys(this.parent.dataSource).length) {
151
+ var width = this.parent.enableColumnVirtualization ?
152
+ this.getColumnOffset(this.parent.columns.length - 1) + 'px' : '100%';
153
+ var height = (this.parent.getRowHeight() * e.count) -
154
+ (this.parent.getRowHeight() * this.parent.pageSettings.pageSize);
155
+ getValue('virtualEle', this).setVirtualHeight(height, width);
156
+ }
157
+ if (!this.parent.enableColumnVirtualization && !this.parent.isFrozenGrid()) {
126
158
  getValue('virtualEle', this).setVirtualHeight(this.parent.getRowHeight() * e.count, '100%');
127
159
  }
128
160
  }
@@ -220,6 +252,7 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
220
252
  return new Cell(opt);
221
253
  };
222
254
  VirtualTreeContentRenderer.prototype.beginEdit = function (e) {
255
+ this['editedRowIndex'] = e.index;
223
256
  var selector = '.e-row[data-rowindex="' + e.index + '"]';
224
257
  var index = this.parent.getContent().querySelector(selector).rowIndex;
225
258
  var rowData = this.parent.getCurrentViewRecords()[index];
@@ -277,7 +310,7 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
277
310
  var content = this.parent.getContent().querySelector('.e-content');
278
311
  if (this[isAdd] && !content.querySelector('.e-addedrow')) {
279
312
  this.parent.isEdit = false;
280
- this.parent.addRecord();
313
+ this.parent.editModule.addRecord(null, this.parent.root.editModule.selectedIndex);
281
314
  }
282
315
  };
283
316
  VirtualTreeContentRenderer.prototype.getData = function (data) {
@@ -290,7 +323,7 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
290
323
  this.parent.notify('get-row-position', addArgs);
291
324
  this.rowPosition = addArgs.newRowPosition;
292
325
  this.addRowIndex = addArgs.addRowIndex;
293
- this.dataRowIndex = addArgs.dataRowIndex;
326
+ this.dataRowIndex = this.parent.root.editModule.selectedIndex;
294
327
  }
295
328
  var actionComplete = 'actionComplete';
296
329
  _super.prototype[actionComplete].call(this, args);
@@ -312,14 +345,17 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
312
345
  var maxLeft = _this.vgenerator.cOffsets[idx - 1];
313
346
  x = x > maxLeft ? maxLeft : x; //TODO: This fix horizontal scrollbar jumping issue in column virtualization.
314
347
  }
315
- _this.virtualEle.adjustTable(x, _this.translateY);
316
- if (_this.parent.enableColumnVirtualization) {
317
- _this.header.virtualEle.adjustTable(x, 0);
348
+ if (!_this.parent.isFrozenGrid()) {
349
+ _this.virtualEle.adjustTable(x, _this.translateY);
350
+ if (_this.parent.enableColumnVirtualization) {
351
+ _this.header.virtualEle.adjustTable(x, 0);
352
+ }
318
353
  }
319
354
  }
320
355
  };
321
356
  };
322
357
  VirtualTreeContentRenderer.prototype.scrollListeners = function (scrollArgs) {
358
+ this['scrollAfterEdit']();
323
359
  var info = scrollArgs.sentinel;
324
360
  var outBuffer = this.parent.pageSettings.pageSize - Math.ceil(this.parent.pageSettings.pageSize / 2);
325
361
  var content = this.parent.getContent().querySelector('.e-content');
@@ -347,7 +383,8 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
347
383
  this.endIndex = lastInx;
348
384
  this.startIndex = (this.startIndex - remains) < 0 ? 0 : (this.startIndex - remains);
349
385
  }
350
- if (currentViewData.length && ((currentViewData[0][indexValue] - this.startIndex) < (this.parent.pageSettings.pageSize / 2))) {
386
+ if (currentViewData.length && (currentViewData[0][indexValue] >= this.parent.pageSettings.pageSize / 2) &&
387
+ ((currentViewData[0][indexValue] - this.startIndex) < (this.parent.pageSettings.pageSize / 2))) {
351
388
  this.startIndex = currentViewData[0][indexValue] - (this.parent.pageSettings.pageSize / 2);
352
389
  this.endIndex = this.startIndex + this.parent.pageSettings.pageSize;
353
390
  }
@@ -412,6 +449,7 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
412
449
  this.parent.setColumnIndexesInView(this.parent.enableColumnVirtualization ? viewInfo.columnIndexes : []);
413
450
  var page = viewInfo.loadNext && !viewInfo.loadSelf ? viewInfo.nextInfo.page : viewInfo.page;
414
451
  this.parent.setProperties({ pageSettings: { currentPage: page } }, true);
452
+ this.requestType = 'virtualscroll';
415
453
  if (scrollArgs.direction !== 'right' && scrollArgs.direction !== 'left') {
416
454
  viewInfo.event = viewInfo.event === 'refresh-virtual-block' ? 'model-changed' : viewInfo.event;
417
455
  }
@@ -419,12 +457,28 @@ var VirtualTreeContentRenderer = /** @class */ (function (_super) {
419
457
  }
420
458
  };
421
459
  VirtualTreeContentRenderer.prototype.appendContent = function (target, newChild, e) {
460
+ var isFrozen = this.parent.isFrozenGrid();
422
461
  if ((this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
423
- && !this.parent.dataSource.dataSource.offline && this.parent.dataSource.dataSource.url !== '') || isCountRequired(this.parent)) {
462
+ && !this.parent.dataSource.dataSource.offline && this.parent.dataSource.dataSource.url !== '') || isCountRequired(this.parent) || this.parent.isFrozenGrid()) {
424
463
  if (getValue('isExpandCollapse', e)) {
425
464
  this.isRemoteExpand = true;
426
465
  }
466
+ if (isFrozen && isNullOrUndefined(this.requestType) && getValue('requestTypes', this).indexOf('isFrozen') === -1) {
467
+ getValue('requestTypes', this).push('isFrozen');
468
+ this.requestType = 'isFrozen';
469
+ }
427
470
  _super.prototype.appendContent.call(this, target, newChild, e);
471
+ if (getValue('requestTypes', this).indexOf('isFrozen') !== -1) {
472
+ getValue('requestTypes', this).splice(getValue('requestTypes', this).indexOf('isFrozen'), 1);
473
+ this.requestType = this.requestType === 'isFrozen' ? undefined : this.requestType;
474
+ }
475
+ if (isFrozen && (!this.isExpandCollapse || this.translateY === 0)) {
476
+ this.translateY = this.translateY < 0 ? 0 : this.translateY;
477
+ getValue('virtualEle', this).adjustTable(0, this.translateY);
478
+ }
479
+ else {
480
+ this.isExpandCollapse = false;
481
+ }
428
482
  }
429
483
  else {
430
484
  var info = e.virtualInfo.sentinelInfo && e.virtualInfo.sentinelInfo.axis === 'Y' &&
@@ -514,6 +568,11 @@ var TreeInterSectionObserver = /** @class */ (function (_super) {
514
568
  var containerRect = 'containerRect';
515
569
  _super.prototype[containerRect] = getValue('options', this).container.getBoundingClientRect();
516
570
  EventHandler.add(getValue('options', this).container, 'scroll', this.virtualScrollHandlers(callback, onEnterCallback), this);
571
+ if (getValue('options', this).movableContainer) {
572
+ var movableContainerRect = 'movableContainerRect';
573
+ _super.prototype[movableContainerRect] = getValue('options', this).movableContainer.getBoundingClientRect();
574
+ EventHandler.add(getValue('options', this).movableContainer, 'scroll', this.virtualScrollHandlers(callback, onEnterCallback), this);
575
+ }
517
576
  };
518
577
  TreeInterSectionObserver.prototype.clear = function () {
519
578
  this.lastPos = null;
@@ -0,0 +1,59 @@
1
+ import { Column, IGrid, NotifyArgs, Row, ServiceLocator } from '@syncfusion/ej2-grids';
2
+ import { ColumnVirtualFreezeRenderer, VirtualFreezeHdrRenderer, VirtualFreezeRenderer } from '@syncfusion/ej2-grids';
3
+ /**
4
+ * VirtualTreeFreezeRenderer is used to render the virtual table within the frozen and movable content table
5
+ *
6
+ * @hidden
7
+ */
8
+ export declare class VirtualTreeFreezeRenderer extends VirtualFreezeRenderer {
9
+ protected serviceLoc: ServiceLocator;
10
+ constructor(parent: IGrid, locator?: ServiceLocator);
11
+ /**
12
+ * @returns {void}
13
+ * @hidden
14
+ */
15
+ renderTable(): void;
16
+ /**
17
+ * @param {HTMLElement} target - specifies the target
18
+ * @param {DocumentFragment} newChild - specifies the newChild
19
+ * @param {NotifyArgs} e - specifies the notifyargs
20
+ * @returns {void}
21
+ * @hidden
22
+ */
23
+ appendContent(target: HTMLElement, newChild: DocumentFragment, e: NotifyArgs): void;
24
+ /**
25
+ * @param {Object[]} data - specifies the data
26
+ * @param {NotifyArgs} e - specifies the notifyargs
27
+ * @returns {Row<Column>[]} returns the row
28
+ * @hidden
29
+ */
30
+ generateRows(data: Object[], e?: NotifyArgs): Row<Column>[];
31
+ }
32
+ /**
33
+ * ColumnVirtualTreeFreezeRenderer is used to render the virtual table within the frozen and movable content table
34
+ *
35
+ * @hidden
36
+ */
37
+ export declare class ColumnVirtualTreeFreezeRenderer extends ColumnVirtualFreezeRenderer {
38
+ protected serviceLoc: ServiceLocator;
39
+ constructor(parent?: IGrid, locator?: ServiceLocator);
40
+ /**
41
+ * @returns {void}
42
+ * @hidden
43
+ */
44
+ renderTable(): void;
45
+ appendContent(target: HTMLElement, newChild: DocumentFragment, e: NotifyArgs): void;
46
+ }
47
+ /**
48
+ * VirtualTreeFreezeHdrRenderer is used to render the virtual table within the frozen and movable header table
49
+ *
50
+ * @hidden
51
+ */
52
+ export declare class VirtualTreeFreezeHdrRenderer extends VirtualFreezeHdrRenderer {
53
+ /**
54
+ * @returns {void}
55
+ * @hidden
56
+ */
57
+ renderTable(): void;
58
+ protected rfshMovable(): void;
59
+ }
@@ -0,0 +1,163 @@
1
+ var __extends = (this && this.__extends) || (function () {
2
+ var extendStatics = function (d, b) {
3
+ extendStatics = Object.setPrototypeOf ||
4
+ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
5
+ function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
6
+ return extendStatics(d, b);
7
+ };
8
+ return function (d, b) {
9
+ extendStatics(d, b);
10
+ function __() { this.constructor = d; }
11
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
12
+ };
13
+ })();
14
+ import { ColumnFreezeContentRenderer, FreezeContentRender, FreezeRowModelGenerator, RenderType } from '@syncfusion/ej2-grids';
15
+ import * as literals from '../base/constant';
16
+ import { ColumnVirtualFreezeRenderer, setDebounce, VirtualFreezeHdrRenderer, VirtualFreezeRenderer } from '@syncfusion/ej2-grids';
17
+ import { TreeInterSectionObserver, VirtualTreeContentRenderer } from './virtual-tree-content-render';
18
+ import { getValue } from '@syncfusion/ej2-base';
19
+ /**
20
+ * VirtualTreeFreezeRenderer is used to render the virtual table within the frozen and movable content table
21
+ *
22
+ * @hidden
23
+ */
24
+ var VirtualTreeFreezeRenderer = /** @class */ (function (_super) {
25
+ __extends(VirtualTreeFreezeRenderer, _super);
26
+ function VirtualTreeFreezeRenderer(parent, locator) {
27
+ var _this = _super.call(this, parent, locator) || this;
28
+ _this.addEventListener();
29
+ return _this;
30
+ }
31
+ /**
32
+ * @returns {void}
33
+ * @hidden
34
+ */
35
+ VirtualTreeFreezeRenderer.prototype.renderTable = function () {
36
+ this.freezeRowGenerator = new FreezeRowModelGenerator(this.parent);
37
+ this.virtualRenderer = new VirtualTreeContentRenderer(this.parent, this.serviceLoc);
38
+ this.virtualRenderer.header = this.serviceLoc.getService('rendererFactory')
39
+ .getRenderer(RenderType.Header).virtualHdrRenderer;
40
+ FreezeContentRender.prototype.renderTable.call(this);
41
+ this.virtualRenderer.setPanel(this.parent.getContent());
42
+ this.scrollbar = this.parent.getContent().querySelector('.e-movablescrollbar');
43
+ var movableCont = this.getMovableContent();
44
+ var minHeight = this.parent.height;
45
+ this.virtualRenderer.virtualEle.content = this.virtualRenderer.content = this.getPanel().querySelector('.' + literals.content);
46
+ this.virtualRenderer.virtualEle.content.style.overflowX = 'hidden';
47
+ this.virtualRenderer.virtualEle.renderFrozenWrapper(minHeight);
48
+ this.virtualRenderer.virtualEle.renderFrozenPlaceHolder();
49
+ if (this.parent.enableColumnVirtualization) {
50
+ this.virtualRenderer.virtualEle.movableContent = this.virtualRenderer.movableContent
51
+ = this.getPanel().querySelector('.' + literals.movableContent);
52
+ this.virtualRenderer.virtualEle.renderMovableWrapper(minHeight);
53
+ this.virtualRenderer.virtualEle.renderMovablePlaceHolder();
54
+ var tbl = movableCont.querySelector('table');
55
+ this.virtualRenderer.virtualEle.movableTable = tbl;
56
+ this.virtualRenderer.virtualEle.movableWrapper.appendChild(tbl);
57
+ movableCont.appendChild(this.virtualRenderer.virtualEle.movableWrapper);
58
+ movableCont.appendChild(this.virtualRenderer.virtualEle.movablePlaceholder);
59
+ }
60
+ this.virtualRenderer.virtualEle.wrapper.appendChild(this.getFrozenContent());
61
+ this.virtualRenderer.virtualEle.wrapper.appendChild(movableCont);
62
+ this.virtualRenderer.virtualEle.table = this.getTable();
63
+ setDebounce(this.parent, this.virtualRenderer, this.scrollbar, this.getMovableContent());
64
+ };
65
+ /**
66
+ * @param {HTMLElement} target - specifies the target
67
+ * @param {DocumentFragment} newChild - specifies the newChild
68
+ * @param {NotifyArgs} e - specifies the notifyargs
69
+ * @returns {void}
70
+ * @hidden
71
+ */
72
+ VirtualTreeFreezeRenderer.prototype.appendContent = function (target, newChild, e) {
73
+ getValue('observer', this.virtualRenderer).options.debounceEvent = false;
74
+ this.virtualRenderer['observers'] = new TreeInterSectionObserver(getValue('observer', this.virtualRenderer).element, getValue('observer', this.virtualRenderer).options, getValue('observer', this.virtualRenderer).movableEle);
75
+ this.virtualRenderer['contents'] = this.getPanel().firstChild;
76
+ _super.prototype.appendContent.call(this, target, newChild, e);
77
+ };
78
+ /**
79
+ * @param {Object[]} data - specifies the data
80
+ * @param {NotifyArgs} e - specifies the notifyargs
81
+ * @returns {Row<Column>[]} returns the row
82
+ * @hidden
83
+ */
84
+ VirtualTreeFreezeRenderer.prototype.generateRows = function (data, e) {
85
+ return _super.prototype.generateRows.call(this, data, e);
86
+ };
87
+ return VirtualTreeFreezeRenderer;
88
+ }(VirtualFreezeRenderer));
89
+ export { VirtualTreeFreezeRenderer };
90
+ /**
91
+ * ColumnVirtualTreeFreezeRenderer is used to render the virtual table within the frozen and movable content table
92
+ *
93
+ * @hidden
94
+ */
95
+ var ColumnVirtualTreeFreezeRenderer = /** @class */ (function (_super) {
96
+ __extends(ColumnVirtualTreeFreezeRenderer, _super);
97
+ function ColumnVirtualTreeFreezeRenderer(parent, locator) {
98
+ var _this = _super.call(this, parent, locator) || this;
99
+ _this.serviceLoc = locator;
100
+ _this.eventListener('on');
101
+ return _this;
102
+ }
103
+ /**
104
+ * @returns {void}
105
+ * @hidden
106
+ */
107
+ ColumnVirtualTreeFreezeRenderer.prototype.renderTable = function () {
108
+ this.virtualRenderer = new VirtualTreeContentRenderer(this.parent, this.serviceLoc);
109
+ this.virtualRenderer.header = this.serviceLoc.getService('rendererFactory')
110
+ .getRenderer(RenderType.Header).virtualHdrRenderer;
111
+ this.freezeRowGenerator = new FreezeRowModelGenerator(this.parent);
112
+ ColumnFreezeContentRenderer.prototype.renderTable.call(this);
113
+ this.virtualRenderer.setPanel(this.parent.getContent());
114
+ this.scrollbar = this.parent.getContent().querySelector('.e-movablescrollbar');
115
+ var frozenRightCont = this.getFrozenRightContent();
116
+ var frzCont = this.getFrozenContent();
117
+ var movableCont = this.getMovableContent();
118
+ if (this.parent.getFrozenMode() === 'Right') {
119
+ frzCont = frozenRightCont;
120
+ }
121
+ this.virtualRenderer.virtualEle.content = this.virtualRenderer.content = this.getPanel().querySelector('.' + literals.content);
122
+ this.virtualRenderer.virtualEle.content.style.overflowX = 'hidden';
123
+ var minHeight = this.parent.height;
124
+ this.virtualRenderer.virtualEle.renderFrozenWrapper(minHeight);
125
+ this.virtualRenderer.virtualEle.renderFrozenPlaceHolder();
126
+ _super.prototype['renderVirtualFrozenLeft'].call(this, frzCont, movableCont);
127
+ _super.prototype['renderVirtualFrozenRight'].call(this, frzCont, movableCont);
128
+ _super.prototype['renderVirtualFrozenLeftRight'].call(this, frzCont, movableCont, frozenRightCont);
129
+ this.virtualRenderer.virtualEle.table = this.getTable();
130
+ setDebounce(this.parent, this.virtualRenderer, this.scrollbar, this.getMovableContent());
131
+ };
132
+ ColumnVirtualTreeFreezeRenderer.prototype.appendContent = function (target, newChild, e) {
133
+ getValue('observer', this.virtualRenderer).options.debounceEvent = false;
134
+ this.virtualRenderer['observers'] = new TreeInterSectionObserver(getValue('observer', this.virtualRenderer).element, getValue('observer', this.virtualRenderer).options, getValue('observer', this.virtualRenderer).movableEle);
135
+ this.virtualRenderer['contents'] = this.getPanel().firstChild;
136
+ _super.prototype.appendContent.call(this, target, newChild, e);
137
+ };
138
+ return ColumnVirtualTreeFreezeRenderer;
139
+ }(ColumnVirtualFreezeRenderer));
140
+ export { ColumnVirtualTreeFreezeRenderer };
141
+ /**
142
+ * VirtualTreeFreezeHdrRenderer is used to render the virtual table within the frozen and movable header table
143
+ *
144
+ * @hidden
145
+ */
146
+ var VirtualTreeFreezeHdrRenderer = /** @class */ (function (_super) {
147
+ __extends(VirtualTreeFreezeHdrRenderer, _super);
148
+ function VirtualTreeFreezeHdrRenderer() {
149
+ return _super !== null && _super.apply(this, arguments) || this;
150
+ }
151
+ /**
152
+ * @returns {void}
153
+ * @hidden
154
+ */
155
+ VirtualTreeFreezeHdrRenderer.prototype.renderTable = function () {
156
+ _super.prototype.renderTable.call(this);
157
+ };
158
+ VirtualTreeFreezeHdrRenderer.prototype.rfshMovable = function () {
159
+ _super.prototype.rfshMovable.call(this);
160
+ };
161
+ return VirtualTreeFreezeHdrRenderer;
162
+ }(VirtualFreezeHdrRenderer));
163
+ export { VirtualTreeFreezeHdrRenderer };
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-popup.e-ddl {
2
3
  border-radius: 4px;
3
4
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
@@ -103,6 +104,7 @@
103
104
  min-height: 34px;
104
105
  }
105
106
 
107
+ /* stylelint-disable property-no-vendor-prefix */
106
108
  @keyframes material-spinner-rotate {
107
109
  0% {
108
110
  transform: rotate(0);
@@ -445,4 +447,6 @@
445
447
  }
446
448
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
447
449
  height: 0;
448
- }
450
+ }
451
+
452
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-popup.e-ddl {
2
3
  border-radius: 4px;
3
4
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
@@ -103,6 +104,7 @@
103
104
  min-height: 34px;
104
105
  }
105
106
 
107
+ /* stylelint-disable property-no-vendor-prefix */
106
108
  @keyframes material-spinner-rotate {
107
109
  0% {
108
110
  transform: rotate(0);
@@ -446,4 +448,6 @@
446
448
  }
447
449
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
448
450
  height: 0;
449
- }
451
+ }
452
+
453
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-input-group.e-ddl .e-control.e-autocomplete ~ .e-ddl-icon {
2
3
  font-size: 8px;
3
4
  }
@@ -145,6 +146,7 @@
145
146
  min-height: 34px;
146
147
  }
147
148
 
149
+ /* stylelint-disable property-no-vendor-prefix */
148
150
  @keyframes material-spinner-rotate {
149
151
  0% {
150
152
  transform: rotate(0);
@@ -481,4 +483,6 @@
481
483
  }
482
484
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
483
485
  height: 0;
484
- }
486
+ }
487
+
488
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-popup.e-ddl {
2
3
  border-radius: 4px;
3
4
  box-shadow: none;
@@ -144,6 +145,7 @@
144
145
  min-height: 34px;
145
146
  }
146
147
 
148
+ /* stylelint-disable property-no-vendor-prefix */
147
149
  @keyframes material-spinner-rotate {
148
150
  0% {
149
151
  transform: rotate(0);
@@ -161,6 +163,7 @@
161
163
  }
162
164
  }
163
165
  /*! Toolbar's bootstrap5 theme wise override definitions and variables */
166
+ /* stylelint-disable */
164
167
  .e-treegrid .e-indent::before,
165
168
  .e-grid-menu .e-indent::before {
166
169
  content: "\e810";
@@ -481,4 +484,6 @@
481
484
  }
482
485
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
483
486
  height: 0;
484
- }
487
+ }
488
+
489
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-popup.e-ddl {
2
3
  border-radius: 4px;
3
4
  box-shadow: none;
@@ -144,6 +145,7 @@
144
145
  min-height: 34px;
145
146
  }
146
147
 
148
+ /* stylelint-disable property-no-vendor-prefix */
147
149
  @keyframes material-spinner-rotate {
148
150
  0% {
149
151
  transform: rotate(0);
@@ -161,6 +163,7 @@
161
163
  }
162
164
  }
163
165
  /*! Toolbar's bootstrap5 theme wise override definitions and variables */
166
+ /* stylelint-disable */
164
167
  .e-treegrid .e-indent::before,
165
168
  .e-grid-menu .e-indent::before {
166
169
  content: "\e810";
@@ -481,4 +484,6 @@
481
484
  }
482
485
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
483
486
  height: 0;
484
- }
487
+ }
488
+
489
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-ddl.e-popup {
2
3
  border: 0;
3
4
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.26);
@@ -79,6 +80,7 @@
79
80
  height: 34px;
80
81
  }
81
82
 
83
+ /* stylelint-disable property-no-vendor-prefix */
82
84
  @keyframes material-spinner-rotate {
83
85
  0% {
84
86
  transform: rotate(0);
@@ -421,4 +423,6 @@
421
423
  }
422
424
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
423
425
  height: 0;
424
- }
426
+ }
427
+
428
+ /* stylelint-disable-line no-empty-source */
package/styles/fabric.css CHANGED
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-ddl.e-popup {
2
3
  border: 0;
3
4
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.4);
@@ -72,6 +73,7 @@
72
73
  height: 34px;
73
74
  }
74
75
 
76
+ /* stylelint-disable property-no-vendor-prefix */
75
77
  @keyframes material-spinner-rotate {
76
78
  0% {
77
79
  transform: rotate(0);
@@ -414,4 +416,6 @@
414
416
  }
415
417
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
416
418
  height: 0;
417
- }
419
+ }
420
+
421
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-popup.e-ddl {
2
3
  border-radius: 4px;
3
4
  box-shadow: none;
@@ -124,6 +125,7 @@
124
125
  min-height: 34px;
125
126
  }
126
127
 
128
+ /* stylelint-disable property-no-vendor-prefix */
127
129
  @keyframes material-spinner-rotate {
128
130
  0% {
129
131
  transform: rotate(0);
@@ -479,4 +481,6 @@
479
481
  }
480
482
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
481
483
  height: 0;
482
- }
484
+ }
485
+
486
+ /* stylelint-disable-line no-empty-source */
package/styles/fluent.css CHANGED
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-popup.e-ddl {
2
3
  border-radius: 4px;
3
4
  box-shadow: none;
@@ -124,6 +125,7 @@
124
125
  min-height: 34px;
125
126
  }
126
127
 
128
+ /* stylelint-disable property-no-vendor-prefix */
127
129
  @keyframes material-spinner-rotate {
128
130
  0% {
129
131
  transform: rotate(0);
@@ -479,4 +481,6 @@
479
481
  }
480
482
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
481
483
  height: 0;
482
- }
484
+ }
485
+
486
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-bigger .e-ddl.e-popup .e-input-group .e-clear-icon {
2
3
  height: 36px;
3
4
  }
@@ -76,6 +77,7 @@
76
77
  height: 34px;
77
78
  }
78
79
 
80
+ /* stylelint-disable property-no-vendor-prefix */
79
81
  @keyframes material-spinner-rotate {
80
82
  0% {
81
83
  transform: rotate(0);
@@ -418,4 +420,6 @@
418
420
  }
419
421
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
420
422
  height: 0;
421
- }
423
+ }
424
+
425
+ /* stylelint-disable-line no-empty-source */
@@ -1,3 +1,4 @@
1
+ /* stylelint-disable property-no-vendor-prefix */
1
2
  .e-bigger .e-ddl.e-popup .e-input-group .e-clear-icon {
2
3
  height: 36px;
3
4
  }
@@ -76,6 +77,7 @@
76
77
  height: 34px;
77
78
  }
78
79
 
80
+ /* stylelint-disable property-no-vendor-prefix */
79
81
  @keyframes material-spinner-rotate {
80
82
  0% {
81
83
  transform: rotate(0);
@@ -418,4 +420,6 @@
418
420
  }
419
421
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
420
422
  height: 0;
421
- }
423
+ }
424
+
425
+ /* stylelint-disable-line no-empty-source */