@syncfusion/ej2-navigations 30.1.37 → 30.1.41

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 (132) 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 +31 -7
  5. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  6. package/dist/es6/ej2-navigations.es5.js +30 -6
  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 +6 -6
  12. package/src/breadcrumb/breadcrumb.js +1 -1
  13. package/src/common/menu-base.js +7 -0
  14. package/src/context-menu/context-menu-model.d.ts +1 -1
  15. package/src/context-menu/context-menu.d.ts +1 -0
  16. package/src/context-menu/context-menu.js +11 -1
  17. package/src/tab/tab.js +4 -1
  18. package/src/toolbar/toolbar.js +8 -4
  19. package/styles/bds-lite.css +14 -2
  20. package/styles/bds.css +14 -2
  21. package/styles/bootstrap-dark-lite.css +16 -4
  22. package/styles/bootstrap-dark.css +16 -4
  23. package/styles/bootstrap-lite.css +16 -4
  24. package/styles/bootstrap.css +16 -4
  25. package/styles/bootstrap4-lite.css +17 -5
  26. package/styles/bootstrap4.css +17 -5
  27. package/styles/bootstrap5-dark-lite.css +16 -4
  28. package/styles/bootstrap5-dark.css +16 -4
  29. package/styles/bootstrap5-lite.css +17 -5
  30. package/styles/bootstrap5.3-lite.css +17 -5
  31. package/styles/bootstrap5.3.css +17 -5
  32. package/styles/bootstrap5.css +17 -5
  33. package/styles/context-menu/_layout.scss +5 -0
  34. package/styles/context-menu/bds.css +6 -0
  35. package/styles/context-menu/bootstrap-dark.css +6 -0
  36. package/styles/context-menu/bootstrap.css +6 -0
  37. package/styles/context-menu/bootstrap4.css +6 -0
  38. package/styles/context-menu/bootstrap5-dark.css +6 -0
  39. package/styles/context-menu/bootstrap5.3.css +6 -0
  40. package/styles/context-menu/bootstrap5.css +6 -0
  41. package/styles/context-menu/fabric-dark.css +6 -0
  42. package/styles/context-menu/fabric.css +6 -0
  43. package/styles/context-menu/fluent-dark.css +6 -0
  44. package/styles/context-menu/fluent.css +6 -0
  45. package/styles/context-menu/fluent2.css +6 -0
  46. package/styles/context-menu/highcontrast-light.css +6 -0
  47. package/styles/context-menu/highcontrast.css +6 -0
  48. package/styles/context-menu/material-dark.css +6 -0
  49. package/styles/context-menu/material.css +6 -0
  50. package/styles/context-menu/material3-dark.css +6 -0
  51. package/styles/context-menu/material3.css +6 -0
  52. package/styles/context-menu/tailwind-dark.css +6 -0
  53. package/styles/context-menu/tailwind.css +6 -0
  54. package/styles/context-menu/tailwind3.css +6 -0
  55. package/styles/fabric-dark-lite.css +14 -2
  56. package/styles/fabric-dark.css +14 -2
  57. package/styles/fabric-lite.css +15 -3
  58. package/styles/fabric.css +15 -3
  59. package/styles/fluent-dark-lite.css +21 -9
  60. package/styles/fluent-dark.css +21 -9
  61. package/styles/fluent-lite.css +21 -9
  62. package/styles/fluent.css +21 -9
  63. package/styles/fluent2-lite.css +14 -2
  64. package/styles/fluent2.css +14 -2
  65. package/styles/highcontrast-light-lite.css +14 -2
  66. package/styles/highcontrast-light.css +14 -2
  67. package/styles/highcontrast-lite.css +15 -3
  68. package/styles/highcontrast.css +15 -3
  69. package/styles/material-dark-lite.css +14 -2
  70. package/styles/material-dark.css +14 -2
  71. package/styles/material-lite.css +15 -3
  72. package/styles/material.css +15 -3
  73. package/styles/material3-dark-lite.css +14 -2
  74. package/styles/material3-dark.css +15 -3
  75. package/styles/material3-lite.css +14 -2
  76. package/styles/material3.css +15 -3
  77. package/styles/tab/_bootstrap-dark-definition.scss +3 -3
  78. package/styles/tab/_bootstrap-definition.scss +3 -3
  79. package/styles/tab/_bootstrap4-definition.scss +3 -3
  80. package/styles/tab/_bootstrap5-definition.scss +3 -3
  81. package/styles/tab/_bootstrap5.3-definition.scss +3 -3
  82. package/styles/tab/_fabric-definition.scss +1 -1
  83. package/styles/tab/_fluent-definition.scss +4 -4
  84. package/styles/tab/_highcontrast-definition.scss +1 -1
  85. package/styles/tab/_material-definition.scss +1 -1
  86. package/styles/tab/_tailwind-definition.scss +3 -3
  87. package/styles/tab/_tailwind3-definition.scss +3 -3
  88. package/styles/tab/bootstrap-dark.css +2 -2
  89. package/styles/tab/bootstrap.css +2 -2
  90. package/styles/tab/bootstrap4.css +3 -3
  91. package/styles/tab/bootstrap5-dark.css +2 -2
  92. package/styles/tab/bootstrap5.3.css +3 -3
  93. package/styles/tab/bootstrap5.css +3 -3
  94. package/styles/tab/fabric.css +1 -1
  95. package/styles/tab/fluent-dark.css +7 -7
  96. package/styles/tab/fluent.css +7 -7
  97. package/styles/tab/highcontrast.css +1 -1
  98. package/styles/tab/material.css +1 -1
  99. package/styles/tab/tailwind-dark.css +4 -4
  100. package/styles/tab/tailwind.css +4 -4
  101. package/styles/tab/tailwind3.css +3 -3
  102. package/styles/tailwind-dark-lite.css +18 -6
  103. package/styles/tailwind-dark.css +18 -6
  104. package/styles/tailwind-lite.css +18 -6
  105. package/styles/tailwind.css +18 -6
  106. package/styles/tailwind3-lite.css +17 -5
  107. package/styles/tailwind3.css +17 -5
  108. package/styles/toolbar/_layout.scss +13 -1
  109. package/styles/toolbar/bds.css +8 -2
  110. package/styles/toolbar/bootstrap-dark.css +8 -2
  111. package/styles/toolbar/bootstrap.css +8 -2
  112. package/styles/toolbar/bootstrap4.css +8 -2
  113. package/styles/toolbar/bootstrap5-dark.css +8 -2
  114. package/styles/toolbar/bootstrap5.3.css +8 -2
  115. package/styles/toolbar/bootstrap5.css +8 -2
  116. package/styles/toolbar/fabric-dark.css +8 -2
  117. package/styles/toolbar/fabric.css +8 -2
  118. package/styles/toolbar/fluent-dark.css +8 -2
  119. package/styles/toolbar/fluent.css +8 -2
  120. package/styles/toolbar/fluent2.css +8 -2
  121. package/styles/toolbar/highcontrast-light.css +8 -2
  122. package/styles/toolbar/highcontrast.css +8 -2
  123. package/styles/toolbar/material-dark.css +8 -2
  124. package/styles/toolbar/material.css +8 -2
  125. package/styles/toolbar/material3-dark.css +8 -2
  126. package/styles/toolbar/material3.css +8 -2
  127. package/styles/toolbar/tailwind-dark.css +8 -2
  128. package/styles/toolbar/tailwind.css +8 -2
  129. package/styles/toolbar/tailwind3.css +8 -2
  130. package/styles/treeview/_material3-definition.scss +1 -1
  131. package/styles/treeview/material3-dark.css +1 -1
  132. package/styles/treeview/material3.css +1 -1
@@ -3016,6 +3016,13 @@ let MenuBase = class MenuBase extends Component {
3016
3016
  }
3017
3017
  }
3018
3018
  toggleAnimation(ul, isMenuOpen = true) {
3019
+ const menuWrapper = this.getWrapper();
3020
+ if (menuWrapper) {
3021
+ const activeMenuElements = menuWrapper.querySelectorAll('.e-menu-parent');
3022
+ activeMenuElements.forEach((menuElement) => {
3023
+ Animation.stop(menuElement);
3024
+ });
3025
+ }
3019
3026
  let pUlHeight;
3020
3027
  let pElement;
3021
3028
  const animateElement = (this.enableScrolling && !this.isMenu && closest(ul, '.e-menu-vscroll'))
@@ -3826,11 +3833,15 @@ let Toolbar = class Toolbar extends Component {
3826
3833
  }
3827
3834
  if (this.tbarAlign) {
3828
3835
  const tbarItems = this.element.querySelector('.' + CLS_ITEMS);
3829
- [].slice.call(tbarItems.children).forEach((el) => {
3830
- detach(el);
3831
- });
3836
+ if (tbarItems) {
3837
+ if (tbarItems.children) {
3838
+ [].slice.call(tbarItems.children).forEach((el) => {
3839
+ detach(el);
3840
+ });
3841
+ }
3842
+ this.remove(tbarItems, CLS_TBARPOS);
3843
+ }
3832
3844
  this.tbarAlign = false;
3833
- this.remove(tbarItems, CLS_TBARPOS);
3834
3845
  }
3835
3846
  this.clearProperty();
3836
3847
  }
@@ -7321,6 +7332,7 @@ var __decorate$5 = (undefined && undefined.__decorate) || function (decorators,
7321
7332
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
7322
7333
  return c > 3 && r && Object.defineProperty(target, key, r), r;
7323
7334
  };
7335
+ const CONTEXTMENUTEMPLATE = 'e-contextmenu-template';
7324
7336
  /**
7325
7337
  * The ContextMenu is a graphical user interface that appears on the user right click/touch hold operation.
7326
7338
  * ```html
@@ -7357,6 +7369,7 @@ let ContextMenu = class ContextMenu extends MenuBase {
7357
7369
  }
7358
7370
  initialize() {
7359
7371
  this.template = this.itemTemplate ? this.itemTemplate : null;
7372
+ this.addTemplateClass();
7360
7373
  super.initialize();
7361
7374
  attributes(this.element, { 'role': 'menubar', 'tabindex': '0' });
7362
7375
  this.element.style.zIndex = getZindexPartial(this.element).toString();
@@ -7382,6 +7395,12 @@ let ContextMenu = class ContextMenu extends MenuBase {
7382
7395
  close() {
7383
7396
  super.closeMenu();
7384
7397
  }
7398
+ addTemplateClass() {
7399
+ if (!isNullOrUndefined(this.itemTemplate) && typeof this.itemTemplate === 'function' ||
7400
+ (typeof this.itemTemplate === 'string' && this.itemTemplate !== '')) {
7401
+ addClass([this.element], CONTEXTMENUTEMPLATE);
7402
+ }
7403
+ }
7385
7404
  /**
7386
7405
  * Called internally if any of the property value changed.
7387
7406
  *
@@ -7404,6 +7423,8 @@ let ContextMenu = class ContextMenu extends MenuBase {
7404
7423
  break;
7405
7424
  case 'itemTemplate':
7406
7425
  this.itemTemplate = newProp.itemTemplate;
7426
+ removeClass([this.element], CONTEXTMENUTEMPLATE);
7427
+ this.addTemplateClass();
7407
7428
  this.refresh();
7408
7429
  }
7409
7430
  }
@@ -8296,8 +8317,11 @@ let Tab = class Tab extends Component {
8296
8317
  this.tbItems.appendChild(target);
8297
8318
  this.actEleId = target.id;
8298
8319
  if (this.checkPopupOverflow(lastChild)) {
8299
- const prevEle = this.tbItems.lastChild.previousElementSibling;
8300
- this.checkPopupOverflow(prevEle);
8320
+ let prevEle = this.tbItems.lastChild.previousElementSibling;
8321
+ prevEle = (prevEle && prevEle.classList.contains(CLS_INDICATOR) ? prevEle.previousElementSibling : prevEle);
8322
+ if (prevEle) {
8323
+ this.checkPopupOverflow(prevEle);
8324
+ }
8301
8325
  }
8302
8326
  this.isPopup = true;
8303
8327
  }
@@ -17298,10 +17322,10 @@ let Breadcrumb = class Breadcrumb extends Component {
17298
17322
  onPropertyChanged(newProp, oldProp) {
17299
17323
  for (const prop of Object.keys(newProp)) {
17300
17324
  switch (prop) {
17301
- case 'items':
17302
17325
  case 'enableActiveItemNavigation':
17303
17326
  this.reRenderItems();
17304
17327
  break;
17328
+ case 'items':
17305
17329
  case 'activeItem':
17306
17330
  this._maxItems = this.maxItems;
17307
17331
  this.initPvtProps();