@algorithm-shift/design-system 1.2.41 → 1.2.42

package/dist/index.mjs

@@ -2909,7 +2909,7 @@ function useAppState() {
   return useContext(StateContext);
 }
 
-// src/components/Form/Wrapper.tsx
+// src/components/Form/Form.tsx
 import React18, { useMemo as useMemo2 } from "react";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm, Controller } from "react-hook-form";
@@ -2983,7 +2983,7 @@ function generateZodSchema(data) {
   }, {});
   return z.object(fields);
 }
-var FormWrapper = ({
+var Form = ({
   validation,
   defaultValues,
   children,
@@ -3060,6 +3060,116 @@ var FormWrapper = ({
     }
   );
 };
+var Form_default = Form;
+
+// src/components/Form/Wrapper.tsx
+import { useMemo as useMemo3 } from "react";
+import { zodResolver as zodResolver2 } from "@hookform/resolvers/zod";
+import { useForm as useForm2 } from "react-hook-form";
+import { z as z2 } from "zod";
+import { jsx as jsx58 } from "react/jsx-runtime";
+function generateZodSchema2(data) {
+  const fields = data.reduce((acc, f) => {
+    const name = f.name || "unnamed";
+    const message = f.message || `${name} is invalid`;
+    const passwordLen = f.passwordLength;
+    let fieldSchema = z2.string({ message });
+    switch (f.type) {
+      case "Text":
+      case "Search":
+        fieldSchema = z2.string({ message });
+        if (f?.min && f?.min !== "") fieldSchema = fieldSchema.min(f.min);
+        else if (f.isRequired) fieldSchema = fieldSchema.min(1, { message: `${message}. Cannot be empty` });
+        if (f?.max && f?.max !== "") fieldSchema = fieldSchema.max(f.max);
+        if (f?.email) fieldSchema = fieldSchema.email();
+        if (f?.url) fieldSchema = fieldSchema.url();
+        if (f?.regex) fieldSchema = fieldSchema.regex(new RegExp(f.regex));
+        break;
+      case "Email":
+        fieldSchema = z2.email({ message });
+        break;
+      case "Password":
+        fieldSchema = z2.string({ message }).min(passwordLen, { message: `Password must be at least ${passwordLen} characters long` });
+        break;
+      case "Phone":
+        fieldSchema = z2.string().transform((val) => val.replace(/\D/g, "")).transform((val) => val.slice(-10)).refine((val) => {
+          return val.length === 10;
+        }, {
+          message: "Phone number must be 10 digits long"
+        });
+        break;
+      case "DatePicker":
+        fieldSchema = z2.iso.date({ message });
+        break;
+      case "FileInput":
+        fieldSchema = z2.instanceof(File, { message: "Please select a file" });
+        if (f?.maxSize) {
+          fieldSchema = fieldSchema.refine(
+            (file) => file.size <= f.maxSize,
+            { message: `File size must be less than ${f.maxSize / 1024 / 1024}MB` }
+          );
+        }
+        if (f?.acceptedTypes) {
+          fieldSchema = fieldSchema.refine(
+            (file) => f.acceptedTypes.includes(file.type),
+            { message: `File type must be one of: ${f.acceptedTypes.join(", ")}` }
+          );
+        }
+        break;
+      case "Checkbox":
+        fieldSchema = z2.boolean({ message });
+        break;
+      case "Dropdown":
+        fieldSchema = z2.string({ message });
+        break;
+      case "NumberInput":
+        fieldSchema = z2.number({ message });
+        if (f?.min !== void 0) fieldSchema = fieldSchema.min(f.min);
+        if (f?.max !== void 0) fieldSchema = fieldSchema.max(f.max);
+        break;
+      default:
+        fieldSchema = z2.any();
+    }
+    if (!f.isRequired) fieldSchema = fieldSchema.optional();
+    acc[name] = fieldSchema;
+    return acc;
+  }, {});
+  return z2.object(fields);
+}
+var FormWrapper = ({
+  validation,
+  defaultValues,
+  children,
+  onSubmit,
+  onReset
+}) => {
+  const schema = useMemo3(() => {
+    if (!validation || validation.length === 0) return null;
+    return generateZodSchema2(validation);
+  }, [validation]);
+  const form = useForm2({
+    resolver: schema ? zodResolver2(schema) : void 0,
+    defaultValues
+  });
+  const formSubmit = (data) => {
+    if (onSubmit) onSubmit(data);
+  };
+  const handleReset = () => {
+    form.reset();
+    if (onReset) onReset();
+  };
+  return /* @__PURE__ */ jsx58(
+    "form",
+    {
+      onSubmit: form.handleSubmit(formSubmit),
+      onReset: handleReset,
+      className: cn(
+        "space-y-4 min-h-[100px] h-auto flex justify-between flex-col"
+      ),
+      children: /* @__PURE__ */ jsx58("div", { className: "min-h-[50px]", children: typeof children === "function" ? children(form) : children })
+    }
+  );
+};
 var Wrapper_default = FormWrapper;
 export {
   BarChart_default as BarChart,
@@ -3075,7 +3185,8 @@ export {
   EmailComposer,
   FileInput_default as FileInput,
   Flex_default as FlexLayout,
-  Wrapper_default as Form,
+  Form_default as Form,
+  Wrapper_default as FormWrapper,
   Grid_default as GridLayout,
   Image_default as Image,
   Modal_default as Modal,