Merge pull request #43 from klm-lab/dev

feat: Add getErroneousInput

src/inputs/form.ts

@@ -66,6 +66,7 @@ export const createForm = (initialState: Unknown, config: InputConfig) => {
       each,
       onSubmit,
       showError: () => touchInput(st),
+      getErroneousInput: () => st.get(`i.${st.get("e")}`),
       get: (name: string) => {
         const r: Input[] = [];
         st.ev[name].o.forEach((k) => {

src/inputs/handlers/changes.ts

@@ -116,6 +116,8 @@ export const syncChanges = (store: InputStore, data: ObjectInputs<string>) => {
     // isTouched
     ref.t = true;
     // new valid state
-    ref.iv = validateState(data);
+    const valid = validateState(data);
+    ref.iv = valid.v;
+    ref.e = valid.e;
   });
 };

src/inputs/handlers/files.ts

@@ -80,7 +80,9 @@ export const parseFile = (
         input.valid = !em;
         input.errorMessage = em;
         // Validate form
-        ref.iv = validateState(ref.i);
+        const valid = validateState(ref.i);
+        ref.iv = valid.v;
+        ref.e = valid.e;
       });
     }
   } as ParsedFile;

src/inputs/validations/index.ts

@@ -54,14 +54,18 @@ const validate = (
 
 // Validate the state
 const validateState = (data: ObjectInputs<string>) => {
-  let valid = true;
+  // valid status
+  let v = true;
+  // erroneous key
+  let e = "";
   for (const formKey in data) {
-    if (!valid) {
+    v = data[formKey].valid;
+    if (!v) {
+      e = data[formKey].touched ? formKey : "";
       break;
     }
-    valid = data[formKey].valid;
   }
-  return valid;
+  return { v, e };
 };
 
 export { validate, validateState };

src/types/index.ts

@@ -167,6 +167,8 @@ interface Form {
 
   showError(): void;
 
+  getErroneousInput(): Input | undefined;
+
   get(name: string): Input[];
 
   getValues(): Unknown;
@@ -187,6 +189,8 @@ type IPS = {
   inv: boolean;
   // asyncDelay: number;
   c: InputConfig;
+  // Erroneous key
+  e: string;
 };
 type InputStore = StoreType<IPS> & {
   fc: GetFile;

src/util/index.ts

@@ -210,7 +210,7 @@ const touchInput = (store: InputStore) => {
   const data = store.get("i");
   for (const key in data) {
     if (!data[key].valid) {
-      store.set((ref) =>
+      store.set((ref) => {
         setTouchedEm(
           ref.i,
           key,
@@ -221,8 +221,9 @@ const touchInput = (store: InputStore) => {
             //  (data[key] as Input & GetValue).g(data[key].value, true)
             (data[key] as Input & GetValue).g("", true)
           )
-        )
-      );
+        );
+        ref.e = key;
+      });
       break;
     }
   }