mui-custom-form 1.1.10 → 2.0.0

package/dist/CustomForm.js

@@ -58,7 +58,7 @@ export const CustomForm = ({ fieldsGroups, onSubmit, formControl, submitButton =
                         ? calculatedSpan
                         : 12 }, renderField(field))))));
         }),
-        React.createElement(Stack, { direction: "row", justifyContent: actionButtonsPlacement || "flex-end", spacing: 2 },
+        React.createElement(Stack, { direction: "row", sx: { justifyContent: actionButtonsPlacement || "flex-end" }, spacing: 2 },
             resetButton && (React.createElement(Button, { type: "reset", variant: "contained", onClick: () => reset(), ...resetButtonProps }, "Reset")),
             submitButton && (React.createElement(Button, { type: "submit", variant: "contained", ...submitButtonProps }, "Submit")))));
 };

package/dist/components/fields/DateField.js

@@ -1,9 +1,15 @@
-import { TextField as MuiTextField } from "@mui/material";
 import { DatePicker } from "@mui/x-date-pickers";
 import React from "react";
 import { Controller } from "react-hook-form";
 export const DateField = ({ field, formControl, }) => {
     const { control } = formControl;
-    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(DatePicker, { ...controlField, value: controlField.value || null, ...field.otherProps, label: field.label, onChange: (date) => controlField.onChange(date), renderInput: (params) => (React.createElement(MuiTextField, { ...params, required: field.required, error: !!error, helperText: error?.message, fullWidth: true })) })) }));
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(DatePicker, { ...controlField, value: controlField.value || null, label: field.label, onChange: (date) => controlField.onChange(date), slotProps: {
+                textField: {
+                    required: field.required,
+                    error: !!error,
+                    helperText: error?.message,
+                    fullWidth: true,
+                },
+            }, ...field.otherProps })) }));
 };
 //# sourceMappingURL=DateField.js.map

package/dist/components/fields/DateField.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../src/components/fields/DateField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,IAAI,YAAY,EAAkB,MAAM,eAAe,CAAA;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAChD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,SAAS,GAAG,CAAwB,EAC/C,KAAK,EACL,WAAW,GACO,EAAE,EAAE;IACtB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,UAAU,OACL,YAAY,EAChB,KAAK,EAAE,YAAY,CAAC,KAAK,IAAI,IAAI,KAC7B,KAAK,CAAC,UAAU,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,EAC/C,WAAW,EAAE,CAAC,MAAsB,EAAE,EAAE,CAAC,CACvC,oBAAC,YAAY,OACP,MAAM,EACV,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,UAAU,EAAE,KAAK,EAAE,OAAO,EAC1B,SAAS,SACT,CACH,GACD,CACH,GACD,CACH,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../src/components/fields/DateField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAChD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,SAAS,GAAG,CAAwB,EAC/C,KAAK,EACL,WAAW,GACO,EAAE,EAAE;IACtB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,UAAU,OACL,YAAY,EAChB,KAAK,EAAE,YAAY,CAAC,KAAK,IAAI,IAAI,EACjC,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,EAC/C,SAAS,EAAE;gBACT,SAAS,EAAE;oBACT,QAAQ,EAAE,KAAK,CAAC,QAAQ;oBACxB,KAAK,EAAE,CAAC,CAAC,KAAK;oBACd,UAAU,EAAE,KAAK,EAAE,OAAO;oBAC1B,SAAS,EAAE,IAAI;iBAChB;aACF,KACG,KAAK,CAAC,UAAU,GACpB,CACH,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/components/fields/FileField.js

@@ -12,7 +12,7 @@ export const FileField = ({ field, formControl, }) => {
                 : null;
             return (React.createElement(FormControl, { fullWidth: true, error: !!error },
                 React.createElement(FormLabel, { component: "legend", required: field.required }, field.label),
-                React.createElement(Stack, { direction: "row", alignItems: "center", spacing: 2 },
+                React.createElement(Stack, { direction: "row", spacing: 2, sx: { alignItems: "center" } },
                     React.createElement(Box, { onClick: () => fileInputRef.current?.click(), sx: { cursor: "pointer" }, ...field.otherProps },
                         field.fileInputComponent ? (typeof field.fileInputComponent === "function" ? (React.createElement(field.fileInputComponent)) : (field.fileInputComponent)) : (React.createElement(Button, { variant: "contained", component: "span" }, "Upload File")),
                         React.createElement("input", { type: "file", hidden: true, ref: fileInputRef, onChange: (e) => {
@@ -21,7 +21,7 @@ export const FileField = ({ field, formControl, }) => {
                                     : undefined;
                                 controlField.onChange(fileValue);
                             } })),
-                    selectedFile && (React.createElement(Stack, { direction: "row", alignItems: "center", spacing: 1 },
+                    selectedFile && (React.createElement(Stack, { direction: "row", spacing: 1, sx: { alignItems: "center" } },
                         selectedFile.type.startsWith("image/") && previewUrl ? (React.createElement("img", { src: previewUrl, alt: "Preview", style: {
                                 maxWidth: "50px",
                                 maxHeight: "50px",

package/dist/components/fields/FileField.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileField.js","sourceRoot":"","sources":["../../../src/components/fields/FileField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FileField.js","sourceRoot":"","sources":["../../../src/components/fields/FileField.tsx"],"names":[],"mappings":"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"}

package/dist/src/CustomForm.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { FieldValues } from "react-hook-form";
+import { ICustomForm } from "./types";
+export declare const CustomForm: <T extends FieldValues>({ fieldsGroups, onSubmit, formControl, submitButton, resetButton, actionButtonsPlacement, layout, otherProps, }: ICustomForm<T>) => React.JSX.Element;
+export default CustomForm;

package/dist/src/CustomForm.js

@@ -0,0 +1,66 @@
+import { Button, Grid, Stack } from "@mui/material";
+import React from "react";
+// Import modularized field components
+import { TextField } from "./components/fields/TextField";
+import { TextareaField } from "./components/fields/TextareaField";
+import { SelectField } from "./components/fields/SelectField";
+import { DateField } from "./components/fields/DateField";
+import { FileField } from "./components/fields/FileField";
+import { SwitchField } from "./components/fields/SwitchField";
+import { CheckboxGroupField } from "./components/fields/CheckboxGroupField";
+import { RadioGroupField } from "./components/fields/RadioGroupField";
+import { CustomField as CustomComponentField } from "./components/fields/CustomField";
+export const CustomForm = ({ fieldsGroups, onSubmit, formControl, submitButton = true, resetButton, actionButtonsPlacement, layout, otherProps, }) => {
+    const { control, reset } = formControl;
+    const renderField = (field) => {
+        switch (field.type) {
+            case "text":
+            case "number":
+            case "password":
+                return React.createElement(TextField, { field: field, formControl: formControl });
+            case "textarea":
+                return React.createElement(TextareaField, { field: field, formControl: formControl });
+            case "single-select":
+            case "multi-select":
+                return React.createElement(SelectField, { field: field, formControl: formControl });
+            case "date":
+                return React.createElement(DateField, { field: field, formControl: formControl });
+            case "file":
+                return React.createElement(FileField, { field: field, formControl: formControl });
+            case "switch":
+                return React.createElement(SwitchField, { field: field, formControl: formControl });
+            case "checkbox-group":
+                return React.createElement(CheckboxGroupField, { field: field, formControl: formControl });
+            case "radio-group":
+                return React.createElement(RadioGroupField, { field: field, formControl: formControl });
+            case "custom":
+                return React.createElement(CustomComponentField, { field: field, formControl: formControl });
+            default:
+                return null;
+        }
+    };
+    const submitButtonProps = submitButton && submitButton !== true ? submitButton : {};
+    const resetButtonProps = resetButton && resetButton !== true ? resetButton : {};
+    // Function to calculate spans dynamically
+    const calculateSpan = (fields) => {
+        const totalDefinedSpan = fields.reduce((acc, field) => acc + (field.span || 0), 0);
+        const autoSpanFields = fields.filter((field) => !field.span).length;
+        const remainingSpan = 12 - totalDefinedSpan;
+        const calculatedSpan = autoSpanFields > 0 ? Math.floor(remainingSpan / autoSpanFields) : 12;
+        return { calculatedSpan, autoSpanFields };
+    };
+    return (React.createElement(Stack, { component: "form", onSubmit: formControl.handleSubmit(onSubmit[0], onSubmit[1]), noValidate: true, direction: layout, ...otherProps, spacing: 3 },
+        fieldsGroups.map((fields, rowIndex) => {
+            const { calculatedSpan, autoSpanFields } = calculateSpan(fields);
+            return (React.createElement(Grid, { container: true, key: rowIndex, spacing: 2 }, fields.map((field, fieldIndex) => (React.createElement(Grid, { key: fieldIndex, size: field.span
+                    ? field.span
+                    : autoSpanFields > 0
+                        ? calculatedSpan
+                        : 12 }, renderField(field))))));
+        }),
+        React.createElement(Stack, { direction: "row", sx: { justifyContent: actionButtonsPlacement || "flex-end" }, spacing: 2 },
+            resetButton && (React.createElement(Button, { type: "reset", variant: "contained", onClick: () => reset(), ...resetButtonProps }, "Reset")),
+            submitButton && (React.createElement(Button, { type: "submit", variant: "contained", ...submitButtonProps }, "Submit")))));
+};
+export default CustomForm;
+//# sourceMappingURL=CustomForm.js.map

package/dist/src/CustomForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomForm.js","sourceRoot":"","sources":["../../src/CustomForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACnD,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,sCAAsC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAA;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAA;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAA;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAA;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAA;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAA;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAA;AAC3E,OAAO,EAAE,eAAe,EAAE,MAAM,qCAAqC,CAAA;AACrE,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,iCAAiC,CAAA;AAErF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAwB,EAChD,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,YAAY,GAAG,IAAI,EACnB,WAAW,EACX,sBAAsB,EACtB,MAAM,EACN,UAAU,GACK,EAAE,EAAE;IACnB,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,WAAW,CAAA;IAEtC,MAAM,WAAW,GAAG,CAAC,KAA4B,EAAE,EAAE;QACnD,QAAQ,KAAK,CAAC,IAAI,EAAE,CAAC;YACnB,KAAK,MAAM,CAAC;YACZ,KAAK,QAAQ,CAAC;YACd,KAAK,UAAU;gBACb,OAAO,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YAC9D,KAAK,UAAU;gBACb,OAAO,oBAAC,aAAa,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YAClE,KAAK,eAAe,CAAC;YACrB,KAAK,cAAc;gBACjB,OAAO,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YAChE,KAAK,MAAM;gBACT,OAAO,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YAC9D,KAAK,MAAM;gBACT,OAAO,oBAAC,SAAS,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YAC9D,KAAK,QAAQ;gBACX,OAAO,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YAChE,KAAK,gBAAgB;gBACnB,OAAO,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YACvE,KAAK,aAAa;gBAChB,OAAO,oBAAC,eAAe,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YACpE,KAAK,QAAQ;gBACX,OAAO,oBAAC,oBAAoB,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,GAAI,CAAA;YACzE;gBACE,OAAO,IAAI,CAAA;QACf,CAAC;IACH,CAAC,CAAA;IAED,MAAM,iBAAiB,GACrB,YAAY,IAAI,YAAY,KAAK,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAA;IAC3D,MAAM,gBAAgB,GACpB,WAAW,IAAI,WAAW,KAAK,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAA;IAExD,0CAA0C;IAC1C,MAAM,aAAa,GAAG,CAAC,MAA2B,EAAE,EAAE;QACpD,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CACpC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,CAAC,EACvC,CAAC,CACF,CAAA;QACD,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM,CAAA;QACnE,MAAM,aAAa,GAAG,EAAE,GAAG,gBAAgB,CAAA;QAC3C,MAAM,cAAc,GAClB,cAAc,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;QAEtE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,CAAA;IAC3C,CAAC,CAAA;IAED,OAAO,CACL,oBAAC,KAAK,IACJ,SAAS,EAAC,MAAM,EAChB,QAAQ,EAAE,WAAW,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,EAC5D,UAAU,QACV,SAAS,EAAE,MAAM,KACb,UAAU,EACd,OAAO,EAAE,CAAC;QACT,YAAY,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE;YACrC,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,GAAG,aAAa,CAAC,MAAM,CAAC,CAAA;YAEhE,OAAO,CACL,oBAAC,IAAI,IAAC,SAAS,QAAC,GAAG,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,IACtC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,UAAU,EAAE,EAAE,CAAC,CACjC,oBAAC,IAAI,IACH,GAAG,EAAE,UAAU,EACf,IAAI,EACF,KAAK,CAAC,IAAI;oBACR,CAAC,CAAC,KAAK,CAAC,IAAI;oBACZ,CAAC,CAAC,cAAc,GAAG,CAAC;wBAClB,CAAC,CAAC,cAAc;wBAChB,CAAC,CAAC,EAAE,IAET,WAAW,CAAC,KAA8B,CAAC,CACvC,CACR,CAAC,CACG,CACR,CAAA;QACH,CAAC,CAAC;QACF,oBAAC,KAAK,IACJ,SAAS,EAAC,KAAK,EACf,EAAE,EAAE,EAAE,cAAc,EAAE,sBAAsB,IAAI,UAAU,EAAE,EAC5D,OAAO,EAAE,CAAC;YACT,WAAW,IAAI,CACd,oBAAC,MAAM,IACL,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,WAAW,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,KAClB,gBAAgB,YAEb,CACV;YACA,YAAY,IAAI,CACf,oBAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAC,WAAW,KAAK,iBAAiB,aAEtD,CACV,CACK,CACF,CACT,CAAA;AACH,CAAC,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/src/components/fields/CheckboxGroupField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { ICheckboxGroupField } from "../../types";
+interface CheckboxGroupFieldProps<T extends FieldValues> {
+    field: ICheckboxGroupField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const CheckboxGroupField: <T extends FieldValues>({ field, formControl, }: CheckboxGroupFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/CheckboxGroupField.js

@@ -0,0 +1,23 @@
+import { Checkbox, FormControl, FormControlLabel, FormHelperText, FormLabel, Stack, } from "@mui/material";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const CheckboxGroupField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(FormControl, { component: "fieldset", error: !!error },
+            React.createElement(FormLabel, { component: "legend", required: field.required }, field.label),
+            React.createElement(Stack, { direction: "row", spacing: 2 }, field.list?.map((option) => (React.createElement(FormControlLabel, { key: option.value, control: React.createElement(Checkbox, { checked: controlField.value?.includes(option.value) || false, onChange: (e) => {
+                        const checked = e.target.checked;
+                        const value = option.value;
+                        if (checked) {
+                            controlField.onChange([
+                                ...(controlField.value || []),
+                                value,
+                            ]);
+                        }
+                        else {
+                            controlField.onChange((controlField.value || []).filter((v) => v !== value));
+                        }
+                    }, ...field.otherProps }), label: option.label })))),
+            error && React.createElement(FormHelperText, null, error.message))) }));
+};
+//# sourceMappingURL=CheckboxGroupField.js.map

package/dist/src/components/fields/CheckboxGroupField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxGroupField.js","sourceRoot":"","sources":["../../../../src/components/fields/CheckboxGroupField.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,SAAS,EACT,KAAK,GACN,MAAM,eAAe,CAAA;AACtB,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAwB,EACxD,KAAK,EACL,WAAW,GACgB,EAAE,EAAE;IAC/B,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,WAAW,IAAC,SAAS,EAAC,UAAU,EAAC,KAAK,EAAE,CAAC,CAAC,KAAK;YAC9C,oBAAC,SAAS,IAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IACnD,KAAK,CAAC,KAAK,CACF;YACZ,oBAAC,KAAK,IAAC,SAAS,EAAC,KAAK,EAAC,OAAO,EAAE,CAAC,IAC9B,KAAK,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC3B,oBAAC,gBAAgB,IACf,GAAG,EAAE,MAAM,CAAC,KAAK,EACjB,OAAO,EACL,oBAAC,QAAQ,IACP,OAAO,EACL,YAAY,CAAC,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,KAAK,EAErD,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;wBACd,MAAM,OAAO,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAA;wBAChC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA;wBAC1B,IAAI,OAAO,EAAE,CAAC;4BACZ,YAAY,CAAC,QAAQ,CAAC;gCACpB,GAAG,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAC;gCAC7B,KAAK;6BACN,CAAC,CAAA;wBACJ,CAAC;6BAAM,CAAC;4BACN,YAAY,CAAC,QAAQ,CACnB,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,CAC/B,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CACxB,CACF,CAAA;wBACH,CAAC;oBACH,CAAC,KACG,KAAK,CAAC,UAAU,GACpB,EAEJ,KAAK,EAAE,MAAM,CAAC,KAAK,GACnB,CACH,CAAC,CACI;YACP,KAAK,IAAI,oBAAC,cAAc,QAAE,KAAK,CAAC,OAAO,CAAkB,CAC9C,CACf,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/CustomField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { ICustomComponentField } from "../../types";
+interface CustomFieldProps<T extends FieldValues> {
+    field: ICustomComponentField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const CustomField: <T extends FieldValues>({ field, formControl, }: CustomFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/CustomField.js

@@ -0,0 +1,12 @@
+import { FormControl, FormHelperText, FormLabel } from "@mui/material";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const CustomField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    const CustomComponent = field.component;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(FormControl, { fullWidth: true, error: !!error },
+            React.createElement(FormLabel, { component: "legend", required: field.required }, field.label),
+            React.createElement(CustomComponent, { value: controlField.value, onChange: controlField.onChange, ...field.otherProps }),
+            error && React.createElement(FormHelperText, null, error.message))) }));
+};
+//# sourceMappingURL=CustomField.js.map

package/dist/src/components/fields/CustomField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomField.js","sourceRoot":"","sources":["../../../../src/components/fields/CustomField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACtE,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,WAAW,GAAG,CAAwB,EACjD,KAAK,EACL,WAAW,GACS,EAAE,EAAE;IACxB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAC/B,MAAM,eAAe,GAAG,KAAK,CAAC,SAAS,CAAA;IAEvC,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,WAAW,IAAC,SAAS,QAAC,KAAK,EAAE,CAAC,CAAC,KAAK;YACnC,oBAAC,SAAS,IAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IACnD,KAAK,CAAC,KAAK,CACF;YACZ,oBAAC,eAAe,IACd,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,QAAQ,EAAE,YAAY,CAAC,QAAQ,KAC3B,KAAK,CAAC,UAAU,GACpB;YACD,KAAK,IAAI,oBAAC,cAAc,QAAE,KAAK,CAAC,OAAO,CAAkB,CAC9C,CACf,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/DateField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { IDateField } from "../../types";
+interface DateFieldProps<T extends FieldValues> {
+    field: IDateField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const DateField: <T extends FieldValues>({ field, formControl, }: DateFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/DateField.js

@@ -0,0 +1,9 @@
+import { TextField as MuiTextField } from "@mui/material";
+import { DatePicker } from "@mui/x-date-pickers";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const DateField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(DatePicker, { ...controlField, value: controlField.value || null, ...field.otherProps, label: field.label, onChange: (date) => controlField.onChange(date), renderInput: (params) => (React.createElement(MuiTextField, { ...params, required: field.required, error: !!error, helperText: error?.message, fullWidth: true })) })) }));
+};
+//# sourceMappingURL=DateField.js.map

package/dist/src/components/fields/DateField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../../src/components/fields/DateField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,IAAI,YAAY,EAAkB,MAAM,eAAe,CAAA;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAChD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,SAAS,GAAG,CAAwB,EAC/C,KAAK,EACL,WAAW,GACO,EAAE,EAAE;IACtB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,UAAU,OACL,YAAY,EAChB,KAAK,EAAE,YAAY,CAAC,KAAK,IAAI,IAAI,KAC7B,KAAK,CAAC,UAAU,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,EAC/C,WAAW,EAAE,CAAC,MAAsB,EAAE,EAAE,CAAC,CACvC,oBAAC,YAAY,OACP,MAAM,EACV,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,UAAU,EAAE,KAAK,EAAE,OAAO,EAC1B,SAAS,SACT,CACH,GACD,CACH,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/FileField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { IFileField } from "../../types";
+interface FileFieldProps<T extends FieldValues> {
+    field: IFileField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const FileField: <T extends FieldValues>({ field, formControl, }: FileFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/FileField.js

@@ -0,0 +1,44 @@
+import { Box, Button, FormControl, FormHelperText, FormLabel, IconButton, Stack, Typography, } from "@mui/material";
+import { Close, InsertDriveFile } from "@mui/icons-material";
+import React, { useRef } from "react";
+import { Controller } from "react-hook-form";
+export const FileField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    const fileInputRef = useRef(null);
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => {
+            const selectedFile = controlField.value?.[0];
+            const previewUrl = selectedFile
+                ? URL.createObjectURL(selectedFile)
+                : null;
+            return (React.createElement(FormControl, { fullWidth: true, error: !!error },
+                React.createElement(FormLabel, { component: "legend", required: field.required }, field.label),
+                React.createElement(Stack, { direction: "row", alignItems: "center", spacing: 2 },
+                    React.createElement(Box, { onClick: () => fileInputRef.current?.click(), sx: { cursor: "pointer" }, ...field.otherProps },
+                        field.fileInputComponent ? (typeof field.fileInputComponent === "function" ? (React.createElement(field.fileInputComponent)) : (field.fileInputComponent)) : (React.createElement(Button, { variant: "contained", component: "span" }, "Upload File")),
+                        React.createElement("input", { type: "file", hidden: true, ref: fileInputRef, onChange: (e) => {
+                                const fileValue = e.target.files && e.target.files.length > 0
+                                    ? e.target.files
+                                    : undefined;
+                                controlField.onChange(fileValue);
+                            } })),
+                    selectedFile && (React.createElement(Stack, { direction: "row", alignItems: "center", spacing: 1 },
+                        selectedFile.type.startsWith("image/") && previewUrl ? (React.createElement("img", { src: previewUrl, alt: "Preview", style: {
+                                maxWidth: "50px",
+                                maxHeight: "50px",
+                                objectFit: "contain",
+                            } })) : (React.createElement(InsertDriveFile, { sx: { fontSize: 50 } })),
+                        React.createElement(Typography, { variant: "body2" }, selectedFile.name),
+                        React.createElement(IconButton, { size: "small", onClick: () => {
+                                controlField.onChange(undefined);
+                                if (fileInputRef.current) {
+                                    fileInputRef.current.value = ""; // Clear the input element
+                                }
+                                if (previewUrl) {
+                                    URL.revokeObjectURL(previewUrl); // Clean up the object URL
+                                }
+                            } },
+                            React.createElement(Close, { fontSize: "small" }))))),
+                error && React.createElement(FormHelperText, null, error.message)));
+        } }));
+};
+//# sourceMappingURL=FileField.js.map

package/dist/src/components/fields/FileField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileField.js","sourceRoot":"","sources":["../../../../src/components/fields/FileField.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,GAAG,EACH,MAAM,EACN,WAAW,EACX,cAAc,EACd,SAAS,EACT,UAAU,EACV,KAAK,EACL,UAAU,GACX,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAC5D,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,SAAS,GAAG,CAAwB,EAC/C,KAAK,EACL,WAAW,GACO,EAAE,EAAE;IACtB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAC/B,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IAEnD,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE;YACzD,MAAM,YAAY,GAAG,YAAY,CAAC,KAAK,EAAE,CAAC,CAAC,CAAqB,CAAA;YAChE,MAAM,UAAU,GAAG,YAAY;gBAC7B,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,YAAY,CAAC;gBACnC,CAAC,CAAC,IAAI,CAAA;YAER,OAAO,CACL,oBAAC,WAAW,IAAC,SAAS,QAAC,KAAK,EAAE,CAAC,CAAC,KAAK;gBACnC,oBAAC,SAAS,IAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IACnD,KAAK,CAAC,KAAK,CACF;gBACZ,oBAAC,KAAK,IAAC,SAAS,EAAC,KAAK,EAAC,UAAU,EAAC,QAAQ,EAAC,OAAO,EAAE,CAAC;oBACnD,oBAAC,GAAG,IACF,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,EAAE,EAC5C,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,KACrB,KAAK,CAAC,UAAU;wBACnB,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAC1B,OAAO,KAAK,CAAC,kBAAkB,KAAK,UAAU,CAAC,CAAC,CAAC,CAC/C,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAC9C,CAAC,CAAC,CAAC,CACF,KAAK,CAAC,kBAAkB,CACzB,CACF,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,SAAS,EAAC,MAAM,kBAEnC,CACV;wBACD,+BACE,IAAI,EAAC,MAAM,EACX,MAAM,QACN,GAAG,EAAE,YAAY,EACjB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gCACd,MAAM,SAAS,GACb,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;oCACzC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;oCAChB,CAAC,CAAC,SAAS,CAAA;gCACf,YAAY,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAA;4BAClC,CAAC,GACD,CACE;oBAEL,YAAY,IAAI,CACf,oBAAC,KAAK,IAAC,SAAS,EAAC,KAAK,EAAC,UAAU,EAAC,QAAQ,EAAC,OAAO,EAAE,CAAC;wBAClD,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,CACtD,6BACE,GAAG,EAAE,UAAU,EACf,GAAG,EAAC,SAAS,EACb,KAAK,EAAE;gCACL,QAAQ,EAAE,MAAM;gCAChB,SAAS,EAAE,MAAM;gCACjB,SAAS,EAAE,SAAS;6BACrB,GACD,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,eAAe,IAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,GAAI,CAC1C;wBACD,oBAAC,UAAU,IAAC,OAAO,EAAC,OAAO,IAAE,YAAY,CAAC,IAAI,CAAc;wBAC5D,oBAAC,UAAU,IACT,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE;gCACZ,YAAY,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAA;gCAChC,IAAI,YAAY,CAAC,OAAO,EAAE,CAAC;oCACzB,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAA,CAAC,0BAA0B;gCAC5D,CAAC;gCACD,IAAI,UAAU,EAAE,CAAC;oCACf,GAAG,CAAC,eAAe,CAAC,UAAU,CAAC,CAAA,CAAC,0BAA0B;gCAC5D,CAAC;4BACH,CAAC;4BACD,oBAAC,KAAK,IAAC,QAAQ,EAAC,OAAO,GAAG,CACf,CACP,CACT,CACK;gBACP,KAAK,IAAI,oBAAC,cAAc,QAAE,KAAK,CAAC,OAAO,CAAkB,CAC9C,CACf,CAAA;QACH,CAAC,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/RadioGroupField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { IRadioGroupField } from "../../types";
+interface RadioGroupFieldProps<T extends FieldValues> {
+    field: IRadioGroupField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const RadioGroupField: <T extends FieldValues>({ field, formControl, }: RadioGroupFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/RadioGroupField.js

@@ -0,0 +1,11 @@
+import { FormControl, FormControlLabel, FormHelperText, FormLabel, Radio, RadioGroup, } from "@mui/material";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const RadioGroupField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(FormControl, { component: "fieldset", error: !!error },
+            React.createElement(FormLabel, { component: "legend", required: field.required }, field.label),
+            React.createElement(RadioGroup, { ...controlField, value: controlField.value || "", onChange: (e) => controlField.onChange(e.target.value), row: field.otherProps?.row || false }, field.list?.map((option) => (React.createElement(FormControlLabel, { key: option.value, value: option.value, control: React.createElement(Radio, { ...field.otherProps }), label: option.label })))),
+            error && React.createElement(FormHelperText, null, error.message))) }));
+};
+//# sourceMappingURL=RadioGroupField.js.map

package/dist/src/components/fields/RadioGroupField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroupField.js","sourceRoot":"","sources":["../../../../src/components/fields/RadioGroupField.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,SAAS,EACT,KAAK,EACL,UAAU,GACX,MAAM,eAAe,CAAA;AACtB,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,eAAe,GAAG,CAAwB,EACrD,KAAK,EACL,WAAW,GACa,EAAE,EAAE;IAC5B,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,WAAW,IAAC,SAAS,EAAC,UAAU,EAAC,KAAK,EAAE,CAAC,CAAC,KAAK;YAC9C,oBAAC,SAAS,IAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IACnD,KAAK,CAAC,KAAK,CACF;YACZ,oBAAC,UAAU,OACL,YAAY,EAChB,KAAK,EAAE,YAAY,CAAC,KAAK,IAAI,EAAE,EAC/B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,GAAG,EAAE,KAAK,CAAC,UAAU,EAAE,GAAG,IAAI,KAAK,IAClC,KAAK,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC3B,oBAAC,gBAAgB,IACf,GAAG,EAAE,MAAM,CAAC,KAAK,EACjB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,oBAAC,KAAK,OAAK,KAAK,CAAC,UAAU,GAAI,EACxC,KAAK,EAAE,MAAM,CAAC,KAAK,GACnB,CACH,CAAC,CACS;YACZ,KAAK,IAAI,oBAAC,cAAc,QAAE,KAAK,CAAC,OAAO,CAAkB,CAC9C,CACf,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/SelectField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { ISelectField } from "../../types";
+interface SelectFieldProps<T extends FieldValues> {
+    field: ISelectField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const SelectField: <T extends FieldValues>({ field, formControl, }: SelectFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/SelectField.js

@@ -0,0 +1,11 @@
+import { FormControl, InputLabel, MenuItem, Select as MuiSelect, FormHelperText, } from "@mui/material";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const SelectField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(FormControl, { fullWidth: true, error: !!error },
+            React.createElement(InputLabel, { required: field.required }, field.label),
+            React.createElement(MuiSelect, { label: field.label, ...controlField, value: controlField.value || (field.type === "multi-select" ? [] : ""), ...field.otherProps, multiple: field.type === "multi-select" }, field.list?.map((item) => (React.createElement(MenuItem, { key: item.value, value: item.value }, item.label)))),
+            error && React.createElement(FormHelperText, null, error.message))) }));
+};
+//# sourceMappingURL=SelectField.js.map

package/dist/src/components/fields/SelectField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectField.js","sourceRoot":"","sources":["../../../../src/components/fields/SelectField.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,UAAU,EACV,QAAQ,EACR,MAAM,IAAI,SAAS,EACnB,cAAc,GACf,MAAM,eAAe,CAAA;AACtB,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,WAAW,GAAG,CAAwB,EACjD,KAAK,EACL,WAAW,GACS,EAAE,EAAE;IACxB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,WAAW,IAAC,SAAS,QAAC,KAAK,EAAE,CAAC,CAAC,KAAK;YACnC,oBAAC,UAAU,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAG,KAAK,CAAC,KAAK,CAAc;YAChE,oBAAC,SAAS,IACR,KAAK,EAAE,KAAK,CAAC,KAAK,KACd,YAAY,EAChB,KAAK,EACH,YAAY,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KAE7D,KAAK,CAAC,UAAU,EACpB,QAAQ,EAAE,KAAK,CAAC,IAAI,KAAK,cAAc,IACtC,KAAK,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACzB,oBAAC,QAAQ,IAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,IACzC,IAAI,CAAC,KAAK,CACF,CACZ,CAAC,CACQ;YACX,KAAK,IAAI,oBAAC,cAAc,QAAE,KAAK,CAAC,OAAO,CAAkB,CAC9C,CACf,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/SwitchField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { ISwitchField } from "../../types";
+interface SwitchFieldProps<T extends FieldValues> {
+    field: ISwitchField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const SwitchField: <T extends FieldValues>({ field, formControl, }: SwitchFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/SwitchField.js

@@ -0,0 +1,8 @@
+import { FormControlLabel, Switch as MuiSwitch } from "@mui/material";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const SwitchField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(FormControlLabel, { control: React.createElement(MuiSwitch, { ...controlField, checked: !!controlField.value, onChange: (e) => controlField.onChange(e.target.checked), ...field.otherProps }), label: field.label })) }));
+};
+//# sourceMappingURL=SwitchField.js.map

package/dist/src/components/fields/SwitchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchField.js","sourceRoot":"","sources":["../../../../src/components/fields/SwitchField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AACrE,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,WAAW,GAAG,CAAwB,EACjD,KAAK,EACL,WAAW,GACS,EAAE,EAAE;IACxB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,gBAAgB,IACf,OAAO,EACL,oBAAC,SAAS,OACJ,YAAY,EAChB,OAAO,EAAE,CAAC,CAAC,YAAY,CAAC,KAAK,EAC7B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,KACpD,KAAK,CAAC,UAAU,GACpB,EAEJ,KAAK,EAAE,KAAK,CAAC,KAAK,GAClB,CACH,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/TextField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { ICustomField } from "../../types";
+interface TextFieldProps<T extends FieldValues> {
+    field: ICustomField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const TextField: <T extends FieldValues>({ field, formControl, }: TextFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/TextField.js

@@ -0,0 +1,14 @@
+import { TextField as MuiTextField } from "@mui/material";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const TextField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(MuiTextField, { ...controlField, value: controlField.value || "", ...field.otherProps, label: field.label, type: field.type, fullWidth: true, required: field.required, error: !!error, helperText: error?.message, onChange: (e) => {
+                if (!e.target.value)
+                    return controlField.onChange(undefined);
+                controlField.onChange(field.type === "number"
+                    ? parseFloat(e.target.value)
+                    : e.target.value);
+            } })) }));
+};
+//# sourceMappingURL=TextField.js.map

package/dist/src/components/fields/TextField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../../../../src/components/fields/TextField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,eAAe,CAAA;AACzD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,SAAS,GAAG,CAAwB,EAC/C,KAAK,EACL,WAAW,GACO,EAAE,EAAE;IACtB,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,YAAY,OACP,YAAY,EAChB,KAAK,EAAE,YAAY,CAAC,KAAK,IAAI,EAAE,KAC3B,KAAK,CAAC,UAAU,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,SAAS,QACT,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,UAAU,EAAE,KAAK,EAAE,OAAO,EAC1B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACd,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;oBAAE,OAAO,YAAY,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAA;gBAC5D,YAAY,CAAC,QAAQ,CACnB,KAAK,CAAC,IAAI,KAAK,QAAQ;oBACrB,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;oBAC5B,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CACnB,CAAA;YACH,CAAC,GACD,CACH,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/components/fields/TextareaField.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FieldValues, Path, UseFormReturn } from "react-hook-form";
+import { ICustomField } from "../../types";
+interface TextareaFieldProps<T extends FieldValues> {
+    field: ICustomField<Path<T>>;
+    formControl: UseFormReturn<T>;
+}
+export declare const TextareaField: <T extends FieldValues>({ field, formControl, }: TextareaFieldProps<T>) => React.JSX.Element;
+export {};

package/dist/src/components/fields/TextareaField.js

@@ -0,0 +1,8 @@
+import { TextField as MuiTextField } from "@mui/material";
+import React from "react";
+import { Controller } from "react-hook-form";
+export const TextareaField = ({ field, formControl, }) => {
+    const { control } = formControl;
+    return (React.createElement(Controller, { name: field.name, control: control, rules: { required: field.required }, render: ({ field: controlField, fieldState: { error } }) => (React.createElement(MuiTextField, { ...controlField, value: controlField.value || "", ...field.otherProps, label: field.label, type: "text", fullWidth: true, multiline: true, rows: field.otherProps?.rows || 4, required: field.required, error: !!error, helperText: error?.message, onChange: controlField.onChange })) }));
+};
+//# sourceMappingURL=TextareaField.js.map

package/dist/src/components/fields/TextareaField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextareaField.js","sourceRoot":"","sources":["../../../../src/components/fields/TextareaField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,eAAe,CAAA;AACzD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAoC,MAAM,iBAAiB,CAAA;AAQ9E,MAAM,CAAC,MAAM,aAAa,GAAG,CAAwB,EACnD,KAAK,EACL,WAAW,GACW,EAAE,EAAE;IAC1B,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,CAAA;IAE/B,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAE,KAAK,CAAC,IAAe,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EACnC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAC1D,oBAAC,YAAY,OACP,YAAY,EAChB,KAAK,EAAE,YAAY,CAAC,KAAK,IAAI,EAAE,KAC3B,KAAK,CAAC,UAAU,EACpB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,IAAI,EAAC,MAAM,EACX,SAAS,QACT,SAAS,QACT,IAAI,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,IAAI,CAAC,EACjC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,UAAU,EAAE,KAAK,EAAE,OAAO,EAC1B,QAAQ,EAAE,YAAY,CAAC,QAAQ,GAC/B,CACH,GACD,CACH,CAAA;AACH,CAAC,CAAA"}

package/dist/src/types.d.ts

@@ -0,0 +1,66 @@
+import { ButtonProps, StackProps } from "@mui/material";
+import { CSSProperties } from "react";
+import { FieldPath, FieldValues, SubmitErrorHandler, SubmitHandler, UseFormReturn } from "react-hook-form";
+export type TOption<T = any> = {
+    icon?: React.ReactNode;
+    label: string;
+    value: T;
+};
+type FileInputComponent = React.ReactNode | React.ElementType;
+export interface ICustomFieldBase<T extends string> {
+    label: string;
+    name: T;
+    required?: boolean;
+    otherProps?: any;
+    span?: number;
+}
+export interface ITextField<T extends string> extends ICustomFieldBase<T> {
+    type: "text" | "number" | "password";
+}
+export interface ITextareaField<T extends string> extends ICustomFieldBase<T> {
+    type: "textarea";
+}
+export interface ISelectField<T extends string> extends ICustomFieldBase<T> {
+    type: "single-select" | "multi-select";
+    list: TOption[];
+}
+export interface IDateField<T extends string> extends ICustomFieldBase<T> {
+    type: "date";
+}
+export interface IFileField<T extends string> extends ICustomFieldBase<T> {
+    type: "file";
+    fileInputComponent?: FileInputComponent;
+}
+export interface ISwitchField<T extends string> extends ICustomFieldBase<T> {
+    type: "switch";
+}
+export interface ICheckboxGroupField<T extends string> extends ICustomFieldBase<T> {
+    type: "checkbox-group";
+    list: TOption[];
+}
+export interface IRadioGroupField<T extends string> extends ICustomFieldBase<T> {
+    type: "radio-group";
+    list: TOption[];
+}
+export interface ICustomComponentField<T extends string> extends ICustomFieldBase<T> {
+    type: "custom";
+    component: React.ComponentType<CustomComponentProps>;
+}
+export type ICustomField<T extends string> = ITextField<T> | ITextareaField<T> | ISelectField<T> | IDateField<T> | IFileField<T> | ISwitchField<T> | ICheckboxGroupField<T> | IRadioGroupField<T> | ICustomComponentField<T>;
+export type IFieldGroup<TFormValues extends FieldValues = FieldValues> = ICustomField<FieldPath<TFormValues>>[][];
+export interface ICustomForm<T extends FieldValues> {
+    fieldsGroups: IFieldGroup<T>;
+    onSubmit: [SubmitHandler<T>, SubmitErrorHandler<T>?];
+    formControl: UseFormReturn<T>;
+    actionButtonsPlacement?: CSSProperties["justifyContent"];
+    submitButton?: ButtonProps | boolean;
+    resetButton?: ButtonProps | boolean;
+    layout?: StackProps["direction"];
+    otherProps?: StackProps;
+}
+export interface CustomComponentProps {
+    value: any;
+    onChange: (value: any) => void;
+    [key: string]: any;
+}
+export {};

package/dist/src/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/src/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":""}

package/dist/types.d.ts

@@ -1,4 +1,5 @@
 import { ButtonProps, StackProps } from "@mui/material";
+import { CSSProperties } from "react";
 import { FieldPath, FieldValues, SubmitErrorHandler, SubmitHandler, UseFormReturn } from "react-hook-form";
 export type TOption<T = any> = {
     icon?: React.ReactNode;
@@ -51,7 +52,7 @@ export interface ICustomForm<T extends FieldValues> {
     fieldsGroups: IFieldGroup<T>;
     onSubmit: [SubmitHandler<T>, SubmitErrorHandler<T>?];
     formControl: UseFormReturn<T>;
-    actionButtonsPlacement?: StackProps["justifyContent"];
+    actionButtonsPlacement?: CSSProperties["justifyContent"];
     submitButton?: ButtonProps | boolean;
     resetButton?: ButtonProps | boolean;
     layout?: StackProps["direction"];

package/package.json

@@ -1,13 +1,9 @@
 {
   "name": "mui-custom-form",
-  "version": "1.1.10",
+  "version": "2.0.0",
   "description": "A versatile React form component utilizing MUI components and react-hook-form.",
   "main": "dist/CustomForm.js",
   "types": "dist/CustomForm.d.ts",
-  "exports": {
-    ".": "./dist/index.js",
-    "./components/fields/*": "./dist/components/fields/*.js"
-  },
   "scripts": {
     "build": "tsc",
     "prepublishOnly": "npm run build"
@@ -31,24 +27,24 @@
   ],
   "peerDependencies": {
     "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.0",
-    "@mui/x-date-pickers": "^8.3.1",
-    "date-fns": "^4.1.0",
-    "dayjs": "^1.11.13",
+    "@emotion/styled": "^11.14.1",
+    "@mui/x-date-pickers": "^9.7.0",
+    "date-fns": "^4.4.0",
+    "dayjs": "^1.11.21",
     "moment": "^2.30.1",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0",
     "react-hook-form": "^7.56.3"
   },
   "devDependencies": {
-    "@types/node": "^22.15.18",
+    "@types/node": "^24.13.2",
     "@types/react": "^18.0.0 || ^19.0.0",
     "@types/react-dom": "^18.0.0 || ^19.0.0",
-    "typescript": "^5.8.3"
+    "typescript": "^6.0.3"
   },
   "dependencies": {
-    "@mui/icons-material": "^7.1.0",
-    "@mui/material": "^7.1.0",
-    "react-hook-form": "^7.56.3"
+    "@mui/icons-material": "^9.1.1",
+    "@mui/material": "^9.1.2",
+    "react-hook-form": "^7.80.0"
   }
 }