@m4l/components 9.3.29 → 9.3.30-JA.beta-1

package/components/hook-form/RHFormContext/index.d.ts

@@ -1,120 +0,0 @@
-import { FieldValues } from 'react-hook-form';
-import { CustomFormArguments, FormProviderProps, RHFormProviderRef } from './types';
-/**
- * Hook personalizado que configura y gestiona un formulario usando React Hook Form con validación Yup.
- *
- * Este hook encapsula la lógica de inicialización del formulario, incluyendo la configuración del resolver de Yup,
- * valores por defecto, y la gestión de estados de carga para actualizar valores del formulario.
- * @param validationSchema - Esquema de validación de Yup que define las reglas de validación del formulario
- * @param values - Valores iniciales del formulario
- * @param statusLoad - Estado de carga que determina cuándo actualizar los valores del formulario
- * @param mode - Modo de validación del formulario (ej: 'onChange', 'onBlur', 'onSubmit')
- * @returns Objeto con todos los métodos y propiedades de React Hook Form
- * @example
- * ```tsx
- * const formMethods = useCustomForm({
- *   validationSchema: myValidationSchema,
- *   values: { name: '', email: '' },
- *   statusLoad: 'ready',
- *   mode: 'onChange'
- * });
- * ```
- */
-export declare function useCustomForm({ validationSchema, values, statusLoad, mode, }: CustomFormArguments): import('react-hook-form').UseFormReturn<FieldValues, any, FieldValues>;
-/**
- * Componente que proporciona el contexto de React Hook Form con funcionalidades adicionales.
- *
- * Este componente envuelve el `FormProvider` de React Hook Form y expone métodos del formulario
- * a través de una ref usando `useImperativeHandle`. Permite acceso programático a métodos
- * como submit, reset, setValue, etc.
- * @param props - Propiedades del componente que incluyen los métodos de React Hook Form
- * @param ref - Referencia que expone los métodos del formulario
- * @returns JSX del FormProvider con el formulario envuelto
- * @example
- * ```tsx
- * const formRef = useRef<RHFormProviderRef>(null);
- *
- * const handleReset = () => {
- *   formRef.current?.reset();
- * };
- *
- * return (
- *   <FormProviderCustom
- *     ref={formRef}
- *     onSubmit={handleSubmit}
- *     {...formMethods}
- *   >
- *     <input {...register('name')} />
- *   </FormProviderCustom>
- * );
- * ```
- */
-export declare const FormProviderCustom: import('react').ForwardRefExoticComponent<{
-    children: React.ReactNode | React.ReactNode[];
-} & import('react-hook-form').UseFormReturn<FieldValues, any, FieldValues> & FormProviderProps & import('react').RefAttributes<RHFormProviderRef>>;
-/**
- * Componente principal que gestiona el `Provider` de `react-hook-form` y encapsula el formulario para la creación de formularios personalizados.
- *
- * Este componente utiliza internamente `useForm` para inicializar todos los métodos necesarios para la manipulación del formulario,
- * incluyendo validación con Yup, gestión de estados de carga, y exposición de métodos a través de refs.
- *
- * **Características principales:**
- * - Integración completa con React Hook Form
- * - Validación automática usando esquemas de Yup
- * - Gestión de estados de carga para actualización de valores
- * - Exposición de métodos del formulario a través de refs
- * - Soporte para diferentes modos de validación
- *
- * Si necesitas acceso directo a los métodos de `useForm`, puedes utilizar el `Provider` y el hook por separado mediante
- * `FormProviderCustom` y `useCustomForm`, respectivamente.
- * @param props - Propiedades del componente
- * @param props.children - Elementos hijos del formulario
- * @param props.onSubmit - Función que se ejecuta al enviar el formulario
- * @param props.values - Valores iniciales del formulario
- * @param props.validationSchema - Esquema de validación de Yup
- * @param props.statusLoad - Estado de carga del formulario (opcional, por defecto 'ready')
- * @param props.className - Clases CSS adicionales (opcional)
- * @param props.mode - Modo de validación del formulario (opcional)
- * @param ref - Referencia que expone los métodos del formulario
- * @returns JSX del formulario con contexto de React Hook Form
- * @example
- * ```tsx
- * import { useRef } from 'react';
- * import { RHFormProvider, RHFormProviderRef } from './RHFormContext';
- * import * as yup from 'yup';
- *
- * const schema = yup.object({
- *   name: yup.string().required('El nombre es requerido'),
- *   email: yup.string().email('Email inválido').required('El email es requerido')
- * });
- *
- * const MyForm = () => {
- *   const formRef = useRef<RHFormProviderRef>(null);
- *
- *   const handleSubmit = (data: any) => {
- *     console.log('Datos del formulario:', data);
- *   };
- *
- *   const handleReset = () => {
- *     formRef.current?.reset();
- *   };
- *
- *   return (
- *     <RHFormProvider
- *       ref={formRef}
- *       onSubmit={handleSubmit}
- *       values={{ name: '', email: '' }}
- *       validationSchema={schema}
- *       statusLoad="ready"
- *       mode="onChange"
- *     >
- *       <input {...register('name')} placeholder="Nombre" />
- *       <input {...register('email')} placeholder="Email" />
- *       <button type="submit">Enviar</button>
- *       <button type="button" onClick={handleReset}>Resetear</button>
- *     </RHFormProvider>
- *   );
- * };
- * ```
- */
-export declare const RHFormProvider: import('react').ForwardRefExoticComponent<FormProviderProps & import('react').RefAttributes<RHFormProviderRef>>;

package/components/hook-form/RHFormContext/index.js

@@ -1,91 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef, useImperativeHandle, useEffect } from "react";
-import clsx from "clsx";
-import { FormProvider, useForm } from "react-hook-form";
-import { yupResolver } from "@hookform/resolvers/yup";
-import { F as FormProviderRoot } from "./styles.js";
-import { R as RHFormProviderUtilityClasses } from "./classes/index.js";
-const classes = RHFormProviderUtilityClasses();
-function useCustomForm({
-  validationSchema,
-  values,
-  statusLoad,
-  mode
-}) {
-  const formMethods = useForm({
-    resolver: yupResolver(validationSchema),
-    defaultValues: values,
-    ...mode && { mode }
-  });
-  useEffect(() => {
-    if (statusLoad === "reload_values_provider") {
-      const keys = Object.keys(values);
-      keys.forEach((key) => {
-        formMethods.setValue(key, values[key], {
-          shouldValidate: false,
-          shouldDirty: false,
-          shouldTouch: false
-        });
-      });
-      formMethods.clearErrors();
-      return;
-    }
-  }, [formMethods, statusLoad, values]);
-  useEffect(() => {
-    if (statusLoad === "ready") {
-      formMethods.setValue("statusLoad", "ready", {
-        shouldValidate: false,
-        shouldDirty: false,
-        shouldTouch: false
-      });
-    }
-  }, [statusLoad]);
-  return formMethods;
-}
-const FormProviderCustom = forwardRef((props, ref) => {
-  const { children, onSubmit, className, handleSubmit, ...formMethods } = props;
-  useImperativeHandle(ref, () => ({
-    formMethods: { ...formMethods, handleSubmit },
-    submit: () => handleSubmit(onSubmit)(),
-    reset: formMethods.reset,
-    clearErrors: formMethods.clearErrors,
-    setValue: formMethods.setValue,
-    getValues: formMethods.getValues,
-    trigger: formMethods.trigger,
-    watch: formMethods.watch,
-    setError: formMethods.setError,
-    unregister: formMethods.unregister
-  }), [formMethods, handleSubmit, onSubmit]);
-  return /* @__PURE__ */ jsx(FormProvider, { ...props, children: /* @__PURE__ */ jsx(
-    FormProviderRoot,
-    {
-      className: clsx(classes.root, className),
-      onSubmit: handleSubmit(onSubmit),
-      children
-    }
-  ) });
-});
-FormProviderCustom.displayName = "FormProviderCustom";
-const RHFormProvider = forwardRef((props, ref) => {
-  const { children, onSubmit, values, validationSchema, statusLoad = "ready", className, mode } = props;
-  const formMethods = useCustomForm({ validationSchema, statusLoad, values, mode });
-  return /* @__PURE__ */ jsx(
-    FormProviderCustom,
-    {
-      ref,
-      className,
-      values,
-      validationSchema,
-      statusLoad,
-      onSubmit,
-      ...formMethods,
-      children
-    }
-  );
-});
-RHFormProvider.displayName = "RHFormProvider";
-export {
-  FormProviderCustom as F,
-  RHFormProvider as R,
-  useCustomForm as u
-};

package/components/hook-form/RHFormContext/types.d.ts

@@ -1,83 +0,0 @@
-import { ReactNode } from 'react';
-import { FieldValues, FormProviderProps as RHFormProviderProps, Mode, UseFormReturn } from 'react-hook-form';
-/**
- * Estados de carga del formulario que determinan cuándo y cómo actualizar los valores.
- *
- * - `initial`: Estado inicial del formulario
- * - `new`: Formulario para crear un nuevo elemento
- * - `edit`: Formulario para editar un elemento existente
- * - `reload_values_provider`: Estado que indica que se deben recargar los valores del proveedor
- * - `ready`: Formulario listo para ser usado
- * - `error`: Estado de error en el formulario
- */
-export type FormStatusLoad = 'initial' | 'new' | 'edit' | 'reload_values_provider' | 'ready' | 'error';
-/**
- * Tipo que define los valores iniciales del formulario.
- * Extiende FieldValues de React Hook Form para mayor flexibilidad.
- */
-export type FormInitialValues = FieldValues;
-/**
- * Propiedades del componente principal RHFormProvider.
- * Define la interfaz para crear formularios con React Hook Form y validación Yup.
- */
-export interface FormProviderProps {
-    /** Elementos hijos del formulario */
-    children: ReactNode;
-    /** Función que se ejecuta al enviar el formulario con los datos validados */
-    onSubmit: (data: FieldValues) => void;
-    /** Valores iniciales del formulario */
-    values: FormInitialValues;
-    /** Esquema de validación de Yup */
-    validationSchema: any;
-    /** Estado de carga del formulario (opcional, por defecto 'ready') */
-    statusLoad?: FormStatusLoad;
-    /** Clases CSS adicionales (opcional) */
-    className?: string;
-    /** Modo de validación del formulario (opcional) */
-    mode?: Mode;
-}
-/**
- * Propiedades del componente FormProviderCustom.
- * Combina las propiedades de React Hook Form con las propiedades personalizadas del formulario.
- */
-export type FormProviderCustomProps = RHFormProviderProps & FormProviderProps;
-/**
- * Argumentos para el hook useCustomForm.
- * Define los parámetros necesarios para configurar un formulario personalizado.
- */
-export interface CustomFormArguments {
-    /** Valores iniciales del formulario */
-    values: FormInitialValues;
-    /** Esquema de validación de Yup */
-    validationSchema: any;
-    /** Estado de carga del formulario (opcional) */
-    statusLoad?: FormStatusLoad;
-    /** Modo de validación del formulario (opcional) */
-    mode?: Mode;
-}
-/**
- * Interfaz que define los métodos expuestos a través de la ref del RHFormProvider.
- * Permite acceso programático a los métodos de React Hook Form desde componentes padre.
- */
-export interface RHFormProviderRef {
-    /** Objeto completo con todos los métodos de React Hook Form */
-    formMethods: UseFormReturn<FieldValues>;
-    /** Ejecuta el submit del formulario */
-    submit: () => void;
-    /** Resetea el formulario a sus valores iniciales */
-    reset: () => void;
-    /** Limpia todos los errores del formulario */
-    clearErrors: () => void;
-    /** Establece un valor en un campo específico del formulario */
-    setValue: (name: string, value: any, options?: any) => void;
-    /** Obtiene los valores actuales del formulario o de campos específicos */
-    getValues: (payload?: string | string[]) => any;
-    /** Dispara la validación de campos específicos o de todo el formulario */
-    trigger: (name?: string | string[]) => Promise<boolean>;
-    /** Observa cambios en campos específicos o en todo el formulario */
-    watch: (name?: string | string[]) => any;
-    /** Establece un error en un campo específico */
-    setError: (name: string, error: any) => void;
-    /** Desregistra campos del formulario */
-    unregister: (name: string | string[]) => void;
-}

package/hooks/useFormReadyForUpdate/types.d.ts

@@ -1,8 +0,0 @@
-import { FieldValues } from 'react-hook-form';
-import { FormInitialValues } from '../../components/hook-form/RHFormContext/types';
-export interface UseFormReadyForUpdateProps {
-    statusLoad?: number;
-    endPoint: string;
-    initialValues: FormInitialValues;
-    formatDataEnpoint?: (data: FieldValues) => FormInitialValues;
-}