@digigov/form 2.0.0-a402a664 → 2.0.0-aa380ec7

package/src/validators/index.ts

@@ -1,13 +1,14 @@
-import { MutableRefObject, useMemo } from 'react';
+import type { MutableRefObject } from 'react';
+import { useMemo } from 'react';
 import * as yup from 'yup';
-import { AnyObjectSchema, StringSchema } from 'yup';
-import { RequiredArraySchema } from 'yup/lib/array';
-import Lazy from 'yup/lib/Lazy';
-import { MixedSchema } from 'yup/lib/mixed';
-import { TypeOfShape, AssertsShape } from 'yup/lib/object';
-import { AnyObject } from 'yup/lib/types';
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { AnyObjectSchema, StringSchema } from 'yup';
+import type { RequiredArraySchema } from 'yup/lib/array';
+import type Lazy from 'yup/lib/Lazy';
+import type { MixedSchema } from 'yup/lib/mixed';
+import type { TypeOfShape, AssertsShape } from 'yup/lib/object';
+import type { AnyObject } from 'yup/lib/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 import {
   getYupObjectShape,
   AFM_VALIDATOR,
@@ -28,6 +29,7 @@ import {
   LATER_THAN_DATETIME_VALIDATOR,
   EARLIER_THAN_DATETIME_VALIDATOR,
 } from '@digigov/form/validators/utils';
+import { EMAIL_VALIDATOR } from '@digigov/form/validators/utils/email';
 import { INT_VALIDATOR } from '@digigov/form/validators/utils/int';
 import { NUMBER_VALIDATOR } from '@digigov/form/validators/utils/number';
 
@@ -103,12 +105,14 @@ export const getYUPTypeMap = (
             key: 'form.error.array.min',
             context: {
               min: field.extra.min,
+              max: field.extra.max || undefined,
             },
           });
         if (field.extra.max)
           arrayValidator = arrayValidator.max(field.extra.max, {
             key: 'form.error.array.max',
             context: {
+              min: field.extra.min || undefined,
               max: field.extra.max,
             },
           });
@@ -133,8 +137,8 @@ export const getYUPTypeMap = (
         .test(INT_VALIDATOR()),
     email: (field): yup.StringSchema =>
       field.trim
-        ? yup.string().trim().email('form.error.email')
-        : yup.string().email('form.error.email'),
+        ? yup.string().trim().test(EMAIL_VALIDATOR)
+        : yup.string().test(EMAIL_VALIDATOR),
     afm: (field): yup.StringSchema =>
       field.trim
         ? yup.string().trim().test(AFM_VALIDATOR)
@@ -239,5 +243,5 @@ export function useValidationSchema(
   return useMemo(() => {
     const yupTypeMap = getYUPTypeMap(validatorRegistry);
     return getYupObjectShape(fields, yupTypeMap, validatorRegistry);
-  }, []);
+  }, [fields, validatorRegistry]);
 }

package/src/validators/types.ts

@@ -1,2 +1,2 @@
-import * as yup from 'yup';
+import type * as yup from 'yup';
 export type ValidatorSchema = yup.TestConfig;

package/src/validators/utils/date.ts

@@ -1,20 +1,24 @@
 import dayjs from 'dayjs';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 dayjs.extend(customParseFormat);
 
 const VALID_DATE_FORMATS = ['DD/MM/YYYY'];
 const DATE_CACHE = {};
+const onlyNumbersRegex = /^\d+$/;
 
 const getDate = (v: string) => {
   return DATE_CACHE[v] ? DATE_CACHE[v] : dayjs(v, VALID_DATE_FORMATS, true);
 };
 
+const getDaysInMonth = (month: number, year: number): number => {
+  return dayjs(`${year}-${month}-01`).daysInMonth(); // e.g. 29 for Feb 2024
+};
+
 // Function to check partial date completion
 const checkPartialDate = (value: string) => {
-  console.log("value.split('/')", value.split('/'));
   const [day, month, year] = value.split('/');
   if (day && !month && !year) {
     return 'form.error.date.invalid_month_year';
@@ -33,9 +37,29 @@ const checkPartialDate = (value: string) => {
   }
   if (!day && month && year) {
     return 'form.error.date.invalid_day';
-  } else {
-    return 'form.error.date.invalid';
   }
+  if (day && month) {
+    const dayNum = parseInt(day);
+    const monthNum = parseInt(month);
+    const validYear = onlyNumbersRegex.test(year) ? year : undefined;
+    if (!validYear || year.length < 4) {
+      return 'form.error.date.invalid';
+    }
+    const yearNum = parseInt(validYear);
+    const maxDay = getDaysInMonth(monthNum, yearNum);
+    if (dayNum < 1 || dayNum > maxDay) {
+      return {
+        key: 'form.error.date.invalid_day_range',
+        context: {
+          maxDay: maxDay,
+        },
+      };
+    }
+    if (monthNum < 1 || monthNum > 12) {
+      return 'form.error.datetime.invalid_month_range';
+    }
+  }
+  return 'form.error.date.invalid';
 };
 
 export const LATER_THAN_VALIDATOR = (field: FieldSpec): ValidatorSchema => {
@@ -96,7 +120,7 @@ export const EARLIER_THAN_VALIDATOR = (field: FieldSpec): ValidatorSchema => {
 
 export const DATE_VALIDATOR = {
   name: 'date-validator',
-  message: (v): string => {
+  message: (v): string | object => {
     return checkPartialDate(v.value);
   },
   test: function (value: string) {

package/src/validators/utils/datetime.ts

@@ -1,12 +1,13 @@
 import dayjs from 'dayjs';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 dayjs.extend(customParseFormat);
 
 const VALID_DATETIME_FORMATS = ['DD/MM/YYYY HH:mm'];
 const DATETIME_CACHE = {};
+const onlyNumbersRegex = /^\d+$/;
 
 const getDateTime = (v: string) => {
   return DATETIME_CACHE[v]
@@ -14,54 +15,145 @@ const getDateTime = (v: string) => {
     : dayjs(v, VALID_DATETIME_FORMATS, true);
 };
 
-// Function to check partial datetime completion
+const getDaysInMonth = (month: number, year: number): number => {
+  return dayjs(`${year}-${month}-01`).daysInMonth(); // e.g. 29 for Feb 2024
+};
+
 const checkPartialDateTime = (value: string) => {
   const [datePart, timePart] = value.split(' ');
-  const [day, month, year] = datePart.split('/');
-  const [hours, minutes] = timePart ? timePart.split(':') : [null, null];
+  const [day, month, year] = datePart?.split('/') ?? [];
+  const [hours, minutes] = timePart?.split(':') ?? [];
+
+  const hasDay = Boolean(day);
+  const hasMonth = Boolean(month);
+  const hasYear = Boolean(year);
+  const hasHours = Boolean(hours);
+  const hasMinutes = Boolean(minutes);
 
-  // Check date part first
-  if (day && !month && !year) {
+  if (hasDay && !hasMonth && !hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_month_year_hours_minutes';
+  }
+  if (!hasDay && hasMonth && !hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_day_year_hours_minutes';
+  }
+  if (!hasDay && !hasMonth && hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_day_month_hours_minutes';
+  }
+  if (hasDay && hasMonth && !hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_year_hours_minutes';
+  }
+  if (hasDay && !hasMonth && hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_month_hours_minutes';
+  }
+  if (!hasDay && hasMonth && hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_day_hours_minutes';
+  }
+  if (hasDay && hasMonth && hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid__hours_minutes';
+  }
+  if (hasDay && hasMonth && hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_minutes';
+  }
+  if (hasDay && hasMonth && hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_hours';
+  }
+  if (hasDay && !hasMonth && !hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_month_year_minutes';
+  }
+  if (hasDay && !hasMonth && !hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_month_year_hours';
+  }
+  if (hasDay && !hasMonth && !hasYear && hasHours && hasMinutes) {
     return 'form.error.datetime.invalid_month_year';
   }
-  if (!day && month && !year) {
+  if (!hasDay && hasMonth && !hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_day_year_minutes';
+  }
+  if (!hasDay && hasMonth && !hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_day_year_hours';
+  }
+  if (!hasDay && hasMonth && !hasYear && hasHours && hasMinutes) {
     return 'form.error.datetime.invalid_day_year';
   }
-  if (!day && !month && year) {
+  if (!hasDay && !hasMonth && hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_day_month_minutes';
+  }
+  if (!hasDay && !hasMonth && hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_day_month_hours';
+  }
+  if (!hasDay && !hasMonth && hasYear && hasHours && hasMinutes) {
     return 'form.error.datetime.invalid_day_month';
   }
-  if (day && month && !year) {
+  if (!hasDay && !hasMonth && !hasYear && hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_day_month_year';
+  }
+  if (!hasDay && !hasMonth && !hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_day_month_year_hours';
+  }
+  if (hasDay && hasMonth && !hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_year_minutes';
+  }
+  if (hasDay && hasMonth && !hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_year_hours';
+  }
+  if (hasDay && hasMonth && !hasYear && hasHours && hasMinutes) {
     return 'form.error.datetime.invalid_year';
   }
-  if (day && !month && year) {
+  if (hasDay && !hasMonth && hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_month_minutes';
+  }
+  if (hasDay && !hasMonth && hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_month_hours';
+  }
+  if (hasDay && !hasMonth && hasYear && hasHours && hasMinutes) {
     return 'form.error.datetime.invalid_month';
   }
-  if (!day && month && year) {
+  if (!hasDay && hasMonth && hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_day_minutes';
+  }
+  if (!hasDay && hasMonth && hasYear && !hasHours && hasMinutes) {
+    return 'form.error.datetime.invalid_day_hours';
+  }
+  if (!hasDay && hasMonth && hasYear && hasHours && hasMinutes) {
     return 'form.error.datetime.invalid_day';
   }
-  // If date is complete, check time part
-  if (day && month && year) {
-    if (hours && !minutes) {
-      return 'form.error.datetime.invalid_minutes';
+  if (!hasDay && !hasMonth && !hasYear && hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_day_month_year_minutes';
+  }
+  if (hasDay && hasMonth && hasYear && !hasHours && !hasMinutes) {
+    return 'form.error.datetime.invalid_hours_minutes';
+  }
+  if (day && month) {
+    const dayNum = parseInt(day);
+    const monthNum = parseInt(month);
+    const validYear = onlyNumbersRegex.test(year) ? year : undefined;
+    if (!validYear || year.length < 4) {
+      return 'form.error.datetime.invalid';
     }
-    if (!hours && minutes) {
-      return 'form.error.datetime.invalid_hours';
+    const yearNum = parseInt(validYear);
+    const maxDay = getDaysInMonth(monthNum, yearNum);
+    if (dayNum < 1 || dayNum > maxDay) {
+      return {
+        key: 'form.error.datetime.invalid_day_range',
+        context: {
+          maxDay: maxDay,
+        },
+      };
     }
-    if (!hours && !minutes) {
-      return 'form.error.datetime.invalid';
+    if (monthNum < 1 || monthNum > 12) {
+      return 'form.error.datetime.invalid_month_range';
+    }
+  }
+  if (hours && minutes) {
+    const hoursNum = parseInt(hours);
+    const minutesNum = parseInt(minutes);
+    if (hoursNum < 0 || hoursNum > 23) {
+      return 'form.error.datetime.invalid_hours_range';
     }
-    if (hours && minutes) {
-      const hoursNum = parseInt(hours);
-      const minutesNum = parseInt(minutes);
-      if (hoursNum < 0 || hoursNum > 23) {
-        return 'form.error.datetime.invalid_hours_range';
-      }
-      if (minutesNum < 0 || minutesNum > 59) {
-        return 'form.error.datetime.invalid_minutes_range';
-      }
+    if (minutesNum < 0 || minutesNum > 59) {
+      return 'form.error.datetime.invalid_minutes_range';
     }
   }
-
   return 'form.error.datetime.invalid';
 };
 
@@ -119,7 +211,7 @@ export const EARLIER_THAN_DATETIME_VALIDATOR = (
 
 export const DATETIME_VALIDATOR = {
   name: 'datetime-validator',
-  message: (v): string => {
+  message: (v): string | object => {
     return checkPartialDateTime(v.value);
   },
   test: function (value: string) {

package/src/validators/utils/email.ts

@@ -0,0 +1,11 @@
+export const EMAIL_VALIDATOR = {
+  name: 'email-validator',
+  message: 'form.error.email',
+  test: (value: string): boolean => {
+    if (!value) return true;
+    const EMAIL_REGEX =
+      // eslint-disable-next-line no-useless-escape
+      /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+    return EMAIL_REGEX.test(value);
+  },
+};

package/src/validators/utils/file.ts

@@ -1,5 +1,5 @@
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 const DEFAULT_FILE_MAX_SIZE = 10000000;
 

package/src/validators/utils/iban.ts

@@ -1,5 +1,5 @@
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 export function validateIban(value: string, countryCode: string): boolean {
   value = value.replace(/\s/g, '').replace(/-/g, '');
   if (value.match(/^[0-9]*$/i)) {

package/src/validators/utils/image.ts

@@ -1,5 +1,5 @@
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 const DEFAULT_IMAGE_MAX_HEIGHT_SIZE = 2000;
 const DEFAULT_IMAGE_MAX_WIDTH_SIZE = 2000;

package/src/validators/utils/index.ts

@@ -1,6 +1,6 @@
 import * as yup from 'yup';
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 export * from '@digigov/form/validators/utils/afm';
 export * from '@digigov/form/validators/utils/amka';

package/src/validators/utils/int.ts

@@ -1,4 +1,4 @@
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 export function validateIntNumber(number: number): boolean {
   if (number === undefined) {

package/src/validators/utils/number.ts

@@ -1,4 +1,4 @@
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 export function validateNumber(number: number): boolean {
   return !Number.isNaN(number);

package/src/validators/utils/otp.ts

@@ -1,5 +1,5 @@
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 export function validateOtp(value: string, maxLength: number): boolean {
   if (value.length === maxLength) {
     return true;

package/src/validators/utils/phone.ts

@@ -1,5 +1,5 @@
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 export type PhoneNumberType = 'landline' | 'mobile' | null;
 // add more countries from here libphonenumber-js/metadata.full.json

package/src/validators/utils/postal_code.ts

@@ -1,5 +1,5 @@
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 const CODE_REGEX = /^[12345678][0-9]{4}$/;
 export function validatePostalCode(

package/src/validators/utils/text_limit.ts

@@ -1,5 +1,5 @@
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 
 export function validateText(value: string, min: number, max: number): boolean {
   let validator;

package/types.d.ts

@@ -1,6 +1,7 @@
-import { UseFormReturn, UseFormProps, ErrorOption } from 'react-hook-form';
-import { FieldComponentRegistry, FieldLabelProps, FieldSpec, FormData } from '@digigov/form/Field/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { UseFormReturn, UseFormProps, ErrorOption } from 'react-hook-form';
+import type { FieldLabelProps, FieldSpec, FormData } from '@digigov/form/Field/types';
+import type { FieldComponentRegistry } from '@digigov/form/inputs/registry';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 export * from '@digigov/form/Field/types';
 export interface FieldError {
     message: string;
@@ -11,25 +12,29 @@ export interface FieldsetSpec {
     label?: FieldLabelProps;
     body?: React.ReactNode;
 }
+export type registerFieldFocus = (fieldName: string, element: HTMLElement) => (name: string) => void;
 export interface FormContextProps {
     fieldsetsMap?: Record<string, FieldsetSpec>;
     fieldsMap: Record<string, FieldSpec>;
     control: UseFormReturn['control'];
     register: UseFormReturn['register'];
     trigger: UseFormReturn['trigger'];
+    setError: UseFormReturn['setError'];
     clearErrors: UseFormReturn['clearErrors'];
     watch: UseFormReturn['watch'];
     getFieldState: UseFormReturn['getFieldState'];
     setValue: UseFormReturn['setValue'];
     getValues: UseFormReturn['getValues'];
+    getValuesFromParentForm?: UseFormReturn['getValues'];
     unregister: UseFormReturn['unregister'];
     formState: UseFormReturn['formState'];
     reset: UseFormReturn['reset'];
     resetField: UseFormReturn['resetField'];
     registerField: (field: FieldSpec) => void;
+    registerFieldFocus: registerFieldFocus;
     errors: UseFormReturn['formState']['errors'];
     componentRegistry?: FieldComponentRegistry;
-    submit: () => Promise<void>;
+    submit: () => Promise<void> | void;
 }
 export interface FormBuilderProps {
     fields?: FieldSpec[];

package/types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/types.tsx"],
-  "sourcesContent": ["import { UseFormReturn, UseFormProps, ErrorOption } from 'react-hook-form';\nimport {\n  FieldComponentRegistry,\n  FieldLabelProps,\n  FieldSpec,\n  FormData,\n} from '@digigov/form/Field/types';\nimport { ValidatorSchema } from '@digigov/form/validators/types';\nexport * from '@digigov/form/Field/types';\nexport interface FieldError {\n  message: string;\n}\n\nexport interface FieldsetSpec {\n  key: string;\n  fields: string[];\n  label?: FieldLabelProps;\n  body?: React.ReactNode;\n}\n\nexport interface FormContextProps {\n  fieldsetsMap?: Record<string, FieldsetSpec>;\n  fieldsMap: Record<string, FieldSpec>;\n  control: UseFormReturn['control'];\n  register: UseFormReturn['register'];\n  trigger: UseFormReturn['trigger'];\n  clearErrors: UseFormReturn['clearErrors'];\n  watch: UseFormReturn['watch'];\n  getFieldState: UseFormReturn['getFieldState'];\n  setValue: UseFormReturn['setValue'];\n  getValues: UseFormReturn['getValues'];\n  unregister: UseFormReturn['unregister'];\n  formState: UseFormReturn['formState'];\n  reset: UseFormReturn['reset'];\n  resetField: UseFormReturn['resetField'];\n  registerField: (field: FieldSpec) => void;\n  errors: UseFormReturn['formState']['errors'];\n  componentRegistry?: FieldComponentRegistry;\n  submit: () => Promise<void>;\n}\n\nexport interface FormBuilderProps {\n  fields?: FieldSpec[];\n  fieldsets?: FieldsetSpec[];\n  initial?: FormData;\n  onSubmit?: (data: FormData) => void | null | FieldError[];\n  mode?: UseFormProps['mode'];\n  reValidateMode?: UseFormProps['reValidateMode'];\n  criteriaMode?: UseFormProps['criteriaMode'];\n  children?: React.ReactNode;\n  shouldFocusError?: boolean;\n  auto?: boolean;\n  validatorRegistry?: Record<string, ValidatorSchema[]>;\n  componentRegistry?: FieldComponentRegistry;\n  grid?: boolean;\n  controlledFieldsOnly?: boolean;\n  errors?: ErrorOption;\n}\n\nexport interface FormBaseProps\n  extends Omit<FormBuilderProps, 'fields' | 'fieldsets' | 'auto'> {\n  fieldsetsMap?: Record<string, FieldsetSpec>;\n  fieldsMap: Record<string, FieldSpec>;\n  registerField: (field: FieldSpec) => void;\n  resolver: any;\n}\n"],
+  "sourcesContent": ["import type { UseFormReturn, UseFormProps, ErrorOption } from 'react-hook-form';\nimport type {\n  FieldLabelProps,\n  FieldSpec,\n  FormData,\n} from '@digigov/form/Field/types';\nimport type { FieldComponentRegistry } from '@digigov/form/inputs/registry';\nimport type { ValidatorSchema } from '@digigov/form/validators/types';\nexport * from '@digigov/form/Field/types';\nexport interface FieldError {\n  message: string;\n}\n\nexport interface FieldsetSpec {\n  key: string;\n  fields: string[];\n  label?: FieldLabelProps;\n  body?: React.ReactNode;\n}\n\nexport type registerFieldFocus = (\n  fieldName: string,\n  element: HTMLElement\n) => (name: string) => void;\n\nexport interface FormContextProps {\n  fieldsetsMap?: Record<string, FieldsetSpec>;\n  fieldsMap: Record<string, FieldSpec>;\n  control: UseFormReturn['control'];\n  register: UseFormReturn['register'];\n  trigger: UseFormReturn['trigger'];\n  setError: UseFormReturn['setError'];\n  clearErrors: UseFormReturn['clearErrors'];\n  watch: UseFormReturn['watch'];\n  getFieldState: UseFormReturn['getFieldState'];\n  setValue: UseFormReturn['setValue'];\n  getValues: UseFormReturn['getValues'];\n  getValuesFromParentForm?: UseFormReturn['getValues'];\n  unregister: UseFormReturn['unregister'];\n  formState: UseFormReturn['formState'];\n  reset: UseFormReturn['reset'];\n  resetField: UseFormReturn['resetField'];\n  registerField: (field: FieldSpec) => void;\n  registerFieldFocus: registerFieldFocus;\n  errors: UseFormReturn['formState']['errors'];\n  componentRegistry?: FieldComponentRegistry;\n  submit: () => Promise<void> | void;\n}\n\nexport interface FormBuilderProps {\n  fields?: FieldSpec[];\n  fieldsets?: FieldsetSpec[];\n  initial?: FormData;\n  onSubmit?: (data: FormData) => void | null | FieldError[];\n  mode?: UseFormProps['mode'];\n  reValidateMode?: UseFormProps['reValidateMode'];\n  criteriaMode?: UseFormProps['criteriaMode'];\n  children?: React.ReactNode;\n  shouldFocusError?: boolean;\n  auto?: boolean;\n  validatorRegistry?: Record<string, ValidatorSchema[]>;\n  componentRegistry?: FieldComponentRegistry;\n  grid?: boolean;\n  controlledFieldsOnly?: boolean;\n  errors?: ErrorOption;\n}\n\nexport interface FormBaseProps\n  extends Omit<FormBuilderProps, 'fields' | 'fieldsets' | 'auto'> {\n  fieldsetsMap?: Record<string, FieldsetSpec>;\n  fieldsMap: Record<string, FieldSpec>;\n  registerField: (field: FieldSpec) => void;\n  resolver: any;\n}\n"],
   "mappings": "AAQA,cAAc;",
   "names": []
 }

package/utils.d.ts

@@ -1,4 +1,4 @@
-import { FieldError } from 'react-hook-form';
+import type { FieldError } from 'react-hook-form';
 export declare const yupResolver: (schema: any, schemaOptions?: any, resolverOptions?: any) => (values: any, context: any, options: any) => Promise<{
     values: any;
     errors: {};

package/utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/utils.ts"],
-  "sourcesContent": ["import { validateFieldsNatively } from '@hookform/resolvers';\nimport { appendErrors, FieldError } from 'react-hook-form';\nimport * as Yup from 'yup';\n\n/**\n * Why `path!` ? because it could be `undefined` in some case\n * https://github.com/jquense/yup#validationerrorerrors-string--arraystring-value-any-path-string\n */\nconst parseErrorSchema = (\n  error: Yup.ValidationError,\n  validateAllFieldCriteria: boolean\n) => {\n  return (error.inner || []).reduce<Record<string, FieldError>>(\n    (previous, error) => {\n      error.path = error.path?.replace(/\\[([0-9]+)\\]/g, '.$1');\n      // error.path = error.path?.replace(/\\[\"(.*?)\"\\]/g, '$1');\n      if (!previous[error.path!]) {\n        previous[error.path!] = { message: error.message, type: error.type! };\n      }\n\n      if (validateAllFieldCriteria) {\n        const types = previous[error.path!].types;\n        const messages = types && types[error.type!];\n\n        previous[error.path!] = appendErrors(\n          error.path!,\n          validateAllFieldCriteria,\n          previous,\n          error.type!,\n          messages\n            ? ([] as string[]).concat(messages as string[], error.message)\n            : error.message\n        ) as FieldError;\n      }\n\n      return previous;\n    },\n    {}\n  );\n};\nfunction isPlainObject(obj) {\n  return (\n    typeof obj === 'object' &&\n    obj !== null &&\n    Object.prototype.toString.call(obj) === '[object Object]'\n  );\n}\nfunction flattenObject(obj, prefix = '') {\n  return Object.keys(obj).reduce((acc, key) => {\n    const prefixedKey = prefix ? `${prefix}.${key}` : key;\n\n    if (isPlainObject(obj[key])) {\n      Object.assign(acc, flattenObject(obj[key], prefixedKey));\n    } else {\n      acc[prefixedKey] = obj[key];\n    }\n\n    return acc;\n  }, {});\n}\n\nexport const yupResolver =\n  (schema: any, schemaOptions: any = {}, resolverOptions: any = {}) =>\n  async (values, context, options) => {\n    try {\n      if (schemaOptions.context && process.env.NODE_ENV === 'development') {\n        console.warn(\n          \"You should not used the yup options context. Please, use the 'useForm' context object instead\"\n        );\n      }\n\n      const result = await schema[\n        resolverOptions.mode === 'sync' ? 'validateSync' : 'validate'\n      ](\n        flattenObject(values),\n        Object.assign({ abortEarly: false }, schemaOptions, { context })\n      );\n\n      if (options.shouldUseNativeValidation)\n        validateFieldsNatively({}, options);\n\n      return {\n        values: resolverOptions.rawValues ? values : result,\n        errors: {},\n      };\n    } catch (e) {\n      if (!e.inner) {\n        throw e;\n      }\n\n      return {\n        values: {},\n        errors: parseErrorSchema(\n          e,\n          !options.shouldUseNativeValidation && options.criteriaMode === 'all'\n        ),\n        options,\n      };\n    }\n  };\n"],
-  "mappings": "AAAA,SAAS,8BAA8B;AACvC,SAAS,oBAAgC;AAOzC,MAAM,mBAAmB,CACvB,OACA,6BACG;AACH,UAAQ,MAAM,SAAS,CAAC,GAAG;AAAA,IACzB,CAAC,UAAUA,WAAU;AACnB,MAAAA,OAAM,OAAOA,OAAM,MAAM,QAAQ,iBAAiB,KAAK;AAEvD,UAAI,CAAC,SAASA,OAAM,IAAK,GAAG;AAC1B,iBAASA,OAAM,IAAK,IAAI,EAAE,SAASA,OAAM,SAAS,MAAMA,OAAM,KAAM;AAAA,MACtE;AAEA,UAAI,0BAA0B;AAC5B,cAAM,QAAQ,SAASA,OAAM,IAAK,EAAE;AACpC,cAAM,WAAW,SAAS,MAAMA,OAAM,IAAK;AAE3C,iBAASA,OAAM,IAAK,IAAI;AAAA,UACtBA,OAAM;AAAA,UACN;AAAA,UACA;AAAA,UACAA,OAAM;AAAA,UACN,WACK,CAAC,EAAe,OAAO,UAAsBA,OAAM,OAAO,IAC3DA,OAAM;AAAA,QACZ;AAAA,MACF;AAEA,aAAO;AAAA,IACT;AAAA,IACA,CAAC;AAAA,EACH;AACF;AACA,SAAS,cAAc,KAAK;AAC1B,SACE,OAAO,QAAQ,YACf,QAAQ,QACR,OAAO,UAAU,SAAS,KAAK,GAAG,MAAM;AAE5C;AACA,SAAS,cAAc,KAAK,SAAS,IAAI;AACvC,SAAO,OAAO,KAAK,GAAG,EAAE,OAAO,CAAC,KAAK,QAAQ;AAC3C,UAAM,cAAc,SAAS,GAAG,MAAM,IAAI,GAAG,KAAK;AAElD,QAAI,cAAc,IAAI,GAAG,CAAC,GAAG;AAC3B,aAAO,OAAO,KAAK,cAAc,IAAI,GAAG,GAAG,WAAW,CAAC;AAAA,IACzD,OAAO;AACL,UAAI,WAAW,IAAI,IAAI,GAAG;AAAA,IAC5B;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,CAAC;AACP;AAEO,MAAM,cACX,CAAC,QAAa,gBAAqB,CAAC,GAAG,kBAAuB,CAAC,MAC/D,OAAO,QAAQ,SAAS,YAAY;AAClC,MAAI;AACF,QAAI,cAAc,WAAW,QAAQ,IAAI,aAAa,eAAe;AACnE,cAAQ;AAAA,QACN;AAAA,MACF;AAAA,IACF;AAEA,UAAM,SAAS,MAAM,OACnB,gBAAgB,SAAS,SAAS,iBAAiB,UACrD;AAAA,MACE,cAAc,MAAM;AAAA,MACpB,OAAO,OAAO,EAAE,YAAY,MAAM,GAAG,eAAe,EAAE,QAAQ,CAAC;AAAA,IACjE;AAEA,QAAI,QAAQ;AACV,6BAAuB,CAAC,GAAG,OAAO;AAEpC,WAAO;AAAA,MACL,QAAQ,gBAAgB,YAAY,SAAS;AAAA,MAC7C,QAAQ,CAAC;AAAA,IACX;AAAA,EACF,SAAS,GAAG;AACV,QAAI,CAAC,EAAE,OAAO;AACZ,YAAM;AAAA,IACR;AAEA,WAAO;AAAA,MACL,QAAQ,CAAC;AAAA,MACT,QAAQ;AAAA,QACN;AAAA,QACA,CAAC,QAAQ,6BAA6B,QAAQ,iBAAiB;AAAA,MACjE;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
+  "sourcesContent": ["import { validateFieldsNatively } from '@hookform/resolvers';\nimport type { FieldError } from 'react-hook-form';\nimport { appendErrors } from 'react-hook-form';\nimport type * as Yup from 'yup';\n\n/**\n * Why `path!` ? because it could be `undefined` in some case\n * https://github.com/jquense/yup#validationerrorerrors-string--arraystring-value-any-path-string\n */\nconst parseErrorSchema = (\n  error: Yup.ValidationError,\n  validateAllFieldCriteria: boolean\n) => {\n  return (error.inner || []).reduce<Record<string, FieldError>>(\n    (previous, error) => {\n      error.path = error.path?.replace(/\\[([0-9]+)\\]/g, '.$1');\n      // error.path = error.path?.replace(/\\[\"(.*?)\"\\]/g, '$1');\n      if (!previous[error.path!]) {\n        previous[error.path!] = { message: error.message, type: error.type! };\n      }\n\n      if (validateAllFieldCriteria) {\n        const types = previous[error.path!].types;\n        const messages = types && types[error.type!];\n\n        previous[error.path!] = appendErrors(\n          error.path!,\n          validateAllFieldCriteria,\n          previous,\n          error.type!,\n          messages\n            ? ([] as string[]).concat(messages as string[], error.message)\n            : error.message\n        ) as FieldError;\n      }\n\n      return previous;\n    },\n    {}\n  );\n};\nfunction isPlainObject(obj) {\n  return (\n    typeof obj === 'object' &&\n    obj !== null &&\n    Object.prototype.toString.call(obj) === '[object Object]'\n  );\n}\nfunction flattenObject(obj, prefix = '') {\n  return Object.keys(obj).reduce((acc, key) => {\n    const prefixedKey = prefix ? `${prefix}.${key}` : key;\n\n    if (isPlainObject(obj[key])) {\n      Object.assign(acc, flattenObject(obj[key], prefixedKey));\n    } else {\n      acc[prefixedKey] = obj[key];\n    }\n\n    return acc;\n  }, {});\n}\n\nexport const yupResolver =\n  (schema: any, schemaOptions: any = {}, resolverOptions: any = {}) =>\n  async (values, context, options) => {\n    try {\n      if (schemaOptions.context && process.env.NODE_ENV === 'development') {\n        console.warn(\n          \"You should not used the yup options context. Please, use the 'useForm' context object instead\"\n        );\n      }\n\n      const result = await schema[\n        resolverOptions.mode === 'sync' ? 'validateSync' : 'validate'\n      ](\n        flattenObject(values),\n        Object.assign({ abortEarly: false }, schemaOptions, { context })\n      );\n\n      if (options.shouldUseNativeValidation)\n        validateFieldsNatively({}, options);\n\n      return {\n        values: resolverOptions.rawValues ? values : result,\n        errors: {},\n      };\n    } catch (e) {\n      if (!e.inner) {\n        throw e;\n      }\n\n      return {\n        values: {},\n        errors: parseErrorSchema(\n          e,\n          !options.shouldUseNativeValidation && options.criteriaMode === 'all'\n        ),\n        options,\n      };\n    }\n  };\n"],
+  "mappings": "AAAA,SAAS,8BAA8B;AAEvC,SAAS,oBAAoB;AAO7B,MAAM,mBAAmB,CACvB,OACA,6BACG;AACH,UAAQ,MAAM,SAAS,CAAC,GAAG;AAAA,IACzB,CAAC,UAAUA,WAAU;AACnB,MAAAA,OAAM,OAAOA,OAAM,MAAM,QAAQ,iBAAiB,KAAK;AAEvD,UAAI,CAAC,SAASA,OAAM,IAAK,GAAG;AAC1B,iBAASA,OAAM,IAAK,IAAI,EAAE,SAASA,OAAM,SAAS,MAAMA,OAAM,KAAM;AAAA,MACtE;AAEA,UAAI,0BAA0B;AAC5B,cAAM,QAAQ,SAASA,OAAM,IAAK,EAAE;AACpC,cAAM,WAAW,SAAS,MAAMA,OAAM,IAAK;AAE3C,iBAASA,OAAM,IAAK,IAAI;AAAA,UACtBA,OAAM;AAAA,UACN;AAAA,UACA;AAAA,UACAA,OAAM;AAAA,UACN,WACK,CAAC,EAAe,OAAO,UAAsBA,OAAM,OAAO,IAC3DA,OAAM;AAAA,QACZ;AAAA,MACF;AAEA,aAAO;AAAA,IACT;AAAA,IACA,CAAC;AAAA,EACH;AACF;AACA,SAAS,cAAc,KAAK;AAC1B,SACE,OAAO,QAAQ,YACf,QAAQ,QACR,OAAO,UAAU,SAAS,KAAK,GAAG,MAAM;AAE5C;AACA,SAAS,cAAc,KAAK,SAAS,IAAI;AACvC,SAAO,OAAO,KAAK,GAAG,EAAE,OAAO,CAAC,KAAK,QAAQ;AAC3C,UAAM,cAAc,SAAS,GAAG,MAAM,IAAI,GAAG,KAAK;AAElD,QAAI,cAAc,IAAI,GAAG,CAAC,GAAG;AAC3B,aAAO,OAAO,KAAK,cAAc,IAAI,GAAG,GAAG,WAAW,CAAC;AAAA,IACzD,OAAO;AACL,UAAI,WAAW,IAAI,IAAI,GAAG;AAAA,IAC5B;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,CAAC;AACP;AAEO,MAAM,cACX,CAAC,QAAa,gBAAqB,CAAC,GAAG,kBAAuB,CAAC,MAC/D,OAAO,QAAQ,SAAS,YAAY;AAClC,MAAI;AACF,QAAI,cAAc,WAAW,QAAQ,IAAI,aAAa,eAAe;AACnE,cAAQ;AAAA,QACN;AAAA,MACF;AAAA,IACF;AAEA,UAAM,SAAS,MAAM,OACnB,gBAAgB,SAAS,SAAS,iBAAiB,UACrD;AAAA,MACE,cAAc,MAAM;AAAA,MACpB,OAAO,OAAO,EAAE,YAAY,MAAM,GAAG,eAAe,EAAE,QAAQ,CAAC;AAAA,IACjE;AAEA,QAAI,QAAQ;AACV,6BAAuB,CAAC,GAAG,OAAO;AAEpC,WAAO;AAAA,MACL,QAAQ,gBAAgB,YAAY,SAAS;AAAA,MAC7C,QAAQ,CAAC;AAAA,IACX;AAAA,EACF,SAAS,GAAG;AACV,QAAI,CAAC,EAAE,OAAO;AACZ,YAAM;AAAA,IACR;AAEA,WAAO;AAAA,MACL,QAAQ,CAAC;AAAA,MACT,QAAQ;AAAA,QACN;AAAA,QACA,CAAC,QAAQ,6BAA6B,QAAQ,iBAAiB;AAAA,MACjE;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
   "names": ["error"]
 }

package/validators/index.d.ts

@@ -1,8 +1,8 @@
-import { MutableRefObject } from 'react';
-import { AnyObjectSchema } from 'yup';
-import Lazy from 'yup/lib/Lazy';
-import { FieldSpec } from '@digigov/form/types';
-import { ValidatorSchema } from '@digigov/form/validators/types';
+import type { MutableRefObject } from 'react';
+import type { AnyObjectSchema } from 'yup';
+import type Lazy from 'yup/lib/Lazy';
+import type { FieldSpec } from '@digigov/form/types';
+import type { ValidatorSchema } from '@digigov/form/validators/types';
 export declare const getYUPTypeMap: (validatorRegistry?: Record<string, any>) => Record<string, any>;
 export interface MutableRefObjectProps {
 }

package/validators/index.js

@@ -20,6 +20,7 @@ import {
   LATER_THAN_DATETIME_VALIDATOR,
   EARLIER_THAN_DATETIME_VALIDATOR
 } from "@digigov/form/validators/utils";
+import { EMAIL_VALIDATOR } from "@digigov/form/validators/utils/email";
 import { INT_VALIDATOR } from "@digigov/form/validators/utils/int";
 import { NUMBER_VALIDATOR } from "@digigov/form/validators/utils/number";
 const getYUPTypeMap = (validatorRegistry) => {
@@ -67,13 +68,15 @@ const getYUPTypeMap = (validatorRegistry) => {
           arrayValidator = arrayValidator.min(field.extra.min, {
             key: "form.error.array.min",
             context: {
-              min: field.extra.min
+              min: field.extra.min,
+              max: field.extra.max || void 0
             }
           });
         if (field.extra.max)
           arrayValidator = arrayValidator.max(field.extra.max, {
             key: "form.error.array.max",
             context: {
+              min: field.extra.min || void 0,
               max: field.extra.max
             }
           });
@@ -86,7 +89,7 @@ const getYUPTypeMap = (validatorRegistry) => {
     },
     number: () => yup.mixed().transform((_, val) => val !== "" ? Number(val) : void 0).test(NUMBER_VALIDATOR()),
     int: () => yup.mixed().transform((_, val) => val !== "" ? Number(val) : void 0).test(NUMBER_VALIDATOR()).test(INT_VALIDATOR()),
-    email: (field) => field.trim ? yup.string().trim().email("form.error.email") : yup.string().email("form.error.email"),
+    email: (field) => field.trim ? yup.string().trim().test(EMAIL_VALIDATOR) : yup.string().test(EMAIL_VALIDATOR),
     afm: (field) => field.trim ? yup.string().trim().test(AFM_VALIDATOR) : yup.string().test(AFM_VALIDATOR),
     amka: (field) => field.trim ? yup.string().trim().test(AMKA_VALIDATOR) : yup.string().test(AMKA_VALIDATOR),
     uuid4: (field) => field.trim ? yup.string().trim().test(UUID4_VALIDATOR) : yup.string().test(UUID4_VALIDATOR),
@@ -141,7 +144,7 @@ function useValidationSchema(fields, validatorRegistry) {
   return useMemo(() => {
     const yupTypeMap = getYUPTypeMap(validatorRegistry);
     return getYupObjectShape(fields, yupTypeMap, validatorRegistry);
-  }, []);
+  }, [fields, validatorRegistry]);
 }
 export {
   getYUPTypeMap,