@syncfusion/ej2-filemanager 19.3.53 → 19.4.43

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

@@ -1,4 +1,4 @@
-import { Ajax, Browser, ChildProperty, Complex, Component, Draggable, Event, EventHandler, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Property, Touch, addClass, closest, createElement, detach, extend, formatUnit, getValue, isNullOrUndefined, isVisible, matches, remove, removeClass, select, selectAll, setStyleAttribute, setValue } from '@syncfusion/ej2-base';
+import { Ajax, Browser, ChildProperty, Complex, Component, Draggable, Event, EventHandler, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Property, Touch, addClass, closest, createElement, detach, extend, formatUnit, getUniqueID, getValue, isNullOrUndefined, isVisible, matches, remove, removeClass, select, selectAll, setStyleAttribute, setValue } from '@syncfusion/ej2-base';
 import { Splitter } from '@syncfusion/ej2-layouts';
 import { Dialog, createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';
 import { DataManager, Query } from '@syncfusion/ej2-data';
@@ -73,6 +73,9 @@ __decorate$2([
 __decorate$2([
     Property(true)
 ], SearchSettings.prototype, "ignoreCase", void 0);
+__decorate$2([
+    Property(null)
+], SearchSettings.prototype, "placeholder", void 0);
 
 var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -1053,7 +1056,7 @@ function fileType(file) {
 function getImageUrl(parent, item) {
     const baseUrl = parent.ajaxSettings.getImageUrl ? parent.ajaxSettings.getImageUrl : parent.ajaxSettings.url;
     let imgUrl;
-    const fileName = getValue('name', item);
+    const fileName = encodeURIComponent(getValue('name', item));
     const fPath = getValue('filterPath', item);
     if (parent.hasId) {
         const imgId = getValue('id', item);
@@ -1627,7 +1630,7 @@ function createVirtualDragElement(parent) {
             parent.dragNodes.push(parent.selectedItems[i]);
             i++;
         }
-        if (parent.selectedItems.length == 0 && parent.dragData && parent.dragData.length == 1) {
+        if (parent.selectedItems.length === 0 && parent.dragData && parent.dragData.length === 1) {
             parent.dragNodes.push(getItemName(parent, parent.dragData[0]));
         }
     }
@@ -2145,7 +2148,7 @@ function filter(parent, event) {
     let filterData;
     // eslint-disable-next-line
     const filterDataVal = parent.filterData ? extend(filterData, data, parent.filterData) : data;
-    createAjax(parent, filterData, filterSuccess, event, getValue('action', filterDataVal));
+    createAjax(parent, filterDataVal, filterSuccess, event, getValue('action', filterDataVal));
 }
 /**
  * Function to rename the folder/file in File Manager.
@@ -5630,7 +5633,7 @@ class BreadCrumbBar {
         }
     }
     onSearchTextChange(args) {
-        this.searchObj.element.placeholder = getLocaleText(this.parent, 'Search') + ' ' + args.cwd.name;
+        this.searchObj.element.placeholder = (this.parent.searchSettings.placeholder != null) ? this.parent.searchSettings.placeholder : getLocaleText(this.parent, 'Search') + ' ' + args.cwd.name;
     }
 }
 
@@ -5698,16 +5701,16 @@ class ContextMenu$2 {
         let data;
         let treeFolder = false;
         let target = args.event.target;
-        this.menuTarget = target;
+        this.menuTarget = this.targetNodeElement = target;
         this.currentElement = args.element;
         if (target.classList.contains('e-spinner-pane')) {
             target = this.parent.navigationpaneModule.activeNode.getElementsByClassName(FULLROW)[0];
-            this.menuTarget = target;
+            this.menuTarget = this.targetNodeElement = target;
         }
         if (target.classList.contains(FULLROW)) {
             this.parent.selectedItems.length = 0;
         }
-        this.targetElement = this.parent.view === 'Details' ? closest(target, 'tr') : target;
+        this.targetElement = this.parent.view === 'Details' ? closest(target, 'tr.e-row') : target;
         const view = this.getTargetView(target);
         this.updateActiveModule();
         /* istanbul ignore next */
@@ -5739,7 +5742,7 @@ class ContextMenu$2 {
                 data = this.parent.visitedData;
                 selected = true;
             }
-            else if (!isNullOrUndefined(closest(target, 'tr'))) {
+            else if (!isNullOrUndefined(closest(target, 'tr.e-row'))) {
                 uid = this.targetElement.getAttribute('data-uid');
                 // eslint-disable-next-line
                 data = this.parent.detailsviewModule.gridObj.getRowObjectFromUID(uid).data;
@@ -5816,7 +5819,7 @@ class ContextMenu$2 {
             this.enableItems(this.disabledItems, false, true);
             args.cancel = menuOpenArgs.cancel;
             if (menuOpenArgs.cancel) {
-                this.menuTarget = this.currentElement = null;
+                this.menuTarget = this.targetNodeElement = this.currentElement = null;
             }
         });
     }
@@ -5935,7 +5938,12 @@ class ContextMenu$2 {
         }
         else {
             this.parent.notify(selectedData, {});
-            details = this.parent.itemData;
+            if (this.parent.activeModule === 'navigationpane' && itemText === 'open') {
+                details = [this.menuItemData];
+            }
+            else {
+                details = this.parent.itemData;
+            }
         }
         const eventArgs = {
             cancel: false,
@@ -6012,6 +6020,9 @@ class ContextMenu$2 {
                         if (this.parent.visitedItem) {
                             this.parent.notify(openInit, { target: this.parent.visitedItem });
                         }
+                        else if (this.parent.activeModule === 'navigationpane') {
+                            this.parent.navigationpaneModule.openFileOnContextMenuClick(closest(this.targetNodeElement, 'li'));
+                        }
                         break;
                     case 'details':
                         this.parent.notify(detailsInit, {});
@@ -6310,7 +6321,7 @@ const defaultLocale = {
     'Filter-Empty': 'No results found',
     'Filter-Key': 'Try with different filter',
     'Sub-Folder-Error': 'The destination folder is the subfolder of the source folder.',
-    "Same-Folder-Error": "The destination folder is the same as the source folder.",
+    'Same-Folder-Error': 'The destination folder is the same as the source folder.',
     'Access-Denied': 'Access Denied',
     'Access-Details': 'You don"t have permission to access this folder.',
     'Header-Retry': 'File Already Exists',
@@ -6410,6 +6421,9 @@ let FileManager = FileManager_1 = class FileManager extends Component {
      * @returns {void}
      */
     preRender() {
+        if (isNullOrUndefined(this.element.id) || this.element.id === '') {
+            this.element.setAttribute('id', getUniqueID('filemanager'));
+        }
         this.ensurePath();
         this.feParent = [];
         this.feFiles = [];
@@ -8045,6 +8059,12 @@ class NavigationPane {
         this.isRenameParent = false;
         this.isRightClick = false;
         this.renameParent = null;
+        // Specifies the previously selected nodes in the treeview control.
+        this.previousSelected = null;
+        // Specifies whether the nodeClicked event of the treeview control is triggered or not.
+        this.isNodeClickCalled = false;
+        // Specifies whether to restrict node selection in the treeview control.
+        this.restrictSelecting = false;
         this.parent = parent;
         this.addEventListener();
         this.keyConfigs = {
@@ -8084,6 +8104,7 @@ class NavigationPane {
                 hasChildren: 'hasChild', iconCss: '_fm_icon', htmlAttributes: '_fm_htmlAttr', tooltip: 'name'
             },
             enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
+            nodeSelecting: this.onNodeSelecting.bind(this),
             nodeSelected: this.onNodeSelected.bind(this),
             nodeExpanding: this.onNodeExpand.bind(this),
             nodeClicked: this.onNodeClicked.bind(this),
@@ -8188,6 +8209,44 @@ class NavigationPane {
             this.treeObj.addNodes(directories, target, null, prevent);
         }
     }
+    // Node Selecting event handler
+    onNodeSelecting(args) {
+        if (!args.isInteracted && !this.isRightClick && !this.isPathDragged && !this.isRenameParent || this.restrictSelecting) {
+            this.restrictSelecting = false;
+            return;
+        }
+        if (!this.renameParent) {
+            this.parent.activeModule = 'navigationpane';
+            // eslint-disable-next-line
+            const nodeData = this.getTreeData(getValue('id', args.nodeData));
+            const eventArgs = { cancel: false, fileDetails: nodeData[0], module: 'NavigationPane' };
+            delete eventArgs.cancel;
+            this.parent.trigger('fileOpen', eventArgs);
+            args.cancel = eventArgs.cancel;
+            if (args.cancel) {
+                this.restrictSelecting = true;
+                this.treeObj.selectedNodes = this.isNodeClickCalled ? this.previousSelected : this.treeObj.selectedNodes;
+                this.isNodeClickCalled = false;
+                if (!isNullOrUndefined(this.parent) && !isNullOrUndefined(this.parent.contextmenuModule)) {
+                    this.parent.contextmenuModule.contextMenu.enableItems(['Open'], true);
+                }
+            }
+        }
+    }
+    // Opens the folder while clicking open context menu item in the treeview.
+    openFileOnContextMenuClick(node) {
+        const data = this.treeObj.getTreeData(node);
+        // eslint-disable-next-line
+        this.parent.selectedItems = [];
+        this.parent.itemData = data;
+        this.activeNode = node;
+        this.parent.activeModule = 'navigationpane';
+        updatePath(node, this.parent.itemData[0], this.parent);
+        read(this.parent, this.isPathDragged ? pasteEnd : pathChanged, this.parent.path);
+        this.parent.visitedItem = node;
+        this.isPathDragged = this.isRenameParent = this.isRightClick = false;
+        this.treeObj.selectedNodes = [node.getAttribute('data-uid')];
+    }
     onNodeSelected(args) {
         if (this.parent.breadcrumbbarModule && this.parent.breadcrumbbarModule.searchObj && !this.renameParent) {
             this.parent.breadcrumbbarModule.searchObj.element.value = '';
@@ -8201,11 +8260,6 @@ class NavigationPane {
         this.parent.activeModule = 'navigationpane';
         // eslint-disable-next-line
         const nodeData = this.getTreeData(getValue('id', args.nodeData));
-        if (!this.renameParent) {
-            const eventArgs = { cancel: false, fileDetails: nodeData[0], module: 'NavigationPane' };
-            delete eventArgs.cancel;
-            this.parent.trigger('fileOpen', eventArgs);
-        }
         this.parent.selectedItems = [];
         this.parent.itemData = nodeData;
         updatePath(args.node, this.parent.itemData[0], this.parent);
@@ -8250,6 +8304,8 @@ class NavigationPane {
         this.activeNode = args.node;
         if ((args.event.which === 3) && (args.node.getAttribute('data-uid') !== this.treeObj.selectedNodes[0])) {
             this.isRightClick = true;
+            this.isNodeClickCalled = true;
+            this.previousSelected = this.treeObj.selectedNodes;
             this.treeObj.selectedNodes = [args.node.getAttribute('data-uid')];
         }
         else if (args.node.getAttribute('data-uid') === this.treeObj.selectedNodes[0] && this.parent.selectedItems.length !== 0) {
@@ -9686,7 +9742,7 @@ class DetailsView {
         // eslint-disable-next-line
         this.parent.dragData = this.gridObj.getSelectedRecords();
         let dragRow;
-        if (this.parent.dragData.length == 0 && dragLi) {
+        if (this.parent.dragData.length === 0 && dragLi) {
             dragRow = this.gridObj.getRowInfo(dragLi);
         }
         if (dragRow) {