@syncfusion/ej2-filemanager 33.2.10 → 33.2.13
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/dist/ej2-filemanager.min.js +2 -2
- package/dist/ej2-filemanager.umd.min.js +2 -2
- package/dist/ej2-filemanager.umd.min.js.map +1 -1
- package/dist/es6/ej2-filemanager.es2015.js +286 -7
- package/dist/es6/ej2-filemanager.es2015.js.map +1 -1
- package/dist/es6/ej2-filemanager.es5.js +286 -7
- package/dist/es6/ej2-filemanager.es5.js.map +1 -1
- package/dist/global/ej2-filemanager.min.js +2 -2
- package/dist/global/ej2-filemanager.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +4 -4
- package/src/file-manager/layout/details-view.d.ts +10 -0
- package/src/file-manager/layout/details-view.js +286 -7
- package/styles/bds-lite.css +0 -4
- package/styles/bds.css +0 -4
- package/styles/bootstrap-dark-lite.css +0 -4
- package/styles/bootstrap-dark.css +0 -4
- package/styles/bootstrap-lite.css +0 -4
- package/styles/bootstrap.css +0 -4
- package/styles/bootstrap4-lite.css +0 -4
- package/styles/bootstrap4.css +0 -4
- package/styles/bootstrap5-dark-lite.css +0 -4
- package/styles/bootstrap5-dark.css +0 -4
- package/styles/bootstrap5-lite.css +0 -4
- package/styles/bootstrap5.3-lite.css +0 -4
- package/styles/bootstrap5.3.css +0 -4
- package/styles/bootstrap5.css +0 -4
- package/styles/fabric-dark-lite.css +0 -4
- package/styles/fabric-dark.css +0 -4
- package/styles/fabric-lite.css +0 -4
- package/styles/fabric.css +0 -4
- package/styles/file-manager/_layout.scss +0 -1
- package/styles/file-manager/bds.css +0 -4
- package/styles/file-manager/bootstrap-dark.css +0 -4
- package/styles/file-manager/bootstrap.css +0 -4
- package/styles/file-manager/bootstrap4.css +0 -4
- package/styles/file-manager/bootstrap5-dark.css +0 -4
- package/styles/file-manager/bootstrap5.3.css +0 -4
- package/styles/file-manager/bootstrap5.css +0 -4
- package/styles/file-manager/fabric-dark.css +0 -4
- package/styles/file-manager/fabric.css +0 -4
- package/styles/file-manager/fluent-dark.css +0 -4
- package/styles/file-manager/fluent.css +0 -4
- package/styles/file-manager/fluent2.css +0 -4
- package/styles/file-manager/highcontrast-light.css +0 -4
- package/styles/file-manager/highcontrast.css +0 -4
- package/styles/file-manager/material-dark.css +0 -4
- package/styles/file-manager/material.css +0 -4
- package/styles/file-manager/material3-dark.css +0 -4
- package/styles/file-manager/material3.css +0 -4
- package/styles/file-manager/tailwind-dark.css +0 -4
- package/styles/file-manager/tailwind.css +0 -4
- package/styles/file-manager/tailwind3.css +0 -4
- package/styles/fluent-dark-lite.css +0 -4
- package/styles/fluent-dark.css +0 -4
- package/styles/fluent-lite.css +0 -4
- package/styles/fluent.css +0 -4
- package/styles/fluent2-lite.css +0 -4
- package/styles/fluent2.css +0 -4
- package/styles/highcontrast-light-lite.css +0 -4
- package/styles/highcontrast-light.css +0 -4
- package/styles/highcontrast-lite.css +0 -4
- package/styles/highcontrast.css +0 -4
- package/styles/material-dark-lite.css +0 -4
- package/styles/material-dark.css +0 -4
- package/styles/material-lite.css +0 -4
- package/styles/material.css +0 -4
- package/styles/material3-dark-lite.css +0 -4
- package/styles/material3-dark.css +0 -4
- package/styles/material3-lite.css +0 -4
- package/styles/material3.css +0 -4
- package/styles/tailwind-dark-lite.css +0 -4
- package/styles/tailwind-dark.css +0 -4
- package/styles/tailwind-lite.css +0 -4
- package/styles/tailwind.css +0 -4
- package/styles/tailwind3-lite.css +0 -4
- package/styles/tailwind3.css +0 -4
package/dist/global/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* filename: index.d.ts
|
|
3
|
-
* version : 33.2.
|
|
3
|
+
* version : 33.2.13
|
|
4
4
|
* Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
|
|
5
5
|
* Use of this code is subject to the terms of our license.
|
|
6
6
|
* A copy of the current license can be obtained at any time by e-mailing
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@syncfusion/ej2-filemanager",
|
|
3
|
-
"version": "33.2.
|
|
3
|
+
"version": "33.2.13",
|
|
4
4
|
"description": "Essential JS 2 FileManager Component",
|
|
5
5
|
"author": "Syncfusion Inc.",
|
|
6
6
|
"license": "SEE LICENSE IN license",
|
|
@@ -10,9 +10,9 @@
|
|
|
10
10
|
"dependencies": {
|
|
11
11
|
"@syncfusion/ej2-base": "~33.2.3",
|
|
12
12
|
"@syncfusion/ej2-buttons": "~33.2.5",
|
|
13
|
-
"@syncfusion/ej2-data": "~33.2.
|
|
14
|
-
"@syncfusion/ej2-grids": "~33.2.
|
|
15
|
-
"@syncfusion/ej2-inputs": "~33.2.
|
|
13
|
+
"@syncfusion/ej2-data": "~33.2.12",
|
|
14
|
+
"@syncfusion/ej2-grids": "~33.2.12",
|
|
15
|
+
"@syncfusion/ej2-inputs": "~33.2.12",
|
|
16
16
|
"@syncfusion/ej2-layouts": "~33.2.3",
|
|
17
17
|
"@syncfusion/ej2-lists": "~33.2.3",
|
|
18
18
|
"@syncfusion/ej2-navigations": "~33.2.10",
|
|
@@ -21,6 +21,7 @@ export declare class DetailsView {
|
|
|
21
21
|
private dragObj;
|
|
22
22
|
private startIndex;
|
|
23
23
|
private firstItemIndex;
|
|
24
|
+
private currentColumnIndex;
|
|
24
25
|
private isSelectionUpdate;
|
|
25
26
|
private currentSelectedItem;
|
|
26
27
|
private count;
|
|
@@ -28,6 +29,7 @@ export declare class DetailsView {
|
|
|
28
29
|
private isLoaded;
|
|
29
30
|
private isNameWidth;
|
|
30
31
|
private isMultiSelect;
|
|
32
|
+
private isTabKeypressed;
|
|
31
33
|
gridObj: Grid;
|
|
32
34
|
pasteOperation: boolean;
|
|
33
35
|
uploadOperation: boolean;
|
|
@@ -125,6 +127,7 @@ export declare class DetailsView {
|
|
|
125
127
|
private removeFocus;
|
|
126
128
|
private onBlur;
|
|
127
129
|
private getFocusedItemIndex;
|
|
130
|
+
private getRowIndexFromParent;
|
|
128
131
|
private keydownHandler;
|
|
129
132
|
private keyupHandler;
|
|
130
133
|
gridSelectNodes(): Object[];
|
|
@@ -136,6 +139,9 @@ export declare class DetailsView {
|
|
|
136
139
|
private moveFunction;
|
|
137
140
|
private spaceSelection;
|
|
138
141
|
private ctrlMoveFunction;
|
|
142
|
+
private moveColumn;
|
|
143
|
+
private clearCellFocus;
|
|
144
|
+
private getNextColumnIndex;
|
|
139
145
|
private checkRowsKey;
|
|
140
146
|
private InnerItems;
|
|
141
147
|
private shiftSelectFocusItem;
|
|
@@ -149,6 +155,10 @@ export declare class DetailsView {
|
|
|
149
155
|
*/
|
|
150
156
|
addFocus(item: number | null): void;
|
|
151
157
|
private addHeaderFocus;
|
|
158
|
+
private tryNavigateToNextCellInRow;
|
|
159
|
+
private handleReverseTabNavigation;
|
|
160
|
+
private moveFocusToHeader;
|
|
161
|
+
private clearDetailsFocus;
|
|
152
162
|
private getFocusedItem;
|
|
153
163
|
private isSelected;
|
|
154
164
|
private shiftSelectedItem;
|
|
@@ -33,6 +33,7 @@ var DetailsView = /** @class */ (function () {
|
|
|
33
33
|
this.dragObj = null;
|
|
34
34
|
this.startIndex = null;
|
|
35
35
|
this.firstItemIndex = null;
|
|
36
|
+
this.currentColumnIndex = 0;
|
|
36
37
|
this.isSelectionUpdate = false;
|
|
37
38
|
this.currentSelectedItem = [];
|
|
38
39
|
this.count = 0;
|
|
@@ -40,6 +41,7 @@ var DetailsView = /** @class */ (function () {
|
|
|
40
41
|
this.isLoaded = false;
|
|
41
42
|
this.isNameWidth = false;
|
|
42
43
|
this.isMultiSelect = false;
|
|
44
|
+
this.isTabKeypressed = false;
|
|
43
45
|
this.pasteOperation = false;
|
|
44
46
|
this.uploadOperation = false;
|
|
45
47
|
this.nextFocusIndex = null;
|
|
@@ -51,6 +53,7 @@ var DetailsView = /** @class */ (function () {
|
|
|
51
53
|
altEnter: 'alt+enter',
|
|
52
54
|
esc: 'escape',
|
|
53
55
|
tab: 'tab',
|
|
56
|
+
shiftTab: 'shift+tab',
|
|
54
57
|
moveDown: 'downarrow',
|
|
55
58
|
ctrlEnd: 'ctrl+end',
|
|
56
59
|
ctrlHome: 'ctrl+home',
|
|
@@ -73,6 +76,8 @@ var DetailsView = /** @class */ (function () {
|
|
|
73
76
|
end: 'end',
|
|
74
77
|
home: 'home',
|
|
75
78
|
moveUp: 'uparrow',
|
|
79
|
+
moveLeft: 'leftarrow',
|
|
80
|
+
moveRight: 'rightarrow',
|
|
76
81
|
del: 'delete',
|
|
77
82
|
ctrlX: this.parent.isMac ? 'cmd+x' : 'ctrl+x',
|
|
78
83
|
ctrlC: this.parent.isMac ? 'cmd+c' : 'ctrl+c',
|
|
@@ -1410,8 +1415,21 @@ var DetailsView = /** @class */ (function () {
|
|
|
1410
1415
|
}
|
|
1411
1416
|
};
|
|
1412
1417
|
DetailsView.prototype.getFocusedItemIndex = function () {
|
|
1413
|
-
|
|
1414
|
-
|
|
1418
|
+
var focusedItem = this.getFocusedItem();
|
|
1419
|
+
if (isNOU(focusedItem)) {
|
|
1420
|
+
return null;
|
|
1421
|
+
}
|
|
1422
|
+
if (focusedItem.classList.contains('e-rowcell')) {
|
|
1423
|
+
return this.getRowIndexFromParent(focusedItem);
|
|
1424
|
+
}
|
|
1425
|
+
return parseInt(focusedItem.getAttribute('aria-rowindex'), 10) - 1;
|
|
1426
|
+
};
|
|
1427
|
+
DetailsView.prototype.getRowIndexFromParent = function (focusedItem) {
|
|
1428
|
+
var parentRow = focusedItem.parentElement;
|
|
1429
|
+
if (parentRow && parentRow.classList.contains('e-row')) {
|
|
1430
|
+
return parseInt(parentRow.getAttribute('aria-rowindex'), 10) - 1;
|
|
1431
|
+
}
|
|
1432
|
+
return null;
|
|
1415
1433
|
};
|
|
1416
1434
|
/* istanbul ignore next */
|
|
1417
1435
|
DetailsView.prototype.keydownHandler = function (e) {
|
|
@@ -1440,6 +1458,8 @@ var DetailsView = /** @class */ (function () {
|
|
|
1440
1458
|
case 'ctrlLeft':
|
|
1441
1459
|
case 'shiftLeft':
|
|
1442
1460
|
case 'csLeft':
|
|
1461
|
+
case 'tab':
|
|
1462
|
+
case 'shiftTab':
|
|
1443
1463
|
case 'esc':
|
|
1444
1464
|
case 'del':
|
|
1445
1465
|
case 'shiftdel':
|
|
@@ -1449,6 +1469,8 @@ var DetailsView = /** @class */ (function () {
|
|
|
1449
1469
|
case 'f2':
|
|
1450
1470
|
case 'moveDown':
|
|
1451
1471
|
case 'moveUp':
|
|
1472
|
+
case 'moveLeft':
|
|
1473
|
+
case 'moveRight':
|
|
1452
1474
|
case 'ctrlD':
|
|
1453
1475
|
e.preventDefault();
|
|
1454
1476
|
break;
|
|
@@ -1531,12 +1553,18 @@ var DetailsView = /** @class */ (function () {
|
|
|
1531
1553
|
break;
|
|
1532
1554
|
case 'ctrlHome':
|
|
1533
1555
|
case 'tab':
|
|
1556
|
+
case 'shiftTab':
|
|
1534
1557
|
if (!isNOU(gridItems[0])) {
|
|
1535
1558
|
if (!this.parent.allowMultiSelection && e.action === 'ctrlHome') {
|
|
1536
1559
|
this.gridObj.selectRow(0);
|
|
1537
1560
|
}
|
|
1538
|
-
else if (
|
|
1539
|
-
|
|
1561
|
+
else if (e.action === 'shiftTab') {
|
|
1562
|
+
this.handleReverseTabNavigation(e);
|
|
1563
|
+
}
|
|
1564
|
+
else if (e.action === 'tab') {
|
|
1565
|
+
this.isTabKeypressed = true;
|
|
1566
|
+
this.addHeaderFocus(e);
|
|
1567
|
+
this.isTabKeypressed = false;
|
|
1540
1568
|
}
|
|
1541
1569
|
else {
|
|
1542
1570
|
this.addHeaderFocus(e);
|
|
@@ -1606,6 +1634,10 @@ var DetailsView = /** @class */ (function () {
|
|
|
1606
1634
|
case 'moveDown':
|
|
1607
1635
|
this.moveFunction(gridItems, e, selIndex);
|
|
1608
1636
|
break;
|
|
1637
|
+
case 'moveLeft':
|
|
1638
|
+
case 'moveRight':
|
|
1639
|
+
this.moveColumn(e);
|
|
1640
|
+
break;
|
|
1609
1641
|
case 'end':
|
|
1610
1642
|
lastItem = [getValue(this.parent.hasId ? 'id' : 'name', gridItems[gridLength - 1])];
|
|
1611
1643
|
this.parent.setProperties({ selectedItems: lastItem }, true);
|
|
@@ -1736,6 +1768,72 @@ var DetailsView = /** @class */ (function () {
|
|
|
1736
1768
|
}
|
|
1737
1769
|
this.addFocus(nextItem);
|
|
1738
1770
|
};
|
|
1771
|
+
DetailsView.prototype.moveColumn = function (e) {
|
|
1772
|
+
var focusedItem = this.getFocusedItem();
|
|
1773
|
+
if (isNOU(focusedItem)) {
|
|
1774
|
+
return;
|
|
1775
|
+
}
|
|
1776
|
+
var isHeaderFocused = focusedItem.classList.contains('e-headercell');
|
|
1777
|
+
var isRowFocused = focusedItem.classList.contains('e-row');
|
|
1778
|
+
var isCellFocused = focusedItem.classList.contains('e-rowcell');
|
|
1779
|
+
if (!isHeaderFocused && !isRowFocused && !isCellFocused) {
|
|
1780
|
+
return;
|
|
1781
|
+
}
|
|
1782
|
+
if (isHeaderFocused) {
|
|
1783
|
+
var headers = Array.from(this.element.querySelectorAll('th.e-headercell:not(.e-fe-checkbox)'));
|
|
1784
|
+
var currentIndex = headers.indexOf(focusedItem);
|
|
1785
|
+
if (currentIndex === -1) {
|
|
1786
|
+
return;
|
|
1787
|
+
}
|
|
1788
|
+
var nextIndex = this.getNextColumnIndex(currentIndex, headers.length, e.action === 'moveRight');
|
|
1789
|
+
// eslint-disable-next-line security/detect-object-injection
|
|
1790
|
+
var headerElement = headers[nextIndex];
|
|
1791
|
+
focusedItem.setAttribute('tabindex', '-1');
|
|
1792
|
+
removeClass([focusedItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1793
|
+
headerElement.setAttribute('tabindex', '0');
|
|
1794
|
+
headerElement.focus();
|
|
1795
|
+
addClass([headerElement], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1796
|
+
}
|
|
1797
|
+
else if (isRowFocused || isCellFocused) {
|
|
1798
|
+
var row = (isRowFocused ? focusedItem : focusedItem.parentElement);
|
|
1799
|
+
if (!isRowFocused && (!row || !row.classList.contains('e-row'))) {
|
|
1800
|
+
return;
|
|
1801
|
+
}
|
|
1802
|
+
var cells = Array.from(row.querySelectorAll('.e-rowcell'));
|
|
1803
|
+
if (cells.length === 0) {
|
|
1804
|
+
return;
|
|
1805
|
+
}
|
|
1806
|
+
var currentCellIndex = this.currentColumnIndex || 0;
|
|
1807
|
+
var nextColumnIndex = this.getNextColumnIndex(currentCellIndex, cells.length, e.action === 'moveRight');
|
|
1808
|
+
this.currentColumnIndex = nextColumnIndex;
|
|
1809
|
+
if (isRowFocused) {
|
|
1810
|
+
removeClass([row], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1811
|
+
row.setAttribute('tabindex', '-1');
|
|
1812
|
+
}
|
|
1813
|
+
else {
|
|
1814
|
+
removeClass([focusedItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1815
|
+
focusedItem.setAttribute('tabindex', '-1');
|
|
1816
|
+
}
|
|
1817
|
+
this.clearCellFocus(cells);
|
|
1818
|
+
// eslint-disable-next-line security/detect-object-injection
|
|
1819
|
+
var nextCell = cells[nextColumnIndex];
|
|
1820
|
+
nextCell.setAttribute('tabindex', '0');
|
|
1821
|
+
addClass([nextCell], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1822
|
+
nextCell.focus();
|
|
1823
|
+
}
|
|
1824
|
+
};
|
|
1825
|
+
DetailsView.prototype.clearCellFocus = function (cells) {
|
|
1826
|
+
for (var i = 0; i < cells.length; i++) {
|
|
1827
|
+
cells[i].setAttribute('tabindex', '-1');
|
|
1828
|
+
removeClass([cells[i]], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1829
|
+
}
|
|
1830
|
+
};
|
|
1831
|
+
DetailsView.prototype.getNextColumnIndex = function (currentIndex, maxLength, isRight) {
|
|
1832
|
+
if (isRight) {
|
|
1833
|
+
return Math.min(currentIndex + 1, maxLength - 1);
|
|
1834
|
+
}
|
|
1835
|
+
return Math.max(currentIndex - 1, 0);
|
|
1836
|
+
};
|
|
1739
1837
|
DetailsView.prototype.checkRowsKey = function (items, indexValue, focIndex, e) {
|
|
1740
1838
|
if (this.gridObj.checkAllRows === 'Uncheck' || this.gridObj.checkAllRows === 'Intermediate') {
|
|
1741
1839
|
if (e.action !== 'csHome' && e.action !== 'csEnd') {
|
|
@@ -1821,18 +1919,58 @@ var DetailsView = /** @class */ (function () {
|
|
|
1821
1919
|
if (fItem) {
|
|
1822
1920
|
fItem.removeAttribute('tabindex');
|
|
1823
1921
|
removeClass([fItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1922
|
+
if (fItem.classList.contains('e-rowcell')) {
|
|
1923
|
+
var parentRow = fItem.parentElement;
|
|
1924
|
+
if (parentRow) {
|
|
1925
|
+
removeClass([parentRow], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1926
|
+
parentRow.removeAttribute('tabindex');
|
|
1927
|
+
}
|
|
1928
|
+
}
|
|
1929
|
+
if (fItem.classList.contains('e-row')) {
|
|
1930
|
+
var focusedCells = fItem.querySelectorAll('.e-rowcell');
|
|
1931
|
+
for (var i = 0; i < focusedCells.length; i++) {
|
|
1932
|
+
if (focusedCells[i].classList.contains('e-focus') || focusedCells[i].classList.contains('e-focused')) {
|
|
1933
|
+
focusedCells[i].removeAttribute('tabindex');
|
|
1934
|
+
removeClass([focusedCells[i]], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1935
|
+
}
|
|
1936
|
+
}
|
|
1937
|
+
}
|
|
1824
1938
|
}
|
|
1825
1939
|
if (!isNOU(itemElement)) {
|
|
1826
1940
|
this.gridObj.element.setAttribute('tabindex', '-1');
|
|
1827
|
-
itemElement
|
|
1828
|
-
|
|
1829
|
-
|
|
1941
|
+
var targetRow = itemElement;
|
|
1942
|
+
targetRow.setAttribute('tabindex', '0');
|
|
1943
|
+
var cells = targetRow.querySelectorAll('.e-rowcell');
|
|
1944
|
+
this.clearCellFocus(Array.from(cells));
|
|
1945
|
+
targetRow.focus();
|
|
1946
|
+
addClass([targetRow], [CLS.FOCUS, CLS.FOCUSED]);
|
|
1947
|
+
this.currentColumnIndex = 0;
|
|
1830
1948
|
}
|
|
1831
1949
|
};
|
|
1832
1950
|
DetailsView.prototype.addHeaderFocus = function (e) {
|
|
1833
1951
|
var treeFocus = select('.e-row', this.element);
|
|
1834
1952
|
this.gridObj.element.setAttribute('tabindex', '-1');
|
|
1953
|
+
var isHeaderFocused = this.getFocusedItem();
|
|
1835
1954
|
var nameFocus;
|
|
1955
|
+
var focusedRow = select('.e-row.e-focus', this.element);
|
|
1956
|
+
var gridIconCell;
|
|
1957
|
+
if (!isNOU(focusedRow) && this.isTabKeypressed) {
|
|
1958
|
+
gridIconCell = select('.e-rowcell.e-fe-grid-icon', focusedRow);
|
|
1959
|
+
}
|
|
1960
|
+
else {
|
|
1961
|
+
if (this.isTabKeypressed) {
|
|
1962
|
+
var activeCell = this.getFocusedItem();
|
|
1963
|
+
if (activeCell && activeCell.classList.contains('e-rowcell')) {
|
|
1964
|
+
gridIconCell = select('.e-rowcell.e-fe-grid-icon', activeCell.closest('.e-row'));
|
|
1965
|
+
}
|
|
1966
|
+
else {
|
|
1967
|
+
gridIconCell = select('.e-rowcell.e-fe-grid-icon', this.element);
|
|
1968
|
+
}
|
|
1969
|
+
}
|
|
1970
|
+
}
|
|
1971
|
+
if (this.tryNavigateToNextCellInRow(focusedRow, gridIconCell, isHeaderFocused)) {
|
|
1972
|
+
return;
|
|
1973
|
+
}
|
|
1836
1974
|
if (!isNOU(e.target) && e.target.classList.contains('e-defaultcursor')) {
|
|
1837
1975
|
this.addFocus(0);
|
|
1838
1976
|
nameFocus = e.target.nextElementSibling;
|
|
@@ -1854,6 +1992,147 @@ var DetailsView = /** @class */ (function () {
|
|
|
1854
1992
|
}
|
|
1855
1993
|
}
|
|
1856
1994
|
};
|
|
1995
|
+
DetailsView.prototype.tryNavigateToNextCellInRow = function (focusedRow, gridIconCell, isHeaderFocused) {
|
|
1996
|
+
if ((!isNOU(focusedRow) || !isNOU(gridIconCell)) && (!isNOU(isHeaderFocused) && !isHeaderFocused.classList.contains('e-headercell'))) {
|
|
1997
|
+
if (!isNOU(gridIconCell)) {
|
|
1998
|
+
var activeCell = this.getFocusedItem();
|
|
1999
|
+
if (activeCell && activeCell.classList.contains('e-rowcell')) {
|
|
2000
|
+
var row = activeCell.parentElement;
|
|
2001
|
+
var cells = row ? Array.from(row.querySelectorAll('.e-rowcell')) : [];
|
|
2002
|
+
var currentIndex = cells.indexOf(activeCell);
|
|
2003
|
+
var nextIndex = currentIndex + 1;
|
|
2004
|
+
if (nextIndex < cells.length) {
|
|
2005
|
+
this.currentColumnIndex = nextIndex;
|
|
2006
|
+
activeCell.setAttribute('tabindex', '-1');
|
|
2007
|
+
removeClass([activeCell], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2008
|
+
// eslint-disable-next-line security/detect-object-injection
|
|
2009
|
+
var nextCell = cells[nextIndex];
|
|
2010
|
+
nextCell.setAttribute('tabindex', '0');
|
|
2011
|
+
addClass([nextCell], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2012
|
+
nextCell.focus();
|
|
2013
|
+
return true;
|
|
2014
|
+
}
|
|
2015
|
+
else {
|
|
2016
|
+
var currentRow = activeCell.parentElement;
|
|
2017
|
+
var rows = this.gridObj.getRows();
|
|
2018
|
+
var currentRowIndex = rows.indexOf(currentRow);
|
|
2019
|
+
if (currentRowIndex !== -1) {
|
|
2020
|
+
var nextRow = this.gridObj.getRowByIndex(currentRowIndex + 1);
|
|
2021
|
+
if (!isNOU(nextRow)) {
|
|
2022
|
+
activeCell.setAttribute('tabindex', '-1');
|
|
2023
|
+
removeClass([activeCell], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2024
|
+
this.addFocus(currentRowIndex + 1);
|
|
2025
|
+
return true;
|
|
2026
|
+
}
|
|
2027
|
+
else {
|
|
2028
|
+
activeCell.setAttribute('tabindex', '-1');
|
|
2029
|
+
removeClass([activeCell], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2030
|
+
activeCell.blur();
|
|
2031
|
+
return true;
|
|
2032
|
+
}
|
|
2033
|
+
}
|
|
2034
|
+
return false;
|
|
2035
|
+
}
|
|
2036
|
+
}
|
|
2037
|
+
var focusedRow_1 = this.getFocusedItem();
|
|
2038
|
+
if (!isNOU(focusedRow_1) && focusedRow_1.classList.contains('e-row')) {
|
|
2039
|
+
focusedRow_1.setAttribute('tabindex', '-1');
|
|
2040
|
+
removeClass([focusedRow_1], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2041
|
+
}
|
|
2042
|
+
gridIconCell.setAttribute('tabindex', '0');
|
|
2043
|
+
addClass([gridIconCell], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2044
|
+
gridIconCell.focus();
|
|
2045
|
+
return true;
|
|
2046
|
+
}
|
|
2047
|
+
}
|
|
2048
|
+
return false;
|
|
2049
|
+
};
|
|
2050
|
+
DetailsView.prototype.handleReverseTabNavigation = function (e) {
|
|
2051
|
+
e.preventDefault();
|
|
2052
|
+
var focusedItem = this.getFocusedItem();
|
|
2053
|
+
var headers = Array.from(this.element.querySelectorAll('th.e-headercell:not(.e-fe-checkbox)'));
|
|
2054
|
+
if (headers.length === 0) {
|
|
2055
|
+
return;
|
|
2056
|
+
}
|
|
2057
|
+
if (!isNOU(focusedItem) && focusedItem.classList.contains('e-rowcell')) {
|
|
2058
|
+
var row = focusedItem.parentElement;
|
|
2059
|
+
var cells = row ? Array.from(row.querySelectorAll('.e-rowcell:not(.e-gridchkbox)')) : [];
|
|
2060
|
+
var currentTargetIndex = cells.indexOf(focusedItem);
|
|
2061
|
+
var prevIndex = currentTargetIndex - 1;
|
|
2062
|
+
// eslint-disable-next-line security/detect-object-injection
|
|
2063
|
+
var targetElement = prevIndex >= 0 ? cells[prevIndex] : row;
|
|
2064
|
+
focusedItem.setAttribute('tabindex', '-1');
|
|
2065
|
+
removeClass([focusedItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2066
|
+
targetElement.setAttribute('tabindex', '0');
|
|
2067
|
+
addClass([targetElement], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2068
|
+
targetElement.focus();
|
|
2069
|
+
return;
|
|
2070
|
+
}
|
|
2071
|
+
if (!isNOU(focusedItem) && focusedItem.classList.contains('e-row')) {
|
|
2072
|
+
var rows = this.gridObj.getRows();
|
|
2073
|
+
var currentRowIndex = rows.indexOf(focusedItem);
|
|
2074
|
+
if (currentRowIndex > 0) {
|
|
2075
|
+
var previousRow = rows[currentRowIndex - 1];
|
|
2076
|
+
var previousRowCells = Array.from(previousRow.querySelectorAll('.e-rowcell:not(.e-gridchkbox)'));
|
|
2077
|
+
var lastCell = previousRowCells[previousRowCells.length - 1];
|
|
2078
|
+
focusedItem.setAttribute('tabindex', '-1');
|
|
2079
|
+
removeClass([focusedItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2080
|
+
lastCell.setAttribute('tabindex', '0');
|
|
2081
|
+
addClass([lastCell], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2082
|
+
lastCell.focus();
|
|
2083
|
+
return;
|
|
2084
|
+
}
|
|
2085
|
+
focusedItem.setAttribute('tabindex', '-1');
|
|
2086
|
+
removeClass([focusedItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2087
|
+
this.moveFocusToHeader(headers[headers.length - 1]);
|
|
2088
|
+
return;
|
|
2089
|
+
}
|
|
2090
|
+
if (!isNOU(focusedItem) && focusedItem.classList.contains('e-headercell')) {
|
|
2091
|
+
var currentIndex = headers.indexOf(focusedItem);
|
|
2092
|
+
if (currentIndex > 0) {
|
|
2093
|
+
this.moveFocusToHeader(headers[currentIndex - 1]);
|
|
2094
|
+
}
|
|
2095
|
+
else if (currentIndex === 0) {
|
|
2096
|
+
this.clearDetailsFocus();
|
|
2097
|
+
}
|
|
2098
|
+
return;
|
|
2099
|
+
}
|
|
2100
|
+
if (!isNOU(focusedItem)) {
|
|
2101
|
+
this.moveFocusToHeader(headers[headers.length - 1]);
|
|
2102
|
+
}
|
|
2103
|
+
};
|
|
2104
|
+
DetailsView.prototype.moveFocusToHeader = function (header) {
|
|
2105
|
+
var focusedItem = this.getFocusedItem();
|
|
2106
|
+
if (!isNOU(focusedItem)) {
|
|
2107
|
+
focusedItem.setAttribute('tabindex', '-1');
|
|
2108
|
+
removeClass([focusedItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2109
|
+
}
|
|
2110
|
+
header.setAttribute('tabindex', '0');
|
|
2111
|
+
header.focus();
|
|
2112
|
+
addClass([header], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2113
|
+
};
|
|
2114
|
+
DetailsView.prototype.clearDetailsFocus = function () {
|
|
2115
|
+
var focusedItem = this.getFocusedItem();
|
|
2116
|
+
if (!isNOU(focusedItem)) {
|
|
2117
|
+
focusedItem.setAttribute('tabindex', '-1');
|
|
2118
|
+
removeClass([focusedItem], [CLS.FOCUS, CLS.FOCUSED]);
|
|
2119
|
+
}
|
|
2120
|
+
var breadcrumbBar = select('.' + CLS.BREADCRUMBS, this.parent.element);
|
|
2121
|
+
if (!isNOU(breadcrumbBar)) {
|
|
2122
|
+
var searchInput = breadcrumbBar.querySelector('input[aria-label="Search"]');
|
|
2123
|
+
if (!isNOU(searchInput)) {
|
|
2124
|
+
searchInput.setAttribute('tabindex', '0');
|
|
2125
|
+
searchInput.focus();
|
|
2126
|
+
}
|
|
2127
|
+
else {
|
|
2128
|
+
var lastBreadcrumb = breadcrumbBar.querySelector('.e-address-list-item:last-child');
|
|
2129
|
+
if (!isNOU(lastBreadcrumb)) {
|
|
2130
|
+
lastBreadcrumb.setAttribute('tabindex', '0');
|
|
2131
|
+
lastBreadcrumb.focus();
|
|
2132
|
+
}
|
|
2133
|
+
}
|
|
2134
|
+
}
|
|
2135
|
+
};
|
|
1857
2136
|
DetailsView.prototype.getFocusedItem = function () {
|
|
1858
2137
|
return select('.' + CLS.FOCUSED, this.element);
|
|
1859
2138
|
};
|
package/styles/bds-lite.css
CHANGED
|
@@ -813,10 +813,6 @@ ejs-filemanager {
|
|
|
813
813
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
814
814
|
visibility: hidden;
|
|
815
815
|
}
|
|
816
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
817
|
-
-webkit-box-shadow: none;
|
|
818
|
-
box-shadow: none;
|
|
819
|
-
}
|
|
820
816
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
821
817
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
822
818
|
visibility: visible;
|
package/styles/bds.css
CHANGED
|
@@ -813,10 +813,6 @@ ejs-filemanager {
|
|
|
813
813
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
814
814
|
visibility: hidden;
|
|
815
815
|
}
|
|
816
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
817
|
-
-webkit-box-shadow: none;
|
|
818
|
-
box-shadow: none;
|
|
819
|
-
}
|
|
820
816
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
821
817
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
822
818
|
visibility: visible;
|
|
@@ -521,10 +521,6 @@ ejs-filemanager {
|
|
|
521
521
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
522
522
|
visibility: hidden;
|
|
523
523
|
}
|
|
524
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
525
|
-
-webkit-box-shadow: none;
|
|
526
|
-
box-shadow: none;
|
|
527
|
-
}
|
|
528
524
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
529
525
|
-webkit-box-shadow: inset 0 1px 0 0 rgb(36, 138.2, 255), inset 0 -1px 0 0 rgb(36, 138.2, 255);
|
|
530
526
|
box-shadow: inset 0 1px 0 0 rgb(36, 138.2, 255), inset 0 -1px 0 0 rgb(36, 138.2, 255);
|
|
@@ -521,10 +521,6 @@ ejs-filemanager {
|
|
|
521
521
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
522
522
|
visibility: hidden;
|
|
523
523
|
}
|
|
524
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
525
|
-
-webkit-box-shadow: none;
|
|
526
|
-
box-shadow: none;
|
|
527
|
-
}
|
|
528
524
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
529
525
|
-webkit-box-shadow: inset 0 1px 0 0 rgb(36, 138.2, 255), inset 0 -1px 0 0 rgb(36, 138.2, 255);
|
|
530
526
|
box-shadow: inset 0 1px 0 0 rgb(36, 138.2, 255), inset 0 -1px 0 0 rgb(36, 138.2, 255);
|
|
@@ -522,10 +522,6 @@ ejs-filemanager {
|
|
|
522
522
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
523
523
|
visibility: hidden;
|
|
524
524
|
}
|
|
525
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
526
|
-
-webkit-box-shadow: none;
|
|
527
|
-
box-shadow: none;
|
|
528
|
-
}
|
|
529
525
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
530
526
|
-webkit-box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
|
531
527
|
box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
package/styles/bootstrap.css
CHANGED
|
@@ -522,10 +522,6 @@ ejs-filemanager {
|
|
|
522
522
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
523
523
|
visibility: hidden;
|
|
524
524
|
}
|
|
525
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
526
|
-
-webkit-box-shadow: none;
|
|
527
|
-
box-shadow: none;
|
|
528
|
-
}
|
|
529
525
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
530
526
|
-webkit-box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
|
531
527
|
box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
|
@@ -521,10 +521,6 @@ ejs-filemanager {
|
|
|
521
521
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
522
522
|
visibility: hidden;
|
|
523
523
|
}
|
|
524
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
525
|
-
-webkit-box-shadow: none;
|
|
526
|
-
box-shadow: none;
|
|
527
|
-
}
|
|
528
524
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
529
525
|
-webkit-box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
|
530
526
|
box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
package/styles/bootstrap4.css
CHANGED
|
@@ -521,10 +521,6 @@ ejs-filemanager {
|
|
|
521
521
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
522
522
|
visibility: hidden;
|
|
523
523
|
}
|
|
524
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
525
|
-
-webkit-box-shadow: none;
|
|
526
|
-
box-shadow: none;
|
|
527
|
-
}
|
|
528
524
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
529
525
|
-webkit-box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
|
530
526
|
box-shadow: inset 0 1px 0 0 #66afe9, inset 0 -1px 0 0 #66afe9;
|
|
@@ -530,10 +530,6 @@ ejs-filemanager {
|
|
|
530
530
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
531
531
|
visibility: hidden;
|
|
532
532
|
}
|
|
533
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
534
|
-
-webkit-box-shadow: none;
|
|
535
|
-
box-shadow: none;
|
|
536
|
-
}
|
|
537
533
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
538
534
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
539
535
|
visibility: visible;
|
|
@@ -530,10 +530,6 @@ ejs-filemanager {
|
|
|
530
530
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
531
531
|
visibility: hidden;
|
|
532
532
|
}
|
|
533
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
534
|
-
-webkit-box-shadow: none;
|
|
535
|
-
box-shadow: none;
|
|
536
|
-
}
|
|
537
533
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
538
534
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
539
535
|
visibility: visible;
|
|
@@ -530,10 +530,6 @@ ejs-filemanager {
|
|
|
530
530
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
531
531
|
visibility: hidden;
|
|
532
532
|
}
|
|
533
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
534
|
-
-webkit-box-shadow: none;
|
|
535
|
-
box-shadow: none;
|
|
536
|
-
}
|
|
537
533
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
538
534
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
539
535
|
visibility: visible;
|
|
@@ -699,10 +699,6 @@ ejs-filemanager {
|
|
|
699
699
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
700
700
|
visibility: hidden;
|
|
701
701
|
}
|
|
702
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
703
|
-
-webkit-box-shadow: none;
|
|
704
|
-
box-shadow: none;
|
|
705
|
-
}
|
|
706
702
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
707
703
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
708
704
|
visibility: visible;
|
package/styles/bootstrap5.3.css
CHANGED
|
@@ -699,10 +699,6 @@ ejs-filemanager {
|
|
|
699
699
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
700
700
|
visibility: hidden;
|
|
701
701
|
}
|
|
702
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
703
|
-
-webkit-box-shadow: none;
|
|
704
|
-
box-shadow: none;
|
|
705
|
-
}
|
|
706
702
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
707
703
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
708
704
|
visibility: visible;
|
package/styles/bootstrap5.css
CHANGED
|
@@ -530,10 +530,6 @@ ejs-filemanager {
|
|
|
530
530
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
531
531
|
visibility: hidden;
|
|
532
532
|
}
|
|
533
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
534
|
-
-webkit-box-shadow: none;
|
|
535
|
-
box-shadow: none;
|
|
536
|
-
}
|
|
537
533
|
.e-filemanager .e-grid .e-row:hover .e-checkbox-wrapper,
|
|
538
534
|
.e-filemanager .e-grid .e-row .e-active .e-checkbox-wrapper {
|
|
539
535
|
visibility: visible;
|
|
@@ -521,10 +521,6 @@ ejs-filemanager {
|
|
|
521
521
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
522
522
|
visibility: hidden;
|
|
523
523
|
}
|
|
524
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
525
|
-
-webkit-box-shadow: none;
|
|
526
|
-
box-shadow: none;
|
|
527
|
-
}
|
|
528
524
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
529
525
|
-webkit-box-shadow: inset 0 1px 0 0 #dadada, inset 0 -1px 0 0 #dadada;
|
|
530
526
|
box-shadow: inset 0 1px 0 0 #dadada, inset 0 -1px 0 0 #dadada;
|
package/styles/fabric-dark.css
CHANGED
|
@@ -521,10 +521,6 @@ ejs-filemanager {
|
|
|
521
521
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
522
522
|
visibility: hidden;
|
|
523
523
|
}
|
|
524
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
525
|
-
-webkit-box-shadow: none;
|
|
526
|
-
box-shadow: none;
|
|
527
|
-
}
|
|
528
524
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
529
525
|
-webkit-box-shadow: inset 0 1px 0 0 #dadada, inset 0 -1px 0 0 #dadada;
|
|
530
526
|
box-shadow: inset 0 1px 0 0 #dadada, inset 0 -1px 0 0 #dadada;
|
package/styles/fabric-lite.css
CHANGED
|
@@ -522,10 +522,6 @@ ejs-filemanager {
|
|
|
522
522
|
.e-filemanager .e-grid .e-row .e-checkbox-wrapper {
|
|
523
523
|
visibility: hidden;
|
|
524
524
|
}
|
|
525
|
-
.e-filemanager .e-grid .e-row.e-focused {
|
|
526
|
-
-webkit-box-shadow: none;
|
|
527
|
-
box-shadow: none;
|
|
528
|
-
}
|
|
529
525
|
.e-filemanager .e-grid .e-row.e-focused td {
|
|
530
526
|
-webkit-box-shadow: inset 0 1px 0 0 #666, inset 0 -1px 0 0 #666;
|
|
531
527
|
box-shadow: inset 0 1px 0 0 #666, inset 0 -1px 0 0 #666;
|