NewYour coding agent can read the release notes before it upgrades.Set up the MCP server →
npm · #4151 most downloaded on npm
HTML5 backend for React DnD
Last release 4 years ago
no release in 18 months
Release timing varies
gaps range from 2 weeks to 9 months
Most releases are documented
notes for 47 of the last 60 stable releases
3 versions withdrawn
withdrawn after publishing
11 years old
79 releases · first in 2015
New Feature: Passing Derivative Props to DragLayer to minimize render cycles (#979).
One column per quarter.
Fixes an issue in the DragDropContextProvider where the backend was created on every render (#859) - thanks @WearyMonkey
refs with StatelessFunctionalComponents (#898) - thanks @knowbodyThis doesn't affect the packages, but the documentation was using some deprecated react/lib modules, and the react-hot-loader needed to be updated.
react/lib modules, and the react-hot-loader needed to be updated.Add React@16 to peer-dependencies to react-dnd
react-dnd peer-dependency from HTML5BackendCorrect SSR bug due to addEventListener and removeEventListener methods not being available in server-mode
addEventListener and removeEventListener methods not being available in server-mode (#813)babel-preset-env instead of babel-preset-latestNothing published for this version
Migrated deprecated React.PropTypes in example + same for React.createClass in docs (#729) (abbe4c7), closes #729
Nothing published for this version
Includes a fix for server-side rendering with the DragDropContextProvider #672, (thanks @liors)
Starting with this release, the packages will all be released simultaneously using the same version numbers.
Starting with this release, the packages will all be released simultaneously using the same version numbers.
Nothing published for this version
Add DragContextProvider class, use updated dnd-core with support for injectable global context.
DragContextProvider class, use updated dnd-core with support for injectable global context.Removes accidental console.log() in UMD builds
console.log() in UMD builds (#385)Attempts to fix a memory leak when rendering on the server (#379, #337)
Updates to Lodash 4 (#363, fecd21fcaab2f1482d4079aed335f4482cbf9d56)
latest branch. If you use Bower, point your config to npmcdn. For example: https://npmcdn.com/react-dnd@latest/dist/ReactDnD.min.jsFixes #261 hopefully for good—the change in 2.0.1 wasn't covering all cases
Don't throw on undefined options when nodes are equal. Fixes #261
This release removes the warnings for React 0.14, but it now requires 0.14 too.
This release removes the warnings for React 0.14, but it now requires 0.14 too.
The UMD build is no longer available in dist folder in master branch. Instead, it is available in dist folder on the latest branch and any future tagged release branch.
We are using this opportunity to separate the backends out of React DnD repo and package.
You will need to install react-dnd-html5-backend in addition to react-dnd. You may also install react-dnd-test-backend.
Similarly, in UMD builds, ReactDnD no longer includes ReactDnD.HTML5. You need to use ReactDnDHTML5Backend provided separately in the dist folder of the latest or any tagged release branch in the react-dnd-html5-backend repo.
I no longer intend to support Bower. Please stop using Bower. NPM 3 works very well for front-end development, and you should use it instead.
Because the UMD builds are available on latest and tagged release branches of both React DnD and its HTML5 backend in the dist folder, you can point your configs to them instead.
connect*() methods no longer accept composite component elementsThis worked and still works:
return connectDragSource(<div><Something /></div>);
return connectDragPreview(<div><Something /></div>);
return connectDropTarget(<div><Something /></div>);
However, this worked in 1.x, but will throw in 2.x:
return connectDragSource(<Something />);
return connectDragPreview(<Something />);
return connectDropTarget(<Something />);
This change was made to avoid dependency on react-dom for React DnD, which is a good thing for React libraries. It also enforces stronger encapsulation because the connect*() is now always located in the view that actually creates the related React DOM element. Relevant commit: https://github.com/gaearon/react-dnd/commit/96d4c309089274839503ff95e4f8bfc979c364b7.
The solution is to make sure that, when you pass a React element to connectDragSource, connectDragPreview, or connectDropTarget, it is always a React DOM element, and not an element for a custom component.
You have three ways of ensuring this, in the order of preference:
connect*() calls to wrap custom components in <div>sreturn connectDragSource(
<Something />
);
return connectDragSource(
<div>
<Something />
</div>
);
return connectDragSource(
<Something />
);
return <Something />; // assuming Something is a DragSource now
findDOMNode() yourself and put connect*() methods directly on the refThis is especially useful if you used connect*() methods inside higher order components:
return connectDragSource(
<Something />
);
return <Something ref={instance => connectDragSource(findDOMNode(instance))} />;
There are many, many breaking changes in 1.0, compared to 0.9. One can say it's a whole new library.
There are many, many breaking changes in 1.0, compared to 0.9. One can say it's a whole new library.
It fixes the many flaws of 0.x. It works out of the box with non-createClass components, it is much more performant, extensible, testable and friendly to edge cases.
Check out the new website: http://gaearon.github.io/react-dnd/
It has docs: http://gaearon.github.io/react-dnd/docs-overview.html
It has a brand new tutorial: http://gaearon.github.io/react-dnd/docs-tutorial.html
It has a great new example: http://gaearon.github.io/react-dnd/examples-chessboard-tutorial-app.html
I've been working on this release for two months. It would not have happened without the generous donations from Macropod and Webflow.
The personal thanks go out to Nathan who inspired me to get this library to 1.0 with his enthusiasm.
Cheers to everyone involved, Dan
Your coding agent can read these notes before it upgrades. Set up the MCP server →