@ultraviolet/form 2.14.6 → 3.0.0

package/dist/components/TextAreaField/index.cjs

@@ -3,12 +3,14 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const ui = require("@ultraviolet/ui");
 const reactHookForm = require("react-hook-form");
+const validateRegex = require("../../utils/validateRegex.cjs");
 const index = require("../../providers/ErrorContext/index.cjs");
 const TextAreaField = ({
   autoFocus,
   clearable,
   className,
   tabIndex,
+  control,
   "data-testid": dataTestId,
   disabled,
   helper,
@@ -26,8 +28,8 @@ const TextAreaField = ({
   rows,
   success,
   tooltip,
-  validate,
-  regex: regexes
+  regex: regexes,
+  validate
 }) => {
   const {
     getError
@@ -39,11 +41,12 @@ const TextAreaField = ({
     }
   } = reactHookForm.useController({
     name,
+    control,
     rules: {
       required,
       validate: {
         ...regexes ? {
-          pattern: (value) => regexes.every((regex) => value === void 0 || value === "" || (Array.isArray(regex) ? regex.some((regexOr) => regexOr.test(value)) : regex.test(value)))
+          pattern: (value) => validateRegex.validateRegex(value, regexes)
         } : {},
         ...validate
       },

package/dist/components/TextAreaField/index.d.ts

@@ -2,10 +2,10 @@ import { TextArea } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-export type TextAreaFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Omit<ComponentProps<typeof TextArea>, 'value' | 'error' | 'name' | 'onChange'> & {
+export type TextAreaFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Omit<ComponentProps<typeof TextArea>, 'value' | 'error' | 'name' | 'onChange'> & {
     regex?: (RegExp | RegExp[])[];
 };
 /**
  * This component offers a form field based on Ultraviolet UI TextArea component
  */
-export declare const TextAreaField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ autoFocus, clearable, className, tabIndex, "data-testid": dataTestId, disabled, helper, label, labelDescription, onChange, minLength, maxLength, name, onFocus, onBlur, placeholder, readOnly, required, rows, success, tooltip, validate, regex: regexes, }: TextAreaFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const TextAreaField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ autoFocus, clearable, className, tabIndex, control, "data-testid": dataTestId, disabled, helper, label, labelDescription, onChange, minLength, maxLength, name, onFocus, onBlur, placeholder, readOnly, required, rows, success, tooltip, regex: regexes, validate, }: TextAreaFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/TextAreaField/index.js

@@ -1,12 +1,14 @@
 import { jsx } from "@emotion/react/jsx-runtime";
 import { TextArea } from "@ultraviolet/ui";
 import { useController } from "react-hook-form";
+import { validateRegex } from "../../utils/validateRegex.js";
 import { useErrors } from "../../providers/ErrorContext/index.js";
 const TextAreaField = ({
   autoFocus,
   clearable,
   className,
   tabIndex,
+  control,
   "data-testid": dataTestId,
   disabled,
   helper,
@@ -24,8 +26,8 @@ const TextAreaField = ({
   rows,
   success,
   tooltip,
-  validate,
-  regex: regexes
+  regex: regexes,
+  validate
 }) => {
   const {
     getError
@@ -37,11 +39,12 @@ const TextAreaField = ({
     }
   } = useController({
     name,
+    control,
     rules: {
       required,
       validate: {
         ...regexes ? {
-          pattern: (value) => regexes.every((regex) => value === void 0 || value === "" || (Array.isArray(regex) ? regex.some((regexOr) => regexOr.test(value)) : regex.test(value)))
+          pattern: (value) => validateRegex(value, regexes)
         } : {},
         ...validate
       },

package/dist/components/TextInputField/index.cjs

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const ui = require("@ultraviolet/ui");
 const reactHookForm = require("react-hook-form");
+const validateRegex = require("../../utils/validateRegex.cjs");
 const index = require("../../providers/ErrorContext/index.cjs");
 const TextInputField = ({
   autoCapitalize,
@@ -35,22 +36,22 @@ const TextInputField = ({
   type,
   unit,
   size,
-  rules,
   valid,
   parse,
   format,
   formatOnBlur = false,
   regex: regexes,
-  min,
-  max,
-  minLength,
-  maxLength,
-  validate,
   defaultValue,
   customError,
   innerRef,
   shouldUnregister = false,
-  "data-testid": dataTestId
+  "data-testid": dataTestId,
+  validate,
+  min,
+  max,
+  minLength,
+  maxLength,
+  control
 }) => {
   const {
     getError
@@ -64,19 +65,19 @@ const TextInputField = ({
     name,
     defaultValue,
     shouldUnregister,
+    control,
     rules: {
       required,
+      minLength,
+      maxLength,
+      min,
+      max,
       validate: {
         ...regexes ? {
-          pattern: (value) => regexes.every((regex) => value === void 0 || value === "" || (Array.isArray(regex) ? regex.some((regexOr) => regexOr.test(value)) : regex.test(value)))
+          pattern: (value) => validateRegex.validateRegex(value, regexes)
         } : {},
         ...validate
-      },
-      minLength,
-      maxLength,
-      max,
-      min,
-      ...rules
+      }
     }
   });
   const transformedValue = () => {

package/dist/components/TextInputField/index.d.ts

@@ -2,7 +2,7 @@ import { TextInput } from '@ultraviolet/ui';
 import type { ComponentProps, Ref } from 'react';
 import type { FieldPath, FieldValues, Path, PathValue } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type TextInputFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Partial<Pick<ComponentProps<typeof TextInput>, 'autoCapitalize' | 'autoComplete' | 'autoCorrect' | 'autoFocus' | 'autoSave' | 'cols' | 'disabled' | 'fillAvailable' | 'generated' | 'id' | 'multiline' | 'notice' | 'onBlur' | 'onFocus' | 'onKeyDown' | 'onKeyUp' | 'placeholder' | 'random' | 'readOnly' | 'resizable' | 'rows' | 'type' | 'noTopLabel' | 'unit' | 'valid' | 'size' | 'maxLength' | 'minLength' | 'min' | 'max' | 'data-testid'>> & {
+type TextInputFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Partial<Pick<ComponentProps<typeof TextInput>, 'autoCapitalize' | 'autoComplete' | 'autoCorrect' | 'autoFocus' | 'autoSave' | 'cols' | 'disabled' | 'fillAvailable' | 'generated' | 'id' | 'multiline' | 'notice' | 'onBlur' | 'onFocus' | 'onKeyDown' | 'onKeyUp' | 'placeholder' | 'random' | 'readOnly' | 'resizable' | 'rows' | 'type' | 'noTopLabel' | 'unit' | 'valid' | 'size' | 'maxLength' | 'minLength' | 'min' | 'max' | 'data-testid'>> & {
     className?: string;
     regex?: (RegExp | RegExp[])[];
     format?: (value: unknown) => PathValue<TFieldValues, Path<TFieldValues>>;
@@ -14,5 +14,5 @@ type TextInputFieldProps<TFieldValues extends FieldValues, TName extends FieldPa
 /**
  * @deprecated This component is deprecated, please use `TextInputFieldV2` instead
  */
-export declare const TextInputField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ autoCapitalize, autoComplete, autoCorrect, autoFocus, autoSave, className, cols, disabled, fillAvailable, generated, id, label, multiline, name, noTopLabel, notice, onChange, onFocus, onKeyDown, onKeyUp, onBlur, placeholder, random, readOnly, required, resizable, rows, type, unit, size, rules, valid, parse, format, formatOnBlur, regex: regexes, min, max, minLength, maxLength, validate, defaultValue, customError, innerRef, shouldUnregister, "data-testid": dataTestId, }: TextInputFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const TextInputField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ autoCapitalize, autoComplete, autoCorrect, autoFocus, autoSave, className, cols, disabled, fillAvailable, generated, id, label, multiline, name, noTopLabel, notice, onChange, onFocus, onKeyDown, onKeyUp, onBlur, placeholder, random, readOnly, required, resizable, rows, type, unit, size, valid, parse, format, formatOnBlur, regex: regexes, defaultValue, customError, innerRef, shouldUnregister, "data-testid": dataTestId, validate, min, max, minLength, maxLength, control, }: TextInputFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/TextInputField/index.js

@@ -1,6 +1,7 @@
 import { jsx } from "@emotion/react/jsx-runtime";
 import { TextInput } from "@ultraviolet/ui";
 import { useController } from "react-hook-form";
+import { validateRegex } from "../../utils/validateRegex.js";
 import { useErrors } from "../../providers/ErrorContext/index.js";
 const TextInputField = ({
   autoCapitalize,
@@ -33,22 +34,22 @@ const TextInputField = ({
   type,
   unit,
   size,
-  rules,
   valid,
   parse,
   format,
   formatOnBlur = false,
   regex: regexes,
-  min,
-  max,
-  minLength,
-  maxLength,
-  validate,
   defaultValue,
   customError,
   innerRef,
   shouldUnregister = false,
-  "data-testid": dataTestId
+  "data-testid": dataTestId,
+  validate,
+  min,
+  max,
+  minLength,
+  maxLength,
+  control
 }) => {
   const {
     getError
@@ -62,19 +63,19 @@ const TextInputField = ({
     name,
     defaultValue,
     shouldUnregister,
+    control,
     rules: {
       required,
+      minLength,
+      maxLength,
+      min,
+      max,
       validate: {
         ...regexes ? {
-          pattern: (value) => regexes.every((regex) => value === void 0 || value === "" || (Array.isArray(regex) ? regex.some((regexOr) => regexOr.test(value)) : regex.test(value)))
+          pattern: (value) => validateRegex(value, regexes)
         } : {},
         ...validate
-      },
-      minLength,
-      maxLength,
-      max,
-      min,
-      ...rules
+      }
     }
   });
   const transformedValue = () => {

package/dist/components/TextInputFieldV2/index.cjs

@@ -3,9 +3,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const ui = require("@ultraviolet/ui");
 const reactHookForm = require("react-hook-form");
+const validateRegex = require("../../utils/validateRegex.cjs");
 const index = require("../../providers/ErrorContext/index.cjs");
 const TextInputField = ({
-  validate,
   regex: regexes,
   id,
   className,
@@ -37,7 +37,9 @@ const TextInputField = ({
   "aria-labelledby": ariaLabelledBy,
   "aria-label": ariaLabel,
   autoComplete,
-  shouldUnregister
+  shouldUnregister,
+  validate,
+  control
 }) => {
   const {
     getError
@@ -50,11 +52,12 @@ const TextInputField = ({
   } = reactHookForm.useController({
     name,
     shouldUnregister,
+    control,
     rules: {
       required,
       validate: {
         ...regexes ? {
-          pattern: (value) => regexes.every((regex) => value === void 0 || value === "" || (Array.isArray(regex) ? regex.some((regexOr) => regexOr.test(value)) : regex.test(value)))
+          pattern: (value) => validateRegex.validateRegex(value, regexes)
         } : {},
         ...validate
       },

package/dist/components/TextInputFieldV2/index.d.ts

@@ -2,11 +2,11 @@ import { TextInputV2 } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type TextInputFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Omit<ComponentProps<typeof TextInputV2>, 'value' | 'error' | 'name' | 'onChange'> & {
+type TextInputFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Omit<ComponentProps<typeof TextInputV2>, 'value' | 'error' | 'name' | 'onChange'> & {
     regex?: (RegExp | RegExp[])[];
 };
 /**
  * This component offers a form field based on Ultraviolet UI TextInputV2 component
  */
-export declare const TextInputField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ validate, regex: regexes, id, className, tabIndex, onChange, placeholder, disabled, readOnly, success, helper, tooltip, label, autoFocus, required, "data-testid": dataTestId, name, onFocus, onBlur, clearable, labelDescription, type, prefix, suffix, size, loading, onRandomize, minLength, maxLength, "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel, autoComplete, shouldUnregister, }: TextInputFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const TextInputField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ regex: regexes, id, className, tabIndex, onChange, placeholder, disabled, readOnly, success, helper, tooltip, label, autoFocus, required, "data-testid": dataTestId, name, onFocus, onBlur, clearable, labelDescription, type, prefix, suffix, size, loading, onRandomize, minLength, maxLength, "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel, autoComplete, shouldUnregister, validate, control, }: TextInputFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/TextInputFieldV2/index.js

@@ -1,9 +1,9 @@
 import { jsx } from "@emotion/react/jsx-runtime";
 import { TextInputV2 } from "@ultraviolet/ui";
 import { useController } from "react-hook-form";
+import { validateRegex } from "../../utils/validateRegex.js";
 import { useErrors } from "../../providers/ErrorContext/index.js";
 const TextInputField = ({
-  validate,
   regex: regexes,
   id,
   className,
@@ -35,7 +35,9 @@ const TextInputField = ({
   "aria-labelledby": ariaLabelledBy,
   "aria-label": ariaLabel,
   autoComplete,
-  shouldUnregister
+  shouldUnregister,
+  validate,
+  control
 }) => {
   const {
     getError
@@ -48,11 +50,12 @@ const TextInputField = ({
   } = useController({
     name,
     shouldUnregister,
+    control,
     rules: {
       required,
       validate: {
         ...regexes ? {
-          pattern: (value) => regexes.every((regex) => value === void 0 || value === "" || (Array.isArray(regex) ? regex.some((regexOr) => regexOr.test(value)) : regex.test(value)))
+          pattern: (value) => validateRegex(value, regexes)
         } : {},
         ...validate
       },

package/dist/components/TimeField/index.cjs

@@ -13,6 +13,7 @@ const parseTime = (date) => {
 const TimeField = ({
   required,
   name,
+  control,
   schedule,
   placeholder,
   disabled,
@@ -29,11 +30,11 @@ const TimeField = ({
   animationOnChange,
   className,
   isSearchable,
-  rules,
   options,
   "data-testid": dataTestId,
   shouldUnregister = false,
-  noTopLabel
+  noTopLabel,
+  validate
 }) => {
   const {
     field,
@@ -42,10 +43,11 @@ const TimeField = ({
     }
   } = reactHookForm.useController({
     name,
+    control,
     shouldUnregister,
     rules: {
       required,
-      ...rules
+      validate
     }
   });
   return /* @__PURE__ */ jsxRuntime.jsx(ui.TimeInput, { name: field.name, placeholder, schedule, required, value: parseTime(field.value), onChange: (val) => {

package/dist/components/TimeField/index.d.ts

@@ -2,8 +2,6 @@ import { TimeInput } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type TimeFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Omit<ComponentProps<typeof TimeInput>, 'onChange'> & {
-    name: string;
-};
-export declare const TimeField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ required, name, schedule, placeholder, disabled, readOnly, onBlur, onFocus, onChange, isLoading, isClearable, inputId, id, animation, animationDuration, animationOnChange, className, isSearchable, rules, options, "data-testid": dataTestId, shouldUnregister, noTopLabel, }: TimeFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+type TimeFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Omit<ComponentProps<typeof TimeInput>, 'onChange'>;
+export declare const TimeField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ required, name, control, schedule, placeholder, disabled, readOnly, onBlur, onFocus, onChange, isLoading, isClearable, inputId, id, animation, animationDuration, animationOnChange, className, isSearchable, options, "data-testid": dataTestId, shouldUnregister, noTopLabel, validate, }: TimeFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/TimeField/index.js

@@ -11,6 +11,7 @@ const parseTime = (date) => {
 const TimeField = ({
   required,
   name,
+  control,
   schedule,
   placeholder,
   disabled,
@@ -27,11 +28,11 @@ const TimeField = ({
   animationOnChange,
   className,
   isSearchable,
-  rules,
   options,
   "data-testid": dataTestId,
   shouldUnregister = false,
-  noTopLabel
+  noTopLabel,
+  validate
 }) => {
   const {
     field,
@@ -40,10 +41,11 @@ const TimeField = ({
     }
   } = useController({
     name,
+    control,
     shouldUnregister,
     rules: {
       required,
-      ...rules
+      validate
     }
   });
   return /* @__PURE__ */ jsx(TimeInput, { name: field.name, placeholder, schedule, required, value: parseTime(field.value), onChange: (val) => {

package/dist/components/ToggleField/index.cjs

@@ -9,16 +9,17 @@ const ToggleField = ({
   disabled,
   label,
   name,
+  control,
   onChange,
   required,
   size,
   tooltip,
-  rules,
   labelPosition,
   parse,
   format,
   "data-testid": dataTestId,
-  shouldUnregister = false
+  shouldUnregister = false,
+  validate
 }) => {
   const {
     field,
@@ -27,10 +28,11 @@ const ToggleField = ({
     }
   } = reactHookForm.useController({
     name,
+    control,
     shouldUnregister,
     rules: {
       required,
-      ...rules
+      validate
     }
   });
   const {

package/dist/components/ToggleField/index.d.ts

@@ -2,9 +2,9 @@ import { Toggle } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type ToggleFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<BaseFieldProps<TFieldValues, TName>, 'label'> & Pick<ComponentProps<typeof Toggle>, 'disabled' | 'label' | 'onChange' | 'size' | 'tooltip' | 'labelPosition' | 'className' | 'data-testid'> & {
+type ToggleFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = Omit<BaseFieldProps<TFieldValues, TFieldName>, 'label'> & Pick<ComponentProps<typeof Toggle>, 'disabled' | 'label' | 'onChange' | 'size' | 'tooltip' | 'labelPosition' | 'className' | 'data-testid'> & {
     parse?: (value: boolean) => any;
     format?: (value: any) => boolean;
 };
-export declare const ToggleField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ className, disabled, label, name, onChange, required, size, tooltip, rules, labelPosition, parse, format, "data-testid": dataTestId, shouldUnregister, }: ToggleFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const ToggleField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ className, disabled, label, name, control, onChange, required, size, tooltip, labelPosition, parse, format, "data-testid": dataTestId, shouldUnregister, validate, }: ToggleFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ToggleField/index.js

@@ -7,16 +7,17 @@ const ToggleField = ({
   disabled,
   label,
   name,
+  control,
   onChange,
   required,
   size,
   tooltip,
-  rules,
   labelPosition,
   parse,
   format,
   "data-testid": dataTestId,
-  shouldUnregister = false
+  shouldUnregister = false,
+  validate
 }) => {
   const {
     field,
@@ -25,10 +26,11 @@ const ToggleField = ({
     }
   } = useController({
     name,
+    control,
     shouldUnregister,
     rules: {
       required,
-      ...rules
+      validate
     }
   });
   const {

package/dist/components/ToggleGroupField/index.d.ts

@@ -2,9 +2,9 @@ import { ToggleGroup } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type ToggleGroupFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Partial<Pick<ComponentProps<typeof ToggleGroup>, 'className' | 'helper' | 'direction' | 'children' | 'error' | 'legend'>> & Required<Pick<ComponentProps<typeof ToggleGroup>, 'legend' | 'name'>>;
+type ToggleGroupFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Partial<Pick<ComponentProps<typeof ToggleGroup>, 'className' | 'helper' | 'direction' | 'children' | 'error' | 'legend'>> & Required<Pick<ComponentProps<typeof ToggleGroup>, 'legend'>>;
 export declare const ToggleGroupField: {
-    <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ legend, className, helper, direction, children, onChange, label, error: customError, name, required, shouldUnregister, }: ToggleGroupFieldProps<TFieldValues, TName>): import("@emotion/react/jsx-runtime").JSX.Element;
+    <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ legend, control, className, helper, direction, children, onChange, label, error: customError, name, required, shouldUnregister, validate, }: ToggleGroupFieldProps<TFieldValues, TFieldName>): import("@emotion/react/jsx-runtime").JSX.Element;
     Toggle: ({ disabled, name, value, label, helper, error, className, "data-testid": dataTestId, }: Omit<{
         id?: string;
         checked?: boolean;

package/dist/components/UnitInputField/index.cjs

@@ -22,9 +22,9 @@ const UnitInputField = ({
   width,
   selectInputWidth,
   helper,
-  rules,
   shouldUnregister = false,
-  validate
+  validate,
+  control
 }) => {
   const {
     getError
@@ -44,12 +44,12 @@ const UnitInputField = ({
   } = reactHookForm.useController({
     name,
     shouldUnregister,
+    control,
     rules: {
       required,
       min,
       max,
-      ...rules,
-      ...validate
+      validate
     }
   });
   return /* @__PURE__ */ jsxRuntime.jsx(ui.UnitInput, { id, name, required, max, min, error: getError({

package/dist/components/UnitInputField/index.d.ts

@@ -2,10 +2,10 @@ import { UnitInput } from '@ultraviolet/ui';
 import type { ComponentProps } from 'react';
 import type { FieldPath, FieldValues } from 'react-hook-form';
 import type { BaseFieldProps } from '../../types';
-type UnitInputFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Pick<ComponentProps<typeof UnitInput>, 'id' | 'name' | 'className' | 'data-testid' | 'disabled' | 'value' | 'max' | 'min' | 'options' | 'placeholder' | 'placeholderUnit' | 'size' | 'unitValue' | 'required' | 'width' | 'helper' | 'selectInputWidth'> & {
+type UnitInputFieldProps<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TFieldName> & Pick<ComponentProps<typeof UnitInput>, 'id' | 'name' | 'className' | 'data-testid' | 'disabled' | 'value' | 'max' | 'min' | 'options' | 'placeholder' | 'placeholderUnit' | 'size' | 'unitValue' | 'required' | 'width' | 'helper' | 'selectInputWidth'> & {
     onChange?: ComponentProps<typeof UnitInput>['onChange'];
     onChangeUnitValue?: ComponentProps<typeof UnitInput>['onChangeUnitValue'];
     label: string;
 };
-export declare const UnitInputField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ id, name, max, min, size, placeholder, placeholderUnit, onChange, onChangeUnitValue, disabled, options, className, label, required, width, selectInputWidth, helper, rules, shouldUnregister, validate, }: UnitInputFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const UnitInputField: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ id, name, max, min, size, placeholder, placeholderUnit, onChange, onChangeUnitValue, disabled, options, className, label, required, width, selectInputWidth, helper, shouldUnregister, validate, control, }: UnitInputFieldProps<TFieldValues, TFieldName>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/UnitInputField/index.js

@@ -20,9 +20,9 @@ const UnitInputField = ({
   width,
   selectInputWidth,
   helper,
-  rules,
   shouldUnregister = false,
-  validate
+  validate,
+  control
 }) => {
   const {
     getError
@@ -42,12 +42,12 @@ const UnitInputField = ({
   } = useController({
     name,
     shouldUnregister,
+    control,
     rules: {
       required,
       min,
       max,
-      ...rules,
-      ...validate
+      validate
     }
   });
   return /* @__PURE__ */ jsx(UnitInput, { id, name, required, max, min, error: getError({

package/dist/components/index.d.ts

@@ -1,7 +1,6 @@
 export { CheckboxField } from './CheckboxField';
 export { CheckboxGroupField } from './CheckboxGroupField';
 export { DateField } from './DateField';
-export type { FormProps } from './Form';
 export { Form } from './Form';
 export { RadioField } from './RadioField';
 export { SelectInputField } from './SelectInputField';

package/dist/hooks/index.d.ts

@@ -1,5 +1 @@
 export { useOnFieldChange } from './useOnFieldChange';
-export { useFormStateDeprecated } from './useFormState';
-export { useFieldDeprecated } from './useField';
-export { useFormDeprecated } from './useForm';
-export { useFieldArrayDeprecated } from './useFieldArray';

package/dist/hooks/useOnFieldChange.cjs

@@ -1,14 +1,14 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const React = require("react");
+const react = require("react");
 const reactHookForm = require("react-hook-form");
 const useOnFieldChange = (fieldName, callback, enabled = true) => {
   const {
     watch,
     getValues
   } = reactHookForm.useFormContext();
-  const previousValues = React.useRef(getValues(fieldName));
-  React.useEffect(() => {
+  const previousValues = react.useRef(getValues(fieldName));
+  react.useEffect(() => {
     const subscription = watch((value) => {
       if (previousValues.current !== value[fieldName] && enabled) {
         previousValues.current = value[fieldName];

package/dist/hooks/useOnFieldChange.d.ts

@@ -1,3 +1,6 @@
 import type { DeepPartial, FieldPath, FieldPathValue, FieldValues } from 'react-hook-form';
 export type CallbackFn<TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>> = (value: FieldPathValue<TFieldValues, TFieldName>, values: DeepPartial<TFieldValues>) => void | Promise<void>;
+/**
+ * @deprecated
+ */
 export declare const useOnFieldChange: <TFieldValues extends FieldValues, TFieldName extends FieldPath<TFieldValues>>(fieldName: TFieldName, callback: CallbackFn<TFieldValues, TFieldName>, enabled?: boolean) => void;