@havue/drag-and-drop 1.2.0 → 1.2.2

package/dist/drag-and-drop.mjs

@@ -37,7 +37,7 @@ class DnDManager extends EventBus {
   }
   updateDargInfo(type, data) {
     if (type === void 0 || type === null) {
-      throw new Error("请传入拖动元素 type");
+      throw new Error("Expected to get a drag type, but received ", type);
     }
     this.isDragStart = true;
     this.dragType = type;
@@ -290,10 +290,6 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       const { x, y } = params;
       const startEl = document.elementFromPoint(x, y);
       if (!props.disabled && dragItemRef.value && dragItemRef.value.contains(startEl)) {
-        if (immediateDirections.value.includes(ImmediateEnumType.ALL)) {
-          handleStart(params);
-          return;
-        }
         isDownThis.value = true;
         downPosition.x = x;
         downPosition.y = y;
@@ -301,7 +297,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
     const onFirstMove = (params, event) => {
       const { x, y } = params;
-      const directions = immediateDirections.value.filter((item) => item !== ImmediateEnumType.ALL);
+      const directions = immediateDirections.value;
       if (isDownThis.value && !props.disabled && directions.length) {
         const distanceH = x - downPosition.x;
         const distanceHAbs = Math.abs(distanceH);
@@ -311,11 +307,15 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
         const isMaxH = distanceHAbs === max;
         const isMaxV = distanceVAbs === max;
         let isImmediate = false;
-        if (isMaxH) {
-          isImmediate = directions.includes(ImmediateEnumType.LEFT) && distanceH < 0 || directions.includes(ImmediateEnumType.RIGHT) && distanceH > 0;
-        }
-        if (isMaxV && !isImmediate) {
-          isImmediate = directions.includes(ImmediateEnumType.TOP) && distanceV < 0 || directions.includes(ImmediateEnumType.BOTTOM) && distanceV > 0;
+        if (directions.includes(ImmediateEnumType.ALL)) {
+          isImmediate = true;
+        } else {
+          if (isMaxH) {
+            isImmediate = directions.includes(ImmediateEnumType.LEFT) && distanceH < 0 || directions.includes(ImmediateEnumType.RIGHT) && distanceH > 0;
+          }
+          if (isMaxV && !isImmediate) {
+            isImmediate = directions.includes(ImmediateEnumType.TOP) && distanceV < 0 || directions.includes(ImmediateEnumType.BOTTOM) && distanceV > 0;
+          }
         }
         if (isImmediate) {
           event.preventDefault();
@@ -334,6 +334,10 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       }
     };
     const onMove = (params) => {
+      if (props.disabled) {
+        isDragThis.value = false;
+        return;
+      }
       const { point } = params;
       if (isDragThis.value) {
         handleMove(point);
@@ -381,28 +385,20 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
         ref: dragItemRef,
         class: normalizeClass(["hv-draggable", _ctx.disabled ? "disabled" : ""])
       }, [
-        renderSlot(_ctx.$slots, "default", {}, void 0, true),
+        renderSlot(_ctx.$slots, "default"),
         isDragThis.value ? (openBlock(), createElementBlock("div", {
           key: 0,
           class: "hv-draggable__clone-item",
           style: normalizeStyle(cloneNodeStyle.value)
         }, [
           renderSlot(_ctx.$slots, "drag-item", {}, () => [
-            renderSlot(_ctx.$slots, "default", {}, void 0, true)
-          ], true)
+            renderSlot(_ctx.$slots, "default")
+          ])
         ], 4)) : createCommentVNode("", true)
       ], 2);
     };
   }
 });
-const _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
-const Draggable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-dc35c291"]]);
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: "HvDroppable"
@@ -445,6 +441,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
     const onMove = (params) => {
       if (props.disabled) {
+        isEntered.value = false;
         return;
       }
       const { type, data, point } = params;
@@ -464,13 +461,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
     };
     const onEnd = ({ type, point, data }) => {
-      if (props.disabled) {
-        return;
-      }
-      if (dropAreaRef.value && acceptDragTypeList.value.includes(type) && isEntered.value) {
+      if (!props.disabled && dropAreaRef.value && acceptDragTypeList.value.includes(type) && isEntered.value) {
         const { position } = getPositionInArea(point);
         emits("drop", type, position, data);
       }
+      isEntered.value = false;
     };
     onMounted(() => {
       DnDManagerInstance.on("move", onMove);
@@ -491,9 +486,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const HvDraggable = withInstall(Draggable);
+const HvDraggable = withInstall(_sfc_main$1);
 const HvDroppable = withInstall(_sfc_main);
 export {
+  DnDManagerInstance,
   HvDraggable,
   HvDroppable
 };

package/dist/drag-and-drop.umd.js

@@ -38,7 +38,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
     }
     updateDargInfo(type, data) {
       if (type === void 0 || type === null) {
-        throw new Error("请传入拖动元素 type");
+        throw new Error("Expected to get a drag type, but received ", type);
       }
       this.isDragStart = true;
       this.dragType = type;
@@ -291,10 +291,6 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
         const { x, y } = params;
         const startEl = document.elementFromPoint(x, y);
         if (!props.disabled && dragItemRef.value && dragItemRef.value.contains(startEl)) {
-          if (immediateDirections.value.includes(ImmediateEnumType.ALL)) {
-            handleStart(params);
-            return;
-          }
           isDownThis.value = true;
           downPosition.x = x;
           downPosition.y = y;
@@ -302,7 +298,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       };
       const onFirstMove = (params, event) => {
         const { x, y } = params;
-        const directions = immediateDirections.value.filter((item) => item !== ImmediateEnumType.ALL);
+        const directions = immediateDirections.value;
         if (isDownThis.value && !props.disabled && directions.length) {
           const distanceH = x - downPosition.x;
           const distanceHAbs = Math.abs(distanceH);
@@ -312,11 +308,15 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
           const isMaxH = distanceHAbs === max;
           const isMaxV = distanceVAbs === max;
           let isImmediate = false;
-          if (isMaxH) {
-            isImmediate = directions.includes(ImmediateEnumType.LEFT) && distanceH < 0 || directions.includes(ImmediateEnumType.RIGHT) && distanceH > 0;
-          }
-          if (isMaxV && !isImmediate) {
-            isImmediate = directions.includes(ImmediateEnumType.TOP) && distanceV < 0 || directions.includes(ImmediateEnumType.BOTTOM) && distanceV > 0;
+          if (directions.includes(ImmediateEnumType.ALL)) {
+            isImmediate = true;
+          } else {
+            if (isMaxH) {
+              isImmediate = directions.includes(ImmediateEnumType.LEFT) && distanceH < 0 || directions.includes(ImmediateEnumType.RIGHT) && distanceH > 0;
+            }
+            if (isMaxV && !isImmediate) {
+              isImmediate = directions.includes(ImmediateEnumType.TOP) && distanceV < 0 || directions.includes(ImmediateEnumType.BOTTOM) && distanceV > 0;
+            }
           }
           if (isImmediate) {
             event.preventDefault();
@@ -335,6 +335,10 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
         }
       };
       const onMove = (params) => {
+        if (props.disabled) {
+          isDragThis.value = false;
+          return;
+        }
         const { point } = params;
         if (isDragThis.value) {
           handleMove(point);
@@ -382,28 +386,20 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
           ref: dragItemRef,
           class: vue.normalizeClass(["hv-draggable", _ctx.disabled ? "disabled" : ""])
         }, [
-          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true),
+          vue.renderSlot(_ctx.$slots, "default"),
           isDragThis.value ? (vue.openBlock(), vue.createElementBlock("div", {
             key: 0,
             class: "hv-draggable__clone-item",
             style: vue.normalizeStyle(cloneNodeStyle.value)
           }, [
             vue.renderSlot(_ctx.$slots, "drag-item", {}, () => [
-              vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
-            ], true)
+              vue.renderSlot(_ctx.$slots, "default")
+            ])
           ], 4)) : vue.createCommentVNode("", true)
         ], 2);
       };
     }
   });
-  const _export_sfc = (sfc, props) => {
-    const target = sfc.__vccOpts || sfc;
-    for (const [key, val] of props) {
-      target[key] = val;
-    }
-    return target;
-  };
-  const Draggable = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-dc35c291"]]);
   const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "HvDroppable"
@@ -446,6 +442,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       }
       const onMove = (params) => {
         if (props.disabled) {
+          isEntered.value = false;
           return;
         }
         const { type, data, point } = params;
@@ -465,13 +462,11 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
         }
       };
       const onEnd = ({ type, point, data }) => {
-        if (props.disabled) {
-          return;
-        }
-        if (dropAreaRef.value && acceptDragTypeList.value.includes(type) && isEntered.value) {
+        if (!props.disabled && dropAreaRef.value && acceptDragTypeList.value.includes(type) && isEntered.value) {
           const { position } = getPositionInArea(point);
           emits("drop", type, position, data);
         }
+        isEntered.value = false;
       };
       vue.onMounted(() => {
         DnDManagerInstance.on("move", onMove);
@@ -492,8 +487,9 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       };
     }
   });
-  const HvDraggable = withInstall(Draggable);
+  const HvDraggable = withInstall(_sfc_main$1);
   const HvDroppable = withInstall(_sfc_main);
+  exports2.DnDManagerInstance = DnDManagerInstance;
   exports2.HvDraggable = HvDraggable;
   exports2.HvDroppable = HvDroppable;
   Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });

package/dist/style.css

@@ -1,11 +1,11 @@
-.hv-draggable[data-v-dc35c291] {
+.hv-draggable {
   width: fit-content;
   cursor: grab;
 }
-.hv-draggable.disabled[data-v-dc35c291] {
+.hv-draggable.disabled {
   cursor: not-allowed;
 }
-.hv-draggable__clone-item[data-v-dc35c291] {
+.hv-draggable__clone-item {
   position: fixed;
   top: 0;
   left: 0;

package/dist/types/src/index.d.ts

@@ -1,6 +1,8 @@
 import type { SFCWithInstall } from '@havue/utils';
 import Draggable from './Draggable.vue';
 import Droppable from './Droppable.vue';
+import { DnDManagerInstance } from './manager';
 export declare const HvDraggable: SFCWithInstall<typeof Draggable>;
 export declare const HvDroppable: SFCWithInstall<typeof Droppable>;
-export type { DragAndDropPoint, DragAndDropDragType, DnDManager } from './manager';
+export type { DragAndDropPoint, DragAndDropDragType, DnDManager, DnDManagerEvents } from './manager';
+export { DnDManagerInstance };

package/dist/types/src/manager/index.d.ts

@@ -21,11 +21,11 @@ export type DnDManagerEvents = {
 };
 export declare class DnDManager extends EventBus<DnDManagerEvents> {
     /** 是否开始拖动 | Whether to start dragging */
-    isDragStart: boolean;
+    private isDragStart;
     /** 拖动元素类型 | Drag type */
-    dragType: DragAndDropDragType | undefined;
+    private dragType;
     /** Draggable传递的数据，供Droppable使用 | Draggable passes data for use by Droppable */
-    dragData: any;
+    private dragData;
     private isSendFirstMovePos;
     /** 长按一定时间才触发 onStart | Press and hold for a certain amount of time to trigger onStart */
     private touchStartPressTime;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@havue/drag-and-drop",
-  "version": "1.2.0",
+  "version": "1.2.2",
   "description": "Drag and drop components for Vue3",
   "keywords": [
     "havue",
@@ -16,7 +16,7 @@
     "url": "git+https://github.com/HappyPedestrian/havue.git"
   },
   "dependencies": {
-    "@havue/shared": "^1.2.0"
+    "@havue/shared": "^1.2.2"
   },
   "devDependencies": {
     "vue": "^3.3.0"