@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.
- package/CHANGELOG.md +30 -0
- package/dist/ej2-navigations.min.js +2 -2
- package/dist/ej2-navigations.umd.min.js +2 -2
- package/dist/ej2-navigations.umd.min.js.map +1 -1
- package/dist/es6/ej2-navigations.es2015.js +23 -43
- package/dist/es6/ej2-navigations.es2015.js.map +1 -1
- package/dist/es6/ej2-navigations.es5.js +23 -44
- package/dist/es6/ej2-navigations.es5.js.map +1 -1
- package/dist/global/ej2-navigations.min.js +2 -2
- package/dist/global/ej2-navigations.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +11 -11
- package/src/accordion/accordion.d.ts +0 -1
- package/src/accordion/accordion.js +8 -39
- package/src/common/menu-base.js +11 -3
- package/src/sidebar/sidebar.js +4 -2
|
@@ -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
|
-
|
|
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': '
|
|
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', '
|
|
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(
|
|
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(
|
|
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.
|
|
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') :
|
|
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
|
-
|
|
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
|
}
|