tsv2-library 1.0.61-alpha.20 → 1.0.61-alpha.21

package/dist/src/utils/getImageURL.util.d.ts

@@ -1,4 +1,4 @@
-export declare const buildFileURL: (name: string, width?: number, height?: number) => string;
+export declare const buildFileURL: (name?: string, width?: number, height?: number) => string;
 export declare const fetchBlobFile: (url: string, token: string) => Promise<Blob>;
 /**
  *

package/dist/tsv2-library.es.js

@@ -19574,7 +19574,7 @@ const useToast = () => {
 };
 const buildFileURL = (name, width2, height) => {
   const BASE_URL2 = new URL("https://dev-api.tagsamurai.com/fam").origin;
-  let url = name.startsWith("http") ? name : `${BASE_URL2}/file-storage/api/file/${name.replace(/^\/+/, "")}`;
+  let url = (name == null ? void 0 : name.startsWith("http")) ? name : `${BASE_URL2}/file-storage/api/file/${name == null ? void 0 : name.replace(/^\/+/, "")}`;
   if (width2 || height) {
     const params = new URLSearchParams();
     if (width2) {
@@ -55277,7 +55277,7 @@ const _hoisted_4$e = ["alt", "src", "onClick"];
 const _sfc_main$Q = /* @__PURE__ */ defineComponent({
   __name: "Image",
   props: {
-    thumbnail: { default: Placeholder },
+    thumbnail: {},
     preview: {},
     rounded: { type: Boolean, default: false },
     description: { default: "TAG Samurai Image Resource" },
@@ -55297,6 +55297,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
       setTimeout(() => {
         startInterval();
       }, 3e3);
+      resolveGallerySrcs();
     });
     onUnmounted(() => {
       stopInterval();
@@ -55305,10 +55306,45 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
     const intervalId = shallowRef();
     const timeOutId = shallowRef();
     const errorLoadImage = shallowRef(false);
+    const resolvedGallerySrcs = ref([]);
     const usePreview = computed(() => {
-      var _a;
-      return !errorLoadImage.value && (!!props.preview || !((_a = imageThumbnail.value) == null ? void 0 : _a.toString().includes("data:image/svg+xml")));
+      var _a, _b;
+      return !errorLoadImage.value && (!!props.preview || !((_a = imageThumbnail.value) == null ? void 0 : _a.toString().includes("data:image/svg+xml"))) && !((_b = imageThumbnail.value) == null ? void 0 : _b.toString().toLowerCase().includes("placeholder"));
     });
+    const imageThumbnail = computedAsync(
+      async () => {
+        if (!props.thumbnail || errorLoadImage.value) {
+          console.log("👽👽👽 1:");
+          return Placeholder;
+        }
+        if (typeof props.thumbnail === "string") {
+          console.log("👽👽👽 2:");
+          return props.thumbnail.includes("http") || props.thumbnail.includes("data:image/svg+xml") ? props.thumbnail : await getImageURL(props.thumbnail);
+        }
+        console.log("👽👽👽 3:");
+        return props.thumbnail;
+      }
+    );
+    const imagePreview = computedAsync(async () => {
+      const preview = props.preview || imageThumbnail.value;
+      if (typeof preview === "string") {
+        return preview.includes("http") || preview.includes("data:image/svg+xml") ? preview : await getImageURL(preview);
+      }
+      return preview;
+    });
+    const resolveGallerySrcs = async () => {
+      var _a;
+      if (!((_a = props.galleries) == null ? void 0 : _a.length)) {
+        resolvedGallerySrcs.value = [];
+        return;
+      }
+      const srcs = await Promise.all(
+        props.galleries.map(
+          ({ preview, thumbnail }) => getGalleryImageSrc(preview, thumbnail)
+        )
+      );
+      resolvedGallerySrcs.value = srcs.map((src) => src ?? "");
+    };
     const nextImage = () => {
       const images = props.galleries ?? [];
       currentGalleryImage.value = (currentGalleryImage.value + 1) % images.length;
@@ -55335,23 +55371,6 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
         intervalId.value = void 0;
       }
     };
-    const imageThumbnail = computedAsync(
-      async () => {
-        if (!props.thumbnail || errorLoadImage.value)
-          return Placeholder;
-        if (typeof props.thumbnail === "string") {
-          return props.thumbnail.includes("http") || props.thumbnail.includes("data:image/svg+xml") ? props.thumbnail : await getImageURL(props.thumbnail);
-        }
-        return props.thumbnail;
-      }
-    );
-    const imagePreview = computedAsync(async () => {
-      const preview = props.preview || imageThumbnail.value;
-      if (typeof preview === "string") {
-        return preview.includes("http") || preview.includes("data:image/svg+xml") ? preview : await getImageURL(preview);
-      }
-      return preview;
-    });
     const handleThumbnailClick = (index2) => {
       stopInterval();
       if (typeof index2 === "number")
@@ -55368,13 +55387,14 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
         errorLoadImage.value = true;
       }
     };
-    const getGalleryImageSrc = (preview, thumbnail) => {
+    const getGalleryImageSrc = async (preview, thumbnail) => {
       const image2 = preview || thumbnail;
       if (typeof image2 === "string") {
-        return image2.includes("http") ? image2 : getImageURL(image2);
+        return image2.includes("http") ? image2 : await getImageURL(image2);
       }
       return image2;
     };
+    watch(() => props.galleries, resolveGallerySrcs, { immediate: true });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(script$h), mergeProps(_ctx.$props, {
         class: [
@@ -55409,12 +55429,12 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
               src: unref(imagePreview),
               style: normalizeStyle(slotProps.style)
             }, null, 12, _hoisted_2$y)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.galleries, ({ preview, thumbnail, description }, index2) => {
+              (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.galleries, ({ description }, index2) => {
                 return withDirectives((openBlock(), createElementBlock("img", {
                   key: index2,
                   alt: description,
                   onerror: onErrorLoadImage,
-                  src: getGalleryImageSrc(preview, thumbnail),
+                  src: resolvedGallerySrcs.value[index2],
                   style: normalizeStyle(slotProps.style),
                   "data-ts-section": "image-gallery"
                 }, null, 12, _hoisted_3$l)), [
@@ -55440,7 +55460,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
                   severity: "secondary",
                   text: ""
                 }),
-                (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.galleries, ({ thumbnail, description }, index2) => {
+                (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.galleries, ({ description }, index2) => {
                   return openBlock(), createElementBlock("img", {
                     key: index2,
                     alt: description ?? "TAG Samurai Gallery",
@@ -55449,7 +55469,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
                       { "!opacity-100": currentGalleryImage.value == index2 }
                     ]),
                     onerror: onErrorLoadImage,
-                    src: unref(getImageURL)(thumbnail),
+                    src: resolvedGallerySrcs.value[index2],
                     style: normalizeStyle(slotProps.style),
                     onClick: withModifiers(($event) => handleThumbnailClick(index2), ["stop"]),
                     "data-ts-section": "thumbnail-image"