@syncfusion/ej2-navigations 28.2.6 → 28.2.11

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 (45) hide show
  1. package/README.md +1 -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 +38 -5
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +38 -5
  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 +10 -10
  13. package/src/common/menu-base.js +38 -5
  14. package/styles/bootstrap4-lite.css +4 -4
  15. package/styles/bootstrap4.css +4 -4
  16. package/styles/bootstrap5-dark-lite.css +10 -10
  17. package/styles/bootstrap5-dark.css +10 -10
  18. package/styles/bootstrap5-lite.css +10 -10
  19. package/styles/bootstrap5.3-lite.css +12 -12
  20. package/styles/bootstrap5.3.css +12 -12
  21. package/styles/bootstrap5.css +10 -10
  22. package/styles/fluent2-lite.css +7 -26
  23. package/styles/fluent2.css +7 -26
  24. package/styles/material3-dark-lite.css +10 -10
  25. package/styles/material3-dark.css +10 -10
  26. package/styles/material3-lite.css +10 -10
  27. package/styles/material3.css +10 -10
  28. package/styles/tab/_bootstrap4-definition.scss +2 -2
  29. package/styles/tab/_bootstrap5-definition.scss +3 -3
  30. package/styles/tab/_bootstrap5.3-definition.scss +3 -3
  31. package/styles/tab/_material3-definition.scss +3 -3
  32. package/styles/tab/_tailwind3-definition.scss +3 -3
  33. package/styles/tab/bootstrap4.css +4 -4
  34. package/styles/tab/bootstrap5-dark.css +10 -10
  35. package/styles/tab/bootstrap5.3.css +10 -10
  36. package/styles/tab/bootstrap5.css +10 -10
  37. package/styles/tab/material3-dark.css +10 -10
  38. package/styles/tab/material3.css +10 -10
  39. package/styles/tab/tailwind3.css +10 -10
  40. package/styles/tailwind3-lite.css +17 -36
  41. package/styles/tailwind3.css +17 -36
  42. package/styles/toolbar/_theme.scss +25 -64
  43. package/styles/toolbar/bootstrap5.3.css +2 -2
  44. package/styles/toolbar/fluent2.css +7 -26
  45. package/styles/toolbar/tailwind3.css +7 -26
@@ -1918,6 +1918,8 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
1918
1918
  this.popupWrapper = this.createElement('div', {
1919
1919
  className: 'e-' + this.getModuleName() + '-wrapper ' + POPUP, id: li.id + '-ej2menu-' + elemId + '-popup'
1920
1920
  });
1921
+ this.popupWrapper.setAttribute('role', 'navigation');
1922
+ this.popupWrapper.setAttribute('aria-label', item.text + '-menu-popup');
1921
1923
  if (this.hamburgerMode) {
1922
1924
  top = li.offsetHeight;
1923
1925
  li.appendChild(this.popupWrapper);
@@ -2396,6 +2398,9 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
2396
2398
  if (!args.curData.htmlAttributes.role) {
2397
2399
  args.item.setAttribute('role', 'separator');
2398
2400
  }
2401
+ if (!args.curData.htmlAttributes.ariaLabel) {
2402
+ args.item.setAttribute('aria-label', 'separator');
2403
+ }
2399
2404
  }
2400
2405
  if (showIcon && !args.curData[args.fields.iconCss]
2401
2406
  && !args.curData[_this.getField('separator', level)]) {
@@ -2990,7 +2995,13 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
2990
2995
  item.splice(idx, 1);
2991
2996
  var uls = this.getWrapper().children;
2992
2997
  if (navIdx.length < uls.length) {
2993
- detach(uls[navIdx.length].children[idx]);
2998
+ if (this.enableScrolling && !uls[navIdx.length].classList.contains('e-menu-parent')) {
2999
+ var ul = uls[navIdx.length].querySelector('.e-menu-parent');
3000
+ detach(ul.children[idx]);
3001
+ }
3002
+ else {
3003
+ detach(uls[navIdx.length].children[idx]);
3004
+ }
2994
3005
  }
2995
3006
  };
2996
3007
  /**
@@ -3295,7 +3306,13 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
3295
3306
  ul.children[idx + 1].classList.add(disabled);
3296
3307
  }
3297
3308
  else {
3298
- ul.children[idx].classList.add(disabled);
3309
+ if (this.enableScrolling && !ul.classList.contains('e-menu-parent')) {
3310
+ var mainUl = ul.querySelector('.e-menu-parent');
3311
+ mainUl.children[idx].classList.add(disabled);
3312
+ }
3313
+ else {
3314
+ ul.children[idx].classList.add(disabled);
3315
+ }
3299
3316
  }
3300
3317
  }
3301
3318
  }
@@ -3333,6 +3350,9 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
3333
3350
  ul = this.getUlByNavIdx(navIdx.length);
3334
3351
  item = this.getItems(navIdx);
3335
3352
  if (ul) {
3353
+ if (this.enableScrolling && !ul.classList.contains('e-menu-parent')) {
3354
+ ul = ul.querySelector('.e-menu-parent');
3355
+ }
3336
3356
  var validUl = isUniqueId ? ul.children[index].id : item[index].text.toString();
3337
3357
  if (ishide && validUl === items[i]) {
3338
3358
  ul.children[index].classList.add(HIDE);
@@ -3392,6 +3412,7 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
3392
3412
  var navIdx;
3393
3413
  var iitems;
3394
3414
  var menuitem;
3415
+ var parentUl;
3395
3416
  for (var i = 0; i < items.length; i++) {
3396
3417
  navIdx = this.getIndex(text, isUniqueId);
3397
3418
  idx = navIdx.pop();
@@ -3404,11 +3425,23 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
3404
3425
  if (!isNullOrUndefined(idx) && navIdx.length < uls.length) {
3405
3426
  idx = isAfter ? idx + 1 : idx;
3406
3427
  li = this.createItems(iitems).children[idx];
3407
- var ul = this.isMenu ? select('.e-menu-parent', uls[navIdx.length]) : uls[navIdx.length];
3428
+ var ul = parentUl = this.isMenu ? select('.e-menu-parent', uls[navIdx.length]) : uls[navIdx.length];
3429
+ if (this.enableScrolling && !ul.classList.contains('e-menu-parent')) {
3430
+ ul = ul.querySelector('.e-menu-parent');
3431
+ }
3408
3432
  ul.insertBefore(li, ul.children[idx]);
3409
3433
  if (i === items.length - 1 && !this.isMenu && ul.style.display === 'block') {
3410
- this.setPosition(null, ul, parseFloat(ul.style.top), parseFloat(ul.style.left));
3411
- ul.style.display = 'block';
3434
+ if (this.enableScrolling) {
3435
+ this.setPosition(null, ul, parseFloat(parentUl.style.top), parseFloat(parentUl.style.left));
3436
+ var scrollElem = closest(ul, '.e-vscroll');
3437
+ if (scrollElem) {
3438
+ scrollElem.style.display = 'block';
3439
+ }
3440
+ }
3441
+ else {
3442
+ this.setPosition(null, ul, parseFloat(ul.style.top), parseFloat(ul.style.left));
3443
+ ul.style.display = 'block';
3444
+ }
3412
3445
  }
3413
3446
  }
3414
3447
  }