Pragmatic drag and drop is a low-level drag and drop toolchain that enables safe and successful usage of the browser's built-in drag and drop functionality.
The tool solves the complexity of implementing drag and drop interactions across different frameworks and platforms by providing a minimal core package with optional add-ons. Rather than imposing a specific visual language or framework dependency, it works as a headless solution that gives developers full control over rendering and styling. The approach is framework-agnostic, supporting React, Vue, Svelte, Angular, and others, while maintaining a tiny core footprint. It includes optional packages for visual outputs like drop indicators and assistive technology controls, allowing teams to build consistent experiences without being locked into a particular design system.
Pragmatic drag and drop suits teams building complex interactive applications where drag and drop is a core interaction pattern. It works well for projects that need to support multiple frameworks or that require custom visual treatments beyond standard patterns. The tool is particularly valuable for applications requiring accessibility features, as it provides optional assistive technology controls alongside pointer-based interactions. Developers should choose this if they want granular control over their drag and drop implementation rather than an opinionated, all-in-one solution, and if they need to optimize for performance through incremental loading and virtualization support.
The project maintains active development with regular updates to both core functionality and optional packages. The codebase shows consistent refinement of the drag and drop behavior and expansion of the optional visual and accessibility tooling. Documentation is comprehensive, including examples and video explanations of how the system works. The tool is battle-tested in production across major web applications, indicating stability and real-world reliability.
