{
  "$schema": "https://ai.syncfusion.com/schema/registry-item.json",
  "name": "file-manager-drag-and-drop",
  "framework": "blazor",
  "type": "registry:component",
  "component": "FileManager",
  "variant": "drag-and-drop",
  "dependencies": [
    "Syncfusion.Blazor.FileManager"
  ],
  "description": "File Manager enables drag-and-drop operations against Azure file-management endpoints with toolbar and context-menu actions.",
  "meta": {
    "essentialStudioRelease": "2026 Volume 2 (v34.1.29)",
    "license": "commercial-or-community",
    "licenseNote": "The Syncfusion package is licensed. The composition in this file is source you own and edit. See https://ai.syncfusion.com/licensing.md",
    "requiresLicenseKey": true,
    "requiresServerEndpoint": true,
    "platformIndex": "https://ai.syncfusion.com/blazor/llms.txt",
    "skillPack": "syncfusion/blazor-ui-components-skills",
    "docs": "https://ai.syncfusion.com/gallery/blazor/file-manager-drag-and-drop.md"
  },
  "files": [
    {
      "target": "src/components/file-manager-drag-and-drop/FileManager.razor",
      "content": "@page \"/file-manager/drag-and-drop\"\n@using Syncfusion.Blazor.FileManager;\n\n<div class=\"control-section\" aria-label=\"File Manager with Drag and Drop\">\n    @* Initialization of File Manager component with drag and drop functionality *@\n    <SfFileManager AllowDragAndDrop=\"true\" TValue=\"FileManagerDirectoryContent\" ShowFileExtension=\"false\">\n        <FileManagerAjaxSettings Url=\"https://azure-service.syncfusion.com/api/AzureFileManager/AzureFileoperations\"\n                                 UploadUrl=\"https://azure-service.syncfusion.com/api/AzureFileManager/AzureUpload\"\n                                 DownloadUrl=\"https://azure-service.syncfusion.com/api/AzureFileManager/AzureDownload\"\n                                 GetImageUrl=\"https://azure-service.syncfusion.com/api/AzureFileManager/AzureGetImage\">\n        </FileManagerAjaxSettings>\n        <FileManagerToolbarSettings ToolbarItems=\"@Items\"></FileManagerToolbarSettings>\n        <FileManagerContextMenuSettings File=\"@FileItems\" Layout=\"@LayoutItems\" Visible=\"true\"></FileManagerContextMenuSettings>\n    </SfFileManager>\n</div>\n@code {\n    public List<ToolBarItemModel> Items = new List<ToolBarItemModel>()\n    {\n        new ToolBarItemModel() { Name = \"NewFolder\" },\n        new ToolBarItemModel() { Name = \"Cut\" },\n        new ToolBarItemModel() { Name = \"Copy\" },\n        new ToolBarItemModel() { Name = \"Paste\" },\n        new ToolBarItemModel() { Name = \"Delete\" },\n        new ToolBarItemModel() { Name = \"Download\" },\n        new ToolBarItemModel() { Name = \"Rename\" },\n        new ToolBarItemModel() { Name = \"SortBy\" },\n        new ToolBarItemModel() { Name = \"Refresh\" },\n        new ToolBarItemModel() { Name = \"Selection\" },\n        new ToolBarItemModel() { Name = \"View\" },\n        new ToolBarItemModel() { Name = \"Details\" },\n    };\n    public string[] LayoutItems = new string[] { \"SortBy\", \"View\", \"Refresh\", \"|\", \"Paste\", \"|\", \"NewFolder\", \"|\", \"Details\", \"|\", \"SelectAll\" };\n    public string[] FileItems = new string[] { \"Cut\", \"Copy\", \"|\", \"Delete\", \"Download\", \"Rename\", \"|\", \"Details\" };\n}\n<style>\n    .bootstrap5 .e-filemanager .e-large-icons .e-list-img, .bootstrap5-dark .e-filemanager .e-large-icons .e-list-img,\n    .bootstrap4 .e-filemanager .e-large-icons .e-list-img {\n        border: none !important;\n    }\n</style>"
    }
  ]
}