node_yupform 1.0.0

package/YupValidation.js

@@ -0,0 +1,169 @@
+//npm install react-hook-form yup @hookform/resolvers
+
+// import * as Yup from "yup";
+// import { useForm } from "react-hook-form";
+// import { yupResolver } from "@hookform/resolvers/yup";
+// import * as yup from "yup";
+// interface FormData {
+//   name: string;
+//   email: string;
+//   password: string;
+//   confirmPassword: string;
+//   age: number;
+//   phone: string;
+// }
+// const schema = yup.object({
+//   name: yup
+//     .string()
+//     .required("Name is required")
+//     .min(3, "Minimum 3 characters")
+//     .max(20, "Maximum 20 characters"),
+//   email: yup
+//     .string()
+//     .required("Email is required")
+//     .email("Invalid email"),
+//   password: yup
+//     .string()
+//     .required("Password is required")
+//     .min(8, "Minimum 8 characters")
+//     .matches(
+//       /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d).*$/,
+//       "Must contain Uppercase, Lowercase & Number"
+//     ),
+//   confirmPassword: yup
+//     .string()
+//     .required("Confirm Password required")
+//     .oneOf(
+//       [yup.ref("password")],
+//       "Passwords must match"
+//     ),
+//   age: yup
+//     .number()
+//     .required()
+//     .min(18, "Minimum age 18")
+//     .max(60, "Maximum age 60"),
+//   phone: yup
+//     .string()
+//     .required()
+//     .matches(
+//       /^[0-9]{10}$/,
+//       "Phone must be 10 digits"
+//     ),
+// }).required();
+// export default function App() {
+//     //type FormData = yup.InferType<typeof schema>;
+//   const {register,handleSubmit,formState: { errors },} = useForm<FormData>({
+//                                                         resolver: yupResolver(schema),
+//                                                         });
+//   const onSubmit = (data: FormData) => {
+//     console.log(data);
+//   };
+//   return (
+//     <form onSubmit={handleSubmit(onSubmit)}>
+//       <input
+//         placeholder="Name"
+//         {...register("name")}
+//       />
+//       <p>{errors.name?.message}</p>
+//       <input
+//         placeholder="Email"
+//         {...register("email")}
+//       />
+//       <p>{errors.email?.message}</p>
+//       <button type="submit">
+//         Submit
+//       </button>
+//     </form>
+//   );
+// }
+
+
+// **************************
+
+//npm install react-hook-form zod @hookform/resolvers
+// import { useForm } from "react-hook-form";
+// import { z } from "zod";
+// import { zodResolver } from "@hookform/resolvers/zod";
+// // Validation Schema
+// const registerSchema = z
+//   .object({
+//     fullName: z
+//       .string()
+//       .min(2, "Full name must be at least 2 characters"),
+//     email: z
+//       .string()
+//       .email("Invalid email address"),
+//     password: z
+//       .string()
+//       .min(6, "Password must be at least 6 characters"),
+//     confirmPassword: z.string(),
+//     age: z.coerce
+//       .number()
+//       .min(19, "Age must be above 18"),
+//   })
+//   .refine((data) => data.password === data.confirmPassword, {
+//     message: "Passwords do not match",
+//     path: ["confirmPassword"],
+//   });
+// Type automatically generated from schema
+// type FormData = z.infer<typeof registerSchema>;
+// export default function RegisterForm() {
+//   const {
+//     register,
+//     handleSubmit,
+//     formState: { errors },
+//   } = useForm<FormData>({
+//     resolver: zodResolver(registerSchema),
+//   });
+//   const onSubmit = (data: FormData) => {
+//     console.log(data);
+//     alert("Form Submitted Successfully!");
+//   };
+//   return (
+//     <form onSubmit={handleSubmit(onSubmit)}>
+//       <div>
+//         <input
+//           type="text"
+//           placeholder="Full Name"
+//           {...register("fullName")}
+//         />
+//         <p>{errors.fullName?.message}</p>
+//       </div>
+//       <div>
+//         <input
+//           type="email"
+//           placeholder="Email"
+//           {...register("email")}
+//         />
+//         <p>{errors.email?.message}</p>
+//       </div>
+//       <div>
+//         <input
+//           type="password"
+//           placeholder="Password"
+//           {...register("password")}
+//         />
+//         <p>{errors.password?.message}</p>
+//       </div>
+//       <div>
+//         <input
+//           type="password"
+//           placeholder="Confirm Password"
+//           {...register("confirmPassword")}
+//         />
+//         <p>{errors.confirmPassword?.message}</p>
+//       </div>
+//       <div>
+//         <input
+//           type="number"
+//           placeholder="Age"
+//           {...register("age")}
+//         />
+//         <p>{errors.age?.message}</p>
+//       </div>
+//       <button type="submit">
+//         Register
+//       </button>
+//     </form>
+//   );
+// }

package/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "node_yupform",
+  "version": "1.0.0",
+  "description": "",
+  "main": "YupValidation.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "type": "commonjs"
+}