@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.
Files changed (77) hide show
  1. package/dist/ej2-filemanager.min.js +2 -2
  2. package/dist/ej2-filemanager.umd.min.js +2 -2
  3. package/dist/ej2-filemanager.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-filemanager.es2015.js +286 -7
  5. package/dist/es6/ej2-filemanager.es2015.js.map +1 -1
  6. package/dist/es6/ej2-filemanager.es5.js +286 -7
  7. package/dist/es6/ej2-filemanager.es5.js.map +1 -1
  8. package/dist/global/ej2-filemanager.min.js +2 -2
  9. package/dist/global/ej2-filemanager.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +4 -4
  12. package/src/file-manager/layout/details-view.d.ts +10 -0
  13. package/src/file-manager/layout/details-view.js +286 -7
  14. package/styles/bds-lite.css +0 -4
  15. package/styles/bds.css +0 -4
  16. package/styles/bootstrap-dark-lite.css +0 -4
  17. package/styles/bootstrap-dark.css +0 -4
  18. package/styles/bootstrap-lite.css +0 -4
  19. package/styles/bootstrap.css +0 -4
  20. package/styles/bootstrap4-lite.css +0 -4
  21. package/styles/bootstrap4.css +0 -4
  22. package/styles/bootstrap5-dark-lite.css +0 -4
  23. package/styles/bootstrap5-dark.css +0 -4
  24. package/styles/bootstrap5-lite.css +0 -4
  25. package/styles/bootstrap5.3-lite.css +0 -4
  26. package/styles/bootstrap5.3.css +0 -4
  27. package/styles/bootstrap5.css +0 -4
  28. package/styles/fabric-dark-lite.css +0 -4
  29. package/styles/fabric-dark.css +0 -4
  30. package/styles/fabric-lite.css +0 -4
  31. package/styles/fabric.css +0 -4
  32. package/styles/file-manager/_layout.scss +0 -1
  33. package/styles/file-manager/bds.css +0 -4
  34. package/styles/file-manager/bootstrap-dark.css +0 -4
  35. package/styles/file-manager/bootstrap.css +0 -4
  36. package/styles/file-manager/bootstrap4.css +0 -4
  37. package/styles/file-manager/bootstrap5-dark.css +0 -4
  38. package/styles/file-manager/bootstrap5.3.css +0 -4
  39. package/styles/file-manager/bootstrap5.css +0 -4
  40. package/styles/file-manager/fabric-dark.css +0 -4
  41. package/styles/file-manager/fabric.css +0 -4
  42. package/styles/file-manager/fluent-dark.css +0 -4
  43. package/styles/file-manager/fluent.css +0 -4
  44. package/styles/file-manager/fluent2.css +0 -4
  45. package/styles/file-manager/highcontrast-light.css +0 -4
  46. package/styles/file-manager/highcontrast.css +0 -4
  47. package/styles/file-manager/material-dark.css +0 -4
  48. package/styles/file-manager/material.css +0 -4
  49. package/styles/file-manager/material3-dark.css +0 -4
  50. package/styles/file-manager/material3.css +0 -4
  51. package/styles/file-manager/tailwind-dark.css +0 -4
  52. package/styles/file-manager/tailwind.css +0 -4
  53. package/styles/file-manager/tailwind3.css +0 -4
  54. package/styles/fluent-dark-lite.css +0 -4
  55. package/styles/fluent-dark.css +0 -4
  56. package/styles/fluent-lite.css +0 -4
  57. package/styles/fluent.css +0 -4
  58. package/styles/fluent2-lite.css +0 -4
  59. package/styles/fluent2.css +0 -4
  60. package/styles/highcontrast-light-lite.css +0 -4
  61. package/styles/highcontrast-light.css +0 -4
  62. package/styles/highcontrast-lite.css +0 -4
  63. package/styles/highcontrast.css +0 -4
  64. package/styles/material-dark-lite.css +0 -4
  65. package/styles/material-dark.css +0 -4
  66. package/styles/material-lite.css +0 -4
  67. package/styles/material.css +0 -4
  68. package/styles/material3-dark-lite.css +0 -4
  69. package/styles/material3-dark.css +0 -4
  70. package/styles/material3-lite.css +0 -4
  71. package/styles/material3.css +0 -4
  72. package/styles/tailwind-dark-lite.css +0 -4
  73. package/styles/tailwind-dark.css +0 -4
  74. package/styles/tailwind-lite.css +0 -4
  75. package/styles/tailwind.css +0 -4
  76. package/styles/tailwind3-lite.css +0 -4
  77. package/styles/tailwind3.css +0 -4
@@ -1,6 +1,6 @@
1
1
  /*!
2
2
  * filename: index.d.ts
3
- * version : 33.2.10
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.10",
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.5",
14
- "@syncfusion/ej2-grids": "~33.2.10",
15
- "@syncfusion/ej2-inputs": "~33.2.10",
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
- return (!isNOU(this.getFocusedItem())) ?
1414
- parseInt(this.getFocusedItem().getAttribute('aria-rowindex'), 10) - 1 : null;
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 (this.gridObj.selectedRowIndex !== -1 && e.action === 'tab') {
1539
- return;
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.setAttribute('tabindex', '0');
1828
- itemElement.focus();
1829
- addClass([itemElement], [CLS.FOCUS, CLS.FOCUSED]);
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
  };
@@ -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;
@@ -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;
@@ -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;
@@ -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;
@@ -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;
@@ -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;
@@ -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;