@fewangsit/wangsvue-fats 1.0.1-alpha.63 → 1.0.1-alpha.65

package/buttonselecttree/index.d.ts

@@ -155,7 +155,7 @@ export interface ButtonSelectTreeProps {
   /**
    * Defines the group tree to disable excluded keys
    */
-  excludedKeys?: string[] | number[];
+  excludedKeys?: string[];
   /**
    * Define wether single selection can be edited or readonly
    * @default true

package/dialogselecttree/index.d.ts

@@ -89,6 +89,12 @@ export interface DialogSelectTreeProps
    */
   hidden?: boolean;
 
+  /**
+   * Determines whether the selection state of a node should propagate
+   * both upward to its parent node and downward to its child nodes.
+   *
+   * @default true
+   */
   propagateSelection?: boolean;
 }
 

package/dialogselecttree/index.es.js

@@ -1,4 +1,4 @@
-import { defineComponent as G, mergeModels as T, useModel as P, inject as U, ref as o, computed as W, watch as b, createBlock as N, openBlock as d, unref as v, createSlots as O, withCtx as g, createVNode as B, mergeProps as z, renderSlot as D, createElementVNode as K, createElementBlock as k, createCommentVNode as h, normalizeClass as V, toDisplayString as L, Fragment as I, renderList as Y, withDirectives as q, vShow as J } from "vue";
+import { defineComponent as G, mergeModels as T, useModel as P, inject as U, ref as o, computed as W, watch as b, createBlock as N, openBlock as d, unref as f, createSlots as O, withCtx as g, createVNode as B, mergeProps as z, renderSlot as D, createElementVNode as K, createElementBlock as k, createCommentVNode as h, normalizeClass as V, toDisplayString as L, Fragment as I, renderList as Y, withDirectives as q, vShow as J } from "vue";
 import { g as Q } from "../utils/object.util.es.js";
 import { _ as j } from "../button/index.es.js";
 import { _ as R } from "../dialog/index.es.js";
@@ -40,7 +40,7 @@ const ee = {
     flattenDisposableNode: { type: Boolean },
     excludedKeys: {},
     hidden: { type: Boolean },
-    propagateSelection: { type: Boolean },
+    propagateSelection: { type: Boolean, default: !0 },
     selectedKeys: {},
     selectedTreeNodes: {},
     useOption: { type: Boolean },
@@ -78,7 +78,7 @@ const ee = {
   }),
   emits: /* @__PURE__ */ T(["select", "hide"], ["update:visible"]),
   setup($, { expose: A, emit: x }) {
-    const s = $, C = x, n = P($, "visible"), f = U("preset", {}).dialog, r = o(), p = o(""), y = o(""), m = o([]), c = o(), S = o(), E = o(!1), u = o(), w = o(), H = W(() => s.header ? s.header : s.type === "group" ? "Select Group" : "Select Category"), M = (e = !0) => {
+    const s = $, C = x, n = P($, "visible"), v = U("preset", {}).dialog, r = o(), p = o(""), y = o(""), m = o([]), c = o(), S = o(), E = o(!1), u = o(), w = o(), H = W(() => s.header ? s.header : s.type === "group" ? "Select Group" : "Select Category"), M = (e = !0) => {
       c.value = u.value, S.value = w.value, Object.keys(c.value ?? {}).length ? (C("select", {
         keys: c.value,
         selectedNodes: m.value,
@@ -115,7 +115,7 @@ const ee = {
       pt: {
         root: {
           class: [
-            ...v(f).root({ state: {} }).class,
+            ...f(v).root({ state: {} }).class,
             "!w-[400px]",
             { "!hidden": e.hidden }
           ]
@@ -128,7 +128,7 @@ const ee = {
         },
         content: {
           class: [
-            ...v(f).content({ state: {}, instance: {} }).class,
+            ...f(v).content({ state: {}, instance: {} }).class,
             "pr-1.5 focus-visible:outline-none"
           ]
         },
@@ -161,17 +161,17 @@ const ee = {
             return [
               K("div", ee, [
                 K("h3", {
-                  class: V([...v(f).title.class, "!leading-6"])
+                  class: V([...f(v).title.class, "!leading-6"])
                 }, L(H.value), 3),
                 e.lists ? (d(), k("ul", le, [
                   (d(!0), k(I, null, Y(e.lists, (i, F) => (d(), k("li", {
                     key: F,
                     class: "text-xs leading-[16.39px] tracking-[0.02em] font-medium text-general-800 list-disc ps-[6px]"
-                  }, L(e.listLabel && typeof i != "string" ? v(Q)(i, e.listLabel) : i), 1))), 128))
+                  }, L(e.listLabel && typeof i != "string" ? f(Q)(i, e.listLabel) : i), 1))), 128))
                 ])) : h("", !0),
                 e.subHeader ? (d(), k("h4", {
                   key: 1,
-                  class: V([...v(f).title.class, "!leading-6 text-sm"])
+                  class: V([...f(v).title.class, "!leading-6 text-sm"])
                 }, L(e.subHeader), 3)) : h("", !0),
                 (a = r.value) != null && a.isLoading ? h("", !0) : (d(), N(Z, {
                   key: 2,

package/image/index.d.ts

@@ -296,6 +296,17 @@ export interface ImageProps {
    * It should be preserved by project configuration.
    */
   placeholder?: string | undefined;
+
+  /**
+   * Use default value for width and height if not specified. The default size is 125px.
+   * @defaultValue true
+   */
+  useDefaultSize?: boolean;
+
+  /**
+   * The size of thumbnail image (in px) if props.width is undefined and props.useDefaultSize is false.
+   */
+  thumbnailSize?: number;
 }
 
 /**

package/image/index.es.js

@@ -1,11 +1,11 @@
-import { defineComponent as W, computed as I, onMounted as Z, onUnmounted as q, shallowRef as d, watch as x, createBlock as H, openBlock as m, unref as $, withCtx as k, createElementBlock as g, normalizeStyle as z, Fragment as L, createElementVNode as j, renderList as D, withDirectives as J, vShow as K, withModifiers as P, createVNode as R, normalizeClass as U, mergeProps as T } from "vue";
-import { c as Q } from "../vendor/@vueuse/core/index.es.js";
-import { u as X } from "../plugins/WangsVue.es.js";
-import { m as Y } from "../utils/mergePropsWithDefaults.util.es.js";
+import { defineComponent as W, computed as I, onMounted as Z, onUnmounted as q, shallowRef as d, watch as H, createBlock as J, openBlock as m, unref as D, withCtx as z, createElementBlock as g, normalizeStyle as k, Fragment as L, createElementVNode as $, renderList as j, withDirectives as K, vShow as Q, withModifiers as P, createVNode as S, normalizeClass as R, mergeProps as T } from "vue";
+import { c as X } from "../vendor/@vueuse/core/index.es.js";
+import { u as Y } from "../plugins/WangsVue.es.js";
+import { m as x } from "../utils/mergePropsWithDefaults.util.es.js";
 import { s as ee } from "../vendor/primevue/image/image.esm.es.js";
 import { _ as E } from "../button/index.es.js";
 import { _ as te } from "../icon/index.es.js";
-const ae = ["src"], oe = ["src"], le = ["src"], re = ["src", "onClick"], de = /* @__PURE__ */ W({
+const ae = ["src"], oe = ["src"], le = ["src"], ie = ["src", "onClick"], de = /* @__PURE__ */ W({
   __name: "Image",
   props: {
     src: {},
@@ -23,81 +23,88 @@ const ae = ["src"], oe = ["src"], le = ["src"], re = ["src", "onClick"], de = /*
     ptOptions: {},
     unstyled: { type: Boolean },
     getImageURL: {},
-    placeholder: {}
+    placeholder: {},
+    useDefaultSize: { type: Boolean, default: !0 },
+    thumbnailSize: {}
   },
   setup(F) {
-    const a = F, { defaultProps: N } = X("Image"), s = I(() => Y(a, N));
+    const t = F, { defaultProps: N } = Y("Image"), s = I(() => x(t, N));
     Z(() => {
       setTimeout(() => {
-        _();
+        C();
       }, 3e3);
     }), q(() => {
-      w(), typeof r.value == "string" && r.value.includes("blob") && URL.revokeObjectURL(r.value);
+      w(), typeof i.value == "string" && i.value.includes("blob") && URL.revokeObjectURL(i.value);
       for (const e of h) URL.revokeObjectURL(e);
     });
-    const n = d(0), v = d(), C = d(), y = d(!1), h = [], V = I(() => {
+    const n = d(0), v = d(), U = d(), y = d(!1), h = [], V = I(() => {
       var e;
-      return a.preview === !1 ? !1 : !y.value && !((e = r.value) != null && e.toString().includes("data:image/png;base64")) && r.value !== s.value.placeholder;
+      return t.preview === !1 ? !1 : !y.value && !((e = i.value) != null && e.toString().includes("data:image/png;base64")) && i.value !== s.value.placeholder;
     }), A = () => {
-      const e = a.galleries ?? [];
+      const e = t.galleries ?? [];
       n.value = (n.value + 1) % e.length, b();
     }, G = () => {
-      const e = a.galleries ?? [];
+      const e = t.galleries ?? [];
       n.value = (n.value - 1 + e.length) % e.length, b();
-    }, _ = () => {
+    }, C = () => {
       var e;
-      w(), (e = a.galleries) != null && e.length && (v.value = window.setInterval(() => {
-        const t = a.galleries ?? [];
-        n.value = (n.value + 1) % t.length;
+      w(), (e = t.galleries) != null && e.length && (v.value = window.setInterval(() => {
+        const a = t.galleries ?? [];
+        n.value = (n.value + 1) % a.length;
       }, 3e3));
     }, w = () => {
       v.value && (window.clearInterval(v.value), v.value = void 0);
-    }, S = I(() => a.width != null ? a.width : a.size === "small" ? 30 : a.size === "medium" ? 80 : 125), r = Q(
+    }, _ = I(() => {
+      if (t.width != null) return t.width;
+      if (t.size === "small") return 30;
+      if (t.size === "medium") return 80;
+      if (t.useDefaultSize) return 125;
+    }), i = X(
       async () => {
-        var e, t;
-        if (!a.src || y.value) return s.value.placeholder;
-        if (typeof a.src == "string") {
-          const o = a.src.includes("http") || // From public image or ObjectURL from Blob e.g 'blob:http://localhost:5173/ca48705d-1fc1-4a74-af38-353ffce7e02a'
-          /^data:image\/[a-zA-Z0-9.+-]+;base64,/.test(a.src) ? a.src : await ((t = (e = s.value).getImageURL) == null ? void 0 : t.call(e, a.src, S.value));
+        var e, a;
+        if (!t.src || y.value) return s.value.placeholder;
+        if (typeof t.src == "string") {
+          const o = t.src.includes("http") || // From public image or ObjectURL from Blob e.g 'blob:http://localhost:5173/ca48705d-1fc1-4a74-af38-353ffce7e02a'
+          /^data:image\/[a-zA-Z0-9.+-]+;base64,/.test(t.src) ? t.src : await ((a = (e = s.value).getImageURL) == null ? void 0 : a.call(e, t.src, _.value));
           return typeof o == "string" && o.includes("blob") && h.push(o), o || s.value.placeholder;
         }
-        return a.src;
+        return t.src;
       },
       s.value.placeholder
       // Show placeholder while fetching image
     ), p = d(), M = async () => {
-      var t, o, l, u;
+      var a, o, l, c;
       if (p.value != null) return;
-      let e = r.value;
+      let e = i.value;
       if (typeof e == "string") {
-        const i = (o = (t = s.value).getImageURL) == null ? void 0 : o.call(
-          t,
+        const r = (o = (a = s.value).getImageURL) == null ? void 0 : o.call(
+          a,
           "preview",
           void 0,
           void 0,
           !0
-        ), c = typeof i == "string" && !(i != null && i.includes("undefined")) ? new URL(i).origin : "", B = c && e.includes(c) || // For getImageURL that return the image full url
-        i instanceof Promise;
-        e = e.includes("http") && !B || // From public resource
-        e.includes("data:image/svg+xml") ? e : await ((u = (l = s.value).getImageURL) == null ? void 0 : u.call(l, a.src));
+        ), u = typeof r == "string" && !(r != null && r.includes("undefined")) ? new URL(r).origin : "", O = u && e.includes(u) || // For getImageURL that return the image full url
+        r instanceof Promise;
+        e = e.includes("http") && !O || // From public resource
+        e.includes("data:image/svg+xml") ? e : await ((c = (l = s.value).getImageURL) == null ? void 0 : c.call(l, t.src));
       }
       typeof e == "string" && e.includes("blob") && h.push(e), p.value = e || s.value.placeholder;
     }, b = (e) => {
-      w(), typeof e == "number" && (n.value = e), C.value ? window.clearTimeout(C.value) : window.setTimeout(_, 3e3);
+      w(), typeof e == "number" && (n.value = e), U.value ? window.clearTimeout(U.value) : window.setTimeout(C, 3e3);
     }, f = (e) => {
       var o;
-      const t = (o = e.target) == null ? void 0 : o.src;
-      (t === r.value || t.includes(r.value.toString())) && (y.value = !0);
-    }, O = (e) => {
-      var o, l, u;
-      const t = e;
-      return typeof t == "string" ? t.includes("http") ? t : (u = (l = (o = s.value).getImageURL) == null ? void 0 : l.call(o, t)) == null ? void 0 : u.toString() : t;
+      const a = (o = e.target) == null ? void 0 : o.src;
+      (a === i.value || a.includes(i.value.toString())) && (y.value = !0);
+    }, B = (e) => {
+      var o, l, c;
+      const a = e;
+      return typeof a == "string" ? a.includes("http") ? a : (c = (l = (o = s.value).getImageURL) == null ? void 0 : l.call(o, a)) == null ? void 0 : c.toString() : a;
     };
-    return x(r, () => {
+    return H(i, () => {
       p.value = void 0;
-    }), (e, t) => {
+    }), (e, a) => {
       var o;
-      return m(), H($(ee), {
+      return m(), J(D(ee), {
         "image-class": e.imageClass,
         "image-style": e.imageStyle,
         preview: V.value,
@@ -106,41 +113,47 @@ const ae = ["src"], oe = ["src"], le = ["src"], re = ["src", "onClick"], de = /*
         "zoom-out-disabled": e.zoomOutDisabled,
         onShow: M
       }, {
-        image: k(() => {
+        image: z(() => {
           var l;
           return [
-            j("img", T((l = e.$preset.image) == null ? void 0 : l.image({ props: e.$props, context: { imageSize: S.value } }), {
-              onerror: f,
-              src: $(r),
-              alt: ""
-            }), null, 16, ae)
+            $("img", T(
+              (l = e.$preset.image) == null ? void 0 : l.image({
+                props: e.$props,
+                context: { imageSize: _.value ?? e.thumbnailSize }
+              }),
+              {
+                onerror: f,
+                src: D(i),
+                alt: ""
+              }
+            ), null, 16, ae)
           ];
         }),
-        indicatoricon: k(() => [
-          R(te, T(e.$preset.image.icon, { icon: "eye" }), null, 16)
+        indicatoricon: z(() => [
+          S(te, T(e.$preset.image.icon, { icon: "eye" }), null, 16)
         ]),
-        preview: k((l) => {
-          var u;
+        preview: z((l) => {
+          var c;
           return [
-            (u = e.galleries) != null && u.length ? (m(), g(L, { key: 1 }, [
-              (m(!0), g(L, null, D(e.galleries, ({ src: i }, c) => J((m(), g("img", {
-                key: c,
+            (c = e.galleries) != null && c.length ? (m(), g(L, { key: 1 }, [
+              (m(!0), g(L, null, j(e.galleries, ({ src: r }, u) => K((m(), g("img", {
+                key: u,
                 onerror: f,
-                src: O(i),
-                style: z(l.style),
+                src: B(r),
+                style: k(l.style),
                 alt: "",
                 "data-wv-section": "image-gallery"
               }, null, 12, le)), [
-                [K, c === n.value]
+                [Q, u === n.value]
               ])), 128)),
-              j("div", {
-                onClick: t[0] || (t[0] = P(() => {
+              $("div", {
+                onClick: a[0] || (a[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"
               }, [
-                R(E, {
-                  class: U([
+                S(E, {
+                  class: R([
                     "text-surface-0 rotate-180 sticky left-0 !w-8 !h-8 [&_i]:w-5 [&_i]:h-5",
                     "rounded-full mr-3"
                   ]),
@@ -152,21 +165,21 @@ const ae = ["src"], oe = ["src"], le = ["src"], re = ["src", "onClick"], de = /*
                   severity: "secondary",
                   text: ""
                 }),
-                (m(!0), g(L, null, D(e.galleries, ({ src: i }, c) => (m(), g("img", {
-                  key: c,
-                  class: U([
+                (m(!0), g(L, null, j(e.galleries, ({ src: r }, u) => (m(), g("img", {
+                  key: u,
+                  class: R([
                     "h-10 w-10 object-cover cursor-pointer opacity-50 hover:opacity-100 transition-opacity",
-                    { "!opacity-100": n.value == c }
+                    { "!opacity-100": n.value == u }
                   ]),
                   onerror: f,
-                  src: O(i),
-                  style: z(l.style),
-                  onClick: P((B) => b(c), ["stop"]),
+                  src: B(r),
+                  style: k(l.style),
+                  onClick: P((O) => b(u), ["stop"]),
                   alt: "",
                   "data-wv-section": "thumbnail-image"
-                }, null, 14, re))), 128)),
-                R(E, {
-                  class: U([
+                }, null, 14, ie))), 128)),
+                S(E, {
+                  class: R([
                     "text-surface-0 sticky !w-8 !h-8 [&_i]:w-5 [&_i]:h-5",
                     "rounded-full ml-3"
                   ]),
@@ -182,7 +195,7 @@ const ae = ["src"], oe = ["src"], le = ["src"], re = ["src", "onClick"], de = /*
               key: 0,
               onerror: f,
               src: p.value,
-              style: z(l.style),
+              style: k(l.style),
               alt: ""
             }, null, 12, oe))
           ];

package/package.json

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