@syncfusion/ej2-navigations 33.2.3 → 33.2.6

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 (125) hide show
  1. package/README.md +0 -1
  2. package/dist/ej2-navigations.min.js +2 -2
  3. package/dist/ej2-navigations.umd.min.js +2 -2
  4. package/dist/ej2-navigations.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-navigations.es2015.js +37 -12
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +36 -10
  8. package/dist/es6/ej2-navigations.es5.js.map +1 -1
  9. package/dist/global/ej2-navigations.min.js +2 -2
  10. package/dist/global/ej2-navigations.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +5 -5
  13. package/src/accordion/accordion.js +5 -5
  14. package/src/context-menu/context-menu.js +1 -1
  15. package/src/tab/tab.js +7 -1
  16. package/src/toolbar/toolbar.js +8 -2
  17. package/src/treeview/treeview.d.ts +1 -0
  18. package/src/treeview/treeview.js +15 -1
  19. package/styles/bds-lite.css +21 -2
  20. package/styles/bds.css +23 -4
  21. package/styles/bootstrap-dark-lite.css +21 -2
  22. package/styles/bootstrap-dark.css +21 -2
  23. package/styles/bootstrap-lite.css +25 -2
  24. package/styles/bootstrap.css +25 -2
  25. package/styles/bootstrap4-lite.css +21 -2
  26. package/styles/bootstrap4.css +21 -2
  27. package/styles/bootstrap5-dark-lite.css +21 -2
  28. package/styles/bootstrap5-dark.css +21 -2
  29. package/styles/bootstrap5-lite.css +21 -2
  30. package/styles/bootstrap5.3-lite.css +21 -2
  31. package/styles/bootstrap5.3.css +21 -2
  32. package/styles/bootstrap5.css +21 -2
  33. package/styles/fabric-dark-lite.css +22 -2
  34. package/styles/fabric-dark.css +22 -2
  35. package/styles/fabric-lite.css +22 -2
  36. package/styles/fabric.css +22 -2
  37. package/styles/fluent-dark-lite.css +21 -2
  38. package/styles/fluent-dark.css +21 -2
  39. package/styles/fluent-lite.css +21 -2
  40. package/styles/fluent.css +21 -2
  41. package/styles/fluent2-lite.css +30 -2
  42. package/styles/fluent2.css +30 -2
  43. package/styles/highcontrast-light-lite.css +21 -2
  44. package/styles/highcontrast-light.css +21 -2
  45. package/styles/highcontrast-lite.css +29 -2
  46. package/styles/highcontrast.css +29 -2
  47. package/styles/material-dark-lite.css +21 -2
  48. package/styles/material-dark.css +21 -2
  49. package/styles/material-lite.css +21 -2
  50. package/styles/material.css +21 -2
  51. package/styles/material3-dark-lite.css +21 -2
  52. package/styles/material3-dark.css +21 -2
  53. package/styles/material3-lite.css +21 -2
  54. package/styles/material3.css +21 -2
  55. package/styles/tailwind-dark-lite.css +22 -3
  56. package/styles/tailwind-dark.css +23 -4
  57. package/styles/tailwind-lite.css +22 -3
  58. package/styles/tailwind.css +23 -4
  59. package/styles/tailwind3-lite.css +21 -2
  60. package/styles/tailwind3.css +21 -2
  61. package/styles/toolbar/_theme.scss +11 -5
  62. package/styles/toolbar/bds.css +8 -2
  63. package/styles/toolbar/bootstrap-dark.css +8 -2
  64. package/styles/toolbar/bootstrap.css +8 -2
  65. package/styles/toolbar/bootstrap4.css +8 -2
  66. package/styles/toolbar/bootstrap5-dark.css +8 -2
  67. package/styles/toolbar/bootstrap5.3.css +8 -2
  68. package/styles/toolbar/bootstrap5.css +8 -2
  69. package/styles/toolbar/fabric-dark.css +8 -2
  70. package/styles/toolbar/fabric.css +8 -2
  71. package/styles/toolbar/fluent-dark.css +8 -2
  72. package/styles/toolbar/fluent.css +8 -2
  73. package/styles/toolbar/fluent2.css +8 -2
  74. package/styles/toolbar/highcontrast-light.css +8 -2
  75. package/styles/toolbar/highcontrast.css +8 -2
  76. package/styles/toolbar/material-dark.css +8 -2
  77. package/styles/toolbar/material.css +8 -2
  78. package/styles/toolbar/material3-dark.css +8 -2
  79. package/styles/toolbar/material3.css +8 -2
  80. package/styles/toolbar/tailwind-dark.css +8 -2
  81. package/styles/toolbar/tailwind.css +8 -2
  82. package/styles/toolbar/tailwind3.css +8 -2
  83. package/styles/treeview/_bds-definition.scss +3 -2
  84. package/styles/treeview/_bootstrap-dark-definition.scss +2 -1
  85. package/styles/treeview/_bootstrap-definition.scss +2 -1
  86. package/styles/treeview/_bootstrap4-definition.scss +1 -0
  87. package/styles/treeview/_bootstrap5-dark-definition.scss +1 -0
  88. package/styles/treeview/_bootstrap5-definition.scss +1 -0
  89. package/styles/treeview/_bootstrap5.3-definition.scss +1 -0
  90. package/styles/treeview/_fabric-dark-definition.scss +1 -0
  91. package/styles/treeview/_fabric-definition.scss +1 -0
  92. package/styles/treeview/_fluent-dark-definition.scss +1 -0
  93. package/styles/treeview/_fluent-definition.scss +1 -0
  94. package/styles/treeview/_fluent2-definition.scss +4 -0
  95. package/styles/treeview/_highcontrast-definition.scss +1 -0
  96. package/styles/treeview/_highcontrast-light-definition.scss +1 -0
  97. package/styles/treeview/_material-dark-definition.scss +1 -0
  98. package/styles/treeview/_material-definition.scss +1 -0
  99. package/styles/treeview/_material3-dark-definition.scss +1 -0
  100. package/styles/treeview/_material3-definition.scss +1 -0
  101. package/styles/treeview/_tailwind-dark-definition.scss +3 -2
  102. package/styles/treeview/_tailwind-definition.scss +3 -2
  103. package/styles/treeview/_tailwind3-definition.scss +1 -0
  104. package/styles/treeview/_theme.scss +55 -4
  105. package/styles/treeview/bds.css +15 -2
  106. package/styles/treeview/bootstrap-dark.css +13 -0
  107. package/styles/treeview/bootstrap.css +17 -0
  108. package/styles/treeview/bootstrap4.css +13 -0
  109. package/styles/treeview/bootstrap5-dark.css +13 -0
  110. package/styles/treeview/bootstrap5.3.css +13 -0
  111. package/styles/treeview/bootstrap5.css +13 -0
  112. package/styles/treeview/fabric-dark.css +14 -0
  113. package/styles/treeview/fabric.css +14 -0
  114. package/styles/treeview/fluent-dark.css +13 -0
  115. package/styles/treeview/fluent.css +13 -0
  116. package/styles/treeview/fluent2.css +22 -0
  117. package/styles/treeview/highcontrast-light.css +13 -0
  118. package/styles/treeview/highcontrast.css +21 -0
  119. package/styles/treeview/material-dark.css +13 -0
  120. package/styles/treeview/material.css +13 -0
  121. package/styles/treeview/material3-dark.css +13 -0
  122. package/styles/treeview/material3.css +13 -0
  123. package/styles/treeview/tailwind-dark.css +15 -2
  124. package/styles/treeview/tailwind.css +15 -2
  125. package/styles/treeview/tailwind3.css +13 -0
@@ -4093,8 +4093,12 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
4093
4093
  }
4094
4094
  };
4095
4095
  Toolbar.prototype.destroyItems = function () {
4096
+ var _this = this;
4096
4097
  if (this.element) {
4097
- [].slice.call(this.element.querySelectorAll('.' + CLS_ITEM)).forEach(function (el) { detach(el); });
4098
+ [].slice.call(this.element.querySelectorAll('.' + CLS_ITEM)).forEach(function (el) {
4099
+ EventHandler.remove(el, 'click', _this.itemClick);
4100
+ detach(el);
4101
+ });
4098
4102
  }
4099
4103
  if (this.tbarAlign) {
4100
4104
  var tbarItems = this.element.querySelector('.' + CLS_ITEMS);
@@ -5702,6 +5706,7 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
5702
5706
  if (!isNullOrUndefined(btnItem) && !isNullOrUndefined(btnItem.ej2_instances[0]) && !(btnItem.ej2_instances[0].isDestroyed)) {
5703
5707
  btnItem.ej2_instances[0].destroy();
5704
5708
  }
5709
+ EventHandler.remove(innerItems[parseInt(index.toString(), 10)], 'click', this.itemClick);
5705
5710
  detach(innerItems[parseInt(index.toString(), 10)]);
5706
5711
  this.items.splice(eleIdx, 1);
5707
5712
  this.tbarEle.splice(eleIdx, 1);
@@ -5845,7 +5850,7 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
5845
5850
  dom.setAttribute('aria-label', (item.text || item.tooltipText));
5846
5851
  dom.setAttribute('aria-disabled', 'false');
5847
5852
  innerEle.appendChild(dom);
5848
- innerEle.addEventListener('click', this.itemClick.bind(this));
5853
+ EventHandler.add(innerEle, 'click', this.itemClick, this);
5849
5854
  break;
5850
5855
  case 'Separator':
5851
5856
  this.add(innerEle, CLS_SEPARATOR);
@@ -6089,6 +6094,7 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
6089
6094
  if (this.isReact && this.items[parseInt(index.toString(), 10)].template) {
6090
6095
  this.clearToolbarTemplate(itemCol[parseInt(index.toString(), 10)]);
6091
6096
  }
6097
+ EventHandler.remove(itemCol[parseInt(index.toString(), 10)], 'click', this.itemClick);
6092
6098
  detach(itemCol[parseInt(index.toString(), 10)]);
6093
6099
  this.tbarEle.splice(index, 1);
6094
6100
  this.addItems([this.items[parseInt(index.toString(), 10)]], index);
@@ -6815,6 +6821,11 @@ var Accordion = /** @__PURE__ @class */ (function (_super) {
6815
6821
  var innerEle = this.createElement('div', {
6816
6822
  className: CLS_ITEM$1, id: item.id || getUniqueID('acrdn_item')
6817
6823
  });
6824
+ if (item.expanded && !isNullOrUndefined(index) && (!this.enablePersistence)) {
6825
+ if (this.initExpand.indexOf(index) === -1) {
6826
+ this.initExpand.push(index);
6827
+ }
6828
+ }
6818
6829
  if (this.headerTemplate) {
6819
6830
  var ctnEle = this.headerEleGenerate();
6820
6831
  var hdrEle = this.createElement('div', { className: CLS_HEADERCTN });
@@ -6837,11 +6848,6 @@ var Accordion = /** @__PURE__ @class */ (function (_super) {
6837
6848
  innerEle.appendChild(ctnEle);
6838
6849
  }
6839
6850
  var hdr = select('.' + CLS_HEADER, innerEle);
6840
- if (item.expanded && !isNullOrUndefined(index) && (!this.enablePersistence)) {
6841
- if (this.initExpand.indexOf(index) === -1) {
6842
- this.initExpand.push(index);
6843
- }
6844
- }
6845
6851
  if (item.cssClass) {
6846
6852
  addClass([innerEle], item.cssClass.split(' '));
6847
6853
  }
@@ -7734,7 +7740,7 @@ var ContextMenu = /** @__PURE__ @class */ (function (_super) {
7734
7740
  this.template = this.itemTemplate ? this.itemTemplate : null;
7735
7741
  this.addTemplateClass();
7736
7742
  _super.prototype.initialize.call(this);
7737
- attributes(this.element, { 'role': 'menubar', 'tabindex': '0' });
7743
+ attributes(this.element, { 'role': 'menu', 'tabindex': '0' });
7738
7744
  this.element.style.zIndex = getZindexPartial(this.element).toString();
7739
7745
  };
7740
7746
  /**
@@ -9146,9 +9152,15 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
9146
9152
  addClass([this.element], [CLS_FILL]);
9147
9153
  var parent_1 = this.element.parentElement;
9148
9154
  var heightVal = parent_1.style.height || parent_1.getAttribute('height');
9155
+ while (parent_1 && !heightVal) {
9156
+ heightVal = parent_1.style.height || parent_1.getAttribute('height');
9157
+ if (!heightVal) {
9158
+ parent_1 = parent_1.parentElement;
9159
+ }
9160
+ }
9149
9161
  setStyleAttribute(this.element, { 'height': heightVal != null ? heightVal : '100%' });
9150
9162
  this.loadContentElement();
9151
- this.cntEle.style.height = heightVal != null ? "calc(" + heightVal + " - " + this.hdrEle.offsetHeight + "px)" : 'calc(100vh - ' + this.hdrEle.offsetHeight + 'px)';
9163
+ this.cntEle.style.height = heightVal != null ? "calc(" + heightVal + " - " + this.hdrEle.offsetHeight + "px)" : 'calc(100vh - ' + (this.hdrEle.offsetHeight + this.hdrEle.scrollHeight) + 'px)';
9152
9164
  }
9153
9165
  else if (this.heightAdjustMode === 'Auto') {
9154
9166
  if (this.isTemplate === true) {
@@ -11821,6 +11833,9 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
11821
11833
  if (isNullOrUndefined(data) || isNullOrUndefined(parentId)) {
11822
11834
  return [];
11823
11835
  }
11836
+ if (!Array.isArray(data)) {
11837
+ return [];
11838
+ }
11824
11839
  if (this.dataType === 1) {
11825
11840
  var pidField_1 = this.fields.parentID;
11826
11841
  var target_1 = parentId.toString();
@@ -14205,7 +14220,8 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
14205
14220
  var cNode = _this.createElement('span', { className: DROPCOUNT, innerHTML: '' + nLen });
14206
14221
  virtualEle.appendChild(cNode);
14207
14222
  }
14208
- document.body.appendChild(virtualEle);
14223
+ var appendToElement = _this.getAppendToElement();
14224
+ appendToElement.appendChild(virtualEle);
14209
14225
  document.body.style.cursor = '';
14210
14226
  _this.dragData = _this.getNodeData(_this.dragLi);
14211
14227
  return virtualEle;
@@ -14306,6 +14322,16 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
14306
14322
  removeClass([this.element], DRAGGING);
14307
14323
  this.dragStartAction = false;
14308
14324
  };
14325
+ TreeView.prototype.getAppendToElement = function () {
14326
+ if (this.isAngular) {
14327
+ var cdkPane = this.element.closest('.cdk-overlay-pane');
14328
+ var popoverEl = this.element.closest('[popover]');
14329
+ if (cdkPane && popoverEl) {
14330
+ return cdkPane;
14331
+ }
14332
+ }
14333
+ return document.body;
14334
+ };
14309
14335
  TreeView.prototype.getOffsetX = function (event, target) {
14310
14336
  var touchList = event.changedTouches;
14311
14337
  if (touchList && touchList.length > 0) {