@farris/ui-vue 1.7.0-beta.4 → 1.7.0

package/components/image-cropper/index.esm.js

@@ -1,143 +1,6 @@
-import { inject as Me, ref as o, onMounted as be, onUnmounted as et, watch as ee, defineComponent as we, createVNode as f, withModifiers as P } from "vue";
-import { resolveAppearance as tt, createPropsResolver as at } from "../dynamic-resolver/index.esm.js";
-import { useDesignerComponent as it } from "../designer-canvas/index.esm.js";
-function lt(a, c, u) {
-  return c;
-}
-const nt = /* @__PURE__ */ new Map([
-  ["appearance", tt]
-]), ut = "https://json-schema.org/draft/2020-12/schema", st = "https://farris-design.gitee.io/image-cropper.schema.json", ot = "image-cropper", rt = "A Farris Component", vt = "object", ct = {
-  id: {
-    description: "The unique identifier for image-cropper",
-    type: "string"
-  },
-  type: {
-    description: "The type string of image-cropper",
-    type: "string",
-    default: "image-cropper"
-  },
-  appearance: {
-    description: "",
-    type: "object",
-    properties: {
-      class: {
-        type: "string"
-      },
-      style: {
-        type: "string"
-      }
-    },
-    default: {}
-  },
-  binding: {
-    description: "",
-    type: "object",
-    default: {}
-  },
-  disable: {
-    type: "string",
-    default: !1
-  },
-  editable: {
-    description: "",
-    type: "boolean",
-    default: !0
-  },
-  placeholder: {
-    description: "",
-    type: "string",
-    default: ""
-  },
-  readonly: {
-    description: "",
-    type: "boolean",
-    default: !1
-  },
-  require: {
-    description: "",
-    type: "boolean",
-    default: !1
-  },
-  tabindex: {
-    description: "",
-    type: "number",
-    default: -1
-  },
-  visible: {
-    description: "",
-    type: "boolean",
-    default: !0
-  }
-}, ht = [
-  "id",
-  "type"
-], ft = {
-  $schema: ut,
-  $id: st,
-  title: ot,
-  description: rt,
-  type: vt,
-  properties: ct,
-  required: ht
-}, dt = "image-cropper", gt = "A Farris Component", mt = "object", yt = {
-  basic: {
-    description: "Basic Infomation",
-    title: "基本信息",
-    properties: {
-      id: {
-        description: "组件标识",
-        title: "标识",
-        type: "string",
-        readonly: !0
-      },
-      type: {
-        description: "组件类型",
-        title: "控件类型",
-        type: "select",
-        editor: {
-          type: "waiting for modification",
-          enum: []
-        }
-      }
-    }
-  },
-  behavior: {
-    description: "Basic Infomation",
-    title: "行为",
-    properties: {
-      readonly: {
-        description: "",
-        title: "只读",
-        type: "string"
-      },
-      required: {
-        description: "",
-        title: "必填",
-        type: "boolean"
-      },
-      visible: {
-        description: "",
-        title: "可见",
-        type: "boolean"
-      },
-      placeholder: {
-        description: "",
-        title: "提示文本",
-        type: "string"
-      },
-      tabindex: {
-        description: "",
-        title: "tab索引",
-        type: "number"
-      }
-    }
-  }
-}, pt = {
-  title: dt,
-  description: gt,
-  type: mt,
-  categories: yt
-}, he = {
+import { inject as Ke, ref as h, onMounted as Ge, onUnmounted as Je, watch as Y, defineComponent as Ze, createVNode as H, withModifiers as O } from "vue";
+import { withInstall as Ye } from "../common/index.esm.js";
+const Xe = {
   /** 输出图片格式 */
   format: { type: String, default: "png" },
   /** 保持长宽比例 */
@@ -194,11 +57,11 @@ const nt = /* @__PURE__ */ new Map([
       y2: 1e4
     }
   }
-}, Ie = at(he, ft, nt, lt, pt);
-var ie = /* @__PURE__ */ ((a) => (a.Move = "move", a.Resize = "resize", a))(ie || {});
-function xt() {
-  function a(y) {
-    switch (typeof y == "string" && (y = c(y)), y) {
+};
+var ae = /* @__PURE__ */ ((a) => (a.Move = "move", a.Resize = "resize", a))(ae || {});
+function et() {
+  function a(g) {
+    switch (typeof g == "string" && (g = M(g)), g) {
       case 2:
         return { rotate: 0, flip: !0 };
       case 3:
@@ -217,113 +80,113 @@ function xt() {
         return { rotate: 0, flip: !1 };
     }
   }
-  function c(y) {
-    const t = new DataView(u(y));
+  function M(g) {
+    const t = new DataView(s(g));
     if (t.getUint16(0, !1) !== 65496)
       return -2;
-    const p = t.byteLength;
-    let d = 2;
-    for (; d < p; ) {
-      if (t.getUint16(d + 2, !1) <= 8)
+    const m = t.byteLength;
+    let v = 2;
+    for (; v < m; ) {
+      if (t.getUint16(v + 2, !1) <= 8)
         return -1;
-      const b = t.getUint16(d, !1);
-      if (d += 2, b === 65505) {
-        if (t.getUint32(d += 2, !1) !== 1165519206)
+      const b = t.getUint16(v, !1);
+      if (v += 2, b === 65505) {
+        if (t.getUint32(v += 2, !1) !== 1165519206)
           return -1;
-        const h = t.getUint16(d += 6, !1) === 18761;
-        d += t.getUint32(d + 4, h);
-        const D = t.getUint16(d, h);
-        d += 2;
-        for (let H = 0; H < D; H++)
-          if (t.getUint16(d + H * 12, h) === 274)
-            return t.getUint16(d + H * 12 + 8, h);
+        const d = t.getUint16(v += 6, !1) === 18761;
+        v += t.getUint32(v + 4, d);
+        const D = t.getUint16(v, d);
+        v += 2;
+        for (let U = 0; U < D; U++)
+          if (t.getUint16(v + U * 12, d) === 274)
+            return t.getUint16(v + U * 12 + 8, d);
       } else {
         if ((b & 65280) !== 65280)
           break;
-        d += t.getUint16(d, !1);
+        v += t.getUint16(v, !1);
       }
     }
     return -1;
   }
-  function u(y) {
-    y = y.replace(/^data:([^;]+);base64,/gmi, "");
-    const t = atob(y), p = t.length, d = new Uint8Array(p);
-    for (let b = 0; b < p; b++)
-      d[b] = t.charCodeAt(b);
-    return d.buffer;
-  }
-  function N(y, t, p) {
-    const d = y.width, b = y.height;
-    t = Math.round(t), p = Math.round(p);
-    const h = d / t, D = b / p, H = Math.ceil(h / 2), l = Math.ceil(D / 2), n = y.getContext("2d");
-    if (n) {
-      const C = n.getImageData(0, 0, d, b), g = n.createImageData(t, p), { data: _ } = C, $ = g.data;
-      for (let R = 0; R < p; R++)
-        for (let k = 0; k < t; k++) {
-          const j = (k + R * t) * 4, A = R * D;
-          let T = 0, v = 0, m = 0, q = 0, Q = 0, I = 0, M = 0;
-          const L = Math.floor(k * h), z = Math.floor(R * D);
-          let O = Math.ceil((k + 1) * h), G = Math.ceil((R + 1) * D);
-          O = Math.min(O, d), G = Math.min(G, b);
-          for (let S = z; S < G; S++) {
-            const x = Math.abs(A - S) / l, le = k * h, te = x * x;
-            for (let E = L; E < O; E++) {
-              const U = Math.abs(le - E) / H, W = Math.sqrt(te + U * U);
-              if (W >= 1)
+  function s(g) {
+    g = g.replace(/^data:([^;]+);base64,/gmi, "");
+    const t = atob(g), m = t.length, v = new Uint8Array(m);
+    for (let b = 0; b < m; b++)
+      v[b] = t.charCodeAt(b);
+    return v.buffer;
+  }
+  function $(g, t, m) {
+    const v = g.width, b = g.height;
+    t = Math.round(t), m = Math.round(m);
+    const d = v / t, D = b / m, U = Math.ceil(d / 2), u = Math.ceil(D / 2), i = g.getContext("2d");
+    if (i) {
+      const k = i.getImageData(0, 0, v, b), w = i.createImageData(t, m), { data: P } = k, V = w.data;
+      for (let F = 0; F < m; F++)
+        for (let E = 0; E < t; E++) {
+          const N = (E + F * t) * 4, A = F * D;
+          let T = 0, r = 0, f = 0, j = 0, q = 0, C = 0, y = 0;
+          const _ = Math.floor(E * d), X = Math.floor(F * D);
+          let Q = Math.ceil((E + 1) * d), K = Math.ceil((F + 1) * D);
+          Q = Math.min(Q, v), K = Math.min(K, b);
+          for (let I = X; I < K; I++) {
+            const c = Math.abs(A - I) / u, ie = E * d, ee = c * c;
+            for (let z = _; z < Q; z++) {
+              const S = Math.abs(ie - z) / U, p = Math.sqrt(ee + S * S);
+              if (p >= 1)
                 continue;
-              T = 2 * W * W * W - 3 * W * W + 1;
-              const F = 4 * (E + S * d);
-              M += T * _[F + 3], m += T, _[F + 3] < 255 && (T = T * _[F + 3] / 250), q += T * _[F], Q += T * _[F + 1], I += T * _[F + 2], v += T;
+              T = 2 * p * p * p - 3 * p * p + 1;
+              const B = 4 * (z + I * v);
+              y += T * P[B + 3], f += T, P[B + 3] < 255 && (T = T * P[B + 3] / 250), j += T * P[B], q += T * P[B + 1], C += T * P[B + 2], r += T;
             }
           }
-          $[j] = q / v, $[j + 1] = Q / v, $[j + 2] = I / v, $[j + 3] = M / m;
+          V[N] = j / r, V[N + 1] = q / r, V[N + 2] = C / r, V[N + 3] = y / f;
         }
-      y.width = t, y.height = p, n.putImageData(g, 0, 0);
+      g.width = t, g.height = m, i.putImageData(w, 0, 0);
     }
   }
   return {
-    resizeCanvas: N,
+    resizeCanvas: $,
     getTransformationsFromExifData: a
   };
 }
-function Mt(a, c, u, N) {
-  function y(l, n) {
-    a.value.x2 = a.value.x1 + (a.value.y2 - a.value.y1) * u.value, l = Math.max(a.value.x2 - c.value.width, 0), n = Math.max(0 - a.value.y1, 0), (l > 0 || n > 0) && (a.value.x2 -= n * u.value > l ? n * u.value : l, a.value.y1 += n * u.value > l ? n : l / u.value);
+function tt(a, M, s, $) {
+  function g(u, i) {
+    a.value.x2 = a.value.x1 + (a.value.y2 - a.value.y1) * s.value, u = Math.max(a.value.x2 - M.value.width, 0), i = Math.max(0 - a.value.y1, 0), (u > 0 || i > 0) && (a.value.x2 -= i * s.value > u ? i * s.value : u, a.value.y1 += i * s.value > u ? i : u / s.value);
   }
-  function t(l, n) {
-    a.value.x2 = a.value.x1 + (a.value.y2 - a.value.y1) * u.value, l = Math.max(a.value.x2 - c.value.width, 0), n = Math.max(a.value.y2 - c.value.height, 0), (l > 0 || n > 0) && (a.value.x2 -= n * u.value > l ? n * u.value : l, a.value.y2 -= n * u.value > l ? n : l / u.value);
+  function t(u, i) {
+    a.value.x2 = a.value.x1 + (a.value.y2 - a.value.y1) * s.value, u = Math.max(a.value.x2 - M.value.width, 0), i = Math.max(a.value.y2 - M.value.height, 0), (u > 0 || i > 0) && (a.value.x2 -= i * s.value > u ? i * s.value : u, a.value.y2 -= i * s.value > u ? i : u / s.value);
   }
-  function p(l, n) {
-    a.value.y1 = a.value.y2 - (a.value.x2 - a.value.x1) / u.value, l = Math.max(0 - a.value.x1, 0), n = Math.max(0 - a.value.y1, 0), (l > 0 || n > 0) && (a.value.x1 += n * u.value > l ? n * u.value : l, a.value.y1 += n * u.value > l ? n : l / u.value);
+  function m(u, i) {
+    a.value.y1 = a.value.y2 - (a.value.x2 - a.value.x1) / s.value, u = Math.max(0 - a.value.x1, 0), i = Math.max(0 - a.value.y1, 0), (u > 0 || i > 0) && (a.value.x1 += i * s.value > u ? i * s.value : u, a.value.y1 += i * s.value > u ? i : u / s.value);
   }
-  function d(l, n) {
-    a.value.y1 = a.value.y2 - (a.value.x2 - a.value.x1) / u.value, l = Math.max(a.value.x2 - c.value.width, 0), n = Math.max(0 - a.value.y1, 0), (l > 0 || n > 0) && (a.value.x2 -= n * u.value > l ? n * u.value : l, a.value.y1 += n * u.value > l ? n : l / u.value);
+  function v(u, i) {
+    a.value.y1 = a.value.y2 - (a.value.x2 - a.value.x1) / s.value, u = Math.max(a.value.x2 - M.value.width, 0), i = Math.max(0 - a.value.y1, 0), (u > 0 || i > 0) && (a.value.x2 -= i * s.value > u ? i * s.value : u, a.value.y1 += i * s.value > u ? i : u / s.value);
   }
-  function b(l, n) {
-    a.value.y2 = a.value.y1 + (a.value.x2 - a.value.x1) / u.value, l = Math.max(a.value.x2 - c.value.width, 0), n = Math.max(a.value.y2 - c.value.height, 0), (l > 0 || n > 0) && (a.value.x2 -= n * u.value > l ? n * u.value : l, a.value.y2 -= n * u.value > l ? n : l / u.value);
+  function b(u, i) {
+    a.value.y2 = a.value.y1 + (a.value.x2 - a.value.x1) / s.value, u = Math.max(a.value.x2 - M.value.width, 0), i = Math.max(a.value.y2 - M.value.height, 0), (u > 0 || i > 0) && (a.value.x2 -= i * s.value > u ? i * s.value : u, a.value.y2 -= i * s.value > u ? i : u / s.value);
   }
-  function h(l, n) {
-    a.value.y2 = a.value.y1 + (a.value.x2 - a.value.x1) / u.value, l = Math.max(0 - a.value.x1, 0), n = Math.max(a.value.y2 - c.value.height, 0), (l > 0 || n > 0) && (a.value.x1 += n * u.value > l ? n * u.value : l, a.value.y2 -= n * u.value > l ? n : l / u.value);
+  function d(u, i) {
+    a.value.y2 = a.value.y1 + (a.value.x2 - a.value.x1) / s.value, u = Math.max(0 - a.value.x1, 0), i = Math.max(a.value.y2 - M.value.height, 0), (u > 0 || i > 0) && (a.value.x1 += i * s.value > u ? i * s.value : u, a.value.y2 -= i * s.value > u ? i : u / s.value);
   }
   function D() {
-    a.value.x2 = a.value.x1 + (a.value.y2 - a.value.y1) * u.value, a.value.y2 = a.value.y1 + (a.value.x2 - a.value.x1) / u.value;
-    const l = Math.max(0 - a.value.x1, 0), n = Math.max(a.value.x2 - c.value.width, 0), C = Math.max(a.value.y2 - c.value.height, 0), g = Math.max(0 - a.value.y1, 0);
-    (l > 0 || n > 0 || C > 0 || g > 0) && (a.value.x1 += C * u.value > l ? C * u.value : l, a.value.x2 -= g * u.value > n ? g * u.value : n, a.value.y1 += g * u.value > n ? g : n / u.value, a.value.y2 -= C * u.value > l ? C : l / u.value);
+    a.value.x2 = a.value.x1 + (a.value.y2 - a.value.y1) * s.value, a.value.y2 = a.value.y1 + (a.value.x2 - a.value.x1) / s.value;
+    const u = Math.max(0 - a.value.x1, 0), i = Math.max(a.value.x2 - M.value.width, 0), k = Math.max(a.value.y2 - M.value.height, 0), w = Math.max(0 - a.value.y1, 0);
+    (u > 0 || i > 0 || k > 0 || w > 0) && (a.value.x1 += k * s.value > u ? k * s.value : u, a.value.x2 -= w * s.value > i ? w * s.value : i, a.value.y1 += w * s.value > i ? w : i / s.value, a.value.y2 -= k * s.value > u ? k : u / s.value);
   }
-  function H() {
-    if (c.value.width && c.value.height)
-      switch (N.position) {
+  function U() {
+    if (M.value.width && M.value.height)
+      switch ($.position) {
         case "top":
-          y(0, 0);
+          g(0, 0);
           break;
         case "bottom":
           t(0, 0);
           break;
         case "topleft":
-          p(0, 0);
+          m(0, 0);
           break;
         case "topright":
-          d(0, 0);
+          v(0, 0);
           break;
         case "right":
         case "bottomright":
@@ -331,26 +194,26 @@ function Mt(a, c, u, N) {
           break;
         case "left":
         case "bottomleft":
-          h(0, 0);
+          d(0, 0);
           break;
         case "center":
           D();
           break;
       }
   }
-  return { checkAspectRatio: H };
+  return { checkAspectRatio: U };
 }
-function Ce(a, c) {
-  const { resizeCanvas: u, getTransformationsFromExifData: N } = xt(), y = Me("NotifyService"), t = o(a.cropper), p = o(a.transform), d = o(a.cropperMinWidth), b = o(a.maintainAspectRatio), h = o(a.aspectRatio), D = o(a.autoCrop), H = o(a.backgroundColor), l = o(a.resizeToWidth), n = o(a.onlyScaleDown), C = o(a.containWithinAspectRatio), g = o(a.canvasRotation), _ = o(a.format), $ = o(a.imageQuality), R = o(a.resizeToHeight), k = o(a.cropperMinHeight), j = o(""), A = o(!0), T = o(!0);
-  let v, m, q = 0, Q, I, M;
-  const L = o(null), z = o(""), O = o(""), G = o("0px"), S = o(), x = o({ width: 100, height: 100 }), le = ie;
-  let te, E = 20, U = 20, W = !1, F = { rotate: 0, flip: !1 }, r = { active: !1, type: null, position: null, x1: 0, y1: 0, x2: 0, y2: 0, clientX: 0, clientY: 0 };
-  const fe = o(a.imageChangedEvent), ne = o(a.imageURL), Ae = o(a.imageBase64), Te = o(a.imageFile);
-  function ze() {
-    O.value = "scaleX(" + (p.value.scale || 1) * (p.value.flipH ? -1 : 1) + ")scaleY(" + (p.value.scale || 1) * (p.value.flipV ? -1 : 1) + ")rotate(" + (p.value.rotate || 0) + "deg)";
-  }
-  function Y() {
-    T.value = !1, S.value = null, j.value = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII=", r = {
+function at(a, M) {
+  const { resizeCanvas: s, getTransformationsFromExifData: $ } = et(), g = Ke("NotifyService"), t = h(a.cropper), m = h(a.transform), v = h(a.cropperMinWidth), b = h(a.maintainAspectRatio), d = h(a.aspectRatio), D = h(a.autoCrop), U = h(a.backgroundColor), u = h(a.resizeToWidth), i = h(a.onlyScaleDown), k = h(a.containWithinAspectRatio), w = h(a.canvasRotation), P = h(a.format), V = h(a.imageQuality), F = h(a.resizeToHeight), E = h(a.cropperMinHeight), N = h(""), A = h(!0), T = h(!0);
+  let r, f, j = 0, q, C, y;
+  const _ = h(null), X = h(""), Q = h(""), K = h("0px"), I = h(), c = h({ width: 100, height: 100 }), ie = ae;
+  let ee, z = 20, S = 20, p = !1, B = { rotate: 0, flip: !1 }, o = { active: !1, type: null, position: null, x1: 0, y1: 0, x2: 0, y2: 0, clientX: 0, clientY: 0 };
+  const fe = h(a.imageChangedEvent), ue = h(a.imageURL), Me = h(a.imageBase64), we = h(a.imageFile);
+  function be() {
+    Q.value = "scaleX(" + (m.value.scale || 1) * (m.value.flipH ? -1 : 1) + ")scaleY(" + (m.value.scale || 1) * (m.value.flipV ? -1 : 1) + ")rotate(" + (m.value.rotate || 0) + "deg)";
+  }
+  function J() {
+    T.value = !1, I.value = null, N.value = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII=", o = {
       active: !1,
       type: null,
       position: null,
@@ -360,313 +223,313 @@ function Ce(a, c) {
       y2: 0,
       clientX: 0,
       clientY: 0
-    }, x.value = {
+    }, c.value = {
       width: 0,
       height: 0
-    }, v = {
+    }, r = {
       width: 0,
       height: 0
-    }, m = {
+    }, f = {
       width: 0,
       height: 0
     }, t.value.x1 = -100, t.value.y1 = -100, t.value.x2 = 1e4, t.value.y2 = 1e4;
   }
-  function Se(e) {
+  function Ce(e) {
     return /image\/(png|jpg|jpeg|bmp|gif|tiff|webp)/.test(e);
   }
-  function ke() {
-    if (g.value += F.rotate, C.value && v.width && v.height) {
-      if (g.value % 2) {
-        const s = v.width * h.value, w = v.height / h.value;
+  function Ie() {
+    if (w.value += B.rotate, k.value && r.width && r.height) {
+      if (w.value % 2) {
+        const n = r.width * d.value, x = r.height / d.value;
         return {
-          width: Math.max(v.height, s),
-          height: Math.max(v.width, w)
+          width: Math.max(r.height, n),
+          height: Math.max(r.width, x)
         };
       }
-      const e = v.height * h.value, i = v.width / h.value;
+      const e = r.height * d.value, l = r.width / d.value;
       return {
-        width: Math.max(v.width, e),
-        height: Math.max(v.height, i)
+        width: Math.max(r.width, e),
+        height: Math.max(r.height, l)
       };
     }
-    return g.value % 2 ? {
-      height: v.width,
-      width: v.height
+    return w.value % 2 ? {
+      height: r.width,
+      width: r.height
     } : {
-      width: v.width,
-      height: v.height
+      width: r.width,
+      height: r.height
     };
   }
-  function We() {
-    g.value += F.rotate;
-    const e = ke(), i = document.createElement("canvas");
-    e.width && e.height && (i.width = e.width, i.height = e.height);
-    const s = i.getContext("2d");
-    return v.width && v.height && M && (s == null || s.setTransform(F.flip ? -1 : 1, 0, 0, 1, i.width / 2, i.height / 2), s == null || s.rotate(Math.PI * (g.value / 2)), s == null || s.drawImage(M, -v.width / 2, -v.height / 2)), i.toDataURL();
-  }
-  function Be(e) {
-    return new Promise((i) => {
-      te = e, j.value = e, S.value = new Image(), S.value.onload = () => {
-        var s, w;
-        m.width = (s = S.value) == null ? void 0 : s.naturalWidth, m.height = (w = S.value) == null ? void 0 : w.naturalHeight, i();
-      }, S.value.src = te;
+  function Ae() {
+    w.value += B.rotate;
+    const e = Ie(), l = document.createElement("canvas");
+    e.width && e.height && (l.width = e.width, l.height = e.height);
+    const n = l.getContext("2d");
+    return r.width && r.height && y && (n == null || n.setTransform(B.flip ? -1 : 1, 0, 0, 1, l.width / 2, l.height / 2), n == null || n.rotate(Math.PI * (w.value / 2)), n == null || n.drawImage(y, -r.width / 2, -r.height / 2)), l.toDataURL();
+  }
+  function Te(e) {
+    return new Promise((l) => {
+      ee = e, N.value = e, I.value = new Image(), I.value.onload = () => {
+        var n, x;
+        f.width = (n = I.value) == null ? void 0 : n.naturalWidth, f.height = (x = I.value) == null ? void 0 : x.naturalHeight, l();
+      }, I.value.src = ee;
     });
   }
-  function de() {
-    if (!M || !M.complete || !F)
+  function ce() {
+    if (!y || !y.complete || !B)
       return Promise.reject(new Error("No image loaded"));
-    const e = We();
-    return Be(e);
+    const e = Ae();
+    return Te(e);
   }
-  function ue(e) {
-    const i = (s) => {
-      y.show({
+  function ne(e) {
+    const l = (n) => {
+      g.show({
         showCloseButton: !1,
         timeout: 3e3,
         animate: "fadeIn",
         toasts: [{ type: "string", title: "提示", msg: "图片上传错误，请重试" }]
-      }), A.value = !1, W = !0, c.emit("loadImageFailed"), M = null, z.value = "";
+      }), A.value = !1, p = !0, M.emit("loadImageFailed"), y = null, X.value = "";
     };
-    M = new Image(), M.onload = () => {
-      z.value = e, F = N(e), v.width = M == null ? void 0 : M.naturalWidth, v.height = M == null ? void 0 : M.naturalHeight, de().then(() => {
-        W = !1;
-      }).catch(i);
-    }, M.onerror = i, M.src = e;
-  }
-  function He(e, i) {
-    Se(i) ? (W = !1, ue(e)) : (y.show({
+    y = new Image(), y.onload = () => {
+      X.value = e, B = $(e), r.width = y == null ? void 0 : y.naturalWidth, r.height = y == null ? void 0 : y.naturalHeight, ce().then(() => {
+        p = !1;
+      }).catch(l);
+    }, y.onerror = l, y.src = e;
+  }
+  function pe(e, l) {
+    Ce(l) ? (p = !1, ne(e)) : (g.show({
       showCloseButton: !1,
       timeout: 3e3,
       animate: "fadeIn",
       toasts: [{ type: "string", title: "提示", msg: "图片类型不正确,请重试" }]
-    }), A.value = !1, W = !0, c.emit("loadImageFailed"));
+    }), A.value = !1, p = !0, M.emit("loadImageFailed"));
   }
-  function ge(e) {
-    const i = new FileReader();
-    i.onload = (s) => He(s.target.result, e.type), i.readAsDataURL(e);
+  function de(e) {
+    const l = new FileReader();
+    l.onload = (n) => pe(n.target.result, e.type), l.readAsDataURL(e);
   }
-  function me(e) {
-    const i = new Image();
-    i.onerror = () => {
-      y.show({
+  function ge(e) {
+    const l = new Image();
+    l.onerror = () => {
+      g.show({
         showCloseButton: !1,
         timeout: 3e3,
         animate: "fadeIn",
         toasts: [{ type: "string", title: "提示", msg: "图片加载错误，请重试" }]
-      }), A.value = !1, W = !0, c.emit("loadImageFailed");
-    }, i.onload = () => {
-      W = !1;
-      const s = document.createElement("canvas"), w = s.getContext("2d");
-      s.width = i.width, s.height = i.height, w == null || w.drawImage(i, 0, 0), ue(s.toDataURL());
-    }, i.crossOrigin = "anonymous", i.src = e;
+      }), A.value = !1, p = !0, M.emit("loadImageFailed");
+    }, l.onload = () => {
+      p = !1;
+      const n = document.createElement("canvas"), x = n.getContext("2d");
+      n.width = l.width, n.height = l.height, x == null || x.drawImage(l, 0, 0), ne(n.toDataURL());
+    }, l.crossOrigin = "anonymous", l.src = e;
   }
-  function Le() {
-    return L.value && L.value && L.value.offsetWidth > 0;
+  function We() {
+    return _.value && _.value && _.value.offsetWidth > 0;
   }
   function se() {
-    if (L.value) {
-      const e = L.value;
-      x.value.width = e.offsetWidth, x.value.height = e.offsetHeight, G.value = "calc(50% - " + x.value.width / 2 + "px)";
+    if (_.value) {
+      const e = _.value;
+      c.value.width = e.offsetWidth, c.value.height = e.offsetHeight, K.value = "calc(50% - " + c.value.width / 2 + "px)";
     }
   }
-  function Ee() {
-    S.value && x.value.width && (E = d.value > 0 ? Math.max(20, d.value / S.value.width * x.value.width) : 20);
+  function ke() {
+    I.value && c.value.width && (z = v.value > 0 ? Math.max(20, v.value / I.value.width * c.value.width) : 20);
   }
-  function Ue() {
-    b.value ? U = Math.max(20, E / h.value) : k.value > 0 && S.value && x.value.height ? U = Math.max(20, k.value / S.value.height * x.value.height) : U = 20;
+  function ze() {
+    b.value ? S = Math.max(20, z / d.value) : E.value > 0 && I.value && c.value.height ? S = Math.max(20, E.value / I.value.height * c.value.height) : S = 20;
   }
   function oe() {
-    S.value ? (Ee(), Ue()) : (E = 20, U = 20);
-  }
-  function De() {
-    const e = L.value, i = o({ x1: 0, x2: 0, y1: 0, y2: 0 });
-    if (e && m.width && m.height) {
-      const s = m.width / e.offsetWidth;
-      i.value = {
-        x1: Math.round(t.value.x1 * s),
-        y1: Math.round(t.value.y1 * s),
-        x2: Math.round(t.value.x2 * s),
-        y2: Math.round(t.value.y2 * s)
-      }, C.value || (i.value.x1 = Math.max(i.value.x1, 0), i.value.y1 = Math.max(i.value.y1, 0), i.value.x2 = Math.min(i.value.x2, m.width), i.value.y2 = Math.min(i.value.y2, m.height));
+    I.value ? (ke(), ze()) : (z = 20, S = 20);
+  }
+  function He() {
+    const e = _.value, l = h({ x1: 0, x2: 0, y1: 0, y2: 0 });
+    if (e && f.width && f.height) {
+      const n = f.width / e.offsetWidth;
+      l.value = {
+        x1: Math.round(t.value.x1 * n),
+        y1: Math.round(t.value.y1 * n),
+        x2: Math.round(t.value.x2 * n),
+        y2: Math.round(t.value.y2 * n)
+      }, k.value || (l.value.x1 = Math.max(l.value.x1, 0), l.value.y1 = Math.max(l.value.y1, 0), l.value.x2 = Math.min(l.value.x2, f.width), l.value.y2 = Math.min(l.value.y2, f.height));
     }
-    return i.value;
-  }
-  function _e() {
-    g.value += F.rotate;
-    const e = L.value, i = o({ x1: 0, x2: 0, y1: 0, y2: 0 });
-    if (e && m.height && m.width && v.height && v.width) {
-      const s = m.width / e.offsetWidth;
-      let w, B;
-      g.value % 2 ? (w = (m.width - v.height) / 2, B = (m.height - v.width) / 2) : (w = (m.width - v.width) / 2, B = (m.height - v.height) / 2), i.value = {
-        x1: Math.round(t.value.x1 * s) - w,
-        y1: Math.round(t.value.y1 * s) - B,
-        x2: Math.round(t.value.x2 * s) - w,
-        y2: Math.round(t.value.y2 * s) - B
-      }, C.value || (i.value.x1 = Math.max(i.value.x1, 0), i.value.y1 = Math.max(i.value.y1, 0), i.value.x2 = Math.min(i.value.x2, m.width), i.value.y2 = Math.min(i.value.y2, m.height));
+    return l.value;
+  }
+  function Se() {
+    w.value += B.rotate;
+    const e = _.value, l = h({ x1: 0, x2: 0, y1: 0, y2: 0 });
+    if (e && f.height && f.width && r.height && r.width) {
+      const n = f.width / e.offsetWidth;
+      let x, W;
+      w.value % 2 ? (x = (f.width - r.height) / 2, W = (f.height - r.width) / 2) : (x = (f.width - r.width) / 2, W = (f.height - r.height) / 2), l.value = {
+        x1: Math.round(t.value.x1 * n) - x,
+        y1: Math.round(t.value.y1 * n) - W,
+        x2: Math.round(t.value.x2 * n) - x,
+        y2: Math.round(t.value.y2 * n) - W
+      }, k.value || (l.value.x1 = Math.max(l.value.x1, 0), l.value.y1 = Math.max(l.value.y1, 0), l.value.x2 = Math.min(l.value.x2, f.width), l.value.y2 = Math.min(l.value.y2, f.height));
     }
-    return i.value;
-  }
-  function $e(e, i) {
-    if (l.value > 0) {
-      if (!n.value || e > l.value)
-        return l.value / e;
-    } else if (R.value > 0 && (!n.value || i > R.value))
-      return R.value / i;
+    return l.value;
+  }
+  function Ue(e, l) {
+    if (u.value > 0) {
+      if (!i.value || e > u.value)
+        return u.value / e;
+    } else if (F.value > 0 && (!i.value || l > F.value))
+      return F.value / l;
     return 1;
   }
-  function Re() {
-    return Math.min(1, Math.max(0, $.value / 100));
+  function _e() {
+    return Math.min(1, Math.max(0, V.value / 100));
   }
-  function Fe(e) {
-    return e.toDataURL("image/" + _.value, Re());
+  function Be(e) {
+    return e.toDataURL("image/" + P.value, _e());
   }
-  function Pe() {
-    if (L.value && L.value && S.value != null) {
-      const e = De(), i = e.x2 - e.x1, s = e.y2 - e.y1, w = document.createElement("canvas");
-      w.width = i, w.height = s;
-      const B = w.getContext("2d");
-      if (B) {
-        H.value != null && (B.fillStyle = H.value, B.fillRect(0, 0, i, s));
-        const K = (p.value.scale || 1) * (p.value.flipH ? -1 : 1), J = (p.value.scale || 1) * (p.value.flipV ? -1 : 1);
-        m.width && m.height && (B.setTransform(K, 0, 0, J, m.width / 2, m.height / 2), B.translate(-e.x1 / K, -e.y1 / J), B.rotate((p.value.rotate || 0) * Math.PI / 180), B.drawImage(S.value, -m.width / 2, -m.height / 2));
-        const V = {
-          width: i,
-          height: s,
+  function Ee() {
+    if (_.value && _.value && I.value != null) {
+      const e = He(), l = e.x2 - e.x1, n = e.y2 - e.y1, x = document.createElement("canvas");
+      x.width = l, x.height = n;
+      const W = x.getContext("2d");
+      if (W) {
+        U.value != null && (W.fillStyle = U.value, W.fillRect(0, 0, l, n));
+        const R = (m.value.scale || 1) * (m.value.flipH ? -1 : 1), G = (m.value.scale || 1) * (m.value.flipV ? -1 : 1);
+        f.width && f.height && (W.setTransform(R, 0, 0, G, f.width / 2, f.height / 2), W.translate(-e.x1 / R, -e.y1 / G), W.rotate((m.value.rotate || 0) * Math.PI / 180), W.drawImage(I.value, -f.width / 2, -f.height / 2));
+        const L = {
+          width: l,
+          height: n,
           imagePosition: e,
           cropperPosition: { ...t.value }
         };
-        C.value && (V.offsetImagePosition = _e());
-        const X = $e(i, s);
-        return X !== 1 && (V.width = Math.round(i * X), V.height = b.value ? Math.round(V.width / h.value) : Math.round(s * X), u(w, V.width, V.height)), V.base64 = Fe(w), c.emit("imageCropped", V), V;
+        k.value && (L.offsetImagePosition = Se());
+        const Z = Ue(l, n);
+        return Z !== 1 && (L.width = Math.round(l * Z), L.height = b.value ? Math.round(L.width / d.value) : Math.round(n * Z), s(x, L.width, L.height)), L.base64 = Be(x), M.emit("imageCropped", L), L;
       }
     }
     return null;
   }
-  function ae() {
-    D.value && Pe();
+  function te() {
+    D.value && Ee();
   }
-  function ye() {
-    const e = L.value;
+  function me() {
+    const e = _.value;
     if (e) {
       if (!b.value)
         t.value.x1 = 0, t.value.x2 = e.offsetWidth, t.value.y1 = 0, t.value.y2 = e.offsetHeight;
-      else if (e.offsetWidth / h.value < e.offsetHeight) {
+      else if (e.offsetWidth / d.value < e.offsetHeight) {
         t.value.x1 = 0, t.value.x2 = e.offsetWidth;
-        const i = e.offsetWidth / h.value;
-        t.value.y1 = (e.offsetHeight - i) / 2, t.value.y2 = t.value.y1 + i;
+        const l = e.offsetWidth / d.value;
+        t.value.y1 = (e.offsetHeight - l) / 2, t.value.y2 = t.value.y1 + l;
       } else {
         t.value.y1 = 0, t.value.y2 = e.offsetHeight;
-        const i = e.offsetHeight * h.value;
-        t.value.x1 = (e.offsetWidth - i) / 2, t.value.x2 = t.value.x1 + i;
+        const l = e.offsetHeight * d.value;
+        t.value.x1 = (e.offsetWidth - l) / 2, t.value.x2 = t.value.x1 + l;
       }
-      ae(), T.value = !0;
+      te(), T.value = !0;
     }
   }
-  function pe() {
-    q > 40 ? (y.show({
+  function ye() {
+    j > 40 ? (g.show({
       showCloseButton: !1,
       timeout: 3e3,
       animate: "fadeIn",
       toasts: [{ type: "string", title: "提示", msg: "图片加载超时，请重试" }]
-    }), W = !0, A.value = !1, c.emit("loadImageFailed")) : Le() ? (W = !1, se(), oe(), ye(), c.emit("cropperReady", { ...x.value })) : (q++, setTimeout(() => pe(), 50));
+    }), p = !0, A.value = !1, M.emit("loadImageFailed")) : We() ? (p = !1, se(), oe(), me(), M.emit("cropperReady", { ...c.value })) : (j++, setTimeout(() => ye(), 50));
   }
-  function Ve() {
-    S.value != null && (A.value = !1, c.emit("imageLoaded"), q = 0, setTimeout(() => pe()));
+  function Le() {
+    I.value != null && (A.value = !1, M.emit("imageLoaded"), j = 0, setTimeout(() => ye()));
   }
-  function je() {
-    const e = L.value;
-    (x.value.width !== (e == null ? void 0 : e.offsetWidth) || x.value.height !== (e == null ? void 0 : e.offsetHeight)) && x.value.width && x.value.height && e && (t.value.x1 = t.value.x1 * e.offsetWidth / x.value.width, t.value.x2 = t.value.x2 * e.offsetWidth / x.value.width, t.value.y1 = t.value.y1 * e.offsetHeight / x.value.height, t.value.y2 = t.value.y2 * e.offsetHeight / x.value.height);
+  function De() {
+    const e = _.value;
+    (c.value.width !== (e == null ? void 0 : e.offsetWidth) || c.value.height !== (e == null ? void 0 : e.offsetHeight)) && c.value.width && c.value.height && e && (t.value.x1 = t.value.x1 * e.offsetWidth / c.value.width, t.value.x2 = t.value.x2 * e.offsetWidth / c.value.width, t.value.y1 = t.value.y1 * e.offsetHeight / c.value.height, t.value.y2 = t.value.y2 * e.offsetHeight / c.value.height);
   }
-  const qe = () => {
-    je(), se(), oe();
+  const Fe = () => {
+    De(), se(), oe();
   }, xe = () => {
-    clearTimeout(I), I = setTimeout(qe, 300);
+    clearTimeout(C), C = setTimeout(Fe, 300);
   };
-  be(() => {
-    window.addEventListener("resize", xe), ne.value && (Y(), A.value = !0, me(ne.value));
-  }), et(() => {
+  Ge(() => {
+    window.addEventListener("resize", xe), ue.value && (J(), A.value = !0, ge(ue.value));
+  }), Je(() => {
     window.removeEventListener("resize", xe);
   });
-  function Ne() {
-    r.active && (r.active = !1, ae());
+  function Pe() {
+    o.active && (o.active = !1, te());
   }
-  function re(e) {
+  function he(e) {
     return (e.touches && e.touches[0] ? e.touches[0].clientX : e.clientX) || 0;
   }
-  function ve(e) {
+  function re(e) {
     return (e.touches && e.touches[0] ? e.touches[0].clientY : e.clientY) || 0;
   }
-  function Oe(e, i, s = null) {
-    r && r.active || (e.preventDefault && e.preventDefault(), r = {
+  function Ve(e, l, n = null) {
+    o && o.active || (e.preventDefault && e.preventDefault(), o = {
       active: !0,
-      type: i,
-      position: s,
-      clientX: re(e),
-      clientY: ve(e),
+      type: l,
+      position: n,
+      clientX: he(e),
+      clientY: re(e),
       ...t.value
     });
   }
-  function ce(e = !1) {
-    t.value.x1 < 0 && (t.value.x2 -= e ? t.value.x1 : 0, t.value.x1 = 0), t.value.y1 < 0 && (t.value.y2 -= e ? t.value.y1 : 0, t.value.y1 = 0), t.value.x2 > x.value.width && (t.value.x1 -= e ? t.value.x2 - x.value.width : 0, t.value.x2 = x.value.width), t.value.y2 > x.value.height && (t.value.y1 -= e ? t.value.y2 - x.value.height : 0, t.value.y2 = x.value.height);
+  function ve(e = !1) {
+    t.value.x1 < 0 && (t.value.x2 -= e ? t.value.x1 : 0, t.value.x1 = 0), t.value.y1 < 0 && (t.value.y2 -= e ? t.value.y1 : 0, t.value.y1 = 0), t.value.x2 > c.value.width && (t.value.x1 -= e ? t.value.x2 - c.value.width : 0, t.value.x2 = c.value.width), t.value.y2 > c.value.height && (t.value.y1 -= e ? t.value.y2 - c.value.height : 0, t.value.y2 = c.value.height);
   }
-  function Qe(e) {
-    const i = re(e) - r.clientX, s = ve(e) - r.clientY;
-    t.value.x1 = r.x1 + i, t.value.y1 = r.y1 + s, t.value.x2 = r.x2 + i, t.value.y2 = r.y2 + s;
+  function Ne(e) {
+    const l = he(e) - o.clientX, n = re(e) - o.clientY;
+    t.value.x1 = o.x1 + l, t.value.y1 = o.y1 + n, t.value.x2 = o.x2 + l, t.value.y2 = o.y2 + n;
   }
-  const { checkAspectRatio: Ke } = Mt(t, x, h, r);
-  function Ge(e) {
-    const i = re(e) - r.clientX, s = ve(e) - r.clientY;
-    switch (r.position) {
+  const { checkAspectRatio: je } = tt(t, c, d, o);
+  function Re(e) {
+    const l = he(e) - o.clientX, n = re(e) - o.clientY;
+    switch (o.position) {
       case "left":
-        t.value.x1 = Math.min(r.x1 + i, t.value.x2 - E);
+        t.value.x1 = Math.min(o.x1 + l, t.value.x2 - z);
         break;
       case "topleft":
-        t.value.x1 = Math.min(r.x1 + i, t.value.x2 - E), t.value.y1 = Math.min(r.y1 + s, t.value.y2 - U);
+        t.value.x1 = Math.min(o.x1 + l, t.value.x2 - z), t.value.y1 = Math.min(o.y1 + n, t.value.y2 - S);
         break;
       case "top":
-        t.value.y1 = Math.min(r.y1 + s, t.value.y2 - U);
+        t.value.y1 = Math.min(o.y1 + n, t.value.y2 - S);
         break;
       case "topright":
-        t.value.x2 = Math.max(r.x2 + i, t.value.x1 + E), t.value.y1 = Math.min(r.y1 + s, t.value.y2 - U);
+        t.value.x2 = Math.max(o.x2 + l, t.value.x1 + z), t.value.y1 = Math.min(o.y1 + n, t.value.y2 - S);
         break;
       case "right":
-        t.value.x2 = Math.max(r.x2 + i, t.value.x1 + E);
+        t.value.x2 = Math.max(o.x2 + l, t.value.x1 + z);
         break;
       case "bottomright":
-        t.value.x2 = Math.max(r.x2 + i, t.value.x1 + E), t.value.y2 = Math.max(r.y2 + s, t.value.y1 + U);
+        t.value.x2 = Math.max(o.x2 + l, t.value.x1 + z), t.value.y2 = Math.max(o.y2 + n, t.value.y1 + S);
         break;
       case "bottom":
-        t.value.y2 = Math.max(r.y2 + s, t.value.y1 + U);
+        t.value.y2 = Math.max(o.y2 + n, t.value.y1 + S);
         break;
       case "bottomleft":
-        t.value.x1 = Math.min(r.x1 + i, t.value.x2 - E), t.value.y2 = Math.max(r.y2 + s, t.value.y1 + U);
+        t.value.x1 = Math.min(o.x1 + l, t.value.x2 - z), t.value.y2 = Math.max(o.y2 + n, t.value.y1 + S);
         break;
       case "center":
-        const { scale: w } = e, B = Math.abs(r.x2 - r.x1) * w, K = Math.abs(r.y2 - r.y1) * w, { x1: J } = t.value, { y1: V } = t.value;
-        t.value.x1 = Math.min(r.clientX - B / 2, t.value.x2 - E), t.value.y1 = Math.min(r.clientY - K / 2, t.value.y2 - U), t.value.x2 = Math.max(r.clientX + B / 2, J + E), t.value.y2 = Math.max(r.clientY + K / 2, V + U);
+        const { scale: x } = e, W = Math.abs(o.x2 - o.x1) * x, R = Math.abs(o.y2 - o.y1) * x, { x1: G } = t.value, { y1: L } = t.value;
+        t.value.x1 = Math.min(o.clientX - W / 2, t.value.x2 - z), t.value.y1 = Math.min(o.clientY - R / 2, t.value.y2 - S), t.value.x2 = Math.max(o.clientX + W / 2, G + z), t.value.y2 = Math.max(o.clientY + R / 2, L + S);
         break;
     }
-    b.value && Ke();
+    b.value && je();
   }
-  function Je(e) {
-    r && r.active && (e.stopPropagation && e.stopPropagation(), e.preventDefault && e.preventDefault(), clearTimeout(Q), Q = setTimeout(() => {
-      r.type === ie.Move ? (Qe(e), ce(!0)) : r.type === ie.Resize && (Ge(e), ce(!1));
+  function $e(e) {
+    o && o.active && (e.stopPropagation && e.stopPropagation(), e.preventDefault && e.preventDefault(), clearTimeout(q), q = setTimeout(() => {
+      o.type === ae.Move ? (Ne(e), ve(!0)) : o.type === ae.Resize && (Re(e), ve(!1));
     }, 300));
   }
-  return ee(fe, (e) => {
-    Y(), e && e.target && e.target.files && e.target.files.length > 0 && (A.value = !0, ge(e.target.files[0]));
-  }), ee(ne, (e) => {
-    e ? (Y(), A.value = !0, me(e)) : (y.show({
+  return Y(fe, (e) => {
+    J(), e && e.target && e.target.files && e.target.files.length > 0 && (A.value = !0, de(e.target.files[0]));
+  }), Y(ue, (e) => {
+    e ? (J(), A.value = !0, ge(e)) : (g.show({
       showCloseButton: !1,
       timeout: 3e3,
       animate: "fadeIn",
       toasts: [{ type: "string", title: "提示", msg: "图片路径为空" }]
-    }), A.value = !1, W = !0);
-  }), ee(Ae, (e) => {
-    Y(), A.value = !0, ue(e);
-  }), ee(Te, (e) => {
-    Y(), e && (A.value = !0, ge(e));
-  }), ee(
+    }), A.value = !1, p = !0);
+  }), Y(Me, (e) => {
+    J(), A.value = !0, ne(e);
+  }), Y(we, (e) => {
+    J(), e && (A.value = !0, de(e));
+  }), Y(
     () => [
       a.containWithinAspectRatio,
       a.canvasRotation,
@@ -675,258 +538,141 @@ function Ce(a, c) {
       a.transform,
       a.imageChangedEvent
     ],
-    ([e, i, s, w, B, K], [J, V, X, Ze, Ye, Xe]) => {
-      M && M.complete && F && (e !== J || i !== V) && de(), s !== X && (se(), oe(), ce(!1), ae()), w !== Ze && T.value && ye(), B !== Ye && (ze(), ae()), K !== Xe && (fe.value = K);
+    ([e, l, n, x, W, R], [G, L, Z, qe, Oe, Qe]) => {
+      y && y.complete && B && (e !== G || l !== L) && ce(), n !== Z && (se(), oe(), ve(!1), te()), x !== qe && T.value && me(), W !== Oe && (be(), te()), R !== Qe && (fe.value = R);
     }
   ), {
-    uploadError: W,
+    uploadError: p,
     imageVisible: T,
-    backgroundColor: H,
-    sourceImage: L,
-    safeImgDataUrl: j,
-    safeTransformStyle: O,
-    maxSize: x,
+    backgroundColor: U,
+    sourceImage: _,
+    safeImgDataUrl: N,
+    safeTransformStyle: Q,
+    maxSize: c,
     cropper: t,
-    marginLeft: G,
-    moveTypes: le,
+    marginLeft: K,
+    moveTypes: ie,
     isLoading: A,
-    startMove: Oe,
-    imageLoadedInView: Ve,
-    moveStop: Ne,
-    moveImg: Je
+    startMove: Ve,
+    imageLoadedInView: Le,
+    moveStop: Pe,
+    moveImg: $e
   };
 }
-const Z = /* @__PURE__ */ we({
+const le = /* @__PURE__ */ Ze({
   name: "FImageCropper",
-  props: he,
+  props: Xe,
   emits: ["imageCropped", "imageLoaded", "cropperReady", "loadImageFailed"],
-  setup(a, c) {
-    const u = o(a.alignImage), N = o(a.roundCropper), y = o(a.hideResizeSquares), t = o(a.loadImageErrorText), p = o(a.disabled), d = o(null), {
+  setup(a, M) {
+    const s = h(a.alignImage), $ = h(a.roundCropper), g = h(a.hideResizeSquares), t = h(a.loadImageErrorText), m = h(a.disabled), v = h(null), {
       uploadError: b,
-      imageVisible: h,
+      imageVisible: d,
       backgroundColor: D,
-      sourceImage: H,
-      safeImgDataUrl: l,
-      safeTransformStyle: n,
-      maxSize: C,
-      cropper: g,
-      marginLeft: _,
-      moveTypes: $,
-      isLoading: R,
-      startMove: k,
-      imageLoadedInView: j,
+      sourceImage: U,
+      safeImgDataUrl: u,
+      safeTransformStyle: i,
+      maxSize: k,
+      cropper: w,
+      marginLeft: P,
+      moveTypes: V,
+      isLoading: F,
+      startMove: E,
+      imageLoadedInView: N,
       moveStop: A,
       moveImg: T
-    } = Ce(a, c);
-    function v(I) {
-      return f("span", {
-        class: `farris-image-cropper-resize-bar ${I}`,
-        onMousedown: P((M) => k(M, $.Resize, I), ["prevent"])
+    } = at(a, M);
+    function r(C) {
+      return H("span", {
+        class: `farris-image-cropper-resize-bar ${C}`,
+        onMousedown: O((y) => E(y, V.Resize, C), ["prevent"])
       }, null);
     }
-    function m(I) {
-      return f("div", null, [f("span", {
-        class: `farris-image-cropper-resize-bar ${I}`,
-        onMousedown: P((M) => k(M, $.Resize, I), ["prevent"])
-      }, [f("span", {
+    function f(C) {
+      return H("div", null, [H("span", {
+        class: `farris-image-cropper-resize-bar ${C}`,
+        onMousedown: O((y) => E(y, V.Resize, C), ["prevent"])
+      }, [H("span", {
         class: "farris-image-cropper-square"
-      }, null)]), f("span", {
+      }, null)]), H("span", {
         class: "farris-image-cropper-resize top"
-      }, [f("span", {
+      }, [H("span", {
         class: "farris-image-cropper-square"
       }, null)])]);
     }
-    const q = ["top", "right", "bottom", "left"].map((I) => v(I)), Q = ["topleft", "topright", "bottomright", "bottomleft"].map((I) => m(I));
-    return () => f("div", {
+    const j = ["top", "right", "bottom", "left"].map((C) => r(C)), q = ["topleft", "topright", "bottomright", "bottomleft"].map((C) => f(C));
+    return () => H("div", {
       class: ["farris-image-cropper-frame", {
-        "farris-image-cropper-disabled": p.value
+        "farris-image-cropper-disabled": m.value
       }],
       style: {
-        "text-align": u.value
+        "text-align": s.value
       },
-      onMousemove: P((I) => T(I), ["prevent"]),
-      onTouchmove: P((I) => T(I), ["prevent"]),
-      onMouseup: P(() => A(), ["prevent"]),
-      onTouchend: P(() => A(), ["prevent"])
-    }, [!b && f("div", {
-      ref: d,
-      class: "farris-image-cropper",
-      style: [{
-        background: h.value ? D.value : ""
-      }]
-    }, [l.value && f("img", {
-      title: "farris-source-image",
-      ref: H,
-      class: "farris-source-image",
-      style: [{
-        visibility: h.value ? "visible" : "hidden"
-      }, {
-        transform: n.value
-      }],
-      src: l.value,
-      onLoad: () => j()
-    }, null), C.value && f("div", {
-      class: "farris-image-overlay",
-      style: [{
-        width: `${C.value.width || 0}px`
-      }, {
-        height: `${C.value.height || 0}px`
-      }, {
-        "margin-left": u.value === "center" ? _.value : ""
-      }]
-    }, null), h.value && f("div", {
-      class: ["farris-image-cropper-wrapper", {
-        "farris-image-cropper-rounded": N.value
-      }],
-      style: [{
-        top: `${g.value.y1}px`
-      }, {
-        left: `${g.value.x1}px`
-      }, {
-        width: `${g.value.x2 - g.value.x1}px`
-      }, {
-        height: `${g.value.y2 - g.value.y1}px`
-      }, {
-        visibility: h.value ? "visible" : "hidden"
-      }, {
-        "margin-left": u.value === "center" ? _.value : ""
-      }],
-      tabindex: "0"
-    }, [f("div", {
-      class: "farris-image-cropper-move",
-      onMousedown: P((I) => k(I, $.Move, "topleft"), ["prevent"])
-    }, null), !y.value && f("div", null, [Q, q])])]), R.value && f("div", {
-      class: "farris-image-cropper-loading"
-    }, [f("div", {
-      class: "farris-image-cropper-loading-spinner"
-    }, null)]), b && f("div", {
-      class: "farris-image-cropper-error"
-    }, [t.value])]);
-  }
-}), bt = /* @__PURE__ */ we({
-  name: "FImageCropperDesign",
-  props: he,
-  emits: ["imageCropped", "imageLoaded", "cropperReady", "loadImageFailed"],
-  setup(a, c) {
-    const u = o(a.alignImage), N = o(a.roundCropper), y = o(a.hideResizeSquares), t = o(a.loadImageErrorText), p = o(a.disabled), d = o(null), {
-      uploadError: b,
-      imageVisible: h,
-      backgroundColor: D,
-      sourceImage: H,
-      safeImgDataUrl: l,
-      safeTransformStyle: n,
-      maxSize: C,
-      cropper: g,
-      marginLeft: _,
-      moveTypes: $,
-      isLoading: R,
-      startMove: k,
-      imageLoadedInView: j,
-      moveStop: A,
-      moveImg: T
-    } = Ce(a, c), v = o(), m = Me("design-item-context"), q = it(v, m);
-    be(() => {
-      v.value.componentInstance = q;
-    }), c.expose(q.value);
-    function Q(z) {
-      return f("span", {
-        class: `farris-image-cropper-resize-bar ${z}`,
-        onMousedown: P((O) => k(O, $.Resize, z), ["prevent"])
-      }, null);
-    }
-    function I(z) {
-      return f("div", null, [f("span", {
-        class: `farris-image-cropper-resize-bar ${z}`,
-        onMousedown: P((O) => k(O, $.Resize, z), ["prevent"])
-      }, [f("span", {
-        class: "farris-image-cropper-square"
-      }, null)]), f("span", {
-        class: "farris-image-cropper-resize top"
-      }, [f("span", {
-        class: "farris-image-cropper-square"
-      }, null)])]);
-    }
-    const M = ["top", "right", "bottom", "left"].map((z) => Q(z)), L = ["topleft", "topright", "bottomright", "bottomleft"].map((z) => I(z));
-    return () => f("div", {
+      onMousemove: O((C) => T(C), ["prevent"]),
+      onTouchmove: O((C) => T(C), ["prevent"]),
+      onMouseup: O(() => A(), ["prevent"]),
+      onTouchend: O(() => A(), ["prevent"])
+    }, [!b && H("div", {
       ref: v,
-      class: ["farris-image-cropper-frame", {
-        "farris-image-cropper-disabled": p.value
-      }],
-      style: {
-        "text-align": u.value
-      },
-      onMousemove: P((z) => T(z), ["prevent"]),
-      onTouchmove: P((z) => T(z), ["prevent"]),
-      onMouseup: P(() => A(), ["prevent"]),
-      onTouchend: P(() => A(), ["prevent"])
-    }, [!b && f("div", {
-      ref: d,
       class: "farris-image-cropper",
       style: [{
-        background: h.value ? D.value : ""
+        background: d.value ? D.value : ""
       }]
-    }, [l.value && f("img", {
+    }, [u.value && H("img", {
       title: "farris-source-image",
-      ref: H,
+      ref: U,
       class: "farris-source-image",
       style: [{
-        visibility: h.value ? "visible" : "hidden"
+        visibility: d.value ? "visible" : "hidden"
       }, {
-        transform: n.value
+        transform: i.value
       }],
-      src: l.value,
-      onLoad: () => j()
-    }, null), C.value && f("div", {
+      src: u.value,
+      onLoad: () => N()
+    }, null), k.value && H("div", {
       class: "farris-image-overlay",
       style: [{
-        width: `${C.value.width || 0}px`
+        width: `${k.value.width || 0}px`
       }, {
-        height: `${C.value.height || 0}px`
+        height: `${k.value.height || 0}px`
       }, {
-        "margin-left": u.value === "center" ? _.value : ""
+        "margin-left": s.value === "center" ? P.value : ""
       }]
-    }, null), h.value && f("div", {
+    }, null), d.value && H("div", {
       class: ["farris-image-cropper-wrapper", {
-        "farris-image-cropper-rounded": N.value
+        "farris-image-cropper-rounded": $.value
       }],
       style: [{
-        top: `${g.value.y1}px`
+        top: `${w.value.y1}px`
       }, {
-        left: `${g.value.x1}px`
+        left: `${w.value.x1}px`
       }, {
-        width: `${g.value.x2 - g.value.x1}px`
+        width: `${w.value.x2 - w.value.x1}px`
       }, {
-        height: `${g.value.y2 - g.value.y1}px`
+        height: `${w.value.y2 - w.value.y1}px`
       }, {
-        visibility: h.value ? "visible" : "hidden"
+        visibility: d.value ? "visible" : "hidden"
       }, {
-        "margin-left": u.value === "center" ? _.value : ""
+        "margin-left": s.value === "center" ? P.value : ""
       }],
       tabindex: "0"
-    }, [f("div", {
+    }, [H("div", {
       class: "farris-image-cropper-move",
-      onMousedown: P((z) => k(z, $.Move, "topleft"), ["prevent"])
-    }, null), !y.value && f("div", null, [L, M])])]), R.value && f("div", {
+      onMousedown: O((C) => E(C, V.Move, "topleft"), ["prevent"])
+    }, null), !g.value && H("div", null, [q, j])])]), F.value && H("div", {
       class: "farris-image-cropper-loading"
-    }, [f("div", {
+    }, [H("div", {
       class: "farris-image-cropper-loading-spinner"
-    }, null)]), b && f("div", {
+    }, null)]), b && H("div", {
       class: "farris-image-cropper-error"
     }, [t.value])]);
   }
 });
-Z.install = (a) => {
-  a.component(Z.name, Z);
-};
-Z.register = (a, c, u, N) => {
-  a["image-cropper"] = Z, c["image-cropper"] = Ie;
-};
-Z.registerDesigner = (a, c, u) => {
-  a["image-cropper"] = bt, c["image-cropper"] = Ie;
+le.install = (a) => {
+  a.component(le.name, le);
 };
+const ut = Ye(le);
 export {
-  Z as ImageCropper,
-  Z as default,
-  he as imageCropperProps,
-  Ie as propsResolver
+  le as ImageCropper,
+  ut as default,
+  Xe as imageCropperProps
 };