@syncfusion/ej2-navigations 22.2.5 → 22.2.8

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 (53) hide show
  1. package/CHANGELOG.md +16 -6
  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 +60 -27
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +60 -27
  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 +9 -9
  13. package/src/common/menu-base.js +3 -0
  14. package/src/tab/tab-model.d.ts +6 -0
  15. package/src/tab/tab.d.ts +5 -0
  16. package/src/tab/tab.js +9 -1
  17. package/src/toolbar/toolbar.d.ts +1 -0
  18. package/src/toolbar/toolbar.js +48 -26
  19. package/styles/accordion/_theme.scss +5 -1
  20. package/styles/accordion/bootstrap-dark.css +3 -0
  21. package/styles/accordion/bootstrap.css +3 -0
  22. package/styles/accordion/bootstrap4.css +3 -0
  23. package/styles/accordion/bootstrap5-dark.css +3 -0
  24. package/styles/accordion/bootstrap5.css +3 -0
  25. package/styles/accordion/fabric-dark.css +3 -0
  26. package/styles/accordion/fabric.css +3 -0
  27. package/styles/accordion/fluent-dark.css +3 -0
  28. package/styles/accordion/fluent.css +3 -0
  29. package/styles/accordion/highcontrast-light.css +3 -0
  30. package/styles/accordion/highcontrast.css +3 -0
  31. package/styles/accordion/material-dark.css +3 -0
  32. package/styles/accordion/material.css +3 -0
  33. package/styles/accordion/material3-dark.css +3 -0
  34. package/styles/accordion/material3.css +3 -0
  35. package/styles/accordion/tailwind-dark.css +3 -0
  36. package/styles/accordion/tailwind.css +3 -0
  37. package/styles/bootstrap-dark.css +3 -0
  38. package/styles/bootstrap.css +3 -0
  39. package/styles/bootstrap4.css +3 -0
  40. package/styles/bootstrap5-dark.css +3 -0
  41. package/styles/bootstrap5.css +3 -0
  42. package/styles/fabric-dark.css +3 -0
  43. package/styles/fabric.css +3 -0
  44. package/styles/fluent-dark.css +3 -0
  45. package/styles/fluent.css +3 -0
  46. package/styles/highcontrast-light.css +3 -0
  47. package/styles/highcontrast.css +3 -0
  48. package/styles/material-dark.css +3 -0
  49. package/styles/material.css +3 -0
  50. package/styles/material3-dark.css +3 -0
  51. package/styles/material3.css +3 -0
  52. package/styles/tailwind-dark.css +3 -0
  53. package/styles/tailwind.css +3 -0
@@ -2548,6 +2548,9 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
2548
2548
  }
2549
2549
  };
2550
2550
  MenuBase.prototype.afterCloseMenu = function (e) {
2551
+ if (isNullOrUndefined(e)) {
2552
+ return;
2553
+ }
2551
2554
  var isHeader;
2552
2555
  if (this.showSubMenu) {
2553
2556
  if (this.showItemOnClick && this.navIdx.length === 0) {
@@ -5188,7 +5191,7 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
5188
5191
  this.tbarAlgEle[(this.items[parseInt(eleIdx.toString(), 10)].align + 's').toLowerCase()].splice(parseInt(indexAgn.toString(), 10), 1);
5189
5192
  }
5190
5193
  if (this.isReact) {
5191
- this.clearTemplate();
5194
+ this.clearToolbarTemplate(innerItems[parseInt(index.toString(), 10)]);
5192
5195
  }
5193
5196
  var btnItem = innerItems[parseInt(index.toString(), 10)].querySelector('.e-control.e-btn');
5194
5197
  if (!isNullOrUndefined(btnItem) && !isNullOrUndefined(btnItem.ej2_instances[0]) && !(btnItem.ej2_instances[0].isDestroyed)) {
@@ -5501,6 +5504,30 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
5501
5504
  nextEle = innerItems[++eleIndex];
5502
5505
  }
5503
5506
  };
5507
+ Toolbar.prototype.clearToolbarTemplate = function (templateEle) {
5508
+ if (this.registeredTemplate && this.registeredTemplate["" + 'template']) {
5509
+ var registeredTemplates = this.registeredTemplate;
5510
+ for (var index = 0; index < registeredTemplates["" + 'template'].length; index++) {
5511
+ var registeredItem = registeredTemplates["" + 'template'][parseInt(index.toString(), 10)].rootNodes[0];
5512
+ var closestItem = closest(registeredItem, '.' + CLS_ITEM);
5513
+ if (!isNullOrUndefined(closestItem) && closestItem === templateEle) {
5514
+ this.clearTemplate(['template'], [registeredTemplates["" + 'template'][parseInt(index.toString(), 10)]]);
5515
+ break;
5516
+ }
5517
+ }
5518
+ }
5519
+ else if (this.portals && this.portals.length > 0) {
5520
+ var portals = this.portals;
5521
+ for (var index = 0; index < portals.length; index++) {
5522
+ var portalItem = portals[parseInt(index.toString(), 10)];
5523
+ var closestItem = closest(portalItem.containerInfo, '.' + CLS_ITEM);
5524
+ if (!isNullOrUndefined(closestItem) && closestItem === templateEle) {
5525
+ this.clearTemplate(['template'], index);
5526
+ break;
5527
+ }
5528
+ }
5529
+ }
5530
+ };
5504
5531
  /**
5505
5532
  * Gets called when the model property changes.The data that describes the old and new values of the property that changed.
5506
5533
  *
@@ -5523,31 +5550,29 @@ var Toolbar = /** @__PURE__ @class */ (function (_super) {
5523
5550
  var index = parseInt(Object.keys(newProp.items)[parseInt(i.toString(), 10)], 10);
5524
5551
  var property = Object.keys(newProp.items[parseInt(index.toString(), 10)])[0];
5525
5552
  var newProperty = Object(newProp.items[parseInt(index.toString(), 10)])["" + property];
5526
- if (typeof newProperty !== 'function') {
5527
- if (this.tbarAlign || property === 'align') {
5528
- this.refresh();
5529
- this.trigger('created');
5530
- break;
5531
- }
5532
- var popupPriCheck = property === 'showAlwaysInPopup' && !newProperty;
5533
- var booleanCheck = property === 'overflow' && this.popupPriCount !== 0;
5534
- if ((popupPriCheck) || (this.items[parseInt(index.toString(), 10)].showAlwaysInPopup) && booleanCheck) {
5535
- --this.popupPriCount;
5536
- }
5537
- if (isNullOrUndefined(this.scrollModule)) {
5538
- this.destroyMode();
5539
- }
5540
- var itemCol = [].slice.call(selectAll('.' + CLS_ITEMS + ' .' + CLS_ITEM, tEle));
5541
- if (this.isReact && this.items[parseInt(index.toString(), 10)].template) {
5542
- this.clearTemplate();
5543
- }
5544
- detach(itemCol[parseInt(index.toString(), 10)]);
5545
- this.tbarEle.splice(index, 1);
5546
- this.addItems([this.items[parseInt(index.toString(), 10)]], index);
5547
- this.items.splice(index, 1);
5548
- if (this.items[parseInt(index.toString(), 10)].template) {
5549
- this.tbarEle.splice(this.items.length, 1);
5550
- }
5553
+ if (this.tbarAlign || property === 'align') {
5554
+ this.refresh();
5555
+ this.trigger('created');
5556
+ break;
5557
+ }
5558
+ var popupPriCheck = property === 'showAlwaysInPopup' && !newProperty;
5559
+ var booleanCheck = property === 'overflow' && this.popupPriCount !== 0;
5560
+ if ((popupPriCheck) || (this.items[parseInt(index.toString(), 10)].showAlwaysInPopup) && booleanCheck) {
5561
+ --this.popupPriCount;
5562
+ }
5563
+ if (isNullOrUndefined(this.scrollModule)) {
5564
+ this.destroyMode();
5565
+ }
5566
+ var itemCol = [].slice.call(selectAll('.' + CLS_ITEMS + ' .' + CLS_ITEM, tEle));
5567
+ if (this.isReact && this.items[parseInt(index.toString(), 10)].template) {
5568
+ this.clearToolbarTemplate(itemCol[parseInt(index.toString(), 10)]);
5569
+ }
5570
+ detach(itemCol[parseInt(index.toString(), 10)]);
5571
+ this.tbarEle.splice(index, 1);
5572
+ this.addItems([this.items[parseInt(index.toString(), 10)]], index);
5573
+ this.items.splice(index, 1);
5574
+ if (this.items[parseInt(index.toString(), 10)].template) {
5575
+ this.tbarEle.splice(this.items.length, 1);
5551
5576
  }
5552
5577
  }
5553
5578
  }
@@ -9007,6 +9032,9 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
9007
9032
  }
9008
9033
  };
9009
9034
  Tab.prototype.clearTabTemplate = function (templateEle, templateName, className) {
9035
+ if (!this.clearTemplates) {
9036
+ return;
9037
+ }
9010
9038
  if (this.registeredTemplate && this.registeredTemplate[templateName]) {
9011
9039
  var registeredTemplates = this.registeredTemplate;
9012
9040
  for (var index = 0; index < registeredTemplates[templateName].length; index++) {
@@ -9486,7 +9514,9 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
9486
9514
  }
9487
9515
  }
9488
9516
  this.setActiveBorder();
9489
- item.setAttribute('aria-hidden', '' + value);
9517
+ if (!isNullOrUndefined(item.firstElementChild)) {
9518
+ item.firstElementChild.setAttribute('aria-hidden', '' + value);
9519
+ }
9490
9520
  if (this.overflowMode === 'Popup' && this.tbObj) {
9491
9521
  this.tbObj.refreshOverflow();
9492
9522
  }
@@ -9907,6 +9937,9 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
9907
9937
  __decorate$7([
9908
9938
  Property(false)
9909
9939
  ], Tab.prototype, "allowDragAndDrop", void 0);
9940
+ __decorate$7([
9941
+ Property(true)
9942
+ ], Tab.prototype, "clearTemplates", void 0);
9910
9943
  __decorate$7([
9911
9944
  Complex({}, TabAnimationSettings)
9912
9945
  ], Tab.prototype, "animation", void 0);