@havue/components 1.2.0 → 1.2.2

package/dist/components.full.js

@@ -1941,6 +1941,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               "step-strictly": "",
               min: 0,
               max: 255,
+              "value-on-clear": 0,
               step: 1,
               controls: false
             }, null, 8, ["modelValue", "disabled"]),
@@ -1952,6 +1953,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               "step-strictly": "",
               min: 0,
               max: 255,
+              "value-on-clear": 0,
               step: 1,
               controls: false
             }, null, 8, ["modelValue", "disabled"]),
@@ -1963,6 +1965,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               "step-strictly": "",
               min: 0,
               max: 255,
+              "value-on-clear": 0,
               step: 1,
               controls: false
             }, null, 8, ["modelValue", "disabled"])
@@ -1976,6 +1979,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               onChange: handleHsvColorChange,
               min: 0,
               max: 360,
+              "value-on-clear": 0,
               "step-strictly": "",
               step: 1,
               controls: false
@@ -1987,6 +1991,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               onChange: handleHsvColorChange,
               min: 0,
               max: 100,
+              "value-on-clear": 0,
               "step-strictly": "",
               step: 1,
               controls: false
@@ -1999,6 +2004,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               "step-strictly": "",
               min: 0,
               max: 100,
+              "value-on-clear": 0,
               controls: false
             }, null, 8, ["modelValue", "disabled"])
           ])
@@ -2645,21 +2651,10 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       };
     }
   });
-  const _export_sfc = (sfc, props) => {
-    const target = sfc.__vccOpts || sfc;
-    for (const [key, val] of props) {
-      target[key] = val;
-    }
-    return target;
-  };
-  const ColorArea = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-d4f5b081"]]);
   const _hoisted_1$4 = { class: "hv-color_picker__form mb-12" };
   const _hoisted_2$3 = { class: "hv-color-picker__form-type" };
   const _hoisted_3$2 = { class: "hv-color-picker__form-body" };
   const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
-    ...{
-      name: "HvColorPickerNormal"
-    },
     __name: "ColorForm",
     props: {
       modelValue: {},
@@ -2759,6 +2754,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               disabled: props.disabled,
               min: 0,
               max: isRGB.value ? 255 : 360,
+              "value-on-clear": 0,
               step: 1,
               controls: false
             }, null, 8, ["modelValue", "disabled", "max"]),
@@ -2770,6 +2766,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               disabled: props.disabled,
               min: 0,
               max: isRGB.value ? 255 : 100,
+              "value-on-clear": 0,
               step: 1,
               controls: false
             }, null, 8, ["modelValue", "disabled", "max"]),
@@ -2781,6 +2778,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               disabled: props.disabled,
               min: 0,
               max: isRGB.value ? 255 : 100,
+              "value-on-clear": 0,
               step: 1,
               controls: false
             }, null, 8, ["modelValue", "disabled", "max"]),
@@ -2789,10 +2787,12 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               modelValue: formInputState.value[3],
               "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => formInputState.value[3] = $event),
               onChange: handleColorChange,
+              class: "hv-color-picker__form-opacity",
               "step-strictly": "",
               disabled: props.disabled,
               min: 0,
               max: 100,
+              "value-on-clear": 0,
               step: 1,
               controls: false
             }, {
@@ -2806,7 +2806,6 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       };
     }
   });
-  const ColorForm = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-855a2e17"]]);
   const _hoisted_1$3 = { class: "hv-color-picker__preset" };
   const _hoisted_2$2 = { class: "hv-color-picker__preset-title" };
   const _hoisted_3$1 = { class: "hv-color-picker__preset-list" };
@@ -2866,7 +2865,6 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       };
     }
   });
-  const PresetColors = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-c15cc053"]]);
   const _hoisted_1$2 = { class: "hv-color-picker-normal" };
   const _hoisted_2$1 = { class: "hv-color-picker__color-select-box" };
   const _hoisted_3 = { class: "hv-color-picker__sliders" };
@@ -2909,13 +2907,10 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
           const color22 = Color$1(c);
           const { h, s } = color22.hsv().object();
           saturationv.value = s;
-          const equlValues = [0, 360];
           alpha.value = props.enableAlpha ? Math.round(color22.alpha() * 100) : 100;
-          const curColor = Color$1.hsv({ h: hue.value, s: saturationv.value, v: value.value, alpha: alpha.value }).hexa();
-          if (curColor !== color22.hexa()) {
-            if (!(equlValues.includes(h) && equlValues.includes(hue.value))) {
-              hue.value = h;
-            }
+          const curColor = Color$1.hsv({ h: hue.value, s: saturationv.value, v: value.value, alpha: alpha.value });
+          if (curColor.hex() !== color22.hex()) {
+            hue.value = h;
           }
         },
         {
@@ -2960,7 +2955,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       return (_ctx, _cache) => {
         const _component_ElSlider = vue.resolveComponent("ElSlider");
         return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
-          vue.createVNode(ColorArea, {
+          vue.createVNode(_sfc_main$7, {
             ref_key: "colorAreaRef",
             ref: colorAreaRef,
             "hue-color": hueColor.value,
@@ -3015,13 +3010,13 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
               }, null, 8, ["modelValue", "disabled", "style"])) : vue.createCommentVNode("", true)
             ])
           ]),
-          vue.createVNode(ColorForm, {
+          vue.createVNode(_sfc_main$6, {
             "model-value": color2.value,
             "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => color2.value = $event),
             disabled: props.disabled,
             "enable-alpha": props.enableAlpha
           }, null, 8, ["model-value", "disabled", "enable-alpha"]),
-          vue.createVNode(PresetColors, {
+          vue.createVNode(_sfc_main$5, {
             onChange: handleColorChange,
             title: props.presetTitle,
             presetColors: props.presetColors
@@ -3030,10 +3025,9 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       };
     }
   });
-  const ColorPickerNormal = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-fbafd973"]]);
   const HvColorPicker = withInstall(_sfc_main$8);
   const HvColorPickerRainbow = HvColorPicker;
-  const HvColorPickerNormal = withInstall(ColorPickerNormal);
+  const HvColorPickerNormal = withInstall(_sfc_main$4);
   class EventBus {
     constructor() {
       __publicField(this, "_eventMap");
@@ -3091,7 +3085,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;
@@ -3344,10 +3338,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;
@@ -3355,7 +3345,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);
@@ -3365,11 +3355,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();
@@ -3388,6 +3382,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);
@@ -3435,21 +3433,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 Draggable = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-2309f70a"]]);
   const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
     ...{
       name: "HvDroppable"
@@ -3492,6 +3489,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;
@@ -3511,13 +3509,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);
@@ -3538,7 +3534,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
       };
     }
   });
-  const HvDraggable = withInstall(Draggable);
+  const HvDraggable = withInstall(_sfc_main$3);
   const HvDroppable = withInstall(_sfc_main$2);
   function useDragAndScale(target, operateTarget, options) {
     const _options = vue.computed(() => {
@@ -3904,28 +3900,34 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
         x: clientX,
         y: clientY
       });
-      document.body.addEventListener("touchcancel", onTouchEnd, { capture: true });
-      document.body.addEventListener("touchmove", onTouchMove, { capture: true });
-      document.body.addEventListener("touchend", onTouchEnd, { capture: true });
+      document.body.addEventListener("touchcancel", onTouchEnd);
+      document.body.addEventListener("touchmove", onTouchMove);
+      document.body.addEventListener("touchend", onTouchEnd);
     }
+    let touchmoveRafId = null;
     function onTouchMove(e) {
-      if (_disabled.value || isOperateStart !== true) {
-        isOperateStart = false;
-        return;
+      if (touchmoveRafId) {
+        cancelAnimationFrame(touchmoveRafId);
       }
-      e.preventDefault();
-      e.stopPropagation();
-      if (e.touches.length > 1) {
-        onEnd();
-        return;
-      }
-      const { clientX, clientY } = e.touches[0];
-      if (clientX === startPoint.x && clientY === startPoint.y) {
-        return;
-      }
-      onMove({
-        x: clientX,
-        y: clientY
+      touchmoveRafId = requestAnimationFrame(() => {
+        if (_disabled.value || isOperateStart !== true) {
+          isOperateStart = false;
+          return;
+        }
+        e.preventDefault();
+        e.stopPropagation();
+        if (e.touches.length > 1) {
+          onEnd();
+          return;
+        }
+        const { clientX, clientY } = e.touches[0];
+        if (clientX === startPoint.x && clientY === startPoint.y) {
+          return;
+        }
+        onMove({
+          x: clientX,
+          y: clientY
+        });
       });
     }
     function onTouchEnd() {
@@ -3937,7 +3939,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
         isMoved = false;
         return;
       }
-      onEnd();
+      requestAnimationFrame(() => onEnd());
     }
     function onMouseDown(e) {
       e.preventDefault();
@@ -3949,23 +3951,29 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
         x: clientX,
         y: clientY
       });
-      document.body.addEventListener("mousemove", onMouseMove, { capture: true });
-      document.body.addEventListener("mouseup", onMouseUp, { capture: true });
+      document.body.addEventListener("mousemove", onMouseMove);
+      document.body.addEventListener("mouseup", onMouseUp);
     }
+    let mousemoveRafId = null;
     function onMouseMove(e) {
-      if (_disabled.value || isOperateStart !== true) {
-        isOperateStart = false;
-        return;
+      if (mousemoveRafId) {
+        cancelAnimationFrame(mousemoveRafId);
       }
-      e.preventDefault();
-      if ((e.buttons & 1) === 0) {
-        onEnd();
-        return;
-      }
-      const { clientX, clientY } = e;
-      onMove({
-        x: clientX,
-        y: clientY
+      mousemoveRafId = requestAnimationFrame(() => {
+        if (_disabled.value || isOperateStart !== true) {
+          isOperateStart = false;
+          return;
+        }
+        e.preventDefault();
+        if ((e.buttons & 1) === 0) {
+          onEnd();
+          return;
+        }
+        const { clientX, clientY } = e;
+        onMove({
+          x: clientX,
+          y: clientY
+        });
       });
     }
     function onMouseUp() {
@@ -3975,11 +3983,11 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
         isOperateStart = false;
         return;
       }
-      onEnd();
+      requestAnimationFrame(() => onEnd());
     }
     function bindEvent() {
       removeEvent();
-      _operateEl.value.addEventListener("touchstart", onTouchStart, { capture: true });
+      _operateEl.value.addEventListener("touchstart", onTouchStart);
       _operateEl.value.addEventListener("mousedown", onMouseDown);
     }
     function removeEvent() {
@@ -4206,6 +4214,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
   });
   const HvIpInput = withInstall(_sfc_main);
   exports2.DEFAULT_COLOR = DEFAULT_COLOR;
+  exports2.DnDManagerInstance = DnDManagerInstance;
   exports2.HvColorPicker = HvColorPicker;
   exports2.HvColorPickerNormal = HvColorPickerNormal;
   exports2.HvColorPickerRainbow = HvColorPickerRainbow;