@arturton/react-form-constructor 0.1.2 → 0.1.5

package/dist/index.js

@@ -1,7 +1,9 @@
 "use strict";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -15,18 +17,42 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  FormButton: () => FormButton_default,
+  FormCheckbox: () => FormCheckbox_default,
+  FormDate: () => FormDate_default,
+  FormError: () => FormError_default,
+  FormFileInput: () => FormFileInput_default,
+  FormInput: () => FormInput_default,
+  FormInputLayout: () => FormInputLayout_default,
+  FormLabel: () => FormLabel_default,
   FormLayout: () => FormLayout,
+  FormMaskedInput: () => FormMaskedInput_default,
+  FormNumber: () => FormNumber_default,
+  FormPasswordInput: () => FormPasswordInput_default,
+  FormProvider: () => FormProvider,
+  FormRadio: () => FormRadio_default,
+  FormRange: () => FormRange_default,
+  FormSelect: () => FormSelect_default,
+  FormTextarea: () => FormTextarea_default,
   InputForm: () => InputForm_default,
   useFormContext: () => useFormContext
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/FormLayout.tsx
+// src/JsonMethod/FormLayout.tsx
 var import_react_hook_form2 = require("react-hook-form");
 
 // src/InputForm/layouts/mainLayout.tsx
@@ -41,7 +67,7 @@ function MainLayout({
   errorClass
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: labelClass, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { className: labelClass, children: [
       label,
       " ",
       required ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "*" }) : null
@@ -162,26 +188,14 @@ function InputForm({
 }
 var InputForm_default = InputForm;
 
-// src/FormContext.tsx
-var import_react = require("react");
-var FormContext = (0, import_react.createContext)(null);
-var FormProvider = FormContext.Provider;
-function useFormContext() {
-  const context = (0, import_react.useContext)(FormContext);
-  if (!context) {
-    throw new Error("useFormContext must be used within FormLayout");
-  }
-  return context;
-}
-
-// src/FormLayout.tsx
+// src/JsonMethod/FormLayout.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function FormLayout({
   formData,
   funSubmit,
   formClass,
   buttonClass,
-  children
+  buttonName
 }) {
   const {
     control,
@@ -192,8 +206,8 @@ function FormLayout({
   const onSubmit = (data) => {
     funSubmit(data);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(FormProvider, { value: { control, register, errors }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("form", { onSubmit: handleSubmit(onSubmit), className: formClass, children: [
-    formData ? formData.map((item) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("form", { onSubmit: handleSubmit(onSubmit), className: formClass, children: [
+    formData.map((item) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       InputForm_default,
       {
         type: item.type,
@@ -216,13 +230,669 @@ function FormLayout({
         labelClass: item.labelClass
       },
       String(item.key)
-    )) : children,
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { type: "submit", className: buttonClass, children: "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C" })
-  ] }) });
+    )),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { type: "submit", className: buttonClass, children: buttonName || "Submit" })
+  ] });
+}
+
+// src/ProviderMethod/layouts/FormProvider.tsx
+var import_react_hook_form3 = require("react-hook-form");
+
+// src/ProviderMethod/context/FormContext.tsx
+var import_react = __toESM(require("react"));
+var FormContext = import_react.default.createContext(void 0);
+function useFormContext() {
+  const context = import_react.default.useContext(FormContext);
+  if (!context) {
+    throw new Error("useFormContext \u0434\u043E\u043B\u0436\u0435\u043D \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C\u0441\u044F \u0432\u043D\u0443\u0442\u0440\u0438 FormProvider");
+  }
+  return context;
+}
+
+// src/ProviderMethod/layouts/FormProvider.tsx
+var import_react2 = require("react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function FormProvider({
+  setFormApi,
+  children,
+  funSubmit,
+  className
+}) {
+  const {
+    control,
+    register,
+    handleSubmit,
+    formState: { errors }
+  } = (0, import_react_hook_form3.useForm)();
+  const onSubmit = (data) => {
+    funSubmit(data);
+  };
+  const values = (0, import_react_hook_form3.useWatch)({ control });
+  const contextValue = {
+    register,
+    errors,
+    control,
+    values
+  };
+  (0, import_react2.useEffect)(() => {
+    setFormApi && setFormApi({ control, register, errors, values });
+  }, [setFormApi, control, register, errors, values]);
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FormContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("form", { onSubmit: handleSubmit(onSubmit), className, children }) });
+}
+
+// src/ProviderMethod/layouts/FormInputLayout.tsx
+var import_react3 = __toESM(require("react"));
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var FormInputLayoutContext = import_react3.default.createContext(void 0);
+function useInputLayoutContext() {
+  const context = import_react3.default.useContext(FormInputLayoutContext);
+  if (!context) {
+    throw new Error(
+      "useInputLayoutContext \u0434\u043E\u043B\u0436\u0435\u043D \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u044C\u0441\u044F \u0432\u043D\u0443\u0442\u0440\u0438 FormInputLayout"
+    );
+  }
+  return context;
+}
+function useOptionalInputLayoutContext() {
+  return import_react3.default.useContext(FormInputLayoutContext);
+}
+function FormInputLayout({
+  name,
+  minLength,
+  maxLength,
+  pattern,
+  required,
+  validate,
+  children,
+  className,
+  maska
+}) {
+  const contextValue = {
+    name,
+    minLength,
+    maxLength,
+    pattern,
+    required,
+    validate,
+    maska
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FormInputLayoutContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className, children }) });
+}
+var FormInputLayout_default = FormInputLayout;
+
+// src/ProviderMethod/components/FormInput.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function FormInput({
+  placeholder,
+  className,
+  classNameError,
+  type
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, minLength, maxLength, pattern, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    "input",
+    {
+      id: name,
+      ...register(name, {
+        required,
+        minLength,
+        maxLength,
+        pattern,
+        validate
+      }),
+      type: type ? type : "text",
+      placeholder: placeholder ? placeholder : "",
+      className: `${className} ${isErrorMessage ? classNameError : ""}`
+    }
+  );
+}
+var FormInput_default = FormInput;
+
+// src/ProviderMethod/components/FormPasswordInput.tsx
+var import_react4 = require("react");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var EyeIcon = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  "svg",
+  {
+    width: "20",
+    height: "20",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("circle", { cx: "12", cy: "12", r: "3" })
+    ]
+  }
+);
+var EyeOffIcon = ({ className }) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  "svg",
+  {
+    width: "20",
+    height: "20",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className,
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
+    ]
+  }
+);
+function FormPasswordInput({
+  placeholder,
+  className,
+  inputClassName,
+  classNameError,
+  visibleIcon = /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(EyeIcon, {}),
+  hiddenIcon = /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(EyeOffIcon, {}),
+  iconClassName,
+  iconWrapperClassName = "cursor-pointer"
+}) {
+  const [isVisible, setIsVisible] = (0, import_react4.useState)(false);
+  const { register, errors } = useFormContext();
+  const { name, required, minLength, maxLength, pattern, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  const toggleVisibility = () => {
+    setIsVisible(!isVisible);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    "div",
+    {
+      className,
+      style: { display: "flex", alignItems: "center", gap: "8px" },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          "input",
+          {
+            id: name,
+            ...register(name, {
+              required,
+              minLength,
+              maxLength,
+              pattern,
+              validate
+            }),
+            type: isVisible ? "text" : "password",
+            placeholder: placeholder ? placeholder : "",
+            className: `${inputClassName} ${isErrorMessage ? classNameError : ""}`,
+            style: { flex: 1 }
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          "div",
+          {
+            onClick: toggleVisibility,
+            className: `${iconClassName ? iconClassName : iconWrapperClassName}`,
+            style: {
+              cursor: "pointer",
+              userSelect: "none",
+              display: "flex",
+              alignItems: "center"
+            },
+            title: isVisible ? "\u0421\u043A\u0440\u044B\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C" : "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C",
+            children: isVisible ? visibleIcon : hiddenIcon
+          }
+        )
+      ]
+    }
+  );
+}
+var FormPasswordInput_default = FormPasswordInput;
+
+// src/ProviderMethod/components/FormTextarea.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+function FormTextarea({
+  placeholder,
+  className,
+  classNameError,
+  rows,
+  cols
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, minLength, maxLength, pattern, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    "textarea",
+    {
+      id: name,
+      ...register(name, {
+        required,
+        minLength,
+        maxLength,
+        pattern,
+        validate
+      }),
+      placeholder: placeholder ? placeholder : "",
+      className: `${className} ${isErrorMessage ? classNameError : ""}`,
+      rows,
+      cols
+    }
+  );
+}
+var FormTextarea_default = FormTextarea;
+
+// src/ProviderMethod/components/FormMaskedInput.tsx
+var import_react_hook_form4 = require("react-hook-form");
+var import_react_number_format2 = require("react-number-format");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function FormMaskedInput({
+  placeholder,
+  className,
+  classNameError
+}) {
+  const { control, errors } = useFormContext();
+  const { name, required, minLength, maxLength, pattern, validate, maska } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  if (!maska) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    import_react_hook_form4.Controller,
+    {
+      name: name || "",
+      control,
+      rules: {
+        required: maska.required ?? required,
+        minLength,
+        maxLength,
+        pattern,
+        validate
+      },
+      render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        import_react_number_format2.PatternFormat,
+        {
+          ...field,
+          format: maska.format,
+          mask: maska.mask,
+          placeholder: placeholder ? placeholder : "",
+          className: `${className} ${isErrorMessage ? classNameError : ""}`
+        }
+      )
+    }
+  );
+}
+var FormMaskedInput_default = FormMaskedInput;
+
+// src/ProviderMethod/components/FormSelect.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function FormSelect({
+  options,
+  className,
+  classNameError,
+  multiple,
+  placeholder
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+    "select",
+    {
+      id: name,
+      ...register(name, {
+        required,
+        validate
+      }),
+      className: `${className} ${isErrorMessage ? classNameError : ""}`,
+      multiple,
+      children: [
+        placeholder && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: "", children: placeholder }),
+        options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: option.value, children: option.label }, option.value))
+      ]
+    }
+  );
+}
+var FormSelect_default = FormSelect;
+
+// src/ProviderMethod/components/FormNumber.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function FormNumber({
+  placeholder,
+  className,
+  classNameError,
+  min,
+  max,
+  step
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    "input",
+    {
+      id: name,
+      type: "number",
+      ...register(name, {
+        required,
+        validate,
+        valueAsNumber: true
+      }),
+      placeholder: placeholder ? placeholder : "",
+      className: `${className} ${isErrorMessage ? classNameError : ""}`,
+      min,
+      max,
+      step
+    }
+  );
+}
+var FormNumber_default = FormNumber;
+
+// src/ProviderMethod/components/FormDate.tsx
+var import_jsx_runtime14 = require("react/jsx-runtime");
+function FormDate({
+  placeholder,
+  className,
+  classNameError,
+  min,
+  max,
+  type = "date"
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    "input",
+    {
+      id: name,
+      type,
+      ...register(name, {
+        required,
+        validate
+      }),
+      placeholder: placeholder ? placeholder : "",
+      className: `${className} ${isErrorMessage ? classNameError : ""}`,
+      min,
+      max
+    }
+  );
+}
+var FormDate_default = FormDate;
+
+// src/ProviderMethod/components/FormRange.tsx
+var import_react5 = require("react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+function FormRange({
+  className,
+  classNameError,
+  min = 0,
+  max = 100,
+  step = 1,
+  range = "single",
+  showValue,
+  containerClassName
+}) {
+  const { register, control, errors } = useFormContext();
+  const { name, required, validate } = useInputLayoutContext();
+  const [value, setValue] = (0, import_react5.useState)(min);
+  const [maxValue, setMaxValue] = (0, import_react5.useState)(max);
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: containerClassName, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+    "div",
+    {
+      style: {
+        display: "flex",
+        gap: "16px",
+        alignItems: "flex-start",
+        flexWrap: "wrap"
+      },
+      children: [
+        range === "single" && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { style: { flex: 1, minWidth: "200px" }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            "input",
+            {
+              id: name,
+              type: "range",
+              ...register(name, {
+                required,
+                validate
+              }),
+              className: `${className} w-full ${isErrorMessage ? classNameError : ""}`,
+              min,
+              max,
+              step,
+              onChange: (e) => setValue(Number(e.target.value)),
+              style: { cursor: "pointer" }
+            }
+          ),
+          showValue && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { marginTop: "8px", fontSize: "14px" }, children: value })
+        ] }),
+        range === "double" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { flex: 1, minWidth: "200px" }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              gap: "12px"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("label", { style: { fontSize: "12px", marginRight: "8px" }, children: "\u041E\u0442:" }),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                  "input",
+                  {
+                    type: "range",
+                    ...register(`${name}_min`, {
+                      required,
+                      validate
+                    }),
+                    className: `${className} w-full ${isErrorMessage ? classNameError : ""}`,
+                    min,
+                    max: maxValue,
+                    step,
+                    onChange: (e) => setValue(Number(e.target.value)),
+                    style: { cursor: "pointer" }
+                  }
+                ),
+                showValue && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { marginTop: "4px", fontSize: "12px" }, children: value })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("label", { style: { fontSize: "12px", marginRight: "8px" }, children: "\u0414\u043E:" }),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                  "input",
+                  {
+                    type: "range",
+                    ...register(`${name}_max`, {
+                      required,
+                      validate
+                    }),
+                    className: `${className} w-full ${isErrorMessage ? classNameError : ""}`,
+                    min: value,
+                    max,
+                    step,
+                    onChange: (e) => setMaxValue(Number(e.target.value)),
+                    style: { cursor: "pointer" }
+                  }
+                ),
+                showValue && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { marginTop: "4px", fontSize: "12px" }, children: maxValue })
+              ] }),
+              showValue && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { style: { fontSize: "14px", fontWeight: "bold" }, children: [
+                "\u0414\u0438\u0430\u043F\u0430\u0437\u043E\u043D: ",
+                value,
+                " - ",
+                maxValue
+              ] })
+            ]
+          }
+        ) })
+      ]
+    }
+  ) });
+}
+var FormRange_default = FormRange;
+
+// src/ProviderMethod/components/FormFileInput.tsx
+var import_jsx_runtime16 = require("react/jsx-runtime");
+function FormFileInput({
+  className,
+  classNameError,
+  accept,
+  multiple
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "input",
+    {
+      id: name,
+      type: "file",
+      ...register(name, {
+        required,
+        validate
+      }),
+      className: `${className} ${isErrorMessage ? classNameError : ""}`,
+      accept,
+      multiple
+    }
+  );
+}
+var FormFileInput_default = FormFileInput;
+
+// src/ProviderMethod/components/FormCheckbox.tsx
+var import_jsx_runtime17 = require("react/jsx-runtime");
+function FormCheckbox({
+  className,
+  classNameError,
+  value,
+  defaultChecked,
+  disabled
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    "input",
+    {
+      id: name,
+      type: "checkbox",
+      ...register(name, {
+        required,
+        validate
+      }),
+      className: `${className} ${isErrorMessage ? classNameError : ""}`,
+      value,
+      defaultChecked,
+      disabled
+    }
+  );
+}
+var FormCheckbox_default = FormCheckbox;
+
+// src/ProviderMethod/components/FormRadio.tsx
+var import_jsx_runtime18 = require("react/jsx-runtime");
+function FormRadio({
+  className,
+  classNameError,
+  value,
+  defaultChecked,
+  disabled
+}) {
+  const { register, errors } = useFormContext();
+  const { name, required, validate } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    "input",
+    {
+      id: `${name}-${value}`,
+      type: "radio",
+      ...register(name, {
+        required,
+        validate
+      }),
+      className: `${className} ${isErrorMessage ? classNameError : ""}`,
+      value,
+      defaultChecked,
+      disabled
+    }
+  );
+}
+var FormRadio_default = FormRadio;
+
+// src/ProviderMethod/components/FormButton.tsx
+var import_jsx_runtime19 = require("react/jsx-runtime");
+function FormButton({
+  children,
+  className,
+  disabledError,
+  ...props
+}) {
+  const { errors } = useFormContext();
+  const errorMessage = errors && Object.keys(errors).length > 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    "button",
+    {
+      type: "submit",
+      className: `${className}`,
+      ...props,
+      disabled: errorMessage && disabledError,
+      children
+    }
+  );
+}
+var FormButton_default = FormButton;
+
+// src/ProviderMethod/components/FormError.tsx
+var import_jsx_runtime20 = require("react/jsx-runtime");
+function FormError({ ...props }) {
+  const { errors } = useFormContext();
+  const { name } = useInputLayoutContext();
+  const layout = useOptionalInputLayoutContext();
+  const resolvedName = name ?? layout?.name;
+  if (!resolvedName) {
+    return null;
+  }
+  const errorMessage = errors[resolvedName]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { ...props, children: typeof errorMessage === "string" ? errorMessage : null });
+}
+var FormError_default = FormError;
+
+// src/ProviderMethod/components/FormLabel.tsx
+var import_jsx_runtime21 = require("react/jsx-runtime");
+function FormLabel({
+  children,
+  className,
+  classNameError
+}) {
+  const { required } = useInputLayoutContext();
+  const { errors } = useFormContext();
+  const { name } = useInputLayoutContext();
+  const isErrorMessage = !!errors[name]?.message;
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("label", { className: `${className} ${isErrorMessage ? classNameError : ""}`, children: [
+    children,
+    !!required && "*"
+  ] });
 }
+var FormLabel_default = FormLabel;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  FormButton,
+  FormCheckbox,
+  FormDate,
+  FormError,
+  FormFileInput,
+  FormInput,
+  FormInputLayout,
+  FormLabel,
   FormLayout,
+  FormMaskedInput,
+  FormNumber,
+  FormPasswordInput,
+  FormProvider,
+  FormRadio,
+  FormRange,
+  FormSelect,
+  FormTextarea,
   InputForm,
   useFormContext
 });