This library continues to be relied upon heavily by Atlassian products, but we are focused on other priorities right now and have no current plans for further feature development or improvements.
It will continue to be here on GitHub and we will still make critical updates (e.g. security fixes, if any) as required, but will not be actively monitoring or replying to issues and pull requests.
We recommend that you don’t raise issues or pull requests, as they will not be reviewed or actioned until further notice.
react-beautiful-dnd (rbd)
Beautiful and accessible drag and drop for lists with [React](https://facebook.github.io/react/)
- No creation of additional wrapper dom nodes - flexbox and focus management friendly!
Get started 👩🏫
We have created [a free course on egghead.io 🥚](https://egghead.io/courses/beautiful-and-accessible-drag-and-drop-with-react-beautiful-dnd) to help you get started with react-beautiful-dnd as quickly as possible.
- Incredible screen reader support ♿️ - we provide an amazing experience for english screen readers out of the box 📦. We also provide complete customisation control and internationalisation support for those who need it 💖
- 🌲 Tree support through the [@atlaskit/tree](https://atlaskit.atlassian.com/packages/confluence/tree) package
- A `` list can be a scroll container (without a scrollable parent) or be the child of a scroll container (that also does not have a scrollable parent)
- Independent nested lists - a list can be a child of another list, but you cannot drag items from the parent list into a child list
react-beautiful-dnd exists to create beautiful drag and drop for lists that anyone can use - even people who cannot see. For a good overview of the history and motivations of the project you can take a look at these external resources:
There are a lot of libraries out there that allow for drag and drop interactions within React. Most notable of these is the amazing [react-dnd](https://github.com/react-dnd/react-dnd). It does an incredible job at providing a great set of drag and drop primitives which work especially well with the wildly inconsistent html5 drag and drop feature.react-beautiful-dnd is a higher level abstraction specifically built for lists (vertical, horizontal, movement between lists, nested lists and so on). Within that subset of functionality react-beautiful-dnd offers a powerful, natural and beautiful drag and drop experience. However, it does not provide the breadth of functionality offered by react-dnd. So react-beautiful-dnd might not be for you depending on what your use case is.
- [``](/docs/api/drag-drop-context.md) - _Wraps the part of your application you want to have drag and drop enabled for_- [``](/docs/api/droppable.md) - _An area that can be dropped into. Contains ``s_- [``](/docs/api/draggable.md) - _What can be dragged around_
- [resetServerContext()](/docs/api/reset-server-context.md) - _Utility for server side rendering (SSR)_
探客时代
