dnd kit

Use hooks to turn your components into draggable elements and droppable areas with just a few lines of code. Control every aspect of how your draggable and droppable components should behave. Exposes hooks such as use draggable and undroppable, and won't require you to re-architect your app or create additional wrapper DOM nodes. Customizable collision detection algorithms, multiple activators, draggable overlay, drag handles, auto-scrolling, constraints, and so much more. Lists, Grids, multiple containers, nested contexts, variable-sized items, virtualized lists, 2D Games, and more. The core of the library weighs around 10kb minified and has no external dependencies. It's built around built-in React state management and context, which keeps the library lean. Customize every detail: animations, transitions, behaviours, styles. Build your own sensors, collision detection algorithms, customize key bindings and so much more.