@finema/core 1.4.132 → 1.4.133

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@finema/core",
-  "version": "1.4.132",
+  "version": "1.4.133",
   "configKey": "core",
   "compatibility": {
     "nuxt": "^3.7.4"

package/dist/module.mjs

@@ -1,7 +1,7 @@
 import { defineNuxtModule, createResolver, installModule, addPlugin, addComponentsDir, addImportsDir } from '@nuxt/kit';
 
 const name = "@finema/core";
-const version = "1.4.132";
+const version = "1.4.133";
 
 const colors = {
   black: "#20243E",

package/dist/runtime/components/Form/InputUploadDropzoneAuto/index.vue

@@ -67,14 +67,10 @@
         </div>
 
         <!-- Success State -->
-        <div v-if="selectedFile && upload.status.value.isSuccess" :class="[ui.onPreview.wrapper]">
+        <div v-if="value" :class="[ui.onPreview.wrapper]">
           <div :class="[ui.onPreview.previewImgWrapper]">
-            <div v-if="isImage(selectedFile)" class="size-full overflow-hidden">
-              <img
-                :src="upload.data.value[responseURL || 'url']"
-                :class="[ui.onPreview.previewImgClass]"
-                alt="img-preview"
-              />
+            <div v-if="isImageFromPath(value.path)" class="size-full overflow-hidden">
+              <img :src="value.url" :class="[ui.onPreview.previewImgClass]" alt="img-preview" />
             </div>
             <div v-else>
               <Icon
@@ -85,18 +81,18 @@
           </div>
           <div :class="[ui.onPreview.textWrapper]">
             <div class="truncate">
-              <h1 class="truncate font-bold">{{ selectedFile?.name }}</h1>
+              <h1 class="truncate font-bold">{{ value.name }}</h1>
               <p class="truncate text-sm font-light text-gray-400">
                 {{
-                  fileAllocate.isSelectedFileUseMb.value
+                  fileAllocateFromPath.isSelectedFileUseMb.value
                     ? `${fileAllocate.selectedFileSizeMb.value} MB`
-                    : `${fileAllocate.selectedFileSizeKb.value} KB`
+                    : `${fileAllocateFromPath.selectedFileSizeKb.value} KB`
                 }}
               </p>
             </div>
             <div :class="[ui.action.wrapper]">
               <Icon
-                v-if="isImage(selectedFile)"
+                v-if="isImageFromPath(value.path)"
                 :name="ui.action.previewIcon"
                 :class="[ui.action.iconClass]"
                 title="ดูตัวอย่าง"
@@ -114,8 +110,8 @@
                 title="ลบไฟล์"
                 @click="handleDeleteFile"
               />
-              <Modal v-model="isPreviewOpen" :title="selectedFile?.name">
-                <img :src="_get(upload.data.value, responseURL)" alt="img-preview" />
+              <Modal v-model="isPreviewOpen" :title="value.name">
+                <img :src="value.url" alt="img-preview" />
               </Modal>
             </div>
           </div>
@@ -173,6 +169,8 @@ import {
   downloadFileFromURL,
   useFileAllocate,
   useFileProgress,
+  isImageFromPath,
+  useFileAllocateFromPath,
 } from '#core/helpers/componentHelper'
 import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
 import { useFieldHOC } from '#core/composables/useForm'
@@ -223,6 +221,7 @@ const isPreviewOpen = ref<boolean>(false)
 
 const { onUploadProgress, onDownloadProgress, percent } = useFileProgress()
 const fileAllocate = useFileAllocate(selectedFile, props)
+const fileAllocateFromPath = useFileAllocateFromPath(value, props)
 
 const onDrop = (files: File[] | null) => {
   if (props.isDisabled || files?.length === 0 || !files) return
@@ -306,7 +305,7 @@ const handleCheckFileCondition = (file: File | undefined): boolean => {
 }
 
 const handleDownloadFile = () => {
-  downloadFileFromURL(_get(upload.data.value, props.responseURL), selectedFile.value?.name)
+  downloadFileFromURL(value.value?.url, value.value?.name)
 }
 
 const handleRetryUpload = () => {

package/dist/runtime/helpers/componentHelper.d.ts

@@ -1,4 +1,5 @@
 import type { Ref } from 'vue';
+import type { IFileValue } from '#core/components/Form/types';
 export declare const checkMaxSize: (file: File, acceptFileSize?: number) => boolean;
 export declare const checkFileType: (file: File, acceptFileType: string | string[]) => boolean;
 export declare const generateURL: (file: File) => string;
@@ -16,6 +17,18 @@ export declare const useFileAllocate: (selectedFile: Ref<File | undefined | null
     isAcceptFileUseMb: any;
     acceptFile: any;
 };
+export declare const useFileAllocateFromPath: (file: Ref<IFileValue | undefined | null>, props: {
+    accept?: string | string[];
+    maxSize?: number;
+}) => {
+    selectedFileSizeKb: any;
+    selectedFileSizeMb: any;
+    isSelectedFileUseMb: any;
+    acceptFileSizeKb: any;
+    acceptFileSizeMb: any;
+    isAcceptFileUseMb: any;
+    acceptFile: any;
+};
 export declare const useFileSize: (size?: number) => {
     isSelectedFileUseMb: any;
     selectedFileSizeKb: any;

package/dist/runtime/helpers/componentHelper.mjs

@@ -65,6 +65,26 @@ export const useFileAllocate = (selectedFile, props) => {
     acceptFile
   };
 };
+export const useFileAllocateFromPath = (file, props) => {
+  const selectedFileSizeKb = computed(() => ((file.value?.size || 0) / 1e3).toFixed(2));
+  const selectedFileSizeMb = computed(() => ((file.value?.size || 0) / 1e3 / 1e3).toFixed(2));
+  const isSelectedFileUseMb = computed(() => (file.value?.size || 0) / 1e3 > 1024);
+  const acceptFileSizeKb = computed(() => props.maxSize || 0);
+  const acceptFileSizeMb = computed(() => ((acceptFileSizeKb.value || 0) / 1024).toFixed(2));
+  const isAcceptFileUseMb = computed(() => acceptFileSizeKb.value && acceptFileSizeKb.value > 1024);
+  const acceptFile = computed(
+    () => typeof props.accept === "string" ? props.accept : props.accept?.join(",")
+  );
+  return {
+    selectedFileSizeKb,
+    selectedFileSizeMb,
+    isSelectedFileUseMb,
+    acceptFileSizeKb,
+    acceptFileSizeMb,
+    isAcceptFileUseMb,
+    acceptFile
+  };
+};
 export const useFileSize = (size = 0) => {
   const isSelectedFileUseMb = computed(() => size / 1e3 > 1024);
   const selectedFileSizeKb = computed(() => (size / 1e3).toFixed(2));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@finema/core",
-  "version": "1.4.132",
+  "version": "1.4.133",
   "repository": "https://gitlab.finema.co/finema/ui-kit",
   "license": "MIT",
   "author": "Finema Dev Core Team",