@syncfusion/ej2-navigations 21.1.39 → 21.2.3
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 +14 -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 +46 -46
- package/dist/es6/ej2-navigations.es2015.js.map +1 -1
- package/dist/es6/ej2-navigations.es5.js +46 -46
- 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 +12 -15
- package/src/common/h-scroll.js +1 -0
- package/src/common/menu-base.js +5 -13
- package/src/common/v-scroll.js +1 -1
- package/src/tab/tab.d.ts +1 -0
- package/src/tab/tab.js +34 -27
- package/src/treeview/treeview.js +5 -5
- package/styles/bootstrap-dark.css +35 -16
- package/styles/bootstrap.css +35 -16
- package/styles/bootstrap4.css +35 -16
- package/styles/bootstrap5-dark.css +35 -16
- package/styles/bootstrap5.css +35 -16
- package/styles/fabric-dark.css +35 -16
- package/styles/fabric.css +35 -16
- package/styles/fluent-dark.css +35 -16
- package/styles/fluent.css +35 -16
- package/styles/highcontrast-light.css +35 -16
- package/styles/highcontrast.css +37 -17
- package/styles/material-dark.css +35 -16
- package/styles/material.css +35 -16
- package/styles/tailwind-dark.css +35 -16
- package/styles/tailwind.css +35 -16
- package/styles/treeview/_theme.scss +20 -10
- package/styles/treeview/bootstrap-dark.css +35 -16
- package/styles/treeview/bootstrap.css +35 -16
- package/styles/treeview/bootstrap4.css +35 -16
- package/styles/treeview/bootstrap5-dark.css +35 -16
- package/styles/treeview/bootstrap5.css +35 -16
- package/styles/treeview/fabric-dark.css +35 -16
- package/styles/treeview/fabric.css +35 -16
- package/styles/treeview/fluent-dark.css +35 -16
- package/styles/treeview/fluent.css +35 -16
- package/styles/treeview/highcontrast-light.css +35 -16
- package/styles/treeview/highcontrast.css +37 -17
- package/styles/treeview/material-dark.css +35 -16
- package/styles/treeview/material.css +35 -16
- package/styles/treeview/tailwind-dark.css +35 -16
- package/styles/treeview/tailwind.css +35 -16
|
@@ -152,6 +152,7 @@ var HScroll = /** @__PURE__ @class */ (function (_super) {
|
|
|
152
152
|
ele.style.display = '';
|
|
153
153
|
ele.classList.remove(CLS_ROOT);
|
|
154
154
|
ele.classList.remove(CLS_DEVICE);
|
|
155
|
+
ele.classList.remove(CLS_RTL);
|
|
155
156
|
var nav = selectAll('.e-' + ele.id + '_nav.' + CLS_HSCROLLNAV, ele);
|
|
156
157
|
var overlay = selectAll('.' + CLS_OVERLAY, ele);
|
|
157
158
|
[].slice.call(overlay).forEach(function (ele) {
|
|
@@ -646,7 +647,7 @@ var VScroll = /** @__PURE__ @class */ (function (_super) {
|
|
|
646
647
|
VScroll.prototype.destroy = function () {
|
|
647
648
|
var el = this.element;
|
|
648
649
|
el.style.display = '';
|
|
649
|
-
removeClass([this.element], [CLS_ROOT$1, CLS_DEVICE$1]);
|
|
650
|
+
removeClass([this.element], [CLS_ROOT$1, CLS_DEVICE$1, CLS_RTL$1]);
|
|
650
651
|
var navs = selectAll('.e-' + el.id + '_nav.' + CLS_VSCROLLNAV, el);
|
|
651
652
|
var overlays = selectAll('.' + CLS_OVERLAY$1, el);
|
|
652
653
|
[].slice.call(overlays).forEach(function (ele) {
|
|
@@ -1666,7 +1667,9 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
|
|
|
1666
1667
|
_this.navIdx.pop();
|
|
1667
1668
|
if (!_this.isMenu) {
|
|
1668
1669
|
EventHandler.remove(ul_1, 'keydown', _this.keyHandler);
|
|
1669
|
-
_this.keyType
|
|
1670
|
+
if (_this.keyType === 'right') {
|
|
1671
|
+
_this.keyType = '';
|
|
1672
|
+
}
|
|
1670
1673
|
}
|
|
1671
1674
|
}
|
|
1672
1675
|
_this.updateReactTemplate();
|
|
@@ -3124,20 +3127,10 @@ var MenuBase = /** @__PURE__ @class */ (function (_super) {
|
|
|
3124
3127
|
ul = this.getUlByNavIdx(navIdx.length);
|
|
3125
3128
|
if (ul) {
|
|
3126
3129
|
if (ishide) {
|
|
3127
|
-
|
|
3128
|
-
ul.children[index + 1].classList.add(HIDE);
|
|
3129
|
-
}
|
|
3130
|
-
else {
|
|
3131
|
-
ul.children[index].classList.add(HIDE);
|
|
3132
|
-
}
|
|
3130
|
+
ul.children[index].classList.add(HIDE);
|
|
3133
3131
|
}
|
|
3134
3132
|
else {
|
|
3135
|
-
|
|
3136
|
-
ul.children[index + 1].classList.remove(HIDE);
|
|
3137
|
-
}
|
|
3138
|
-
else {
|
|
3139
|
-
ul.children[index].classList.remove(HIDE);
|
|
3140
|
-
}
|
|
3133
|
+
ul.children[index].classList.remove(HIDE);
|
|
3141
3134
|
}
|
|
3142
3135
|
}
|
|
3143
3136
|
}
|
|
@@ -8833,6 +8826,9 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
|
|
|
8833
8826
|
var icon = (isNullOrUndefined(this.items[index].header) ||
|
|
8834
8827
|
isNullOrUndefined(this.items[index].header.iconCss)) ? '' : this.items[index].header.iconCss;
|
|
8835
8828
|
var textVal = this.items[index].headerTemplate || this.items[index].header.text;
|
|
8829
|
+
if (properties[j] === 'headerTemplate') {
|
|
8830
|
+
this.clearTabTemplate(hdrItem, properties[j], CLS_TB_ITEM);
|
|
8831
|
+
}
|
|
8836
8832
|
if ((textVal === '') && (icon === '')) {
|
|
8837
8833
|
this.removeTab(index);
|
|
8838
8834
|
}
|
|
@@ -8864,7 +8860,8 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
|
|
|
8864
8860
|
document.body.appendChild(this.element.querySelector(oldVal)).style.display = 'none';
|
|
8865
8861
|
cntItem.innerHTML = newVal;
|
|
8866
8862
|
}
|
|
8867
|
-
else if (this.isReact) {
|
|
8863
|
+
else if (this.isAngular || this.isReact) {
|
|
8864
|
+
this.clearTabTemplate(cntItem, properties[j], CLS_ITEM$2);
|
|
8868
8865
|
cntItem.innerHTML = '';
|
|
8869
8866
|
this.templateCompile(cntItem, newVal, index);
|
|
8870
8867
|
}
|
|
@@ -8915,6 +8912,30 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
|
|
|
8915
8912
|
}
|
|
8916
8913
|
}
|
|
8917
8914
|
};
|
|
8915
|
+
Tab.prototype.clearTabTemplate = function (templateEle, templateName, className) {
|
|
8916
|
+
if (this.registeredTemplate && this.registeredTemplate[templateName]) {
|
|
8917
|
+
var registeredTemplates = this.registeredTemplate;
|
|
8918
|
+
for (var index = 0; index < registeredTemplates[templateName].length; index++) {
|
|
8919
|
+
var registeredItem = registeredTemplates[templateName][index].rootNodes[0];
|
|
8920
|
+
var closestItem = closest(registeredItem, '.' + className);
|
|
8921
|
+
if (!isNullOrUndefined(closestItem) && closestItem === templateEle) {
|
|
8922
|
+
this.clearTemplate([templateName], [registeredTemplates[templateName][index]]);
|
|
8923
|
+
break;
|
|
8924
|
+
}
|
|
8925
|
+
}
|
|
8926
|
+
}
|
|
8927
|
+
else if (this.portals && this.portals.length > 0) {
|
|
8928
|
+
var portals = this.portals;
|
|
8929
|
+
for (var index = 0; index < portals.length; index++) {
|
|
8930
|
+
var portalItem = portals[index];
|
|
8931
|
+
var closestItem = closest(portalItem.containerInfo, '.' + className);
|
|
8932
|
+
if (!isNullOrUndefined(closestItem) && closestItem === templateEle) {
|
|
8933
|
+
this.clearTemplate([templateName], index);
|
|
8934
|
+
break;
|
|
8935
|
+
}
|
|
8936
|
+
}
|
|
8937
|
+
}
|
|
8938
|
+
};
|
|
8918
8939
|
Tab.prototype.initializeDrag = function (target) {
|
|
8919
8940
|
var _this = this;
|
|
8920
8941
|
var dragObj = new Draggable(target, {
|
|
@@ -9264,6 +9285,10 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
|
|
|
9264
9285
|
var removeArgs = { removedItem: trg, removedIndex: index, cancel: false };
|
|
9265
9286
|
this.trigger('removing', removeArgs, function (tabRemovingArgs) {
|
|
9266
9287
|
if (!tabRemovingArgs.cancel) {
|
|
9288
|
+
var header = select('#' + CLS_ITEM$2 + _this.tabId + '_' + _this.extIndex(trg.id), select('.' + CLS_TB_ITEMS, _this.element));
|
|
9289
|
+
if (!isNullOrUndefined(header)) {
|
|
9290
|
+
_this.clearTabTemplate(header, 'headerTemplate', CLS_TB_ITEM);
|
|
9291
|
+
}
|
|
9267
9292
|
_this.tbObj.removeItems(index);
|
|
9268
9293
|
if (_this.allowDragAndDrop && (index !== Array.prototype.indexOf.call(_this.itemIndexArray, trg.id))) {
|
|
9269
9294
|
index = Array.prototype.indexOf.call(_this.itemIndexArray, trg.id);
|
|
@@ -9274,32 +9299,7 @@ var Tab = /** @__PURE__ @class */ (function (_super) {
|
|
|
9274
9299
|
_this.refreshActiveBorder();
|
|
9275
9300
|
var cntTrg = select('#' + CLS_CONTENT$1 + _this.tabId + '_' + _this.extIndex(trg.id), select('.' + CLS_CONTENT$1, _this.element));
|
|
9276
9301
|
if (!isNullOrUndefined(cntTrg)) {
|
|
9277
|
-
|
|
9278
|
-
var portal = _this.portals;
|
|
9279
|
-
if (registeredTemplate && registeredTemplate.content) {
|
|
9280
|
-
var templateToClear = [];
|
|
9281
|
-
for (var i = 0; i < registeredTemplate.content.length; i++) {
|
|
9282
|
-
var registeredItem = registeredTemplate.content[i].rootNodes[0];
|
|
9283
|
-
var closestItem = closest(registeredItem, '.' + CLS_ITEM$2);
|
|
9284
|
-
if (!isNullOrUndefined(registeredItem) && closestItem === cntTrg) {
|
|
9285
|
-
templateToClear.push(registeredTemplate.content[i]);
|
|
9286
|
-
break;
|
|
9287
|
-
}
|
|
9288
|
-
}
|
|
9289
|
-
if (templateToClear.length > 0) {
|
|
9290
|
-
_this.clearTemplate(['content'], templateToClear);
|
|
9291
|
-
}
|
|
9292
|
-
}
|
|
9293
|
-
/* else if (portal) {
|
|
9294
|
-
for (var i = 0; i < portal.length; i++) {
|
|
9295
|
-
var portalItem = portal[i];
|
|
9296
|
-
var closestItem = closest(portalItem.containerInfo, '.' + CLS_ITEM);
|
|
9297
|
-
if (!isNullOrUndefined(portalItem) && closestItem === cntTrg) {
|
|
9298
|
-
this.clearTemplate(['content'], i);
|
|
9299
|
-
break;
|
|
9300
|
-
}
|
|
9301
|
-
}
|
|
9302
|
-
} */
|
|
9302
|
+
_this.clearTabTemplate(cntTrg, 'content', CLS_ITEM$2);
|
|
9303
9303
|
detach(cntTrg);
|
|
9304
9304
|
}
|
|
9305
9305
|
_this.trigger('removed', tabRemovingArgs);
|
|
@@ -12463,10 +12463,10 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
|
|
|
12463
12463
|
return endNode;
|
|
12464
12464
|
};
|
|
12465
12465
|
TreeView.prototype.setFocus = function (preNode, nextNode) {
|
|
12466
|
-
removeClass([preNode],
|
|
12466
|
+
removeClass([preNode], FOCUS);
|
|
12467
12467
|
preNode.setAttribute("tabindex", "-1");
|
|
12468
12468
|
if (!nextNode.classList.contains('e-disable') && !nextNode.classList.contains(PREVENTSELECT)) {
|
|
12469
|
-
addClass([nextNode],
|
|
12469
|
+
addClass([nextNode], FOCUS);
|
|
12470
12470
|
nextNode.setAttribute('tabindex', '0');
|
|
12471
12471
|
nextNode.focus();
|
|
12472
12472
|
EventHandler.add(nextNode, 'blur', this.focusOut, this);
|
|
@@ -12485,7 +12485,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
|
|
|
12485
12485
|
if (!this.mouseDownStatus) {
|
|
12486
12486
|
var focusedElement = this.getFocusedNode();
|
|
12487
12487
|
focusedElement.setAttribute("tabindex", "0");
|
|
12488
|
-
addClass([focusedElement],
|
|
12488
|
+
addClass([focusedElement], FOCUS);
|
|
12489
12489
|
EventHandler.add(focusedElement, 'blur', this.focusOut, this);
|
|
12490
12490
|
}
|
|
12491
12491
|
this.mouseDownStatus = false;
|
|
@@ -12493,7 +12493,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
|
|
|
12493
12493
|
TreeView.prototype.focusOut = function (event) {
|
|
12494
12494
|
var focusedElement = this.getFocusedNode();
|
|
12495
12495
|
if (event.target == focusedElement) {
|
|
12496
|
-
removeClass([focusedElement],
|
|
12496
|
+
removeClass([focusedElement], FOCUS);
|
|
12497
12497
|
EventHandler.remove(focusedElement, 'blur', this.focusOut);
|
|
12498
12498
|
}
|
|
12499
12499
|
};
|
|
@@ -12705,7 +12705,7 @@ var TreeView = /** @__PURE__ @class */ (function (_super) {
|
|
|
12705
12705
|
removeClass([liEle], EDITING);
|
|
12706
12706
|
liEle.focus();
|
|
12707
12707
|
EventHandler.add(liEle, 'blur', this.focusOut, this);
|
|
12708
|
-
addClass([liEle],
|
|
12708
|
+
addClass([liEle], FOCUS);
|
|
12709
12709
|
}
|
|
12710
12710
|
if (this.allowTextWrap) {
|
|
12711
12711
|
this.calculateWrap(liEle);
|