gaearonreact-dnd

0

View on GitHub

21,642 stars1,999 forksTypeScriptMIT2 viewsreact-dnd.github.io/react-dnd

React Dnd

React-dnd is a drag and drop framework and library for React applications. It provides a system of higher-order components and hooks to implement draggable interface elements and drop targets using a declarative API.

The framework separates the logic of moving items from the visual presentation of the user interface. This allows for the development of interactive interfaces, such as visual list reordering and custom dashboard layouts where widgets or panels can be reorganized.

Features

Drag and Drop Libraries - Provides a comprehensive library for implementing draggable items and drop targets.
React Components - Offers a set of higher-order components and hooks designed specifically for the React ecosystem.
Interactive UI Components - Facilitates the development of interactive user interfaces where elements can be moved and rearranged.
Declarative Drag-and-Drop Libraries - Uses a declarative API to define draggable interface elements and drop targets in React.
Backend Adapters - Provides a standard interface to connect core logic to specific browser DOM event implementations.

Star history

Context-Based Dependency Injection - Uses React Context to share the drag and drop backend and state manager across the component tree.

Dashboard Layout Engines - Enables the creation of flexible dashboard interfaces where widgets and panels can be reorganized by dragging.

Drag State Monitors - Uses a central monitor to track the current dragged item and trigger updates across registered components.

Event-Driven Interaction Handlers - Communicates state changes between draggables and targets through a system of events and callbacks.

Higher-Order Components - Wraps components to inject shared drag and drop state and event handlers via higher-order components.

List Reordering Components - Implements the ability to visually rearrange items within lists or grids via drag and drop.

Rendering Backends - Implements an abstraction layer that decouples drag and drop logic from specific platform rendering APIs.

Drag and Drop - Drag-and-drop framework for React.