@qxs-bns/components 0.0.5 → 0.0.7

package/src/photo-crop-tool/src/photo-crop-tool.vue.js

@@ -1,224 +0,0 @@
-var A = ($, X, i) => new Promise((L, I) => {
-  var f = (v) => {
-    try {
-      h(i.next(v));
-    } catch (o) {
-      I(o);
-    }
-  }, b = (v) => {
-    try {
-      h(i.throw(v));
-    } catch (o) {
-      I(o);
-    }
-  }, h = (v) => v.done ? L(v.value) : Promise.resolve(v.value).then(f, b);
-  h((i = i.apply($, X)).next());
-});
-import { defineComponent as ie, ref as W, computed as C, watch as ae, onMounted as oe, nextTick as ue, onUnmounted as ne, openBlock as D, createElementBlock as O, normalizeClass as x, unref as m, toDisplayString as se, Fragment as he, createElementVNode as k, normalizeStyle as ve } from "vue";
-import { useNamespace as re } from "../../../dist/hooks/src/use-namespace/index.js";
-import { useElementSize as G, useDraggable as fe } from "../../../node_modules/.pnpm/@vueuse_core@10.11.1_vue@3.5.12_typescript@5.6.3_/node_modules/@vueuse/core/index.js";
-import { useCanvas as ce } from "./composables.js";
-const de = ["src"], xe = /* @__PURE__ */ ie({
-  name: "QxsPhotoCropTool",
-  __name: "photo-crop-tool",
-  props: {
-    imgFile: {
-      type: Object,
-      default: () => null
-    },
-    aspectRatio: {
-      type: String,
-      default: () => "16 / 9"
-    },
-    defaultWidth: {
-      type: Number,
-      default: () => 320
-    },
-    defaultHeight: {
-      type: Number,
-      default: () => 180
-    },
-    /**
-     * free 自由缩放
-     * fixed 固定比例缩放
-     */
-    zoomType: {
-      type: String,
-      default: () => "fixed"
-    }
-  },
-  setup($, { expose: X }) {
-    const i = $;
-    let L = 0, I = 0, f = 0, b = 0;
-    const h = re("photo-crop-tool"), v = W(null), o = W(null), B = W(null), S = W(""), r = W(""), Y = W({
-      x: 0,
-      y: 0
-    }), e = W({
-      width: i.defaultWidth,
-      height: i.defaultHeight,
-      x: 0,
-      y: 0
-    }), { width: F, height: N } = G(v), { width: J } = G(B), { x: p, y: g, style: K } = fe(v, {
-      containerElement: o,
-      draggingElement: v,
-      disabled: C(() => !!r.value),
-      exact: !0,
-      initialValue: Y
-    }), j = C(() => i.imgFile ? URL.createObjectURL(i.imgFile) : "");
-    ae(() => i.imgFile, (t) => {
-      t && !t.type.startsWith("image/") ? S.value = "文件类型错误" : S.value = "";
-    });
-    const Z = C(() => {
-      var t;
-      return (((t = B.value) == null ? void 0 : t.naturalWidth) || 0) / J.value;
-    }), d = C(() => {
-      const t = {
-        left: 0,
-        top: 0
-      };
-      return r.value === "bottom-right" ? (t.left = e.value.x, t.top = e.value.y) : r.value === "top-left" ? (t.left = e.value.x - F.value, t.top = e.value.y - N.value) : r.value === "top-right" ? (t.top = e.value.y - N.value, t.left = e.value.x) : r.value === "bottom-left" && (t.left = e.value.x - F.value, t.top = e.value.y), t;
-    }), ee = C(() => {
-      const { aspectRatio: t } = i, l = {
-        width: `${e.value.width || i.defaultWidth}`,
-        height: `${e.value.height || i.defaultHeight}`,
-        "aspect-ratio": t,
-        top: `${d.value.top}px`,
-        left: `${d.value.left}px`
-      };
-      return i.zoomType === "free" ? delete l["aspect-ratio"] : i.zoomType === "fixed" && delete l.height, h.cssVarBlock(l);
-    });
-    function w(t) {
-      return t * Z.value;
-    }
-    function te() {
-      return A(this, arguments, function* (t = B.value) {
-        var E, M;
-        let l = "transparent";
-        o.value && (l = window.getComputedStyle(o.value).backgroundColor);
-        const u = document.createElement("canvas");
-        u.width = w(((E = o.value) == null ? void 0 : E.clientWidth) || 0), u.height = w(((M = o.value) == null ? void 0 : M.clientHeight) || 0);
-        const { drawImage: T, cropCanvas: R, drawColor: H } = ce(u);
-        return H(0, 0, u.width, u.height, l), T(t, w(t.offsetLeft), w(t.offsetTop), t.naturalWidth, t.naturalHeight), yield R(w(p.value), w(g.value), w(F.value), w(N.value));
-      });
-    }
-    function y(t, l) {
-      var R, H;
-      const u = ((R = o.value) == null ? void 0 : R.clientWidth) || 1 / 0, T = ((H = o.value) == null ? void 0 : H.clientHeight) || 1 / 0;
-      return {
-        width: Math.min(Math.max(t, 0), u),
-        height: Math.min(Math.max(l, 0), T)
-      };
-    }
-    function P(t) {
-      var T, R, H, E, M, _, Q, q;
-      const l = t.clientX - L, u = t.clientY - I;
-      if (r.value === "bottom-right") {
-        if (i.zoomType === "free") {
-          const { width: n, height: a } = y(f + l, b + u);
-          e.value.width = n, e.value.height = a;
-        } else if (i.zoomType === "fixed") {
-          const n = Number.parseFloat(i.aspectRatio.split(" / ")[0]) / Number.parseFloat(i.aspectRatio.split(" / ")[1]);
-          let a = f + l, s = a / n;
-          const { width: z, height: c } = y(a, s);
-          c > (((T = o.value) == null ? void 0 : T.clientHeight) || 1 / 0) && (s = ((R = o.value) == null ? void 0 : R.clientHeight) || 1 / 0, a = s * n), e.value.width = z, e.value.height = c;
-        }
-      } else if (r.value === "top-left") {
-        if (i.zoomType === "free") {
-          const { width: n, height: a } = y(f - l, b - u);
-          e.value.width = n, e.value.height = a;
-        } else if (i.zoomType === "fixed") {
-          const n = Number.parseFloat(i.aspectRatio.split(" / ")[0]) / Number.parseFloat(i.aspectRatio.split(" / ")[1]);
-          let a = f - l, s = a / n;
-          const { width: z, height: c } = y(a, s);
-          c > (((H = o.value) == null ? void 0 : H.clientHeight) || 1 / 0) && (s = ((E = o.value) == null ? void 0 : E.clientHeight) || 1 / 0, a = s * n), e.value.width = z, e.value.height = c;
-        }
-        p.value = d.value.left, g.value = d.value.top;
-      } else if (r.value === "top-right") {
-        if (i.zoomType === "free") {
-          const { width: n, height: a } = y(f + l, b - u);
-          e.value.width = n, e.value.height = a;
-        } else if (i.zoomType === "fixed") {
-          const n = Number.parseFloat(i.aspectRatio.split(" / ")[0]) / Number.parseFloat(i.aspectRatio.split(" / ")[1]);
-          let a = f + l, s = a / n;
-          const { width: z, height: c } = y(a, s);
-          c > (((M = o.value) == null ? void 0 : M.clientHeight) || 1 / 0) && (s = ((_ = o.value) == null ? void 0 : _.clientHeight) || 1 / 0, a = s * n), e.value.width = z, e.value.height = c;
-        }
-        p.value = d.value.left, g.value = d.value.top;
-      } else if (r.value === "bottom-left") {
-        if (i.zoomType === "free") {
-          const { width: n, height: a } = y(f - l, b + u);
-          e.value.width = n, e.value.height = a;
-        } else if (i.zoomType === "fixed") {
-          const n = Number.parseFloat(i.aspectRatio.split(" / ")[0]) / Number.parseFloat(i.aspectRatio.split(" / ")[1]);
-          let a = f - l, s = a / n;
-          const { width: z, height: c } = y(a, s);
-          c > (((Q = o.value) == null ? void 0 : Q.clientHeight) || 1 / 0) && (s = ((q = o.value) == null ? void 0 : q.clientHeight) || 1 / 0, a = s * n), e.value.width = z, e.value.height = c;
-        }
-        p.value = d.value.left, g.value = d.value.top;
-      }
-      t.preventDefault(), t.stopPropagation();
-    }
-    function U(t, l) {
-      r.value = l, L = t.clientX, I = t.clientY, f = e.value.width, b = e.value.height, l === "bottom-right" ? (e.value.x = p.value, e.value.y = g.value) : l === "top-left" ? (e.value.x = p.value + F.value, e.value.y = g.value + N.value) : l === "top-right" ? (e.value.x = p.value, e.value.y = g.value + N.value) : l === "bottom-left" && (e.value.x = p.value + F.value, e.value.y = g.value);
-    }
-    function V() {
-      r.value = "";
-    }
-    function le() {
-      e.value.width = i.defaultWidth, e.value.height = i.defaultHeight, p.value = 0, g.value = 0;
-    }
-    return document.addEventListener("mouseup", V), document.addEventListener("mousemove", P), oe(() => {
-      ue(() => {
-        var t, l;
-        Y.value.x = (((t = o.value) == null ? void 0 : t.offsetWidth) || 0) / 2 - e.value.width / 2, Y.value.y = (((l = o.value) == null ? void 0 : l.offsetHeight) || 0) / 2 - e.value.height / 2;
-      });
-    }), ne(() => {
-      j.value && URL.revokeObjectURL(j.value), document.removeEventListener("mouseup", V), document.removeEventListener("mousemove", P);
-    }), X({
-      crop: te,
-      resize: le
-    }), (t, l) => (D(), O("div", {
-      ref_key: "containerBoxRef",
-      ref: o,
-      class: x([m(h).e("img-box")])
-    }, [
-      S.value ? (D(), O("div", {
-        key: 0,
-        class: x([m(h).e("error-message")])
-      }, se(S.value), 3)) : (D(), O(he, { key: 1 }, [
-        k("img", {
-          ref_key: "imgRef",
-          ref: B,
-          class: x([m(h).e("image")]),
-          src: j.value
-        }, null, 10, de),
-        k("div", {
-          ref_key: "cropBoxRef",
-          ref: v,
-          class: x([m(h).e("crop-tool-box")]),
-          style: ve([ee.value, r.value ? `left: ${d.value.left}px;top: ${d.value.top}px` : m(K)])
-        }, [
-          k("div", {
-            class: x([m(h).e("top-left")]),
-            onMousedown: l[0] || (l[0] = (u) => U(u, "top-left"))
-          }, null, 34),
-          k("div", {
-            class: x([m(h).e("top-right")]),
-            onMousedown: l[1] || (l[1] = (u) => U(u, "top-right"))
-          }, null, 34),
-          k("div", {
-            class: x([m(h).e("bottom-right")]),
-            onMousedown: l[2] || (l[2] = (u) => U(u, "bottom-right"))
-          }, null, 34),
-          k("div", {
-            class: x([m(h).e("bottom-left")]),
-            onMousedown: l[3] || (l[3] = (u) => U(u, "bottom-left"))
-          }, null, 34)
-        ], 6)
-      ], 64))
-    ], 2));
-  }
-});
-export {
-  xe as default
-};

package/src/photo-crop-tool/src/photo-crop-tool.vue2.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./photo-crop-tool.vue.cjs");exports.default=e.default;

package/src/photo-crop-tool/src/photo-crop-tool.vue2.js

@@ -1,4 +0,0 @@
-import f from "./photo-crop-tool.vue.js";
-export {
-  f as default
-};

package/src/withInstall.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function l(t,n){return t.install=o=>{for(const e of[t,...Object.values({})])o.component(e.name,e)},t}exports.withInstall=l;

package/src/withInstall.js

@@ -1,9 +0,0 @@
-function c(t, n) {
-  return t.install = (e) => {
-    for (const o of [t, ...Object.values({})])
-      e.component(o.name, o);
-  }, t;
-}
-export {
-  c as withInstall
-};