The File Manager control, with a details view and preview pane, is designed to resemble a OneDrive user interface, featuring customized icons in the details view. The preview pane displays the details of the currently selected files or folders on the right side inside the Sidebar control. This preview pane can be toggled using the preview pane option available in the File Manager control toolbar items on the right side. On the left side of the File Manager control, available items can be used to navigate to the corresponding path achieved using the File Manager path property. Additionally, you can perform favorites
, delete
, and rename
functionalities using icon items by hovering over the corresponding folder or file items in the FileManager details view.
The TypeScript File Manager control has been enhanced with custom icons to improve user interaction: Delete: This icon appears when hovering over items in the details view, allowing users to remove files or folders from the File Manager control. This is achieved using the File Manager control's deleteFiles method. Download: This icon is shown when hovering over items in the details view, enabling users to download files or folders from the File Manager control. This is achieved using the File Manager control's downloadFiles method. Favorite: This icon appears when hovering over items, allowing users to add files or folders to a "favorite" directory. You can view the favorite items by clicking on the "Favorite" option on the left side. Rename: This icon appears when hovering over the file or folder name in the preview pane, allowing users to edit names in the File Manager control. This is achieved using the File Manager control's renameFile method. Preview pane: This icon allows users to select items and click the preview icon to display detailed information about the selected items in a preview pane.