@syncfusion/ej2-navigations 33.2.4 → 33.2.7

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 (124) hide show
  1. package/dist/ej2-navigations.min.js +2 -2
  2. package/dist/ej2-navigations.umd.min.js +2 -2
  3. package/dist/ej2-navigations.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-navigations.es2015.js +46 -7
  5. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  6. package/dist/es6/ej2-navigations.es5.js +46 -7
  7. package/dist/es6/ej2-navigations.es5.js.map +1 -1
  8. package/dist/global/ej2-navigations.min.js +2 -2
  9. package/dist/global/ej2-navigations.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +5 -5
  12. package/src/accordion/accordion.js +2 -3
  13. package/src/context-menu/context-menu.js +1 -1
  14. package/src/tab/tab.js +15 -2
  15. package/src/toolbar/toolbar.js +7 -0
  16. package/src/treeview/treeview.d.ts +1 -0
  17. package/src/treeview/treeview.js +21 -1
  18. package/styles/bds-lite.css +21 -2
  19. package/styles/bds.css +23 -4
  20. package/styles/bootstrap-dark-lite.css +21 -2
  21. package/styles/bootstrap-dark.css +21 -2
  22. package/styles/bootstrap-lite.css +25 -2
  23. package/styles/bootstrap.css +25 -2
  24. package/styles/bootstrap4-lite.css +21 -2
  25. package/styles/bootstrap4.css +21 -2
  26. package/styles/bootstrap5-dark-lite.css +21 -2
  27. package/styles/bootstrap5-dark.css +21 -2
  28. package/styles/bootstrap5-lite.css +21 -2
  29. package/styles/bootstrap5.3-lite.css +21 -2
  30. package/styles/bootstrap5.3.css +21 -2
  31. package/styles/bootstrap5.css +21 -2
  32. package/styles/fabric-dark-lite.css +22 -2
  33. package/styles/fabric-dark.css +22 -2
  34. package/styles/fabric-lite.css +22 -2
  35. package/styles/fabric.css +22 -2
  36. package/styles/fluent-dark-lite.css +21 -2
  37. package/styles/fluent-dark.css +21 -2
  38. package/styles/fluent-lite.css +21 -2
  39. package/styles/fluent.css +21 -2
  40. package/styles/fluent2-lite.css +30 -2
  41. package/styles/fluent2.css +30 -2
  42. package/styles/highcontrast-light-lite.css +21 -2
  43. package/styles/highcontrast-light.css +21 -2
  44. package/styles/highcontrast-lite.css +29 -2
  45. package/styles/highcontrast.css +29 -2
  46. package/styles/material-dark-lite.css +21 -2
  47. package/styles/material-dark.css +21 -2
  48. package/styles/material-lite.css +21 -2
  49. package/styles/material.css +21 -2
  50. package/styles/material3-dark-lite.css +21 -2
  51. package/styles/material3-dark.css +21 -2
  52. package/styles/material3-lite.css +21 -2
  53. package/styles/material3.css +21 -2
  54. package/styles/tailwind-dark-lite.css +22 -3
  55. package/styles/tailwind-dark.css +23 -4
  56. package/styles/tailwind-lite.css +22 -3
  57. package/styles/tailwind.css +23 -4
  58. package/styles/tailwind3-lite.css +21 -2
  59. package/styles/tailwind3.css +21 -2
  60. package/styles/toolbar/_theme.scss +11 -5
  61. package/styles/toolbar/bds.css +8 -2
  62. package/styles/toolbar/bootstrap-dark.css +8 -2
  63. package/styles/toolbar/bootstrap.css +8 -2
  64. package/styles/toolbar/bootstrap4.css +8 -2
  65. package/styles/toolbar/bootstrap5-dark.css +8 -2
  66. package/styles/toolbar/bootstrap5.3.css +8 -2
  67. package/styles/toolbar/bootstrap5.css +8 -2
  68. package/styles/toolbar/fabric-dark.css +8 -2
  69. package/styles/toolbar/fabric.css +8 -2
  70. package/styles/toolbar/fluent-dark.css +8 -2
  71. package/styles/toolbar/fluent.css +8 -2
  72. package/styles/toolbar/fluent2.css +8 -2
  73. package/styles/toolbar/highcontrast-light.css +8 -2
  74. package/styles/toolbar/highcontrast.css +8 -2
  75. package/styles/toolbar/material-dark.css +8 -2
  76. package/styles/toolbar/material.css +8 -2
  77. package/styles/toolbar/material3-dark.css +8 -2
  78. package/styles/toolbar/material3.css +8 -2
  79. package/styles/toolbar/tailwind-dark.css +8 -2
  80. package/styles/toolbar/tailwind.css +8 -2
  81. package/styles/toolbar/tailwind3.css +8 -2
  82. package/styles/treeview/_bds-definition.scss +3 -2
  83. package/styles/treeview/_bootstrap-dark-definition.scss +2 -1
  84. package/styles/treeview/_bootstrap-definition.scss +2 -1
  85. package/styles/treeview/_bootstrap4-definition.scss +1 -0
  86. package/styles/treeview/_bootstrap5-dark-definition.scss +1 -0
  87. package/styles/treeview/_bootstrap5-definition.scss +1 -0
  88. package/styles/treeview/_bootstrap5.3-definition.scss +1 -0
  89. package/styles/treeview/_fabric-dark-definition.scss +1 -0
  90. package/styles/treeview/_fabric-definition.scss +1 -0
  91. package/styles/treeview/_fluent-dark-definition.scss +1 -0
  92. package/styles/treeview/_fluent-definition.scss +1 -0
  93. package/styles/treeview/_fluent2-definition.scss +4 -0
  94. package/styles/treeview/_highcontrast-definition.scss +1 -0
  95. package/styles/treeview/_highcontrast-light-definition.scss +1 -0
  96. package/styles/treeview/_material-dark-definition.scss +1 -0
  97. package/styles/treeview/_material-definition.scss +1 -0
  98. package/styles/treeview/_material3-dark-definition.scss +1 -0
  99. package/styles/treeview/_material3-definition.scss +1 -0
  100. package/styles/treeview/_tailwind-dark-definition.scss +3 -2
  101. package/styles/treeview/_tailwind-definition.scss +3 -2
  102. package/styles/treeview/_tailwind3-definition.scss +1 -0
  103. package/styles/treeview/_theme.scss +55 -4
  104. package/styles/treeview/bds.css +15 -2
  105. package/styles/treeview/bootstrap-dark.css +13 -0
  106. package/styles/treeview/bootstrap.css +17 -0
  107. package/styles/treeview/bootstrap4.css +13 -0
  108. package/styles/treeview/bootstrap5-dark.css +13 -0
  109. package/styles/treeview/bootstrap5.3.css +13 -0
  110. package/styles/treeview/bootstrap5.css +13 -0
  111. package/styles/treeview/fabric-dark.css +14 -0
  112. package/styles/treeview/fabric.css +14 -0
  113. package/styles/treeview/fluent-dark.css +13 -0
  114. package/styles/treeview/fluent.css +13 -0
  115. package/styles/treeview/fluent2.css +22 -0
  116. package/styles/treeview/highcontrast-light.css +13 -0
  117. package/styles/treeview/highcontrast.css +21 -0
  118. package/styles/treeview/material-dark.css +13 -0
  119. package/styles/treeview/material.css +13 -0
  120. package/styles/treeview/material3-dark.css +13 -0
  121. package/styles/treeview/material3.css +13 -0
  122. package/styles/treeview/tailwind-dark.css +15 -2
  123. package/styles/treeview/tailwind.css +15 -2
  124. package/styles/treeview/tailwind3.css +13 -0
@@ -6094,6 +6094,13 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
6094
6094
  if (this.isReact && this.items[parseInt(index.toString(), 10)].template) {
6095
6095
  this.clearToolbarTemplate(itemCol[parseInt(index.toString(), 10)]);
6096
6096
  }
6097
+ if (this.element.closest('.e-richtexteditor')) {
6098
+ var btnItem = itemCol[parseInt(index.toString(), 10)].querySelector('.e-control.e-btn');
6099
+ if (!isNullOrUndefined(btnItem) && !isNullOrUndefined(btnItem.ej2_instances[0]) &&
6100
+ !(btnItem.ej2_instances[0].isDestroyed)) {
6101
+ btnItem.ej2_instances[0].destroy();
6102
+ }
6103
+ }
6097
6104
  EventHandler.remove(itemCol[parseInt(index.toString(), 10)], 'click', this.itemClick);
6098
6105
  detach(itemCol[parseInt(index.toString(), 10)]);
6099
6106
  this.tbarEle.splice(index, 1);
@@ -6829,9 +6836,8 @@ var Accordion = /** @__PURE__ @class */ (function (_super) {
6829
6836
  innerEle.appendChild(ctnEle);
6830
6837
  ctnEle.appendChild(this.toggleIconGenerate());
6831
6838
  this.add(innerEle, CLS_SLCT);
6832
- return innerEle;
6833
6839
  }
6834
- if (item.header && this.angularnativeCondiCheck(item, 'header')) {
6840
+ else if (item.header && this.angularnativeCondiCheck(item, 'header')) {
6835
6841
  var header = item.header;
6836
6842
  if (this.enableHtmlSanitizer && typeof (item.header) === 'string') {
6837
6843
  header = SanitizeHtmlHelper.sanitize(item.header);
@@ -6870,7 +6876,7 @@ var Accordion = /** @__PURE__ @class */ (function (_super) {
6870
6876
  hdr.insertBefore(hdrIcnEle, hdr.childNodes[0]);
6871
6877
  }
6872
6878
  }
6873
- if (item.content && this.angularnativeCondiCheck(item, 'content')) {
6879
+ if (item.content && this.angularnativeCondiCheck(item, 'content') && !this.headerTemplate) {
6874
6880
  var hdrIcon = this.toggleIconGenerate();
6875
6881
  if (isNullOrUndefined(hdr)) {
6876
6882
  hdr = this.headerEleGenerate();
@@ -7740,7 +7746,7 @@ var ContextMenu = /** @__PURE__ @class */ (function (_super) {
7740
7746
  this.template = this.itemTemplate ? this.itemTemplate : null;
7741
7747
  this.addTemplateClass();
7742
7748
  _super.prototype.initialize.call(this);
7743
- attributes(this.element, { 'role': 'menubar', 'tabindex': '0' });
7749
+ attributes(this.element, { 'role': 'menu', 'tabindex': '0' });
7744
7750
  this.element.style.zIndex = getZindexPartial(this.element).toString();
7745
7751
  };
7746
7752
  /**
@@ -8443,6 +8449,12 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
8443
8449
  _this.refreshActiveBorder();
8444
8450
  });
8445
8451
  }
8452
+ if (this.isAngular && this.registeredTemplate && !isNullOrUndefined(this.registeredTemplate.headerTemplate)) {
8453
+ setTimeout(function () {
8454
+ _this.refreshOverflow();
8455
+ _this.refreshActiveBorder();
8456
+ }, 5);
8457
+ }
8446
8458
  };
8447
8459
  Tab.prototype.renderContainer = function () {
8448
8460
  var ele = this.element;
@@ -9372,8 +9384,15 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
9372
9384
  tbPopObj.show(config);
9373
9385
  }
9374
9386
  };
9375
- Tab.prototype.bindDraggable = function () {
9387
+ Tab.prototype.bindDraggable = function (refreshDraggableItems) {
9376
9388
  var _this = this;
9389
+ if (refreshDraggableItems && this.draggableItems.length > 0) {
9390
+ for (var i = 0; i < this.draggableItems.length; i++) {
9391
+ this.draggableItems[i].destroy();
9392
+ this.draggableItems[i] = null;
9393
+ }
9394
+ this.draggableItems = [];
9395
+ }
9377
9396
  if (this.allowDragAndDrop) {
9378
9397
  var tabHeader = this.element.querySelector('.' + CLS_HEADER$1);
9379
9398
  if (tabHeader) {
@@ -10461,7 +10480,7 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
10461
10480
  }
10462
10481
  break;
10463
10482
  case 'allowDragAndDrop':
10464
- this.bindDraggable();
10483
+ this.bindDraggable(true);
10465
10484
  break;
10466
10485
  case 'swipeMode':
10467
10486
  if (this.touchModule) {
@@ -10778,6 +10797,7 @@ var CHECKBOXRIPPLE = 'e-ripple-container';
10778
10797
  var RIPPLE = 'e-ripple';
10779
10798
  var RIPPLEELMENT = 'e-ripple-element';
10780
10799
  var FOCUS = 'e-node-focus';
10800
+ var FOCUSED$1 = 'e-focused';
10781
10801
  var IMAGE = 'e-list-img';
10782
10802
  var BIGGER = 'e-bigger';
10783
10803
  var SMALL = 'e-small';
@@ -11833,6 +11853,9 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
11833
11853
  if (isNullOrUndefined(data) || isNullOrUndefined(parentId)) {
11834
11854
  return [];
11835
11855
  }
11856
+ if (!Array.isArray(data)) {
11857
+ return [];
11858
+ }
11836
11859
  if (this.dataType === 1) {
11837
11860
  var pidField_1 = this.fields.parentID;
11838
11861
  var target_1 = parentId.toString();
@@ -13130,6 +13153,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
13130
13153
  var focusedNode = this.getFocusedNode();
13131
13154
  if (focusedNode) {
13132
13155
  removeClass([focusedNode], FOCUS);
13156
+ removeClass([focusedNode], FOCUSED$1);
13133
13157
  focusedNode.setAttribute('tabindex', '-1');
13134
13158
  }
13135
13159
  addClass([li], FOCUS);
@@ -13829,9 +13853,11 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
13829
13853
  };
13830
13854
  TreeView.prototype.setFocus = function (preNode, nextNode) {
13831
13855
  removeClass([preNode], FOCUS);
13856
+ removeClass([preNode], FOCUSED$1);
13832
13857
  preNode.setAttribute('tabindex', '-1');
13833
13858
  if (!nextNode.classList.contains('e-disable')) {
13834
13859
  addClass([nextNode], FOCUS);
13860
+ addClass([nextNode], FOCUSED$1);
13835
13861
  nextNode.setAttribute('tabindex', '0');
13836
13862
  nextNode.focus();
13837
13863
  EventHandler.add(nextNode, 'blur', this.focusOut, this);
@@ -13856,6 +13882,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
13856
13882
  else {
13857
13883
  focusedElement.setAttribute('tabindex', '0');
13858
13884
  addClass([focusedElement], FOCUS);
13885
+ addClass([focusedElement], FOCUSED$1);
13859
13886
  EventHandler.add(focusedElement, 'blur', this.focusOut, this);
13860
13887
  }
13861
13888
  this.mouseDownStatus = false;
@@ -13865,6 +13892,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
13865
13892
  var focusedElement = this.getFocusedNode();
13866
13893
  if (event.target === focusedElement) {
13867
13894
  removeClass([focusedElement], FOCUS);
13895
+ removeClass([focusedElement], FOCUSED$1);
13868
13896
  EventHandler.remove(focusedElement, 'blur', this.focusOut);
13869
13897
  }
13870
13898
  };
@@ -14217,7 +14245,8 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
14217
14245
  var cNode = _this.createElement('span', { className: DROPCOUNT, innerHTML: '' + nLen });
14218
14246
  virtualEle.appendChild(cNode);
14219
14247
  }
14220
- document.body.appendChild(virtualEle);
14248
+ var appendToElement = _this.getAppendToElement();
14249
+ appendToElement.appendChild(virtualEle);
14221
14250
  document.body.style.cursor = '';
14222
14251
  _this.dragData = _this.getNodeData(_this.dragLi);
14223
14252
  return virtualEle;
@@ -14318,6 +14347,16 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
14318
14347
  removeClass([this.element], DRAGGING);
14319
14348
  this.dragStartAction = false;
14320
14349
  };
14350
+ TreeView.prototype.getAppendToElement = function () {
14351
+ if (this.isAngular) {
14352
+ var cdkPane = this.element.closest('.cdk-overlay-pane');
14353
+ var popoverEl = this.element.closest('[popover]');
14354
+ if (cdkPane && popoverEl) {
14355
+ return cdkPane;
14356
+ }
14357
+ }
14358
+ return document.body;
14359
+ };
14321
14360
  TreeView.prototype.getOffsetX = function (event, target) {
14322
14361
  var touchList = event.changedTouches;
14323
14362
  if (touchList && touchList.length > 0) {