@ttoss/forms 0.35.0 → 0.35.2

package/dist/Brazil/index.d.ts

@@ -1,18 +1,25 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { FieldValues, FieldPath } from 'react-hook-form';
-import { PatternFormatProps } from 'react-number-format';
-import { F as FormFieldProps, a as FormFieldPatternFormatProps } from '../FormFieldPatternFormat-D5CI6eUA.js';
+import { a as FormFieldPatternFormatProps, F as FormFieldProps } from '../FormFieldPatternFormat-D5CI6eUA.js';
+import { PatternFormatProps, NumberFormatBaseProps } from 'react-number-format';
 import '@ttoss/ui';
 import 'react';
 
+type FormFieldCEPProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<FormFieldPatternFormatProps<TFieldValues, TName>, 'format'>;
+declare const FormFieldCEP: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ placeholder, ...formFieldPatternFormatProps }: FormFieldCEPProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
 type FormFieldCNPJProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<PatternFormatProps, 'name' | 'format'>;
 declare const isCnpjValid: (cnpj: any) => boolean;
 declare const FormFieldCNPJ: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldCNPJProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
+type FormFieldCPFProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<PatternFormatProps, 'name' | 'format'>;
+declare const isCpfValid: (cpf: any) => boolean;
+declare const FormFieldCPF: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldCPFProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
+type FormFieldCPFOrCNPJProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<NumberFormatBaseProps, 'name' | 'format'>;
+declare const FormFieldCPFOrCNPJ: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldCPFOrCNPJProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
+
 type FormFieldPhoneProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & Omit<PatternFormatProps, 'name' | 'format'>;
 declare const FormFieldPhone: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldPhoneProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
 
-type FormFieldCEPProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<FormFieldPatternFormatProps<TFieldValues, TName>, 'format'>;
-declare const FormFieldCEP: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ placeholder, ...formFieldPatternFormatProps }: FormFieldCEPProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
-
-export { FormFieldCEP, FormFieldCNPJ, FormFieldPhone, isCnpjValid };
+export { FormFieldCEP, FormFieldCNPJ, FormFieldCPF, FormFieldCPFOrCNPJ, FormFieldPhone, isCnpjValid, isCpfValid };

package/dist/MultistepForm/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import '../typings.d-HZBqJJjn.js';
+import '../typings.d-BZ6kUiQ4.js';
 import * as yup from 'yup';
 import { IconType } from '@ttoss/react-icons';
 

package/dist/esm/Brazil/index.js

@@ -1,9 +1,79 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
 import * as React from 'react';
-import { FormField, FormFieldCNPJ, FormFieldPatternFormat, __name, isCnpjValid } from "../chunk-EA4K5JAO.js";
+import { FormField, FormFieldCNPJ, FormFieldCPF, FormFieldPatternFormat, __name, isCnpjValid, isCpfValid } from "../chunk-QJQFXN4B.js";
 
-// src/Brazil/FormFieldPhone.tsx
+// src/Brazil/FormFieldCEP.tsx
+var FormFieldCEP = /* @__PURE__ */__name(({
+  placeholder = "12345-678",
+  ...formFieldPatternFormatProps
+}) => {
+  return /* @__PURE__ */React.createElement(FormFieldPatternFormat, {
+    format: "#####-###",
+    placeholder,
+    ...formFieldPatternFormatProps
+  });
+}, "FormFieldCEP");
+
+// src/Brazil/FormFieldCPFOrCNPJ.tsx
 import { Input } from "@ttoss/ui";
+import { NumberFormatBase } from "react-number-format";
+var formatCPFOrCNPJ = /* @__PURE__ */__name(value => {
+  const numericValue = value.replace(/\D/g, "");
+  if (numericValue.length <= 11) {
+    return numericValue.replace(/(\d{3})(\d)/, "$1.$2").replace(/(\d{3})(\d)/, "$1.$2").replace(/(\d{3})(\d{1,2})$/, "$1-$2");
+  } else {
+    return numericValue.substring(0, 14).replace(/(\d{2})(\d)/, "$1.$2").replace(/(\d{3})(\d)/, "$1.$2").replace(/(\d{3})(\d)/, "$1/$2").replace(/(\d{4})(\d{1,2})$/, "$1-$2");
+  }
+}, "formatCPFOrCNPJ");
+var FormFieldCPFOrCNPJ = /* @__PURE__ */__name(({
+  disabled,
+  ...props
+}) => {
+  const {
+    label,
+    name,
+    labelTooltip,
+    warning,
+    sx,
+    css,
+    rules,
+    id,
+    defaultValue,
+    placeholder = "123.456.789-00 or 12.345.678/0000-00",
+    ...formatProps
+  } = props;
+  return /* @__PURE__ */React.createElement(FormField, {
+    id,
+    label,
+    name,
+    labelTooltip,
+    warning,
+    sx,
+    css,
+    defaultValue,
+    rules,
+    disabled,
+    render: /* @__PURE__ */__name(({
+      field
+    }) => {
+      return /* @__PURE__ */React.createElement(NumberFormatBase, {
+        ...formatProps,
+        value: field.value,
+        onBlur: field.onBlur,
+        onValueChange: /* @__PURE__ */__name(values => {
+          field.onChange(values.value);
+        }, "onValueChange"),
+        format: formatCPFOrCNPJ,
+        customInput: Input,
+        placeholder,
+        disabled: disabled ?? field.disabled
+      });
+    }, "render")
+  });
+}, "FormFieldCPFOrCNPJ");
+
+// src/Brazil/FormFieldPhone.tsx
+import { Input as Input2 } from "@ttoss/ui";
 import { PatternFormat } from "react-number-format";
 var FormFieldPhone = /* @__PURE__ */__name(({
   disabled,
@@ -48,23 +118,11 @@ var FormFieldPhone = /* @__PURE__ */__name(({
           field.onChange(values.value);
         }, "onValueChange"),
         format,
-        customInput: Input,
+        customInput: Input2,
         placeholder,
         disabled: disabled ?? field.disabled
       });
     }, "render")
   });
 }, "FormFieldPhone");
-
-// src/Brazil/FormFieldCEP.tsx
-var FormFieldCEP = /* @__PURE__ */__name(({
-  placeholder = "12345-678",
-  ...formFieldPatternFormatProps
-}) => {
-  return /* @__PURE__ */React.createElement(FormFieldPatternFormat, {
-    format: "#####-###",
-    placeholder,
-    ...formFieldPatternFormatProps
-  });
-}, "FormFieldCEP");
-export { FormFieldCEP, FormFieldCNPJ, FormFieldPhone, isCnpjValid };
+export { FormFieldCEP, FormFieldCNPJ, FormFieldCPF, FormFieldCPFOrCNPJ, FormFieldPhone, isCnpjValid, isCpfValid };

package/dist/esm/MultistepForm/index.js

@@ -1,7 +1,7 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
 import * as React from 'react';
-import { Form, useForm, yupResolver } from "../chunk-X2A7XW2U.js";
-import { __name } from "../chunk-EA4K5JAO.js";
+import { Form, useForm, yupResolver } from "../chunk-YXYTHWIU.js";
+import { __name } from "../chunk-QJQFXN4B.js";
 
 // src/MultistepForm/MultistepForm.tsx
 import { Flex as Flex6 } from "@ttoss/ui";

package/dist/esm/{chunk-EA4K5JAO.js → chunk-QJQFXN4B.js}

@@ -357,4 +357,86 @@ var FormFieldCNPJ = /* @__PURE__ */__name(({
     }, "render")
   });
 }, "FormFieldCNPJ");
-export { __name, FormErrorMessage, FormField, FormFieldPatternFormat, isCnpjValid, FormFieldCNPJ };
+
+// src/Brazil/FormFieldCPF.tsx
+import { Input as Input3 } from "@ttoss/ui";
+import { PatternFormat as PatternFormat3 } from "react-number-format";
+var isCpfValid = /* @__PURE__ */__name(cpf => {
+  if (cpf?.length != 11) {
+    return false;
+  }
+  if (cpf == "00000000000" || cpf == "11111111111" || cpf == "22222222222" || cpf == "33333333333" || cpf == "44444444444" || cpf == "55555555555" || cpf == "66666666666" || cpf == "77777777777" || cpf == "88888888888" || cpf == "99999999999") {
+    return false;
+  }
+  let soma = 0;
+  for (let i = 0; i < 9; i++) {
+    soma += parseInt(cpf.charAt(i)) * (10 - i);
+  }
+  let resto = soma * 10 % 11;
+  if (resto === 10 || resto === 11) {
+    resto = 0;
+  }
+  if (resto != parseInt(cpf.charAt(9))) {
+    return false;
+  }
+  soma = 0;
+  for (let i = 0; i < 10; i++) {
+    soma += parseInt(cpf.charAt(i)) * (11 - i);
+  }
+  resto = soma * 10 % 11;
+  if (resto === 10 || resto === 11) {
+    resto = 0;
+  }
+  if (resto != parseInt(cpf.charAt(10))) {
+    return false;
+  }
+  return true;
+}, "isCpfValid");
+var FormFieldCPF = /* @__PURE__ */__name(({
+  disabled,
+  ...props
+}) => {
+  const {
+    label,
+    name,
+    labelTooltip,
+    warning,
+    sx,
+    css,
+    rules,
+    id,
+    defaultValue,
+    placeholder = "123.456.789-00",
+    ...patternFormatProps
+  } = props;
+  return /* @__PURE__ */React.createElement(FormField, {
+    id,
+    label,
+    name,
+    labelTooltip,
+    warning,
+    sx,
+    css,
+    defaultValue,
+    rules,
+    disabled,
+    render: /* @__PURE__ */__name(({
+      field
+    }) => {
+      return /* @__PURE__ */React.createElement(PatternFormat3, {
+        ...patternFormatProps,
+        name: field.name,
+        value: field.value,
+        onBlur: field.onBlur,
+        onValueChange: /* @__PURE__ */__name(values => {
+          field.onChange(values.value);
+        }, "onValueChange"),
+        format: "###.###.###-##",
+        customInput: Input3,
+        placeholder,
+        disabled: disabled ?? field.disabled
+      });
+    }, "render")
+  });
+}, "FormFieldCPF");
+export { __name, FormErrorMessage, FormField, FormFieldPatternFormat, isCnpjValid, FormFieldCNPJ, isCpfValid, FormFieldCPF };

package/dist/esm/{chunk-X2A7XW2U.js → chunk-YXYTHWIU.js}

@@ -1,6 +1,6 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
 import * as React from 'react';
-import { FormErrorMessage, FormField, FormFieldPatternFormat, __name, isCnpjValid } from "./chunk-EA4K5JAO.js";
+import { FormErrorMessage, FormField, FormFieldPatternFormat, __name, isCnpjValid, isCpfValid } from "./chunk-QJQFXN4B.js";
 
 // src/Form.tsx
 import { Box } from "@ttoss/ui";
@@ -196,6 +196,51 @@ var FormFieldCurrencyInput = /* @__PURE__ */__name(({
   });
 }, "FormFieldCurrencyInput");
 
+// src/FormFieldDatePicker.tsx
+import { DatePicker } from "@ttoss/components/DatePicker";
+var FormFieldDatePicker = /* @__PURE__ */__name(({
+  disabled,
+  ...props
+}) => {
+  const {
+    label,
+    name,
+    labelTooltip,
+    warning,
+    sx,
+    css,
+    rules,
+    id,
+    defaultValue,
+    presets,
+    ...datePickerProps
+  } = props;
+  return /* @__PURE__ */React.createElement(FormField, {
+    id,
+    label,
+    name,
+    labelTooltip,
+    warning,
+    sx,
+    css,
+    defaultValue,
+    rules,
+    disabled,
+    render: /* @__PURE__ */__name(({
+      field
+    }) => {
+      return /* @__PURE__ */React.createElement(DatePicker, {
+        ...datePickerProps,
+        value: field.value,
+        onChange: /* @__PURE__ */__name(range => {
+          field.onChange(range);
+        }, "onChange"),
+        presets
+      });
+    }, "render")
+  });
+}, "FormFieldDatePicker");
+
 // src/FormFieldInput.tsx
 import { Input as Input2 } from "@ttoss/ui";
 var FormFieldInput = /* @__PURE__ */__name(({
@@ -901,6 +946,11 @@ yup.addMethod(yup.string, "cnpj", function () {
     return isCnpjValid(value);
   });
 });
+yup.addMethod(yup.string, "cpf", function () {
+  return this.test("valid-cpf", "Invalid CPF", value => {
+    return isCpfValid(value);
+  });
+});
 yup.addMethod(yup.string, "password", function ({
   required
 } = {}) {
@@ -918,4 +968,4 @@ import * as yup2 from "yup";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { Controller, FormProvider as FormProvider2, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch } from "react-hook-form";
 export * from "react-hook-form";
-export { Form, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldNumericFormat, FormFieldCurrencyInput, FormFieldInput, FormFieldPassword, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, useFormGroup, FormGroup, yup2 as yup, yupResolver, Controller, FormProvider2 as FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };
+export { Form, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldNumericFormat, FormFieldCurrencyInput, FormFieldDatePicker, FormFieldInput, FormFieldPassword, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, useFormGroup, FormGroup, yup2 as yup, yupResolver, Controller, FormProvider2 as FormProvider, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };

package/dist/esm/index.js

@@ -1,4 +1,4 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-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-X2A7XW2U.js";
-import { FormErrorMessage, FormField, FormFieldPatternFormat } from "./chunk-EA4K5JAO.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 };
+import { Controller, Form, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldDatePicker, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, FormProvider, useController, useFieldArray, useForm, useFormContext, useFormGroup, useFormState, useWatch, yup, yupResolver } from "./chunk-YXYTHWIU.js";
+import { FormErrorMessage, FormField, FormFieldPatternFormat } from "./chunk-QJQFXN4B.js";
+export { Controller, Form, FormErrorMessage, FormField, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldDatePicker, 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

@@ -7,7 +7,8 @@ export { Controller, FormProvider, useController, useFieldArray, useForm, useFor
 import { F as FormFieldProps, a as FormFieldPatternFormatProps } from './FormFieldPatternFormat-D5CI6eUA.js';
 export { b as FormField, c as FormFieldPatternFormat } from './FormFieldPatternFormat-D5CI6eUA.js';
 import { NumericFormatProps } from 'react-number-format';
-import './typings.d-HZBqJJjn.js';
+import { DateRange } from '@ttoss/components/DatePicker';
+import './typings.d-BZ6kUiQ4.js';
 import * as yup from 'yup';
 export { yup };
 export { yupResolver } from '@hookform/resolvers/yup';
@@ -39,6 +40,15 @@ type FormFieldCurrencyInputProps<TFieldValues extends FieldValues = FieldValues,
 };
 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;
 
+interface DateRangePreset {
+    label: string;
+    getValue: () => DateRange;
+}
+type FormFieldDatePickerProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = FormFieldProps<TFieldValues, TName> & {
+    presets?: DateRangePreset[];
+};
+declare const FormFieldDatePicker: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ disabled, ...props }: FormFieldDatePickerProps<TFieldValues, 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;
 
@@ -107,4 +117,4 @@ type FormGroupProps = {
 } & BoxProps;
 declare const FormGroup: (props: FormGroupProps) => react_jsx_runtime.JSX.Element;
 
-export { Form, FormErrorMessage, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldProps, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, type FormRadioOption, useFormGroup };
+export { type DateRangePreset, Form, FormErrorMessage, FormFieldCheckbox, FormFieldCreditCardNumber, FormFieldCurrencyInput, FormFieldDatePicker, FormFieldInput, FormFieldNumericFormat, FormFieldPassword, FormFieldProps, FormFieldRadio, FormFieldRadioCard, FormFieldRadioCardIcony, FormFieldSelect, FormFieldSwitch, FormFieldTextarea, FormGroup, type FormRadioOption, useFormGroup };

package/dist/{typings.d-HZBqJJjn.d.ts → typings.d-BZ6kUiQ4.d.ts}

@@ -8,5 +8,6 @@ declare module 'yup' {
     TFlags extends Flags = '',
   > extends Schema<TType, TContext, TDefault, TFlags> {
     cnpj(): this;
+    cpf(): this;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/forms",
-  "version": "0.35.0",
+  "version": "0.35.2",
   "license": "MIT",
   "author": "ttoss",
   "contributors": [
@@ -39,6 +39,7 @@
   },
   "peerDependencies": {
     "react": ">=16.8.0",
+    "@ttoss/components": "^2.10.1",
     "@ttoss/react-i18n": "^2.0.24",
     "@ttoss/ui": "^6.0.4"
   },
@@ -50,10 +51,11 @@
     "react-error-boundary": "^6.0.0",
     "tsup": "^8.5.1",
     "yup": "^1.7.1",
+    "@ttoss/components": "^2.10.1",
     "@ttoss/config": "^1.35.12",
     "@ttoss/react-i18n": "^2.0.24",
-    "@ttoss/react-icons": "^0.5.5",
     "@ttoss/i18n-cli": "^0.7.38",
+    "@ttoss/react-icons": "^0.5.5",
     "@ttoss/test-utils": "^4.0.1",
     "@ttoss/ui": "^6.0.4"
   },