@juantroconisf/lib 2.3.1 → 2.3.3

package/dist/index.d.mts

@@ -24,7 +24,7 @@ type ValidatorParams = {
     [K in keyof ValidatorTypes]?: ValidatorTypes[K] extends Validator<any, infer U> ? U : never;
 };
 type ValidatorErrorMessage = {
-    [K in keyof ValidatorTypes]: string;
+    [K in keyof ValidatorTypes]?: string;
 };
 
 interface ValidationProps {
@@ -39,7 +39,7 @@ interface RegisterInputProps extends ValidationProps {
 }
 
 declare function useFormChange<InitialObj extends object>(initialObj: InitialObj): {
-    onChange: ({ target: { id, value }, }: ChangeEvent<HTMLInputElement>) => void;
+    onChange: ({ target: { id, value } }: ChangeEvent<HTMLInputElement>) => void;
     onBlur: ({ target: { id } }: FocusEvent<HTMLInputElement>) => void;
     state: InitialObj;
     setState: react.Dispatch<react.SetStateAction<InitialObj>>;

package/dist/index.d.ts

@@ -24,7 +24,7 @@ type ValidatorParams = {
     [K in keyof ValidatorTypes]?: ValidatorTypes[K] extends Validator<any, infer U> ? U : never;
 };
 type ValidatorErrorMessage = {
-    [K in keyof ValidatorTypes]: string;
+    [K in keyof ValidatorTypes]?: string;
 };
 
 interface ValidationProps {
@@ -39,7 +39,7 @@ interface RegisterInputProps extends ValidationProps {
 }
 
 declare function useFormChange<InitialObj extends object>(initialObj: InitialObj): {
-    onChange: ({ target: { id, value }, }: ChangeEvent<HTMLInputElement>) => void;
+    onChange: ({ target: { id, value } }: ChangeEvent<HTMLInputElement>) => void;
     onBlur: ({ target: { id } }: FocusEvent<HTMLInputElement>) => void;
     state: InitialObj;
     setState: react.Dispatch<react.SetStateAction<InitialObj>>;

package/dist/index.js

@@ -185,34 +185,61 @@ function useValidation() {
 
 // src/hooks/useFormChange.tsx
 function useFormChange(initialObj) {
-  const [state, setState] = (0, import_react.useState)(initialObj), [touched, setTouched] = (0, import_react.useState)(allToValue(initialObj, false)), { getValidation } = useValidation();
-  let errors2 = allToValue(initialObj, false);
-  const onChange = ({
-    target: { id, value }
-  }) => setState(handleNestedChange({ state, id, value })), onBlur = ({ target: { id } }) => setTouched(handleNestedChange({ state: touched, id, value: true })), resetForm = () => {
+  const [state, setState] = (0, import_react.useState)(initialObj), [touched, setTouched] = (0, import_react.useState)(allToValue(initialObj, false)), { getValidation } = useValidation(), [errors2, setErrors] = (0, import_react.useState)(allToValue(initialObj, false));
+  const onChange = (0, import_react.useCallback)(
+    ({ target: { id, value } }) => setState(
+      (prevState) => handleNestedChange({ state: prevState, id, value })
+    ),
+    []
+  ), onBlur = (0, import_react.useCallback)(
+    ({ target: { id } }) => setTouched(
+      (prevTouched) => handleNestedChange({ state: prevTouched, id, value: true })
+    ),
+    []
+  ), resetForm = (0, import_react.useCallback)(() => {
     setTouched(allToValue(initialObj, false));
     setState(initialObj);
-  };
-  function register(id, validations, errorMessages) {
-    const [value, isTouched] = [state[id], touched[id]], hasValidations = validations !== void 0, inputValidations = hasValidations ? getValidation(value, isTouched, validations, errorMessages) : {};
-    errors2 = handleNestedChange({
-      state: errors2,
-      id,
-      value: hasValidations ? !inputValidations.isValid : false
+    setErrors(allToValue(initialObj, false));
+  }, [initialObj]);
+  const register = (0, import_react.useCallback)(
+    (id, validations, errorMessages) => {
+      const [value, isTouched] = [state[id], touched[id]], hasValidations = validations !== void 0;
+      const inputValidations = (0, import_react.useMemo)(
+        () => hasValidations ? getValidation(value, isTouched, validations, errorMessages) : {},
+        [value, isTouched, validations, errorMessages]
+      );
+      setErrors(
+        (prevErrors) => handleNestedChange({
+          state: prevErrors,
+          id,
+          value: hasValidations ? !inputValidations.isValid : false
+        })
+      );
+      return {
+        id,
+        onChange,
+        onBlur,
+        value,
+        isInvalid: hasValidations ? !inputValidations.isValid : false,
+        errorMessage: hasValidations ? inputValidations.validationProps.errorMessage : ""
+      };
+    },
+    [state, touched, getValidation]
+  );
+  const hasInvalidValues = (0, import_react.useCallback)(() => {
+    setTouched((prevTouched) => {
+      const newTouched = allToValue(prevTouched, true);
+      setErrors((prevErrors) => {
+        const newErrors = { ...prevErrors };
+        for (const key in newTouched) {
+          if (newTouched.hasOwnProperty(key)) newErrors[key] = true;
+        }
+        return newErrors;
+      });
+      return newTouched;
     });
-    return {
-      id,
-      onChange,
-      onBlur,
-      value,
-      isInvalid: hasValidations ? !inputValidations.isValid : false,
-      errorMessage: hasValidations ? inputValidations.validationProps.errorMessage : ""
-    };
-  }
-  const hasInvalidValues = () => {
-    setTouched(allToValue(touched, true));
     return JSON.stringify(errors2).includes(":true");
-  };
+  }, [errors2]);
   return {
     onChange,
     onBlur,

package/dist/index.mjs

@@ -6,7 +6,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 });
 
 // src/hooks/useFormChange.tsx
-import { useState } from "react";
+import { useState, useCallback, useMemo } from "react";
 
 // types/errors.ts
 var NextUIError = class {
@@ -167,34 +167,61 @@ function useValidation() {
 
 // src/hooks/useFormChange.tsx
 function useFormChange(initialObj) {
-  const [state, setState] = useState(initialObj), [touched, setTouched] = useState(allToValue(initialObj, false)), { getValidation } = useValidation();
-  let errors2 = allToValue(initialObj, false);
-  const onChange = ({
-    target: { id, value }
-  }) => setState(handleNestedChange({ state, id, value })), onBlur = ({ target: { id } }) => setTouched(handleNestedChange({ state: touched, id, value: true })), resetForm = () => {
+  const [state, setState] = useState(initialObj), [touched, setTouched] = useState(allToValue(initialObj, false)), { getValidation } = useValidation(), [errors2, setErrors] = useState(allToValue(initialObj, false));
+  const onChange = useCallback(
+    ({ target: { id, value } }) => setState(
+      (prevState) => handleNestedChange({ state: prevState, id, value })
+    ),
+    []
+  ), onBlur = useCallback(
+    ({ target: { id } }) => setTouched(
+      (prevTouched) => handleNestedChange({ state: prevTouched, id, value: true })
+    ),
+    []
+  ), resetForm = useCallback(() => {
     setTouched(allToValue(initialObj, false));
     setState(initialObj);
-  };
-  function register(id, validations, errorMessages) {
-    const [value, isTouched] = [state[id], touched[id]], hasValidations = validations !== void 0, inputValidations = hasValidations ? getValidation(value, isTouched, validations, errorMessages) : {};
-    errors2 = handleNestedChange({
-      state: errors2,
-      id,
-      value: hasValidations ? !inputValidations.isValid : false
+    setErrors(allToValue(initialObj, false));
+  }, [initialObj]);
+  const register = useCallback(
+    (id, validations, errorMessages) => {
+      const [value, isTouched] = [state[id], touched[id]], hasValidations = validations !== void 0;
+      const inputValidations = useMemo(
+        () => hasValidations ? getValidation(value, isTouched, validations, errorMessages) : {},
+        [value, isTouched, validations, errorMessages]
+      );
+      setErrors(
+        (prevErrors) => handleNestedChange({
+          state: prevErrors,
+          id,
+          value: hasValidations ? !inputValidations.isValid : false
+        })
+      );
+      return {
+        id,
+        onChange,
+        onBlur,
+        value,
+        isInvalid: hasValidations ? !inputValidations.isValid : false,
+        errorMessage: hasValidations ? inputValidations.validationProps.errorMessage : ""
+      };
+    },
+    [state, touched, getValidation]
+  );
+  const hasInvalidValues = useCallback(() => {
+    setTouched((prevTouched) => {
+      const newTouched = allToValue(prevTouched, true);
+      setErrors((prevErrors) => {
+        const newErrors = { ...prevErrors };
+        for (const key in newTouched) {
+          if (newTouched.hasOwnProperty(key)) newErrors[key] = true;
+        }
+        return newErrors;
+      });
+      return newTouched;
     });
-    return {
-      id,
-      onChange,
-      onBlur,
-      value,
-      isInvalid: hasValidations ? !inputValidations.isValid : false,
-      errorMessage: hasValidations ? inputValidations.validationProps.errorMessage : ""
-    };
-  }
-  const hasInvalidValues = () => {
-    setTouched(allToValue(touched, true));
     return JSON.stringify(errors2).includes(":true");
-  };
+  }, [errors2]);
   return {
     onChange,
     onBlur,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@juantroconisf/lib",
-  "version": "2.3.1",
+  "version": "2.3.3",
   "description": "",
   "main": "dist/index.js",
   "module": "dist/index.mjs",