@syncfusion/ej2-filemanager 34.1.29 → 34.1.33

package/dist/es6/ej2-filemanager.es2015.js

@@ -4230,6 +4230,7 @@ function onFolderDialogOpen(parent) {
         createInput(ele, getLocaleText(parent, 'Content-NewFolder'));
     }
     ele.parentElement.nextElementSibling.innerHTML = '';
+    ele.setAttribute('aria-invalid', 'false');
     ele.oninput = () => {
         onValidate(parent, ele);
     };
@@ -4254,6 +4255,7 @@ function onRenameDialogOpen(parent) {
         createInput(inputEle, getLocaleText(parent, 'Content-Rename'));
     }
     inputEle.parentElement.nextElementSibling.innerHTML = '';
+    inputEle.setAttribute('aria-invalid', 'false');
     inputEle.oninput = () => {
         onValidate(parent, inputEle);
     };
@@ -4333,7 +4335,7 @@ function getOptions(parent, text, e, details) {
         case 'NewFolder':
             options.dialogName = 'Create Folder';
             options.header = getLocaleText(parent, 'Header-NewFolder');
-            options.content = '<input type="text" value="New folder" id="newname"><div class="e-fe-error"></div>';
+            options.content = '<input type="text" value="New folder" id="newname" aria-invalid="false" aria-describedby="newname_error"><div id="newname_error" class="e-fe-error" role="alert"></div>';
             options.buttons = [
                 {
                     buttonModel: { isPrimary: true, content: getLocaleText(parent, 'Button-Create') },
@@ -4376,7 +4378,7 @@ function getOptions(parent, text, e, details) {
         case 'Rename':
             options.dialogName = 'Rename';
             options.header = getLocaleText(parent, 'Header-Rename');
-            options.content = '<input type="text" class="e-input" id="rename"><div class="e-fe-error"></div>';
+            options.content = '<input type="text" class="e-input" id="rename" aria-invalid="false" aria-describedby="rename_error"><div id="rename_error" class="e-fe-error" role="alert"></div>';
             options.buttons = [
                 {
                     buttonModel: { isPrimary: true, content: getLocaleText(parent, 'Button-Save') },
@@ -4627,9 +4629,11 @@ function onValidate(parent, ele) {
         addInvalid(parent, ele);
     }
     else if (ele.value === '') {
+        ele.setAttribute('aria-invalid', 'true');
         ele.parentElement.nextElementSibling.innerHTML = getLocaleText(parent, 'Validation-Empty');
     }
     else {
+        ele.setAttribute('aria-invalid', 'false');
         ele.parentElement.nextElementSibling.innerHTML = '';
     }
 }
@@ -4657,6 +4661,7 @@ function onSubmitValidate(parent, ele) {
  */
 function addInvalid(parent, ele) {
     const error = getLocaleText(parent, 'Validation-Invalid').replace('{0}', '"' + ele.value + '"');
+    ele.setAttribute('aria-invalid', 'true');
     if (parent.enableHtmlSanitizer) {
         ele.parentElement.nextElementSibling.textContent = error;
     }
@@ -6083,12 +6088,22 @@ class LargeIconsView {
         }
     }
     spaceKey(fItem) {
-        if (!isNullOrUndefined(fItem) && !fItem.classList.contains(ACTIVE)) {
-            const fileSelectionArgs = this.triggerSelection('select', fItem);
-            if (fileSelectionArgs.cancel !== true) {
-                this.addActive(fItem);
-                this.parent.notify(selectionChanged, {});
-                this.triggerSelect('select', fItem);
+        if (!isNullOrUndefined(fItem)) {
+            if (!fItem.classList.contains(ACTIVE)) {
+                const fileSelectionArgs = this.triggerSelection('select', fItem);
+                if (fileSelectionArgs.cancel !== true) {
+                    this.addActive(fItem);
+                    this.parent.notify(selectionChanged, {});
+                    this.triggerSelect('select', fItem);
+                }
+            }
+            else {
+                const fileSelectionArgs = this.triggerSelection('unselect', fItem);
+                if (fileSelectionArgs.cancel !== true) {
+                    this.removeActive(fItem);
+                    this.parent.notify(selectionChanged, {});
+                    this.triggerSelect('unselect', fItem);
+                }
             }
         }
     }
@@ -12610,11 +12625,15 @@ class DetailsView {
             case 'enter':
                 if (this.gridObj.selectedRowIndex === -1 && this.gridObj.allowSorting === true) {
                     if (!e.target.classList.contains('e-fe-grid-icon')) {
-                        const direction = !e.target.getElementsByClassName('e-ascending').length ? 'Ascending' : 'Descending';
-                        const currentField = this.gridObj.getColumnByUid(e.target.querySelector('.e-headercelldiv').getAttribute('e-mappinguid')).field;
-                        this.gridObj.sortColumn(currentField, direction);
-                        if (!isNullOrUndefined(this.getFocusedItem().nextSibling)) {
-                            this.getFocusedItem().nextSibling.setAttribute('tabindex', '0');
+                        const headerDiv = e.target.querySelector('.e-headercelldiv');
+                        if (headerDiv) {
+                            const mappingUid = headerDiv.getAttribute('data-mappinguid');
+                            const direction = !e.target.getElementsByClassName('e-ascending').length ? 'Ascending' : 'Descending';
+                            const currentField = this.gridObj.getColumnByUid(mappingUid).field;
+                            this.gridObj.sortColumn(currentField, direction);
+                            if (!isNullOrUndefined(this.getFocusedItem().nextSibling)) {
+                                this.getFocusedItem().nextSibling.setAttribute('tabindex', '0');
+                            }
                         }
                     }
                     break;
@@ -12656,21 +12675,19 @@ class DetailsView {
             case 'ctrlHome':
             case 'tab':
             case 'shiftTab':
-                if (!isNullOrUndefined(gridItems[0])) {
-                    if (!this.parent.allowMultiSelection && e.action === 'ctrlHome') {
-                        this.gridObj.selectRow(0);
-                    }
-                    else if (e.action === 'shiftTab') {
-                        this.handleReverseTabNavigation(e);
-                    }
-                    else if (e.action === 'tab') {
-                        this.isTabKeypressed = true;
-                        this.addHeaderFocus(e);
-                        this.isTabKeypressed = false;
-                    }
-                    else {
-                        this.addHeaderFocus(e);
-                    }
+                if (!this.parent.allowMultiSelection && e.action === 'ctrlHome') {
+                    this.gridObj.selectRow(0);
+                }
+                else if (e.action === 'shiftTab') {
+                    this.handleReverseTabNavigation(e);
+                }
+                else if (e.action === 'tab') {
+                    this.isTabKeypressed = true;
+                    this.addHeaderFocus(e);
+                    this.isTabKeypressed = false;
+                }
+                else {
+                    this.addHeaderFocus(e);
                 }
                 break;
             case 'ctrlEnd':
@@ -12848,6 +12865,14 @@ class DetailsView {
             this.gridObj.selectRows(selRowIndeces);
             this.addFocus(lItem);
         }
+        else if (e.action === 'space' && this.isSelected(selRowIndeces, focIndex)) {
+            const indexToRemove = selRowIndeces.indexOf(focIndex);
+            if (indexToRemove > -1) {
+                selRowIndeces.splice(indexToRemove, 1);
+                this.gridObj.selectRows(selRowIndeces);
+                this.addFocus(focIndex);
+            }
+        }
         else if (e.action === 'shiftSpace') {
             this.gridObj.selectRow(selIndex);
         }
@@ -13088,9 +13113,11 @@ class DetailsView {
             nameFocus.setAttribute('tabindex', '0');
             nameFocus.focus();
             addClass([nameFocus], [FOCUS, FOCUSED]);
-            treeFocus.setAttribute('tabindex', '0');
-            if (treeFocus.tabIndex === 0 && nameFocus.tabIndex === 0) {
-                removeClass([treeFocus], [FOCUS, FOCUSED]);
+            if (!isNullOrUndefined(treeFocus)) {
+                treeFocus.setAttribute('tabindex', '0');
+                if (treeFocus.tabIndex === 0 && nameFocus.tabIndex === 0) {
+                    removeClass([treeFocus], [FOCUS, FOCUSED]);
+                }
             }
         }
     }
@@ -13156,6 +13183,10 @@ class DetailsView {
         if (headers.length === 0) {
             return;
         }
+        if (isNullOrUndefined(focusedItem)) {
+            this.moveFocusToHeader(headers[headers.length - 1]);
+            return;
+        }
         if (!isNullOrUndefined(focusedItem) && focusedItem.classList.contains('e-rowcell')) {
             const row = focusedItem.parentElement;
             const cells = row ? Array.from(row.querySelectorAll('.e-rowcell:not(.e-gridchkbox)')) : [];