@qxs-bns/components 0.0.4 → 0.0.6

package/index.js

@@ -1,15 +1,900 @@
-import o from "./src/defaults.js";
-import { QxsFileUpload as x } from "./src/file-upload/index.js";
-import { QxsFixedActionBar as i } from "./src/fixed-action-bar/index.js";
-import { QxsImageUpload as n } from "./src/image-upload/index.js";
-import { QxsPhotoCropTool as f } from "./src/photo-crop-tool/index.js";
-const t = o.install, e = o.version;
+var Ue = Object.defineProperty, Fe = Object.defineProperties;
+var Pe = Object.getOwnPropertyDescriptors;
+var se = Object.getOwnPropertySymbols;
+var Se = Object.prototype.hasOwnProperty, Ee = Object.prototype.propertyIsEnumerable;
+var ze = (e, l, t) => l in e ? Ue(e, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[l] = t, te = (e, l) => {
+  for (var t in l || (l = {}))
+    Se.call(l, t) && ze(e, t, l[t]);
+  if (se)
+    for (var t of se(l))
+      Ee.call(l, t) && ze(e, t, l[t]);
+  return e;
+}, he = (e, l) => Fe(e, Pe(l));
+var ge = (e, l) => {
+  var t = {};
+  for (var o in e)
+    Se.call(e, o) && l.indexOf(o) < 0 && (t[o] = e[o]);
+  if (e != null && se)
+    for (var o of se(e))
+      l.indexOf(o) < 0 && Ee.call(e, o) && (t[o] = e[o]);
+  return t;
+};
+var Be = (e, l, t) => new Promise((o, r) => {
+  var i = (v) => {
+    try {
+      d(t.next(v));
+    } catch (s) {
+      r(s);
+    }
+  }, p = (v) => {
+    try {
+      d(t.throw(v));
+    } catch (s) {
+      r(s);
+    }
+  }, d = (v) => v.done ? o(v.value) : Promise.resolve(v.value).then(i, p);
+  d((t = t.apply(e, l)).next());
+});
+import { getCurrentInstance as ue, inject as De, ref as y, computed as H, unref as _, defineComponent as ce, resolveComponent as U, openBlock as V, createBlock as we, normalizeClass as W, withCtx as F, createElementBlock as D, createElementVNode as R, createVNode as T, createCommentVNode as ye, createTextVNode as je, isRef as Qe, toRefs as Ye, customRef as He, onMounted as ne, nextTick as Oe, watch as j, getCurrentScope as Xe, onScopeDispose as Ge, shallowRef as qe, onUpdated as Ke, useAttrs as Je, onUnmounted as Te, Fragment as We, normalizeStyle as P, renderSlot as Ze, toDisplayString as be, withModifiers as Me, withDirectives as et, vShow as tt } from "vue";
+import { u as ot, E as oe, p as lt, z as nt, d as it } from "./vendor.js";
+function de(e, l) {
+  return e.install = (t) => {
+    for (const o of [e, ...Object.values({})])
+      t.component(o.name, o);
+  }, e;
+}
+const me = "qxs", at = "is-";
+function G(e, l, t, o, r) {
+  let i = `${e}-${l}`;
+  return t && (i += `-${t}`), o && (i += `__${o}`), r && (i += `--${r}`), i;
+}
+const st = Symbol("namespaceContextKey");
+function rt(e) {
+  const l = ue() ? De(st, y(me)) : y(me);
+  return H(() => _(l) || me);
+}
+function pe(e, l) {
+  const t = rt();
+  return {
+    namespace: t,
+    b: (o = "") => G(t.value, e, o, "", ""),
+    e: (o) => o ? G(t.value, e, "", o, "") : "",
+    m: (o) => o ? G(t.value, e, "", "", o) : "",
+    be: (o, r) => o && r ? G(t.value, e, o, r, "") : "",
+    em: (o, r) => o && r ? G(t.value, e, "", o, r) : "",
+    bm: (o, r) => o && r ? G(t.value, e, o, "", r) : "",
+    bem: (o, r, i) => o && r && i ? G(t.value, e, o, r, i) : "",
+    is: (o, ...r) => {
+      const i = r.length >= 1 ? r[0] : !0;
+      return o && i ? `${at}${o}` : "";
+    },
+    // css
+    cssVar: (o) => {
+      const r = {};
+      for (const i in o)
+        o[i] && (r[`--${t.value}-${i}`] = o[i]);
+      return r;
+    },
+    cssVarName: (o) => `--${t.value}-${o}`,
+    cssVarBlock: (o) => {
+      const r = {};
+      for (const i in o)
+        o[i] && (r[`--${t.value}-${e}-${i}`] = o[i]);
+      return r;
+    },
+    cssVarBlockName: (o) => `--${t.value}-${e}-${o}`
+  };
+}
+const ut = { class: "slot" }, ct = {
+  key: 0,
+  class: "el-upload__tip"
+}, dt = { style: { display: "inline-block" } }, pt = /* @__PURE__ */ ce({
+  name: "QxsFileUpload",
+  __name: "file-upload",
+  props: {
+    action: {},
+    headers: {},
+    data: {},
+    name: { default: "file" },
+    size: { default: 20 },
+    max: { default: 3 },
+    accept: { default: "zip,rar" },
+    files: { default: () => [] },
+    notip: { type: Boolean, default: !1 },
+    ext: {}
+  },
+  emits: ["onSuccess"],
+  setup(e, { emit: l }) {
+    const t = e, o = l, r = pe("file-upload"), i = H(() => t.accept.split(",").map((s) => s.split("/").pop())), p = (s) => {
+      var a;
+      const u = (a = s.name.split(".").at(-1)) != null ? a : "", c = i.value.includes(u), n = s.size / 1024 / 1024 < t.size;
+      return c || oe.error(`上传文件只支持 ${i.value.join(" / ")} 格式！`), n || oe.error(`上传文件大小不能超过 ${t.size}MB！`), c && n;
+    }, d = () => {
+      oe.warning("文件上传超过限制");
+    }, v = (s, f, u) => {
+      o("onSuccess", s, f, u);
+    };
+    return (s, f) => {
+      const u = U("el-icon"), c = U("el-alert"), n = U("el-upload");
+      return V(), we(n, {
+        headers: s.headers,
+        action: s.action,
+        data: s.data,
+        name: s.name,
+        "before-upload": p,
+        "on-exceed": d,
+        "on-success": v,
+        "file-list": s.files,
+        limit: s.max,
+        drag: "",
+        class: W(_(r).e("control"))
+      }, {
+        tip: F(() => [
+          s.notip ? ye("", !0) : (V(), D("div", ct, [
+            R("div", dt, [
+              T(c, {
+                title: `上传文件支持 ${i.value.join(" / ")} 格式，单个文件大小不超过 ${s.size}MB，且文件数量不超过 ${s.max} 个`,
+                type: "info",
+                "show-icon": "",
+                closable: !1
+              }, null, 8, ["title"])
+            ])
+          ]))
+        ]),
+        default: F(() => [
+          R("div", ut, [
+            T(u, { class: "el-icon--upload" }, {
+              default: F(() => [
+                T(_(ot))
+              ]),
+              _: 1
+            }),
+            f[0] || (f[0] = R("div", { class: "el-upload__text" }, [
+              je(" 将文件拖到此处，或"),
+              R("em", null, "点击上传")
+            ], -1))
+          ])
+        ]),
+        _: 1
+      }, 8, ["headers", "action", "data", "name", "file-list", "limit", "class"]);
+    };
+  }
+}), ft = de(pt);
+function vt(e, l) {
+  let t, o, r;
+  const i = y(!0), p = () => {
+    i.value = !0, r();
+  };
+  j(e, p, { flush: "sync" });
+  const d = typeof l == "function" ? l : l.get, v = typeof l == "function" ? void 0 : l.set, s = He((f, u) => (o = f, r = u, {
+    get() {
+      return i.value && (t = d(), i.value = !1), o(), t;
+    },
+    set(c) {
+      v == null || v(c);
+    }
+  }));
+  return Object.isExtensible(s) && (s.trigger = p), s;
+}
+function xe(e) {
+  return Xe() ? (Ge(e), !0) : !1;
+}
+function E(e) {
+  return typeof e == "function" ? e() : _(e);
+}
+const Ie = typeof window != "undefined" && typeof document != "undefined";
+typeof WorkerGlobalScope != "undefined" && globalThis instanceof WorkerGlobalScope;
+const ht = (e) => e != null, gt = Object.prototype.toString, mt = (e) => gt.call(e) === "[object Object]", wt = () => {
+};
+function yt(e) {
+  return ue();
+}
+function bt(e, l = {}) {
+  if (!Qe(e))
+    return Ye(e);
+  const t = Array.isArray(e.value) ? Array.from({ length: e.value.length }) : {};
+  for (const o in e.value)
+    t[o] = He(() => ({
+      get() {
+        return e.value[o];
+      },
+      set(r) {
+        var i;
+        if ((i = E(l.replaceRef)) != null ? i : !0)
+          if (Array.isArray(e.value)) {
+            const d = [...e.value];
+            d[o] = r, e.value = d;
+          } else {
+            const d = he(te({}, e.value), { [o]: r });
+            Object.setPrototypeOf(d, Object.getPrototypeOf(e.value)), e.value = d;
+          }
+        else
+          e.value[o] = r;
+      }
+    }));
+  return t;
+}
+function $e(e, l = !0, t) {
+  yt() ? ne(e, t) : l ? e() : Oe(e);
+}
+function A(e) {
+  var l;
+  const t = E(e);
+  return (l = t == null ? void 0 : t.$el) != null ? l : t;
+}
+const ie = Ie ? window : void 0;
+function le(...e) {
+  let l, t, o, r;
+  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([t, o, r] = e, l = ie) : [l, t, o, r] = e, !l)
+    return wt;
+  Array.isArray(t) || (t = [t]), Array.isArray(o) || (o = [o]);
+  const i = [], p = () => {
+    i.forEach((f) => f()), i.length = 0;
+  }, d = (f, u, c, n) => (f.addEventListener(u, c, n), () => f.removeEventListener(u, c, n)), v = j(
+    () => [A(l), E(r)],
+    ([f, u]) => {
+      if (p(), !f)
+        return;
+      const c = mt(u) ? te({}, u) : u;
+      i.push(
+        ...t.flatMap((n) => o.map((a) => d(f, n, a, c)))
+      );
+    },
+    { immediate: !0, flush: "post" }
+  ), s = () => {
+    v(), p();
+  };
+  return xe(s), s;
+}
+function xt() {
+  const e = y(!1), l = ue();
+  return l && ne(() => {
+    e.value = !0;
+  }, l), e;
+}
+function Ve(e) {
+  const l = xt();
+  return H(() => (l.value, !!e()));
+}
+function $t(e, l, t = {}) {
+  const c = t, { window: o = ie } = c, r = ge(c, ["window"]);
+  let i;
+  const p = Ve(() => o && "MutationObserver" in o), d = () => {
+    i && (i.disconnect(), i = void 0);
+  }, v = H(() => {
+    const n = E(e), a = (Array.isArray(n) ? n : [n]).map(A).filter(ht);
+    return new Set(a);
+  }), s = j(
+    () => v.value,
+    (n) => {
+      d(), p.value && n.size && (i = new MutationObserver(l), n.forEach((a) => i.observe(a, r)));
+    },
+    { immediate: !0, flush: "post" }
+  ), f = () => i == null ? void 0 : i.takeRecords(), u = () => {
+    d(), s();
+  };
+  return xe(u), {
+    isSupported: p,
+    stop: u,
+    takeRecords: f
+  };
+}
+function _t(e) {
+  const l = ue(), t = vt(
+    () => null,
+    () => l.proxy.$el
+  );
+  return Ke(t.trigger), ne(t.trigger), t;
+}
+function Rt(e, l = {}) {
+  var t, o;
+  const {
+    pointerTypes: r,
+    preventDefault: i,
+    stopPropagation: p,
+    exact: d,
+    onMove: v,
+    onEnd: s,
+    onStart: f,
+    initialValue: u,
+    axis: c = "both",
+    draggingElement: n = ie,
+    containerElement: a,
+    handle: b = e
+  } = l, w = y(
+    (t = E(u)) != null ? t : { x: 0, y: 0 }
+  ), O = y(), z = (g) => r ? r.includes(g.pointerType) : !0, B = (g) => {
+    E(i) && g.preventDefault(), E(p) && g.stopPropagation();
+  }, fe = (g) => {
+    var N;
+    if (g.button !== 0 || E(l.disabled) || !z(g) || E(d) && g.target !== E(e))
+      return;
+    const C = E(a), L = (N = C == null ? void 0 : C.getBoundingClientRect) == null ? void 0 : N.call(C), S = E(e).getBoundingClientRect(), J = {
+      x: g.clientX - (C ? S.left - L.left + C.scrollLeft : S.left),
+      y: g.clientY - (C ? S.top - L.top + C.scrollTop : S.top)
+    };
+    (f == null ? void 0 : f(J, g)) !== !1 && (O.value = J, B(g));
+  }, K = (g) => {
+    if (E(l.disabled) || !z(g) || !O.value)
+      return;
+    const N = E(a), C = E(e).getBoundingClientRect();
+    let { x: L, y: S } = w.value;
+    (c === "x" || c === "both") && (L = g.clientX - O.value.x, N && (L = Math.min(Math.max(0, L), N.scrollWidth - C.width))), (c === "y" || c === "both") && (S = g.clientY - O.value.y, N && (S = Math.min(Math.max(0, S), N.scrollHeight - C.height))), w.value = {
+      x: L,
+      y: S
+    }, v == null || v(w.value, g), B(g);
+  }, ve = (g) => {
+    E(l.disabled) || !z(g) || O.value && (O.value = void 0, s == null || s(w.value, g), B(g));
+  };
+  if (Ie) {
+    const g = { capture: (o = l.capture) != null ? o : !0 };
+    le(b, "pointerdown", fe, g), le(n, "pointermove", K, g), le(n, "pointerup", ve, g);
+  }
+  return he(te({}, bt(w)), {
+    position: w,
+    isDragging: H(() => !!O.value),
+    style: H(
+      () => `left:${w.value.x}px;top:${w.value.y}px;`
+    )
+  });
+}
+function Ae(e, l, t = {}) {
+  const u = t, { window: o = ie } = u, r = ge(u, ["window"]);
+  let i;
+  const p = Ve(() => o && "ResizeObserver" in o), d = () => {
+    i && (i.disconnect(), i = void 0);
+  }, v = H(() => Array.isArray(e) ? e.map((c) => A(c)) : [A(e)]), s = j(
+    v,
+    (c) => {
+      if (d(), p.value && o) {
+        i = new ResizeObserver(l);
+        for (const n of c)
+          n && i.observe(n, r);
+      }
+    },
+    { immediate: !0, flush: "post" }
+  ), f = () => {
+    d(), s();
+  };
+  return xe(f), {
+    isSupported: p,
+    stop: f
+  };
+}
+function Ct(e, l = {}) {
+  const {
+    reset: t = !0,
+    windowResize: o = !0,
+    windowScroll: r = !0,
+    immediate: i = !0
+  } = l, p = y(0), d = y(0), v = y(0), s = y(0), f = y(0), u = y(0), c = y(0), n = y(0);
+  function a() {
+    const b = A(e);
+    if (!b) {
+      t && (p.value = 0, d.value = 0, v.value = 0, s.value = 0, f.value = 0, u.value = 0, c.value = 0, n.value = 0);
+      return;
+    }
+    const w = b.getBoundingClientRect();
+    p.value = w.height, d.value = w.bottom, v.value = w.left, s.value = w.right, f.value = w.top, u.value = w.width, c.value = w.x, n.value = w.y;
+  }
+  return Ae(e, a), j(() => A(e), (b) => !b && a()), $t(e, a, {
+    attributeFilter: ["style", "class"]
+  }), r && le("scroll", a, { capture: !0, passive: !0 }), o && le("resize", a, { passive: !0 }), $e(() => {
+    i && a();
+  }), {
+    height: p,
+    bottom: d,
+    left: v,
+    right: s,
+    top: f,
+    width: u,
+    x: c,
+    y: n,
+    update: a
+  };
+}
+function re(e, l = { width: 0, height: 0 }, t = {}) {
+  const { window: o = ie, box: r = "content-box" } = t, i = H(() => {
+    var u, c;
+    return (c = (u = A(e)) == null ? void 0 : u.namespaceURI) == null ? void 0 : c.includes("svg");
+  }), p = y(l.width), d = y(l.height), { stop: v } = Ae(
+    e,
+    ([u]) => {
+      const c = r === "border-box" ? u.borderBoxSize : r === "content-box" ? u.contentBoxSize : u.devicePixelContentBoxSize;
+      if (o && i.value) {
+        const n = A(e);
+        if (n) {
+          const a = n.getBoundingClientRect();
+          p.value = a.width, d.value = a.height;
+        }
+      } else if (c) {
+        const n = Array.isArray(c) ? c : [c];
+        p.value = n.reduce((a, { inlineSize: b }) => a + b, 0), d.value = n.reduce((a, { blockSize: b }) => a + b, 0);
+      } else
+        p.value = u.contentRect.width, d.value = u.contentRect.height;
+    },
+    t
+  );
+  $e(() => {
+    const u = A(e);
+    u && (p.value = "offsetWidth" in u ? u.offsetWidth : l.width, d.value = "offsetHeight" in u ? u.offsetHeight : l.height);
+  });
+  const s = j(
+    () => A(e),
+    (u) => {
+      p.value = u ? l.width : 0, d.value = u ? l.height : 0;
+    }
+  );
+  function f() {
+    v(), s();
+  }
+  return {
+    width: p,
+    height: d,
+    stop: f
+  };
+}
+function kt(e = _t()) {
+  const l = qe(), t = () => {
+    const o = A(e);
+    o && (l.value = o.parentElement);
+  };
+  return $e(t), j(() => E(e), t), l;
+}
+const zt = /* @__PURE__ */ ce({
+  name: "QxsFixedActionBar",
+  inheritAttrs: !1,
+  __name: "fixed-action-bar",
+  props: {
+    padding: {
+      type: String,
+      default: "8px"
+    }
+  },
+  setup(e) {
+    const l = e, t = pe("fixed-action-bar"), o = Je(), r = y(!1), i = y(null), p = y(null), d = kt(p), { height: v } = re(i, void 0, { box: "border-box" }), { left: s } = Ct(d), { width: f } = re(d, void 0, { box: "border-box" });
+    function u() {
+      const n = window.scrollY || document.documentElement.scrollTop, a = window.innerHeight || document.documentElement.clientHeight, b = document.documentElement.scrollHeight;
+      r.value = Math.ceil(n + a) >= b;
+    }
+    ne(() => {
+      u(), window.addEventListener("scroll", u);
+    }), Te(() => {
+      window.removeEventListener("scroll", u);
+    });
+    const c = H(() => te({
+      width: `${f || 0}px`,
+      left: `${s}px`,
+      class: `${r.value ? "" : t.is("shadow")} ${o.class || ""}`
+    }, t.cssVarBlock({
+      "actionbar-padding": `${l.padding}`
+    })));
+    return (n, a) => (V(), D(We, null, [
+      R("div", {
+        ref_key: "placeholderRef",
+        ref: p,
+        style: P(`width: 100%; height: ${_(v)}px`)
+      }, null, 4),
+      R("div", {
+        ref_key: "actionbar",
+        ref: i,
+        style: P(c.value),
+        class: W([c.value.class, _(t).e("actionbar")]),
+        "data-fixed-calc-width": ""
+      }, [
+        Ze(n.$slots, "default")
+      ], 6)
+    ], 64));
+  }
+}), St = de(zt), Et = {
+  key: 1,
+  class: "image"
+}, Bt = { class: "mask" }, Mt = { class: "actions" }, Ht = {
+  key: 0,
+  class: "el-upload__tip-text"
+}, Ot = { style: { display: "inline-block" } }, Tt = /* @__PURE__ */ ce({
+  name: "QxsImageUpload",
+  __name: "image-upload",
+  props: {
+    action: {},
+    headers: {},
+    data: {},
+    name: { default: "file" },
+    url: { default: "" },
+    size: { default: 20 },
+    width: { default: 160 },
+    accept: { default: "image/jpeg,image/jpg,image/png,image/gif" },
+    height: { default: 90 },
+    placeholder: { default: "点击上传图片" },
+    notip: { type: Boolean, default: !1 },
+    tipText: {},
+    beforeUpload: {}
+  },
+  emits: ["update:url", "onSuccess"],
+  setup(e, { emit: l }) {
+    const t = e, o = l, r = pe("image-upload"), i = y({
+      imageViewerVisible: !1,
+      progress: {
+        preview: "",
+        percent: 0
+      }
+    }), p = H(() => t.accept.split(",").map((n) => n.split("/").pop()));
+    function d() {
+      i.value.imageViewerVisible = !0;
+    }
+    function v() {
+      i.value.imageViewerVisible = !1;
+    }
+    function s() {
+      o("update:url", "");
+    }
+    const f = (n) => {
+      var z;
+      const b = (z = n.name.split(".").at(-1)) != null ? z : "", w = p.value.includes(b), O = n.size / 1024 / 1024 < t.size;
+      return w ? O ? i.value.progress.preview = URL.createObjectURL(n) : oe.error(`上传图片大小不能超过 ${t.size}MB！`) : oe.error(`上传图片只支持${p.value.join(" / ")}格式！`), w && O && (!t.beforeUpload || t.beforeUpload(n));
+    }, u = (n) => {
+      i.value.progress.percent = ~~n.percent;
+    }, c = (...n) => {
+      i.value.progress.preview = "", i.value.progress.percent = 0, o("onSuccess", ...n);
+    };
+    return (n, a) => {
+      const b = U("el-icon"), w = U("el-image"), O = U("el-progress"), z = U("el-upload"), B = U("el-image-viewer");
+      return V(), D("div", {
+        class: W(_(r).e("upload-container"))
+      }, [
+        T(z, {
+          "show-file-list": !1,
+          headers: n.headers,
+          action: n.action,
+          data: n.data,
+          name: n.name,
+          "before-upload": f,
+          "on-progress": u,
+          "on-success": c,
+          drag: "",
+          accept: n.accept,
+          class: W(_(r).e("image-upload"))
+        }, {
+          default: F(() => [
+            n.url === "" ? (V(), we(w, {
+              key: 0,
+              src: n.url === "" ? n.placeholder : n.url,
+              style: P(`width:${n.width}px;height:${n.height}px;`),
+              fit: "fill"
+            }, {
+              error: F(() => [
+                R("div", {
+                  class: "image-slot",
+                  style: P(`width:${n.width}px;height:${n.height}px;`)
+                }, [
+                  T(b, null, {
+                    default: F(() => [
+                      T(_(lt))
+                    ]),
+                    _: 1
+                  }),
+                  R("p", null, be(n.placeholder), 1)
+                ], 4)
+              ]),
+              _: 1
+            }, 8, ["src", "style"])) : (V(), D("div", Et, [
+              T(w, {
+                src: n.url,
+                style: P(`width:${n.width}px;height:${n.height}px;`),
+                fit: "fill"
+              }, null, 8, ["src", "style"]),
+              R("div", Bt, [
+                R("div", Mt, [
+                  R("span", {
+                    title: "预览",
+                    onClick: Me(d, ["stop"])
+                  }, [
+                    T(b, null, {
+                      default: F(() => [
+                        T(_(nt))
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  R("span", {
+                    title: "移除",
+                    onClick: Me(s, ["stop"])
+                  }, [
+                    T(b, null, {
+                      default: F(() => [
+                        T(_(it))
+                      ]),
+                      _: 1
+                    })
+                  ])
+                ])
+              ])
+            ])),
+            et(R("div", {
+              class: "progress",
+              style: P(`width:${n.width}px;height:${n.height}px;`)
+            }, [
+              T(w, {
+                src: i.value.progress.preview,
+                style: P(`width:${n.width}px;height:${n.height}px;`),
+                fit: "fill"
+              }, null, 8, ["src", "style"]),
+              T(O, {
+                type: "circle",
+                width: Math.min(n.width, n.height) * 0.8,
+                percentage: i.value.progress.percent
+              }, null, 8, ["width", "percentage"])
+            ], 4), [
+              [tt, n.url === "" && i.value.progress.percent]
+            ])
+          ]),
+          _: 1
+        }, 8, ["headers", "action", "data", "name", "accept", "class"]),
+        n.notip ? ye("", !0) : (V(), D("div", Ht, [
+          R("div", Ot, be(n.tipText || `上传图片支持 ${p.value.join(" / ")} 格式，且图片大小不超过 ${n.size}MB，建议图片尺寸为 ${n.width}*${n.height}`), 1)
+        ])),
+        i.value.imageViewerVisible ? (V(), we(B, {
+          key: 1,
+          "url-list": [n.url],
+          teleported: "",
+          onClose: v
+        }, null, 8, ["url-list"])) : ye("", !0)
+      ], 2);
+    };
+  }
+}), Wt = de(Tt);
+function It(e) {
+  const l = y(null);
+  return e && (l.value = e.getContext("2d")), {
+    clearCanvas: () => {
+      l.value && l.value.clearRect(0, 0, e.width, e.height);
+    },
+    drawColor: (p, d, v, s, f) => {
+      l.value && (l.value.fillStyle = f, l.value.fillRect(p, d, v, s));
+    },
+    drawImage: (p, d, v, s, f) => {
+      l.value.drawImage(p, d, v, s, f);
+    },
+    cropCanvas: (p, d, v, s) => new Promise((f) => {
+      if (l.value) {
+        const u = document.createElement("canvas");
+        u.width = v, u.height = s;
+        const c = u.getContext("2d");
+        c ? (c.drawImage(e, p, d, v, s, 0, 0, v, s), u.toBlob((n) => {
+          if (n) {
+            const a = new File([n], "cropped_image.png", { type: "image/png" });
+            f(a);
+          } else
+            f(null);
+        }, "image/png")) : f(null);
+      } else
+        f(null);
+    })
+  };
+}
+const Vt = ["src"], At = /* @__PURE__ */ ce({
+  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(e, { expose: l }) {
+    const t = e;
+    let o = 0, r = 0, i = 0, p = 0;
+    const d = pe("photo-crop-tool"), v = y(null), s = y(null), f = y(null), u = y(""), c = y(""), n = y({
+      x: 0,
+      y: 0
+    }), a = y({
+      width: t.defaultWidth,
+      height: t.defaultHeight,
+      x: 0,
+      y: 0
+    }), { width: b, height: w } = re(v), { width: O } = re(f), { x: z, y: B, style: fe } = Rt(v, {
+      containerElement: s,
+      draggingElement: v,
+      disabled: H(() => !!c.value),
+      exact: !0,
+      initialValue: n
+    }), K = H(() => t.imgFile ? URL.createObjectURL(t.imgFile) : "");
+    j(() => t.imgFile, (h) => {
+      h && !h.type.startsWith("image/") ? u.value = "文件类型错误" : u.value = "";
+    });
+    const ve = H(() => {
+      var h;
+      return (((h = f.value) == null ? void 0 : h.naturalWidth) || 0) / O.value;
+    }), g = H(() => {
+      const h = {
+        left: 0,
+        top: 0
+      };
+      return c.value === "bottom-right" ? (h.left = a.value.x, h.top = a.value.y) : c.value === "top-left" ? (h.left = a.value.x - b.value, h.top = a.value.y - w.value) : c.value === "top-right" ? (h.top = a.value.y - w.value, h.left = a.value.x) : c.value === "bottom-left" && (h.left = a.value.x - b.value, h.top = a.value.y), h;
+    }), N = H(() => {
+      const { aspectRatio: h } = t, m = {
+        width: `${a.value.width || t.defaultWidth}`,
+        height: `${a.value.height || t.defaultHeight}`,
+        "aspect-ratio": h,
+        top: `${g.value.top}px`,
+        left: `${g.value.left}px`
+      };
+      return t.zoomType === "free" ? delete m["aspect-ratio"] : t.zoomType === "fixed" && delete m.height, d.cssVarBlock(m);
+    });
+    function C(h) {
+      return h * ve.value;
+    }
+    function L() {
+      return Be(this, arguments, function* (h = f.value) {
+        var Z, ee;
+        let m = "transparent";
+        s.value && (m = window.getComputedStyle(s.value).backgroundColor);
+        const $ = document.createElement("canvas");
+        $.width = C(((Z = s.value) == null ? void 0 : Z.clientWidth) || 0), $.height = C(((ee = s.value) == null ? void 0 : ee.clientHeight) || 0);
+        const { drawImage: q, cropCanvas: Q, drawColor: Y } = It($);
+        return Y(0, 0, $.width, $.height, m), q(h, C(h.offsetLeft), C(h.offsetTop), h.naturalWidth, h.naturalHeight), yield Q(C(z.value), C(B.value), C(b.value), C(w.value));
+      });
+    }
+    function S(h, m) {
+      var Q, Y;
+      const $ = ((Q = s.value) == null ? void 0 : Q.clientWidth) || 1 / 0, q = ((Y = s.value) == null ? void 0 : Y.clientHeight) || 1 / 0;
+      return {
+        width: Math.min(Math.max(h, 0), $),
+        height: Math.min(Math.max(m, 0), q)
+      };
+    }
+    function J(h) {
+      var q, Q, Y, Z, ee, Re, Ce, ke;
+      const m = h.clientX - o, $ = h.clientY - r;
+      if (c.value === "bottom-right") {
+        if (t.zoomType === "free") {
+          const { width: k, height: x } = S(i + m, p + $);
+          a.value.width = k, a.value.height = x;
+        } else if (t.zoomType === "fixed") {
+          const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
+          let x = i + m, M = x / k;
+          const { width: X, height: I } = S(x, M);
+          I > (((q = s.value) == null ? void 0 : q.clientHeight) || 1 / 0) && (M = ((Q = s.value) == null ? void 0 : Q.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
+        }
+      } else if (c.value === "top-left") {
+        if (t.zoomType === "free") {
+          const { width: k, height: x } = S(i - m, p - $);
+          a.value.width = k, a.value.height = x;
+        } else if (t.zoomType === "fixed") {
+          const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
+          let x = i - m, M = x / k;
+          const { width: X, height: I } = S(x, M);
+          I > (((Y = s.value) == null ? void 0 : Y.clientHeight) || 1 / 0) && (M = ((Z = s.value) == null ? void 0 : Z.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
+        }
+        z.value = g.value.left, B.value = g.value.top;
+      } else if (c.value === "top-right") {
+        if (t.zoomType === "free") {
+          const { width: k, height: x } = S(i + m, p - $);
+          a.value.width = k, a.value.height = x;
+        } else if (t.zoomType === "fixed") {
+          const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
+          let x = i + m, M = x / k;
+          const { width: X, height: I } = S(x, M);
+          I > (((ee = s.value) == null ? void 0 : ee.clientHeight) || 1 / 0) && (M = ((Re = s.value) == null ? void 0 : Re.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
+        }
+        z.value = g.value.left, B.value = g.value.top;
+      } else if (c.value === "bottom-left") {
+        if (t.zoomType === "free") {
+          const { width: k, height: x } = S(i - m, p + $);
+          a.value.width = k, a.value.height = x;
+        } else if (t.zoomType === "fixed") {
+          const k = Number.parseFloat(t.aspectRatio.split(" / ")[0]) / Number.parseFloat(t.aspectRatio.split(" / ")[1]);
+          let x = i - m, M = x / k;
+          const { width: X, height: I } = S(x, M);
+          I > (((Ce = s.value) == null ? void 0 : Ce.clientHeight) || 1 / 0) && (M = ((ke = s.value) == null ? void 0 : ke.clientHeight) || 1 / 0, x = M * k), a.value.width = X, a.value.height = I;
+        }
+        z.value = g.value.left, B.value = g.value.top;
+      }
+      h.preventDefault(), h.stopPropagation();
+    }
+    function ae(h, m) {
+      c.value = m, o = h.clientX, r = h.clientY, i = a.value.width, p = a.value.height, m === "bottom-right" ? (a.value.x = z.value, a.value.y = B.value) : m === "top-left" ? (a.value.x = z.value + b.value, a.value.y = B.value + w.value) : m === "top-right" ? (a.value.x = z.value, a.value.y = B.value + w.value) : m === "bottom-left" && (a.value.x = z.value + b.value, a.value.y = B.value);
+    }
+    function _e() {
+      c.value = "";
+    }
+    function Le() {
+      a.value.width = t.defaultWidth, a.value.height = t.defaultHeight, z.value = 0, B.value = 0;
+    }
+    return document.addEventListener("mouseup", _e), document.addEventListener("mousemove", J), ne(() => {
+      Oe(() => {
+        var h, m;
+        n.value.x = (((h = s.value) == null ? void 0 : h.offsetWidth) || 0) / 2 - a.value.width / 2, n.value.y = (((m = s.value) == null ? void 0 : m.offsetHeight) || 0) / 2 - a.value.height / 2;
+      });
+    }), Te(() => {
+      K.value && URL.revokeObjectURL(K.value), document.removeEventListener("mouseup", _e), document.removeEventListener("mousemove", J);
+    }), l({
+      crop: L,
+      resize: Le
+    }), (h, m) => (V(), D("div", {
+      ref_key: "containerBoxRef",
+      ref: s,
+      class: W([_(d).e("img-box")])
+    }, [
+      u.value ? (V(), D("div", {
+        key: 0,
+        class: W([_(d).e("error-message")])
+      }, be(u.value), 3)) : (V(), D(We, { key: 1 }, [
+        R("img", {
+          ref_key: "imgRef",
+          ref: f,
+          class: W([_(d).e("image")]),
+          src: K.value
+        }, null, 10, Vt),
+        R("div", {
+          ref_key: "cropBoxRef",
+          ref: v,
+          class: W([_(d).e("crop-tool-box")]),
+          style: P([N.value, c.value ? `left: ${g.value.left}px;top: ${g.value.top}px` : _(fe)])
+        }, [
+          R("div", {
+            class: W([_(d).e("top-left")]),
+            onMousedown: m[0] || (m[0] = ($) => ae($, "top-left"))
+          }, null, 34),
+          R("div", {
+            class: W([_(d).e("top-right")]),
+            onMousedown: m[1] || (m[1] = ($) => ae($, "top-right"))
+          }, null, 34),
+          R("div", {
+            class: W([_(d).e("bottom-right")]),
+            onMousedown: m[2] || (m[2] = ($) => ae($, "bottom-right"))
+          }, null, 34),
+          R("div", {
+            class: W([_(d).e("bottom-left")]),
+            onMousedown: m[3] || (m[3] = ($) => ae($, "bottom-left"))
+          }, null, 34)
+        ], 6)
+      ], 64))
+    ], 2));
+  }
+}), Nt = de(At), Lt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  QxsFileUpload: ft,
+  QxsFixedActionBar: St,
+  QxsImageUpload: Wt,
+  QxsPhotoCropTool: Nt
+}, Symbol.toStringTag, { value: "Module" })), Ut = "0.0.6";
+function Ft(e) {
+  return {
+    version: Ut,
+    install: (t) => {
+      for (const o in e)
+        t.use(e[o]);
+    }
+  };
+}
+const Ne = Ft(Lt), Qt = Ne.install, Yt = Ne.version;
 export {
-  x as QxsFileUpload,
-  i as QxsFixedActionBar,
-  n as QxsImageUpload,
-  f as QxsPhotoCropTool,
-  o as default,
-  t as install,
-  e as version
+  ft as QxsFileUpload,
+  St as QxsFixedActionBar,
+  Wt as QxsImageUpload,
+  Nt as QxsPhotoCropTool,
+  Ne as default,
+  Qt as install,
+  Yt as version
 };