📝 Native drag & drop documentation

docs/tutorial/native-file-drag-drop.md

@@ -0,0 +1,37 @@
+# Native File Drag & Drop
+
+Certain kinds of applications that manipulate files might want to support
+the operating system's native file drag & drop feature. Dragging files into
+web content is common and supported by many websites. Electron additionally
+supports dragging files and content out from web content into the operating
+system's world.
+
+To implement this feature in your app, you need to call `webContents.startDrag(item)`
+API in response to the `ondragstart` event.
+
+In your renderer process, handle the `ondragstart` event and forward the
+information to your main process.
+
+```html
+<a href="#" id="drag">item</a>
+<script type="text/javascript" charset="utf-8">
+  document.getElementById('drag').ondragstart = (event) => {
+    event.preventDefault()
+    ipcRenderer.send('ondragstart', '/path/to/item')
+  }
+</script>
+```
+
+Then, in the main process, augment the event with a path to the file that is
+being dragged and an icon.
+
+```javascript
+const { ipcMain } = require('electron')
+
+ipcMain.on('ondragstart', (event, filePath) => {
+  event.sender.startDrag({
+    file: filePath,
+    icon: '/path/to/icon.png'
+  })
+})
+```