@ttoss/forms 0.32.0 → 0.32.2

package/dist/esm/chunk-X42ZUF2A.js

@@ -0,0 +1,360 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+import * as React from 'react';
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", {
+  value,
+  configurable: true
+});
+
+// src/FormErrorMessage.tsx
+import { ErrorMessage } from "@hookform/error-message";
+import { FormattedMessage } from "@ttoss/react-i18n";
+import { HelpText } from "@ttoss/ui";
+import { useFormContext } from "react-hook-form";
+var isMessageDescriptor = /* @__PURE__ */__name(possibleMessageDescriptor => {
+  return possibleMessageDescriptor !== void 0 && possibleMessageDescriptor.defaultMessage !== void 0;
+}, "isMessageDescriptor");
+var FormErrorMessage = /* @__PURE__ */__name(({
+  name,
+  disabled
+}) => {
+  const {
+    formState: {
+      errors
+    }
+  } = useFormContext();
+  return /* @__PURE__ */React.createElement(ErrorMessage, {
+    name,
+    errors,
+    render: /* @__PURE__ */__name(({
+      message
+    }) => {
+      return /* @__PURE__ */React.createElement(HelpText, {
+        negative: true,
+        disabled
+      }, (() => {
+        if (typeof message === "string") {
+          return message;
+        }
+        if (isMessageDescriptor(message)) {
+          return /* @__PURE__ */React.createElement(FormattedMessage, message);
+        }
+        return JSON.stringify(message);
+      })());
+    }, "render")
+  });
+}, "FormErrorMessage");
+
+// src/FormField.tsx
+import { Checkbox, Flex, Label, Switch, Tooltip } from "@ttoss/ui";
+import * as React2 from "react";
+import { useController, useFormContext as useFormContext2 } from "react-hook-form";
+var FormField = /* @__PURE__ */__name(({
+  label,
+  id: idProp,
+  name,
+  defaultValue,
+  disabled,
+  tooltip,
+  inputTooltip,
+  sx,
+  css,
+  render,
+  warning,
+  rules
+}) => {
+  const controllerReturn = useController({
+    name,
+    defaultValue,
+    rules
+  });
+  const {
+    formState: {
+      errors
+    }
+  } = useFormContext2();
+  const hasError = !!errors[name];
+  const uniqueId = React2.useId();
+  const id = idProp || `form-field-${name}-${uniqueId}`;
+  const tooltipId = `${id}-tooltip`;
+  const [showInputTooltip, setShowInputTooltip] = React2.useState(false);
+  const inputRef = React2.useRef(null);
+  const handleClickOutside = React2.useCallback(event => {
+    if (inputRef.current && !inputRef.current.contains(event.target)) {
+      setShowInputTooltip(false);
+    }
+  }, []);
+  const handleEscapeKey = React2.useCallback(event => {
+    if (event.key === "Escape") {
+      setShowInputTooltip(false);
+    }
+  }, []);
+  React2.useEffect(() => {
+    if (!inputTooltip || !showInputTooltip) {
+      return;
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    document.addEventListener("keydown", handleEscapeKey);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("keydown", handleEscapeKey);
+    };
+  }, [showInputTooltip, inputTooltip, handleClickOutside, handleEscapeKey]);
+  const handleInputClick = React2.useCallback(() => {
+    if (inputTooltip) {
+      setShowInputTooltip(true);
+    }
+  }, [inputTooltip]);
+  const handleInputFocus = React2.useCallback(() => {
+    if (inputTooltip && !inputTooltip.openOnClick) {
+      setShowInputTooltip(true);
+    }
+  }, [inputTooltip]);
+  const handleInputBlur = React2.useCallback(() => {
+    if (inputTooltip && !inputTooltip.openOnClick) {
+      setShowInputTooltip(false);
+    }
+  }, [inputTooltip]);
+  const tooltipElement = React2.useMemo(() => {
+    if (!inputTooltip || !showInputTooltip) {
+      return null;
+    }
+    return /* @__PURE__ */React2.createElement(Flex, {
+      sx: {
+        width: "full",
+        fontSize: "sm"
+      }
+    }, /* @__PURE__ */React2.createElement(Tooltip, {
+      id: tooltipId,
+      place: inputTooltip.place,
+      clickable: inputTooltip.clickable,
+      isOpen: showInputTooltip,
+      variant: inputTooltip.variant,
+      sx: inputTooltip.sx
+    }, inputTooltip.render));
+  }, [inputTooltip, showInputTooltip, tooltipId]);
+  const isCheckboxOrSwitch = /* @__PURE__ */__name(element => {
+    return [Checkbox, Switch].some(component => {
+      return element.type === component;
+    });
+  }, "isCheckboxOrSwitch");
+  const memoizedRender = React2.useMemo(() => {
+    return React2.Children.map(render(controllerReturn), child => {
+      if (! /* @__PURE__ */React2.isValidElement(child)) {
+        return null;
+      }
+      const childProps = child.props;
+      const inputProps = {
+        ...childProps,
+        ref: inputRef,
+        onClick: /* @__PURE__ */__name(e => {
+          childProps.onClick?.(e);
+          handleInputClick();
+        }, "onClick"),
+        onFocus: /* @__PURE__ */__name(e => {
+          childProps.onFocus?.(e);
+          handleInputFocus();
+        }, "onFocus"),
+        onBlur: /* @__PURE__ */__name(e => {
+          childProps.onBlur?.(e);
+          handleInputBlur();
+        }, "onBlur"),
+        ...(inputTooltip && showInputTooltip ? {
+          "data-tooltip-id": tooltipId
+        } : {})
+      };
+      const elementProps = {
+        id,
+        ...inputProps,
+        ...(warning && {
+          trailingIcon: "warning-alt"
+        })
+      };
+      if (label && isCheckboxOrSwitch(child)) {
+        return /* @__PURE__ */React2.createElement(React2.Fragment, null, /* @__PURE__ */React2.createElement(Label, {
+          "aria-disabled": disabled,
+          tooltip
+        }, /* @__PURE__ */React2.createElement(Flex, {
+          sx: {
+            position: "relative"
+          }
+        }, /* @__PURE__ */React2.createElement(child.type, elementProps)), label), tooltipElement);
+      }
+      return /* @__PURE__ */React2.createElement(Flex, {
+        sx: {
+          width: "full",
+          flexDirection: "column",
+          gap: "2"
+        }
+      }, label && /* @__PURE__ */React2.createElement(Label, {
+        "aria-disabled": disabled,
+        htmlFor: id,
+        tooltip
+      }, label), /* @__PURE__ */React2.createElement(child.type, elementProps), tooltipElement);
+    });
+  }, [render, controllerReturn, label, disabled, id, tooltip, warning, inputTooltip, showInputTooltip, tooltipId, handleInputClick, handleInputFocus, handleInputBlur, tooltipElement]);
+  return /* @__PURE__ */React2.createElement(Flex, {
+    sx: {
+      flexDirection: "column",
+      width: "100%",
+      gap: "1",
+      ...sx
+    },
+    css
+  }, memoizedRender, /* @__PURE__ */React2.createElement(FormErrorMessage, {
+    name
+  }), warning && !hasError && /* @__PURE__ */React2.createElement(Flex, {
+    className: "warning",
+    sx: {
+      color: "feedback.text.caution.default",
+      fontSize: "sm",
+      gap: "2",
+      paddingBottom: "1",
+      alignItems: "center"
+    }
+  }, warning));
+}, "FormField");
+
+// src/FormFieldPatternFormat.tsx
+import { Input } from "@ttoss/ui";
+import { PatternFormat } from "react-number-format";
+var FormFieldPatternFormat = /* @__PURE__ */__name(({
+  disabled,
+  ...props
+}) => {
+  const {
+    label,
+    name,
+    tooltip,
+    inputTooltip,
+    warning,
+    sx,
+    css,
+    rules,
+    id,
+    defaultValue,
+    ...patternFormatProps
+  } = props;
+  return /* @__PURE__ */React.createElement(FormField, {
+    id,
+    label,
+    name,
+    tooltip,
+    inputTooltip,
+    warning,
+    sx,
+    css,
+    defaultValue,
+    rules,
+    disabled,
+    render: /* @__PURE__ */__name(({
+      field,
+      fieldState
+    }) => {
+      return /* @__PURE__ */React.createElement(PatternFormat, {
+        ...patternFormatProps,
+        name: field.name,
+        value: field.value,
+        onBlur: field.onBlur,
+        onValueChange: /* @__PURE__ */__name(values => {
+          field.onChange(values.value);
+        }, "onValueChange"),
+        customInput: Input,
+        disabled,
+        "aria-invalid": fieldState.error ? "true" : void 0
+      });
+    }, "render")
+  });
+}, "FormFieldPatternFormat");
+
+// src/Brazil/FormFieldCNPJ.tsx
+import { Input as Input2 } from "@ttoss/ui";
+import { PatternFormat as PatternFormat2 } from "react-number-format";
+var isCnpjValid = /* @__PURE__ */__name(cnpj => {
+  if (cnpj?.length != 14) {
+    return false;
+  }
+  if (cnpj == "00000000000000" || cnpj == "11111111111111" || cnpj == "22222222222222" || cnpj == "33333333333333" || cnpj == "44444444444444" || cnpj == "55555555555555" || cnpj == "66666666666666" || cnpj == "77777777777777" || cnpj == "88888888888888" || cnpj == "99999999999999") {
+    return false;
+  }
+  let size = cnpj.length - 2;
+  let numbers = cnpj.substring(0, size);
+  const digits = cnpj.substring(size);
+  let soma = 0;
+  let pos = size - 7;
+  for (let i = size; i >= 1; i--) {
+    soma += numbers.charAt(size - i) * pos--;
+    if (pos < 2) {
+      pos = 9;
+    }
+  }
+  let result = soma % 11 < 2 ? 0 : 11 - soma % 11;
+  if (result != digits.charAt(0)) {
+    return false;
+  }
+  size = size + 1;
+  numbers = cnpj.substring(0, size);
+  soma = 0;
+  pos = size - 7;
+  for (let i = size; i >= 1; i--) {
+    soma += numbers.charAt(size - i) * pos--;
+    if (pos < 2) {
+      pos = 9;
+    }
+  }
+  result = soma % 11 < 2 ? 0 : 11 - soma % 11;
+  if (result != digits.charAt(1)) {
+    return false;
+  }
+  return true;
+}, "isCnpjValid");
+var FormFieldCNPJ = /* @__PURE__ */__name(({
+  disabled,
+  ...props
+}) => {
+  const {
+    label,
+    name,
+    tooltip,
+    inputTooltip,
+    warning,
+    sx,
+    css,
+    rules,
+    id,
+    defaultValue,
+    placeholder = "12.345.678/0000-00",
+    ...patternFormatProps
+  } = props;
+  return /* @__PURE__ */React.createElement(FormField, {
+    id,
+    label,
+    name,
+    tooltip,
+    inputTooltip,
+    warning,
+    sx,
+    css,
+    defaultValue,
+    rules,
+    disabled,
+    render: /* @__PURE__ */__name(({
+      field
+    }) => {
+      return /* @__PURE__ */React.createElement(PatternFormat2, {
+        ...patternFormatProps,
+        name: field.name,
+        value: field.value,
+        onBlur: field.onBlur,
+        onValueChange: /* @__PURE__ */__name(values => {
+          field.onChange(values.value);
+        }, "onValueChange"),
+        format: "##.###.###/####-##",
+        customInput: Input2,
+        placeholder,
+        disabled
+      });
+    }, "render")
+  });
+}, "FormFieldCNPJ");
+export { __name, FormErrorMessage, FormField, FormFieldPatternFormat, isCnpjValid, FormFieldCNPJ };

package/dist/esm/index.js

@@ -1,3 +1,4 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-import { Controller, Form, FormErrorMessage, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldPatternFormat, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormGroup, useFormState, useWatch, yup, yupResolver } from "./chunk-7OXUGQSF.js";
+import { Controller, Form, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormGroup, useFormState, useWatch, yup, yupResolver } from "./chunk-WZLEU3SB.js";
+import { FormErrorMessage, FormField, FormFieldPatternFormat } from "./chunk-X42ZUF2A.js";
 export { Controller, Form, FormErrorMessage, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldPatternFormat, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormGroup, useFormState, useWatch, yup, yupResolver };

package/dist/index.d.ts

@@ -1,127 +1,74 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { BoxProps, ThemeUIStyleObject, Theme, SxProp, CheckboxProps, InputProps, InputPasswordProps, RadioProps, SelectProps, SwitchProps, TextareaProps } from '@ttoss/ui';
-import * as React$1 from 'react';
-import { FieldValues, FormProviderProps, FieldName, FieldPath, UseControllerReturn, FieldPathValue } from 'react-hook-form';
+import { BoxProps, CheckboxProps, InputProps, InputPasswordProps, RadioProps, ThemeUIStyleObject, SelectProps, SwitchProps, TextareaProps } from '@ttoss/ui';
+import * as React from 'react';
+import { FieldValues, FormProviderProps, FieldName, FieldPath } from 'react-hook-form';
 export * from 'react-hook-form';
 export { Controller, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch } from 'react-hook-form';
-import { F as FormFieldPatternFormatProps } from './FormFieldPatternFormat-3gBOUVd9.js';
-export { a as FormFieldPatternFormat } from './FormFieldPatternFormat-3gBOUVd9.js';
+import { F as FormFieldProps, a as FormFieldPatternFormatProps } from './FormFieldPatternFormat-CxkCeniP.js';
+export { b as FormField, c as FormFieldPatternFormat } from './FormFieldPatternFormat-CxkCeniP.js';
 import { NumericFormatProps } from 'react-number-format';
 import './typings.d-HZBqJJjn.js';
 import * as yup from 'yup';
 export { yup };
 export { yupResolver } from '@hookform/resolvers/yup';
 
-declare const Form: <TFieldValues extends FieldValues = FieldValues>({ children, onSubmit, sx, ...formMethods }: {
-    children?: React$1.ReactNode;
-    onSubmit?: (data: TFieldValues) => Promise<void> | void;
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>({ children, onSubmit, sx, ...formMethods }: {
+    children?: React.ReactNode;
+    onSubmit?: (data: TTransformedValues) => Promise<void> | void;
     sx?: BoxProps["sx"];
-} & FormProviderProps<TFieldValues>) => react_jsx_runtime.JSX.Element;
+} & FormProviderProps<TFieldValues, TContext, TTransformedValues>) => react_jsx_runtime.JSX.Element;
 
 declare const FormErrorMessage: <TFieldValues extends FieldValues = FieldValues>({ name, disabled, }: {
     name: FieldName<TFieldValues>;
     disabled?: boolean;
 }) => react_jsx_runtime.JSX.Element;
 
-type FormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
-    label?: React$1.ReactNode;
-    id?: string;
-    name: TName;
-    defaultValue?: FieldPathValue<TFieldValues, TName>;
-    disabled?: boolean;
-    tooltip?: {
-        render: string | React$1.ReactNode;
-        place: 'top';
-        openOnClick?: boolean;
-        clickable?: boolean;
-    };
-    inputTooltip?: {
-        render: string | React$1.ReactNode;
-        place: 'bottom' | 'top' | 'left' | 'right';
-        openOnClick?: boolean;
-        clickable?: boolean;
-        variant?: 'info' | 'warning' | 'success' | 'error';
-        sx?: ThemeUIStyleObject<Theme>;
-    } & SxProp;
-    warning?: string | React$1.ReactNode;
-} & SxProp;
-type FormFieldCompleteProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
-    render: (props: UseControllerReturn<TFieldValues, TName>) => React$1.ReactElement;
-} & FormFieldProps<TFieldValues, TName>;
-declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, id: idProp, name, defaultValue, disabled, tooltip, inputTooltip, sx, css, render, warning, }: FormFieldCompleteProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
-
-declare const FormFieldCheckbox: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, sx, tooltip, ...checkboxProps }: FormFieldProps<TFieldValues, TName> & CheckboxProps) => react_jsx_runtime.JSX.Element;
-
-type FormFieldCreditCardNumberProps = {
-    label: string;
-    name: string;
-} & Partial<FormFieldPatternFormatProps>;
-declare const FormFieldCreditCardNumber: ({ label, name, ...formFieldPatternFormatProps }: FormFieldCreditCardNumberProps) => react_jsx_runtime.JSX.Element;
-
-type FormFieldNumericFormatProps = {
-    label?: string;
-    name: string;
-    warning?: string | React$1.ReactNode;
-    tooltip?: {
-        render: string | React$1.ReactNode;
-        place: 'top';
-        openOnClick?: boolean;
-        clickable?: boolean;
-    };
-    inputTooltip?: {
-        render: string | React$1.ReactNode;
-        place: 'bottom' | 'top' | 'left' | 'right';
-        openOnClick?: boolean;
-        clickable?: boolean;
-        variant?: 'info' | 'warning' | 'success' | 'error';
-        sx?: ThemeUIStyleObject<Theme>;
-    } & SxProp;
-} & NumericFormatProps;
-declare const FormFieldNumericFormat: ({ label, name, warning, tooltip, inputTooltip, ...numericFormatProps }: FormFieldNumericFormatProps) => react_jsx_runtime.JSX.Element;
-
-type FormFieldCurrencyInputProps = {
-    label?: string;
-    name: string;
+type FormFieldCheckboxProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<CheckboxProps, 'name'>;
+declare const FormFieldCheckbox: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldCheckboxProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
+type FormFieldCreditCardNumberProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldPatternFormatProps<TFieldValues, TName>;
+declare const FormFieldCreditCardNumber: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ format, placeholder, ...formFieldPatternFormatProps }: FormFieldCreditCardNumberProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
+type FormFieldNumericFormatProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<NumericFormatProps, 'name'>;
+declare const FormFieldNumericFormat: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldNumericFormatProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
+type FormFieldCurrencyInputProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldNumericFormatProps<TFieldValues, TName> & {
     prefix: string;
-} & FormFieldNumericFormatProps;
-declare const FormFieldCurrencyInput: ({ label, name, prefix, decimalSeparator, thousandSeparator, ...formFieldNumericFormatProps }: FormFieldCurrencyInputProps) => react_jsx_runtime.JSX.Element;
+};
+declare const FormFieldCurrencyInput: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ prefix, decimalSeparator, thousandSeparator, ...formFieldNumericFormatProps }: FormFieldCurrencyInputProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
-type FormFieldInputProps<TName> = {
-    label?: string;
-    name: TName;
-} & InputProps & FormFieldProps;
-declare const FormFieldInput: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, tooltip, sx, defaultValue, ...inputProps }: FormFieldInputProps<TName>) => react_jsx_runtime.JSX.Element;
+type FormFieldInputProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<InputProps, 'name'>;
+declare const FormFieldInput: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ defaultValue, disabled, ...props }: FormFieldInputProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
-type FormFieldPasswordProps<TName> = {
-    label?: string;
-    name: TName;
-} & InputPasswordProps & FormFieldProps;
-declare const FormFieldPassword: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, tooltip, sx, defaultValue, ...inputProps }: FormFieldPasswordProps<TName>) => react_jsx_runtime.JSX.Element;
+type FormFieldPasswordProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<InputPasswordProps, 'name'>;
+declare const FormFieldPassword: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ defaultValue, disabled, ...props }: FormFieldPasswordProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
 type FormRadioOption$2 = {
     value: string | number;
     label: string;
 };
-declare const FormFieldRadio: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, sx, options, tooltip, ...radioProps }: {
+type FormFieldRadioProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<RadioProps, 'name'> & {
     options: FormRadioOption$2[];
-} & FormFieldProps<TFieldValues, TName> & RadioProps) => react_jsx_runtime.JSX.Element;
+};
+declare const FormFieldRadio: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, options, ...props }: FormFieldRadioProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
 type FormRadioOption$1 = {
     value: string | number;
     label: string;
     description?: string;
 };
-declare const FormFieldRadioCard: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, direction, width, sx, options, tooltip, ...radioProps }: {
+type FormFieldRadioCardProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<RadioProps, 'name'> & {
     options: FormRadioOption$1[];
-    direction?: "column" | "row";
+    direction?: 'column' | 'row';
     width?: string;
-} & FormFieldProps<TFieldValues, TName> & RadioProps) => react_jsx_runtime.JSX.Element;
+};
+declare const FormFieldRadioCard: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldRadioCardProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
 type FormRadioOption = {
     value: string | number;
     label: string;
     description?: string;
-    icon?: React$1.ComponentType<{
+    icon?: React.ComponentType<{
         size?: number;
         className?: string;
     }>;
@@ -131,30 +78,21 @@ type FormRadioOption = {
         sx?: ThemeUIStyleObject;
     };
 };
-declare const FormFieldRadioCardIcony: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, direction, width, sx, options, tooltip, }: {
+type FormFieldRadioCardIconyProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & {
     options: FormRadioOption[];
-    direction?: "column" | "row";
+    direction?: 'column' | 'row';
     width?: string;
-} & FormFieldProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
-
-type FormFieldSelectProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<SelectProps, 'defaultValue'> & FormFieldProps<TFieldValues, TName>;
-declare const FormFieldSelect: <TFieldValues extends FieldValues = FieldValues>({ label, name, id, defaultValue, sx, css, disabled, tooltip, ...selectProps }: FormFieldSelectProps<TFieldValues>) => react_jsx_runtime.JSX.Element;
-
-declare const FormFieldSwitch: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, sx, tooltip, ...switchProps }: FormFieldProps<TFieldValues, TName> & SwitchProps) => react_jsx_runtime.JSX.Element;
-
-declare const FormFieldTextarea: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ label, name, warning, inputTooltip, sx, ...textareaProps }: {
-    label?: string;
-    name: TName;
-    warning?: string | React.ReactNode;
-    inputTooltip?: {
-        render: string | React.ReactNode;
-        place: "bottom" | "top" | "left" | "right";
-        openOnClick?: boolean;
-        clickable?: boolean;
-        variant?: "info" | "warning" | "success" | "error";
-        sx?: ThemeUIStyleObject<Theme>;
-    };
-} & TextareaProps) => react_jsx_runtime.JSX.Element;
+};
+declare const FormFieldRadioCardIcony: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldRadioCardIconyProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
+type FormFieldSelectProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<SelectProps, 'name' | 'defaultValue'>;
+declare const FormFieldSelect: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldSelectProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
+type FormFieldSwitchProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<SwitchProps, 'name'>;
+declare const FormFieldSwitch: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldSwitchProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
+type FormFieldTextareaProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<TextareaProps, 'name'>;
+declare const FormFieldTextarea: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ defaultValue, disabled, ...props }: FormFieldTextareaProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
 declare const useFormGroup: () => {
     level: number | undefined;
@@ -167,4 +105,4 @@ type FormGroupProps = {
 } & BoxProps;
 declare const FormGroup: (props: FormGroupProps) => react_jsx_runtime.JSX.Element;
 
-export { Form, FormErrorMessage, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, type FormRadioOption, useFormGroup };
+export { Form, FormErrorMessage, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, type FormRadioOption, useFormGroup };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/forms",
-  "version": "0.32.0",
+  "version": "0.32.2",
   "license": "MIT",
   "author": "ttoss",
   "contributors": [
@@ -32,30 +32,30 @@
   "sideEffects": true,
   "dependencies": {
     "@hookform/error-message": "^2.0.1",
-    "@hookform/resolvers": "^3.9.1",
-    "react-hook-form": "^7.54.2",
-    "react-number-format": "^5.4.3",
-    "yup": "^1.6.1"
+    "@hookform/resolvers": "^5.2.2",
+    "react-hook-form": "^7.66.1",
+    "react-number-format": "^5.4.4",
+    "yup": "^1.7.1"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
-    "@ttoss/react-i18n": "^2.0.19",
-    "@ttoss/ui": "^5.10.5"
+    "@ttoss/react-i18n": "^2.0.21",
+    "@ttoss/ui": "^5.10.7"
   },
   "devDependencies": {
     "@types/jest": "^30.0.0",
-    "@types/react": "^19.2.2",
+    "@types/react": "^19.2.6",
     "jest": "^30.2.0",
     "react": "^19.2.0",
-    "react-error-boundary": "^5.0.0",
-    "tsup": "^8.5.0",
-    "yup": "^1.6.1",
-    "@ttoss/react-icons": "^0.5.0",
-    "@ttoss/config": "^1.35.9",
-    "@ttoss/i18n-cli": "^0.7.35",
-    "@ttoss/react-i18n": "^2.0.19",
-    "@ttoss/test-utils": "^3.0.1",
-    "@ttoss/ui": "^5.10.5"
+    "react-error-boundary": "^6.0.0",
+    "tsup": "^8.5.1",
+    "yup": "^1.7.1",
+    "@ttoss/config": "^1.35.11",
+    "@ttoss/i18n-cli": "^0.7.37",
+    "@ttoss/react-i18n": "^2.0.21",
+    "@ttoss/react-icons": "^0.5.2",
+    "@ttoss/test-utils": "^3.0.3",
+    "@ttoss/ui": "^5.10.7"
   },
   "publishConfig": {
     "access": "public",

package/dist/FormFieldPatternFormat-3gBOUVd9.d.ts

@@ -1,20 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ThemeUIStyleObject, Theme } from '@ttoss/ui';
-import { PatternFormatProps } from 'react-number-format';
-
-type FormFieldPatternFormatProps = {
-    label?: string;
-    name: string;
-    warning?: string | React.ReactNode;
-    inputTooltip?: {
-        render: string | React.ReactNode;
-        place: 'bottom' | 'top' | 'left' | 'right';
-        openOnClick?: boolean;
-        clickable?: boolean;
-        variant?: 'info' | 'warning' | 'success' | 'error';
-        sx?: ThemeUIStyleObject<Theme>;
-    };
-} & PatternFormatProps;
-declare const FormFieldPatternFormat: ({ label, name, warning, inputTooltip, ...patternFormatProps }: FormFieldPatternFormatProps) => react_jsx_runtime.JSX.Element;
-
-export { type FormFieldPatternFormatProps as F, FormFieldPatternFormat as a };