@syncfusion/ej2-navigations 20.3.48 → 20.3.50

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.
@@ -2787,9 +2787,9 @@ let MenuBase = class MenuBase extends Component {
2787
2787
  ul.querySelector('.' + FOCUSED).focus();
2788
2788
  }
2789
2789
  else {
2790
+ const ele = this.getWrapper().children[this.getIdx(this.getWrapper(), ul) - 1];
2790
2791
  if (this.currentTarget) {
2791
- if (!(this.currentTarget.classList.contains("e-numerictextbox") || this.currentTarget.classList.contains("e-textbox"))) {
2792
- const ele = this.getWrapper().children[this.getIdx(this.getWrapper(), ul) - 1];
2792
+ if (!(this.currentTarget.classList.contains("e-numerictextbox") || this.currentTarget.classList.contains("e-textbox") || this.currentTarget.tagName === 'INPUT')) {
2793
2793
  if (ele) {
2794
2794
  ele.querySelector('.' + SELECTED).focus();
2795
2795
  }
@@ -2798,6 +2798,14 @@ let MenuBase = class MenuBase extends Component {
2798
2798
  }
2799
2799
  }
2800
2800
  }
2801
+ else {
2802
+ if (ele) {
2803
+ ele.querySelector('.' + SELECTED).focus();
2804
+ }
2805
+ else {
2806
+ this.element.focus();
2807
+ }
2808
+ }
2801
2809
  }
2802
2810
  }
2803
2811
  else {
@@ -3036,7 +3044,7 @@ let MenuBase = class MenuBase extends Component {
3036
3044
  menuitem = new MenuItem(iitems[0], 'items', items[i], true);
3037
3045
  iitems.splice(isAfter ? idx + 1 : idx, 0, menuitem);
3038
3046
  const uls = this.isMenu ? [this.getWrapper()].concat(this.getPopups()) : [].slice.call(this.getWrapper().children);
3039
- if (navIdx.length < uls.length) {
3047
+ if (!isNullOrUndefined(idx) && navIdx.length < uls.length) {
3040
3048
  idx = isAfter ? idx + 1 : idx;
3041
3049
  li = this.createItems(iitems).children[idx];
3042
3050
  const ul = this.isMenu ? select('.e-menu-parent', uls[navIdx.length]) : uls[navIdx.length];
@@ -5568,9 +5576,7 @@ let Accordion = class Accordion extends Component {
5568
5576
  }
5569
5577
  ele.classList.remove(CLS_ACRDN_ROOT);
5570
5578
  ele.removeAttribute('style');
5571
- ['aria-disabled', 'aria-multiselectable', 'role', 'data-ripple'].forEach((attrb) => {
5572
- this.element.removeAttribute(attrb);
5573
- });
5579
+ this.element.removeAttribute('data-ripple');
5574
5580
  if (!this.isNested && isRippleEnabled) {
5575
5581
  this.removeRippleEffect();
5576
5582
  }
@@ -5619,19 +5625,12 @@ let Accordion = class Accordion extends Component {
5619
5625
  const width = formatUnit(this.width);
5620
5626
  const height = formatUnit(this.height);
5621
5627
  setStyleAttribute(this.element, { 'width': width, 'height': height });
5622
- const ariaAttr = {
5623
- 'aria-disabled': 'false', 'role': 'presentation', 'aria-multiselectable': 'true'
5624
- };
5625
5628
  if (isNullOrUndefined(this.initExpand)) {
5626
5629
  this.initExpand = [];
5627
5630
  }
5628
5631
  if (this.expandedIndices.length > 0) {
5629
5632
  this.initExpand = this.expandedIndices;
5630
5633
  }
5631
- attributes(this.element, ariaAttr);
5632
- if (this.expandMode === 'Single') {
5633
- this.element.setAttribute('aria-multiselectable', 'false');
5634
- }
5635
5634
  }
5636
5635
  renderControl() {
5637
5636
  this.trgtEle = (this.element.children.length > 0) ? select('div', this.element) : null;
@@ -5938,18 +5937,15 @@ let Accordion = class Accordion extends Component {
5938
5937
  }
5939
5938
  headerEleGenerate() {
5940
5939
  const header = this.createElement('div', { className: CLS_HEADER, id: getUniqueID('acrdn_header') });
5941
- const items = this.getItems();
5942
5940
  const ariaAttr = {
5943
- 'tabindex': '0', 'role': 'heading', 'aria-label': 'collapsed',
5944
- 'aria-disabled': 'false', 'aria-level': items.length.toString()
5941
+ 'tabindex': '0', 'role': 'button', 'aria-disabled': 'false', 'aria-expanded': 'false'
5945
5942
  };
5946
5943
  attributes(header, ariaAttr);
5947
5944
  return header;
5948
5945
  }
5949
5946
  renderInnerItem(item, index) {
5950
5947
  const innerEle = this.createElement('div', {
5951
- className: CLS_ITEM$1, id: item.id || getUniqueID('acrdn_item'),
5952
- attrs: { 'aria-expanded': 'false', 'role': 'row' }
5948
+ className: CLS_ITEM$1, id: item.id || getUniqueID('acrdn_item')
5953
5949
  });
5954
5950
  if (this.headerTemplate) {
5955
5951
  const ctnEle = this.headerEleGenerate();
@@ -6097,7 +6093,7 @@ let Accordion = class Accordion extends Component {
6097
6093
  const content = select('.' + CLS_CONTENT, itemEle);
6098
6094
  header.setAttribute('aria-controls', content.id);
6099
6095
  content.setAttribute('aria-labelledby', header.id);
6100
- content.setAttribute('role', 'definition');
6096
+ content.setAttribute('role', 'region');
6101
6097
  }
6102
6098
  contentRendering(index) {
6103
6099
  const itemcnt = this.createElement('div', { className: CLS_CONTENT + ' ' + CLS_CTNHIDE, id: getUniqueID('acrdn_panel') });
@@ -6194,8 +6190,7 @@ let Accordion = class Accordion extends Component {
6194
6190
  if (progress === 'end') {
6195
6191
  this.add(trgtItemEle, CLS_ACTIVE);
6196
6192
  trgt.setAttribute('aria-hidden', 'false');
6197
- attributes(trgtItemEle, { 'aria-expanded': 'true' });
6198
- attributes(trgt.previousElementSibling, { 'aria-label': 'expanded' });
6193
+ attributes(trgt.previousElementSibling, { 'aria-expanded': 'true' });
6199
6194
  icon.classList.remove(CLS_TOGANIMATE);
6200
6195
  this.trigger('expanded', eventArgs);
6201
6196
  }
@@ -6309,8 +6304,7 @@ let Accordion = class Accordion extends Component {
6309
6304
  icon.classList.remove(CLS_TOGANIMATE);
6310
6305
  this.remove(trgtItemEle, CLS_ACTIVE);
6311
6306
  trgt.setAttribute('aria-hidden', 'true');
6312
- attributes(trgtItemEle, { 'aria-expanded': 'false' });
6313
- attributes(trgt.previousElementSibling, { 'aria-label': 'collapsed' });
6307
+ attributes(trgt.previousElementSibling, { 'aria-expanded': 'false' });
6314
6308
  this.trigger('expanded', eventArgs);
6315
6309
  }
6316
6310
  }
@@ -6323,14 +6317,6 @@ let Accordion = class Accordion extends Component {
6323
6317
  getModuleName() {
6324
6318
  return 'accordion';
6325
6319
  }
6326
- itemAttribUpdate() {
6327
- const items = this.getItems();
6328
- const itemEle = this.getItemElements();
6329
- const itemLen = items.length;
6330
- itemEle.forEach((ele) => {
6331
- select('.' + CLS_HEADER, ele).setAttribute('aria-level', '' + itemLen);
6332
- });
6333
- }
6334
6320
  getItems() {
6335
6321
  let items;
6336
6322
  if (this.itemTemplate && this.headerTemplate) {
@@ -6370,7 +6356,6 @@ let Accordion = class Accordion extends Component {
6370
6356
  }
6371
6357
  EventHandler.add(innerItemEle.querySelector('.' + CLS_HEADER), 'focus', this.focusIn, this);
6372
6358
  EventHandler.add(innerItemEle.querySelector('.' + CLS_HEADER), 'blur', this.focusOut, this);
6373
- this.itemAttribUpdate();
6374
6359
  this.expandedIndices = [];
6375
6360
  this.expandedItemRefresh(ele);
6376
6361
  if (addItem && addItem.expanded) {
@@ -6410,7 +6395,6 @@ let Accordion = class Accordion extends Component {
6410
6395
  this.restoreContent(index);
6411
6396
  detach(ele);
6412
6397
  items.splice(index, 1);
6413
- this.itemAttribUpdate();
6414
6398
  this.expandedIndices = [];
6415
6399
  this.expandedItemRefresh(this.element);
6416
6400
  }
@@ -6695,14 +6679,8 @@ let Accordion = class Accordion extends Component {
6695
6679
  setStyleAttribute(this.element, { 'width': formatUnit(newProp.width) });
6696
6680
  break;
6697
6681
  case 'expandMode':
6698
- if (newProp.expandMode === 'Single') {
6699
- this.element.setAttribute('aria-multiselectable', 'false');
6700
- if (this.expandedIndices.length > 1) {
6701
- this.expandItem(false);
6702
- }
6703
- }
6704
- else {
6705
- this.element.setAttribute('aria-multiselectable', 'true');
6682
+ if (newProp.expandMode === 'Single' && this.expandedIndices.length > 1) {
6683
+ this.expandItem(false);
6706
6684
  }
6707
6685
  break;
6708
6686
  }
@@ -14626,7 +14604,7 @@ let Sidebar = class Sidebar extends Component {
14626
14604
  if (!isNullOrUndefined(classELement || this.targetEle)) {
14627
14605
  addClass([classELement || this.targetEle], [MAINCONTENTANIMATION]);
14628
14606
  }
14629
- this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';
14607
+ this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : null;
14630
14608
  if (!this.enableDock && this.type !== 'Auto') {
14631
14609
  addClass([this.element], [VISIBILITY]);
14632
14610
  }
@@ -14636,7 +14614,9 @@ let Sidebar = class Sidebar extends Component {
14636
14614
  if (this.enableDock) {
14637
14615
  addClass([this.element], DOCKER);
14638
14616
  }
14639
- this.element.setAttribute('tabindex', this.tabIndex);
14617
+ if (!isNullOrUndefined(this.tabIndex)) {
14618
+ this.element.setAttribute('tabindex', this.tabIndex);
14619
+ }
14640
14620
  if (this.type === 'Auto' && !Browser.isDevice) {
14641
14621
  this.show();
14642
14622
  }