fix

comps/form/field/Field.tsx

@@ -108,12 +108,12 @@ export const Field: FC<FieldProp> = (arg) => {
     typeof field.hidden === "function"
       ? field.hidden()
       : typeof field.hidden === "string"
-        ? field.hidden === "n"
+      ? field.hidden === "n"
-          ? false
+        ? false
-          : true
+        : true
-        : typeof field.hidden === "boolean"
+      : typeof field.hidden === "boolean"
-          ? field.hidden
+      ? field.hidden
-          : true;
+      : true;
   if (!show) return <></>;
 
   return (

comps/form/field/FieldInput.tsx

@@ -35,6 +35,7 @@ export const FieldInput: FC<{
   const errors = fm.error.get(name);
   let type_field: any = typeof arg.type === "function" ? arg.type() : arg.type; // tipe field
 
+
   const disabled =
     typeof field.disabled === "function" ? field.disabled() : field.disabled;
   let custom = <></>;

comps/form/field/type/TypeInput.tsx

@@ -38,8 +38,8 @@ export type PropTypeInput = {
   placeholder?: string;
   onFocus?: (e: FocusEvent<HTMLDivElement>) => void;
   onBlur?: (e: FocusEvent<HTMLDivElement>) => void;
-  onChange?: (val: any) => void;
   model_upload?: "upload" | "import";
+  onChange?: (value: any) => void;
 };
 
 const parse = parser.exportAsFunctionAny("en-US");
@@ -102,10 +102,9 @@ export const FieldTypeInput: FC<{
 
   const renderOnChange = () => {
     input.render();
-    // if (field.on_change) {
+    if (prop.onChange) {
-    //   field.on_change({ value: fm.data[field.name], name: field.name, fm });
+      prop.onChange(fm.data[field.name]);
-    // }
+    }
-
     clearTimeout(input.change_timeout);
     input.change_timeout = setTimeout(fm.render, 300);
   };
@@ -178,25 +177,9 @@ export const FieldTypeInput: FC<{
         />
       );
     case "upload":
-      return (
+      return <FieldUpload arg={arg} field={field} fm={fm} prop={prop} />;
-        <FieldUpload
-          arg={arg}
-          field={field}
-          fm={fm}
-          prop={prop}
-          on_change={arg.on_change}
-        />
-      );
     case "import":
-      return (
+      return <FieldUpload arg={arg} field={field} fm={fm} prop={prop} />;
-        <FieldUpload
-          arg={arg}
-          field={field}
-          fm={fm}
-          prop={prop}
-          on_change={arg.on_change}
-        />
-      );
     case "money":
       return (
         <>
@@ -223,10 +206,6 @@ export const FieldTypeInput: FC<{
               ? new Date(value?.startDate)
               : null;
             renderOnChange();
-
-            if (prop.onChange) {
-              prop.onChange(fm.data[field.name]);
-            }
           }}
         />
       );
@@ -255,10 +234,6 @@ export const FieldTypeInput: FC<{
             onChange={(ev) => {
               fm.data[field.name] = ev.currentTarget.value.replace(/\D/g, "");
               renderOnChange();
-
-              if (prop.onChange) {
-                prop.onChange(fm.data[field.name]);
-              }
             }}
             inputMode="decimal"
             value={format(value, {
@@ -369,9 +344,6 @@ export const FieldTypeInput: FC<{
             onChange={async (ev) => {
               fm.data[field.name] = ev.currentTarget.value;
               renderOnChange();
-              if (prop.onChange) {
-                await prop.onChange(fm.data[field.name]);
-              }
 
               clearTimeout(internal.search_timeout);
               internal.search_timeout = setTimeout(() => {
@@ -403,10 +375,6 @@ export const FieldTypeInput: FC<{
             fm.data[field.name] = parseInt(fm.data[field.name]);
           }
           renderOnChange();
-
-          if (prop.onChange) {
-            prop.onChange(fm.data[field.name]);
-          }
         }}
         placeholder={prop.placeholder || arg.placeholder || ""}
         value={value}

comps/form/field/type/TypeMoney.tsx

@@ -2,7 +2,6 @@ import { useLocal } from "lib/utils/use-local";
 import { FC, useEffect } from "react";
 import { FMLocal, FieldLocal, FieldProp } from "../../typings";
 import { PropTypeInput } from "./TypeInput";
-import { isEmptyString } from "lib/utils/is-empty-string";
 export const FieldMoney: FC<{
   field: FieldLocal;
   fm: FMLocal;
@@ -42,8 +41,11 @@ export const FieldMoney: FC<{
               formatCurrency(rawValue)
             );
             fm.render();
-            if (field.on_change) {
+            input.value = formatCurrency(fm.data[field.name]);
-              field.on_change({
+            input.render();
+
+            if (arg.on_change) {
+              arg.on_change({
                 value: convertionCurrencyNumber(
                   formatCurrency(fm.data[field.name])
                 ),
@@ -51,8 +53,6 @@ export const FieldMoney: FC<{
                 fm,
               });
             }
-            input.value = formatCurrency(fm.data[field.name]);
-            input.render();
           } else {
             input.value = rawValue;
             input.render();

comps/form/field/type/TypeOTP.tsx

@@ -1,9 +1,9 @@
+import { REGEXP_ONLY_DIGITS } from "input-otp";
+import { InputOTP, InputOTPGroup, InputOTPSlot } from "lib/comps/ui/input-otp";
 import { useLocal } from "lib/utils/use-local";
-import { FC, useEffect } from "react";
+import { FC } from "react";
 import { FieldLocal, FieldProp, FMLocal } from "../../typings";
 import { PropTypeInput } from "./TypeInput";
-import { InputOTP, InputOTPGroup, InputOTPSlot } from "lib/comps/ui/input-otp";
-import { REGEXP_ONLY_DIGITS } from "input-otp";
 
 export const FieldOTP: FC<{
   digit: number;
@@ -11,7 +11,7 @@ export const FieldOTP: FC<{
   fm: FMLocal;
   prop: PropTypeInput;
   arg: FieldProp;
-}> = ({ digit, fm, field }) => {
+}> = ({ digit, fm, field, arg }) => {
   const local = useLocal({
     otp: "",
     ref: [] as HTMLInputElement[],
@@ -37,8 +37,8 @@ export const FieldOTP: FC<{
         onChange={(value) => {
           local.otp = value;
           local.render();
-          if (field.on_change) {
+          if (arg.on_change) {
-            field.on_change({ value, name: field.name, fm });
+            arg.on_change({ value: local.otp, fm, name: field.name });
           }
         }}
         pattern={REGEXP_ONLY_DIGITS}

comps/form/field/type/TypeUpload.tsx

@@ -10,12 +10,11 @@ export const FieldUpload: FC<{
   prop: PropTypeInput;
   styling?: string;
   arg: FieldProp;
-  on_change: (e: any) => void | Promise<void>;
 }> = (pass) => {
-  const { field, fm, prop, on_change, arg } = pass;
+  const { field, fm, prop, arg } = pass;
   let mode = field.prop.upload?.mode || "single-file";
   if (mode === "single-file") {
     return <FieldUploadSingle {...pass} />;
   }
-  return  <FieldUploadMulti {...pass} />;
+  return <FieldUploadMulti {...pass} />;
 };

comps/form/field/type/TypeUploadMulti.tsx

@@ -15,8 +15,7 @@ export const FieldUploadMulti: FC<{
   prop: PropTypeInput;
   styling?: string;
   arg: FieldProp;
-  on_change: (e: any) => void | Promise<void>;
+}> = ({ field, fm, prop, arg }) => {
-}> = ({ field, fm, prop, on_change, arg }) => {
   let value: string = (fm.data[field.name] || "").trim();
 
   const input = useLocal({

comps/form/field/type/TypeUploadSingle.tsx

@@ -16,7 +16,11 @@ export const FieldUploadSingle: FC<{
   prop: PropTypeInput;
   styling?: string;
   arg: FieldProp;
-  on_change: (e: any) => void | Promise<void>;
+  on_change?: (arg: {
+    value: any;
+    name: string;
+    fm: any;
+  }) => void | Promise<void>;
 }> = ({ field, fm, prop, on_change, arg }) => {
   const styling = arg.upload_style ? arg.upload_style : "full";
   const disabled =
@@ -57,9 +61,9 @@ export const FieldUploadSingle: FC<{
           const jsonData = XLSX.utils.sheet_to_json(worksheet);
           if (typeof on_change === "function") {
             on_change({
-              value: jsonData,
+              value: { jsonData, file: file, binary: e.target.result },
-              file: file,
+              fm,
-              binnary: e.target.result,
+              name: field.name,
             });
           }
         }