@syncfusion/ej2-navigations 22.1.38 → 22.2.5

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 (61) hide show
  1. package/CHANGELOG.md +29 -0
  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 +45 -11
  6. package/dist/es6/ej2-navigations.es2015.js.map +1 -1
  7. package/dist/es6/ej2-navigations.es5.js +45 -11
  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 +11 -11
  13. package/src/accordion/accordion-model.d.ts +6 -0
  14. package/src/accordion/accordion.d.ts +6 -0
  15. package/src/carousel/carousel-model.d.ts +18 -0
  16. package/src/carousel/carousel.d.ts +19 -0
  17. package/src/carousel/carousel.js +14 -0
  18. package/src/common/menu-base.js +12 -6
  19. package/src/tab/tab-model.d.ts +7 -0
  20. package/src/tab/tab.d.ts +7 -0
  21. package/src/tab/tab.js +2 -2
  22. package/src/toolbar/toolbar-model.d.ts +3 -0
  23. package/src/toolbar/toolbar.d.ts +3 -0
  24. package/src/treeview/treeview-model.d.ts +1 -1
  25. package/src/treeview/treeview.d.ts +1 -4
  26. package/src/treeview/treeview.js +18 -4
  27. package/styles/bootstrap-dark.css +3 -1
  28. package/styles/bootstrap.css +3 -1
  29. package/styles/bootstrap4.css +3 -1
  30. package/styles/bootstrap5-dark.css +3 -1
  31. package/styles/bootstrap5.css +3 -1
  32. package/styles/fabric-dark.css +3 -1
  33. package/styles/fabric.css +3 -1
  34. package/styles/fluent-dark.css +3 -1
  35. package/styles/fluent.css +3 -1
  36. package/styles/highcontrast-light.css +3 -1
  37. package/styles/highcontrast.css +3 -1
  38. package/styles/material-dark.css +3 -1
  39. package/styles/material.css +3 -1
  40. package/styles/material3-dark.css +3 -1
  41. package/styles/material3.css +3 -1
  42. package/styles/pager/_layout.scss +3 -1
  43. package/styles/pager/bootstrap-dark.css +3 -1
  44. package/styles/pager/bootstrap.css +3 -1
  45. package/styles/pager/bootstrap4.css +3 -1
  46. package/styles/pager/bootstrap5-dark.css +3 -1
  47. package/styles/pager/bootstrap5.css +3 -1
  48. package/styles/pager/fabric-dark.css +3 -1
  49. package/styles/pager/fabric.css +3 -1
  50. package/styles/pager/fluent-dark.css +3 -1
  51. package/styles/pager/fluent.css +3 -1
  52. package/styles/pager/highcontrast-light.css +3 -1
  53. package/styles/pager/highcontrast.css +3 -1
  54. package/styles/pager/material-dark.css +3 -1
  55. package/styles/pager/material.css +3 -1
  56. package/styles/pager/material3-dark.css +3 -1
  57. package/styles/pager/material3.css +3 -1
  58. package/styles/pager/tailwind-dark.css +3 -1
  59. package/styles/pager/tailwind.css +3 -1
  60. package/styles/tailwind-dark.css +3 -1
  61. package/styles/tailwind.css +3 -1
@@ -1284,9 +1284,9 @@ let MenuBase = class MenuBase extends Component {
1284
1284
  }
1285
1285
  this.targetElement = target;
1286
1286
  if (!this.isMenu) {
1287
- EventHandler.add(this.targetElement, 'mousewheel DOMMouseScroll', this.scrollHandler, this);
1287
+ EventHandler.add(this.targetElement, 'scroll', this.scrollHandler, this);
1288
1288
  for (const parent of getScrollableParent(this.targetElement)) {
1289
- EventHandler.add(parent, 'mousewheel DOMMouseScroll', this.scrollHandler, this);
1289
+ EventHandler.add(parent, 'scroll', this.scrollHandler, this);
1290
1290
  }
1291
1291
  }
1292
1292
  }
@@ -1462,7 +1462,7 @@ let MenuBase = class MenuBase extends Component {
1462
1462
  const popups = [];
1463
1463
  const allPopup = selectAll('.' + POPUP);
1464
1464
  allPopup.forEach((elem) => {
1465
- if (this.element.id === elem.id.split('-')[2]) {
1465
+ if (this.element.id === elem.id.split('-')[2] || elem.id.split('-')[2] + "-" + elem.id.split('-')[3]) {
1466
1466
  popups.push(elem);
1467
1467
  }
1468
1468
  });
@@ -2172,7 +2172,13 @@ let MenuBase = class MenuBase extends Component {
2172
2172
  if (isNullOrUndefined(args.curData.htmlAttributes)) {
2173
2173
  args.curData.htmlAttributes = {};
2174
2174
  }
2175
- Object.assign(args.curData.htmlAttributes, { role: 'menuitem', tabindex: '-1' });
2175
+ if (Browser.isIE) {
2176
+ args.curData.htmlAttributes.role = 'menuitem';
2177
+ args.curData.htmlAttributes.tabindex = '-1';
2178
+ }
2179
+ else {
2180
+ Object.assign(args.curData.htmlAttributes, { role: 'menuitem', tabindex: '-1' });
2181
+ }
2176
2182
  if (this.isMenu && !args.curData[this.getField('separator', level)]) {
2177
2183
  args.curData.htmlAttributes['aria-label'] = args.curData[args.fields.text] ?
2178
2184
  args.curData[args.fields.text] : args.curData[args.fields.id];
@@ -2774,9 +2780,9 @@ let MenuBase = class MenuBase extends Component {
2774
2780
  }
2775
2781
  }
2776
2782
  if (!this.isMenu) {
2777
- EventHandler.remove(this.targetElement, 'mousewheel DOMMouseScroll', this.scrollHandler);
2783
+ EventHandler.remove(this.targetElement, 'scroll', this.scrollHandler);
2778
2784
  for (const parent of getScrollableParent(this.targetElement)) {
2779
- EventHandler.remove(parent, 'mousewheel DOMMouseScroll', this.scrollHandler);
2785
+ EventHandler.remove(parent, 'scroll', this.scrollHandler);
2780
2786
  }
2781
2787
  }
2782
2788
  }
@@ -7698,7 +7704,7 @@ let Tab = class Tab extends Component {
7698
7704
  }
7699
7705
  }
7700
7706
  parseObject(items, index) {
7701
- const tbItems = selectAll('.e-tab-header .' + CLS_TB_ITEM, this.element);
7707
+ const tbItems = Array.prototype.slice.call(selectAll('.e-tab-header .' + CLS_TB_ITEM, this.element));
7702
7708
  let maxId = this.lastIndex;
7703
7709
  if (!this.isReplace && tbItems.length > 0) {
7704
7710
  const idList = [];
@@ -8422,7 +8428,7 @@ let Tab = class Tab extends Component {
8422
8428
  if (this.allowDragAndDrop) {
8423
8429
  const tabHeader = this.element.querySelector('.' + CLS_HEADER$1);
8424
8430
  if (tabHeader) {
8425
- const items = tabHeader.querySelectorAll('.' + CLS_TB_ITEM);
8431
+ const items = Array.prototype.slice.call(tabHeader.querySelectorAll('.' + CLS_TB_ITEM));
8426
8432
  items.forEach((element) => {
8427
8433
  this.initializeDrag(element);
8428
8434
  });
@@ -11489,14 +11495,14 @@ let TreeView = TreeView_1 = class TreeView extends Component {
11489
11495
  }
11490
11496
  else {
11491
11497
  if (typeof this.fields.child === 'string') {
11492
- let index = obj.findIndex((data) => data[this.fields.id] && data[this.fields.id].toString() === parentId);
11498
+ let index = obj.findIndex((data) => getValue(this.fields.id, data) && getValue(this.fields.id, data).toString() === parentId);
11493
11499
  if (index !== -1) {
11494
11500
  return getValue(this.fields.child, obj[index]);
11495
11501
  }
11496
11502
  if (index === -1) {
11497
11503
  for (let i = 0, objlen = obj.length; i < objlen; i++) {
11498
11504
  let tempArray = getValue(this.fields.child, obj[i]);
11499
- let childIndex = !isNullOrUndefined(tempArray) ? tempArray.findIndex((data) => data[this.fields.id] && data[this.fields.id].toString() === parentId) : -1;
11505
+ let childIndex = !isNullOrUndefined(tempArray) ? tempArray.findIndex((data) => getValue(this.fields.id, data) && getValue(this.fields.id, data).toString() === parentId) : -1;
11500
11506
  if (childIndex !== -1) {
11501
11507
  return getValue(this.fields.child, tempArray[childIndex]);
11502
11508
  }
@@ -12454,7 +12460,7 @@ let TreeView = TreeView_1 = class TreeView extends Component {
12454
12460
  this.renderReactTemplates();
12455
12461
  }
12456
12462
  else {
12457
- this.enableHtmlSanitizer ? txtEle.innerText = newText : txtEle.innerHTML = newText;
12463
+ this.enableHtmlSanitizer ? txtEle.innerText = SanitizeHtmlHelper.sanitize(newText) : txtEle.innerHTML = newText;
12458
12464
  }
12459
12465
  if (isInput) {
12460
12466
  removeClass([liEle], EDITING);
@@ -14253,6 +14259,20 @@ let TreeView = TreeView_1 = class TreeView extends Component {
14253
14259
  if (this.ulElement && this.ulElement.parentElement) {
14254
14260
  this.ulElement.parentElement.removeChild(this.ulElement);
14255
14261
  }
14262
+ this.ulElement = null;
14263
+ this.liList = null;
14264
+ this.startNode = null;
14265
+ this.firstTap = null;
14266
+ this.expandArgs = null;
14267
+ this.dragLi = null;
14268
+ this.dragTarget = null;
14269
+ this.dragParent = null;
14270
+ this.dragObj = null;
14271
+ this.dropObj = null;
14272
+ this.inputObj = null;
14273
+ this.touchEditObj = null;
14274
+ this.touchExpandObj = null;
14275
+ this.touchClickObj = null;
14256
14276
  super.destroy();
14257
14277
  }
14258
14278
  /**
@@ -16481,7 +16501,13 @@ let Carousel = class Carousel extends Component {
16481
16501
  break;
16482
16502
  case 'items':
16483
16503
  case 'dataSource':
16504
+ const selectedData = prop === 'dataSource' ? this.dataSource : this.items;
16505
+ if (selectedData.length > 0 && this.selectedIndex >= selectedData.length) {
16506
+ this.setActiveSlide(selectedData.length - 1, 'Previous');
16507
+ this.autoSlide();
16508
+ }
16484
16509
  this.reRenderSlides();
16510
+ this.reRenderIndicators();
16485
16511
  break;
16486
16512
  case 'partialVisible':
16487
16513
  if (this.partialVisible) {
@@ -16510,6 +16536,14 @@ let Carousel = class Carousel extends Component {
16510
16536
  }
16511
16537
  this.renderSlides();
16512
16538
  }
16539
+ reRenderIndicators() {
16540
+ const target = this.element.querySelector(`.${CLS_INDICATORS}`);
16541
+ if (target) {
16542
+ this.resetTemplates(['indicatorsTemplate']);
16543
+ remove(target);
16544
+ }
16545
+ this.renderIndicators();
16546
+ }
16513
16547
  initialize() {
16514
16548
  const carouselClasses = [];
16515
16549
  if (this.cssClass) {