@availity/mui-controlled-form 0.2.6 → 0.3.0

package/dist/index.mjs

@@ -46,6 +46,7 @@ var ControlledAsyncAutocomplete = (_a) => {
     onChange,
     pattern,
     required,
+    rules = {},
     shouldUnregister,
     validate,
     value,
@@ -61,6 +62,7 @@ var ControlledAsyncAutocomplete = (_a) => {
     "onChange",
     "pattern",
     "required",
+    "rules",
     "shouldUnregister",
     "validate",
     "value",
@@ -71,7 +73,7 @@ var ControlledAsyncAutocomplete = (_a) => {
     {
       name,
       defaultValue: rest.defaultValue,
-      rules: {
+      rules: __spreadValues({
         deps,
         max,
         maxLength,
@@ -84,19 +86,19 @@ var ControlledAsyncAutocomplete = (_a) => {
         shouldUnregister,
         validate,
         value
-      },
+      }, rules),
       shouldUnregister,
-      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2 }, fieldState: { error } }) => /* @__PURE__ */ jsx(
+      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2, ref }, fieldState: { error } }) => /* @__PURE__ */ jsx(
         AsyncAutocomplete,
         __spreadProps(__spreadValues({}, rest), {
           FieldProps: __spreadProps(__spreadValues({}, FieldProps), {
-            required: typeof required === "object" ? required.value : !!required,
             error: !!error,
             helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs(Fragment, { children: [
               error.message,
               /* @__PURE__ */ jsx("br", {}),
               FieldProps == null ? void 0 : FieldProps.helperText
-            ] }) : FieldProps == null ? void 0 : FieldProps.helperText
+            ] }) : FieldProps == null ? void 0 : FieldProps.helperText,
+            inputRef: ref
           }),
           onChange: (event, value3, reason) => {
             if (reason === "clear") {
@@ -121,6 +123,7 @@ var ControlledAutocomplete = (_a) => {
     name,
     FieldProps,
     defaultValue,
+    rules = {},
     deps,
     max,
     maxLength,
@@ -137,6 +140,7 @@ var ControlledAutocomplete = (_a) => {
     "name",
     "FieldProps",
     "defaultValue",
+    "rules",
     "deps",
     "max",
     "maxLength",
@@ -155,7 +159,7 @@ var ControlledAutocomplete = (_a) => {
     {
       name,
       defaultValue,
-      rules: {
+      rules: __spreadValues({
         deps,
         max,
         maxLength,
@@ -168,19 +172,19 @@ var ControlledAutocomplete = (_a) => {
         shouldUnregister,
         validate,
         value
-      },
+      }, rules),
       shouldUnregister,
-      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2 }, fieldState: { error } }) => /* @__PURE__ */ jsx2(
+      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2, ref }, fieldState: { error } }) => /* @__PURE__ */ jsx2(
         Autocomplete,
         __spreadProps(__spreadValues({}, rest), {
           FieldProps: __spreadProps(__spreadValues({}, FieldProps), {
-            required: typeof required === "object" ? required.value : !!required,
             error: !!error,
             helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs2(Fragment2, { children: [
               error.message,
               /* @__PURE__ */ jsx2("br", {}),
               FieldProps == null ? void 0 : FieldProps.helperText
-            ] }) : FieldProps == null ? void 0 : FieldProps.helperText
+            ] }) : FieldProps == null ? void 0 : FieldProps.helperText,
+            inputRef: ref
           }),
           onChange: (event, value3, reason) => {
             if (reason === "clear") {
@@ -208,8 +212,10 @@ var ControlledCheckbox = (_a) => {
     onBlur,
     value,
     defaultValue = false,
+    rules = {},
     shouldUnregister,
-    deps
+    deps,
+    validate
   } = _b, rest = __objRest(_b, [
     "name",
     "disabled",
@@ -217,8 +223,10 @@ var ControlledCheckbox = (_a) => {
     "onBlur",
     "value",
     "defaultValue",
+    "rules",
     "shouldUnregister",
-    "deps"
+    "deps",
+    "validate"
   ]);
   return /* @__PURE__ */ jsx3(
     Controller3,
@@ -226,13 +234,14 @@ var ControlledCheckbox = (_a) => {
       name,
       defaultValue,
       disabled,
-      rules: {
+      rules: __spreadValues({
         onChange,
         onBlur,
         value,
         shouldUnregister,
-        deps
-      },
+        deps,
+        validate
+      }, rules),
       shouldUnregister,
       render: ({ field }) => /* @__PURE__ */ jsx3(Checkbox, __spreadProps(__spreadValues(__spreadValues({}, rest), field), { checked: field.value, onChange: (e) => field.onChange(e.target.checked) }))
     }
@@ -254,6 +263,7 @@ var ControlledCodesAutocomplete = (_a) => {
     onChange,
     pattern,
     required,
+    rules = {},
     shouldUnregister,
     validate,
     value,
@@ -268,6 +278,7 @@ var ControlledCodesAutocomplete = (_a) => {
     "onChange",
     "pattern",
     "required",
+    "rules",
     "shouldUnregister",
     "validate",
     "value",
@@ -278,7 +289,7 @@ var ControlledCodesAutocomplete = (_a) => {
     {
       name,
       defaultValue,
-      rules: {
+      rules: __spreadValues({
         deps,
         max,
         maxLength,
@@ -289,19 +300,19 @@ var ControlledCodesAutocomplete = (_a) => {
         shouldUnregister,
         validate,
         value
-      },
+      }, rules),
       shouldUnregister,
-      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2 }, fieldState: { error } }) => /* @__PURE__ */ jsx4(
+      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2, ref }, fieldState: { error } }) => /* @__PURE__ */ jsx4(
         CodesAutocomplete,
         __spreadProps(__spreadValues({}, rest), {
           FieldProps: __spreadProps(__spreadValues({}, FieldProps), {
-            required: typeof required === "object" ? required.value : !!required,
             error: !!error,
             helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
               error.message,
               /* @__PURE__ */ jsx4("br", {}),
               FieldProps == null ? void 0 : FieldProps.helperText
-            ] }) : FieldProps == null ? void 0 : FieldProps.helperText
+            ] }) : FieldProps == null ? void 0 : FieldProps.helperText,
+            inputRef: ref
           }),
           onChange: (event, value3, reason) => {
             if (reason === "clear") {
@@ -321,8 +332,8 @@ var ControlledCodesAutocomplete = (_a) => {
 import { useForm, FormProvider } from "react-hook-form";
 import { jsx as jsx5 } from "react/jsx-runtime";
 var ControlledForm = (_a) => {
-  var _b = _a, { onSubmit, values, schema, validationResolver } = _b, rest = __objRest(_b, ["onSubmit", "values", "schema", "validationResolver"]);
-  const useFormOptions = { values };
+  var _b = _a, { onSubmit, values, schema, validationResolver, additionalUseFormOptions = { mode: "onBlur" } } = _b, rest = __objRest(_b, ["onSubmit", "values", "schema", "validationResolver", "additionalUseFormOptions"]);
+  const useFormOptions = __spreadValues({ values }, additionalUseFormOptions);
   if (schema && validationResolver) {
     useFormOptions.resolver = validationResolver(schema);
   }
@@ -347,6 +358,7 @@ var ControlledDatepicker = (_a) => {
     onChange,
     pattern,
     required,
+    rules = {},
     shouldUnregister,
     validate,
     value,
@@ -363,6 +375,7 @@ var ControlledDatepicker = (_a) => {
     "onChange",
     "pattern",
     "required",
+    "rules",
     "shouldUnregister",
     "validate",
     "value",
@@ -373,7 +386,7 @@ var ControlledDatepicker = (_a) => {
     {
       name,
       defaultValue,
-      rules: {
+      rules: __spreadValues({
         deps,
         max,
         maxLength,
@@ -386,19 +399,22 @@ var ControlledDatepicker = (_a) => {
         shouldUnregister,
         validate,
         value
-      },
+      }, rules),
       shouldUnregister,
-      render: ({ field: { onChange: onChange2, value: value2 }, fieldState: { error } }) => /* @__PURE__ */ jsx6(
+      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2, ref }, fieldState: { error } }) => /* @__PURE__ */ jsx6(
         Datepicker,
         __spreadProps(__spreadValues({}, rest), {
           FieldProps: __spreadProps(__spreadValues({}, FieldProps), {
-            required: typeof required === "object" ? required.value : !!required,
             error: !!error,
-            helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs4(Fragment4, { children: [
-              error == null ? void 0 : error.message,
+            helperText: error ? /* @__PURE__ */ jsxs4(Fragment4, { children: [
+              error.message,
               /* @__PURE__ */ jsx6("br", {}),
               FieldProps == null ? void 0 : FieldProps.helperText
-            ] }) : FieldProps == null ? void 0 : FieldProps.helperText
+            ] }) : FieldProps == null ? void 0 : FieldProps.helperText,
+            inputRef: ref,
+            inputProps: {
+              onBlur: onBlur2
+            }
           }),
           onChange: onChange2,
           value: value2 || null
@@ -415,36 +431,38 @@ import { jsx as jsx7 } from "react/jsx-runtime";
 var ControlledInput = (_a) => {
   var _b = _a, {
     name,
-    required,
-    maxLength,
-    minLength,
-    max,
-    min,
-    pattern,
-    validate,
     defaultValue,
+    deps,
     disabled,
-    onChange,
+    max,
+    maxLength,
+    min,
+    minLength,
     onBlur,
-    value,
+    onChange,
+    pattern,
+    required,
+    rules = {},
     shouldUnregister,
-    deps
+    validate,
+    value
   } = _b, rest = __objRest(_b, [
     "name",
-    "required",
-    "maxLength",
-    "minLength",
-    "max",
-    "min",
-    "pattern",
-    "validate",
     "defaultValue",
+    "deps",
     "disabled",
-    "onChange",
+    "max",
+    "maxLength",
+    "min",
+    "minLength",
     "onBlur",
-    "value",
+    "onChange",
+    "pattern",
+    "required",
+    "rules",
     "shouldUnregister",
-    "deps"
+    "validate",
+    "value"
   ]);
   return /* @__PURE__ */ jsx7(
     Controller6,
@@ -452,8 +470,8 @@ var ControlledInput = (_a) => {
       name,
       defaultValue,
       disabled,
-      rules: {
-        required,
+      rules: __spreadValues({
+        required: typeof required === "boolean" ? void 0 : required,
         maxLength,
         minLength,
         max,
@@ -465,13 +483,13 @@ var ControlledInput = (_a) => {
         value,
         shouldUnregister,
         deps
-      },
+      }, rules),
       shouldUnregister,
       render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsx7(
         Input,
         __spreadProps(__spreadValues(__spreadValues({}, rest), field), {
           error: !!error,
-          required: typeof required === "object" ? required.value : !!required
+          required: !!required
         })
       )
     }
@@ -491,6 +509,7 @@ var ControlledOrganizationAutocomplete = (_a) => {
     onChange,
     pattern,
     required,
+    rules = {},
     shouldUnregister,
     validate,
     value,
@@ -503,6 +522,7 @@ var ControlledOrganizationAutocomplete = (_a) => {
     "onChange",
     "pattern",
     "required",
+    "rules",
     "shouldUnregister",
     "validate",
     "value",
@@ -513,7 +533,7 @@ var ControlledOrganizationAutocomplete = (_a) => {
     {
       name,
       defaultValue,
-      rules: {
+      rules: __spreadValues({
         deps,
         onBlur,
         onChange,
@@ -522,19 +542,19 @@ var ControlledOrganizationAutocomplete = (_a) => {
         shouldUnregister,
         validate,
         value
-      },
+      }, rules),
       shouldUnregister,
-      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2 }, fieldState: { error } }) => /* @__PURE__ */ jsx8(
+      render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2, ref }, fieldState: { error } }) => /* @__PURE__ */ jsx8(
         OrganizationAutocomplete,
         __spreadProps(__spreadValues({}, rest), {
           FieldProps: __spreadProps(__spreadValues({}, FieldProps), {
-            required: typeof required === "object" ? required.value : !!required,
             error: !!error,
             helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs5(Fragment5, { children: [
               error.message,
               /* @__PURE__ */ jsx8("br", {}),
               FieldProps == null ? void 0 : FieldProps.helperText
-            ] }) : FieldProps == null ? void 0 : FieldProps.helperText
+            ] }) : FieldProps == null ? void 0 : FieldProps.helperText,
+            inputRef: ref
           }),
           onChange: (event, value3, reason) => {
             if (reason === "clear") {
@@ -567,6 +587,7 @@ var ControlledProviderAutocomplete = (_a) => {
     onChange,
     pattern,
     required,
+    rules = {},
     shouldUnregister,
     validate,
     value,
@@ -583,6 +604,7 @@ var ControlledProviderAutocomplete = (_a) => {
     "onChange",
     "pattern",
     "required",
+    "rules",
     "shouldUnregister",
     "validate",
     "value",
@@ -593,7 +615,7 @@ var ControlledProviderAutocomplete = (_a) => {
     {
       name,
       defaultValue,
-      rules: {
+      rules: __spreadValues({
         deps,
         max,
         maxLength,
@@ -606,13 +628,12 @@ var ControlledProviderAutocomplete = (_a) => {
         shouldUnregister,
         validate,
         value
-      },
+      }, rules),
       shouldUnregister,
       render: ({ field: { onChange: onChange2, value: value2, onBlur: onBlur2 }, fieldState: { error } }) => /* @__PURE__ */ jsx9(
         ProviderAutocomplete,
         __spreadProps(__spreadValues({}, rest), {
           FieldProps: __spreadProps(__spreadValues({}, FieldProps), {
-            required: typeof required === "object" ? required.value : !!required,
             error: !!error,
             helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs6(Fragment6, { children: [
               error.message,
@@ -649,6 +670,7 @@ var ControlledRadioGroup = (_a) => {
     onBlur,
     onChange,
     required,
+    rules = {},
     shouldUnregister,
     value
   } = _b, rest = __objRest(_b, [
@@ -660,6 +682,7 @@ var ControlledRadioGroup = (_a) => {
     "onBlur",
     "onChange",
     "required",
+    "rules",
     "shouldUnregister",
     "value"
   ]);
@@ -668,17 +691,20 @@ var ControlledRadioGroup = (_a) => {
     {
       name,
       defaultValue,
-      rules: { deps, onBlur, onChange, required, shouldUnregister, value },
+      rules: __spreadValues({ deps, onBlur, onChange, required: typeof required === "boolean" ? void 0 : required, shouldUnregister, value }, rules),
       shouldUnregister,
-      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsxs7(FormControl, { error: !!error, children: [
-        /* @__PURE__ */ jsx10(FormLabel, { required: typeof required === "object" ? required.value : !!required, children: label }),
-        /* @__PURE__ */ jsx10(RadioGroup, __spreadValues(__spreadValues({}, field), rest)),
-        /* @__PURE__ */ jsx10(FormHelperText, { children: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs7(Fragment7, { children: [
-          error.message,
-          /* @__PURE__ */ jsx10("br", {}),
-          helperText
-        ] }) : helperText })
-      ] })
+      render: (_a2) => {
+        var _b2 = _a2, { field: _c } = _b2, _d = _c, { disabled } = _d, field = __objRest(_d, ["disabled"]), { fieldState: { error } } = _b2;
+        return /* @__PURE__ */ jsxs7(FormControl, { error: !!error, disabled, required: !!required, children: [
+          /* @__PURE__ */ jsx10(FormLabel, { children: label }),
+          /* @__PURE__ */ jsx10(RadioGroup, __spreadValues(__spreadValues({}, field), rest)),
+          /* @__PURE__ */ jsx10(FormHelperText, { children: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs7(Fragment7, { children: [
+            error.message,
+            /* @__PURE__ */ jsx10("br", {}),
+            helperText
+          ] }) : helperText })
+        ] });
+      }
     }
   );
 };
@@ -690,36 +716,38 @@ import { jsx as jsx11 } from "react/jsx-runtime";
 var ControlledSelect = (_a) => {
   var _b = _a, {
     name,
-    required,
-    maxLength,
-    minLength,
+    defaultValue,
+    deps,
+    disabled,
     max,
+    maxLength,
     min,
-    pattern,
-    validate,
-    disabled,
-    onChange,
+    minLength,
     onBlur,
-    value,
-    defaultValue,
+    onChange,
+    pattern,
+    required,
+    rules = {},
     shouldUnregister,
-    deps
+    validate,
+    value
   } = _b, rest = __objRest(_b, [
     "name",
-    "required",
-    "maxLength",
-    "minLength",
+    "defaultValue",
+    "deps",
+    "disabled",
     "max",
+    "maxLength",
     "min",
-    "pattern",
-    "validate",
-    "disabled",
-    "onChange",
+    "minLength",
     "onBlur",
-    "value",
-    "defaultValue",
+    "onChange",
+    "pattern",
+    "required",
+    "rules",
     "shouldUnregister",
-    "deps"
+    "validate",
+    "value"
   ]);
   return /* @__PURE__ */ jsx11(
     Controller10,
@@ -727,8 +755,8 @@ var ControlledSelect = (_a) => {
       name,
       defaultValue,
       disabled,
-      rules: {
-        required,
+      rules: __spreadValues({
+        required: typeof required === "boolean" ? void 0 : required,
         maxLength,
         minLength,
         max,
@@ -740,13 +768,13 @@ var ControlledSelect = (_a) => {
         value,
         shouldUnregister,
         deps
-      },
+      }, rules),
       shouldUnregister,
       render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsx11(
         Select,
         __spreadProps(__spreadValues(__spreadValues({}, rest), field), {
           error: !!error,
-          required: typeof required === "object" ? required.value : !!required
+          required: !!required
         })
       )
     }
@@ -760,38 +788,40 @@ import { Fragment as Fragment8, jsx as jsx12, jsxs as jsxs8 } from "react/jsx-ru
 var ControlledTextField = (_a) => {
   var _b = _a, {
     name,
+    defaultValue,
+    deps,
+    disabled,
     helperText,
-    required,
-    maxLength,
-    minLength,
     max,
+    maxLength,
     min,
-    pattern,
-    validate,
-    disabled,
-    defaultValue,
-    onChange,
+    minLength,
     onBlur,
-    value,
+    onChange,
+    pattern,
+    required,
+    rules = {},
     shouldUnregister,
-    deps
+    validate,
+    value
   } = _b, rest = __objRest(_b, [
     "name",
+    "defaultValue",
+    "deps",
+    "disabled",
     "helperText",
-    "required",
-    "maxLength",
-    "minLength",
     "max",
+    "maxLength",
     "min",
-    "pattern",
-    "validate",
-    "disabled",
-    "defaultValue",
-    "onChange",
+    "minLength",
     "onBlur",
-    "value",
+    "onChange",
+    "pattern",
+    "required",
+    "rules",
     "shouldUnregister",
-    "deps"
+    "validate",
+    "value"
   ]);
   return /* @__PURE__ */ jsx12(
     Controller11,
@@ -799,8 +829,8 @@ var ControlledTextField = (_a) => {
       name,
       defaultValue,
       disabled,
-      rules: {
-        required,
+      rules: __spreadValues({
+        required: typeof required === "boolean" ? void 0 : required,
         maxLength,
         minLength,
         max,
@@ -812,23 +842,33 @@ var ControlledTextField = (_a) => {
         value,
         shouldUnregister,
         deps
-      },
+      }, rules),
       shouldUnregister,
-      render: ({ field, fieldState: { error } }) => /* @__PURE__ */ jsx12(
-        TextField,
-        __spreadProps(__spreadValues(__spreadValues({}, rest), field), {
-          required: typeof required === "object" ? required.value : !!required,
-          error: !!error,
-          helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs8(Fragment8, { children: [
-            error.message,
-            /* @__PURE__ */ jsx12("br", {}),
-            helperText
-          ] }) : helperText
-        })
-      )
+      render: (_a2) => {
+        var _b2 = _a2, { field: _c } = _b2, _d = _c, { ref } = _d, field = __objRest(_d, ["ref"]), { fieldState: { error } } = _b2;
+        return /* @__PURE__ */ jsx12(
+          TextField,
+          __spreadProps(__spreadValues(__spreadValues({}, field), rest), {
+            inputRef: ref,
+            error: !!error,
+            helperText: (error == null ? void 0 : error.message) ? /* @__PURE__ */ jsxs8(Fragment8, { children: [
+              error.message,
+              /* @__PURE__ */ jsx12("br", {}),
+              helperText
+            ] }) : helperText
+          })
+        );
+      }
     }
   );
 };
+
+// src/index.ts
+import {
+  FormProvider as FormProvider2,
+  useForm as useForm2,
+  useFormContext
+} from "react-hook-form";
 export {
   ControlledAsyncAutocomplete,
   ControlledAutocomplete,
@@ -841,5 +881,8 @@ export {
   ControlledProviderAutocomplete,
   ControlledRadioGroup,
   ControlledSelect,
-  ControlledTextField
+  ControlledTextField,
+  FormProvider2 as FormProvider,
+  useForm2 as useForm,
+  useFormContext
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@availity/mui-controlled-form",
-  "version": "0.2.6",
-  "description": "Availity MUI ControlledForm Component - part of the @availity/element design system",
+  "version": "0.3.0",
+  "description": "Availity MUI/react-hook-form controlled form components - part of the @availity/element design system",
   "keywords": [
     "react",
     "typescript",