vuedraggable - npm Package Compare versions

Comparing version 2.5.0-rc0 to 2.6.0-rc0

dist/vuedraggable.js

 'use strict';
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
-
 (function () {
@@ -34,6 +32,3 @@ "use strict";
     function _computeIndexes(slots, children) {
-      if (!slots) {
-        return [];
-      }
-      return Array.prototype.map.call(children, function (elt) {
+      return !slots ? [] : Array.prototype.map.call(children, function (elt) {
         return computeVmIndex(slots, elt);
@@ -43,12 +38,2 @@ });
 
-    function merge(target, source) {
-      var output = Object(target);
-      for (var nextKey in source) {
-        if (source.hasOwnProperty(nextKey)) {
-          output[nextKey] = source[nextKey];
-        }
-      }
-      return output;
-    }
-
     function emit(evtName, evtData) {
@@ -62,3 +47,5 @@ this.$emit(evtName.toLowerCase(), evtData);
       return function (evtData) {
-        _this['onDrag' + evtName](evtData);
+        if (_this.list !== null) {
+          _this['onDrag' + evtName](evtData);
+        }
         emit.call(_this, evtName, evtData);
@@ -69,4 +56,4 @@ };
     var eventsListened = ['Start', 'Add', 'Remove', 'Update', 'End'];
-    var eventsToEmit = ['Choose', 'Sort', 'Filter', 'Move', 'Clone'];
-    var readonlyProperties = eventsListened.concat(eventsToEmit).map(function (evt) {
+    var eventsToEmit = ['Choose', 'Sort', 'Filter', 'Clone'];
+    var readonlyProperties = ['Move'].concat(eventsListened, eventsToEmit).map(function (evt) {
       return 'on' + evt;
@@ -91,2 +78,6 @@ });
         default: 'div'
+      },
+      move: {
+        type: Function,
+        default: null
       }
@@ -124,3 +115,5 @@ };
 
-        var options = merge(this.options, optionsAdded);
+        var options = Object.assign({}, this.options, optionsAdded, { onMove: function onMove(evt) {
+            return _this2.onDragMove(evt);
+          } });
         this._sortable = new Sortable(this.rootContainer, options);
@@ -132,5 +125,2 @@ this.computeIndexes();
       },
-      updated: function updated() {
-        this.computeIndexes();
-      },
 
@@ -151,2 +141,5 @@
           }
+        },
+        list: function list() {
+          this.computeIndexes();
         }
@@ -167,17 +160,40 @@ },
         },
-        onDragStart: function onDragStart(evt) {
-          if (!this.list) {
-            return;
+        getUnderlyingVm: function getUnderlyingVm(htmlElt) {
+          var index = computeVmIndex(this.getChildrenNodes(), htmlElt);
+          var element = this.list[index];
+          return { index: index, element: element };
+        },
+        getUnderlyingPotencialDraggableComponent: function getUnderlyingPotencialDraggableComponent(_ref) {
+          var __vue__ = _ref.__vue__;
+
+          if (!__vue__ || !__vue__.$options || __vue__.$options._componentTag !== "transition-group") {
+            return __vue__;
           }
-          var currentIndex = computeVmIndex(this.getChildrenNodes(), evt.item);
-          var element = this.list[currentIndex];
-          this.context = {
-            currentIndex: currentIndex,
-            element: element
-          };
-          evt.item._underlying_vm_ = this.clone(element);
+
+          return __vue__.$parent;
         },
+        getRelatedContextFromMoveEvent: function getRelatedContextFromMoveEvent(_ref2) {
+          var to = _ref2.to;
+          var related = _ref2.related;
+
+          var component = this.getUnderlyingPotencialDraggableComponent(to);
+          if (!component) {
+            return { component: component };
+          }
+          var list = component.list;
+          var context = { list: list, component: component };
+          if (to !== related && list && component.getUnderlyingVm) {
+            var destination = component.getUnderlyingVm(related);
+            return Object.assign(destination, context);
+          }
+
+          return context;
+        },
+        onDragStart: function onDragStart(evt) {
+          this.context = this.getUnderlyingVm(evt.item);
+          evt.item._underlying_vm_ = this.clone(this.context.element);
+        },
         onDragAdd: function onDragAdd(evt) {
           var element = evt.item._underlying_vm_;
-          if (!this.list || element === undefined) {
+          if (element === undefined) {
             return;
@@ -194,5 +210,2 @@ }
         onDragRemove: function onDragRemove(evt) {
-          if (!this.list) {
-            return;
-          }
           insertNodeAt(this.rootContainer, evt.item, evt.oldIndex);
@@ -204,15 +217,23 @@ var isCloning = !!evt.clone;
           }
-          var oldIndex = this.context.currentIndex;
+          var oldIndex = this.context.index;
           this.list.splice(oldIndex, 1);
         },
         onDragUpdate: function onDragUpdate(evt) {
-          if (!this.list) {
-            return;
-          }
           removeNode(evt.item);
           insertNodeAt(evt.from, evt.item, evt.oldIndex);
-          var oldIndexVM = this.context.currentIndex;
+          var oldIndexVM = this.context.index;
           var newIndexVM = this.visibleIndexes[evt.newIndex];
           updatePosition(this.list, oldIndexVM, newIndexVM);
         },
+        onDragMove: function onDragMove(evt) {
+          var onMove = this.move;
+          if (!onMove || !this.list) {
+            return true;
+          }
+
+          var relatedContext = this.getRelatedContextFromMoveEvent(evt);
+          var draggedContext = this.context;
+          Object.assign(evt, { relatedContext: relatedContext, draggedContext: draggedContext });
+          return onMove(evt);
+        },
         onDragEnd: function onDragEnd(evt) {
@@ -219,0 +240,0 @@ this.computeIndexes();

package.json

 {
   "name": "vuedraggable",
-  "version": "2.5.0-rc0",
+  "version": "2.6.0-rc0",
   "description": "draggable component for vue",
@@ -24,2 +24,3 @@ "main": "dist/vuedraggable.js",
   "devDependencies": {
+    "babel-polyfill": "^6.20.0",
     "babel-preset-es2015": "^6.16.0",
@@ -26,0 +27,0 @@ "bower": "^1.7.9",

README.md

@@ -58,4 +58,4 @@ # Vue.Draggable
 
-Array to be synchronized with drag-and-drop. Typically same array as refrenced by inner element v-for directive.<br>
-Note that draggabe component can be used with a list prop
+Array to be synchronized with drag-and-drop. Typically same array as referenced by inner element v-for directive.<br>
+Note that this prop is not required and that draggable component can be used without a list prop.
 
@@ -62,0 +62,0 @@ #### options

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

16021

increased by6.37%

Lines of code

219

increased by8.96%

Worsened metrics

Dev dependency count

25

increased by4.17%

No dependency changes