A zero-click, hover-activated clipboard shelf and native OS file-transfer hub for the desktop. Lives invisibly on the screen edge. Approach it, and it opens. Drag anything out — into Photoshop, Word, Slack, Explorer, anywhere.
Built with Electron · React · TypeScript · Framer Motion · Zustand License: Apache-2.0 · Status: Public Beta
Every clipboard manager on the market breaks your flow. You copy something, switch apps, paste, then hunt through Win+V history with arrow keys or dig into a tray menu. Multi-step. Modal. Slow.
Edge-Drop removes the friction. It anchors to the screen edge of your monitor as a transparent, always-on-top, click-through surface. When your cursor approaches the edge, the shelf springs open. Drag images, file stacks, rich text, and HTML bundles out of it — directly into whatever desktop app you're already using. No shortcuts. No window switching. No modal dialogs.
It is built for the developer and creative workflow where you constantly juggle screenshots, code snippets, file paths, design assets, and reference links between many windows at once.
All demos are silent autoplay loops. Hover to scrub, right-click → open in new tab for full size.
placeholder_welcome.mp4 2. Collect Anything placeholder_copy.1.mp4 3. Drag & Drop Anywhere placeholder_drag.mp4 4. Explore File Stacks placeholder_stacks.mp4 5. Ungroup & Split Stacks placeholder_ungroup.mp4 6. Combine & Merge Items placeholder_merge.mp4 7. Preview Flyout Preview_Flyout.mp4 Quick Start Prerequisites Node.js v18 or higher OS : Windows 10/11 (uses Win32 OLE drag pipelines and transparent-window cursor polling) Run from source git clone https://github.com/Deepender25/Edge-Drop.git cd Edge-Drop npm install npm run dev # launches Electron + Vite HMR Type-check npm run typecheck # runs tsc --noEmit against both node and web configs Build Windows installers npm run build:github # outputs an NSIS .exe for GitHub releases npm run build:store # outputs an MSIX .appx for Microsoft Store submission Note
On Windows, if packaging fails with EBUSY: resource busy or locked , close any running Edge-Drop instances first: taskkill /F /IM electron.exe /T .
Process Isolation & IPC Contract Edge-Drop is organized into three strictly isolated layers:
ClipboardWatcher.ts : Polls system clipboard every 600ms. Computes cheap FNV-1a hashes over BGRA bitmap bytes for zero-overhead image deduplication. ItemStore.ts : Atomic JSON persistence with safeStorage DPAPI encryption, automatic duplicate bumping, and stack merging/splitting. soundEffects.ts : Synthesized Web Audio API sound suite (dial ticks, button clicks, toggle pops, delete thuds) with global toggle controls. updater.ts : Singleton autoUpdater module handling background downloading and single-click restart installation for GitHub builds, gated behind !isStoreBuild() . drag.ts : Server-side SVG → PNG icon rendering via @resvg/resvg-js for stacked drag ghosts. Security Edge-Drop touches the OS clipboard, the filesystem, and the Win32 OLE drag pipeline — so the security posture is intentional, not optional.
Layer Choice Why Desktop runtime Electron 34+ Only way to access Win32 OLE drag pipelines and native clipboard formats from JS Build tooling electron-vite Separate Main / Preload / Renderer builds with Vite HMR UI React 18 + TypeScript Strongly typed component hierarchy Audio Web Audio API Synthesized haptic audio feedback (ticks, clicks, pops, thuds) with 0 audio asset overhead Animation Framer Motion Adaptive spring physics ( useAdaptiveSpring ), layout transitions, gesture animations State Zustand Selector-optimized, zero cascading re-renders during drags Drag icons @resvg/resvg-js Server-side SVG → PNG rendering for custom drag ghosts Auto-Updates electron-updater Background downloading and single-click installation for GitHub builds Project Structure Edge-Drop/ ├─ shared/ Typed IPC contracts & domain models │ ├─ types.ts ClipboardItem, Bundle, Settings, DragRequest DTOs │ ├─ bridge.ts EdgeApi preload interface │ └─ ipc.ts InvokeMap / EventMap / SendMap channel definitions ├─ electron/ Node.js backend & OS integrations │ ├─ main/ │ │ ├─ index.ts Single-instance lock, IPC registration, startup │ │ ├─ window.ts Frameless window, setIgnoreMouseEvents, cursor poll │ │ ├─ updater.ts Background auto-update engine (electron-updater) │ │ ├─ tray.ts System tray icon & context menus │ │ ├─ fullscreen.ts Windows SHQueryUserNotificationState game detection │ │ └─ drag.ts OLE startDrag, temp-file staging, icon generation │ ├─ preload/ Sandbox bridge exposing window.edge │ ├─ clipboard/ │ │ ├─ ClipboardWatcher.ts 600ms poll loop, transient-copy rejection │ │ └─ formats.ts FNV-1a signatures, Win32 HDROP, privacy-flag detection │ └─ store/ │ ├─ ItemStore.ts Atomic JSON persistence, DPAPI encryption, dedup │ ├─ settings.ts User config & startup registration │ └─ paths.ts AppData + temp directory resolution ├─ src/ React renderer │ ├─ components/ Panel, ItemList, ClipboardItem, SearchBar, Settings, ChangelogView, Icons │ ├─ hooks/ useEdgeHover (hysteresis), useDragOut, useFilteredItems │ ├─ lib/ soundEffects (Web Audio API), theme tokens, format helpers │ ├─ store/ Zustand appStore │ └─ styles/ tokens.css, panel.css, settings.css, item.css, global.css Roadmap Edge-Drop is in public beta . The following are planned, in rough priority order:
Edge-Drop is Apache-2.0 licensed and open to contributions. As a solo-maintained project in active beta, the best ways to help right now are:
npm install npm run dev # Electron + Vite HMR npm run typecheck # tsc --noEmit (node + web configs) npm run build:github # build Windows NSIS installer for GitHub npm run build:store # build Windows AppX package for Microsoft Store License Apache License 2.0 — see LICENSE . Commercial and non-commercial use, modification, and distribution all permitted with attribution.
Hacker News
news.ycombinator.com