react-dnd-multi-backend - npm Package Compare versions

Comparing version 3.2.2 to 4.0.0-0

lib/HTML5toTouch.js

@@ -8,5 +8,5 @@ "use strict";
 
-var _reactDndHtml5Backend = _interopRequireDefault(require("react-dnd-html5-backend"));
+var _reactDndHtml5BackendCjs = _interopRequireDefault(require("react-dnd-html5-backend-cjs"));
 
-var _reactDndTouchBackend = _interopRequireDefault(require("react-dnd-touch-backend"));
+var _reactDndTouchBackendCjs = _interopRequireDefault(require("react-dnd-touch-backend-cjs"));
 
@@ -19,8 +19,9 @@ var _dndMultiBackend = require("dnd-multi-backend");
   backends: [{
-    backend: _reactDndHtml5Backend.default,
+    backend: _reactDndHtml5BackendCjs.default,
     transition: _dndMultiBackend.MouseTransition
   }, {
-    backend: (0, _reactDndTouchBackend.default)({
+    backend: _reactDndTouchBackendCjs.default,
+    options: {
       enableMouseEvents: true
-    }),
+    },
     preview: true,
@@ -27,0 +28,0 @@ transition: _dndMultiBackend.TouchTransition

lib/index.js

@@ -44,5 +44,7 @@ "use strict";
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 var _default = _dndMultiBackend.default;
 exports.default = _default;

lib/Preview.js

@@ -18,4 +18,6 @@ "use strict";
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
@@ -22,0 +24,0 @@

package.json

 {
   "name": "react-dnd-multi-backend",
-  "version": "3.2.2",
+  "version": "4.0.0-0",
   "description": "Multi Backend system compatible with React DnD",
@@ -20,18 +20,18 @@ "author": "Louis Brunner <[e-mail]> (https://github.com/LouisBrunner)",
   "dependencies": {
-    "dnd-multi-backend": "^3.2.1",
+    "dnd-multi-backend": "^4.0.0-0",
     "prop-types": "^15.6.2",
-    "react-dnd-preview": "^3.2.2"
+    "react-dnd-preview": "^4.0.0-0"
   },
   "peerDependencies": {
-    "react": "*",
-    "react-dnd": "< 9.0.0",
-    "react-dnd-html5-backend": "< 9.0.0",
-    "react-dnd-touch-backend": "< 9.0.0",
-    "react-dom": "*"
+    "react": ">= 16.8",
+    "react-dnd-cjs": ">= 9.3.9",
+    "react-dnd-html5-backend-cjs": ">= 9.3.9",
+    "react-dnd-touch-backend-cjs": ">= 9.3.9",
+    "react-dom": ">= 16.8"
   },
   "devDependencies": {
     "object-assign": "^4.1.1",
-    "react-dnd-html5-backend": "< 9.0.0",
-    "react-dnd-touch-backend": "< 9.0.0"
+    "react-dnd-html5-backend-cjs": ">= 9.3.9",
+    "react-dnd-touch-backend-cjs": ">= 9.3.9"
   }
 }

README.md

@@ -19,3 +19,3 @@ # React DnD Multi Backend [![NPM Version][npm-image]][npm-url] [![dependencies Status][deps-image]][deps-url] [![devDependencies Status][deps-dev-image]][deps-dev-url]
 
-### Node Installation
+### NPM Installation
 
@@ -41,4 +41,2 @@ ```sh
 
-Every code snippet will be presented in 3 different styles: Node.js `require`, Node.js `import` and Browser Javascript (with required HTML `<script>`s).
-
 ### Backend
@@ -51,28 +49,16 @@
 
- - *require*:
 ```js
-  var ReactDnD = require('react-dnd');
-  var MultiBackend = require('react-dnd-multi-backend').default;
-  var HTML5toTouch = require('react-dnd-multi-backend/lib/HTML5toTouch').default; // or any other pipeline
-  ...
-  module.exports = ReactDnD.DragDropContext(MultiBackend(HTML5toTouch))(App);
+import { DndProvider } from 'react-dnd';
+import MultiBackend from 'react-dnd-multi-backend';
+import HTML5toTouch from 'react-dnd-multi-backend/lib/HTML5toTouch'; // or any other pipeline
+...
+function App() {
+  return (
+    <DndProvider backend={MultiBackend} options={HTML5toTouch}>
+      <Example />
+    </DndProvider>
+  );
+}
 ```
 
- - *import*:
-```js
-  import { DragDropContext } from 'react-dnd';
-  import MultiBackend from 'react-dnd-multi-backend';
-  import HTML5toTouch from 'react-dnd-multi-backend/lib/HTML5toTouch'; // or any other pipeline
-  ...
-  export default DragDropContext(MultiBackend(HTML5toTouch))(App);
-```
-
- - *browser*:
-```js
-  <script src="ReactDnDMultiBackend.min.js"></script>
-  <script src="RDMBHTML5toTouch.min.js"></script> <!-- or any other pipeline -->
-  ...
-  var AppDnD = ReactDnD.DragDropContext(ReactDnDMultiBackend.default(RDMBHTML5toTouch.default))(App); // `.default` is only used to get the ES6 module default export
-```
-
 ### Create a custom pipeline
@@ -108,3 +94,9 @@
 ...
-export default DragDropContext(MultiBackend(HTML5toTouch))(App);
+function App() {
+  return (
+    <DndProvider backend={MultiBackend} options={HTML5toTouch}>
+      <Example />
+    </DndProvider>
+  );
+}
 ```
@@ -141,3 +133,5 @@
     {
-      backend: TouchBackend({enableMouseEvents: true}), // Note that you can call your backends with options
+      backend: TouchBackend,
+      // Note that you can call your backends with options
+      options: {enableMouseEvents: true},
       preview: true,
@@ -161,11 +155,3 @@ transition: TouchTransition,
 
- - *require*:
 ```js
-  var MultiBackend = require('react-dnd-multi-backend').default;
-  ...
-  <MultiBackend.Preview generator={this.generatePreview} />
-```
-
- - *import*:
-```js
   import MultiBackend, { Preview } from 'react-dnd-multi-backend';
@@ -176,9 +162,2 @@ ...
 
- - *browser*:
-```js
-  <script src="ReactDnDMultiBackend.min.js"></script>
-  ...
-  <ReactDnDMultiBackend.Preview generator={this.generatePreview} />
-```
-
 You must pass a function as the `generator` prop which takes 3 arguments:
@@ -195,3 +174,3 @@
 
-You can see an example [here](examples/) (Node.js style with `import`s).
+You can see an example [here](examples/).
 
@@ -218,6 +197,13 @@
 
+### Migrating from 3.x.x
 
+Starting with `4.0.0`, `react-dnd-multi-backend` will start using `react-dnd` (and the corresponding backends) `9.0.0` and later.
+
+This means you need to transition from `DragDropContext(MultiBackend(HTML5toTouch))(App)` to `<DndProvider backend={MultiBackend} options={HTML5toTouch}>`.
+Accordingly, the pipeline syntax changes and you should specify backend options as a separate property, e.g. `{backend: TouchBackend({enableMouseEvents: true})}` becomes `{backend: TouchBackend, options: {enableMouseEvents: true}}`.
+
+
 ## License
 
-MIT, Copyright (c) 2016-2018 Louis Brunner
+MIT, Copyright (c) 2016-2019 Louis Brunner
 
@@ -224,0 +210,0 @@

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

17719

increased by2.29%

Lines of code

129

increased by4.03%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

Number of lines in readme file

209

decreased by-6.28%

Dependency changes

• + Addeddnd-core-cjs@9.5.1(transitive)

• + Addeddnd-multi-backend@4.0.0(transitive)

• + Addedreact-dnd-cjs@9.5.1(transitive)

• + Addedreact-dnd-html5-backend-cjs@9.5.1(transitive)

• + Addedreact-dnd-preview@4.0.0(transitive)

• + Addedreact-dnd-touch-backend-cjs@9.5.1(transitive)

• - Removeddnd-core@7.7.08.0.3(transitive)

• - Removeddnd-multi-backend@3.2.1(transitive)

• - Removedreact-dnd@7.7.08.0.3(transitive)

• - Removedreact-dnd-html5-backend@8.0.3(transitive)

• - Removedreact-dnd-preview@3.2.2(transitive)

• - Removedreact-dnd-touch-backend@0.8.3(transitive)

• Updateddnd-multi-backend@^4.0.0-0

• Updatedreact-dnd-preview@^4.0.0-0