@fewangsit/wangsvue-fats 1.0.1-alpha.35 → 1.0.1-alpha.36

package/backgroundimagecropper/index.es.js

@@ -50,8 +50,8 @@ const I = (i, s) => {
       _: 3
     }, 8, ["mouse-move", "touch-move", "touch-resize", "wheel-resize"]));
   }
-}), S = /* @__PURE__ */ I(R, [["__scopeId", "data-v-9031c32d"]]);
+}), b = /* @__PURE__ */ I(R, [["__scopeId", "data-v-5cd98b2d"]]);
 export {
-  S as B,
+  b as B,
   I as _
 };

package/datatable/index.es.js

@@ -988,7 +988,7 @@ const zt = (W, $) => W.every((t) => $.includes(t)), jt = ["id"], Vt = ["onClick"
       ], 16);
     };
   }
-}), Fl = /* @__PURE__ */ Lt(sl, [["__scopeId", "data-v-015be0a0"]]);
+}), Fl = /* @__PURE__ */ Lt(sl, [["__scopeId", "data-v-37d9df20"]]);
 export {
   Fl as D
 };

package/dialogprintqr/index.es.js

@@ -231,8 +231,8 @@ const H = /* @__PURE__ */ nA(vA), j = "data:image/png;base64,iVBORw0KGgoAAAANSUh
             t[4] || (t[4] = e("span", null, "Preview", -1)),
             a(eA, {
               icon: "info",
-              info: `This preview is only for showing the side of the\r
-          label that printed or not. It does not show the\r
+              info: `This preview is only for showing the side of the
+          label that printed or not. It does not show the
           exact amount you entered.`,
               severity: "primary"
             })

package/image/index.d.ts

@@ -271,17 +271,22 @@ export interface ImageProps {
   unstyled?: boolean;
 
   /**
-   * Get image url for specifics project from its server.
-   * @returns The full URL of the image from the server.
-   * @param path - the Image path from API Response JSON
-   * @param width - the image width in pixels
-   * @param height - the image height in pixels
+   * Returns the full image URL or a Data URI for an image resource, based on the provided path and dimensions.
+   *
+   * If the image is publicly accessible, this typically returns a fully qualified URL.
+   * If the image requires authentication or protected access, this may return a Data URI (e.g., Base64-encoded).
+   *
+   * @param path - The image path as provided in the API response JSON. Can be null or undefined.
+   * @param width - Optional width of the image in pixels.
+   * @param height - Optional height of the image in pixels.
+   *
+   * @returns A string representing either the full image URL or a Data URI. Returns `undefined` if the path is invalid.
    */
   getImageURL?: (
     path?: string | null,
     width?: number,
     height?: number,
-  ) => string | undefined;
+  ) => string | undefined | Promise<string | undefined>;
 
   /**
    * The placeholder to be shown when the image failed to load, or the src is not provided.

package/image/index.es.js

@@ -1,10 +1,11 @@
-import { defineComponent as j, computed as p, onMounted as G, onUnmounted as M, shallowRef as f, createBlock as W, openBlock as n, unref as q, mergeProps as I, withCtx as b, createElementBlock as m, normalizeStyle as k, Fragment as _, createElementVNode as U, renderList as T, withDirectives as A, vShow as H, withModifiers as D, createVNode as C, normalizeClass as z } from "vue";
-import { u as J } from "../plugins/WangsVue.es.js";
-import { m as K } from "../utils/mergePropsWithDefaults.util.es.js";
-import { s as Q } from "../vendor/primevue/image/image.esm.es.js";
-import { _ as O } from "../button/index.es.js";
-import { _ as X } from "../icon/index.es.js";
-const Y = ["src"], Z = ["src"], ee = ["src"], te = ["src", "onClick"], ne = /* @__PURE__ */ j({
+import { defineComponent as M, computed as I, onMounted as W, onUnmounted as Z, shallowRef as d, createBlock as q, openBlock as u, unref as D, withCtx as b, createElementBlock as g, normalizeStyle as k, Fragment as z, createElementVNode as $, renderList as O, withDirectives as x, vShow as H, withModifiers as P, createVNode as C, normalizeClass as _, mergeProps as T } from "vue";
+import { c as J } from "../vendor/@vueuse/core/index.es.js";
+import { u as K } from "../plugins/WangsVue.es.js";
+import { m as Q } from "../utils/mergePropsWithDefaults.util.es.js";
+import { s as X } from "../vendor/primevue/image/image.esm.es.js";
+import { _ as E } from "../button/index.es.js";
+import { _ as Y } from "../icon/index.es.js";
+const ee = ["src"], te = ["src"], ae = ["src"], re = ["src", "onClick"], me = /* @__PURE__ */ M({
   __name: "Image",
   props: {
     src: {},
@@ -24,101 +25,112 @@ const Y = ["src"], Z = ["src"], ee = ["src"], te = ["src", "onClick"], ne = /* @
     getImageURL: {},
     placeholder: {}
   },
-  setup(x) {
-    const r = x, { defaultProps: E } = J("Image"), c = p(() => K(r, E));
-    G(() => {
+  setup(F) {
+    const a = F, { defaultProps: N } = K("Image"), i = I(() => Q(a, N));
+    W(() => {
       setTimeout(() => {
-        $();
+        L();
       }, 3e3);
-    }), M(() => {
-      h();
+    }), Z(() => {
+      w();
     });
-    const o = f(0), v = f(), L = f(), w = f(!1), F = p(() => {
+    const s = d(0), p = d(), S = d(), f = d(!1), V = I(() => {
       var e;
-      return r.preview === !1 ? !1 : !w.value && !((e = u.value) != null && e.toString().includes("data:image/png;base64")) && u.value !== c.value.placeholder;
-    }), N = () => {
-      const e = r.galleries ?? [];
-      o.value = (o.value + 1) % e.length, y();
-    }, P = () => {
-      const e = r.galleries ?? [];
-      o.value = (o.value - 1 + e.length) % e.length, y();
-    }, $ = () => {
+      return a.preview === !1 ? !1 : !f.value && !((e = m.value) != null && e.toString().includes("data:image/png;base64")) && m.value !== i.value.placeholder;
+    }), j = () => {
+      const e = a.galleries ?? [];
+      s.value = (s.value + 1) % e.length, h();
+    }, A = () => {
+      const e = a.galleries ?? [];
+      s.value = (s.value - 1 + e.length) % e.length, h();
+    }, L = () => {
       var e;
-      h(), (e = r.galleries) != null && e.length && (v.value = window.setInterval(() => {
-        const t = r.galleries ?? [];
-        o.value = (o.value + 1) % t.length;
+      w(), (e = a.galleries) != null && e.length && (p.value = window.setInterval(() => {
+        const t = a.galleries ?? [];
+        s.value = (s.value + 1) % t.length;
       }, 3e3));
-    }, h = () => {
-      v.value && (window.clearInterval(v.value), v.value = void 0);
-    }, B = p(() => r.width != null ? r.width : r.size === "small" ? 30 : r.size === "medium" ? 80 : 125), u = p(() => {
-      var e, t;
-      return !r.src || w.value ? c.value.placeholder : typeof r.src == "string" ? r.src.includes("http") || // From public image
-      r.src.includes("data:image/png;base64") ? r.src : (t = (e = c.value).getImageURL) == null ? void 0 : t.call(e, r.src, B.value) : r.src;
-    }), V = p(() => {
-      var t, l, a, g;
-      const e = u.value;
+    }, w = () => {
+      p.value && (window.clearInterval(p.value), p.value = void 0);
+    }, R = I(() => a.width != null ? a.width : a.size === "small" ? 30 : a.size === "medium" ? 80 : 125), m = J(
+      async () => {
+        var e, t;
+        return !a.src || f.value ? i.value.placeholder : typeof a.src == "string" ? (a.src.includes("http") || // From public image
+        /^data:image\/[a-zA-Z0-9.+-]+;base64,/.test(a.src) ? a.src : await ((t = (e = i.value).getImageURL) == null ? void 0 : t.call(e, a.src, R.value))) || i.value.placeholder : a.src;
+      },
+      i.value.placeholder
+      // Show placeholder while fetching image
+    ), y = d(), G = async () => {
+      var t, r, o, c;
+      if (y.value != null) return;
+      let e = m.value;
       if (typeof e == "string") {
-        const s = (l = (t = c.value).getImageURL) == null ? void 0 : l.call(t, "preview"), i = s && !(s != null && s.includes("undefined")) ? new URL(s).origin : "", R = i && e.includes(i);
-        return e.includes("http") && !R || // From public resource
-        e.includes("data:image/svg+xml") ? e : (g = (a = c.value).getImageURL) == null ? void 0 : g.call(a, r.src);
+        const l = (r = (t = i.value).getImageURL) == null ? void 0 : r.call(t, "preview"), n = typeof l == "string" && !(l != null && l.includes("undefined")) ? new URL(l).origin : "", B = n && e.includes(n) || // For getImageURL that return the image full url
+        l instanceof Promise;
+        e = e.includes("http") && !B || // From public resource
+        e.includes("data:image/svg+xml") ? e : await ((c = (o = i.value).getImageURL) == null ? void 0 : c.call(o, a.src));
       }
-      return e;
-    }), y = (e) => {
-      h(), typeof e == "number" && (o.value = e), L.value ? window.clearTimeout(L.value) : window.setTimeout($, 3e3);
-    }, d = (e) => {
-      var l;
-      const t = (l = e.target) == null ? void 0 : l.src;
-      (t === u.value || t.includes(u.value.toString())) && (w.value = !0);
-    }, S = (e) => {
-      var l, a;
+      y.value = e || i.value.placeholder;
+    }, h = (e) => {
+      w(), typeof e == "number" && (s.value = e), S.value ? window.clearTimeout(S.value) : window.setTimeout(L, 3e3);
+    }, v = (e) => {
+      var r;
+      const t = (r = e.target) == null ? void 0 : r.src;
+      (t === m.value || t.includes(m.value.toString())) && (f.value = !0);
+    }, U = (e) => {
+      var r, o, c;
       const t = e;
-      return typeof t == "string" ? t.includes("http") ? t : (a = (l = c.value).getImageURL) == null ? void 0 : a.call(l, t) : t;
+      return typeof t == "string" ? t.includes("http") ? t : (c = (o = (r = i.value).getImageURL) == null ? void 0 : o.call(r, t)) == null ? void 0 : c.toString() : t;
     };
     return (e, t) => {
-      var l;
-      return n(), W(q(Q), I(e.$props, {
-        preview: F.value,
-        pt: { root: (l = e.$preset.image) == null ? void 0 : l.root({ props: e.$props }) }
-      }), {
+      var r;
+      return u(), q(D(X), {
+        "image-class": e.imageClass,
+        "image-style": e.imageStyle,
+        preview: V.value,
+        pt: { root: (r = e.$preset.image) == null ? void 0 : r.root({ props: e.$props }) },
+        "zoom-in-disabled": e.zoomInDisabled,
+        "zoom-out-disabled": e.zoomOutDisabled,
+        onShow: G
+      }, {
         image: b(() => {
-          var a;
+          var o;
           return [
-            U("img", I((a = e.$preset.image) == null ? void 0 : a.image({ props: e.$props, context: { imageSize: B.value } }), {
-              onerror: d,
-              src: u.value,
+            $("img", T((o = e.$preset.image) == null ? void 0 : o.image({ props: e.$props, context: { imageSize: R.value } }), {
+              onerror: v,
+              src: D(m),
               alt: ""
-            }), null, 16, Y)
+            }), null, 16, ee)
           ];
         }),
         indicatoricon: b(() => [
-          C(X, I(e.$preset.image.icon, { icon: "eye" }), null, 16)
+          C(Y, T(e.$preset.image.icon, { icon: "eye" }), null, 16)
         ]),
-        preview: b((a) => {
-          var g;
+        preview: b((o) => {
+          var c;
           return [
-            (g = e.galleries) != null && g.length ? (n(), m(_, { key: 1 }, [
-              (n(!0), m(_, null, T(e.galleries, ({ src: s }, i) => A((n(), m("img", {
-                key: i,
-                onerror: d,
-                src: S(s),
-                style: k(a.style),
+            (c = e.galleries) != null && c.length ? (u(), g(z, { key: 1 }, [
+              (u(!0), g(z, null, O(e.galleries, ({ src: l }, n) => x((u(), g("img", {
+                key: n,
+                onerror: v,
+                src: U(l),
+                style: k(o.style),
                 alt: "",
                 "data-wv-section": "image-gallery"
-              }, null, 12, ee)), [
-                [H, i === o.value]
+              }, null, 12, ae)), [
+                [H, n === s.value]
               ])), 128)),
-              U("div", {
-                onClick: t[0] || (t[0] = D(() => {
+              $("div", {
+                onClick: t[0] || (t[0] = P(() => {
                 }, ["stop"])),
                 class: "fixed bottom-0 left-0 flex justify-center items-center w-full p-4 mx-auto flex-row bg-black/80",
                 "data-wv-section": "gallery-thumbnail"
               }, [
-                C(O, {
-                  class: z([
+                C(E, {
+                  class: _([
                     "text-surface-0 rotate-180 sticky left-0 !w-8 !h-8 [&_i]:w-5 [&_i]:h-5",
                     "rounded-full mr-3"
                   ]),
-                  onClick: P,
+                  onClick: A,
                   "aria-label": "Previous Image",
                   "data-wv-section": "prev-button",
                   icon: "arrow-right",
@@ -126,25 +138,25 @@ const Y = ["src"], Z = ["src"], ee = ["src"], te = ["src", "onClick"], ne = /* @
                   severity: "secondary",
                   text: ""
                 }),
-                (n(!0), m(_, null, T(e.galleries, ({ src: s }, i) => (n(), m("img", {
-                  key: i,
-                  class: z([
+                (u(!0), g(z, null, O(e.galleries, ({ src: l }, n) => (u(), g("img", {
+                  key: n,
+                  class: _([
                     "h-10 w-10 object-cover cursor-pointer opacity-50 hover:opacity-100 transition-opacity",
-                    { "!opacity-100": o.value == i }
+                    { "!opacity-100": s.value == n }
                   ]),
-                  onerror: d,
-                  src: S(s),
-                  style: k(a.style),
-                  onClick: D((R) => y(i), ["stop"]),
+                  onerror: v,
+                  src: U(l),
+                  style: k(o.style),
+                  onClick: P((B) => h(n), ["stop"]),
                   alt: "",
                   "data-wv-section": "thumbnail-image"
-                }, null, 14, te))), 128)),
-                C(O, {
-                  class: z([
+                }, null, 14, re))), 128)),
+                C(E, {
+                  class: _([
                     "text-surface-0 sticky !w-8 !h-8 [&_i]:w-5 [&_i]:h-5",
                     "rounded-full ml-3"
                   ]),
-                  onClick: N,
+                  onClick: j,
                   "aria-label": "Next Image",
                   "data-wv-section": "next-button",
                   icon: "arrow-right",
@@ -152,20 +164,20 @@ const Y = ["src"], Z = ["src"], ee = ["src"], te = ["src", "onClick"], ne = /* @
                   text: ""
                 })
               ])
-            ], 64)) : (n(), m("img", {
+            ], 64)) : (u(), g("img", {
               key: 0,
-              onerror: d,
-              src: V.value,
-              style: k(a.style),
+              onerror: v,
+              src: y.value,
+              style: k(o.style),
               alt: ""
-            }, null, 12, Z))
+            }, null, 12, te))
           ];
         }),
         _: 1
-      }, 16, ["preview", "pt"]);
+      }, 8, ["image-class", "image-style", "preview", "pt", "zoom-in-disabled", "zoom-out-disabled"]);
     };
   }
 });
 export {
-  ne as _
+  me as _
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fewangsit/wangsvue-fats",
-  "version": "1.0.1-alpha.35",
+  "version": "1.0.1-alpha.36",
   "author": "Wangsit FE Developer",
   "description": "Fixed Asset Tagsamurai VueJS Component Library",
   "type": "module",