@fewangsit/wangsvue-fats 1.0.1-alpha.68 → 1.0.1-alpha.69

package/imagecompressor/index.es.js

@@ -1,27 +1,27 @@
-import { defineComponent as Ce, mergeModels as oe, inject as Be, onMounted as Pe, onUnmounted as Me, ref as w, shallowRef as A, useModel as Ue, reactive as Fe, computed as J, watch as N, createElementBlock as g, openBlock as n, Fragment as V, createVNode as m, normalizeClass as y, withCtx as x, createElementVNode as h, createCommentVNode as p, createBlock as k, renderList as ze, unref as S } from "vue";
-import { g as Ae } from "../dialogprintqr/index.es.js";
-import { r as Se } from "../vendor/base64toblob/base64toblob.es.js";
-import { u as $e } from "../vendor/vee-validate/dist/vee-validate.esm.es.js";
+import { defineComponent as Be, mergeModels as oe, inject as Pe, onMounted as Me, onUnmounted as Ue, ref as w, shallowRef as $, useModel as Fe, reactive as Se, computed as J, watch as N, createElementBlock as g, openBlock as n, Fragment as V, createVNode as m, normalizeClass as y, withCtx as O, createElementVNode as h, createCommentVNode as p, createBlock as k, renderList as $e, unref as z, toDisplayString as se } from "vue";
+import { g as ze } from "../dialogprintqr/index.es.js";
+import { r as Ae } from "../vendor/base64toblob/base64toblob.es.js";
+import { u as De } from "../vendor/vee-validate/dist/vee-validate.esm.es.js";
 import { f as Re } from "../vendor/vue-advanced-cropper/dist/index.esm-bundler.es.js";
-import { u as De } from "../plugins/WangsVue.es.js";
-import { g as Le, a as Ne } from "../utils/genPlaceholder.util.es.js";
-import { _ as Ve } from "../image/index.es.js";
-import { _ as $ } from "../button/index.es.js";
-import { _ as Ee } from "../buttonradio/index.es.js";
-import { _ as Te } from "../dialog/index.es.js";
-import { _ as je } from "../dialogconfirm/index.es.js";
-import { _ as xe } from "../fieldwrapper/index.es.js";
-import { _ as O } from "../icon/index.es.js";
-import { _ as Oe } from "../invisiblefield/index.es.js";
-import { _ as qe } from "../validatormessage/index.es.js";
-import { B as Ke } from "../backgroundimagecropper/index.es.js";
-import { _ as se } from "../imageinputinfo/index.es.js";
+import { u as Le } from "../plugins/WangsVue.es.js";
+import { g as Ne, a as Ve } from "../utils/genPlaceholder.util.es.js";
+import { _ as Ee } from "../image/index.es.js";
+import { _ as A } from "../button/index.es.js";
+import { _ as Te } from "../buttonradio/index.es.js";
+import { _ as je } from "../dialog/index.es.js";
+import { _ as Oe } from "../dialogconfirm/index.es.js";
+import { _ as qe } from "../fieldwrapper/index.es.js";
+import { _ as q } from "../icon/index.es.js";
+import { _ as xe } from "../invisiblefield/index.es.js";
+import { _ as Ke } from "../validatormessage/index.es.js";
+import { B as He } from "../backgroundimagecropper/index.es.js";
+import { _ as ie } from "../imageinputinfo/index.es.js";
 /* empty css                                           */
-var He = Se();
-const We = /* @__PURE__ */ Ae(He), Ge = {
+var We = Ae();
+const Ge = /* @__PURE__ */ ze(We), Je = {
   key: 1,
   class: "flex gap-1 items-start"
-}, Je = ["id", "multiple"], Qe = ["for"], ga = /* @__PURE__ */ Ce({
+}, Qe = ["id", "multiple"], Xe = ["for"], Ye = { class: "inline-flex items-center text-body-medium rounded-bl rounded-tl bg-general-50 dark:bg-grayscale-800 px-3 h-[26px] border-[0.5px] border-general-200 dark:border-grayscale-800" }, Ze = { class: "inline-flex items-center text-body-medium !text-general-200 dark:!text-general-600 !font-light rounded-br rounded-tr px-3 h-[26px] leading-4 border-[0.5px] border-l-0 border-general-200 dark:border-grayscale-800" }, ba = /* @__PURE__ */ Be({
   __name: "ImageCompressor",
   props: /* @__PURE__ */ oe({
     initialName: {},
@@ -52,11 +52,11 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
     defaultImageModifiers: {}
   }),
   emits: /* @__PURE__ */ oe(["apply", "applyProp", "update:defaultImage", "update:fieldValue", "delete"], ["update:defaultImage"]),
-  setup(Q, { expose: ie, emit: ne }) {
-    const ue = Be("preset", {}).image, l = Q, I = ne, { locale: E } = De("ImageCompressor");
-    Pe(async () => {
-      fe(), M();
-    }), Me(() => {
+  setup(Q, { expose: ne, emit: ue }) {
+    const me = Pe("preset", {}).image, a = Q, I = ue, { locale: E } = Le("ImageCompressor");
+    Me(async () => {
+      ye(), M();
+    }), Ue(() => {
       F(0), F(1);
     });
     const v = w([
@@ -68,21 +68,21 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
         src: null,
         type: null
       }
-    ]), me = Ne(), q = w(), C = w(), s = w([]), X = w(), Y = A(0), K = w(), R = w(), d = A(), T = Ue(Q, "defaultImage"), i = Fe({
-      value: l.multiple ? [] : void 0
-    }), B = A(!1), b = A(), de = A(0), f = A(!1), H = w([!1, !1]), P = J(() => `image/${l.fileType}`), W = (e) => typeof s.value[e] == "string" && s.value[e].includes("data:image/png;base64"), ce = J(() => {
+    ]), de = Ve(), x = w(), C = w(), s = w([]), X = w(), Y = $(0), K = w(), D = w(), d = $(), T = Fe(Q, "defaultImage"), i = Se({
+      value: a.multiple ? [] : void 0
+    }), B = $(!1), b = $(), ce = $(0), f = $(!1), H = w([!1, !1]), P = J(() => `image/${a.fileType}`), W = (e) => typeof s.value[e] == "string" && s.value[e].includes("data:image/png;base64"), pe = J(() => {
       const e = {
         big: 125,
         medium: 80,
         small: 30
       };
-      return l.type === "inline-table" ? e.small : e[l.imagePreviewSize] || e.small;
+      return a.type === "inline-table" ? e.small : e[a.imagePreviewSize] || e.small;
     }), M = async () => {
-      var e, a;
-      (e = l.imagePreviewUrl) != null && e.length ? s.value = Array.isArray(l.imagePreviewUrl) ? l.imagePreviewUrl : [l.imagePreviewUrl] : Array.isArray(l.compressedBlob) ? s.value = l.compressedBlob : l.compressedBlob ? s.value = [l.compressedBlob] : l.initialName ? (q.value = Le(l.initialName, 125, me), s.value = [(a = q.value) == null ? void 0 : a.toDataURL()]) : s.value = [], l.imagePreviewUrl ? i.value = l.imagePreviewUrl : l.initialName && (i.value = await pe()), I("applyProp");
-    }, pe = async () => new Promise((e) => {
-      var a;
-      (a = q.value) == null || a.toBlob((r) => {
+      var e, l;
+      (e = a.imagePreviewUrl) != null && e.length ? s.value = Array.isArray(a.imagePreviewUrl) ? a.imagePreviewUrl : [a.imagePreviewUrl] : Array.isArray(a.compressedBlob) ? s.value = a.compressedBlob : a.compressedBlob ? s.value = [a.compressedBlob] : a.initialName ? (x.value = Ne(a.initialName, 125, de), s.value = [(l = x.value) == null ? void 0 : l.toDataURL()]) : s.value = [], a.imagePreviewUrl ? i.value = a.imagePreviewUrl : a.initialName && (i.value = await ve()), I("applyProp");
+    }, ve = async () => new Promise((e) => {
+      var l;
+      (l = x.value) == null || l.toBlob((r) => {
         e(
           new File([r ?? new Blob()], Date.now() + ".png", {
             type: "image/png"
@@ -90,52 +90,52 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
         );
       });
     }), U = (e = !1) => {
-      var a;
-      l.disabled || (e && (d.value = 1), (a = X.value) == null || a.click());
-    }, ve = async (e) => {
-      const { files: a } = e.target, r = Array.from(a ?? []).slice(
+      var l;
+      a.disabled || (e && (d.value = 1), (l = X.value) == null || l.click());
+    }, ge = async (e) => {
+      const { files: l } = e.target, r = Array.from(l ?? []).slice(
         0,
         s.value.length ? 1 : 2
       );
       for (const [t, u] of r.entries())
         try {
           const o = d.value ?? t;
-          await ge(u, o);
+          await fe(u, o);
         } catch (o) {
           console.error("Error loading image:", o);
         } finally {
           d.value = void 0;
         }
-    }, ge = async (e, a) => {
+    }, fe = async (e, l) => {
       const r = (u) => u.includes("image"), t = (u) => u > 1e6;
       return new Promise((u, o) => {
-        var D, z;
+        var R, S;
         if (e)
-          if (Z(a), !r(e.type))
-            B.value = !0, b.value = typeof l.validatorMessage != "string" && ((D = l.validatorMessage) != null && D.invalidFormat) ? l.validatorMessage.invalidFormat : "Tipe file harus berupa gambar!", M(), f.value = !1, F(a), o("Tipe file harus berupa gambar!");
+          if (Z(l), !r(e.type))
+            B.value = !0, b.value = typeof a.validatorMessage != "string" && ((R = a.validatorMessage) != null && R.invalidFormat) ? a.validatorMessage.invalidFormat : "Tipe file harus berupa gambar!", M(), f.value = !1, F(l), o("Tipe file harus berupa gambar!");
           else if (t(e.size))
-            B.value = !0, b.value = typeof l.validatorMessage != "string" && ((z = l.validatorMessage) != null && z.exceed) ? l.validatorMessage.exceed : "Ukuran gambar terlalu besar! Maks. 1 MB", M(), f.value = !1, F(a), o("Ukuran gambar terlalu besar! Maks. 1 MB");
+            B.value = !0, b.value = typeof a.validatorMessage != "string" && ((S = a.validatorMessage) != null && S.exceed) ? a.validatorMessage.exceed : "Ukuran gambar terlalu besar! Maks. 1 MB", M(), f.value = !1, F(l), o("Ukuran gambar terlalu besar! Maks. 1 MB");
           else {
-            F(a);
+            F(l);
             const j = URL.createObjectURL(e), c = new FileReader();
             c.onload = (L) => {
               var re;
-              v.value[a].src = j, v.value[a].type = ye(
+              v.value[l].src = j, v.value[l].type = be(
                 (re = L == null ? void 0 : L.target) == null ? void 0 : re.result,
                 e.type
               );
             }, c.onerror = (L) => {
               console.error("🚀 ~ returnnewPromise ~ e:", L);
-            }, c.readAsArrayBuffer(e), d.value == null && (d.value = a), f.value || (f.value = !0), B.value = !1, b.value = void 0;
+            }, c.readAsArrayBuffer(e), d.value == null && (d.value = l), f.value || (f.value = !0), B.value = !1, b.value = void 0;
           }
-        de.value += 1, R.value = u;
+        ce.value += 1, D.value = u;
       });
-    }, fe = () => {
-      l.useValidator && Object.assign(
+    }, ye = () => {
+      a.useValidator && Object.assign(
         i,
-        $e(l.fieldName, (e) => {
-          var a;
-          return !e && l.mandatory ? typeof l.validatorMessage != "string" && ((a = l.validatorMessage) != null && a.empty) ? l.validatorMessage.empty : (l.label ?? "Photo") + " must be uploaded" : l.invalid && l.validatorMessage ? l.validatorMessage : b.value ? b.value : !0;
+        De(a.fieldName, (e) => {
+          var l;
+          return !e && a.mandatory ? typeof a.validatorMessage != "string" && ((l = a.validatorMessage) != null && l.empty) ? a.validatorMessage.empty : (a.label ?? "Photo") + " must be uploaded" : a.invalid && a.validatorMessage ? a.validatorMessage : b.value ? b.value : !0;
         })
       );
     }, Z = (e) => {
@@ -143,7 +143,7 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
         src: null,
         type: null
       };
-    }, ye = (e, a = null) => {
+    }, be = (e, l = null) => {
       if (e) {
         const r = new Uint8Array(e).subarray(0, 4);
         let t = "";
@@ -161,101 +161,101 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
           case "ffd8ffe8":
             return P.value;
           default:
-            return a;
+            return l;
         }
       }
       return null;
     }, _ = (e) => {
-      const a = We(e.split(",")[1], P.value);
-      return window.URL.createObjectURL(a);
-    }, be = async (e, a) => {
+      const l = Ge(e.split(",")[1], P.value);
+      return window.URL.createObjectURL(l);
+    }, we = async (e, l) => {
       const r = await fetch(e).then((t) => t.blob());
-      return new File([r], a, { type: P.value });
-    }, we = async () => {
+      return new File([r], l, { type: P.value });
+    }, he = async () => {
       const e = d.value ?? 0;
       try {
-        await he(e);
-      } catch (a) {
-        console.error(a);
+        await ke(e);
+      } catch (l) {
+        console.error(l);
       }
       ee();
     }, ee = () => {
       var e;
-      f.value = !1, (e = R.value) == null || e.call(R), R.value = void 0;
-    }, he = async (e) => {
+      f.value = !1, (e = D.value) == null || e.call(D), D.value = void 0;
+    }, ke = async (e) => {
       if (K.value) {
-        const a = K.value.getResult();
-        if (a.canvas) {
-          const r = a.canvas.toDataURL(P.value);
-          await ke(r, e);
+        const l = K.value.getResult();
+        if (l.canvas) {
+          const r = l.canvas.toDataURL(P.value);
+          await Ie(r, e);
         }
       }
-    }, ke = async (e, a) => {
+    }, Ie = async (e, l) => {
       try {
         C.value = document.createElement("canvas");
         const r = C.value.getContext("2d"), t = new Image();
         t.src = e, await t.decode();
-        const u = 80 / 100, o = t.width * u, D = t.height * u;
-        C.value.setAttribute("width", o.toString()), C.value.setAttribute("height", D.toString()), r && r.drawImage(t, 0, 0, o, D);
-        const z = C.value.toDataURL(P.value, 0.95), j = Date.now() + `.${l.fileType}`, c = {
+        const u = 80 / 100, o = t.width * u, R = t.height * u;
+        C.value.setAttribute("width", o.toString()), C.value.setAttribute("height", R.toString()), r && r.drawImage(t, 0, 0, o, R);
+        const S = C.value.toDataURL(P.value, 0.95), j = Date.now() + `.${a.fileType}`, c = {
           canvas: C.value,
           compressed: {
-            blob: _(z),
-            base64: z,
+            blob: _(S),
+            base64: S,
             fileName: j,
-            file: await be(_(z), j),
+            file: await we(_(S), j),
             size: "",
             type: P.value
           },
           message: "File has been compressed."
         };
-        c.compressed.size = Math.round(c.compressed.file.size / 1e3) + "KB", s.value[a] = c.compressed.blob, l.multiple ? i.value && Array.isArray(i.value) ? i.value[a] = c.compressed.file : i.value = [c.compressed.file] : i.value = c.compressed.file, I("apply", c);
+        c.compressed.size = Math.round(c.compressed.file.size / 1e3) + "KB", s.value[l] = c.compressed.blob, a.multiple ? i.value && Array.isArray(i.value) ? i.value[l] = c.compressed.file : i.value = [c.compressed.file] : i.value = c.compressed.file, I("apply", c);
       } catch (r) {
         console.error(r);
       }
     }, F = (e) => {
       v.value[e].src && URL.revokeObjectURL(v.value[e].src);
     }, ae = (e) => {
-      l.confirmOnDelete ? H.value[e] = !0 : l.emitDeleteFn ? I("delete", G, e) : G(e);
+      a.confirmOnDelete ? H.value[e] = !0 : a.emitDeleteFn ? I("delete", G, e) : G(e);
     }, G = (e = 0) => {
-      B.value = !1, b.value = void 0, s.value = s.value.toSpliced(e, 1), F(e), v.value[e] = { src: null, type: null }, v.value = [v.value[+!e], v.value[e]], d.value = 0, T.value = 0, l.confirmOnDelete || I("delete"), l.multiple && Array.isArray(i.value) ? i.value = i.value.toSpliced(e, 1) : i.handleReset && i.handleReset();
+      B.value = !1, b.value = void 0, s.value = s.value.toSpliced(e, 1), F(e), v.value[e] = { src: null, type: null }, v.value = [v.value[+!e], v.value[e]], d.value = 0, T.value = 0, a.confirmOnDelete || I("delete"), a.multiple && Array.isArray(i.value) ? i.value = i.value.toSpliced(e, 1) : i.handleReset && i.handleReset();
     }, le = (e) => {
       var r;
-      const a = (r = s.value[e]) == null ? void 0 : r.toString();
-      d.value = e, a != null && a.includes("blob") ? (d.value = e, f.value = !0) : (Z(e), U());
-    }, Ie = () => {
+      const l = (r = s.value[e]) == null ? void 0 : r.toString();
+      d.value = e, l != null && l.includes("blob") ? (d.value = e, f.value = !0) : (Z(e), U());
+    }, Ce = () => {
       U();
     }, te = J(() => navigator.userAgent.includes("Chrome"));
     return N(
       () => i.value,
       (e) => {
-        (e instanceof File || Array.isArray(e) && e.some((a) => a instanceof File)) && I("update:fieldValue", e);
+        (e instanceof File || Array.isArray(e) && e.some((l) => l instanceof File)) && I("update:fieldValue", e);
       }
     ), N(b, (e) => {
       e && i.setErrors && i.setErrors(e);
     }), N(f, (e) => {
       e || Y.value++;
     }), N(
-      () => l.initialName,
+      () => a.initialName,
       () => {
         M();
       }
     ), N(
-      () => l.imagePreviewUrl,
+      () => a.imagePreviewUrl,
       () => {
         M();
       },
       { once: !0 }
-    ), ie({ assignPreviewImagesFromProp: M }), (e, a) => (n(), g(V, null, [
-      m(xe, {
-        class: y([{ "!w-max": !l.multiple, "!w-full": l.multiple }]),
-        info: l.fieldInfo,
-        label: l.label,
-        mandatory: l.mandatory,
+    ), ne({ assignPreviewImagesFromProp: M }), (e, l) => (n(), g(V, null, [
+      m(qe, {
+        class: y([{ "!w-max": !a.multiple, "!w-full": a.multiple }]),
+        info: a.fieldInfo,
+        label: a.label,
+        mandatory: a.mandatory,
         "data-wv-name": "image-compressor",
         "data-wv-section": "root"
       }, {
-        default: x(() => [
+        default: O(() => [
           h("div", {
             class: y([
               "w-full",
@@ -266,7 +266,7 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
             ]),
             "data-wv-section": "wrapper"
           }, [
-            s.value.length ? (n(!0), g(V, { key: 0 }, ze(s.value, (r, t) => {
+            s.value.length ? (n(!0), g(V, { key: 0 }, $e(s.value, (r, t) => {
               var u;
               return n(), g("div", {
                 key: t,
@@ -299,25 +299,25 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                     ]),
                     "data-wv-section": "image-wrapper"
                   }, [
-                    m(Ve, {
+                    m(Ee, {
                       class: y([{ "w-[30px] h-[30px]": e.type === "inline-table" }, "transition-opacity duration-300"]),
                       rounded: e.rounded,
                       src: r,
-                      "thumbnail-size": ce.value,
+                      "thumbnail-size": pe.value,
                       "use-default-size": !1,
                       "data-wv-section": "preview-image"
                     }, null, 8, ["class", "rounded", "src", "thumbnail-size"]),
                     W(t) ? (n(), g("button", {
                       key: 0,
                       class: y([
-                        (u = S(ue)) == null ? void 0 : u.button.class,
+                        (u = z(me)) == null ? void 0 : u.button.class,
                         "hover:bg-opacity-0 rounded-lg opacity-0"
                       ]),
-                      onClick: a[0] || (a[0] = (o) => U(!1)),
+                      onClick: l[0] || (l[0] = (o) => U(!1)),
                       "data-wv-section": "input-image-trigger",
                       type: "button"
                     }, [
-                      m(O, {
+                      m(q, {
                         class: "w-6 h-6",
                         "data-wv-section": "trigger-icon",
                         icon: "image-add",
@@ -325,7 +325,7 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                       })
                     ], 2)) : p("", !0)
                   ], 2),
-                  !l.disabled && !W(t) ? (n(), g(V, { key: 0 }, [
+                  !a.disabled && !W(t) ? (n(), g(V, { key: 0 }, [
                     h("div", {
                       class: y([
                         "flex gap-0.5 justify-center",
@@ -334,14 +334,14 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                       "data-wv-section": "preview-buttons"
                     }, [
                       e.type === "normal" ? (n(), g(V, { key: 0 }, [
-                        m($, {
+                        m(A, {
                           onClick: (o) => le(t),
                           class: "!py-0 !px-1 !h-max",
                           icon: "pencil",
                           label: "Edit",
                           text: ""
                         }, null, 8, ["onClick"]),
-                        e.useDeleteButton ? (n(), k($, {
+                        e.useDeleteButton ? (n(), k(A, {
                           key: 0,
                           onClick: (o) => ae(t),
                           class: "!py-0 !px-1 !h-max",
@@ -351,13 +351,13 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                           text: ""
                         }, null, 8, ["onClick"])) : p("", !0)
                       ], 64)) : (n(), g(V, { key: 1 }, [
-                        m(O, {
+                        m(q, {
                           onClick: (o) => le(t),
                           class: "text-xs p-0.5 rounded-xs mr-1",
                           icon: "pencil",
                           severity: "primary"
                         }, null, 8, ["onClick"]),
-                        m(O, {
+                        m(q, {
                           onClick: (o) => ae(t),
                           class: "text-xs p-0.5 rounded-xs",
                           icon: "delete-bin",
@@ -365,7 +365,7 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                         }, null, 8, ["onClick"])
                       ], 64))
                     ], 2),
-                    m(je, {
+                    m(Oe, {
                       visible: H.value[t],
                       "onUpdate:visible": (o) => H.value[t] = o,
                       closable: !1,
@@ -377,18 +377,18 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                     }, null, 8, ["visible", "onUpdate:visible", "onConfirm"])
                   ], 64)) : p("", !0)
                 ], 2),
-                e.type === "normal" ? (n(), k(se, {
+                e.type === "normal" ? (n(), k(ie, {
                   key: 0,
                   "custom-requirements": e.customRequirements,
-                  "show-add-button": s.value.length === 1 && l.multiple,
+                  "show-add-button": s.value.length === 1 && a.multiple,
                   "show-info": e.showInfo,
-                  onAddPhoto: a[2] || (a[2] = (o) => U(!0))
+                  onAddPhoto: l[2] || (l[2] = (o) => U(!0))
                 }, {
-                  default: x(() => [
-                    s.value.length === 2 && l.multiple ? (n(), k(Ee, {
+                  default: O(() => [
+                    s.value.length === 2 && a.multiple ? (n(), k(Te, {
                       key: 0,
                       modelValue: T.value,
-                      "onUpdate:modelValue": a[1] || (a[1] = (o) => T.value = o),
+                      "onUpdate:modelValue": l[1] || (l[1] = (o) => T.value = o),
                       "label-id": "default-" + t,
                       value: t,
                       label: "Set as default"
@@ -396,15 +396,15 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                   ]),
                   _: 2
                 }, 1032, ["custom-requirements", "show-add-button", "show-info"])) : p("", !0),
-                e.multiple && s.value.length == 1 && e.type === "inline-table" ? (n(), k($, {
+                e.multiple && s.value.length == 1 && e.type === "inline-table" ? (n(), k(A, {
                   key: 1,
-                  onClick: a[3] || (a[3] = (o) => U(!0)),
+                  onClick: l[3] || (l[3] = (o) => U(!0)),
                   icon: "add",
                   label: "Photo",
                   text: ""
                 })) : p("", !0)
               ], 2);
-            }), 128)) : e.type != "inline-table" ? (n(), g("div", Ge, [
+            }), 128)) : e.type != "inline-table" ? (n(), g("div", Je, [
               h("button", {
                 class: y([
                   {
@@ -425,22 +425,22 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
                     "ring-danger-500 dark:ring-danger-500": B.value || i.errorMessage
                   },
                   {
-                    "bg-white dark:bg-grayscale-900": !l.disabled,
-                    "bg-general-50 dark:bg-grayscale-800": l.disabled
+                    "bg-white dark:bg-grayscale-900": !a.disabled,
+                    "bg-general-50 dark:bg-grayscale-800": a.disabled
                   }
                 ]),
-                onClick: a[4] || (a[4] = (r) => U(!1)),
+                onClick: l[4] || (l[4] = (r) => U(!1)),
                 "data-wv-section": "input-image-trigger",
                 type: "button"
               }, [
-                m(O, {
+                m(q, {
                   class: "w-6 h-6",
                   "data-wv-section": "trigger-icon",
                   icon: "image-add",
                   severity: "primary"
                 })
               ], 2),
-              m(se, {
+              m(ie, {
                 "custom-requirements": e.customRequirements,
                 "show-info": e.showInfo
               }, null, 8, ["custom-requirements", "show-info"])
@@ -451,27 +451,27 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
             key: Y.value,
             ref_key: "inputImageFile",
             ref: X,
-            multiple: l.multiple && !s.value.length,
-            onChange: ve,
+            multiple: a.multiple && !s.value.length,
+            onChange: ge,
             accept: "image/*",
             class: "hidden",
             "data-wv-section": "hidden-image-input",
             type: "file"
-          }, null, 40, Je)),
+          }, null, 40, Qe)),
           e.type === "inline-table" && !s.value.length ? (n(), g("label", {
             key: 0,
             for: e.fieldName,
             class: "inline-flex items-center cursor-pointer"
-          }, a[6] || (a[6] = [
-            h("span", { class: "inline-flex items-center text-body-medium rounded-bl rounded-tl bg-general-50 dark:bg-grayscale-800 px-3 h-[26px] border-[0.5px] border-general-200 dark:border-grayscale-800" }, " Browse ", -1),
-            h("span", { class: "inline-flex items-center text-body-medium !text-general-200 dark:!text-general-600 !font-light rounded-br rounded-tr px-3 h-[26px] leading-4 border-[0.5px] border-l-0 border-general-200 dark:border-grayscale-800" }, " Select File ", -1)
-          ]), 8, Qe)) : p("", !0),
-          e.showValidatorMessage ? (n(), k(qe, {
+          }, [
+            h("span", Ye, se(e.$t("Browse")), 1),
+            h("span", Ze, se(e.$t("Select File")), 1)
+          ], 8, Xe)) : p("", !0),
+          e.showValidatorMessage ? (n(), k(Ke, {
             key: 1,
             format: !1,
             message: i.errorMessage ?? b.value
           }, null, 8, ["message"])) : p("", !0),
-          l.multiple ? (n(), k(Oe, {
+          a.multiple ? (n(), k(xe, {
             key: 2,
             value: T.value ? "secondImage" : "firstImage",
             "field-name": "defaultImage"
@@ -479,48 +479,48 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
         ]),
         _: 1
       }, 8, ["class", "info", "label", "mandatory"]),
-      m(Te, {
+      m(je, {
         visible: f.value,
-        "onUpdate:visible": a[5] || (a[5] = (r) => f.value = r),
+        "onUpdate:visible": l[5] || (l[5] = (r) => f.value = r),
         draggable: !1,
-        header: S(E).cropDialogHeader,
+        header: z(E).cropDialogHeader,
         class: "w-max max-w-[98vw] min-w-[min(500px,98vw)] !max-h-[94vh]",
         "content-class": "overflow-hidden overflow-y-auto min-h-[100px]",
         "data-wv-section": "dialog-cropper",
         "footer-class": "!gap-1",
         modal: ""
       }, {
-        footer: x(() => [
-          m($, {
-            label: S(E).cancelCropLabel,
+        footer: O(() => [
+          m(A, {
+            label: z(E).cancelCropLabel,
             onClick: ee,
             "data-wv-section": "cancel-crop",
             severity: "secondary",
             text: "",
             type: "button"
           }, null, 8, ["label"]),
-          m($, {
-            label: S(E).changeImageLabel,
-            onClick: Ie,
+          m(A, {
+            label: z(E).changeImageLabel,
+            onClick: Ce,
             "data-wv-section": "change-image-button",
             text: "",
             type: "button"
           }, null, 8, ["label"]),
-          m($, {
-            label: S(E).applyCropLabel,
-            onClick: we,
+          m(A, {
+            label: z(E).applyCropLabel,
+            onClick: he,
             "data-wv-section": "apply-image-button",
             severity: "success",
             type: "button"
           }, null, 8, ["label"])
         ]),
-        default: x(() => [
-          d.value != null ? (n(), k(S(Re), {
+        default: O(() => [
+          d.value != null ? (n(), k(z(Re), {
             key: 0,
             ref_key: "vueAdvanceCropper",
             ref: K,
             "auto-zoom": !1,
-            "background-wrapper-component": Ke,
+            "background-wrapper-component": He,
             src: v.value[d.value].src,
             class: "upload-example-cropper h-400",
             "foreground-class": "h-400",
@@ -533,5 +533,5 @@ const We = /* @__PURE__ */ Ae(He), Ge = {
   }
 });
 export {
-  ga as _
+  ba as _
 };

package/imageinputinfo/index.es.js

@@ -1,9 +1,9 @@
-import { defineComponent as p, createElementBlock as t, openBlock as o, createCommentVNode as a, createBlock as c, renderSlot as f, normalizeClass as _, Fragment as m, renderList as g, toDisplayString as r, createElementVNode as u, unref as d } from "vue";
-import { u as k } from "../plugins/WangsVue.es.js";
-import { _ as y } from "../button/index.es.js";
-const h = { class: "flex flex-col gap-y-4" }, w = {
+import { defineComponent as p, createElementBlock as t, openBlock as o, createCommentVNode as a, createBlock as f, renderSlot as c, normalizeClass as g, Fragment as m, renderList as k, toDisplayString as r, createElementVNode as u, unref as d } from "vue";
+import { u as y } from "../plugins/WangsVue.es.js";
+import { _ as h } from "../button/index.es.js";
+const _ = { class: "flex flex-col gap-y-4" }, w = {
   key: 0,
-  class: /* @__PURE__ */ _([
+  class: /* @__PURE__ */ g([
     "text-xs font-normal text-grayscale-900 dark:text-white",
     "[&_li]:before:content-['•']",
     "[&_li]:before:inline-block [&_li]:before:w-[12px] [&_li]:before:ml-[-12px] pl-3",
@@ -18,25 +18,25 @@ const h = { class: "flex flex-col gap-y-4" }, w = {
     showAddButton: { type: Boolean }
   },
   emits: ["addPhoto"],
-  setup(x) {
-    const { locale: l } = k("ImageCompressor");
+  setup(B) {
+    const { locale: l } = y("ImageCompressor");
     return (e, s) => {
       var i;
-      return o(), t("div", h, [
+      return o(), t("div", _, [
         e.showInfo ? (o(), t("ul", w, [
-          (i = e.customRequirements) != null && i.length ? (o(!0), t(m, { key: 0 }, g(e.customRequirements, (n) => (o(), t("li", { key: n }, r(n), 1))), 128)) : (o(), t(m, { key: 1 }, [
-            u("li", null, r(d(l).maxSizeRequirement), 1),
-            u("li", null, r(d(l).imageTypeRequirement), 1)
+          (i = e.customRequirements) != null && i.length ? (o(!0), t(m, { key: 0 }, k(e.customRequirements, (n) => (o(), t("li", { key: n }, r(e.$t(n)), 1))), 128)) : (o(), t(m, { key: 1 }, [
+            u("li", null, r(e.$t(d(l).maxSizeRequirement)), 1),
+            u("li", null, r(e.$t(d(l).imageTypeRequirement)), 1)
           ], 64))
         ])) : a("", !0),
-        e.showAddButton ? (o(), c(y, {
+        e.showAddButton ? (o(), f(h, {
           key: 1,
           onClick: s[0] || (s[0] = (n) => e.$emit("addPhoto")),
           icon: "add",
           label: "Add Photo",
           text: ""
         })) : a("", !0),
-        f(e.$slots, "default")
+        c(e.$slots, "default")
       ]);
     };
   }