@fctc/widget-logic 3.10.5 → 3.10.6

package/dist/index.js

@@ -6194,12 +6194,33 @@ var colorFieldController = (props) => {
 // src/widget/basic/binary-field/controller.ts
 var import_react22 = require("react");
 var import_utils16 = require("@fctc/interface-logic/utils");
+var ALLOWED_TYPES = [
+  "image/jpeg",
+  "image/png",
+  "application/pdf",
+  "video/mp4",
+  "application/zip",
+  "application/x-zip-compressed",
+  "application/vnd.ms-excel",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+  "application/json"
+];
+var MAX_FILE_SIZE = 10 * 1024 * 1024;
+var MAX_TOTAL_SIZE = 50 * 1024 * 1024;
 var binaryFieldController = (props) => {
-  const { name, methods, readonly = false, value } = props;
+  const {
+    name,
+    methods,
+    readonly = false,
+    value,
+    filename,
+    rootField,
+    index
+  } = props;
   const inputId = (0, import_react22.useId)();
-  const [selectedImage, setSelectedImage] = (0, import_react22.useState)(null);
-  const [initialImage, setInitialImage] = (0, import_react22.useState)(value || null);
-  const [isInsideTable, setIsInsideTable] = (0, import_react22.useState)(false);
+  const [selectedFile, setSelectedFile] = (0, import_react22.useState)(null);
+  const [selectedPreview, setSelectedPreview] = (0, import_react22.useState)(null);
+  const [initialFile, setInitialFile] = (0, import_react22.useState)(value || null);
   const { setValue } = methods;
   const binaryRef = (0, import_react22.useRef)(null);
   const convertUrlToBase64 = async (url) => {
@@ -6208,9 +6229,7 @@ var binaryFieldController = (props) => {
       const blob = await response.blob();
       return new Promise((resolve, reject) => {
         const reader = new FileReader();
-        reader.onloadend = () => {
-          resolve(reader.result);
-        };
+        reader.onloadend = () => resolve(reader.result);
         reader.onerror = reject;
         reader.readAsDataURL(blob);
       });
@@ -6219,40 +6238,13 @@ var binaryFieldController = (props) => {
       throw error;
     }
   };
-  const extractBase64Data = (base64Url) => {
-    if (base64Url.includes("base64,")) {
-      return base64Url.split("base64,")[1];
-    }
-    return base64Url;
-  };
-  const handleImageChange = async (e, onChange) => {
-    if (readonly) return;
-    const file = e?.target?.files?.[0];
-    if (file) {
-      const imageUrl = URL.createObjectURL(file);
-      setSelectedImage(imageUrl);
-      setInitialImage(null);
-      onChange(file);
-      const compressedBase64 = await convertUrlToBase64(imageUrl);
-      const base64Data = extractBase64Data(compressedBase64);
-      setValue(name, base64Data, {
-        shouldDirty: true
-      });
-    }
-  };
-  const handleRemoveImage = (onChange) => {
-    setSelectedImage(null);
-    setInitialImage(null);
-    onChange(null);
-  };
-  const isBlobUrl = (url) => {
-    return /^blob:/.test(url);
-  };
+  const extractBase64Data = (base64Url) => base64Url.includes("base64,") ? base64Url.split("base64,")[1] : base64Url;
+  const isBlobUrl = (url) => /^blob:/.test(url);
   const checkIsImageLink = (url) => {
     const imageExtensions = /\.(jpg|jpeg|png|gif|bmp|webp|svg|tiff|ico)$/i;
     return imageExtensions.test(url) || (0, import_utils16.isBase64Image)(url) || isBlobUrl(url);
   };
-  const getImageBase64WithMimeType = (base64) => {
+  const getBase64WithMimeType = (base64) => {
     if (typeof base64 !== "string" || base64.length < 10) return null;
     if ((0, import_utils16.isBase64Image)(base64)) return base64;
     let mimeType = null;
@@ -6263,29 +6255,62 @@ var binaryFieldController = (props) => {
     else if (base64.startsWith("UklGR")) mimeType = "image/webp";
     return mimeType ? `data:${mimeType};base64,${base64}` : null;
   };
+  const handleFileChange = async (e, onChange) => {
+    if (readonly) return;
+    const file = e?.target?.files?.[0];
+    if (!file) return;
+    if (!ALLOWED_TYPES.includes(file.type)) {
+      alert(`File type not allowed: ${file.type}`);
+      return;
+    }
+    if (file.size > MAX_FILE_SIZE) {
+      alert(`File exceeds 10MB limit.`);
+      return;
+    }
+    const fileUrl = URL.createObjectURL(file);
+    setSelectedFile(file);
+    setInitialFile(null);
+    setSelectedPreview(fileUrl);
+    onChange(file);
+    if (file.type.startsWith("image/") || file.type === "application/json") {
+      const base64 = await convertUrlToBase64(fileUrl);
+      const base64Data = extractBase64Data(base64);
+      setValue(name, base64Data, { shouldDirty: true });
+    } else {
+      setValue(name, file, { shouldDirty: true });
+    }
+    if (filename) {
+      setValue(
+        rootField ? `${rootField?.name}.${index}.${filename}` : filename,
+        file?.name,
+        { shouldDirty: true }
+      );
+    }
+  };
+  const handleRemoveFile = (onChange) => {
+    if (selectedPreview) URL.revokeObjectURL(selectedPreview);
+    setSelectedFile(null);
+    setSelectedPreview(null);
+    setInitialFile(null);
+    onChange(null);
+  };
   (0, import_react22.useEffect)(() => {
     return () => {
-      if (selectedImage) {
-        URL.revokeObjectURL(selectedImage);
+      if (selectedPreview) {
+        URL.revokeObjectURL(selectedPreview);
       }
     };
-  }, [selectedImage]);
-  (0, import_react22.useEffect)(() => {
-    if (binaryRef.current) {
-      const isInsideTable2 = !!binaryRef.current.closest("table");
-      setIsInsideTable(isInsideTable2);
-    }
-  }, []);
+  }, [selectedPreview]);
   return {
     inputId,
-    selectedImage,
-    initialImage,
-    isInsideTable,
+    selectedFile,
+    selectedPreview,
+    initialFile,
     binaryRef,
-    handleImageChange,
-    handleRemoveImage,
+    handleFileChange,
+    handleRemoveFile,
     checkIsImageLink,
-    getImageBase64WithMimeType
+    getBase64WithMimeType
   };
 };
 

package/dist/index.mjs

@@ -6274,12 +6274,33 @@ var colorFieldController = (props) => {
 // src/widget/basic/binary-field/controller.ts
 import { useEffect as useEffect13, useId as useId2, useRef as useRef4, useState as useState12 } from "react";
 import { isBase64Image } from "@fctc/interface-logic/utils";
+var ALLOWED_TYPES = [
+  "image/jpeg",
+  "image/png",
+  "application/pdf",
+  "video/mp4",
+  "application/zip",
+  "application/x-zip-compressed",
+  "application/vnd.ms-excel",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+  "application/json"
+];
+var MAX_FILE_SIZE = 10 * 1024 * 1024;
+var MAX_TOTAL_SIZE = 50 * 1024 * 1024;
 var binaryFieldController = (props) => {
-  const { name, methods, readonly = false, value } = props;
+  const {
+    name,
+    methods,
+    readonly = false,
+    value,
+    filename,
+    rootField,
+    index
+  } = props;
   const inputId = useId2();
-  const [selectedImage, setSelectedImage] = useState12(null);
-  const [initialImage, setInitialImage] = useState12(value || null);
-  const [isInsideTable, setIsInsideTable] = useState12(false);
+  const [selectedFile, setSelectedFile] = useState12(null);
+  const [selectedPreview, setSelectedPreview] = useState12(null);
+  const [initialFile, setInitialFile] = useState12(value || null);
   const { setValue } = methods;
   const binaryRef = useRef4(null);
   const convertUrlToBase64 = async (url) => {
@@ -6288,9 +6309,7 @@ var binaryFieldController = (props) => {
       const blob = await response.blob();
       return new Promise((resolve, reject) => {
         const reader = new FileReader();
-        reader.onloadend = () => {
-          resolve(reader.result);
-        };
+        reader.onloadend = () => resolve(reader.result);
         reader.onerror = reject;
         reader.readAsDataURL(blob);
       });
@@ -6299,40 +6318,13 @@ var binaryFieldController = (props) => {
       throw error;
     }
   };
-  const extractBase64Data = (base64Url) => {
-    if (base64Url.includes("base64,")) {
-      return base64Url.split("base64,")[1];
-    }
-    return base64Url;
-  };
-  const handleImageChange = async (e, onChange) => {
-    if (readonly) return;
-    const file = e?.target?.files?.[0];
-    if (file) {
-      const imageUrl = URL.createObjectURL(file);
-      setSelectedImage(imageUrl);
-      setInitialImage(null);
-      onChange(file);
-      const compressedBase64 = await convertUrlToBase64(imageUrl);
-      const base64Data = extractBase64Data(compressedBase64);
-      setValue(name, base64Data, {
-        shouldDirty: true
-      });
-    }
-  };
-  const handleRemoveImage = (onChange) => {
-    setSelectedImage(null);
-    setInitialImage(null);
-    onChange(null);
-  };
-  const isBlobUrl = (url) => {
-    return /^blob:/.test(url);
-  };
+  const extractBase64Data = (base64Url) => base64Url.includes("base64,") ? base64Url.split("base64,")[1] : base64Url;
+  const isBlobUrl = (url) => /^blob:/.test(url);
   const checkIsImageLink = (url) => {
     const imageExtensions = /\.(jpg|jpeg|png|gif|bmp|webp|svg|tiff|ico)$/i;
     return imageExtensions.test(url) || isBase64Image(url) || isBlobUrl(url);
   };
-  const getImageBase64WithMimeType = (base64) => {
+  const getBase64WithMimeType = (base64) => {
     if (typeof base64 !== "string" || base64.length < 10) return null;
     if (isBase64Image(base64)) return base64;
     let mimeType = null;
@@ -6343,29 +6335,62 @@ var binaryFieldController = (props) => {
     else if (base64.startsWith("UklGR")) mimeType = "image/webp";
     return mimeType ? `data:${mimeType};base64,${base64}` : null;
   };
+  const handleFileChange = async (e, onChange) => {
+    if (readonly) return;
+    const file = e?.target?.files?.[0];
+    if (!file) return;
+    if (!ALLOWED_TYPES.includes(file.type)) {
+      alert(`File type not allowed: ${file.type}`);
+      return;
+    }
+    if (file.size > MAX_FILE_SIZE) {
+      alert(`File exceeds 10MB limit.`);
+      return;
+    }
+    const fileUrl = URL.createObjectURL(file);
+    setSelectedFile(file);
+    setInitialFile(null);
+    setSelectedPreview(fileUrl);
+    onChange(file);
+    if (file.type.startsWith("image/") || file.type === "application/json") {
+      const base64 = await convertUrlToBase64(fileUrl);
+      const base64Data = extractBase64Data(base64);
+      setValue(name, base64Data, { shouldDirty: true });
+    } else {
+      setValue(name, file, { shouldDirty: true });
+    }
+    if (filename) {
+      setValue(
+        rootField ? `${rootField?.name}.${index}.${filename}` : filename,
+        file?.name,
+        { shouldDirty: true }
+      );
+    }
+  };
+  const handleRemoveFile = (onChange) => {
+    if (selectedPreview) URL.revokeObjectURL(selectedPreview);
+    setSelectedFile(null);
+    setSelectedPreview(null);
+    setInitialFile(null);
+    onChange(null);
+  };
   useEffect13(() => {
     return () => {
-      if (selectedImage) {
-        URL.revokeObjectURL(selectedImage);
+      if (selectedPreview) {
+        URL.revokeObjectURL(selectedPreview);
       }
     };
-  }, [selectedImage]);
-  useEffect13(() => {
-    if (binaryRef.current) {
-      const isInsideTable2 = !!binaryRef.current.closest("table");
-      setIsInsideTable(isInsideTable2);
-    }
-  }, []);
+  }, [selectedPreview]);
   return {
     inputId,
-    selectedImage,
-    initialImage,
-    isInsideTable,
+    selectedFile,
+    selectedPreview,
+    initialFile,
     binaryRef,
-    handleImageChange,
-    handleRemoveImage,
+    handleFileChange,
+    handleRemoveFile,
     checkIsImageLink,
-    getImageBase64WithMimeType
+    getBase64WithMimeType
   };
 };
 

package/dist/types.d.mts

@@ -30,6 +30,7 @@ interface IInputFieldProps {
     widget?: string;
     aid?: string | number;
     context?: string | Object;
+    filename?: string;
 }
 
 export type { IInputFieldProps, ValuePropsType };

package/dist/types.d.ts

@@ -30,6 +30,7 @@ interface IInputFieldProps {
     widget?: string;
     aid?: string | number;
     context?: string | Object;
+    filename?: string;
 }
 
 export type { IInputFieldProps, ValuePropsType };

package/dist/widget.d.mts

@@ -208,16 +208,19 @@ declare const colorFieldController: (props: IColorFieldProps) => {
     savePickColor: (colorObject: any) => Promise<void>;
 };
 
-declare const binaryFieldController: (props: IInputFieldProps) => {
+declare const binaryFieldController: (props: IInputFieldProps & {
+    rootField?: any;
+    index?: number;
+}) => {
     inputId: string;
-    selectedImage: string | null;
-    initialImage: any;
-    isInsideTable: boolean;
+    selectedFile: File | null;
+    selectedPreview: string | null;
+    initialFile: any;
     binaryRef: react.RefObject<HTMLDivElement>;
-    handleImageChange: (e: ChangeEvent<HTMLInputElement>, onChange: (file: File | null) => void) => Promise<void>;
-    handleRemoveImage: (onChange: (file: File | null) => void) => void;
+    handleFileChange: (e: ChangeEvent<HTMLInputElement>, onChange: (file: File | null) => void) => Promise<void>;
+    handleRemoveFile: (onChange: (file: File | null) => void) => void;
     checkIsImageLink: (url: string) => boolean;
-    getImageBase64WithMimeType: (base64: any) => string | null;
+    getBase64WithMimeType: (base64: string) => string | null;
 };
 
 declare const tableHeadController: (props: any) => {

package/dist/widget.d.ts

@@ -208,16 +208,19 @@ declare const colorFieldController: (props: IColorFieldProps) => {
     savePickColor: (colorObject: any) => Promise<void>;
 };
 
-declare const binaryFieldController: (props: IInputFieldProps) => {
+declare const binaryFieldController: (props: IInputFieldProps & {
+    rootField?: any;
+    index?: number;
+}) => {
     inputId: string;
-    selectedImage: string | null;
-    initialImage: any;
-    isInsideTable: boolean;
+    selectedFile: File | null;
+    selectedPreview: string | null;
+    initialFile: any;
     binaryRef: react.RefObject<HTMLDivElement>;
-    handleImageChange: (e: ChangeEvent<HTMLInputElement>, onChange: (file: File | null) => void) => Promise<void>;
-    handleRemoveImage: (onChange: (file: File | null) => void) => void;
+    handleFileChange: (e: ChangeEvent<HTMLInputElement>, onChange: (file: File | null) => void) => Promise<void>;
+    handleRemoveFile: (onChange: (file: File | null) => void) => void;
     checkIsImageLink: (url: string) => boolean;
-    getImageBase64WithMimeType: (base64: any) => string | null;
+    getBase64WithMimeType: (base64: string) => string | null;
 };
 
 declare const tableHeadController: (props: any) => {

package/dist/widget.js

@@ -5431,12 +5431,33 @@ var colorFieldController = (props) => {
 // src/widget/basic/binary-field/controller.ts
 var import_react22 = require("react");
 var import_utils16 = require("@fctc/interface-logic/utils");
+var ALLOWED_TYPES = [
+  "image/jpeg",
+  "image/png",
+  "application/pdf",
+  "video/mp4",
+  "application/zip",
+  "application/x-zip-compressed",
+  "application/vnd.ms-excel",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+  "application/json"
+];
+var MAX_FILE_SIZE = 10 * 1024 * 1024;
+var MAX_TOTAL_SIZE = 50 * 1024 * 1024;
 var binaryFieldController = (props) => {
-  const { name, methods, readonly = false, value } = props;
+  const {
+    name,
+    methods,
+    readonly = false,
+    value,
+    filename,
+    rootField,
+    index
+  } = props;
   const inputId = (0, import_react22.useId)();
-  const [selectedImage, setSelectedImage] = (0, import_react22.useState)(null);
-  const [initialImage, setInitialImage] = (0, import_react22.useState)(value || null);
-  const [isInsideTable, setIsInsideTable] = (0, import_react22.useState)(false);
+  const [selectedFile, setSelectedFile] = (0, import_react22.useState)(null);
+  const [selectedPreview, setSelectedPreview] = (0, import_react22.useState)(null);
+  const [initialFile, setInitialFile] = (0, import_react22.useState)(value || null);
   const { setValue } = methods;
   const binaryRef = (0, import_react22.useRef)(null);
   const convertUrlToBase64 = async (url) => {
@@ -5445,9 +5466,7 @@ var binaryFieldController = (props) => {
       const blob = await response.blob();
       return new Promise((resolve, reject) => {
         const reader = new FileReader();
-        reader.onloadend = () => {
-          resolve(reader.result);
-        };
+        reader.onloadend = () => resolve(reader.result);
         reader.onerror = reject;
         reader.readAsDataURL(blob);
       });
@@ -5456,40 +5475,13 @@ var binaryFieldController = (props) => {
       throw error;
     }
   };
-  const extractBase64Data = (base64Url) => {
-    if (base64Url.includes("base64,")) {
-      return base64Url.split("base64,")[1];
-    }
-    return base64Url;
-  };
-  const handleImageChange = async (e, onChange) => {
-    if (readonly) return;
-    const file = e?.target?.files?.[0];
-    if (file) {
-      const imageUrl = URL.createObjectURL(file);
-      setSelectedImage(imageUrl);
-      setInitialImage(null);
-      onChange(file);
-      const compressedBase64 = await convertUrlToBase64(imageUrl);
-      const base64Data = extractBase64Data(compressedBase64);
-      setValue(name, base64Data, {
-        shouldDirty: true
-      });
-    }
-  };
-  const handleRemoveImage = (onChange) => {
-    setSelectedImage(null);
-    setInitialImage(null);
-    onChange(null);
-  };
-  const isBlobUrl = (url) => {
-    return /^blob:/.test(url);
-  };
+  const extractBase64Data = (base64Url) => base64Url.includes("base64,") ? base64Url.split("base64,")[1] : base64Url;
+  const isBlobUrl = (url) => /^blob:/.test(url);
   const checkIsImageLink = (url) => {
     const imageExtensions = /\.(jpg|jpeg|png|gif|bmp|webp|svg|tiff|ico)$/i;
     return imageExtensions.test(url) || (0, import_utils16.isBase64Image)(url) || isBlobUrl(url);
   };
-  const getImageBase64WithMimeType = (base64) => {
+  const getBase64WithMimeType = (base64) => {
     if (typeof base64 !== "string" || base64.length < 10) return null;
     if ((0, import_utils16.isBase64Image)(base64)) return base64;
     let mimeType = null;
@@ -5500,29 +5492,62 @@ var binaryFieldController = (props) => {
     else if (base64.startsWith("UklGR")) mimeType = "image/webp";
     return mimeType ? `data:${mimeType};base64,${base64}` : null;
   };
+  const handleFileChange = async (e, onChange) => {
+    if (readonly) return;
+    const file = e?.target?.files?.[0];
+    if (!file) return;
+    if (!ALLOWED_TYPES.includes(file.type)) {
+      alert(`File type not allowed: ${file.type}`);
+      return;
+    }
+    if (file.size > MAX_FILE_SIZE) {
+      alert(`File exceeds 10MB limit.`);
+      return;
+    }
+    const fileUrl = URL.createObjectURL(file);
+    setSelectedFile(file);
+    setInitialFile(null);
+    setSelectedPreview(fileUrl);
+    onChange(file);
+    if (file.type.startsWith("image/") || file.type === "application/json") {
+      const base64 = await convertUrlToBase64(fileUrl);
+      const base64Data = extractBase64Data(base64);
+      setValue(name, base64Data, { shouldDirty: true });
+    } else {
+      setValue(name, file, { shouldDirty: true });
+    }
+    if (filename) {
+      setValue(
+        rootField ? `${rootField?.name}.${index}.${filename}` : filename,
+        file?.name,
+        { shouldDirty: true }
+      );
+    }
+  };
+  const handleRemoveFile = (onChange) => {
+    if (selectedPreview) URL.revokeObjectURL(selectedPreview);
+    setSelectedFile(null);
+    setSelectedPreview(null);
+    setInitialFile(null);
+    onChange(null);
+  };
   (0, import_react22.useEffect)(() => {
     return () => {
-      if (selectedImage) {
-        URL.revokeObjectURL(selectedImage);
+      if (selectedPreview) {
+        URL.revokeObjectURL(selectedPreview);
       }
     };
-  }, [selectedImage]);
-  (0, import_react22.useEffect)(() => {
-    if (binaryRef.current) {
-      const isInsideTable2 = !!binaryRef.current.closest("table");
-      setIsInsideTable(isInsideTable2);
-    }
-  }, []);
+  }, [selectedPreview]);
   return {
     inputId,
-    selectedImage,
-    initialImage,
-    isInsideTable,
+    selectedFile,
+    selectedPreview,
+    initialFile,
     binaryRef,
-    handleImageChange,
-    handleRemoveImage,
+    handleFileChange,
+    handleRemoveFile,
     checkIsImageLink,
-    getImageBase64WithMimeType
+    getBase64WithMimeType
   };
 };
 

package/dist/widget.mjs

@@ -5488,12 +5488,33 @@ var colorFieldController = (props) => {
 // src/widget/basic/binary-field/controller.ts
 import { useEffect as useEffect13, useId as useId2, useRef as useRef4, useState as useState12 } from "react";
 import { isBase64Image } from "@fctc/interface-logic/utils";
+var ALLOWED_TYPES = [
+  "image/jpeg",
+  "image/png",
+  "application/pdf",
+  "video/mp4",
+  "application/zip",
+  "application/x-zip-compressed",
+  "application/vnd.ms-excel",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+  "application/json"
+];
+var MAX_FILE_SIZE = 10 * 1024 * 1024;
+var MAX_TOTAL_SIZE = 50 * 1024 * 1024;
 var binaryFieldController = (props) => {
-  const { name, methods, readonly = false, value } = props;
+  const {
+    name,
+    methods,
+    readonly = false,
+    value,
+    filename,
+    rootField,
+    index
+  } = props;
   const inputId = useId2();
-  const [selectedImage, setSelectedImage] = useState12(null);
-  const [initialImage, setInitialImage] = useState12(value || null);
-  const [isInsideTable, setIsInsideTable] = useState12(false);
+  const [selectedFile, setSelectedFile] = useState12(null);
+  const [selectedPreview, setSelectedPreview] = useState12(null);
+  const [initialFile, setInitialFile] = useState12(value || null);
   const { setValue } = methods;
   const binaryRef = useRef4(null);
   const convertUrlToBase64 = async (url) => {
@@ -5502,9 +5523,7 @@ var binaryFieldController = (props) => {
       const blob = await response.blob();
       return new Promise((resolve, reject) => {
         const reader = new FileReader();
-        reader.onloadend = () => {
-          resolve(reader.result);
-        };
+        reader.onloadend = () => resolve(reader.result);
         reader.onerror = reject;
         reader.readAsDataURL(blob);
       });
@@ -5513,40 +5532,13 @@ var binaryFieldController = (props) => {
       throw error;
     }
   };
-  const extractBase64Data = (base64Url) => {
-    if (base64Url.includes("base64,")) {
-      return base64Url.split("base64,")[1];
-    }
-    return base64Url;
-  };
-  const handleImageChange = async (e, onChange) => {
-    if (readonly) return;
-    const file = e?.target?.files?.[0];
-    if (file) {
-      const imageUrl = URL.createObjectURL(file);
-      setSelectedImage(imageUrl);
-      setInitialImage(null);
-      onChange(file);
-      const compressedBase64 = await convertUrlToBase64(imageUrl);
-      const base64Data = extractBase64Data(compressedBase64);
-      setValue(name, base64Data, {
-        shouldDirty: true
-      });
-    }
-  };
-  const handleRemoveImage = (onChange) => {
-    setSelectedImage(null);
-    setInitialImage(null);
-    onChange(null);
-  };
-  const isBlobUrl = (url) => {
-    return /^blob:/.test(url);
-  };
+  const extractBase64Data = (base64Url) => base64Url.includes("base64,") ? base64Url.split("base64,")[1] : base64Url;
+  const isBlobUrl = (url) => /^blob:/.test(url);
   const checkIsImageLink = (url) => {
     const imageExtensions = /\.(jpg|jpeg|png|gif|bmp|webp|svg|tiff|ico)$/i;
     return imageExtensions.test(url) || isBase64Image(url) || isBlobUrl(url);
   };
-  const getImageBase64WithMimeType = (base64) => {
+  const getBase64WithMimeType = (base64) => {
     if (typeof base64 !== "string" || base64.length < 10) return null;
     if (isBase64Image(base64)) return base64;
     let mimeType = null;
@@ -5557,29 +5549,62 @@ var binaryFieldController = (props) => {
     else if (base64.startsWith("UklGR")) mimeType = "image/webp";
     return mimeType ? `data:${mimeType};base64,${base64}` : null;
   };
+  const handleFileChange = async (e, onChange) => {
+    if (readonly) return;
+    const file = e?.target?.files?.[0];
+    if (!file) return;
+    if (!ALLOWED_TYPES.includes(file.type)) {
+      alert(`File type not allowed: ${file.type}`);
+      return;
+    }
+    if (file.size > MAX_FILE_SIZE) {
+      alert(`File exceeds 10MB limit.`);
+      return;
+    }
+    const fileUrl = URL.createObjectURL(file);
+    setSelectedFile(file);
+    setInitialFile(null);
+    setSelectedPreview(fileUrl);
+    onChange(file);
+    if (file.type.startsWith("image/") || file.type === "application/json") {
+      const base64 = await convertUrlToBase64(fileUrl);
+      const base64Data = extractBase64Data(base64);
+      setValue(name, base64Data, { shouldDirty: true });
+    } else {
+      setValue(name, file, { shouldDirty: true });
+    }
+    if (filename) {
+      setValue(
+        rootField ? `${rootField?.name}.${index}.${filename}` : filename,
+        file?.name,
+        { shouldDirty: true }
+      );
+    }
+  };
+  const handleRemoveFile = (onChange) => {
+    if (selectedPreview) URL.revokeObjectURL(selectedPreview);
+    setSelectedFile(null);
+    setSelectedPreview(null);
+    setInitialFile(null);
+    onChange(null);
+  };
   useEffect13(() => {
     return () => {
-      if (selectedImage) {
-        URL.revokeObjectURL(selectedImage);
+      if (selectedPreview) {
+        URL.revokeObjectURL(selectedPreview);
       }
     };
-  }, [selectedImage]);
-  useEffect13(() => {
-    if (binaryRef.current) {
-      const isInsideTable2 = !!binaryRef.current.closest("table");
-      setIsInsideTable(isInsideTable2);
-    }
-  }, []);
+  }, [selectedPreview]);
   return {
     inputId,
-    selectedImage,
-    initialImage,
-    isInsideTable,
+    selectedFile,
+    selectedPreview,
+    initialFile,
     binaryRef,
-    handleImageChange,
-    handleRemoveImage,
+    handleFileChange,
+    handleRemoveFile,
     checkIsImageLink,
-    getImageBase64WithMimeType
+    getBase64WithMimeType
   };
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fctc/widget-logic",
-  "version": "3.10.5",
+  "version": "3.10.6",
   "types": "dist/index.d.ts",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",