@rachelallyson/hero-hook-form 1.0.0

package/dist/react/index.js

@@ -0,0 +1,1256 @@
+// src/components/Form.tsx
+import React12 from "react";
+import { Button as Button2 } from "@heroui/react";
+
+// src/hooks/useFormHelper.ts
+import { useState } from "react";
+import { useForm } from "react-hook-form";
+function useFormHelper({
+  defaultValues,
+  methods,
+  onError,
+  onSubmit,
+  onSuccess
+}) {
+  const [submissionState, setSubmissionState] = useState({
+    isSubmitted: false,
+    isSubmitting: false,
+    isSuccess: false
+  });
+  const form = methods ?? useForm({ defaultValues });
+  const handleSubmit = async () => {
+    setSubmissionState((prev) => ({
+      ...prev,
+      error: void 0,
+      isSubmitting: true
+    }));
+    try {
+      await form.handleSubmit(async (formData) => {
+        await onSubmit(formData);
+      })();
+      setSubmissionState({
+        isSubmitted: true,
+        isSubmitting: false,
+        isSuccess: true
+      });
+      onSuccess?.(form.getValues());
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : "An error occurred";
+      setSubmissionState({
+        error: errorMessage,
+        isSubmitted: true,
+        isSubmitting: false,
+        isSuccess: false
+      });
+      onError?.({
+        message: errorMessage
+      });
+    }
+  };
+  const resetForm = () => {
+    form.reset();
+    setSubmissionState({
+      isSubmitted: false,
+      isSubmitting: false,
+      isSuccess: false
+    });
+  };
+  return {
+    error: submissionState.error,
+    form,
+    handleSubmit,
+    isSubmitted: submissionState.isSubmitted,
+    isSubmitting: submissionState.isSubmitting,
+    isSuccess: submissionState.isSuccess,
+    resetForm,
+    submissionState
+  };
+}
+
+// src/components/FormField.tsx
+import React11 from "react";
+
+// src/fields/CheckboxField.tsx
+import React2 from "react";
+import { Controller } from "react-hook-form";
+
+// src/providers/ConfigProvider.tsx
+import React, { createContext, useContext, useMemo } from "react";
+var DefaultsContext = createContext(null);
+function HeroHookFormProvider(props) {
+  const value = useMemo(() => props.defaults ?? {}, [props.defaults]);
+  return /* @__PURE__ */ React.createElement(DefaultsContext.Provider, { value }, props.children);
+}
+function useHeroHookFormDefaults() {
+  const cfg = useContext(DefaultsContext) ?? {};
+  const common = cfg.common ?? {};
+  const commonInput = {
+    ...common.color !== void 0 ? { color: common.color } : {},
+    ...common.size !== void 0 ? { size: common.size } : {},
+    ...common.variant !== void 0 ? { variant: common.variant } : {},
+    ...common.radius !== void 0 ? { radius: common.radius } : {},
+    ...common.labelPlacement !== void 0 ? {
+      labelPlacement: common.labelPlacement
+    } : {}
+  };
+  const commonTextarea = {
+    ...common.color !== void 0 ? { color: common.color } : {},
+    ...common.size !== void 0 ? { size: common.size } : {},
+    ...common.variant !== void 0 ? { variant: common.variant } : {},
+    ...common.radius !== void 0 ? { radius: common.radius } : {},
+    ...common.labelPlacement !== void 0 ? {
+      labelPlacement: common.labelPlacement
+    } : {}
+  };
+  const commonSelect = {
+    ...common.color !== void 0 ? { color: common.color } : {},
+    ...common.size !== void 0 ? { size: common.size } : {},
+    ...common.variant !== void 0 ? { variant: common.variant } : {},
+    ...common.radius !== void 0 ? { radius: common.radius } : {},
+    ...common.labelPlacement !== void 0 ? {
+      labelPlacement: common.labelPlacement
+    } : {}
+  };
+  const commonCheckbox = {
+    ...common.color !== void 0 ? {
+      color: common.color
+    } : {},
+    ...common.size !== void 0 ? { size: common.size } : {}
+  };
+  const commonRadioGroup = {
+    ...common.color !== void 0 ? {
+      color: common.color
+    } : {},
+    ...common.size !== void 0 ? { size: common.size } : {}
+  };
+  const commonDateInput = {
+    ...common.color !== void 0 ? {
+      color: common.color
+    } : {},
+    ...common.size !== void 0 ? { size: common.size } : {},
+    ...common.variant !== void 0 ? {
+      variant: common.variant
+    } : {},
+    ...common.radius !== void 0 ? {
+      radius: common.radius
+    } : {}
+  };
+  const commonSlider = {
+    ...common.color !== void 0 ? { color: common.color } : {},
+    ...common.size !== void 0 ? { size: common.size } : {}
+  };
+  const commonSwitch = {
+    ...common.color !== void 0 ? { color: common.color } : {},
+    ...common.size !== void 0 ? { size: common.size } : {}
+  };
+  const commonButton = {
+    ...common.color !== void 0 ? { color: common.color } : {},
+    ...common.size !== void 0 ? { size: common.size } : {}
+  };
+  return {
+    checkbox: { ...commonCheckbox, ...cfg.checkbox ?? {} },
+    dateInput: { ...commonDateInput, ...cfg.dateInput ?? {} },
+    input: { ...commonInput, ...cfg.input ?? {} },
+    radioGroup: { ...commonRadioGroup, ...cfg.radioGroup ?? {} },
+    select: { ...commonSelect, ...cfg.select ?? {} },
+    slider: { ...commonSlider, ...cfg.slider ?? {} },
+    submitButton: { ...commonButton, ...cfg.submitButton ?? {} },
+    switch: { ...commonSwitch, ...cfg.switch ?? {} },
+    textarea: { ...commonTextarea, ...cfg.textarea ?? {} }
+  };
+}
+
+// src/ui/react.ts
+import {
+  Button,
+  Checkbox,
+  DateInput,
+  DatePicker,
+  Input,
+  Radio,
+  RadioGroup,
+  Select,
+  SelectItem,
+  Slider,
+  Spinner,
+  Switch,
+  Textarea
+} from "@heroui/react";
+
+// src/fields/CheckboxField.tsx
+function CheckboxField(props) {
+  const {
+    checkboxProps,
+    className,
+    control,
+    description,
+    isDisabled,
+    label,
+    name,
+    rules
+  } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React2.createElement(
+    Controller,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React2.createElement("div", { className }, /* @__PURE__ */ React2.createElement(
+        Checkbox,
+        {
+          ...defaults.checkbox,
+          ...checkboxProps,
+          isDisabled,
+          isInvalid: Boolean(fieldState.error),
+          isSelected: Boolean(field.value),
+          onBlur: field.onBlur,
+          onValueChange: (val) => field.onChange(val)
+        },
+        label
+      ), description ? /* @__PURE__ */ React2.createElement("p", { className: "text-small text-default-400" }, description) : null, fieldState.error?.message ? /* @__PURE__ */ React2.createElement("p", { className: "text-tiny text-danger mt-1" }, fieldState.error.message) : null),
+      rules
+    }
+  );
+}
+
+// src/fields/DateField.tsx
+import React3 from "react";
+import { Controller as Controller2 } from "react-hook-form";
+function CoercedDateInput(props) {
+  const { dateProps, description, disabled, errorMessage, field, label } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React3.createElement(
+    DateInput,
+    {
+      ...defaults.dateInput,
+      ...dateProps,
+      description,
+      errorMessage,
+      isDisabled: disabled,
+      isInvalid: Boolean(errorMessage),
+      label,
+      value: field.value ?? null,
+      onBlur: field.onBlur,
+      onChange: field.onChange
+    }
+  );
+}
+function DateField(props) {
+  const {
+    className,
+    control,
+    dateProps,
+    description,
+    isDisabled,
+    label,
+    name,
+    rules,
+    transform
+  } = props;
+  return /* @__PURE__ */ React3.createElement(
+    Controller2,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React3.createElement("div", { className }, /* @__PURE__ */ React3.createElement(
+        CoercedDateInput,
+        {
+          dateProps,
+          description,
+          disabled: isDisabled,
+          errorMessage: fieldState.error?.message,
+          field: {
+            ...field,
+            onChange: (value) => field.onChange(transform ? transform(value) : value)
+          },
+          label
+        }
+      )),
+      rules
+    }
+  );
+}
+
+// src/fields/FileField.tsx
+import React4 from "react";
+import { Controller as Controller3 } from "react-hook-form";
+function CoercedFileInput(props) {
+  const {
+    accept,
+    description,
+    disabled,
+    errorMessage,
+    field,
+    fileProps,
+    label,
+    multiple
+  } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React4.createElement(
+    Input,
+    {
+      ...defaults.input,
+      ...fileProps,
+      accept,
+      description,
+      errorMessage,
+      isDisabled: disabled,
+      isInvalid: Boolean(errorMessage),
+      label,
+      multiple,
+      type: "file",
+      value: field.value ? "" : "",
+      onBlur: field.onBlur,
+      onChange: (e2) => {
+        const target = e2.target;
+        field.onChange(target.files);
+      }
+    }
+  );
+}
+function FileField(props) {
+  const {
+    accept,
+    className,
+    control,
+    description,
+    fileProps,
+    isDisabled,
+    label,
+    multiple = false,
+    name,
+    rules,
+    transform
+  } = props;
+  return /* @__PURE__ */ React4.createElement(
+    Controller3,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React4.createElement("div", { className }, /* @__PURE__ */ React4.createElement(
+        CoercedFileInput,
+        {
+          accept,
+          description,
+          disabled: isDisabled,
+          errorMessage: fieldState.error?.message,
+          field: {
+            ...field,
+            onChange: (value) => field.onChange(transform ? transform(value) : value)
+          },
+          fileProps,
+          label,
+          multiple
+        }
+      )),
+      rules
+    }
+  );
+}
+
+// src/fields/InputField.tsx
+import React5 from "react";
+import { Controller as Controller4 } from "react-hook-form";
+function CoercedInput(props) {
+  const { description, disabled, errorMessage, field, inputProps, label } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React5.createElement(
+    Input,
+    {
+      ...defaults.input,
+      ...inputProps,
+      description,
+      errorMessage,
+      isDisabled: disabled,
+      isInvalid: Boolean(errorMessage),
+      label,
+      value: field.value ?? "",
+      onBlur: field.onBlur,
+      onValueChange: field.onChange
+    }
+  );
+}
+function InputField(props) {
+  const {
+    className,
+    control,
+    description,
+    inputProps,
+    isDisabled,
+    label,
+    name,
+    rules,
+    transform
+  } = props;
+  return /* @__PURE__ */ React5.createElement(
+    Controller4,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React5.createElement("div", { className }, /* @__PURE__ */ React5.createElement(
+        CoercedInput,
+        {
+          description,
+          disabled: isDisabled,
+          errorMessage: fieldState.error?.message,
+          field: {
+            ...field,
+            onChange: (value) => {
+              if (inputProps?.type === "number") {
+                const numValue = value === "" ? void 0 : Number(value);
+                field.onChange(
+                  transform ? transform(String(numValue)) : numValue
+                );
+              } else {
+                field.onChange(transform ? transform(value) : value);
+              }
+            }
+          },
+          inputProps,
+          label
+        }
+      )),
+      rules
+    }
+  );
+}
+
+// src/fields/RadioGroupField.tsx
+import React6 from "react";
+import { Controller as Controller5 } from "react-hook-form";
+function RadioGroupField(props) {
+  const {
+    className,
+    control,
+    description,
+    isDisabled,
+    label,
+    name,
+    options,
+    radioGroupProps,
+    rules
+  } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React6.createElement(
+    Controller5,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React6.createElement("div", { className }, /* @__PURE__ */ React6.createElement(
+        RadioGroup,
+        {
+          ...defaults.radioGroup,
+          ...radioGroupProps,
+          description,
+          isDisabled,
+          isInvalid: Boolean(fieldState.error),
+          label,
+          value: String(field.value ?? ""),
+          onBlur: field.onBlur,
+          onValueChange: (val) => field.onChange(val)
+        },
+        options.map((opt) => /* @__PURE__ */ React6.createElement(
+          Radio,
+          {
+            key: String(opt.value),
+            isDisabled: opt.disabled,
+            value: String(opt.value)
+          },
+          opt.label
+        ))
+      ), fieldState.error?.message ? /* @__PURE__ */ React6.createElement("p", { className: "text-tiny text-danger mt-1" }, fieldState.error.message) : null),
+      rules
+    }
+  );
+}
+
+// src/fields/SelectField.tsx
+import React7 from "react";
+import { Controller as Controller6 } from "react-hook-form";
+function SelectField(props) {
+  const {
+    className,
+    control,
+    description,
+    isDisabled,
+    label,
+    name,
+    options,
+    placeholder,
+    rules,
+    selectProps
+  } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React7.createElement(
+    Controller6,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => {
+        const selectedKey = field.value;
+        return /* @__PURE__ */ React7.createElement("div", { className }, /* @__PURE__ */ React7.createElement(
+          Select,
+          {
+            ...defaults.select,
+            ...selectProps,
+            description,
+            errorMessage: fieldState.error?.message,
+            isDisabled,
+            isInvalid: Boolean(fieldState.error),
+            label,
+            placeholder,
+            selectedKeys: selectedKey != null ? /* @__PURE__ */ new Set([String(selectedKey)]) : /* @__PURE__ */ new Set(),
+            onSelectionChange: (keys) => {
+              const keyArray = Array.from(keys);
+              const next = keyArray[0] ?? "";
+              field.onChange(next);
+            }
+          },
+          options.map((opt) => /* @__PURE__ */ React7.createElement(
+            SelectItem,
+            {
+              key: String(opt.value),
+              isDisabled: opt.disabled,
+              textValue: String(opt.value)
+            },
+            opt.label
+          ))
+        ));
+      },
+      rules
+    }
+  );
+}
+
+// src/fields/SliderField.tsx
+import React8 from "react";
+import { Controller as Controller7 } from "react-hook-form";
+function CoercedSlider(props) {
+  const { description, disabled, errorMessage, field, label, sliderProps } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React8.createElement(
+    Slider,
+    {
+      ...defaults.slider,
+      ...sliderProps,
+      description,
+      errorMessage,
+      isDisabled: disabled,
+      isInvalid: Boolean(errorMessage),
+      label,
+      value: field.value ?? 0,
+      onBlur: field.onBlur,
+      onValueChange: field.onChange
+    }
+  );
+}
+function SliderField(props) {
+  const {
+    className,
+    control,
+    description,
+    isDisabled,
+    label,
+    name,
+    rules,
+    sliderProps,
+    transform
+  } = props;
+  return /* @__PURE__ */ React8.createElement(
+    Controller7,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React8.createElement("div", { className }, /* @__PURE__ */ React8.createElement(
+        CoercedSlider,
+        {
+          description,
+          disabled: isDisabled,
+          errorMessage: fieldState.error?.message,
+          field: {
+            ...field,
+            onChange: (value) => field.onChange(transform ? transform(value) : value)
+          },
+          label,
+          sliderProps
+        }
+      )),
+      rules
+    }
+  );
+}
+
+// src/fields/SwitchField.tsx
+import React9 from "react";
+import { Controller as Controller8 } from "react-hook-form";
+function SwitchField(props) {
+  const {
+    className,
+    control,
+    description,
+    isDisabled,
+    label,
+    name,
+    rules,
+    switchProps
+  } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React9.createElement(
+    Controller8,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React9.createElement("div", { className }, /* @__PURE__ */ React9.createElement(
+        Switch,
+        {
+          ...defaults.switch,
+          ...switchProps,
+          isDisabled,
+          isSelected: Boolean(field.value),
+          onBlur: field.onBlur,
+          onValueChange: (val) => field.onChange(val)
+        },
+        label
+      ), description ? /* @__PURE__ */ React9.createElement("p", { className: "text-small text-default-400" }, description) : null, fieldState.error?.message ? /* @__PURE__ */ React9.createElement("p", { className: "text-tiny text-danger mt-1" }, fieldState.error.message) : null),
+      rules
+    }
+  );
+}
+
+// src/fields/TextareaField.tsx
+import React10 from "react";
+import { Controller as Controller9 } from "react-hook-form";
+function TextareaField(props) {
+  const {
+    className,
+    control,
+    description,
+    isDisabled,
+    label,
+    name,
+    rules,
+    textareaProps
+  } = props;
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React10.createElement(
+    Controller9,
+    {
+      control,
+      name,
+      render: ({ field, fieldState }) => /* @__PURE__ */ React10.createElement("div", { className }, /* @__PURE__ */ React10.createElement(
+        Textarea,
+        {
+          ...defaults.textarea,
+          ...textareaProps,
+          description,
+          errorMessage: fieldState.error?.message,
+          isDisabled,
+          isInvalid: Boolean(fieldState.error),
+          label,
+          value: field.value ?? "",
+          onBlur: field.onBlur,
+          onValueChange: field.onChange
+        }
+      )),
+      rules
+    }
+  );
+}
+
+// src/components/FormField.tsx
+function FormField({
+  config,
+  form,
+  submissionState
+}) {
+  const { control } = form;
+  const baseProps = {
+    className: config.className,
+    description: config.description,
+    isDisabled: config.isDisabled ?? submissionState.isSubmitting,
+    label: config.label,
+    name: config.name,
+    rules: config.rules
+  };
+  switch (config.type) {
+    case "input":
+      return /* @__PURE__ */ React11.createElement(
+        InputField,
+        {
+          ...baseProps,
+          control,
+          defaultValue: config.defaultValue,
+          inputProps: config.inputProps
+        }
+      );
+    case "textarea":
+      return /* @__PURE__ */ React11.createElement(
+        TextareaField,
+        {
+          ...baseProps,
+          control,
+          defaultValue: config.defaultValue,
+          textareaProps: config.textareaProps
+        }
+      );
+    case "select":
+      return /* @__PURE__ */ React11.createElement(
+        SelectField,
+        {
+          ...baseProps,
+          control,
+          defaultValue: config.defaultValue,
+          options: (config.options ?? []).map((opt) => ({
+            label: opt.label,
+            value: String(opt.value)
+          })),
+          selectProps: config.selectProps
+        }
+      );
+    case "checkbox":
+      return /* @__PURE__ */ React11.createElement(
+        CheckboxField,
+        {
+          ...baseProps,
+          checkboxProps: config.checkboxProps,
+          control,
+          defaultValue: config.defaultValue
+        }
+      );
+    case "radio":
+      return /* @__PURE__ */ React11.createElement(
+        RadioGroupField,
+        {
+          ...baseProps,
+          control,
+          defaultValue: config.defaultValue,
+          options: (config.radioOptions ?? []).map((opt) => ({
+            label: opt.label,
+            value: String(opt.value)
+          })),
+          radioGroupProps: config.radioProps
+        }
+      );
+    case "switch":
+      return /* @__PURE__ */ React11.createElement(
+        SwitchField,
+        {
+          ...baseProps,
+          control,
+          defaultValue: config.defaultValue,
+          switchProps: config.switchProps
+        }
+      );
+    case "slider":
+      return /* @__PURE__ */ React11.createElement(
+        SliderField,
+        {
+          ...baseProps,
+          control,
+          defaultValue: config.defaultValue,
+          sliderProps: config.sliderProps
+        }
+      );
+    case "date":
+      return /* @__PURE__ */ React11.createElement(
+        DateField,
+        {
+          ...baseProps,
+          control,
+          dateProps: config.dateProps,
+          defaultValue: config.defaultValue
+        }
+      );
+    case "file":
+      return /* @__PURE__ */ React11.createElement(
+        FileField,
+        {
+          ...baseProps,
+          accept: config.accept,
+          control,
+          defaultValue: config.defaultValue,
+          fileProps: config.fileProps,
+          multiple: config.multiple
+        }
+      );
+    default: {
+      const fieldType = config.type;
+      console.warn(`Unknown field type: ${fieldType}`);
+      return null;
+    }
+  }
+}
+
+// src/components/Form.tsx
+function ConfigurableForm({
+  className,
+  columns = 1,
+  defaultValues,
+  fields,
+  layout = "vertical",
+  onError,
+  onSubmit,
+  onSuccess,
+  resetButtonText = "Reset",
+  showResetButton = false,
+  spacing = "4",
+  submitButtonProps = {},
+  submitButtonText = "Submit",
+  subtitle,
+  title
+}) {
+  const {
+    error,
+    form,
+    handleSubmit,
+    isSubmitted,
+    isSubmitting,
+    isSuccess,
+    resetForm,
+    submissionState
+  } = useFormHelper({
+    defaultValues,
+    onError,
+    onSubmit,
+    onSuccess
+  });
+  const renderFields = () => {
+    if (layout === "grid") {
+      return /* @__PURE__ */ React12.createElement(
+        "div",
+        {
+          className: `grid gap-${spacing} ${columns === 1 ? "grid-cols-1" : columns === 2 ? "grid-cols-1 md:grid-cols-2" : "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"}`
+        },
+        fields.map((field) => /* @__PURE__ */ React12.createElement(
+          FormField,
+          {
+            key: field.name,
+            config: field,
+            form,
+            submissionState
+          }
+        ))
+      );
+    }
+    if (layout === "horizontal") {
+      return /* @__PURE__ */ React12.createElement("div", { className: `grid gap-${spacing} grid-cols-1 md:grid-cols-2` }, fields.map((field) => /* @__PURE__ */ React12.createElement(
+        FormField,
+        {
+          key: field.name,
+          config: field,
+          form,
+          submissionState
+        }
+      )));
+    }
+    return /* @__PURE__ */ React12.createElement("div", { className: `space-y-${spacing}` }, fields.map((field) => /* @__PURE__ */ React12.createElement(
+      FormField,
+      {
+        key: field.name,
+        config: field,
+        form,
+        submissionState
+      }
+    )));
+  };
+  const handleFormSubmit = (e2) => {
+    e2.preventDefault();
+    void handleSubmit();
+  };
+  return /* @__PURE__ */ React12.createElement("form", { className, role: "form", onSubmit: handleFormSubmit }, title && /* @__PURE__ */ React12.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React12.createElement("h2", { className: "text-xl font-semibold text-foreground mb-2" }, title), subtitle && /* @__PURE__ */ React12.createElement("p", { className: "text-sm text-muted-foreground" }, subtitle)), isSubmitted && isSuccess && /* @__PURE__ */ React12.createElement(
+    "div",
+    {
+      className: "mb-6 p-4 bg-success-50 border border-success-200 rounded-lg",
+      "data-testid": "success-message"
+    },
+    /* @__PURE__ */ React12.createElement("p", { className: "text-success-800 font-medium" }, "Success!"),
+    /* @__PURE__ */ React12.createElement("p", { className: "text-success-700 text-sm mt-1" }, "Your request has been processed successfully.")
+  ), error && /* @__PURE__ */ React12.createElement(
+    "div",
+    {
+      className: "mb-6 p-4 bg-danger-50 border border-danger-200 rounded-lg",
+      "data-testid": "error-message"
+    },
+    /* @__PURE__ */ React12.createElement("p", { className: "text-danger-800 font-medium" }, "Error"),
+    /* @__PURE__ */ React12.createElement("p", { className: "text-danger-700 text-sm mt-1" }, error)
+  ), renderFields(), /* @__PURE__ */ React12.createElement("div", { className: "mt-6 flex gap-3 justify-end" }, /* @__PURE__ */ React12.createElement(
+    Button2,
+    {
+      color: "primary",
+      isDisabled: isSubmitting,
+      isLoading: isSubmitting,
+      type: "submit",
+      ...submitButtonProps
+    },
+    submitButtonText
+  ), showResetButton && /* @__PURE__ */ React12.createElement(
+    Button2,
+    {
+      isDisabled: isSubmitting,
+      type: "button",
+      variant: "bordered",
+      onPress: resetForm
+    },
+    resetButtonText
+  )));
+}
+
+// src/providers/FormProvider.tsx
+import React13 from "react";
+import { FormProvider as RHFProvider } from "react-hook-form";
+function FormProvider(props) {
+  return /* @__PURE__ */ React13.createElement(RHFProvider, { ...props.methods }, /* @__PURE__ */ React13.createElement(
+    "form",
+    {
+      className: props.className,
+      id: props.id,
+      noValidate: props.noValidate,
+      onSubmit: (event) => void props.methods.handleSubmit(props.onSubmit)(event)
+    },
+    props.children
+  ));
+}
+
+// src/submit/SubmitButton.tsx
+import React14 from "react";
+import { useFormContext } from "react-hook-form";
+function SubmitButton(props) {
+  const ctx = useFormContext();
+  const loading = props.isLoading ?? ctx.formState.isSubmitting;
+  const isDisabledFromProps = props.buttonProps?.isDisabled ?? false;
+  const isDisabled = Boolean(isDisabledFromProps) || Boolean(loading);
+  const defaults = useHeroHookFormDefaults();
+  return /* @__PURE__ */ React14.createElement(
+    Button,
+    {
+      type: "submit",
+      ...defaults.submitButton,
+      ...props.buttonProps,
+      isDisabled
+    },
+    loading ? /* @__PURE__ */ React14.createElement("span", { className: "inline-flex items-center gap-2" }, /* @__PURE__ */ React14.createElement(Spinner, { size: "sm" }), "Submitting\u2026") : props.children
+  );
+}
+
+// src/utils/applyServerErrors.ts
+function applyServerErrors(setError, serverError) {
+  if (!serverError.fieldErrors?.length) return;
+  for (const err of serverError.fieldErrors) {
+    setError(err.path, { message: err.message, type: err.type });
+  }
+}
+
+// src/components/ZodForm.tsx
+import React15 from "react";
+import { Button as Button3 } from "@heroui/react";
+
+// node_modules/@hookform/resolvers/dist/resolvers.mjs
+import { get as e, set as t } from "react-hook-form";
+var r = (t3, r2, o3) => {
+  if (t3 && "reportValidity" in t3) {
+    const s3 = e(o3, r2);
+    t3.setCustomValidity(s3 && s3.message || ""), t3.reportValidity();
+  }
+};
+var o = (e2, t3) => {
+  for (const o3 in t3.fields) {
+    const s3 = t3.fields[o3];
+    s3 && s3.ref && "reportValidity" in s3.ref ? r(s3.ref, o3, e2) : s3 && s3.refs && s3.refs.forEach((t4) => r(t4, o3, e2));
+  }
+};
+var s = (r2, s3) => {
+  s3.shouldUseNativeValidation && o(r2, s3);
+  const n3 = {};
+  for (const o3 in r2) {
+    const f = e(s3.fields, o3), c = Object.assign(r2[o3] || {}, { ref: f && f.ref });
+    if (i(s3.names || Object.keys(r2), o3)) {
+      const r3 = Object.assign({}, e(n3, o3));
+      t(r3, "root", c), t(n3, o3, r3);
+    } else t(n3, o3, c);
+  }
+  return n3;
+};
+var i = (e2, t3) => {
+  const r2 = n(t3);
+  return e2.some((e3) => n(e3).match(`^${r2}\\.\\d+`));
+};
+function n(e2) {
+  return e2.replace(/\]|\[/g, "");
+}
+
+// node_modules/@hookform/resolvers/zod/dist/zod.mjs
+import { appendErrors as o2 } from "react-hook-form";
+import * as n2 from "zod/v4/core";
+function t2(r2, e2) {
+  try {
+    var o3 = r2();
+  } catch (r3) {
+    return e2(r3);
+  }
+  return o3 && o3.then ? o3.then(void 0, e2) : o3;
+}
+function s2(r2, e2) {
+  for (var n3 = {}; r2.length; ) {
+    var t3 = r2[0], s3 = t3.code, i3 = t3.message, a2 = t3.path.join(".");
+    if (!n3[a2]) if ("unionErrors" in t3) {
+      var u = t3.unionErrors[0].errors[0];
+      n3[a2] = { message: u.message, type: u.code };
+    } else n3[a2] = { message: i3, type: s3 };
+    if ("unionErrors" in t3 && t3.unionErrors.forEach(function(e3) {
+      return e3.errors.forEach(function(e4) {
+        return r2.push(e4);
+      });
+    }), e2) {
+      var c = n3[a2].types, f = c && c[t3.code];
+      n3[a2] = o2(a2, e2, n3, s3, f ? [].concat(f, t3.message) : t3.message);
+    }
+    r2.shift();
+  }
+  return n3;
+}
+function i2(r2, e2) {
+  for (var n3 = {}; r2.length; ) {
+    var t3 = r2[0], s3 = t3.code, i3 = t3.message, a2 = t3.path.join(".");
+    if (!n3[a2]) if ("invalid_union" === t3.code && t3.errors.length > 0) {
+      var u = t3.errors[0][0];
+      n3[a2] = { message: u.message, type: u.code };
+    } else n3[a2] = { message: i3, type: s3 };
+    if ("invalid_union" === t3.code && t3.errors.forEach(function(e3) {
+      return e3.forEach(function(e4) {
+        return r2.push(e4);
+      });
+    }), e2) {
+      var c = n3[a2].types, f = c && c[t3.code];
+      n3[a2] = o2(a2, e2, n3, s3, f ? [].concat(f, t3.message) : t3.message);
+    }
+    r2.shift();
+  }
+  return n3;
+}
+function a(o3, a2, u) {
+  if (void 0 === u && (u = {}), (function(r2) {
+    return "_def" in r2 && "object" == typeof r2._def && "typeName" in r2._def;
+  })(o3)) return function(n3, i3, c) {
+    try {
+      return Promise.resolve(t2(function() {
+        return Promise.resolve(o3["sync" === u.mode ? "parse" : "parseAsync"](n3, a2)).then(function(e2) {
+          return c.shouldUseNativeValidation && o({}, c), { errors: {}, values: u.raw ? Object.assign({}, n3) : e2 };
+        });
+      }, function(r2) {
+        if ((function(r3) {
+          return Array.isArray(null == r3 ? void 0 : r3.issues);
+        })(r2)) return { values: {}, errors: s(s2(r2.errors, !c.shouldUseNativeValidation && "all" === c.criteriaMode), c) };
+        throw r2;
+      }));
+    } catch (r2) {
+      return Promise.reject(r2);
+    }
+  };
+  if ((function(r2) {
+    return "_zod" in r2 && "object" == typeof r2._zod;
+  })(o3)) return function(s3, c, f) {
+    try {
+      return Promise.resolve(t2(function() {
+        return Promise.resolve(("sync" === u.mode ? n2.parse : n2.parseAsync)(o3, s3, a2)).then(function(e2) {
+          return f.shouldUseNativeValidation && o({}, f), { errors: {}, values: u.raw ? Object.assign({}, s3) : e2 };
+        });
+      }, function(r2) {
+        if ((function(r3) {
+          return r3 instanceof n2.$ZodError;
+        })(r2)) return { values: {}, errors: s(i2(r2.issues, !f.shouldUseNativeValidation && "all" === f.criteriaMode), f) };
+        throw r2;
+      }));
+    } catch (r2) {
+      return Promise.reject(r2);
+    }
+  };
+  throw new Error("Invalid input: not a Zod schema");
+}
+
+// src/zod-integration.ts
+import { useForm as useForm2 } from "react-hook-form";
+function useZodForm(config) {
+  if (!config.resolver && config.schema) {
+    const resolver = a(config.schema);
+    config.resolver = resolver;
+  }
+  const formConfig = {
+    ...config
+  };
+  return useForm2(formConfig);
+}
+
+// src/components/ZodForm.tsx
+function ZodForm({
+  className,
+  columns = 1,
+  config,
+  layout = "vertical",
+  onError,
+  onSubmit,
+  onSuccess,
+  resetButtonText = "Reset",
+  showResetButton = false,
+  spacing = "4",
+  submitButtonProps = {},
+  submitButtonText = "Submit",
+  subtitle,
+  title
+}) {
+  const form = useZodForm(config);
+  const [submissionState, setSubmissionState] = React15.useState({
+    error: void 0,
+    isSubmitted: false,
+    isSubmitting: false,
+    isSuccess: false
+  });
+  const handleSubmit = async () => {
+    setSubmissionState((prev) => ({
+      ...prev,
+      error: void 0,
+      isSubmitting: true
+    }));
+    const isValid = await form.trigger();
+    if (!isValid) {
+      setSubmissionState({
+        error: "Please fix the validation errors above",
+        isSubmitted: true,
+        isSubmitting: false,
+        isSuccess: false
+      });
+      return;
+    }
+    try {
+      await form.handleSubmit(async (formData) => {
+        await onSubmit(formData);
+      })();
+      setSubmissionState({
+        error: void 0,
+        isSubmitted: true,
+        isSubmitting: false,
+        isSuccess: true
+      });
+      onSuccess?.(form.getValues());
+    } catch (error) {
+      const errorMessage = error instanceof Error ? error.message : "An error occurred";
+      setSubmissionState({
+        error: errorMessage,
+        isSubmitted: true,
+        isSubmitting: false,
+        isSuccess: false
+      });
+      onError?.({
+        message: errorMessage
+      });
+    }
+  };
+  const resetForm = () => {
+    form.reset();
+    setSubmissionState({
+      error: void 0,
+      isSubmitted: false,
+      isSubmitting: false,
+      isSuccess: false
+    });
+  };
+  const renderFields = () => {
+    if (layout === "grid") {
+      return /* @__PURE__ */ React15.createElement(
+        "div",
+        {
+          className: `grid gap-${spacing} ${columns === 1 ? "grid-cols-1" : columns === 2 ? "grid-cols-1 md:grid-cols-2" : "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"}`
+        },
+        config.fields.map((field) => /* @__PURE__ */ React15.createElement(
+          FormField,
+          {
+            key: field.name,
+            config: field,
+            form,
+            submissionState
+          }
+        ))
+      );
+    }
+    if (layout === "horizontal") {
+      return /* @__PURE__ */ React15.createElement("div", { className: `grid gap-${spacing} grid-cols-1 md:grid-cols-2` }, config.fields.map((field) => /* @__PURE__ */ React15.createElement(
+        FormField,
+        {
+          key: field.name,
+          config: field,
+          form,
+          submissionState
+        }
+      )));
+    }
+    return /* @__PURE__ */ React15.createElement("div", { className: `space-y-${spacing}` }, config.fields.map((field) => /* @__PURE__ */ React15.createElement(
+      FormField,
+      {
+        key: field.name,
+        config: field,
+        form,
+        submissionState
+      }
+    )));
+  };
+  const handleFormSubmit = (e2) => {
+    e2.preventDefault();
+    void handleSubmit();
+  };
+  return /* @__PURE__ */ React15.createElement("form", { className, role: "form", onSubmit: handleFormSubmit }, title && /* @__PURE__ */ React15.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React15.createElement("h2", { className: "text-xl font-semibold text-foreground mb-2" }, title), subtitle && /* @__PURE__ */ React15.createElement("p", { className: "text-sm text-muted-foreground" }, subtitle)), submissionState.isSubmitted && submissionState.isSuccess && /* @__PURE__ */ React15.createElement(
+    "div",
+    {
+      className: "mb-6 p-4 bg-success-50 border border-success-200 rounded-lg",
+      "data-testid": "success-message"
+    },
+    /* @__PURE__ */ React15.createElement("p", { className: "text-success-800 font-medium" }, "Success!"),
+    /* @__PURE__ */ React15.createElement("p", { className: "text-success-700 text-sm mt-1" }, "Your request has been processed successfully.")
+  ), submissionState.error && /* @__PURE__ */ React15.createElement(
+    "div",
+    {
+      className: "mb-6 p-4 bg-danger-50 border border-danger-200 rounded-lg",
+      "data-testid": "error-message"
+    },
+    /* @__PURE__ */ React15.createElement("p", { className: "text-danger-800 font-medium" }, "Error"),
+    /* @__PURE__ */ React15.createElement("p", { className: "text-danger-700 text-sm mt-1" }, submissionState.error)
+  ), renderFields(), /* @__PURE__ */ React15.createElement("div", { className: "mt-6 flex gap-3 justify-end" }, /* @__PURE__ */ React15.createElement(
+    Button3,
+    {
+      color: "primary",
+      isDisabled: submissionState.isSubmitting,
+      isLoading: submissionState.isSubmitting,
+      type: "submit",
+      ...submitButtonProps
+    },
+    submitButtonText
+  ), showResetButton && /* @__PURE__ */ React15.createElement(
+    Button3,
+    {
+      isDisabled: submissionState.isSubmitting,
+      type: "button",
+      variant: "bordered",
+      onPress: resetForm
+    },
+    resetButtonText
+  )));
+}
+export {
+  CheckboxField,
+  ConfigurableForm,
+  DateField,
+  FileField,
+  FormField,
+  FormProvider,
+  HeroHookFormProvider,
+  InputField,
+  RadioGroupField,
+  SelectField,
+  SliderField,
+  SubmitButton,
+  SwitchField,
+  TextareaField,
+  ZodForm,
+  applyServerErrors,
+  useFormHelper,
+  useHeroHookFormDefaults,
+  useZodForm
+};