A powerful, performant drag-and-drop (DnD) library for React Native, this project addresses the common challenge of implementing smooth and reliable DnD interactions. It offers a comprehensive ecosystem for modern React Native developers, providing a best-in-class developer experience and production-ready performance for complex UI manipulations, suitable for applications demanding sophisticated list and grid reordering.

How It Works

The library is built upon React Native Reanimated 4 and Worklets, enabling buttery-smooth 60fps animations. It integrates seamlessly with React Native Gesture Handler for robust gesture recognition. This architecture is specifically designed for React Native's New Architecture, ensuring compatibility and high performance on modern React Native projects.

Quick Start & Requirements

• Installation: npm install react-native-reanimated-dnd
• Peer Dependencies: react-native-reanimated, react-native-gesture-handler, react-native-worklets.
• Requirements: React Native 0.80+, Expo SDK 55+, New Architecture enabled. Your Babel configuration must include "react-native-worklets/plugin" as the last plugin. All data items require a unique string id property.
• Links: Example App (./example-app/README.md), Documentation (reanimated-dnd-docs.vercel.app).

Highlighted Details

• High Performance: Achieves 60fps animations using Reanimated 4 and Worklets.
• New Architecture Ready: Compatible with Expo SDK 55+ and React Native 0.83+.
• Flexible API: Supports basic drag-and-drop, vertical/horizontal sortable lists, and 2D sortable grids with insert/swap modes.
• Smart Collision Detection: Offers multiple algorithms (center, intersect, contain) for precise drop zone interactions.
• TypeScript Ready: Provides full type safety for enhanced developer experience.
• Optional FlatList Rendering: Enables virtualization for handling large datasets efficiently.
• AI Integration Skill: Offers an agent skill to help AI coding assistants generate correct DnD implementations.

Maintenance & Community

The project roadmap indicates ongoing development, with planned features including programmatic list operations, nested sortable lists, and Kanban board support. Contributions are welcomed through bug reports, feature suggestions, pull requests, and documentation improvements. Community discussions are encouraged, though specific chat links (Discord/Slack) are not provided in the README.

Licensing & Compatibility

The library is released under the MIT license, permitting commercial use and integration into closed-source applications without significant restrictions.

Limitations & Caveats

Programmatic list operations (adding, updating, deleting, or reordering items externally) are listed as future features, suggesting current limitations in direct external state manipulation of sortable components. The requirement for React Native's New Architecture and specific Babel configuration may pose adoption challenges for older projects.